react-crud-mobile 1.3.51 → 1.3.52

package/dist/elements/UI.d.ts

@@ -2,6 +2,7 @@
 import { ListType, UserType, InputType, ChartType, ContainerType, ListInputType, TabsType, DefineType, ButtonType, IconType, LinkType, SliderType } from 'react-crud-utils';
 import SafeView from './core/SafeView';
 declare const UI: {
+    Order: (props: ListType) => import("react").JSX.Element;
     List: (props: ListType) => import("react").JSX.Element;
     Row: (props: UserType) => import("react").JSX.Element;
     Value: (props: UserType) => import("react").JSX.Element;

package/dist/elements/core/UIOrder.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ChildType } from 'react-crud-utils';
+export default function UIOrder(props: ChildType): React.JSX.Element;

package/dist/react-crud-mobile.cjs.development.js

@@ -14,6 +14,7 @@ var vectorIcons = require('@expo/vector-icons');
 var Slider = _interopDefault(require('@react-native-community/slider'));
 var Toast = require('react-native-toast-message');
 var Toast__default = _interopDefault(Toast);
+var DraggableFlatList = _interopDefault(require('react-native-draggable-flatlist'));
 var reactNativeSafeAreaContext = require('react-native-safe-area-context');
 
 function _extends() {
@@ -1598,6 +1599,153 @@ var styles$9 = /*#__PURE__*/reactNative.StyleSheet.create({
   view: {}
 });
 
+function UIOrder(props) {
+  var scope = props.scope;
+  var crud = scope.crud;
+  var original = scope.original;
+  var cols = reactCrudUtils.Utils.nvl(scope.getPart('cols', undefined, 1));
+  var add = reactCrudUtils.ComponentUtils.getDefine(props, 'add');
+  var hideAddWhenEmpty = original.hideAddWhenEmpty;
+  var getStyle = function getStyle(key, extra) {
+    return scope.getStyle(key, _extends({}, extra, styles$a[key]));
+  };
+  var getContainerStyle = function getContainerStyle(extra) {
+    var row = getStyle('container', {});
+    if (cols > 1) {
+      row = _extends({}, row, {
+        flexDirection: 'row',
+        flexWrap: 'wrap'
+      });
+    }
+    return row;
+  };
+  var LocalData = function LocalData() {
+    var _useState = React.useState(scope.updateIndex),
+      index = _useState[0],
+      setIndex = _useState[1];
+    scope.update = function () {
+      scope.updateIndex = ++index;
+      setIndex(index);
+    };
+    var keyData = scope.key('data');
+    var items = reactCrudUtils.Utils.call(function () {
+      var _original$list;
+      var list = reactCrudUtils.Utils.nvl(scope.getItems(), []);
+      if (original.search && !((_original$list = original.list) != null && _original$list.url)) {
+        var query = crud.get('query', '').toLowerCase().trim();
+        if (query.length > 1) {
+          var filters = [];
+          var filterBy = reactCrudUtils.Utils.nvl(original.filterBy, 'label');
+          reactCrudUtils.Utils.each(list, function (o) {
+            var label = o[filterBy];
+            if (label) {
+              if (label.includes(query)) {
+                filters.push(o);
+              }
+            }
+          });
+          return filters;
+        }
+      }
+      return list;
+    });
+    var isShowAdd = function isShowAdd() {
+      if (!reactCrudUtils.Utils.isEmpty(items)) {
+        return true;
+      }
+      return hideAddWhenEmpty !== true;
+    };
+    var Empty = function Empty() {
+      if (!reactCrudUtils.Utils.isEmpty(items)) {
+        return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {});
+      }
+      var empty = scope.attr('empty', 'Sem registro');
+      if (!empty) {
+        return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {});
+      }
+      if (typeof empty === 'string') {
+        return /*#__PURE__*/jsxRuntime.jsx(reactNative.Text, {
+          style: scope.getStyle('empty', {
+            flex: 1,
+            fontWeight: 500,
+            fontSize: 20,
+            padding: 10,
+            textAlign: 'center',
+            justifyContent: 'center',
+            alignItems: 'center'
+          }),
+          children: empty
+        });
+      }
+      return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+        children: empty
+      });
+    };
+    var renderItem = function renderItem(_ref) {
+      var item = _ref.item,
+        drag = _ref.drag,
+        isActive = _ref.isActive;
+      return /*#__PURE__*/jsxRuntime.jsx(reactNative.TouchableOpacity, {
+        style: [styles$a.row, {
+          backgroundColor: isActive ? 'lightblue' : 'white'
+        }],
+        onLongPress: drag // Initiate drag on long press
+        ,
+        children: /*#__PURE__*/jsxRuntime.jsx(reactNative.Text, {
+          style: styles$a.text,
+          children: scope.getItemLabel(item)
+        })
+      });
+    };
+    return /*#__PURE__*/jsxRuntime.jsxs(reactNative.View, {
+      style: getContainerStyle(),
+      children: [/*#__PURE__*/jsxRuntime.jsx(Empty, {}), /*#__PURE__*/jsxRuntime.jsx(DraggableFlatList, {
+        data: items,
+        renderItem: renderItem,
+        keyExtractor: function keyExtractor(item) {
+          return scope.getItemValue(item);
+        },
+        onDragEnd: function onDragEnd(_ref2) {
+          var data = _ref2.data;
+          scope.changeValue(data);
+        }
+      }), isShowAdd() && /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+        children: add
+      })]
+    }, keyData);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [original.search !== false && /*#__PURE__*/jsxRuntime.jsx(UI.Text, {
+      placeholder: "Pesquisar...",
+      field: "query",
+      crud: crud,
+      style: {
+        marginBottom: 10
+      },
+      change: {
+        action: function action() {
+          scope.search();
+        }
+      },
+      icon: /*#__PURE__*/jsxRuntime.jsx(vectorIcons.Ionicons, {
+        name: "search",
+        size: 20,
+        color: "#888"
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx(LocalData, {})]
+  });
+}
+var styles$a = /*#__PURE__*/reactNative.StyleSheet.create({
+  row: {
+    padding: 20,
+    borderBottomWidth: 1,
+    borderBottomColor: '#ccc'
+  },
+  text: {
+    fontSize: 18
+  }
+});
+
 var CrudContext = /*#__PURE__*/React.createContext({});
 function UIElement(props) {
   var _original$list, _original$load;
@@ -1738,7 +1886,7 @@ function UIElement(props) {
     var _elementStyle$type;
     var type = reactCrudUtils.Utils.nvl(original.type, 'none');
     var key = reactCrudUtils.Utils.nvl(part, 'root');
-    var def = _extends({}, styles$a[key]);
+    var def = _extends({}, styles$b[key]);
     var hasChild = hasChildren();
     type = reactCrudUtils.Utils.nvl(original.layout, type);
     if (!part && !hasChild) {
@@ -1938,6 +2086,9 @@ function UIElement(props) {
       }), scope.isType('list', 'repeat') && /*#__PURE__*/jsxRuntime.jsx(UIList, _extends({}, props, {
         scope: scope,
         crud: crud
+      })), scope.isType('order') && /*#__PURE__*/jsxRuntime.jsx(UIOrder, _extends({}, props, {
+        scope: scope,
+        crud: crud
       })), scope.isType('dialog') && /*#__PURE__*/jsxRuntime.jsx(UIModal, _extends({}, props, {
         scope: scope,
         crud: crud
@@ -2086,7 +2237,7 @@ elementStyle.toggle = /*#__PURE__*/reactNative.StyleSheet.create({
     flexWrap: 'nowrap'
   })
 });
-var styles$a = /*#__PURE__*/reactNative.StyleSheet.create({
+var styles$b = /*#__PURE__*/reactNative.StyleSheet.create({
   root: {
     gap: 5,
     flexDirection: 'column',
@@ -2196,6 +2347,11 @@ function SafeView(props) {
 
 var _excluded = ["type"];
 var UI = {
+  Order: function Order(props) {
+    return /*#__PURE__*/jsxRuntime.jsx(UIElement, _extends({}, props, {
+      type: "order"
+    }));
+  },
   List: function List(props) {
     return /*#__PURE__*/jsxRuntime.jsx(UIElement, _extends({}, props, {
       type: "list"