@xsolla/xui-context-menu 0.128.0 → 0.130.0

package/native/index.mjs

@@ -55,6 +55,10 @@ var Box = ({
   left,
   right,
   width,
+  minWidth,
+  minHeight,
+  maxWidth,
+  maxHeight,
   flex,
   overflow,
   zIndex,
@@ -86,6 +90,10 @@ var Box = ({
     zIndex,
     height,
     width,
+    minWidth,
+    minHeight,
+    maxWidth,
+    maxHeight,
     padding,
     paddingHorizontal,
     paddingVertical,
@@ -217,7 +225,7 @@ var Text = ({
   }
   const incomingStyle = StyleSheet.flatten(styleProp);
   const baseStyle = {
-    color,
+    color: color ?? incomingStyle?.color,
     fontSize: typeof fontSize === "number" ? fontSize : void 0,
     fontWeight,
     fontFamily: resolvedFontFamily,
@@ -392,7 +400,7 @@ var InputPrimitive = forwardRef(
 InputPrimitive.displayName = "InputPrimitive";
 
 // src/ContextMenu.tsx
-import { useDesignSystem as useDesignSystem7 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme7 } from "@xsolla/xui-core";
 import { Spinner } from "@xsolla/xui-spinner";
 
 // src/ContextMenuContext.tsx
@@ -414,7 +422,7 @@ var useContextMenuRequired = () => {
 
 // src/ContextMenuItem.tsx
 import { forwardRef as forwardRef2, useEffect, useRef } from "react";
-import { useDesignSystem } from "@xsolla/xui-core";
+import { useResolvedTheme } from "@xsolla/xui-core";
 import { ArrowRight } from "@xsolla/xui-icons";
 import { jsx as jsx5, jsxs } from "react/jsx-runtime";
 var ContextMenuItem = forwardRef2(
@@ -430,9 +438,11 @@ var ContextMenuItem = forwardRef2(
     size: propSize,
     hasSubmenu,
     onPress,
-    "data-testid": testId = "context-menu-item"
+    "data-testid": testId = "context-menu-item",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem();
+    const { theme } = useResolvedTheme({ themeMode, themeProductContext });
     const context = useContextMenu();
     const size = propSize || context?.size || "md";
     const sizeStyles = theme.sizing.contextMenu(size);
@@ -578,7 +588,7 @@ ContextMenuItem.displayName = "ContextMenuItem";
 
 // src/ContextMenuCheckboxItem.tsx
 import { forwardRef as forwardRef3, useEffect as useEffect2, useRef as useRef2 } from "react";
-import { useDesignSystem as useDesignSystem2 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme2 } from "@xsolla/xui-core";
 import { Check, Minus } from "@xsolla/xui-icons";
 import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
 var checkboxSizeMap = {
@@ -597,9 +607,11 @@ var CheckboxIndicator = ({
   checked,
   indeterminate,
   size,
-  disabled
+  disabled,
+  themeMode,
+  themeProductContext
 }) => {
-  const { theme } = useDesignSystem2();
+  const { theme } = useResolvedTheme2({ themeMode, themeProductContext });
   const brandColors = theme.colors.control.brand.primary;
   const faintColors = theme.colors.control.faint;
   const contentColors = theme.colors.content;
@@ -662,9 +674,11 @@ var ContextMenuCheckboxItem = forwardRef3(
     size: propSize,
     onCheckedChange,
     onPress,
-    "data-testid": testId = "context-menu-checkbox-item"
+    "data-testid": testId = "context-menu-checkbox-item",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem2();
+    const { theme } = useResolvedTheme2({ themeMode, themeProductContext });
     const context = useContextMenu();
     const size = propSize || context?.size || "md";
     const sizeStyles = theme.sizing.contextMenu(size);
@@ -744,7 +758,9 @@ var ContextMenuCheckboxItem = forwardRef3(
                   checked,
                   indeterminate,
                   size,
-                  disabled
+                  disabled,
+                  themeMode,
+                  themeProductContext
                 }
               )
             }
@@ -798,7 +814,7 @@ ContextMenuRadioGroup.displayName = "ContextMenuRadioGroup";
 
 // src/ContextMenuRadioItem.tsx
 import { forwardRef as forwardRef5, useEffect as useEffect3, useRef as useRef3 } from "react";
-import { useDesignSystem as useDesignSystem3 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme3 } from "@xsolla/xui-core";
 import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
 var radioSizeMap = {
   sm: 14,
@@ -815,9 +831,11 @@ var radioDotSizeMap = {
 var RadioIndicator = ({
   checked,
   size,
-  disabled
+  disabled,
+  themeMode,
+  themeProductContext
 }) => {
-  const { theme } = useDesignSystem3();
+  const { theme } = useResolvedTheme3({ themeMode, themeProductContext });
   const brandColors = theme.colors.control.brand.primary;
   const faintColors = theme.colors.control.faint;
   const contentColors = theme.colors.content;
@@ -869,9 +887,11 @@ var ContextMenuRadioItem = forwardRef5(
     disabled,
     size: propSize,
     onPress,
-    "data-testid": testId = "context-menu-radio-item"
+    "data-testid": testId = "context-menu-radio-item",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem3();
+    const { theme } = useResolvedTheme3({ themeMode, themeProductContext });
     const context = useContextMenu();
     const radioGroup = useRadioGroup();
     const size = propSize || context?.size || "md";
@@ -946,7 +966,16 @@ var ContextMenuRadioItem = forwardRef5(
               marginTop: description ? 2 : 0,
               alignItems: "center",
               justifyContent: "center",
-              children: /* @__PURE__ */ jsx8(RadioIndicator, { checked, size, disabled })
+              children: /* @__PURE__ */ jsx8(
+                RadioIndicator,
+                {
+                  checked,
+                  size,
+                  disabled,
+                  themeMode,
+                  themeProductContext
+                }
+              )
             }
           ),
           /* @__PURE__ */ jsxs3(Box, { flex: 1, flexDirection: "column", gap: 2, children: [
@@ -979,7 +1008,7 @@ ContextMenuRadioItem.displayName = "ContextMenuRadioItem";
 
 // src/ContextMenuGroup.tsx
 import { forwardRef as forwardRef6 } from "react";
-import { useDesignSystem as useDesignSystem4 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme4 } from "@xsolla/xui-core";
 import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 var ContextMenuGroup = forwardRef6(
   ({
@@ -987,9 +1016,11 @@ var ContextMenuGroup = forwardRef6(
     description,
     children,
     size: propSize,
-    "data-testid": testId = "context-menu-group"
+    "data-testid": testId = "context-menu-group",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem4();
+    const { theme } = useResolvedTheme4({ themeMode, themeProductContext });
     const context = useContextMenu();
     const size = propSize || context?.size || "md";
     const sizeStyles = theme.sizing.contextMenu(size);
@@ -1029,13 +1060,15 @@ var ContextMenuGroup = forwardRef6(
 ContextMenuGroup.displayName = "ContextMenuGroup";
 
 // src/ContextMenuSeparator.tsx
-import { useDesignSystem as useDesignSystem5 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme5 } from "@xsolla/xui-core";
 import { jsx as jsx10 } from "react/jsx-runtime";
 var ContextMenuSeparator = ({
   size: propSize,
-  "data-testid": testId = "context-menu-separator"
+  "data-testid": testId = "context-menu-separator",
+  themeMode,
+  themeProductContext
 }) => {
-  const { theme } = useDesignSystem5();
+  const { theme } = useResolvedTheme5({ themeMode, themeProductContext });
   const context = useContextMenu();
   const size = propSize || context?.size || "md";
   const sizeStyles = theme.sizing.contextMenu(size);
@@ -1055,7 +1088,7 @@ ContextMenuSeparator.displayName = "ContextMenuSeparator";
 
 // src/ContextMenuSearch.tsx
 import React6, { forwardRef as forwardRef7, useRef as useRef4, useEffect as useEffect4 } from "react";
-import { useDesignSystem as useDesignSystem6 } from "@xsolla/xui-core";
+import { useResolvedTheme as useResolvedTheme6 } from "@xsolla/xui-core";
 
 // ../icons-base/dist/web/index.mjs
 import styled from "styled-components";
@@ -1503,9 +1536,11 @@ var ContextMenuSearch = forwardRef7(
     placeholder = "Search",
     autoFocus = true,
     size: propSize,
-    "data-testid": testId = "context-menu-search"
+    "data-testid": testId = "context-menu-search",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem6();
+    const { theme } = useResolvedTheme6({ themeMode, themeProductContext });
     const context = useContextMenu();
     const size = propSize || context?.size || "md";
     const sizeStyles = theme.sizing.contextMenu(size);
@@ -1597,9 +1632,11 @@ var ContextMenuRoot = forwardRef8(
     closeOnSelect = true,
     isLoading,
     "aria-label": ariaLabel,
-    "data-testid": testId = "context-menu"
+    "data-testid": testId = "context-menu",
+    themeMode,
+    themeProductContext
   }, ref) => {
-    const { theme } = useDesignSystem7();
+    const { theme } = useResolvedTheme7({ themeMode, themeProductContext });
     const [internalIsOpen, setInternalIsOpen] = useState(false);
     const [activeIndex, setActiveIndex] = useState(-1);
     const containerRef = useRef5(null);