argous 1.2.149 → 1.2.152

package/dist/components/ArgousAvatar/ArgousAvatar.js

@@ -95,13 +95,13 @@ var useStyles = core_1.makeStyles(function (theme) { return ({
     },
 }); });
 var ArgousAvatar = react_1.default.forwardRef(function (_a, ref) {
-    var nome = _a.nome, src = _a.src, className = _a.className, idUsuario = _a.idUsuario, props = __rest(_a, ["nome", "src", "className", "idUsuario"]);
+    var nome = _a.nome, src = _a.src, className = _a.className, idUsuario = _a.idUsuario, forwardedBlockSearch = _a.forwardedBlockSearch, props = __rest(_a, ["nome", "src", "className", "idUsuario", "forwardedBlockSearch"]);
     var classes = useStyles();
     var cores = [classes.orange, classes.purple, classes.blue, classes.rosa, classes.cinza, classes.red, classes.amarelo, classes.marrom, classes.preto, classes.green];
     var _b = react_1.useState(undefined), userImage = _b[0], setUserImage = _b[1];
     react_1.useEffect(function () {
         setUserImage(localStorage.getItem("imgUsuario-" + idUsuario) || '');
-        if (!idUsuario || userImage || localStorage.getItem("imgUsuario-" + idUsuario))
+        if (!idUsuario || userImage || localStorage.getItem("imgUsuario-" + idUsuario) || (forwardedBlockSearch === null || forwardedBlockSearch === void 0 ? void 0 : forwardedBlockSearch.return))
             return;
         api_1.fetchToArgous('aguserimage', { idUsuario: idUsuario })
             .then(function (_a) {

package/dist/components/AutoCompleteFavorites/AutoCompleteFavorites.js

@@ -87,6 +87,7 @@ var lab_1 = require("@material-ui/lab");
 var clsx_1 = __importDefault(require("clsx"));
 var lodash_1 = require("lodash");
 var react_1 = __importStar(require("react"));
+var io_1 = require("react-icons/io");
 var useStyles = core_1.makeStyles(function (theme) { return ({
     subHeader: {
         display: 'flex',
@@ -168,6 +169,13 @@ var useStyles = core_1.makeStyles(function (theme) { return ({
         '&::-webkit-scrollbar-thumb': {
             background: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.1)' : 'rgba(255, 255, 255, 0.1)'
         }
+    },
+    searchButton: {
+        color: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.4)' : 'rgba(255, 255, 255, 0.5)',
+        '&:hover': {
+            color: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.8)' : 'rgba(255, 255, 255, 0.9)',
+            background: '#0000'
+        }
     }
 }); });
 exports.CustomTooltip = core_1.withStyles(function (theme) { return ({
@@ -274,7 +282,8 @@ var ListboxFavorites = react_1.forwardRef(function (props, ref) {
     });
 });
 var AutoCompleteFavorites = function (_a) {
-    var action = _a.action, busca = _a.busca, resposta = _a.resposta, label = _a.label, value = _a.value, pgCode = _a.pgCode, favoritePage = _a.favoritePage, groupName = _a.groupName, groupHeaderColor = _a.groupHeaderColor, groupTitleColor = _a.groupTitleColor, loadingColor = _a.loadingColor, filterFunction = _a.filterFunction, getOptionLabel = _a.getOptionLabel, _b = _a.onChange, onChange = _b === void 0 ? function (e) { return e; } : _b, _c = _a.textFieldProps, textFieldProps = _c === void 0 ? {} : _c, searchParams = _a.searchParams, props = __rest(_a, ["action", "busca", "resposta", "label", "value", "pgCode", "favoritePage", "groupName", "groupHeaderColor", "groupTitleColor", "loadingColor", "filterFunction", "getOptionLabel", "onChange", "textFieldProps", "searchParams"]);
+    var action = _a.action, busca = _a.busca, resposta = _a.resposta, autoSearch = _a.autoSearch, label = _a.label, value = _a.value, pgCode = _a.pgCode, favoritePage = _a.favoritePage, groupName = _a.groupName, groupHeaderColor = _a.groupHeaderColor, groupTitleColor = _a.groupTitleColor, loadingColor = _a.loadingColor, filterFunction = _a.filterFunction, getOptionLabel = _a.getOptionLabel, _b = _a.onChange, onChange = _b === void 0 ? function (e) { return e; } : _b, _c = _a.textFieldProps, textFieldProps = _c === void 0 ? {} : _c, searchParams = _a.searchParams, props = __rest(_a, ["action", "busca", "resposta", "autoSearch", "label", "value", "pgCode", "favoritePage", "groupName", "groupHeaderColor", "groupTitleColor", "loadingColor", "filterFunction", "getOptionLabel", "onChange", "textFieldProps", "searchParams"]);
+    var classes = useStyles();
     var _d = react_1.useState({
         lista: [],
         slide: true,
@@ -284,6 +293,20 @@ var AutoCompleteFavorites = function (_a) {
     }), dados = _d[0], setDados = _d[1];
     var _e = react_1.useState(false), loading = _e[0], setLoading = _e[1];
     var _f = react_1.useState(''), inputValue = _f[0], setInputValue = _f[1];
+    var interval = react_1.useRef(null);
+    var _g = react_1.useState(1), seconds = _g[0], setSeconds = _g[1];
+    var startCounter = function () { return interval.current = setInterval(function () { return setSeconds(1); }, 1000); };
+    var stopCounter = function () {
+        clearInterval(interval.current);
+        setSeconds(0);
+    };
+    var setInput = function (value) {
+        if (loading)
+            return;
+        stopCounter();
+        setInputValue(value);
+        autoSearch && startCounter();
+    };
     function carimbaLista(lista) {
         return __awaiter(this, void 0, void 0, function () {
             var completo;
@@ -306,6 +329,7 @@ var AutoCompleteFavorites = function (_a) {
         return __generator(this, function (_c) {
             switch (_c.label) {
                 case 0:
+                    stopCounter();
                     setLoading(true);
                     return [4 /*yield*/, api_1.serverAction(action, __assign((_a = {}, _a[busca] = valor || inputValue, _a), searchParams), true, pgCode)];
                 case 1:
@@ -327,12 +351,14 @@ var AutoCompleteFavorites = function (_a) {
             }
         });
     }); }, [inputValue, searchParams]);
-    react_1.useEffect(function () { return buscar(); }, [inputValue, buscar]);
+    react_1.useEffect(function () { return autoSearch && seconds === 1 && buscar(); }, [autoSearch, seconds, buscar]);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     react_1.useEffect(function () { return lodash_1.isString(value) && buscar(value); }, []);
-    return (react_1.default.createElement(lab_1.Autocomplete, __assign({}, props, { value: value, onChange: onChange }, { options: lodash_1.isObject(value) ? dados === null || dados === void 0 ? void 0 : dados.lista.filter(function (v) { return filterFunction ? filterFunction(v, value) : true || v[0] !== value[0]; }) : dados === null || dados === void 0 ? void 0 : dados.lista, getOptionLabel: getOptionLabel && (function (option) { return getOptionLabel(option, dados === null || dados === void 0 ? void 0 : dados.lista); }), noOptionsText: inputValue.length < 2 ? 'Digite para pesquisar' : 'Não Encontrado', onInputChange: function (e) { var _a; return setInputValue(((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value) || ''); }, getOptionSelected: function (o, v) { return o[0] === v; }, autoComplete: true, autoHighlight: true, openText: 'Abrir', clearText: 'Limpar', filterSelectedOptions: true, renderInput: function (params) { return (react_1.default.createElement(core_1.TextField, __assign({ margin: 'dense', variant: 'outlined', label: label }, params, textFieldProps, { InputProps: __assign(__assign(__assign({}, textFieldProps.InputProps), params.InputProps), { endAdornment: (react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(lab_1.Autocomplete, __assign({}, props, { value: value, onChange: onChange }, { autoComplete: true, autoHighlight: true, openText: 'Abrir', clearText: 'Limpar', filterSelectedOptions: true, onInputChange: function (e) { var _a; return setInput(((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value) || ''); }, getOptionSelected: function (o, v) { return o[0] === v; }, getOptionLabel: getOptionLabel && (function (option) { return getOptionLabel(option, dados === null || dados === void 0 ? void 0 : dados.lista); }), noOptionsText: inputValue.length < 2 ? 'Digite para pesquisar' : 'Não Encontrado', options: lodash_1.isObject(value) ? dados === null || dados === void 0 ? void 0 : dados.lista.filter(function (v) { return filterFunction ? filterFunction(v, value) : true || v[0] !== value[0]; }) : dados === null || dados === void 0 ? void 0 : dados.lista, renderInput: function (params) { return (react_1.default.createElement(core_1.TextField, __assign({ margin: 'dense', variant: 'outlined', label: label }, params, textFieldProps, { onKeyUp: function (e) { return ((e.key === 'Enter' || e.key === 'Tab') && !loading) && buscar(); }, inputProps: __assign(__assign({}, params.inputProps), { onKeyDown: function (e) { return (e.key === 'Enter' || e.key === 'Tab') && e.stopPropagation(); } }), InputProps: __assign(__assign(__assign({}, textFieldProps.InputProps), params.InputProps), { endAdornment: (react_1.default.createElement(react_1.default.Fragment, null,
                     params.InputProps.endAdornment,
                     react_1.default.createElement(core_1.Fade, { in: loading },
-                        react_1.default.createElement(core_1.CircularProgress, { disableShrink: true, color: loadingColor || 'inherit', size: 20 })))) }) }))); }, ListboxComponent: ListboxFavorites, ListboxProps: { dados: dados, setDados: setDados, favoritePage: favoritePage, groupHeaderColor: groupHeaderColor, groupTitleColor: groupTitleColor } })));
+                        react_1.default.createElement(core_1.CircularProgress, { disableShrink: true, color: loadingColor || 'inherit', size: 20 })),
+                    !autoSearch && react_1.default.createElement(core_1.IconButton, { size: 'small', onClick: function (e) { return buscar(); }, className: classes.searchButton },
+                        react_1.default.createElement(io_1.IoIosSearch, { size: 20 })))) }) }))); }, ListboxComponent: ListboxFavorites, ListboxProps: { dados: dados, setDados: setDados, favoritePage: favoritePage, groupHeaderColor: groupHeaderColor, groupTitleColor: groupTitleColor } })));
 };
 exports.default = AutoCompleteFavorites;

package/lib/components/ArgousAvatar/ArgousAvatar.js

@@ -50,14 +50,14 @@ const useStyles = makeStyles(theme => ({
   },
 }));
 
-const ArgousAvatar = React.forwardRef(({ nome, src, className, idUsuario, ...props }, ref) => {
+const ArgousAvatar = React.forwardRef(({ nome, src, className, idUsuario, forwardedBlockSearch, ...props }, ref) => {
   const classes = useStyles();
   const cores = [classes.orange, classes.purple, classes.blue, classes.rosa, classes.cinza, classes.red, classes.amarelo, classes.marrom, classes.preto, classes.green];
   const [userImage, setUserImage] = useState(undefined);
 
   useEffect(() => {
     setUserImage(localStorage.getItem(`imgUsuario-${idUsuario}`) || '');
-    if (!idUsuario || userImage || localStorage.getItem(`imgUsuario-${idUsuario}`)) return;
+    if (!idUsuario || userImage || localStorage.getItem(`imgUsuario-${idUsuario}`) || forwardedBlockSearch?.return) return;
     fetchToArgous('aguserimage', { idUsuario })
       .then(({ userImage }) => {
         if (userImage) {

package/lib/components/AutoCompleteFavorites/AutoCompleteFavorites.js

@@ -1,9 +1,10 @@
 import { serverAction, setError } from '../../utils/api';
-import { CircularProgress, Fade, ListItem, ListItemText, ListSubheader, makeStyles, Slide, TextField, Tooltip, withStyles } from '@material-ui/core';
+import { CircularProgress, Fade, IconButton, ListItem, ListItemText, ListSubheader, makeStyles, Slide, TextField, Tooltip, withStyles } from '@material-ui/core';
 import { Autocomplete } from '@material-ui/lab';
 import clsx from 'clsx';
 import { isObject, isString } from 'lodash';
-import React, { forwardRef, useCallback, useEffect, useState } from 'react';
+import React, { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
+import { IoIosSearch } from 'react-icons/io';
 
 const useStyles = makeStyles((theme) => ({
   subHeader: {
@@ -86,6 +87,13 @@ const useStyles = makeStyles((theme) => ({
     '&::-webkit-scrollbar-thumb': {
       background: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.1)' : 'rgba(255, 255, 255, 0.1)'
     }
+  },
+  searchButton: {
+    color: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.4)' : 'rgba(255, 255, 255, 0.5)',
+    '&:hover': {
+      color: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.8)' : 'rgba(255, 255, 255, 0.9)',
+      background: '#0000'
+    }
   }
 }));
 
@@ -214,8 +222,9 @@ const ListboxFavorites = forwardRef((props, ref) => {
   ));
 });
 
-const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode, favoritePage, groupName, groupHeaderColor, groupTitleColor, loadingColor, filterFunction, getOptionLabel, onChange = e => e, textFieldProps = {}, searchParams, ...props }) => {
+const AutoCompleteFavorites = ({ action, busca, resposta, autoSearch, label, value, pgCode, favoritePage, groupName, groupHeaderColor, groupTitleColor, loadingColor, filterFunction, getOptionLabel, onChange = e => e, textFieldProps = {}, searchParams, ...props }) => {
   
+  const classes = useStyles();
   const [dados, setDados] = useState({
     lista: [],
     slide: true,
@@ -226,6 +235,22 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
   const [loading, setLoading] = useState(false);
   const [inputValue, setInputValue] = useState('');
 
+  const interval = useRef(null);
+  const [seconds, setSeconds] = useState(1);
+
+  const startCounter = () => interval.current = setInterval(() => setSeconds(1), 1000);
+  const stopCounter = () => {
+    clearInterval(interval.current);
+    setSeconds(0);
+  };
+
+  const setInput = value => {
+    if (loading) return;
+    stopCounter();
+    setInputValue(value);
+    autoSearch && startCounter();
+  };
+
   async function carimbaLista(lista) {
     let completo = [];
     lista.map((arr, index) => {
@@ -237,6 +262,7 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
   }
 
   const buscar = useCallback(async valor => {
+    stopCounter();
     setLoading(true);
     const res = await serverAction(action, { [busca]: valor || inputValue, ...searchParams }, true, pgCode);
     if (res[resposta || 'result']?.length > 1) await carimbaLista(res[resposta || 'result']);
@@ -246,7 +272,7 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
   // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [inputValue, searchParams]);
 
-  useEffect(() => buscar(), [inputValue, buscar]);
+  useEffect(() => autoSearch && seconds === 1 && buscar(), [autoSearch, seconds, buscar]);
   // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => isString(value) && buscar(value), []);
 
@@ -254,16 +280,16 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
     <Autocomplete
       {...props}
       {...{ value, onChange }}
-      options={isObject(value) ? dados?.lista.filter(v => filterFunction ? filterFunction(v, value) : true || v[0] !== value[0]) : dados?.lista}
-      getOptionLabel={getOptionLabel && (option => getOptionLabel(option, dados?.lista))}
-      noOptionsText={inputValue.length < 2 ? 'Digite para pesquisar' : 'Não Encontrado'}
-      onInputChange={e => setInputValue(e?.target?.value || '')}
-      getOptionSelected={(o, v) => o[0] === v}
       autoComplete
       autoHighlight
       openText='Abrir'
       clearText='Limpar'
       filterSelectedOptions        
+      onInputChange={e => setInput(e?.target?.value || '')}
+      getOptionSelected={(o, v) => o[0] === v}
+      getOptionLabel={getOptionLabel && (option => getOptionLabel(option, dados?.lista))}
+      noOptionsText={inputValue.length < 2 ? 'Digite para pesquisar' : 'Não Encontrado'}
+      options={isObject(value) ? dados?.lista.filter(v => filterFunction ? filterFunction(v, value) : true || v[0] !== value[0]) : dados?.lista}
       renderInput={params => (
         <TextField
           margin='dense'
@@ -271,6 +297,11 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
           label={label}
           {...params}
           {...textFieldProps}
+          onKeyUp={e => ((e.key === 'Enter' || e.key === 'Tab') && !loading) && buscar()}
+          inputProps={{
+            ...params.inputProps,
+            onKeyDown: e => (e.key === 'Enter' || e.key === 'Tab') && e.stopPropagation()
+          }}
           InputProps={{
             ...textFieldProps.InputProps,
             ...params.InputProps,
@@ -278,6 +309,7 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
               <React.Fragment>
                 {params.InputProps.endAdornment}
                 <Fade in={loading}><CircularProgress disableShrink color={loadingColor || 'inherit'} size={20} /></Fade>
+                {!autoSearch && <IconButton size='small' onClick={e => buscar()} className={classes.searchButton}><IoIosSearch size={20} /></IconButton>}
               </React.Fragment>
             )
           }}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "argous",
-  "version": "1.2.149",
+  "version": "1.2.152",
   "description": "Argous.",
   "main": "lib/index.js",
   "author": "Carlos Schneider",