react-crud-mobile 1.3.182 → 1.3.184

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-crud-mobile",
-  "version": "1.3.182",
+  "version": "1.3.184",
   "license": "MIT",
   "description": "Uma biblioteca de componentes para React Native",
   "main": "dist/index.js",

package/src/elements/core/UIOrder.tsx

@@ -60,20 +60,39 @@ export default function UIOrder(props: ChildType) {
 
   //v2
 
-  const renderItem = ({ item, drag, isActive }) => {
-    let state = { ...scope.getStyle('row') };
+  const renderItem = ({ item, drag, isActive, getIndex }) => {
+    const index = getIndex();
+    const name = `${scope.key('row', index, '')}`;
+    const [row] = useState(
+      ScopeUtils.create({
+        ...original,
+        parent: scope,
+        name,
+        crud: scope.crud,
+        index,
+        type: 'row',
+        data: item,
+      })
+    );
+
+    let css = { ...scope.getStyle('row') };
 
     if (isActive) {
-      state = { ...state, ...scope.getStyle('active') };
+      css = { ...css, ...scope.getStyle('active') };
     }
 
+    if (isActive) {
+      css = { ...css, ...row.getStyle('rowSelected', {}) };
+    } else {
+      css = { ...css, ...row.getStyle('rowUnSelected', {}) };
+    }
     return (
       <ScaleDecorator>
         <TouchableOpacity
           style={[
             styles.row,
             { backgroundColor: isActive ? 'lightblue' : 'white' },
-            { ...state },
+            { ...css },
           ]}
           delayLongPress={100}
           onLongPress={drag} // Initiate drag on long press
@@ -102,13 +121,21 @@ export default function UIOrder(props: ChildType) {
     return <>{children}</>;
   };
 
+  const Header = ({ pos }) => {
+    const hPos = Utils.nvl(original.headerPos, 'outer');
+
+    if (hPos !== pos) return <></>;
+
+    return <UIHeader scope={scope} />;
+  };
+
   let OrderData = () => {
     const [data, setData] = useState(items);
 
     return (
       <DraggableFlatList
         data={data}
-        ListHeaderComponent={<UIHeader scope={scope} />}
+        ListHeaderComponent={<Header pos="inner" />}
         ListFooterComponent={<>{scope.getPart('footer')}</>}
         renderItem={renderItem}
         containerStyle={{ ...scope.getStyle('list') }}
@@ -129,6 +156,7 @@ export default function UIOrder(props: ChildType) {
   };
   return (
     <OrderView>
+      <Header pos="outer" />
       <OrderData />
     </OrderView>
   );