react-crud-mobile 1.3.557 → 1.3.560
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/dist/index.js +14 -37
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +15 -45
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/elements/core/UIButton.tsx +1 -1
- package/src/elements/core/UIModal.tsx +1 -1
- package/src/elements/core/UIOrder.tsx +235 -271
package/dist/index.mjs
CHANGED
|
@@ -474,7 +474,7 @@ function UIButton(props) {
|
|
|
474
474
|
if (!label) {
|
|
475
475
|
def = { ...def, borderRadius: 20 };
|
|
476
476
|
}
|
|
477
|
-
let css = style("button"
|
|
477
|
+
let css = { ...def, ...style("button") };
|
|
478
478
|
if (!css.width) {
|
|
479
479
|
let h = css.height;
|
|
480
480
|
if (typeof h === "number") css.minWidth = h;
|
|
@@ -1502,7 +1502,7 @@ function UIModal(props) {
|
|
|
1502
1502
|
/* @__PURE__ */ jsx22(UIToast, {})
|
|
1503
1503
|
] });
|
|
1504
1504
|
};
|
|
1505
|
-
return /* @__PURE__ */ jsx22(Modal3, { animationType: "slide",
|
|
1505
|
+
return /* @__PURE__ */ jsx22(Modal3, { animationType: "slide", visible: true, onRequestClose: onClose, children: /* @__PURE__ */ jsx22(ModalInner, {}) }, key);
|
|
1506
1506
|
}
|
|
1507
1507
|
var styles9 = StyleSheet12.create({
|
|
1508
1508
|
modalTop: {
|
|
@@ -1654,14 +1654,7 @@ import Toast2 from "react-native-toast-message";
|
|
|
1654
1654
|
// src/elements/core/UIOrder.tsx
|
|
1655
1655
|
import { useRef as useRef5, useState as useState15, useEffect as useEffect3 } from "react";
|
|
1656
1656
|
import { Utils as Utils17 } from "react-crud-utils";
|
|
1657
|
-
import {
|
|
1658
|
-
View as View12,
|
|
1659
|
-
Text as Text12,
|
|
1660
|
-
StyleSheet as StyleSheet14,
|
|
1661
|
-
Animated as Animated2,
|
|
1662
|
-
PanResponder,
|
|
1663
|
-
TouchableOpacity as TouchableOpacity7
|
|
1664
|
-
} from "react-native";
|
|
1657
|
+
import { View as View12, Text as Text12, StyleSheet as StyleSheet14, Animated as Animated2, PanResponder, TouchableOpacity as TouchableOpacity7 } from "react-native";
|
|
1665
1658
|
import { Fragment as Fragment15, jsx as jsx25, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1666
1659
|
var ITEM_HEIGHT = 70;
|
|
1667
1660
|
function UIOrder(props) {
|
|
@@ -1671,9 +1664,7 @@ function UIOrder(props) {
|
|
|
1671
1664
|
const [items, setItems] = useState15(initial);
|
|
1672
1665
|
const [draggingId, setDraggingId] = useState15(null);
|
|
1673
1666
|
const positions = useRef5(
|
|
1674
|
-
Object.fromEntries(
|
|
1675
|
-
initial.map((it, i) => [it.value, new Animated2.Value(i * ITEM_HEIGHT)])
|
|
1676
|
-
)
|
|
1667
|
+
Object.fromEntries(initial.map((it, i) => [it.value, new Animated2.Value(i * ITEM_HEIGHT)]))
|
|
1677
1668
|
).current;
|
|
1678
1669
|
const panRespondersRef = useRef5({});
|
|
1679
1670
|
const activeItem = useRef5(null);
|
|
@@ -1685,8 +1676,7 @@ function UIOrder(props) {
|
|
|
1685
1676
|
}, [items]);
|
|
1686
1677
|
useEffect3(() => {
|
|
1687
1678
|
items.forEach((it, idx) => {
|
|
1688
|
-
if (!positions[it.value])
|
|
1689
|
-
positions[it.value] = new Animated2.Value(idx * ITEM_HEIGHT);
|
|
1679
|
+
if (!positions[it.value]) positions[it.value] = new Animated2.Value(idx * ITEM_HEIGHT);
|
|
1690
1680
|
Animated2.spring(positions[it.value], {
|
|
1691
1681
|
toValue: idx * ITEM_HEIGHT,
|
|
1692
1682
|
useNativeDriver: false
|
|
@@ -1708,35 +1698,26 @@ function UIOrder(props) {
|
|
|
1708
1698
|
onStartShouldSetPanResponder: () => true,
|
|
1709
1699
|
onPanResponderGrant: () => {
|
|
1710
1700
|
const currentItems = itemsRef.current;
|
|
1711
|
-
if (!positions[item.value] || !currentItems.find((it) => it.value === item.value))
|
|
1712
|
-
return;
|
|
1701
|
+
if (!positions[item.value] || !currentItems.find((it) => it.value === item.value)) return;
|
|
1713
1702
|
activeItem.current = item;
|
|
1714
|
-
activeIndex.current = currentItems.findIndex(
|
|
1715
|
-
(it) => it.value === item.value
|
|
1716
|
-
);
|
|
1703
|
+
activeIndex.current = currentItems.findIndex((it) => it.value === item.value);
|
|
1717
1704
|
offsetY.current = positions[item.value]._value;
|
|
1718
1705
|
setDraggingId(item.value);
|
|
1719
1706
|
},
|
|
1720
1707
|
onPanResponderMove: (_, gesture) => {
|
|
1721
1708
|
const currentItems = itemsRef.current;
|
|
1722
|
-
if (!positions[item.value] || !currentItems.find((it) => it.value === item.value))
|
|
1723
|
-
return;
|
|
1709
|
+
if (!positions[item.value] || !currentItems.find((it) => it.value === item.value)) return;
|
|
1724
1710
|
const y = offsetY.current + gesture.dy;
|
|
1725
1711
|
positions[item.value].setValue(y);
|
|
1726
1712
|
const targetIndex = Math.max(
|
|
1727
1713
|
0,
|
|
1728
|
-
Math.min(
|
|
1729
|
-
currentItems.length - 1,
|
|
1730
|
-
Math.floor((y + ITEM_HEIGHT / 2) / ITEM_HEIGHT)
|
|
1731
|
-
)
|
|
1714
|
+
Math.min(currentItems.length - 1, Math.floor((y + ITEM_HEIGHT / 2) / ITEM_HEIGHT))
|
|
1732
1715
|
);
|
|
1733
1716
|
currentItems.forEach((other, idx) => {
|
|
1734
1717
|
if (other.value === item.value || !positions[other.value]) return;
|
|
1735
1718
|
let targetY = idx * ITEM_HEIGHT;
|
|
1736
|
-
if (idx > activeIndex.current && idx <= targetIndex)
|
|
1737
|
-
|
|
1738
|
-
else if (idx < activeIndex.current && idx >= targetIndex)
|
|
1739
|
-
targetY = (idx + 1) * ITEM_HEIGHT;
|
|
1719
|
+
if (idx > activeIndex.current && idx <= targetIndex) targetY = (idx - 1) * ITEM_HEIGHT;
|
|
1720
|
+
else if (idx < activeIndex.current && idx >= targetIndex) targetY = (idx + 1) * ITEM_HEIGHT;
|
|
1740
1721
|
Animated2.timing(positions[other.value], {
|
|
1741
1722
|
toValue: targetY,
|
|
1742
1723
|
duration: 120,
|
|
@@ -1747,15 +1728,11 @@ function UIOrder(props) {
|
|
|
1747
1728
|
onPanResponderRelease: () => {
|
|
1748
1729
|
const moved = activeItem.current;
|
|
1749
1730
|
const currentItems = itemsRef.current;
|
|
1750
|
-
if (!moved || !positions[moved.value] || !currentItems.find((it) => it.value === moved.value))
|
|
1751
|
-
return;
|
|
1731
|
+
if (!moved || !positions[moved.value] || !currentItems.find((it) => it.value === moved.value)) return;
|
|
1752
1732
|
const finalY = positions[moved.value]._value;
|
|
1753
1733
|
const newIndex = Math.max(
|
|
1754
1734
|
0,
|
|
1755
|
-
Math.min(
|
|
1756
|
-
currentItems.length - 1,
|
|
1757
|
-
Math.floor((finalY + ITEM_HEIGHT / 2) / ITEM_HEIGHT)
|
|
1758
|
-
)
|
|
1735
|
+
Math.min(currentItems.length - 1, Math.floor((finalY + ITEM_HEIGHT / 2) / ITEM_HEIGHT))
|
|
1759
1736
|
);
|
|
1760
1737
|
const oldIndex = activeIndex.current;
|
|
1761
1738
|
const updated = [...currentItems];
|
|
@@ -1807,7 +1784,7 @@ function UIOrder(props) {
|
|
|
1807
1784
|
};
|
|
1808
1785
|
return /* @__PURE__ */ jsxs11(View12, { style: styles11.container, children: [
|
|
1809
1786
|
/* @__PURE__ */ jsx25(Empty, {}),
|
|
1810
|
-
/* @__PURE__ */ jsx25(View12, { style: { height: items.length * ITEM_HEIGHT, width: "100%" }, children: items.map((item) => {
|
|
1787
|
+
/* @__PURE__ */ jsx25(View12, { style: { height: items.length * ITEM_HEIGHT, width: "100%", ...scope.getStyle("container") }, children: items.map((item) => {
|
|
1811
1788
|
const y = positions[item.value];
|
|
1812
1789
|
if (!y) return null;
|
|
1813
1790
|
const isDragging = draggingId === item.value;
|
|
@@ -1831,14 +1808,7 @@ function UIOrder(props) {
|
|
|
1831
1808
|
children: [
|
|
1832
1809
|
/* @__PURE__ */ jsx25(View12, { style: styles11.handle, children: /* @__PURE__ */ jsx25(Text12, { style: styles11.handleText, children: "\u2261" }) }),
|
|
1833
1810
|
/* @__PURE__ */ jsx25(Text12, { style: styles11.itemText, children: item.label }),
|
|
1834
|
-
element.remove && /* @__PURE__ */ jsx25(
|
|
1835
|
-
TouchableOpacity7,
|
|
1836
|
-
{
|
|
1837
|
-
onPress: () => removeItem(item.value),
|
|
1838
|
-
style: styles11.del,
|
|
1839
|
-
children: /* @__PURE__ */ jsx25(Text12, { style: { color: "#fff" }, children: "X" })
|
|
1840
|
-
}
|
|
1841
|
-
)
|
|
1811
|
+
element.remove && /* @__PURE__ */ jsx25(TouchableOpacity7, { onPress: () => removeItem(item.value), style: styles11.del, children: /* @__PURE__ */ jsx25(Text12, { style: { color: "#fff" }, children: "X" }) })
|
|
1842
1812
|
]
|
|
1843
1813
|
},
|
|
1844
1814
|
item.value
|