@particle-network/ui-react 0.4.0-beta.23 → 0.4.0-beta.24

package/dist/components/UXButton/button-theme.js

@@ -33,10 +33,10 @@ const button_theme_button = tv({
             text: 'bg-transparent min-w-0 w-auto h-auto px-0'
         },
         size: {
-            xs: 'gap-2 rounded-[6px] !text-body3 min-w-min font-medium [&_[aria-label="Loading"]>div]:size-3',
-            sm: 'gap-2 rounded-[6px] !text-body3 min-w-min font-medium [&_[aria-label="Loading"]>div]:size-3',
-            md: 'gap-2 rounded-[6px] text-tiny min-w-min font-medium [&_[aria-label="Loading"]>div]:size-4',
-            lg: 'gap-2 rounded-[10px] text-medium min-w-min font-medium [&_[aria-label="Loading"]>div]:size-6',
+            xs: 'gap-1 rounded-[4px] !text-caption1 min-w-min font-medium [&>svg]:size-3.5',
+            sm: 'gap-1 rounded-[6px] !text-body3 min-w-min font-medium [&>svg]:size-4',
+            md: 'gap-1 rounded-[6px] text-tiny min-w-min font-medium [&>svg]:size-4',
+            lg: 'gap-1 rounded-[10px] text-medium min-w-min font-medium [&>svg]:size-6',
             auto: 'min-w-min rounded-[10px]'
         },
         color: {
@@ -97,7 +97,7 @@ const button_theme_button = tv({
                 'light',
                 'bordered'
             ],
-            class: 'px-sm h-5'
+            class: 'px-md h-5'
         },
         {
             size: 'sm',
@@ -107,7 +107,7 @@ const button_theme_button = tv({
                 'light',
                 'bordered'
             ],
-            class: 'px-sm h-6'
+            class: 'px-lg h-6'
         },
         {
             size: 'md',
@@ -117,7 +117,7 @@ const button_theme_button = tv({
                 'light',
                 'bordered'
             ],
-            class: 'px-md h-[30px]'
+            class: 'px-lg h-[30px]'
         },
         {
             size: 'lg',
@@ -178,64 +178,56 @@ const button_theme_button = tv({
             variant: 'light',
             color: 'default',
             class: [
-                colorVariants.light["default"],
-                'data-[hover=true]:bg-default/40'
+                colorVariants.light["default"]
             ]
         },
         {
             variant: 'light',
             color: 'primary',
             class: [
-                colorVariants.light.primary,
-                'data-[hover=true]:bg-primary/20'
+                colorVariants.light.primary
             ]
         },
         {
             variant: 'light',
             color: 'secondary',
             class: [
-                colorVariants.light.secondary,
-                'data-[hover=true]:bg-default/40'
+                colorVariants.light.secondary
             ]
         },
         {
             variant: 'light',
             color: 'success',
             class: [
-                colorVariants.light.success,
-                'data-[hover=true]:bg-success/20'
+                colorVariants.light.success
             ]
         },
         {
             variant: 'light',
             color: 'warning',
             class: [
-                colorVariants.light.warning,
-                'data-[hover=true]:bg-warning/20'
+                colorVariants.light.warning
             ]
         },
         {
             variant: 'light',
             color: 'danger',
             class: [
-                colorVariants.light.danger,
-                'data-[hover=true]:bg-danger/20'
+                colorVariants.light.danger
             ]
         },
         {
             variant: 'light',
             color: 'bullish',
             class: [
-                colorVariants.light.bullish,
-                'data-[hover=true]:bg-bullish/20'
+                colorVariants.light.bullish
             ]
         },
         {
             variant: 'light',
             color: 'bearish',
             class: [
-                colorVariants.light.bearish,
-                'data-[hover=true]:bg-bearish/20'
+                colorVariants.light.bearish
             ]
         },
         {

package/dist/components/UXButton/use-button.js

@@ -101,8 +101,9 @@ function useButton(props) {
     const endContent = getIconClone(endContentProp);
     const spinnerSize = useMemo(()=>{
         const buttonSpinnerSizeMap = {
-            sm: 14,
-            md: 18,
+            xs: 14,
+            sm: 16,
+            md: 16,
             lg: 24
         };
         return buttonSpinnerSizeMap[size];

package/dist/components/UXCheckbox/checkbox.extend.js

@@ -30,7 +30,7 @@ const ExtendedCheckbox = extendVariants(Checkbox, {
                 wrapper: [
                     'w-3.5 h-3.5 me-0',
                     'rounded-[calc(theme(borderRadius.medium)*0.2)]',
-                    'before:rounded-[calc(theme(borderRadius.medium)*0.2)] before:border-secondary before:border-1.5',
+                    'before:rounded-[calc(theme(borderRadius.medium)*0.2)] before:border-secondary before:border-1',
                     'after:rounded-[calc(theme(borderRadius.medium)*0.2)]'
                 ],
                 label: '!text-body3 font-medium',
@@ -40,7 +40,7 @@ const ExtendedCheckbox = extendVariants(Checkbox, {
                 wrapper: [
                     'w-4 h-4 me-0',
                     'rounded-[calc(theme(borderRadius.medium)*0.2)]',
-                    'before:rounded-[calc(theme(borderRadius.medium)*0.2)] before:border-secondary before:border-2',
+                    'before:rounded-[calc(theme(borderRadius.medium)*0.2)] before:border-secondary before:border-1.5',
                     'after:rounded-[calc(theme(borderRadius.medium)*0.2)]'
                 ],
                 label: '!text-body2 font-medium',
@@ -50,7 +50,7 @@ const ExtendedCheckbox = extendVariants(Checkbox, {
                 wrapper: [
                     'w-[18px] h-[18px] me-0',
                     'rounded-[calc(theme(borderRadius.medium)*0.3)]',
-                    'before:rounded-[calc(theme(borderRadius.medium)*0.3)] before:border-secondary before:border-2',
+                    'before:rounded-[calc(theme(borderRadius.medium)*0.3)] before:border-secondary before:border-1.5',
                     'after:rounded-[calc(theme(borderRadius.medium)*0.3)]'
                 ],
                 label: '!text-body1 font-medium',

package/dist/components/UXEmpty/index.d.ts

@@ -4,5 +4,6 @@ import { type VStackProps } from '../layout';
 export interface UXEmptyProps extends VStackProps {
     iconProps?: IconProps;
     text?: React.ReactNode;
+    action?: React.ReactNode;
 }
 export declare const UXEmpty: import("@heroui/system-rsc").InternalForwardRefRenderFunction<"div", UXEmptyProps, never>;

package/dist/components/UXEmpty/index.js

@@ -8,7 +8,7 @@ import { VStack } from "../layout/index.js";
 import { Text } from "../typography/Text.js";
 const UXEmpty = forwardRef((props, ref)=>{
     const i18n = useI18n();
-    const { text = i18n.table.emptyContent, iconProps, className, ...restProps } = props;
+    const { text = i18n.table.emptyContent, iconProps, className, action, ...restProps } = props;
     return /*#__PURE__*/ jsxs(VStack, {
         ref: ref,
         center: true,
@@ -26,6 +26,10 @@ const UXEmpty = forwardRef((props, ref)=>{
                 color: "secondary",
                 fontWeight: "normal",
                 children: text
+            }),
+            action && /*#__PURE__*/ jsx("div", {
+                className: "mt-lg",
+                children: action
             })
         ]
     });

package/dist/utils/variants.js

@@ -1,7 +1,7 @@
 const solid = {
     default: 'bg-background-200 text-foreground',
     primary: 'bg-primary text-primary-foreground',
-    secondary: 'bg-background-200 text-foreground-300',
+    secondary: 'bg-background-200 text-secondary',
     success: 'bg-success text-success-foreground',
     warning: 'bg-warning text-warning-foreground',
     danger: 'bg-danger text-danger-foreground',
@@ -22,9 +22,9 @@ const shadow = {
     bearish: 'shadow-lg shadow-bearish/40 bg-bearish text-foreground'
 };
 const bordered = {
-    default: 'bg-transparent border-foreground-100 text-foreground',
+    default: 'bg-transparent border-foreground text-foreground',
     primary: 'bg-transparent border-primary text-primary',
-    secondary: 'bg-transparent border-foreground-100 text-foreground-300',
+    secondary: 'bg-transparent border-secondary text-secondary',
     success: 'bg-transparent border-success text-success',
     warning: 'bg-transparent border-warning text-warning',
     danger: 'bg-transparent border-danger text-danger',
@@ -33,9 +33,9 @@ const bordered = {
     bearish: 'bg-transparent border-bearish text-bearish'
 };
 const flat = {
-    default: 'bg-background-300 text-default-foreground',
+    default: 'bg-background-300 text-foreground',
     primary: 'bg-primary/20 text-primary',
-    secondary: 'bg-background-300 text-foreground-300',
+    secondary: 'bg-background-300 text-secondary',
     success: 'bg-success/20 text-success',
     warning: 'bg-warning/20 text-warning',
     danger: 'bg-danger/20 text-danger',
@@ -55,15 +55,15 @@ const faded = {
     bearish: 'border-bearish bg-bearish text-foreground'
 };
 const light = {
-    default: 'bg-transparent text-default-foreground',
-    primary: 'bg-transparent text-primary',
-    secondary: 'bg-transparent text-foreground-300',
-    success: 'bg-transparent text-success',
-    warning: 'bg-transparent text-warning',
-    danger: 'bg-transparent text-danger',
-    foreground: 'bg-transparent text-foreground',
-    bullish: 'bg-transparent text-bullish',
-    bearish: 'bg-transparent text-bearish'
+    default: 'bg-transparent text-foreground data-[hover=true]:bg-background-200/50',
+    primary: 'bg-transparent text-primary data-[hover=true]:bg-primary/20',
+    secondary: 'bg-transparent text-secondary data-[hover=true]:bg-background-200/50',
+    success: 'bg-transparent text-success data-[hover=true]:bg-success/20',
+    warning: 'bg-transparent text-warning data-[hover=true]:bg-warning/20',
+    danger: 'bg-transparent text-danger data-[hover=true]:bg-danger/20',
+    foreground: 'bg-transparent text-foreground data-[hover=true]:bg-foreground/20',
+    bullish: 'bg-transparent text-bullish data-[hover=true]:bg-bullish/20',
+    bearish: 'bg-transparent text-bearish data-[hover=true]:bg-bearish/20'
 };
 const ghost = {
     default: 'border-default text-default-foreground',
@@ -77,9 +77,9 @@ const ghost = {
     bearish: 'border-bearish text-foreground hover:!bg-bearish'
 };
 const variants_text = {
-    default: 'bg-transparent text-default-foreground',
+    default: 'bg-transparent text-foreground',
     primary: 'bg-transparent text-primary',
-    secondary: 'bg-transparent text-foreground-300',
+    secondary: 'bg-transparent text-secondary',
     success: 'bg-transparent text-success',
     warning: 'bg-transparent text-warning',
     danger: 'bg-transparent text-danger',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-network/ui-react",
-  "version": "0.4.0-beta.23",
+  "version": "0.4.0-beta.24",
   "type": "module",
   "exports": {
     ".": {
@@ -38,8 +38,8 @@
     "@rslib/core": "^0.12.3",
     "@types/react": "^19.1.10",
     "react": "^19.1.0",
-    "@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",
@@ -49,8 +49,8 @@
     "ahooks": "^3.9.4",
     "copy-to-clipboard": "^3.3.3",
     "zustand": "^5.0.8",
-    "@particle-network/icons": "0.4.0-beta.14",
-    "@particle-network/ui-shared": "0.3.0-beta.6"
+    "@particle-network/ui-shared": "0.3.0-beta.6",
+    "@particle-network/icons": "0.4.0-beta.14"
   },
   "scripts": {
     "build": "rslib build",