jornada-ui 0.4.14 → 0.4.15

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 (23) hide show
  1. package/lib/commonjs/components/activities-progress/index.js +10 -10
  2. package/lib/commonjs/components/activities-progress/index.js.map +1 -1
  3. package/lib/commonjs/components/card-work-session/index.js +50 -17
  4. package/lib/commonjs/components/card-work-session/index.js.map +1 -1
  5. package/lib/commonjs/stories/card-work-session/card-work-session.stories.js +62 -9
  6. package/lib/commonjs/stories/card-work-session/card-work-session.stories.js.map +1 -1
  7. package/lib/module/components/activities-progress/index.js +10 -10
  8. package/lib/module/components/activities-progress/index.js.map +1 -1
  9. package/lib/module/components/card-work-session/index.js +50 -17
  10. package/lib/module/components/card-work-session/index.js.map +1 -1
  11. package/lib/module/stories/card-work-session/card-work-session.stories.js +62 -9
  12. package/lib/module/stories/card-work-session/card-work-session.stories.js.map +1 -1
  13. package/lib/typescript/commonjs/src/components/card-work-session/index.d.ts +2 -1
  14. package/lib/typescript/commonjs/src/components/card-work-session/index.d.ts.map +1 -1
  15. package/lib/typescript/commonjs/src/stories/card-work-session/card-work-session.stories.d.ts.map +1 -1
  16. package/lib/typescript/module/src/components/card-work-session/index.d.ts +2 -1
  17. package/lib/typescript/module/src/components/card-work-session/index.d.ts.map +1 -1
  18. package/lib/typescript/module/src/stories/card-work-session/card-work-session.stories.d.ts.map +1 -1
  19. package/package.json +1 -1
  20. package/src/components/activities-progress/index.tsx +172 -172
  21. package/src/components/card-work-session/index.tsx +190 -172
  22. package/src/components/card-work-session/interface.d.ts +151 -150
  23. package/src/stories/card-work-session/card-work-session.stories.tsx +106 -53
package/lib/module/stories/card-work-session/card-work-session.stories.js CHANGED
@@ -7,13 +7,59 @@ const meta = {
7
7
  title: "componente/CardWorkSession",
8
8
  component: CardWorkSession,
9
9
  args: {
10
+ width: "100%",
11
+ counterBadge: 1,
10
12
  name: "Weverson L.S",
11
13
  workDate: "25/01/2025",
12
- timeWork: "",
13
14
  initialTime: "11:40",
14
15
  duration: "05:20",
15
16
  avatar: "https://avatars.githubusercontent.com/u/100369327?v=4&size=64"
16
17
  },
18
+ argTypes: {
19
+ width: {
20
+ control: "number",
21
+ description: "Informa a a largura do componente."
22
+ },
23
+ name: {
24
+ control: "text",
25
+ description: "Informa o nome do usuário."
26
+ },
27
+ workDate: {
28
+ control: "text",
29
+ description: "Informa a data que inicio a jornada."
30
+ },
31
+ initialTime: {
32
+ control: "text",
33
+ description: "Informa o inicio de jornada."
34
+ },
35
+ duration: {
36
+ control: "text",
37
+ description: "Informa a duração de jornada."
38
+ },
39
+ avatar: {
40
+ control: "text",
41
+ description: "Informa a foto do usuário."
42
+ },
43
+ counterBadge: {
44
+ control: "number",
45
+ type: "number",
46
+ description: "Quantidade de mensagem não lidas"
47
+ },
48
+ backgroundColor: {
49
+ control: "text",
50
+ description: "Informa a cor de fundo."
51
+ },
52
+ handleNavigationNotification: {
53
+ control: () => {},
54
+ type: "function",
55
+ description: "Função que navegar para as notificações."
56
+ },
57
+ handleNavigation: {
58
+ control: () => {},
59
+ type: "function",
60
+ description: "Função que navegar para o perfil."
61
+ }
62
+ },
17
63
  parameters: {
18
64
  notes: `
19
65
  # CardWorkSession
@@ -22,11 +68,16 @@ Este é um componente de CardWorkSession de session de trabalho.
22
68
  Você usa assim:
23
69
  \`\`\`tsx
24
70
  <CardWorkSession
25
- name="Weverson L.S"s
26
- workDate="25/01/2025"
27
- initialTime="11:40"
28
- duration="03:45"
29
- avatar={"https://avatars.githubusercontent.com/u/100369327?v=4&size=64"}
71
+ width: 400,
72
+ counterBadge: 1,
73
+ name: "Weverson L.S",
74
+ workDate: "25/01/2025",
75
+ initialTime: "11:40",
76
+ duration: "05:20",
77
+ avatar: "https://avatars.githubusercontent.com/u/100369327?v=4&size=64",
78
+ backgroundColor: theme.colors.gray[300],
79
+ handleNavigationNotification: () => {},
80
+ handleNavigation: () => {},
30
81
  />
31
82
  \`\`\`
32
83
  `
@@ -36,14 +87,16 @@ export default meta;
36
87
  export const CardTrabalhoSession = {
37
88
  name: "card-work-session",
38
89
  args: {
39
- width: 400,
90
+ width: "100%",
91
+ counterBadge: 1,
40
92
  name: "Weverson L.S",
41
93
  workDate: "25/01/2025",
42
- timeWork: "",
43
94
  initialTime: "11:40",
44
95
  duration: "05:20",
45
96
  avatar: "https://avatars.githubusercontent.com/u/100369327?v=4&size=64",
46
- backgroundColor: theme.colors.gray[300]
97
+ backgroundColor: theme.colors.gray[300],
98
+ handleNavigationNotification: () => {},
99
+ handleNavigation: () => {}
47
100
  }
48
101
  };
49
102
  //# sourceMappingURL=card-work-session.stories.js.map
package/lib/module/stories/card-work-session/card-work-session.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["CardWorkSession","theme","meta","title","component","args","name","workDate","timeWork","initialTime","duration","avatar","parameters","notes","CardTrabalhoSession","width","backgroundColor","colors","gray"],"sourceRoot":"..\\..\\..\\..\\src","sources":["stories/card-work-session/card-work-session.stories.tsx"],"mappings":";;AAEA;AACA,OAAOA,eAAe,MAAM,6CAAoC;AAChE,SAASC,KAAK,QAAQ,6BAA0B;AAEhD,MAAMC,IAAkC,GAAG;EACzCC,KAAK,EAAE,4BAA4B;EACnCC,SAAS,EAAEJ,eAAe;EAC1BK,IAAI,EAAE;IACJC,IAAI,EAAE,cAAc;IACpBC,QAAQ,EAAE,YAAY;IACtBC,QAAQ,EAAE,EAAE;IACZC,WAAW,EAAE,OAAO;IACpBC,QAAQ,EAAE,OAAO;IACjBC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAE;IACVC,KAAK,EAAE;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACE;AACF,CAAC;AAED,eAAeX,IAAI;AAInB,OAAO,MAAMY,mBAA0B,GAAG;EACxCR,IAAI,EAAE,mBAAmB;EACzBD,IAAI,EAAE;IACJU,KAAK,EAAE,GAAG;IACVT,IAAI,EAAE,cAAc;IACpBC,QAAQ,EAAE,YAAY;IACtBC,QAAQ,EAAE,EAAE;IACZC,WAAW,EAAE,OAAO;IACpBC,QAAQ,EAAE,OAAO;IACjBC,MAAM,EAAE,+DAA+D;IACvEK,eAAe,EAAEf,KAAK,CAACgB,MAAM,CAACC,IAAI,CAAC,GAAG;EACxC;AACF,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["CardWorkSession","theme","meta","title","component","args","width","counterBadge","name","workDate","initialTime","duration","avatar","argTypes","control","description","type","backgroundColor","handleNavigationNotification","handleNavigation","parameters","notes","CardTrabalhoSession","colors","gray"],"sourceRoot":"..\\..\\..\\..\\src","sources":["stories/card-work-session/card-work-session.stories.tsx"],"mappings":";;AAEA;AACA,OAAOA,eAAe,MAAM,6CAAoC;AAChE,SAASC,KAAK,QAAQ,6BAA0B;AAEhD,MAAMC,IAAkC,GAAG;EACzCC,KAAK,EAAE,4BAA4B;EACnCC,SAAS,EAAEJ,eAAe;EAC1BK,IAAI,EAAE;IACJC,KAAK,EAAE,MAAM;IACbC,YAAY,EAAE,CAAC;IACfC,IAAI,EAAE,cAAc;IACpBC,QAAQ,EAAE,YAAY;IACtBC,WAAW,EAAE,OAAO;IACpBC,QAAQ,EAAE,OAAO;IACjBC,MAAM,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACRP,KAAK,EAAE;MACLQ,OAAO,EAAE,QAAQ;MACjBC,WAAW,EAAE;IACf,CAAC;IACDP,IAAI,EAAE;MACJM,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDN,QAAQ,EAAE;MACRK,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDL,WAAW,EAAE;MACXI,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDJ,QAAQ,EAAE;MACRG,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDH,MAAM,EAAE;MACNE,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDR,YAAY,EAAE;MACZO,OAAO,EAAE,QAAQ;MACjBE,IAAI,EAAE,QAAQ;MACdD,WAAW,EAAE;IACf,CAAC;IACDE,eAAe,EAAE;MACfH,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;IACf,CAAC;IACDG,4BAA4B,EAAE;MAC5BJ,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAC;MACjBE,IAAI,EAAE,UAAU;MAChBD,WAAW,EAAE;IACf,CAAC;IACDI,gBAAgB,EAAE;MAChBL,OAAO,EAAEA,CAAA,KAAM,CAAC,CAAC;MACjBE,IAAI,EAAE,UAAU;MAChBD,WAAW,EAAE;IACf;EACF,CAAC;EACDK,UAAU,EAAE;IACVC,KAAK,EAAE;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACE;AACF,CAAC;AAED,eAAenB,IAAI;AAInB,OAAO,MAAMoB,mBAA0B,GAAG;EACxCd,IAAI,EAAE,mBAAmB;EACzBH,IAAI,EAAE;IACJC,KAAK,EAAE,MAAM;IACbC,YAAY,EAAE,CAAC;IACfC,IAAI,EAAE,cAAc;IACpBC,QAAQ,EAAE,YAAY;IACtBC,WAAW,EAAE,OAAO;IACpBC,QAAQ,EAAE,OAAO;IACjBC,MAAM,EAAE,+DAA+D;IACvEK,eAAe,EAAEhB,KAAK,CAACsB,MAAM,CAACC,IAAI,CAAC,GAAG,CAAC;IACvCN,4BAA4B,EAAEA,CAAA,KAAM,CAAC,CAAC;IACtCC,gBAAgB,EAAEA,CAAA,KAAM,CAAC;EAC3B;AACF,CAAC","ignoreList":[]}
package/lib/typescript/commonjs/src/components/card-work-session/index.d.ts CHANGED
@@ -8,11 +8,12 @@ import React from "react";
8
8
  declare const _default: React.ComponentType<import("react-native").ViewProps & {
9
9
  name: string;
10
10
  workDate: string;
11
- timeWork?: string;
12
11
  initialTime?: string;
13
12
  duration?: string;
14
13
  avatar: string;
15
14
  handleNavigation: () => void;
15
+ handleNavigationNotification: () => void;
16
+ counterBadge: number;
16
17
  children?: React.ReactNode;
17
18
  testID?: string;
18
19
  borderStyled?: {
package/lib/typescript/commonjs/src/components/card-work-session/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/card-work-session/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAqK1C;;GAEG;;;;;;;;;;;;mBApIa,CAAC;oBAC6B,CAAC;4BACD,CAAC;2BAE3B,CAAC;+BACd,CAAC;8BAIF,CADA;mBAEA,CAAL;uBAEa,CAAC;wBACe,CAAC;sBAEvB,CAAP;yBAE4B,CAAC;mBAElB,CAAT;yBACW,CAAA;uBACI,CAAC;wBACI,CAAC;sBACJ,CAAC;;;kBAO2B,CAAC;iBACa,CAAC;YAE5B,CAAC;qBACN,CAAC;gBAEZ,CAAC;iBACK,CAAC;sBAGX,CAAC;;;cAYC,CAAC;kBACJ,CAAR;mBACM,CAAH;iBAGK,CAAN;oBACa,CAAC;;;eAaH,CAAC;mBACU,CAAC;oBAEvB,CADwB;kBAItB,CAAV;qBACY,CAAC;;;;;;;gBAwCiB,CAAC;iBACjB,CAD0C;qBAC7B,CAAC;qBAElB,CAAC;;;AAYX,wBAAgD"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/card-work-session/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAuL1C;;GAEG;;;;;;;;;;;;;mBApJK,CAAJ;oBACI,CAAL;4BAAmD,CAAC;2BAE1B,CAAC;+BAEtB,CAAN;8BAGQ,CAAC;mBAEH,CAAP;uBACyB,CAAC;wBAEjB,CAAV;sBAEM,CAAH;yBACwC,CAAC;mBAE5B,CAAC;yBAEH,CAAX;uBACW,CAAP;wBACO,CAAR;sBAA4B,CAAC;;;kBAO2B,CAAC;iBACa,CAAC;YAG/D,CAAL;qBAAoC,CAAC;gBAEX,CAAC;iBAExB,CAAV;sBAGY,CAAV;;;cAW8B,CAAC;kBACb,CAAC;mBAEb,CAAC;iBAGO,CAAC;oBAA2C,CAAC;;;eAO/C,CAAZ;mBACc,CAAL;oBAA2C,CAAC;kBACxB,CAAA;qBACZ,CAAC;;;;;;;gBAyCR,CAAb;iBAAuB,CAAC;qBAA2B,CAAC;qBAGzC,CAAN;;;AAsCN,wBAAgD"}
package/lib/typescript/commonjs/src/stories/card-work-session/card-work-session.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"card-work-session.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/stories/card-work-session/card-work-session.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAGjE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CA4BtC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,mBAAmB,EAAE,KAYjC,CAAC"}
1
+ {"version":3,"file":"card-work-session.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/stories/card-work-session/card-work-session.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAGjE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CA+EtC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,mBAAmB,EAAE,KAcjC,CAAC"}
package/lib/typescript/module/src/components/card-work-session/index.d.ts CHANGED
@@ -8,11 +8,12 @@ import React from "react";
8
8
  declare const _default: React.ComponentType<import("react-native").ViewProps & {
9
9
  name: string;
10
10
  workDate: string;
11
- timeWork?: string;
12
11
  initialTime?: string;
13
12
  duration?: string;
14
13
  avatar: string;
15
14
  handleNavigation: () => void;
15
+ handleNavigationNotification: () => void;
16
+ counterBadge: number;
16
17
  children?: React.ReactNode;
17
18
  testID?: string;
18
19
  borderStyled?: {
package/lib/typescript/module/src/components/card-work-session/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/card-work-session/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAqK1C;;GAEG;;;;;;;;;;;;mBApIa,CAAC;oBAC6B,CAAC;4BACD,CAAC;2BAE3B,CAAC;+BACd,CAAC;8BAIF,CADA;mBAEA,CAAL;uBAEa,CAAC;wBACe,CAAC;sBAEvB,CAAP;yBAE4B,CAAC;mBAElB,CAAT;yBACW,CAAA;uBACI,CAAC;wBACI,CAAC;sBACJ,CAAC;;;kBAO2B,CAAC;iBACa,CAAC;YAE5B,CAAC;qBACN,CAAC;gBAEZ,CAAC;iBACK,CAAC;sBAGX,CAAC;;;cAYC,CAAC;kBACJ,CAAR;mBACM,CAAH;iBAGK,CAAN;oBACa,CAAC;;;eAaH,CAAC;mBACU,CAAC;oBAEvB,CADwB;kBAItB,CAAV;qBACY,CAAC;;;;;;;gBAwCiB,CAAC;iBACjB,CAD0C;qBAC7B,CAAC;qBAElB,CAAC;;;AAYX,wBAAgD"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/card-work-session/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAuL1C;;GAEG;;;;;;;;;;;;;mBApJK,CAAJ;oBACI,CAAL;4BAAmD,CAAC;2BAE1B,CAAC;+BAEtB,CAAN;8BAGQ,CAAC;mBAEH,CAAP;uBACyB,CAAC;wBAEjB,CAAV;sBAEM,CAAH;yBACwC,CAAC;mBAE5B,CAAC;yBAEH,CAAX;uBACW,CAAP;wBACO,CAAR;sBAA4B,CAAC;;;kBAO2B,CAAC;iBACa,CAAC;YAG/D,CAAL;qBAAoC,CAAC;gBAEX,CAAC;iBAExB,CAAV;sBAGY,CAAV;;;cAW8B,CAAC;kBACb,CAAC;mBAEb,CAAC;iBAGO,CAAC;oBAA2C,CAAC;;;eAO/C,CAAZ;mBACc,CAAL;oBAA2C,CAAC;kBACxB,CAAA;qBACZ,CAAC;;;;;;;gBAyCR,CAAb;iBAAuB,CAAC;qBAA2B,CAAC;qBAGzC,CAAN;;;AAsCN,wBAAgD"}
package/lib/typescript/module/src/stories/card-work-session/card-work-session.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"card-work-session.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/stories/card-work-session/card-work-session.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAGjE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CA4BtC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,mBAAmB,EAAE,KAYjC,CAAC"}
1
+ {"version":3,"file":"card-work-session.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/stories/card-work-session/card-work-session.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAGjE,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CA+EtC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,mBAAmB,EAAE,KAcjC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jornada-ui",
3
- "version": "0.4.14",
3
+ "version": "0.4.15",
4
4
  "description": "Biblioteca para desenvolvimento dos componentes para utilizar nos app",
5
5
  "source": "./src/index.tsx",
6
6
  "main": "./lib/commonjs/index.js",
package/src/components/activities-progress/index.tsx CHANGED
@@ -1,172 +1,172 @@
1
- /**
2
- * IMPORTS
3
- */
4
- import React from "react";
5
-
6
- // components
7
- import Box from "../../components/box";
8
- import Typography from "../../components/typography";
9
-
10
- //commons/ icons
11
- import { Icons } from "../../common/icons-svg";
12
-
13
- // utils
14
- import { getIconByProperty } from "../../utils/get-icon-by-property";
15
-
16
- // typings
17
- import type { IActivitiesProgress } from "./interface";
18
- import { asBaseComponent } from "../../@types/as-base-component";
19
-
20
- // styles
21
- import { theme } from "../../styles/theme/theme";
22
-
23
- const ActivitiesProgress: React.FC<IActivitiesProgress> = ({
24
- data_inicio_horario = "11/05/2025",
25
- duracao = "00:30",
26
- data_inicio = "17:20",
27
- titleLabel = "Descanso",
28
- criado_ofiline = true,
29
- tipo_atividade = "Descanso",
30
- referencia = "repouso_noturno",
31
- }) => {
32
- return (
33
- <Box
34
- width={"100%"}
35
- height={100}
36
- backgroundColor={theme.colors.neutral[25]}
37
- borderStyled={{ borderRadius: theme.borderWidths.thick_medium }}
38
- >
39
- <Box
40
- width={"100%"}
41
- height={30}
42
- backgroundColor={theme.colors.blue[400]}
43
- borderStyled={{
44
- borderTopLeftRadius: theme.borderWidths.thin_bold,
45
- borderTopRightRadius: theme.borderWidths.thin_bold,
46
- borderColor: theme.colors.blue[400],
47
- }}
48
- flexStyle={{
49
- justifyContent: "space-between",
50
- flexDirection: "row",
51
- }}
52
- >
53
- <Box
54
- flexStyle={{
55
- flexDirection: "row",
56
- alignItems: "center",
57
- }}
58
- >
59
- <Typography
60
- text={"Status: "}
61
- color={theme.colors.neutral[25]}
62
- size={theme.fontSizes.sm}
63
- fontFamily={theme.fonts.inter_medium_500}
64
- fontWeight={"500"}
65
- lineHeight={theme.fontSizes.lg}
66
- marginLeft={theme.margins["2xs"]}
67
- />
68
- <Typography
69
- text={titleLabel}
70
- color={
71
- tipo_atividade === "trabalho" ? theme.colors.green[400] : theme.colors.orange[500]
72
- }
73
- size={theme.fontSizes.sm}
74
- fontFamily={theme.fonts.inter_semi_bold_600}
75
- fontWeight={"600"}
76
- lineHeight={theme.fontSizes.lg}
77
- />
78
- </Box>
79
-
80
- <Box
81
- style={{ marginRight: theme.margins["2xs"], marginTop: theme.margins["1xs"] }}
82
- height={20}
83
- width={20}
84
- >
85
- <Icons
86
- icon={"CHECK_OUTLINE"}
87
- color={criado_ofiline ? theme.colors.green[400] : theme.colors.orange[500]}
88
- />
89
- </Box>
90
- </Box>
91
-
92
- <Box
93
- width={"100%"}
94
- flexStyle={{
95
- flexDirection: "row",
96
- justifyContent: "space-between",
97
- }}
98
- paddingStyle={{
99
- padding: theme.paddings["2xs"],
100
- }}
101
- >
102
- <Box height={20} flexStyle={{ flexDirection: "row", alignItems: "center" }}>
103
- {getIconByProperty(referencia)}
104
- <Typography
105
- text={data_inicio}
106
- color={theme.colors.black[25]}
107
- size={theme.fontSizes.xs}
108
- fontFamily={theme.fonts.inter_bold_700}
109
- fontWeight={"700"}
110
- lineHeight={theme.fontSizes.lg}
111
- marginLeft={4}
112
- />
113
- </Box>
114
-
115
- <Box height={50} flexStyle={{ flexDirection: "row", alignItems: "flex-end" }}>
116
- <Box
117
- flexStyle={{ alignItems: "center" }}
118
- marginStyle={{ marginRight: theme.margins["2xs"] }}
119
- >
120
- <Typography
121
- text={data_inicio_horario}
122
- color={theme.colors.blue[500]}
123
- size={theme.fontSizes.sm}
124
- fontFamily={theme.fonts.inter_bold}
125
- fontWeight={"700"}
126
- lineHeight={theme.fontSizes.md}
127
- />
128
- <Typography
129
- text={"INICIO"}
130
- color={theme.colors.gray[600]}
131
- size={theme.fontSizes["2xs"]}
132
- fontFamily={theme.fonts.inter_medium_500}
133
- fontWeight={"500"}
134
- lineHeight={theme.fontSizes.xs}
135
- marginTop={4}
136
- />
137
- </Box>
138
-
139
- <Box
140
- flexStyle={{ alignItems: "center" }}
141
- marginStyle={{ marginRight: theme.margins["2xs"] }}
142
- >
143
- <Typography
144
- text={duracao}
145
- color={theme.colors.blue[500]}
146
- size={theme.fontSizes.sm}
147
- fontFamily={theme.fonts.inter_bold}
148
- fontWeight={"700"}
149
- lineHeight={theme.fontSizes.md}
150
- />
151
- <Typography
152
- text={"DURAÇÃO"}
153
- color={theme.colors.gray[600]}
154
- size={theme.fontSizes["2xs"]}
155
- fontFamily={theme.fonts.inter_medium_500}
156
- fontWeight={"500"}
157
- lineHeight={theme.fontSizes.xs}
158
- marginTop={4}
159
- />
160
- </Box>
161
- </Box>
162
- </Box>
163
- </Box>
164
- );
165
- };
166
-
167
- ActivitiesProgress.displayName = "ActivitiesProgress";
168
-
169
- /**
170
- * Componente Box para a interação da ui.
171
- */
172
- export default asBaseComponent(ActivitiesProgress);
1
+ /**
2
+ * IMPORTS
3
+ */
4
+ import React from "react";
5
+
6
+ // components
7
+ import Box from "../../components/box";
8
+ import Typography from "../../components/typography";
9
+
10
+ //commons/ icons
11
+ import { Icons } from "../../common/icons-svg";
12
+
13
+ // utils
14
+ import { getIconByProperty } from "../../utils/get-icon-by-property";
15
+
16
+ // typings
17
+ import type { IActivitiesProgress } from "./interface";
18
+ import { asBaseComponent } from "../../@types/as-base-component";
19
+
20
+ // styles
21
+ import { theme } from "../../styles/theme/theme";
22
+
23
+ const ActivitiesProgress: React.FC<IActivitiesProgress> = ({
24
+ data_inicio_horario = "00/00/0000",
25
+ duracao = "00:00",
26
+ data_inicio = "00:00",
27
+ titleLabel = "Sem Atividade",
28
+ criado_ofiline = true,
29
+ tipo_atividade = "descanso",
30
+ referencia = "descanso",
31
+ }) => {
32
+ return (
33
+ <Box
34
+ width={"100%"}
35
+ height={100}
36
+ backgroundColor={theme.colors.neutral[25]}
37
+ borderStyled={{ borderRadius: theme.borderWidths.thick_medium }}
38
+ >
39
+ <Box
40
+ width={"100%"}
41
+ height={30}
42
+ backgroundColor={theme.colors.blue[400]}
43
+ borderStyled={{
44
+ borderTopLeftRadius: theme.borderWidths.thin_bold,
45
+ borderTopRightRadius: theme.borderWidths.thin_bold,
46
+ borderColor: theme.colors.blue[400],
47
+ }}
48
+ flexStyle={{
49
+ justifyContent: "space-between",
50
+ flexDirection: "row",
51
+ }}
52
+ >
53
+ <Box
54
+ flexStyle={{
55
+ flexDirection: "row",
56
+ alignItems: "center",
57
+ }}
58
+ >
59
+ <Typography
60
+ text={"Status: "}
61
+ color={theme.colors.neutral[25]}
62
+ size={theme.fontSizes.sm}
63
+ fontFamily={theme.fonts.inter_medium_500}
64
+ fontWeight={"500"}
65
+ lineHeight={theme.fontSizes.lg}
66
+ marginLeft={theme.margins["2xs"]}
67
+ />
68
+ <Typography
69
+ text={titleLabel}
70
+ color={
71
+ tipo_atividade === "trabalho" ? theme.colors.green[400] : theme.colors.orange[500]
72
+ }
73
+ size={theme.fontSizes.sm}
74
+ fontFamily={theme.fonts.inter_semi_bold_600}
75
+ fontWeight={"600"}
76
+ lineHeight={theme.fontSizes.lg}
77
+ />
78
+ </Box>
79
+
80
+ <Box
81
+ style={{ marginRight: theme.margins["2xs"], marginTop: theme.margins["1xs"] }}
82
+ height={20}
83
+ width={20}
84
+ >
85
+ <Icons
86
+ icon={"CHECK_OUTLINE"}
87
+ color={criado_ofiline ? theme.colors.green[400] : theme.colors.orange[500]}
88
+ />
89
+ </Box>
90
+ </Box>
91
+
92
+ <Box
93
+ width={"100%"}
94
+ flexStyle={{
95
+ flexDirection: "row",
96
+ justifyContent: "space-between",
97
+ }}
98
+ paddingStyle={{
99
+ padding: theme.paddings["2xs"],
100
+ }}
101
+ >
102
+ <Box height={20} flexStyle={{ flexDirection: "row", alignItems: "center" }}>
103
+ {getIconByProperty(referencia)}
104
+ <Typography
105
+ text={data_inicio}
106
+ color={theme.colors.black[25]}
107
+ size={theme.fontSizes.xs}
108
+ fontFamily={theme.fonts.inter_bold_700}
109
+ fontWeight={"700"}
110
+ lineHeight={theme.fontSizes.lg}
111
+ marginLeft={4}
112
+ />
113
+ </Box>
114
+
115
+ <Box height={50} flexStyle={{ flexDirection: "row", alignItems: "flex-end" }}>
116
+ <Box
117
+ flexStyle={{ alignItems: "center" }}
118
+ marginStyle={{ marginRight: theme.margins["2xs"] }}
119
+ >
120
+ <Typography
121
+ text={data_inicio_horario}
122
+ color={theme.colors.blue[500]}
123
+ size={theme.fontSizes.sm}
124
+ fontFamily={theme.fonts.inter_bold}
125
+ fontWeight={"700"}
126
+ lineHeight={theme.fontSizes.md}
127
+ />
128
+ <Typography
129
+ text={"INICIO"}
130
+ color={theme.colors.gray[600]}
131
+ size={theme.fontSizes["2xs"]}
132
+ fontFamily={theme.fonts.inter_medium_500}
133
+ fontWeight={"500"}
134
+ lineHeight={theme.fontSizes.xs}
135
+ marginTop={4}
136
+ />
137
+ </Box>
138
+
139
+ <Box
140
+ flexStyle={{ alignItems: "center" }}
141
+ marginStyle={{ marginRight: theme.margins["2xs"] }}
142
+ >
143
+ <Typography
144
+ text={duracao}
145
+ color={theme.colors.blue[500]}
146
+ size={theme.fontSizes.sm}
147
+ fontFamily={theme.fonts.inter_bold}
148
+ fontWeight={"700"}
149
+ lineHeight={theme.fontSizes.md}
150
+ />
151
+ <Typography
152
+ text={"DURAÇÃO"}
153
+ color={theme.colors.gray[600]}
154
+ size={theme.fontSizes["2xs"]}
155
+ fontFamily={theme.fonts.inter_medium_500}
156
+ fontWeight={"500"}
157
+ lineHeight={theme.fontSizes.xs}
158
+ marginTop={4}
159
+ />
160
+ </Box>
161
+ </Box>
162
+ </Box>
163
+ </Box>
164
+ );
165
+ };
166
+
167
+ ActivitiesProgress.displayName = "ActivitiesProgress";
168
+
169
+ /**
170
+ * Componente Box para a interação da ui.
171
+ */
172
+ export default asBaseComponent(ActivitiesProgress);