@idealyst/components 1.2.122 → 1.2.123

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idealyst/components",
-  "version": "1.2.122",
+  "version": "1.2.123",
   "description": "Shared component library for React and React Native",
   "documentation": "https://github.com/IdealystIO/idealyst-framework/tree/main/packages/components#readme",
   "readme": "README.md",
@@ -56,7 +56,7 @@
     "publish:npm": "npm publish"
   },
   "peerDependencies": {
-    "@idealyst/theme": "^1.2.122",
+    "@idealyst/theme": "^1.2.123",
     "@mdi/js": ">=7.0.0",
     "@mdi/react": ">=1.0.0",
     "@react-native-vector-icons/common": ">=12.0.0",
@@ -111,8 +111,8 @@
   },
   "devDependencies": {
     "@idealyst/blur": "^1.2.40",
-    "@idealyst/theme": "^1.2.122",
-    "@idealyst/tooling": "^1.2.122",
+    "@idealyst/theme": "^1.2.123",
+    "@idealyst/tooling": "^1.2.123",
     "@mdi/react": "^1.6.1",
     "@types/react": "^19.1.0",
     "react": "^19.1.0",

package/src/Menu/Menu.styles.tsx

@@ -155,6 +155,14 @@ export const menuStyles = defineStyle('Menu', (theme: Theme) => ({
                 height: theme.sizes.$menu.iconSize,
                 fontSize: theme.sizes.$menu.iconSize,
             },
+            intent: {
+                neutral: {},
+                primary: { color: theme.intents.primary.primary },
+                success: { color: theme.intents.success.primary },
+                danger: { color: theme.intents.danger.primary },
+                warning: { color: theme.intents.warning.primary },
+                info: { color: theme.intents.info.primary },
+            },
         },
     }),
 
@@ -165,6 +173,14 @@ export const menuStyles = defineStyle('Menu', (theme: Theme) => ({
             size: {
                 fontSize: theme.sizes.$menu.labelFontSize,
             },
+            intent: {
+                neutral: {},
+                primary: { color: theme.intents.primary.primary },
+                success: { color: theme.intents.success.primary },
+                danger: { color: theme.intents.danger.primary },
+                warning: { color: theme.intents.warning.primary },
+                info: { color: theme.intents.info.primary },
+            },
         },
     }),
 }));

package/src/Menu/MenuItem.native.tsx

@@ -20,9 +20,10 @@ const MenuItem = forwardRef<IdealystElement, MenuItemProps>(({ item, onPress, si
   });
 
   // Call styles as functions to get theme-reactive styles
-  const itemStyle = (menuItemStyles.item as any)({ intent: item.intent || 'neutral' });
-  const iconStyle = (menuItemStyles.icon as any)({});
-  const labelStyle = (menuItemStyles.label as any)({});
+  const intent = item.intent || 'neutral';
+  const itemStyle = (menuItemStyles.item as any)({ intent });
+  const iconStyle = (menuItemStyles.icon as any)({ intent });
+  const labelStyle = (menuItemStyles.label as any)({ intent });
 
   // Extract icon size from theme variant (fontSize is set by $menu.iconSize)
   const iconSize = iconStyle.fontSize || iconStyle.width || 20;

package/src/Menu/MenuItem.styles.tsx

@@ -118,6 +118,14 @@ export const menuItemStyles = defineStyle('MenuItem', (theme: Theme) => ({
                 height: theme.sizes.$menu.iconSize,
                 fontSize: theme.sizes.$menu.iconSize,
             },
+            intent: {
+                neutral: {},
+                primary: { color: theme.intents.primary.primary },
+                success: { color: theme.intents.success.primary },
+                danger: { color: theme.intents.danger.primary },
+                warning: { color: theme.intents.warning.primary },
+                info: { color: theme.intents.info.primary },
+            },
         },
         _web: {
             display: 'flex',
@@ -131,6 +139,14 @@ export const menuItemStyles = defineStyle('MenuItem', (theme: Theme) => ({
             size: {
                 fontSize: theme.sizes.$menu.labelFontSize,
             },
+            intent: {
+                neutral: {},
+                primary: { color: theme.intents.primary.primary },
+                success: { color: theme.intents.success.primary },
+                danger: { color: theme.intents.danger.primary },
+                warning: { color: theme.intents.warning.primary },
+                info: { color: theme.intents.info.primary },
+            },
         },
     }),
 }));

package/src/Menu/MenuItem.web.tsx

@@ -22,9 +22,10 @@ const MenuItem = forwardRef<IdealystElement, MenuItemProps>(({ item, onPress, si
   });
 
   // Compute dynamic styles - call as functions for theme reactivity
-  const itemStyle = (menuItemStyles.item as any)({ intent: item.intent || 'neutral' });
-  const iconStyle = (menuItemStyles.icon as any)({});
-  const labelStyle = (menuItemStyles.label as any)({});
+  const intent = item.intent || 'neutral';
+  const itemStyle = (menuItemStyles.item as any)({ intent });
+  const iconStyle = (menuItemStyles.icon as any)({ intent });
+  const labelStyle = (menuItemStyles.label as any)({ intent });
 
   const itemProps = getWebProps([itemStyle]);
   const iconProps = getWebProps([iconStyle]);

package/src/TabBar/TabBar.styles.tsx

@@ -127,7 +127,9 @@ export const tabBarStyles = defineStyle('TabBar', (theme: Theme) => ({
             variants: {
                 size: {
                     fontSize: theme.sizes.$tabBar.fontSize,
-                    padding: theme.sizes.$tabBar.padding,
+                    paddingHorizontal: theme.sizes.$tabBar.padding,
+                    paddingTop: theme.sizes.$tabBar.padding,
+                    paddingBottom: theme.sizes.$tabBar.paddingBottom,
                     lineHeight: theme.sizes.$tabBar.lineHeight,
                 },
             },