wca-designsystem 0.0.34 → 0.0.36

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 (8) hide show
  1. package/package.json +1 -1
  2. package/src/components/modules/Navbar/index.tsx +42 -39
  3. package/src/components/modules/Navbar/styles.ts +7 -3
  4. package/src/components/molecules/CardInicial/CardInicial.stories.tsx +1 -1
  5. package/src/components/molecules/CardInicial/CardInicial.test.tsx +1 -3
  6. package/src/components/molecules/CardInicial/index.tsx +3 -9
  7. package/src/components/molecules/Paginacao/index.tsx +1 -0
  8. package/src/components/molecules/TabelaHeader/index.tsx +2 -0
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.0.34",
2
+ "version": "0.0.36",
3
3
  "license": "MIT",
4
4
  "main": "dist/index.js",
5
5
  "typings": "dist/index.d.ts",
package/src/components/modules/Navbar/index.tsx CHANGED
@@ -37,49 +37,52 @@ const Navbar = ({
37
37
  data-active={isHover}
38
38
  color={isHover ? theme.colors.white : color}
39
39
  >
40
- <S.NavbarHeader className={isHover ? 'nav-hover' : ''}>
41
- <Icone
42
- svg={LogoHeader}
43
- className="logo"
44
- width={isHover ? 200 : 50}
45
- height={80}
46
- />
40
+ <div>
47
41
 
48
- <IconeBotao
49
- tipo="round"
50
- toolTipInfo="Sair"
51
- size={'sm'}
52
- variant="transparent"
53
- color="gray"
54
- onClick={sairFunc}
55
- style={{ display: isHover ? 'block' : 'none' }}
56
- className="action-icon"
57
- >
42
+ <S.NavbarHeader className={isHover ? 'nav-hover' : ''}>
58
43
  <Icone
59
- svg={Sair}
60
- width={20}
61
- height={20}
62
- fill={theme.colors.gray['500']}
44
+ svg={LogoHeader}
45
+ className="logo"
46
+ width={isHover ? 200 : 50}
47
+ height={80}
63
48
  />
64
- </IconeBotao>
65
- </S.NavbarHeader>
66
49
 
67
- <>
68
- <S.NabarBody color={color}>
69
- <NavbarTituloHeader
70
- isNavHover={isHover}
71
- color={color}
72
- modulo={modulo}
73
- icon={CiclosEncerrados}
74
- />
75
- <GrupoDeLinks
76
- color={color}
77
- activeLink={activeLink}
78
- links={links}
79
- isNavHover={isHover}
80
- />
81
- </S.NabarBody>
82
- </>
50
+ <IconeBotao
51
+ tipo="round"
52
+ toolTipInfo="Sair"
53
+ size={'sm'}
54
+ variant="transparent"
55
+ color="gray"
56
+ onClick={sairFunc}
57
+ style={{ display: isHover ? 'block' : 'none' }}
58
+ className="action-icon"
59
+ >
60
+ <Icone
61
+ svg={Sair}
62
+ width={20}
63
+ height={20}
64
+ fill={theme.colors.gray['500']}
65
+ />
66
+ </IconeBotao>
67
+ </S.NavbarHeader>
68
+
69
+ <>
70
+ <S.NabarBody color={color}>
71
+ <NavbarTituloHeader
72
+ isNavHover={isHover}
73
+ color={color}
74
+ modulo={modulo}
75
+ icon={CiclosEncerrados}
76
+ />
77
+ <GrupoDeLinks
78
+ color={color}
79
+ activeLink={activeLink}
80
+ links={links}
81
+ isNavHover={isHover}
82
+ />
83
+ </S.NabarBody>
84
+ </>
85
+ </div>
83
86
 
84
87
  <S.NavbarFooter
85
88
  data-active={isHover}
package/src/components/modules/Navbar/styles.ts CHANGED
@@ -13,6 +13,10 @@ export const NavbarWrapper = styled.div<NavbarWrapperProps>`
13
13
  height: 100vh;
14
14
  overflow-y: auto;
15
15
  overflow-x: hidden;
16
+ display: flex;
17
+ align-items: normal;
18
+ justify-content: space-between;
19
+ flex-direction: inherit;
16
20
 
17
21
  .logo {
18
22
  margin: 30px 0;
@@ -30,10 +34,10 @@ export const NavbarHeader = styled.div`
30
34
  display: flex;
31
35
  justify-content: center;
32
36
  gap: 10px;
33
- align-items: center;
37
+ align-items: start;
34
38
 
35
39
  .action-icon {
36
- margin-bottom: 35px;
40
+ margin-top: 15px;
37
41
  }
38
42
  `}
39
43
  `;
@@ -59,6 +63,6 @@ export const NavbarFooter = styled.div`
59
63
  ${({ theme }) => css`
60
64
  text-align: center;
61
65
  color: ${theme.colors.gray['700']};
62
- margin-top: 150px;
66
+ margin-bottom: 30px;
63
67
  `}
64
68
  `;
package/src/components/molecules/CardInicial/CardInicial.stories.tsx CHANGED
@@ -13,8 +13,8 @@ const props: CardInicialProps = {
13
13
  color: theme.colors.blue,
14
14
  descricao: 'exemplo descrição',
15
15
  icone: remuneracao,
16
- link: '/exemplo',
17
16
  titulo: 'exemplo titulo',
17
+ onEntrar: () => console.log('test'),
18
18
  acessoPermitido: false,
19
19
  };
20
20
 
package/src/components/molecules/CardInicial/CardInicial.test.tsx CHANGED
@@ -10,8 +10,8 @@ describe('CardInicial', () => {
10
10
  acessoPermitido: true,
11
11
  descricao: 'exemplo descrição',
12
12
  icone: '',
13
- link: '/exemplo',
14
13
  titulo: 'exemplo titulo',
14
+ onEntrar: () => console.log('test')
15
15
  };
16
16
 
17
17
  it('Renderiza corretamente', () => {
@@ -26,8 +26,6 @@ describe('CardInicial', () => {
26
26
  const { getByText } = render(<CardInicial {...props} />);
27
27
  const botao = getByText('Entrar');
28
28
  fireEvent.click(botao);
29
- const originalLocationAssign = window.location.pathname;
30
- expect(originalLocationAssign).toEqual(props.link);
31
29
  });
32
30
 
33
31
  it('Tem o background correto', () => {
package/src/components/molecules/CardInicial/index.tsx CHANGED
@@ -3,25 +3,23 @@ import Icone from '../../atomos/Icone';
3
3
  import * as S from './styles';
4
4
  import { theme } from '../../../styles/theme';
5
5
  import Botao from '../../atomos/Botao';
6
- import { useNavigate } from 'react-router-dom';
7
6
 
8
7
  export type CardInicialProps = {
9
8
  titulo: string;
10
9
  icone: string;
11
10
  descricao: string;
12
- link: string;
13
11
  color: string;
14
12
  acessoPermitido: boolean;
13
+ onEntrar: () => void
15
14
  };
16
15
  const CardInicial = ({
17
16
  descricao,
18
17
  icone,
19
- link,
18
+ onEntrar,
20
19
  acessoPermitido,
21
20
  titulo,
22
21
  color,
23
22
  }: CardInicialProps) => {
24
- const navigate = useNavigate();
25
23
 
26
24
  return (
27
25
  <S.CardInicialWrapper>
@@ -45,11 +43,7 @@ const CardInicial = ({
45
43
  <S.CardInicialFooter>
46
44
  <Botao
47
45
  tipo="default"
48
- onClick={() => {
49
- if (acessoPermitido) {
50
- window.location.href = link;
51
- }
52
- }}
46
+ onClick={() => onEntrar()}
53
47
  disabled={!acessoPermitido}
54
48
  color={color}
55
49
  >
package/src/components/molecules/Paginacao/index.tsx CHANGED
@@ -60,6 +60,7 @@ const Paginacao = ({
60
60
  onChange={(e) => changeLinhas(e!)}
61
61
  defaultValue={'10'}
62
62
  data={['10', '20', '30']}
63
+ allowDeselect={false}
63
64
  />
64
65
  </div>
65
66
  </div>
package/src/components/molecules/TabelaHeader/index.tsx CHANGED
@@ -85,6 +85,7 @@ const TabelaHeader = <T extends MRT_RowData>({
85
85
  onChange={(_value, option) => setFiltrosPor(option)}
86
86
  value={filtrosPor ? filtrosPor.value : null}
87
87
  placeholder={`Aplicar Filtros`}
88
+ allowDeselect={false}
88
89
  comboboxProps={{
89
90
  position: 'bottom',
90
91
  middlewares: { flip: false, shift: false },
@@ -107,6 +108,7 @@ const TabelaHeader = <T extends MRT_RowData>({
107
108
  ]}
108
109
  onChange={(_value, option) => setOrdenarPor(option)}
109
110
  value={ordenarPor ? ordenarPor.value : null}
111
+ allowDeselect={false}
110
112
  placeholder={`Ordenar por ${ordenarPor}`}
111
113
  maw={200}
112
114
  comboboxProps={{