@xsolla/xui-context-menu 0.90.0 → 0.92.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/native/index.js +26 -25
- package/native/index.js.map +1 -1
- package/native/index.mjs +23 -22
- package/native/index.mjs.map +1 -1
- package/package.json +8 -8
- package/web/index.js +26 -25
- package/web/index.js.map +1 -1
- package/web/index.mjs +23 -22
- package/web/index.mjs.map +1 -1
package/native/index.js
CHANGED
|
@@ -1446,6 +1446,7 @@ var import_jsx_runtime388 = require("react/jsx-runtime");
|
|
|
1446
1446
|
var import_jsx_runtime389 = require("react/jsx-runtime");
|
|
1447
1447
|
var import_jsx_runtime390 = require("react/jsx-runtime");
|
|
1448
1448
|
var import_jsx_runtime391 = require("react/jsx-runtime");
|
|
1449
|
+
var import_jsx_runtime392 = require("react/jsx-runtime");
|
|
1449
1450
|
var StyledIcon = import_styled_components.default.div`
|
|
1450
1451
|
display: inline-flex;
|
|
1451
1452
|
align-items: center;
|
|
@@ -1463,15 +1464,15 @@ var BaseIcon = ({
|
|
|
1463
1464
|
variant = "line",
|
|
1464
1465
|
size = 24,
|
|
1465
1466
|
color = "currentColor",
|
|
1466
|
-
solidContent:
|
|
1467
|
-
lineContent:
|
|
1467
|
+
solidContent: solidContent382,
|
|
1468
|
+
lineContent: lineContent382,
|
|
1468
1469
|
className,
|
|
1469
1470
|
style,
|
|
1470
1471
|
"data-testid": testId,
|
|
1471
1472
|
"aria-label": ariaLabel,
|
|
1472
1473
|
"aria-hidden": ariaHidden
|
|
1473
1474
|
}) => {
|
|
1474
|
-
const svgContent = variant === "line" ?
|
|
1475
|
+
const svgContent = variant === "line" ? lineContent382 : solidContent382;
|
|
1475
1476
|
const sizeValue = typeof size === "number" ? `${size}px` : size;
|
|
1476
1477
|
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1477
1478
|
StyledIcon,
|
|
@@ -1488,13 +1489,13 @@ var BaseIcon = ({
|
|
|
1488
1489
|
}
|
|
1489
1490
|
);
|
|
1490
1491
|
};
|
|
1491
|
-
var
|
|
1492
|
-
var
|
|
1493
|
-
var Search = (props) => /* @__PURE__ */ (0,
|
|
1492
|
+
var solidContent368 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_search--line"><path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M10 2C14.4183 2 18 5.58172 18 10C18 11.8484 17.3711 13.5488 16.3184 14.9033L21.957 20.543L20.543 21.957L14.9033 16.3174C13.5487 17.3703 11.8486 18 10 18C5.58172 18 2 14.4183 2 10C2 5.58172 5.58172 2 10 2ZM10 4C6.68629 4 4 6.68629 4 10C4 13.3137 6.68629 16 10 16C13.3137 16 16 13.3137 16 10C16 6.68629 13.3137 4 10 4Z" style="fill: currentColor"/></g></svg>`;
|
|
1493
|
+
var lineContent368 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_search--line"><path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M10 2C14.4183 2 18 5.58172 18 10C18 11.8484 17.3711 13.5488 16.3184 14.9033L21.957 20.543L20.543 21.957L14.9033 16.3174C13.5487 17.3703 11.8486 18 10 18C5.58172 18 2 14.4183 2 10C2 5.58172 5.58172 2 10 2ZM10 4C6.68629 4 4 6.68629 4 10C4 13.3137 6.68629 16 10 16C13.3137 16 16 13.3137 16 10C16 6.68629 13.3137 4 10 4Z" style="fill: currentColor"/></g></svg>`;
|
|
1494
|
+
var Search = (props) => /* @__PURE__ */ (0, import_jsx_runtime379.jsx)(BaseIcon, { ...props, solidContent: solidContent368, lineContent: lineContent368 });
|
|
1494
1495
|
|
|
1495
1496
|
// src/ContextMenuSearch.tsx
|
|
1496
1497
|
var import_xui_divider = require("@xsolla/xui-divider");
|
|
1497
|
-
var
|
|
1498
|
+
var import_jsx_runtime393 = require("react/jsx-runtime");
|
|
1498
1499
|
var ContextMenuSearch = (0, import_react9.forwardRef)(
|
|
1499
1500
|
({
|
|
1500
1501
|
value,
|
|
@@ -1533,7 +1534,7 @@ var ContextMenuSearch = (0, import_react9.forwardRef)(
|
|
|
1533
1534
|
context?.closeMenu();
|
|
1534
1535
|
}
|
|
1535
1536
|
};
|
|
1536
|
-
return /* @__PURE__ */ (0,
|
|
1537
|
+
return /* @__PURE__ */ (0, import_jsx_runtime393.jsxs)(
|
|
1537
1538
|
Box,
|
|
1538
1539
|
{
|
|
1539
1540
|
flexDirection: "column",
|
|
@@ -1542,16 +1543,16 @@ var ContextMenuSearch = (0, import_react9.forwardRef)(
|
|
|
1542
1543
|
paddingVertical: sizeStyles.searchPaddingVertical,
|
|
1543
1544
|
"data-testid": testId,
|
|
1544
1545
|
children: [
|
|
1545
|
-
/* @__PURE__ */ (0,
|
|
1546
|
-
/* @__PURE__ */ (0,
|
|
1546
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsxs)(Box, { flexDirection: "row", alignItems: "center", gap: 8, children: [
|
|
1547
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsx)(
|
|
1547
1548
|
Icon,
|
|
1548
1549
|
{
|
|
1549
1550
|
size: sizeStyles.searchIconSize,
|
|
1550
1551
|
color: inputColors.placeholder,
|
|
1551
|
-
children: /* @__PURE__ */ (0,
|
|
1552
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(Search, {})
|
|
1552
1553
|
}
|
|
1553
1554
|
),
|
|
1554
|
-
/* @__PURE__ */ (0,
|
|
1555
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsx)(Box, { flex: 1, children: /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(
|
|
1555
1556
|
InputPrimitive,
|
|
1556
1557
|
{
|
|
1557
1558
|
ref: inputRef,
|
|
@@ -1570,7 +1571,7 @@ var ContextMenuSearch = (0, import_react9.forwardRef)(
|
|
|
1570
1571
|
}
|
|
1571
1572
|
) })
|
|
1572
1573
|
] }),
|
|
1573
|
-
/* @__PURE__ */ (0,
|
|
1574
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsx)(import_xui_divider.Divider, {})
|
|
1574
1575
|
]
|
|
1575
1576
|
}
|
|
1576
1577
|
);
|
|
@@ -1579,7 +1580,7 @@ var ContextMenuSearch = (0, import_react9.forwardRef)(
|
|
|
1579
1580
|
ContextMenuSearch.displayName = "ContextMenuSearch";
|
|
1580
1581
|
|
|
1581
1582
|
// src/ContextMenu.tsx
|
|
1582
|
-
var
|
|
1583
|
+
var import_jsx_runtime394 = require("react/jsx-runtime");
|
|
1583
1584
|
var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
1584
1585
|
({
|
|
1585
1586
|
children,
|
|
@@ -1758,7 +1759,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1758
1759
|
"data-testid": `context-menu-item-${item.id || index}`
|
|
1759
1760
|
};
|
|
1760
1761
|
if (item.variant === "checkbox") {
|
|
1761
|
-
return /* @__PURE__ */ (0,
|
|
1762
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1762
1763
|
ContextMenuCheckboxItem,
|
|
1763
1764
|
{
|
|
1764
1765
|
...commonProps,
|
|
@@ -1771,7 +1772,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1771
1772
|
);
|
|
1772
1773
|
}
|
|
1773
1774
|
if (item.variant === "radio") {
|
|
1774
|
-
return /* @__PURE__ */ (0,
|
|
1775
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1775
1776
|
ContextMenuRadioItem,
|
|
1776
1777
|
{
|
|
1777
1778
|
...commonProps,
|
|
@@ -1782,7 +1783,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1782
1783
|
itemKey
|
|
1783
1784
|
);
|
|
1784
1785
|
}
|
|
1785
|
-
return /* @__PURE__ */ (0,
|
|
1786
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1786
1787
|
ContextMenuItem,
|
|
1787
1788
|
{
|
|
1788
1789
|
...commonProps,
|
|
@@ -1800,9 +1801,9 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1800
1801
|
});
|
|
1801
1802
|
};
|
|
1802
1803
|
const renderGroups = (groupsData) => {
|
|
1803
|
-
return groupsData.map((group, groupIndex) => /* @__PURE__ */ (0,
|
|
1804
|
-
groupIndex > 0 && /* @__PURE__ */ (0,
|
|
1805
|
-
/* @__PURE__ */ (0,
|
|
1804
|
+
return groupsData.map((group, groupIndex) => /* @__PURE__ */ (0, import_jsx_runtime394.jsxs)(import_react10.default.Fragment, { children: [
|
|
1805
|
+
groupIndex > 0 && /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(ContextMenuSeparator, {}),
|
|
1806
|
+
/* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1806
1807
|
ContextMenuGroup,
|
|
1807
1808
|
{
|
|
1808
1809
|
label: group.label,
|
|
@@ -1816,14 +1817,14 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1816
1817
|
const renderContent = () => {
|
|
1817
1818
|
if (isLoading) {
|
|
1818
1819
|
const brandColor = theme.colors.control.brand.primary.bg;
|
|
1819
|
-
return /* @__PURE__ */ (0,
|
|
1820
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1820
1821
|
Box,
|
|
1821
1822
|
{
|
|
1822
1823
|
padding: 16,
|
|
1823
1824
|
alignItems: "center",
|
|
1824
1825
|
justifyContent: "center",
|
|
1825
1826
|
minHeight: 60,
|
|
1826
|
-
children: /* @__PURE__ */ (0,
|
|
1827
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(import_xui_spinner.Spinner, { size: "md", color: brandColor })
|
|
1827
1828
|
}
|
|
1828
1829
|
);
|
|
1829
1830
|
}
|
|
@@ -1838,7 +1839,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1838
1839
|
}
|
|
1839
1840
|
return null;
|
|
1840
1841
|
};
|
|
1841
|
-
return /* @__PURE__ */ (0,
|
|
1842
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(ContextMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime394.jsxs)(
|
|
1842
1843
|
"div",
|
|
1843
1844
|
{
|
|
1844
1845
|
ref: containerRef,
|
|
@@ -1849,7 +1850,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1849
1850
|
},
|
|
1850
1851
|
"data-testid": testId,
|
|
1851
1852
|
children: [
|
|
1852
|
-
trigger && /* @__PURE__ */ (0,
|
|
1853
|
+
trigger && /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1853
1854
|
"div",
|
|
1854
1855
|
{
|
|
1855
1856
|
onClick: toggleMenu,
|
|
@@ -1858,7 +1859,7 @@ var ContextMenuRoot = (0, import_react10.forwardRef)(
|
|
|
1858
1859
|
children: trigger
|
|
1859
1860
|
}
|
|
1860
1861
|
),
|
|
1861
|
-
isOpen && /* @__PURE__ */ (0,
|
|
1862
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1862
1863
|
Box,
|
|
1863
1864
|
{
|
|
1864
1865
|
ref: (node) => {
|