@ssplib/react-components 0.0.239 → 0.0.241

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.
Files changed (5) hide show
  1. package/components/form/date/DatePicker.js +1 -4
  2. package/components/form/date/TimePicker.js +2 -5
  3. package/components/form/table/Table.d.ts +5 -2
  4. package/components/form/table/Table.js +31 -8
  5. package/package.json +1 -1
package/components/form/date/DatePicker.js CHANGED
@@ -53,13 +53,10 @@ function DatePicker(_a) {
53
53
  const context = (0, react_1.useContext)(form_1.FormContext);
54
54
  const [value, setValue] = (0, react_1.useState)(defaultValue ? (0, dayjs_1.default)(defaultValue, 'DD/MM/YYYY') : null);
55
55
  const handleChange = (newValue) => {
56
- console.log('mudou');
57
56
  setValue(newValue);
58
57
  };
59
58
  (0, react_1.useEffect)(() => {
60
- if (!value)
61
- return;
62
- context.formSetValue(name, value.format('DD/MM/YYYY'));
59
+ context.formSetValue(name, value ? value.format('DD/MM/YYYY') : value);
63
60
  }, [value]);
64
61
  (0, react_1.useEffect)(() => {
65
62
  return () => {
package/components/form/date/TimePicker.js CHANGED
@@ -41,13 +41,10 @@ function TimePicker({ name, required = false, title, defaultValue = '', xs = 12,
41
41
  const [value, setValue] = (0, react_1.useState)(defaultValue ? (0, dayjs_1.default)(defaultValue, 'HH:mm') : null);
42
42
  const handleChange = (newValue) => {
43
43
  setValue(newValue);
44
- context === null || context === void 0 ? void 0 : context.formSetValue(name, newValue === null || newValue === void 0 ? void 0 : newValue.format('HH:mm'));
45
44
  };
46
45
  (0, react_1.useEffect)(() => {
47
- if (!value)
48
- return;
49
- context.formSetValue(name, value.format('HH:mm'));
50
- }, []);
46
+ context.formSetValue(name, value ? value.format('HH:mm') : value);
47
+ }, [value]);
51
48
  (0, react_1.useEffect)(() => {
52
49
  return () => {
53
50
  context.formUnregister(name);
package/components/form/table/Table.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import React from 'react';
1
+ import { BoxProps } from '@mui/material';
2
+ import React, { ReactNode } from 'react';
2
3
  interface ColumnData {
3
4
  title: string;
4
5
  keyName: string;
@@ -10,7 +11,7 @@ interface OrderBy {
10
11
  key: string;
11
12
  type: 'string' | 'number';
12
13
  }
13
- export declare function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, useKC, statusKeyName, csvExcludeKeys, csvExcludeKeysCSV, csvExcludeKeysAll, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvNoZipText, csvAllButtonTitle, removeQuotes, normalize, csvShowAllButton, csvWithoutZip, itemCount, csvUpper, csvZipFileNamesKey, generateCsvZip, hideTitleCSV, csvExcludeUpper, multipleDataPath, expandTextMaxLength, collapsedSize, customMargin, customMarginMobile, filtersFunc, filters, orderBy, id, }: {
14
+ export declare function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, useKC, statusKeyName, csvExcludeKeys, csvExcludeKeysCSV, csvExcludeKeysAll, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvNoZipText, csvAllButtonTitle, removeQuotes, normalize, csvShowAllButton, csvWithoutZip, itemCount, csvUpper, csvZipFileNamesKey, generateCsvZip, hideTitleCSV, csvExcludeUpper, multipleDataPath, expandTextMaxLength, collapsedSize, customMargin, customMarginMobile, filtersFunc, filters, orderBy, customErrorMsg, customTableStyle, id, }: {
14
15
  id: string;
15
16
  mediaQueryLG?: {
16
17
  all: number;
@@ -25,7 +26,9 @@ export declare function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg, data
25
26
  customMarginMobile?: number;
26
27
  normalize?: boolean;
27
28
  csvUpper?: boolean;
29
+ customTableStyle?: BoxProps;
28
30
  multipleDataPath?: string;
31
+ customErrorMsg?: string | ReactNode;
29
32
  removeQuotes?: boolean;
30
33
  columns: ColumnData[];
31
34
  tableName: string;
package/components/form/table/Table.js CHANGED
@@ -72,7 +72,7 @@ function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg = {
72
72
  }, dataPath = '', tableName = 'Dados', csv, columnSize, action, useKC = true, statusKeyName = '', csvExcludeKeys = [], csvExcludeKeysCSV = [], csvExcludeKeysAll = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, csvButtonTitle = 'Salvar .CSV', csvNoZipText = 'Salvar .CSV', csvAllButtonTitle = 'Salvar todos em CSV', removeQuotes = false, normalize = false, csvShowAllButton = false, csvWithoutZip = false, itemCount = 10, csvUpper = false, csvZipFileNamesKey = '', generateCsvZip = false,
73
73
  // filters = {},
74
74
  // filterSeparator = '|',
75
- hideTitleCSV = false, csvExcludeUpper = [], multipleDataPath = '', expandTextMaxLength = 50, collapsedSize = 53, customMargin = 4, customMarginMobile = 0, filtersFunc, filters = [], orderBy = [], id, }) {
75
+ hideTitleCSV = false, csvExcludeUpper = [], multipleDataPath = '', expandTextMaxLength = 50, collapsedSize = 53, customMargin = 4, customMarginMobile = 0, filtersFunc, filters = [], orderBy = [], customErrorMsg = undefined, customTableStyle = {}, id, }) {
76
76
  var _a;
77
77
  const [isLoading, setIsLoading] = (0, react_1.useState)(true);
78
78
  const [error, setError] = (0, react_1.useState)(null);
@@ -689,20 +689,43 @@ hideTitleCSV = false, csvExcludeUpper = [], multipleDataPath = '', expandTextMax
689
689
  console.log(filterContainer.current);
690
690
  }, [filterContainer.current]);
691
691
  if (error)
692
- return (react_1.default.createElement(material_1.Box, { bgcolor: '#E2E8F0', padding: 2, marginX: 2 },
692
+ return (react_1.default.createElement(material_1.Box, { bgcolor: '#fff2c8', color: '#3e3129', padding: 2, marginX: 2, borderRadius: 4 },
693
693
  react_1.default.createElement(Typography_1.default, { fontSize: 24, textAlign: 'center', fontFamily: 'Inter' },
694
694
  error.status === 403 && 'Acesso negado',
695
- error.status === 500 && (react_1.default.createElement(material_1.Box, { fontWeight: 500, textAlign: 'center' }, "Lamentavelmente, ocorreu um imprevisto em nosso servidor. Pedimos a sua compreens\u00E3o e solicitamos que aguarde por um momento enquanto verificamos a situa\u00E7\u00E3o.")))));
695
+ error.status === 500 && (react_1.default.createElement(material_1.Box, { fontWeight: 500, textAlign: 'center' },
696
+ react_1.default.createElement(icons_material_1.ReportProblemRounded, { sx: { transform: 'scale(2)', paddingX: 4, marginY: 1, fill: '#3e3129' } }),
697
+ react_1.default.createElement(material_1.Box, null, customErrorMsg ? (customErrorMsg) : (react_1.default.createElement(react_1.default.Fragment, null,
698
+ "N\u00E3o foi poss\u00EDvel se conectar ao servidor no momento. Por favor, aguarde alguns instantes e tente de novo.",
699
+ react_1.default.createElement("br", null),
700
+ react_1.default.createElement("br", null),
701
+ "Caso precise de ajuda, entre em contato pelo email: ",
702
+ react_1.default.createElement("strong", null, "cdes@ssp.df.gov.br")))))))));
696
703
  if (isLoading)
697
704
  return (react_1.default.createElement(material_1.Stack, { sx: { height: '100%', width: '100%' }, justifyContent: 'center', alignItems: 'center' },
698
- react_1.default.createElement(Typography_1.default, { fontWeight: 600, fontSize: 20, paddingBottom: 2, marginTop: 14 },
699
- "Carregando ",
700
- tableName),
701
- react_1.default.createElement(material_1.CircularProgress, null)));
705
+ react_1.default.createElement(material_1.Box, { width: '100%' },
706
+ react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', alignItems: 'center', justifyItems: 'center', spacing: 2, marginY: 4 },
707
+ react_1.default.createElement(icons_material_1.PendingRounded, { sx: { fill: '#5e5e5e' } }),
708
+ react_1.default.createElement(Typography_1.default, { fontWeight: 600, fontSize: 20, textTransform: 'capitalize', textAlign: 'center', color: '#5e5e5e' },
709
+ "Carregando ",
710
+ tableName)),
711
+ react_1.default.createElement(material_1.LinearProgress, { color: 'inherit' }),
712
+ Array(10)
713
+ .fill('')
714
+ .map((x) => (react_1.default.createElement(material_1.Stack, { direction: {
715
+ xs: 'column',
716
+ md: 'row',
717
+ }, spacing: {
718
+ xs: 3,
719
+ md: 1,
720
+ }, justifyContent: 'space-between', paddingY: 8, borderBottom: '1px solid #cacaca' }, Array(7)
721
+ .fill(0)
722
+ .map((y) => (react_1.default.createElement(material_1.Box, null,
723
+ react_1.default.createElement(material_1.Skeleton, { width: 60 }),
724
+ react_1.default.createElement(material_1.Skeleton, { width: 120 }))))))))));
702
725
  if (!userLoaded && useKC)
703
726
  return react_1.default.createElement(material_1.LinearProgress, null);
704
727
  return (react_1.default.createElement(react_1.default.Fragment, null,
705
- react_1.default.createElement(material_1.Box, { marginX: isSmall ? customMarginMobile : customMargin, bgcolor: 'white', p: 2, borderRadius: 6 },
728
+ react_1.default.createElement(material_1.Box, Object.assign({ marginX: isSmall ? customMarginMobile : customMargin, bgcolor: 'white', p: 2, borderRadius: 6 }, customTableStyle),
706
729
  react_1.default.createElement(material_1.Stack, { spacing: 1.5, direction: { xs: 'column', md: 'row' } },
707
730
  react_1.default.createElement(material_1.Stack, { spacing: 1.5, direction: { xs: 'column', md: 'row' }, height: { md: '40px', xs: 'inherit' }, width: '100%' },
708
731
  react_1.default.createElement(TextField_1.default, { InputProps: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ssplib/react-components",
3
- "version": "0.0.239",
3
+ "version": "0.0.241",
4
4
  "description": "SSP React Components",
5
5
  "main": "index.js",
6
6
  "author": "Pedro Henrique <sr.hudrick@gmail.com>",