@xsolla/xui-multi-select 0.201.4 → 0.202.0

package/native/index.js

@@ -122,6 +122,7 @@ var Box = ({
   flexShrink,
   gap,
   overflow,
+  opacity,
   zIndex,
   hoverStyle,
   pressStyle,
@@ -149,6 +150,7 @@ var Box = ({
     borderRadius,
     borderStyle,
     overflow,
+    opacity: opacity ?? (disabled ? 0.5 : void 0),
     zIndex,
     height,
     width,
@@ -507,6 +509,7 @@ var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
   "strokeWidth",
   // CSS properties that pass isPropValid but are used as component props
   "overflow",
+  "opacity",
   "cursor",
   "fontSize",
   "fontWeight",
@@ -601,6 +604,7 @@ var ADDITIONAL_BLOCKED_PROPS2 = /* @__PURE__ */ new Set([
   "strokeWidth",
   // CSS properties that pass isPropValid but are used as component props
   "overflow",
+  "opacity",
   "cursor",
   "fontSize",
   "fontWeight",
@@ -707,11 +711,14 @@ var StyledBox = (0, import_styled_components2.default)(FilteredDiv2)`
   flex-shrink: ${(props) => props.flexShrink ?? 1};
   gap: ${(props) => typeof props.gap === "number" ? `${props.gap}px` : props.gap || 0};
   align-self: ${(props) => props.alignSelf || "auto"};
+  /* Only emit overflow-x/y when explicitly set. Defaulting them to
+     visible after overflow would override the shorthand and break
+     clipping (e.g. OtherCard bottom-right promo image). */
   overflow: ${(props) => props.overflow || "visible"};
-  overflow-x: ${(props) => props.overflowX || "visible"};
-  overflow-y: ${(props) => props.overflowY || "visible"};
+  ${(props) => props.overflowX != null ? `overflow-x: ${props.overflowX};` : ""}
+  ${(props) => props.overflowY != null ? `overflow-y: ${props.overflowY};` : ""}
   z-index: ${(props) => props.zIndex};
-  opacity: ${(props) => props.disabled ? 0.5 : 1};
+  opacity: ${(props) => props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};
   pointer-events: ${(props) => props.disabled ? "none" : "auto"};
 
   &:hover {
@@ -762,6 +769,7 @@ var Box2 = import_react5.default.forwardRef(
           alt: alt || "",
           onError,
           onLoad,
+          "data-testid": dataTestId || testID,
           style: {
             display: "block",
             objectFit: "cover",