componenteshospitais 1.0.2 → 1.0.3

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 (41) hide show
  1. package/dist/cjs/index.js +134 -0
  2. package/dist/cjs/index.js.map +1 -0
  3. package/dist/esm/index.js +126 -0
  4. package/dist/esm/index.js.map +1 -0
  5. package/dist/types/components/Button.d.ts +8 -0
  6. package/dist/types/components/Card.d.ts +10 -0
  7. package/dist/types/components/CardImage.d.ts +9 -0
  8. package/dist/types/components/InputField.d.ts +11 -0
  9. package/dist/types/components/InputSubmit.d.ts +6 -0
  10. package/dist/types/components/MenuPage.d.ts +13 -0
  11. package/dist/types/components/TextPage.d.ts +8 -0
  12. package/dist/types/components/TituloPagina.d.ts +8 -0
  13. package/dist/types/index.d.ts +8 -0
  14. package/package.json +42 -31
  15. package/rollup.config.mjs +47 -0
  16. package/src/components/Button.tsx +22 -6
  17. package/src/components/Card.tsx +36 -0
  18. package/src/components/CardImage.tsx +32 -0
  19. package/src/components/InputField.tsx +30 -0
  20. package/src/components/MenuPage.tsx +40 -0
  21. package/src/components/TextPage.tsx +36 -0
  22. package/src/components/TituloPagina.tsx +23 -0
  23. package/src/components/base.txt +18 -0
  24. package/src/index.tsx +10 -1
  25. package/src/styles/card.module.css +43 -0
  26. package/src/styles/cardImage.module.css +45 -0
  27. package/src/styles/geral.css +20 -0
  28. package/src/styles/input.module.css +45 -0
  29. package/src/styles/menuPage.module.css +56 -0
  30. package/src/styles/textPage.module.css +60 -0
  31. package/src/styles/tituloPagina.module.css +72 -0
  32. package/tsconfig.json +9 -4
  33. package/.babelrc +0 -4
  34. package/dist/components/Button.d.ts +0 -6
  35. package/dist/components/Input.d.ts +0 -6
  36. package/dist/components/index.d.ts +0 -2
  37. package/dist/index.d.ts +0 -1
  38. package/dist/index.js +0 -1
  39. package/src/components/Input.tsx +0 -10
  40. package/src/components/index.ts +0 -2
  41. package/webpack.config.js +0 -28
@@ -0,0 +1,134 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+
5
+ function styleInject(css, ref) {
6
+ if ( ref === void 0 ) ref = {};
7
+ var insertAt = ref.insertAt;
8
+
9
+ if (!css || typeof document === 'undefined') { return; }
10
+
11
+ var head = document.head || document.getElementsByTagName('head')[0];
12
+ var style = document.createElement('style');
13
+ style.type = 'text/css';
14
+
15
+ if (insertAt === 'top') {
16
+ if (head.firstChild) {
17
+ head.insertBefore(style, head.firstChild);
18
+ } else {
19
+ head.appendChild(style);
20
+ }
21
+ } else {
22
+ head.appendChild(style);
23
+ }
24
+
25
+ if (style.styleSheet) {
26
+ style.styleSheet.cssText = css;
27
+ } else {
28
+ style.appendChild(document.createTextNode(css));
29
+ }
30
+ }
31
+
32
+ var css_248z$6 = ":root{--blue:#1e2057;--blueHover:#242881;--red:#eb313d;--redHover:#9e0f18;--gray:#5d5d5d;--greyHover:#e4e2e2;--lightGray:#ededed;--green:#00984b;--greenHover:#14a857;--lightblue:#006cb7;--lightblueHover:#187bb2}html{font-family:Amelia,sans-serif;margin:0;padding:0;width:100%}";
33
+ styleInject(css_248z$6);
34
+
35
+ var css_248z$5 = ".tituloPagina-module_header__GtitI{align-items:center;border-radius:8px 8px 0 0;color:#fff;display:flex;font-size:23px;justify-content:space-between;padding:10px 20px;position:relative}.tituloPagina-module_title__pb7Iz{font-size:24px;font-weight:700;margin-left:5rem}.tituloPagina-module_backButton__QlSV1{align-items:center;background-color:#fff;border:none;border-radius:20px;cursor:pointer;display:flex;font-size:14px;font-weight:700;height:auto;margin:0 5rem 0 0;padding:10px 50px}.tituloPagina-module_backButton__QlSV1:hover{background-color:var(--greyHover)}@media (max-width:768px){.tituloPagina-module_title__pb7Iz{font-size:16px;margin-left:1rem}}@media (max-width:500px){.tituloPagina-module_backButton__QlSV1{margin-right:0;padding:10px 30px}}.tituloPagina-module_empresa1__sInrz .tituloPagina-module_header__GtitI{background-color:var(--blue)}.tituloPagina-module_empresa1__sInrz .tituloPagina-module_backButton__QlSV1{color:var(--blue)}.tituloPagina-module_empresa3__sn4GV .tituloPagina-module_header__GtitI{background-color:var(--green)}.tituloPagina-module_empresa3__sn4GV .tituloPagina-module_backButton__QlSV1{color:var(--green)}";
36
+ var styles$5 = {"header":"tituloPagina-module_header__GtitI","title":"tituloPagina-module_title__pb7Iz","backButton":"tituloPagina-module_backButton__QlSV1","empresa1":"tituloPagina-module_empresa1__sInrz","empresa3":"tituloPagina-module_empresa3__sn4GV"};
37
+ styleInject(css_248z$5);
38
+
39
+ var TituloPagina = function (_a) {
40
+ var titulo = _a.titulo, onClick = _a.onClick, empresa = _a.empresa;
41
+ var empresaClass = styles$5["empresa".concat(empresa)];
42
+ return (React.createElement("div", { className: "".concat(empresaClass) },
43
+ React.createElement("div", { className: styles$5.header },
44
+ React.createElement("p", { className: styles$5.title }, titulo),
45
+ React.createElement("button", { onClick: onClick, className: styles$5.backButton }, "Voltar"))));
46
+ };
47
+
48
+ var css_248z$4 = ".card-module_icone__8F-jV{height:55px;width:55px}.card-module_item__YYEzi{align-items:center;border-radius:10px;color:#fff;display:flex;font-size:18px;margin-bottom:1rem;padding:15px}.card-module_imgLateral__zCZz5{height:55px;margin-left:auto;margin-right:10px;width:55px}.card-module_empresa1__Jl5OB .card-module_item__YYEzi{background-color:var(--blue)}.card-module_empresa1__Jl5OB .card-module_item__YYEzi:hover{background-color:var(--red)}.card-module_empresa3__TCJpW .card-module_item__YYEzi{background-color:var(--green)}.card-module_empresa3__TCJpW .card-module_item__YYEzi:hover{background-color:var(--lightblue)}";
49
+ var styles$4 = {"icone":"card-module_icone__8F-jV","item":"card-module_item__YYEzi","imgLateral":"card-module_imgLateral__zCZz5","empresa1":"card-module_empresa1__Jl5OB","empresa3":"card-module_empresa3__TCJpW"};
50
+ styleInject(css_248z$4);
51
+
52
+ var Card = function (_a) {
53
+ var img = _a.img, imgLateral = _a.imgLateral, text = _a.text, link = _a.link, empresa = _a.empresa;
54
+ var empresaClass = styles$4["empresa".concat(empresa)];
55
+ var handleClick = function () {
56
+ if (link) {
57
+ window.location.href = link;
58
+ }
59
+ };
60
+ return (React.createElement("div", { className: "".concat(empresaClass), onClick: handleClick, style: { cursor: link ? 'pointer' : 'default' } },
61
+ React.createElement("div", { className: "".concat(styles$4.item, " empresa").concat(empresa) },
62
+ img && (React.createElement("img", { src: img, alt: text, className: styles$4.icone })),
63
+ React.createElement("span", { className: styles$4.texto }, text),
64
+ imgLateral && (React.createElement("img", { src: imgLateral, alt: "Right", className: styles$4.imgLateral })))));
65
+ };
66
+
67
+ var css_248z$3 = ".cardImage-module_botaoCert__Rs0fg{align-items:center;border-color:transparent;border-radius:1rem;color:#fff;display:flex;flex-direction:column;height:170px;justify-content:center;padding:.8rem;text-decoration:none;width:250px}.cardImage-module_iconeOna__WQil5{height:150px}.cardImage-module_cardText__NfgFE{bottom:.5rem;font-size:18px;position:relative}.cardImage-module_empresa1__SnbEU .cardImage-module_botaoCert__Rs0fg{background-color:var(--blue)}.cardImage-module_empresa1__SnbEU .cardImage-module_botaoCert__Rs0fg:hover{background-color:var(--red)}.cardImage-module_empresa3__ItFp0 .cardImage-module_botaoCert__Rs0fg{background-color:var(--green)}.cardImage-module_empresa3__ItFp0 .cardImage-module_botaoCert__Rs0fg:hover{background-color:var(--lightblue)}";
68
+ var styles$3 = {"botaoCert":"cardImage-module_botaoCert__Rs0fg","iconeOna":"cardImage-module_iconeOna__WQil5","cardText":"cardImage-module_cardText__NfgFE","empresa1":"cardImage-module_empresa1__SnbEU","empresa3":"cardImage-module_empresa3__ItFp0"};
69
+ styleInject(css_248z$3);
70
+
71
+ var CardImage = function (_a) {
72
+ var img = _a.img, href = _a.href, texto = _a.texto, empresa = _a.empresa;
73
+ var empresaClass = styles$3["empresa".concat(empresa)];
74
+ return (React.createElement("div", { className: "".concat(empresaClass) },
75
+ React.createElement("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: "".concat(styles$3.botaoCert, " empresa").concat(empresa), title: href },
76
+ React.createElement("img", { src: img, alt: img, className: styles$3.iconeOna }),
77
+ texto && (React.createElement("text", { className: styles$3.cardText }, texto)))));
78
+ };
79
+
80
+ var css_248z$2 = ".input-module_inputSubmit__21-Pj{align-self:center;border:none;border-radius:20px;color:#fff;cursor:pointer;font-size:15px;padding:10px;width:10rem}.input-module_inputPadrao__jypjY{border:1px solid #ccc;border-radius:.5rem;font-style:italic;padding:.8rem 0 .8rem 1rem;width:100%}.input-module_inputPadrao__jypjY:focus{outline:none}.input-module_empresa1__bxBov .input-module_inputSubmit__21-Pj{background-color:var(--blue)}.input-module_empresa1__bxBov .input-module_inputSubmit__21-Pj:hover{background-color:var(--red)}.input-module_empresa3__RU89A .input-module_inputSubmit__21-Pj{background-color:var(--green)}.input-module_empresa3__RU89A .input-module_inputSubmit__21-Pj:hover{background-color:var(--lightblue)}";
81
+ var styles$2 = {"inputSubmit":"input-module_inputSubmit__21-Pj","inputPadrao":"input-module_inputPadrao__jypjY","empresa1":"input-module_empresa1__bxBov","empresa3":"input-module_empresa3__RU89A"};
82
+ styleInject(css_248z$2);
83
+
84
+ var Button = function (_a) {
85
+ var empresa = _a.empresa, _b = _a.type, type = _b === void 0 ? 'submit' : _b, onClick = _a.onClick;
86
+ var empresaClass = styles$2["empresa".concat(empresa)];
87
+ return (React.createElement("div", { className: "".concat(empresaClass) }, type === 'submit' ? (React.createElement("input", { type: "submit", className: styles$2.inputSubmit })) : (React.createElement("button", { type: "button", className: styles$2.inputSubmit, onClick: onClick }, "Button"))));
88
+ };
89
+
90
+ var InputField = function (_a) {
91
+ var type = _a.type, id = _a.id, placeholder = _a.placeholder, onChange = _a.onChange, value = _a.value, label = _a.label;
92
+ return (React.createElement(React.Fragment, null,
93
+ label && React.createElement("label", { htmlFor: id }, label),
94
+ React.createElement("input", { type: type, id: id, name: id, value: value, placeholder: placeholder, onChange: onChange, className: styles$2.inputPadrao })));
95
+ };
96
+
97
+ var css_248z$1 = ".textPage-module_container__GBEF6{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:20px}.textPage-module_content__CpD68{display:flex;text-align:justify}.textPage-module_imageCabecalho__J6YFH{border-radius:8px}.textPage-module_imageCabecalho__J6YFH img{border-radius:8px;height:100%;object-fit:cover;width:100%}.textPage-module_contentWithLateralImage__-f5pQ{flex-direction:row}.textPage-module_imageLateral__Dy9Kx{align-self:flex-start;height:230px;margin-right:20px;margin-top:15px;width:300px}.textPage-module_imageLateral__Dy9Kx img{border-radius:8px;height:100%;object-fit:cover;width:100%}.textPage-module_text__3pwuU{color:#5d5d5d;flex:2;line-height:1.8;text-align:justify}.textPage-module_text__3pwuU p{line-height:1.6;margin:10px 0}.textPage-module_text__3pwuU .textPage-module_coordenacao__UypV-,.textPage-module_text__3pwuU .textPage-module_direcao__x5psb{font-weight:700;margin-top:20px}";
98
+ var styles$1 = {"container":"textPage-module_container__GBEF6","content":"textPage-module_content__CpD68","imageCabecalho":"textPage-module_imageCabecalho__J6YFH","contentWithLateralImage":"textPage-module_contentWithLateralImage__-f5pQ","imageLateral":"textPage-module_imageLateral__Dy9Kx","text":"textPage-module_text__3pwuU","coordenacao":"textPage-module_coordenacao__UypV-","direcao":"textPage-module_direcao__x5psb"};
99
+ styleInject(css_248z$1);
100
+
101
+ var TextPage = function (_a) {
102
+ var imgLateral = _a.imgLateral, imgCabecalho = _a.imgCabecalho, texto = _a.texto;
103
+ return (React.createElement(React.Fragment, null,
104
+ React.createElement("div", { className: styles$1.container },
105
+ imgCabecalho && (React.createElement("div", { className: styles$1.imageCabecalho },
106
+ React.createElement("img", { src: imgCabecalho, alt: imgCabecalho }))),
107
+ React.createElement("div", { className: "".concat(styles$1.content, " ").concat(imgLateral ? styles$1.contentWithLateralImage : '') },
108
+ imgLateral && (React.createElement("div", { className: styles$1.imageLateral },
109
+ React.createElement("img", { src: imgLateral, alt: imgLateral }))),
110
+ React.createElement("div", { className: styles$1.text, dangerouslySetInnerHTML: { __html: texto } })))));
111
+ };
112
+
113
+ var css_248z = ".menuPage-module_container__grjEI{color:#000;display:flex;height:100%}.menuPage-module_sidebar__7Kg1S{background-color:#fff;border-right:1px solid #ddd;height:500px;max-height:500px;overflow-y:auto;padding-bottom:15px;width:250px}.menuPage-module_sidebar__7Kg1S ul{list-style:none;margin:0;padding:0}.menuPage-module_sidebar__7Kg1S ul li{margin:10px 0}.menuPage-module_sidebar__7Kg1S ul li button{background:none;border:none;color:var(--blue);cursor:pointer;font-weight:700;padding:10px;text-align:left;text-decoration:none;width:100%}.menuPage-module_sidebar__7Kg1S ul li button.menuPage-module_active__Mfy4T{background-color:var(--lightGray);border-left:4px solid var(--blue)}.menuPage-module_content__g2T-d{background-color:#fff;flex:1;max-height:475px;overflow-y:auto;padding:20px}@media (max-width:800px){.menuPage-module_sidebar__7Kg1S{width:160px}}";
114
+ var styles = {"container":"menuPage-module_container__grjEI","sidebar":"menuPage-module_sidebar__7Kg1S","active":"menuPage-module_active__Mfy4T","content":"menuPage-module_content__g2T-d"};
115
+ styleInject(css_248z);
116
+
117
+ var MenuPage = function (_a) {
118
+ var menus = _a.menus, contents = _a.contents;
119
+ var _b = React.useState(menus[0].key), selectedSection = _b[0], setSelectedSection = _b[1];
120
+ return (React.createElement("div", { className: styles.container },
121
+ React.createElement("nav", { className: styles.sidebar },
122
+ React.createElement("ul", null, menus.map(function (menu) { return (React.createElement("li", { key: menu.key },
123
+ React.createElement("button", { className: selectedSection === menu.key ? styles.active : '', onClick: function () { return setSelectedSection(menu.key); } }, menu.label))); }))),
124
+ React.createElement("main", { className: styles.content }, contents[selectedSection])));
125
+ };
126
+
127
+ exports.Button = Button;
128
+ exports.Card = Card;
129
+ exports.CardImage = CardImage;
130
+ exports.InputField = InputField;
131
+ exports.MenuPage = MenuPage;
132
+ exports.TextPage = TextPage;
133
+ exports.TituloPagina = TituloPagina;
134
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\r\n if ( ref === void 0 ) ref = {};\r\n var insertAt = ref.insertAt;\r\n\r\n if (!css || typeof document === 'undefined') { return; }\r\n\r\n var head = document.head || document.getElementsByTagName('head')[0];\r\n var style = document.createElement('style');\r\n style.type = 'text/css';\r\n\r\n if (insertAt === 'top') {\r\n if (head.firstChild) {\r\n head.insertBefore(style, head.firstChild);\r\n } else {\r\n head.appendChild(style);\r\n }\r\n } else {\r\n head.appendChild(style);\r\n }\r\n\r\n if (style.styleSheet) {\r\n style.styleSheet.cssText = css;\r\n } else {\r\n style.appendChild(document.createTextNode(css));\r\n }\r\n}\r\n\r\nexport default styleInject;\r\n"],"names":[],"mappings":";;;;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACjC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ,CAAC;AAC9B;AACA,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO,EAAE;AAC1D;AACA,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACvE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AAC9C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;AAC1B;AACA,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAChD,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC9B,KAAK;AACL,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC5B,GAAG;AACH;AACA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG,CAAC;AACnC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AACpD,GAAG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}
@@ -0,0 +1,126 @@
1
+ import React, { useState } from 'react';
2
+
3
+ function styleInject(css, ref) {
4
+ if ( ref === void 0 ) ref = {};
5
+ var insertAt = ref.insertAt;
6
+
7
+ if (!css || typeof document === 'undefined') { return; }
8
+
9
+ var head = document.head || document.getElementsByTagName('head')[0];
10
+ var style = document.createElement('style');
11
+ style.type = 'text/css';
12
+
13
+ if (insertAt === 'top') {
14
+ if (head.firstChild) {
15
+ head.insertBefore(style, head.firstChild);
16
+ } else {
17
+ head.appendChild(style);
18
+ }
19
+ } else {
20
+ head.appendChild(style);
21
+ }
22
+
23
+ if (style.styleSheet) {
24
+ style.styleSheet.cssText = css;
25
+ } else {
26
+ style.appendChild(document.createTextNode(css));
27
+ }
28
+ }
29
+
30
+ var css_248z$6 = ":root{--blue:#1e2057;--blueHover:#242881;--red:#eb313d;--redHover:#9e0f18;--gray:#5d5d5d;--greyHover:#e4e2e2;--lightGray:#ededed;--green:#00984b;--greenHover:#14a857;--lightblue:#006cb7;--lightblueHover:#187bb2}html{font-family:Amelia,sans-serif;margin:0;padding:0;width:100%}";
31
+ styleInject(css_248z$6);
32
+
33
+ var css_248z$5 = ".tituloPagina-module_header__GtitI{align-items:center;border-radius:8px 8px 0 0;color:#fff;display:flex;font-size:23px;justify-content:space-between;padding:10px 20px;position:relative}.tituloPagina-module_title__pb7Iz{font-size:24px;font-weight:700;margin-left:5rem}.tituloPagina-module_backButton__QlSV1{align-items:center;background-color:#fff;border:none;border-radius:20px;cursor:pointer;display:flex;font-size:14px;font-weight:700;height:auto;margin:0 5rem 0 0;padding:10px 50px}.tituloPagina-module_backButton__QlSV1:hover{background-color:var(--greyHover)}@media (max-width:768px){.tituloPagina-module_title__pb7Iz{font-size:16px;margin-left:1rem}}@media (max-width:500px){.tituloPagina-module_backButton__QlSV1{margin-right:0;padding:10px 30px}}.tituloPagina-module_empresa1__sInrz .tituloPagina-module_header__GtitI{background-color:var(--blue)}.tituloPagina-module_empresa1__sInrz .tituloPagina-module_backButton__QlSV1{color:var(--blue)}.tituloPagina-module_empresa3__sn4GV .tituloPagina-module_header__GtitI{background-color:var(--green)}.tituloPagina-module_empresa3__sn4GV .tituloPagina-module_backButton__QlSV1{color:var(--green)}";
34
+ var styles$5 = {"header":"tituloPagina-module_header__GtitI","title":"tituloPagina-module_title__pb7Iz","backButton":"tituloPagina-module_backButton__QlSV1","empresa1":"tituloPagina-module_empresa1__sInrz","empresa3":"tituloPagina-module_empresa3__sn4GV"};
35
+ styleInject(css_248z$5);
36
+
37
+ var TituloPagina = function (_a) {
38
+ var titulo = _a.titulo, onClick = _a.onClick, empresa = _a.empresa;
39
+ var empresaClass = styles$5["empresa".concat(empresa)];
40
+ return (React.createElement("div", { className: "".concat(empresaClass) },
41
+ React.createElement("div", { className: styles$5.header },
42
+ React.createElement("p", { className: styles$5.title }, titulo),
43
+ React.createElement("button", { onClick: onClick, className: styles$5.backButton }, "Voltar"))));
44
+ };
45
+
46
+ var css_248z$4 = ".card-module_icone__8F-jV{height:55px;width:55px}.card-module_item__YYEzi{align-items:center;border-radius:10px;color:#fff;display:flex;font-size:18px;margin-bottom:1rem;padding:15px}.card-module_imgLateral__zCZz5{height:55px;margin-left:auto;margin-right:10px;width:55px}.card-module_empresa1__Jl5OB .card-module_item__YYEzi{background-color:var(--blue)}.card-module_empresa1__Jl5OB .card-module_item__YYEzi:hover{background-color:var(--red)}.card-module_empresa3__TCJpW .card-module_item__YYEzi{background-color:var(--green)}.card-module_empresa3__TCJpW .card-module_item__YYEzi:hover{background-color:var(--lightblue)}";
47
+ var styles$4 = {"icone":"card-module_icone__8F-jV","item":"card-module_item__YYEzi","imgLateral":"card-module_imgLateral__zCZz5","empresa1":"card-module_empresa1__Jl5OB","empresa3":"card-module_empresa3__TCJpW"};
48
+ styleInject(css_248z$4);
49
+
50
+ var Card = function (_a) {
51
+ var img = _a.img, imgLateral = _a.imgLateral, text = _a.text, link = _a.link, empresa = _a.empresa;
52
+ var empresaClass = styles$4["empresa".concat(empresa)];
53
+ var handleClick = function () {
54
+ if (link) {
55
+ window.location.href = link;
56
+ }
57
+ };
58
+ return (React.createElement("div", { className: "".concat(empresaClass), onClick: handleClick, style: { cursor: link ? 'pointer' : 'default' } },
59
+ React.createElement("div", { className: "".concat(styles$4.item, " empresa").concat(empresa) },
60
+ img && (React.createElement("img", { src: img, alt: text, className: styles$4.icone })),
61
+ React.createElement("span", { className: styles$4.texto }, text),
62
+ imgLateral && (React.createElement("img", { src: imgLateral, alt: "Right", className: styles$4.imgLateral })))));
63
+ };
64
+
65
+ var css_248z$3 = ".cardImage-module_botaoCert__Rs0fg{align-items:center;border-color:transparent;border-radius:1rem;color:#fff;display:flex;flex-direction:column;height:170px;justify-content:center;padding:.8rem;text-decoration:none;width:250px}.cardImage-module_iconeOna__WQil5{height:150px}.cardImage-module_cardText__NfgFE{bottom:.5rem;font-size:18px;position:relative}.cardImage-module_empresa1__SnbEU .cardImage-module_botaoCert__Rs0fg{background-color:var(--blue)}.cardImage-module_empresa1__SnbEU .cardImage-module_botaoCert__Rs0fg:hover{background-color:var(--red)}.cardImage-module_empresa3__ItFp0 .cardImage-module_botaoCert__Rs0fg{background-color:var(--green)}.cardImage-module_empresa3__ItFp0 .cardImage-module_botaoCert__Rs0fg:hover{background-color:var(--lightblue)}";
66
+ var styles$3 = {"botaoCert":"cardImage-module_botaoCert__Rs0fg","iconeOna":"cardImage-module_iconeOna__WQil5","cardText":"cardImage-module_cardText__NfgFE","empresa1":"cardImage-module_empresa1__SnbEU","empresa3":"cardImage-module_empresa3__ItFp0"};
67
+ styleInject(css_248z$3);
68
+
69
+ var CardImage = function (_a) {
70
+ var img = _a.img, href = _a.href, texto = _a.texto, empresa = _a.empresa;
71
+ var empresaClass = styles$3["empresa".concat(empresa)];
72
+ return (React.createElement("div", { className: "".concat(empresaClass) },
73
+ React.createElement("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: "".concat(styles$3.botaoCert, " empresa").concat(empresa), title: href },
74
+ React.createElement("img", { src: img, alt: img, className: styles$3.iconeOna }),
75
+ texto && (React.createElement("text", { className: styles$3.cardText }, texto)))));
76
+ };
77
+
78
+ var css_248z$2 = ".input-module_inputSubmit__21-Pj{align-self:center;border:none;border-radius:20px;color:#fff;cursor:pointer;font-size:15px;padding:10px;width:10rem}.input-module_inputPadrao__jypjY{border:1px solid #ccc;border-radius:.5rem;font-style:italic;padding:.8rem 0 .8rem 1rem;width:100%}.input-module_inputPadrao__jypjY:focus{outline:none}.input-module_empresa1__bxBov .input-module_inputSubmit__21-Pj{background-color:var(--blue)}.input-module_empresa1__bxBov .input-module_inputSubmit__21-Pj:hover{background-color:var(--red)}.input-module_empresa3__RU89A .input-module_inputSubmit__21-Pj{background-color:var(--green)}.input-module_empresa3__RU89A .input-module_inputSubmit__21-Pj:hover{background-color:var(--lightblue)}";
79
+ var styles$2 = {"inputSubmit":"input-module_inputSubmit__21-Pj","inputPadrao":"input-module_inputPadrao__jypjY","empresa1":"input-module_empresa1__bxBov","empresa3":"input-module_empresa3__RU89A"};
80
+ styleInject(css_248z$2);
81
+
82
+ var Button = function (_a) {
83
+ var empresa = _a.empresa, _b = _a.type, type = _b === void 0 ? 'submit' : _b, onClick = _a.onClick;
84
+ var empresaClass = styles$2["empresa".concat(empresa)];
85
+ return (React.createElement("div", { className: "".concat(empresaClass) }, type === 'submit' ? (React.createElement("input", { type: "submit", className: styles$2.inputSubmit })) : (React.createElement("button", { type: "button", className: styles$2.inputSubmit, onClick: onClick }, "Button"))));
86
+ };
87
+
88
+ var InputField = function (_a) {
89
+ var type = _a.type, id = _a.id, placeholder = _a.placeholder, onChange = _a.onChange, value = _a.value, label = _a.label;
90
+ return (React.createElement(React.Fragment, null,
91
+ label && React.createElement("label", { htmlFor: id }, label),
92
+ React.createElement("input", { type: type, id: id, name: id, value: value, placeholder: placeholder, onChange: onChange, className: styles$2.inputPadrao })));
93
+ };
94
+
95
+ var css_248z$1 = ".textPage-module_container__GBEF6{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:20px}.textPage-module_content__CpD68{display:flex;text-align:justify}.textPage-module_imageCabecalho__J6YFH{border-radius:8px}.textPage-module_imageCabecalho__J6YFH img{border-radius:8px;height:100%;object-fit:cover;width:100%}.textPage-module_contentWithLateralImage__-f5pQ{flex-direction:row}.textPage-module_imageLateral__Dy9Kx{align-self:flex-start;height:230px;margin-right:20px;margin-top:15px;width:300px}.textPage-module_imageLateral__Dy9Kx img{border-radius:8px;height:100%;object-fit:cover;width:100%}.textPage-module_text__3pwuU{color:#5d5d5d;flex:2;line-height:1.8;text-align:justify}.textPage-module_text__3pwuU p{line-height:1.6;margin:10px 0}.textPage-module_text__3pwuU .textPage-module_coordenacao__UypV-,.textPage-module_text__3pwuU .textPage-module_direcao__x5psb{font-weight:700;margin-top:20px}";
96
+ var styles$1 = {"container":"textPage-module_container__GBEF6","content":"textPage-module_content__CpD68","imageCabecalho":"textPage-module_imageCabecalho__J6YFH","contentWithLateralImage":"textPage-module_contentWithLateralImage__-f5pQ","imageLateral":"textPage-module_imageLateral__Dy9Kx","text":"textPage-module_text__3pwuU","coordenacao":"textPage-module_coordenacao__UypV-","direcao":"textPage-module_direcao__x5psb"};
97
+ styleInject(css_248z$1);
98
+
99
+ var TextPage = function (_a) {
100
+ var imgLateral = _a.imgLateral, imgCabecalho = _a.imgCabecalho, texto = _a.texto;
101
+ return (React.createElement(React.Fragment, null,
102
+ React.createElement("div", { className: styles$1.container },
103
+ imgCabecalho && (React.createElement("div", { className: styles$1.imageCabecalho },
104
+ React.createElement("img", { src: imgCabecalho, alt: imgCabecalho }))),
105
+ React.createElement("div", { className: "".concat(styles$1.content, " ").concat(imgLateral ? styles$1.contentWithLateralImage : '') },
106
+ imgLateral && (React.createElement("div", { className: styles$1.imageLateral },
107
+ React.createElement("img", { src: imgLateral, alt: imgLateral }))),
108
+ React.createElement("div", { className: styles$1.text, dangerouslySetInnerHTML: { __html: texto } })))));
109
+ };
110
+
111
+ var css_248z = ".menuPage-module_container__grjEI{color:#000;display:flex;height:100%}.menuPage-module_sidebar__7Kg1S{background-color:#fff;border-right:1px solid #ddd;height:500px;max-height:500px;overflow-y:auto;padding-bottom:15px;width:250px}.menuPage-module_sidebar__7Kg1S ul{list-style:none;margin:0;padding:0}.menuPage-module_sidebar__7Kg1S ul li{margin:10px 0}.menuPage-module_sidebar__7Kg1S ul li button{background:none;border:none;color:var(--blue);cursor:pointer;font-weight:700;padding:10px;text-align:left;text-decoration:none;width:100%}.menuPage-module_sidebar__7Kg1S ul li button.menuPage-module_active__Mfy4T{background-color:var(--lightGray);border-left:4px solid var(--blue)}.menuPage-module_content__g2T-d{background-color:#fff;flex:1;max-height:475px;overflow-y:auto;padding:20px}@media (max-width:800px){.menuPage-module_sidebar__7Kg1S{width:160px}}";
112
+ var styles = {"container":"menuPage-module_container__grjEI","sidebar":"menuPage-module_sidebar__7Kg1S","active":"menuPage-module_active__Mfy4T","content":"menuPage-module_content__g2T-d"};
113
+ styleInject(css_248z);
114
+
115
+ var MenuPage = function (_a) {
116
+ var menus = _a.menus, contents = _a.contents;
117
+ var _b = useState(menus[0].key), selectedSection = _b[0], setSelectedSection = _b[1];
118
+ return (React.createElement("div", { className: styles.container },
119
+ React.createElement("nav", { className: styles.sidebar },
120
+ React.createElement("ul", null, menus.map(function (menu) { return (React.createElement("li", { key: menu.key },
121
+ React.createElement("button", { className: selectedSection === menu.key ? styles.active : '', onClick: function () { return setSelectedSection(menu.key); } }, menu.label))); }))),
122
+ React.createElement("main", { className: styles.content }, contents[selectedSection])));
123
+ };
124
+
125
+ export { Button, Card, CardImage, InputField, MenuPage, TextPage, TituloPagina };
126
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\r\n if ( ref === void 0 ) ref = {};\r\n var insertAt = ref.insertAt;\r\n\r\n if (!css || typeof document === 'undefined') { return; }\r\n\r\n var head = document.head || document.getElementsByTagName('head')[0];\r\n var style = document.createElement('style');\r\n style.type = 'text/css';\r\n\r\n if (insertAt === 'top') {\r\n if (head.firstChild) {\r\n head.insertBefore(style, head.firstChild);\r\n } else {\r\n head.appendChild(style);\r\n }\r\n } else {\r\n head.appendChild(style);\r\n }\r\n\r\n if (style.styleSheet) {\r\n style.styleSheet.cssText = css;\r\n } else {\r\n style.appendChild(document.createTextNode(css));\r\n }\r\n}\r\n\r\nexport default styleInject;\r\n"],"names":[],"mappings":";;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACjC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ,CAAC;AAC9B;AACA,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO,EAAE;AAC1D;AACA,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACvE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AAC9C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;AAC1B;AACA,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAChD,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC9B,KAAK;AACL,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC5B,GAAG;AACH;AACA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG,CAAC;AACnC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AACpD,GAAG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[0]}
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ interface ButtonProps {
3
+ empresa: '1' | '2' | '3';
4
+ type?: 'button' | 'submit';
5
+ onClick?: () => void;
6
+ }
7
+ declare const Button: React.FC<ButtonProps>;
8
+ export default Button;
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ interface CardProps {
3
+ img?: string;
4
+ imgLateral?: string;
5
+ text: string;
6
+ link?: string;
7
+ empresa: '1' | '2' | '3';
8
+ }
9
+ declare const Card: React.FC<CardProps>;
10
+ export default Card;
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ interface CardImageProps {
3
+ img: string;
4
+ href: string;
5
+ texto?: string;
6
+ empresa: '1' | '2' | '3';
7
+ }
8
+ declare const CardImage: React.FC<CardImageProps>;
9
+ export default CardImage;
@@ -0,0 +1,11 @@
1
+ import React, { ChangeEvent } from 'react';
2
+ interface InputFieldProps {
3
+ label?: string;
4
+ type: string;
5
+ id: string;
6
+ placeholder: string;
7
+ value: string;
8
+ onChange: (e: ChangeEvent<HTMLInputElement>) => void;
9
+ }
10
+ declare const InputField: React.FC<InputFieldProps>;
11
+ export default InputField;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ interface InputSubmitProps {
3
+ empresa: '1' | '2' | '3';
4
+ }
5
+ declare const InputSubmit: React.FC<InputSubmitProps>;
6
+ export default InputSubmit;
@@ -0,0 +1,13 @@
1
+ import React, { ReactNode } from 'react';
2
+ interface Menu {
3
+ label: string;
4
+ key: string;
5
+ }
6
+ interface MenuPageProps {
7
+ menus: Menu[];
8
+ contents: {
9
+ [key: string]: ReactNode;
10
+ };
11
+ }
12
+ declare const MenuPage: React.FC<MenuPageProps>;
13
+ export default MenuPage;
@@ -0,0 +1,8 @@
1
+ import React from "react";
2
+ interface TextPageProps {
3
+ imgLateral?: string;
4
+ imgCabecalho?: string;
5
+ texto: string;
6
+ }
7
+ declare const TextPage: React.FC<TextPageProps>;
8
+ export default TextPage;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ interface HeaderProps {
3
+ titulo: string;
4
+ onClick?: () => void;
5
+ empresa: '1' | '2' | '3';
6
+ }
7
+ declare const TituloPagina: React.FC<HeaderProps>;
8
+ export default TituloPagina;
@@ -0,0 +1,8 @@
1
+ import './styles/geral.css';
2
+ export { default as TituloPagina } from "./components/TituloPagina";
3
+ export { default as Card } from "./components/Card";
4
+ export { default as CardImage } from "./components/CardImage";
5
+ export { default as Button } from "./components/Button";
6
+ export { default as InputField } from "./components/InputField";
7
+ export { default as TextPage } from "./components/TextPage";
8
+ export { default as MenuPage } from "./components/MenuPage";
package/package.json CHANGED
@@ -1,31 +1,42 @@
1
- {
2
- "name": "componenteshospitais",
3
- "version": "1.0.2",
4
- "main": "dist/index.js",
5
- "types": "dist/index.d.ts",
6
- "scripts": {
7
- "build": "webpack && tsc --declaration --emitDeclarationOnly",
8
- "prepublishOnly": "npm run build"
9
- },
10
- "peerDependencies": {
11
- "react": "^17.0.0",
12
- "react-dom": "^17.0.0"
13
- },
14
- "devDependencies": {
15
- "typescript": "^4.0.0",
16
- "@types/react": "^17.0.0",
17
- "@types/react-dom": "^17.0.0",
18
- "@babel/core": "^7.0.0",
19
- "@babel/preset-env": "^7.0.0",
20
- "@babel/preset-react": "^7.0.0",
21
- "@babel/preset-typescript": "^7.0.0",
22
- "babel-loader": "^8.0.0",
23
- "webpack": "^5.0.0",
24
- "webpack-cli": "^4.0.0",
25
- "webpack-node-externals": "^2.0.0"
26
- },
27
- "dependencies": {
28
- "react": "^17.0.0",
29
- "react-dom": "^17.0.0"
30
- }
31
- }
1
+ {
2
+ "name": "componenteshospitais",
3
+ "version": "1.0.3",
4
+ "main": "dist/cjs/index.js",
5
+ "module": "dist/esm/index.js",
6
+ "types": "dist/types/index.d.ts",
7
+ "scripts": {
8
+ "build": "rollup -c"
9
+ },
10
+ "peerDependencies": {
11
+ "react": "^18.3.1",
12
+ "react-dom": "^18.3.1"
13
+ },
14
+ "devDependencies": {
15
+ "@babel/core": "^7.0.0",
16
+ "@babel/preset-env": "^7.0.0",
17
+ "@babel/preset-react": "^7.0.0",
18
+ "@babel/preset-typescript": "^7.0.0",
19
+ "@rollup/plugin-json": "^6.1.0",
20
+ "@types/css-modules": "^1.0.5",
21
+ "@types/react": "^17.0.0",
22
+ "@types/react-dom": "^17.0.0",
23
+ "babel-loader": "^8.0.0",
24
+ "css-loader": "^7.1.2",
25
+ "rollup": "^4.18.1",
26
+ "rollup-plugin-postcss": "^4.0.2",
27
+ "rollup-plugin-typescript2": "^0.36.0",
28
+ "style-loader": "^4.0.0",
29
+ "typescript": "^4.0.0",
30
+ "webpack": "^5.0.0",
31
+ "webpack-cli": "^4.0.0",
32
+ "webpack-node-externals": "^2.0.0"
33
+ },
34
+ "dependencies": {
35
+ "@types/styled-components": "^5.1.34",
36
+ "react-router-dom": "^6.24.1",
37
+ "rollup-plugin-commonjs": "^10.1.0",
38
+ "rollup-plugin-node-resolve": "^5.2.0",
39
+ "rollup-plugin-peer-deps-external": "^2.2.4",
40
+ "styled-components": "^6.1.11"
41
+ }
42
+ }
@@ -0,0 +1,47 @@
1
+ import typescript from 'rollup-plugin-typescript2';
2
+ import peerDepsExternal from 'rollup-plugin-peer-deps-external';
3
+ import resolve from 'rollup-plugin-node-resolve';
4
+ import commonjs from 'rollup-plugin-commonjs';
5
+ import json from '@rollup/plugin-json';
6
+ import postcss from 'rollup-plugin-postcss';
7
+ import { createRequire } from 'module';
8
+ const require = createRequire(import.meta.url);
9
+ const pkg = require('./package.json');
10
+
11
+ export default {
12
+ input: 'src/index.tsx',
13
+ output: [
14
+ {
15
+ file: pkg.main,
16
+ format: 'cjs',
17
+ sourcemap: true,
18
+ },
19
+ {
20
+ file: pkg.module,
21
+ format: 'es',
22
+ sourcemap: true,
23
+ },
24
+ ],
25
+ plugins: [
26
+ peerDepsExternal(),
27
+ resolve(),
28
+ commonjs(),
29
+ typescript({
30
+ tsconfigOverride: {
31
+ compilerOptions: {
32
+ declaration: true,
33
+ declarationDir: './dist/types',
34
+ outDir: './dist'
35
+ },
36
+ include: ['src']
37
+ },
38
+ useTsconfigDeclarationDir: true
39
+ }),
40
+ postcss({
41
+ modules: true,
42
+ inject: true,
43
+ minimize: true,
44
+ }),
45
+ json()
46
+ ]
47
+ };
@@ -1,10 +1,26 @@
1
1
  import React from 'react';
2
+ import styles from '../styles/input.module.css';
2
3
 
3
- export interface ButtonProps {
4
- label: string;
5
- onClick: () => void;
4
+ interface ButtonProps {
5
+ empresa: '1' | '2' | '3';
6
+ type?: 'button' | 'submit';
7
+ onClick?: () => void;
6
8
  }
7
9
 
8
- export const Button: React.FC<ButtonProps> = ({ label, onClick }) => {
9
- return <button onClick={onClick}>{label}</button>;
10
- };
10
+ const Button: React.FC<ButtonProps> = ({ empresa, type = 'submit', onClick }) => {
11
+ const empresaClass = styles[`empresa${empresa}`];
12
+
13
+ return (
14
+ <div className={`${empresaClass}`}>
15
+ {type === 'submit' ? (
16
+ <input type="submit" className={styles.inputSubmit} />
17
+ ) : (
18
+ <button type="button" className={styles.inputSubmit} onClick={onClick}>
19
+ Button
20
+ </button>
21
+ )}
22
+ </div>
23
+ );
24
+ };
25
+
26
+ export default Button;
@@ -0,0 +1,36 @@
1
+ import React from 'react';
2
+ import styles from '../styles/card.module.css';
3
+
4
+ interface CardProps {
5
+ img?: string;
6
+ imgLateral?: string;
7
+ text: string;
8
+ link?: string;
9
+ empresa: '1' | '2' | '3';
10
+ }
11
+
12
+ const Card: React.FC<CardProps> = ({ img, imgLateral, text, link, empresa }) => {
13
+ const empresaClass = styles[`empresa${empresa}`];
14
+
15
+ const handleClick = () => {
16
+ if (link) {
17
+ window.location.href = link;
18
+ }
19
+ };
20
+
21
+ return (
22
+ <div className={`${empresaClass}`} onClick={handleClick} style={{ cursor: link ? 'pointer' : 'default' }}>
23
+ <div className={`${styles.item} empresa${empresa}`}>
24
+ { img && (
25
+ <img src={img} alt={text} className={styles.icone} />
26
+ )}
27
+ <span className={styles.texto}>{text}</span>
28
+ { imgLateral && (
29
+ <img src={imgLateral} alt="Right" className={styles.imgLateral} />
30
+ )}
31
+ </div>
32
+ </div>
33
+ );
34
+ };
35
+
36
+ export default Card;
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import styles from '../styles/cardImage.module.css';
3
+
4
+ interface CardImageProps {
5
+ img: string;
6
+ href: string;
7
+ texto?: string;
8
+ empresa: '1' | '2' | '3';
9
+ }
10
+
11
+ const CardImage: React.FC<CardImageProps> = ({ img, href, texto, empresa }) => {
12
+ const empresaClass = styles[`empresa${empresa}`];
13
+
14
+ return (
15
+ <div className={`${empresaClass}`}>
16
+ <a
17
+ href={href}
18
+ target="_blank"
19
+ rel="noopener noreferrer"
20
+ className={`${styles.botaoCert} empresa${empresa}`}
21
+ title={href}
22
+ >
23
+ <img src={img} alt={img} className={styles.iconeOna} />
24
+ { texto && (
25
+ <text className={styles.cardText}>{texto}</text>
26
+ )}
27
+ </a>
28
+ </div>
29
+ );
30
+ };
31
+
32
+ export default CardImage;
@@ -0,0 +1,30 @@
1
+ import React, { ChangeEvent } from 'react';
2
+ import styles from '../styles/input.module.css';
3
+
4
+ interface InputFieldProps {
5
+ label?: string;
6
+ type: string;
7
+ id: string;
8
+ placeholder: string;
9
+ value: string;
10
+ onChange: (e: ChangeEvent<HTMLInputElement>) => void;
11
+ }
12
+
13
+ const InputField: React.FC<InputFieldProps> = ({ type, id, placeholder, onChange, value, label }) => {
14
+ return (
15
+ <>
16
+ {label && <label htmlFor={id}>{label}</label>}
17
+ <input
18
+ type={type}
19
+ id={id}
20
+ name={id}
21
+ value={value}
22
+ placeholder={placeholder}
23
+ onChange={onChange}
24
+ className={styles.inputPadrao}
25
+ />
26
+ </>
27
+ );
28
+ };
29
+
30
+ export default InputField;
@@ -0,0 +1,40 @@
1
+ import React, { useState, ReactNode } from 'react';
2
+ import styles from '../styles/menuPage.module.css';
3
+
4
+ interface Menu {
5
+ label: string;
6
+ key: string;
7
+ }
8
+
9
+ interface MenuPageProps {
10
+ menus: Menu[];
11
+ contents: { [key: string]: ReactNode };
12
+ }
13
+
14
+ const MenuPage: React.FC<MenuPageProps> = ({ menus, contents }) => {
15
+ const [selectedSection, setSelectedSection] = useState(menus[0].key);
16
+
17
+ return (
18
+ <div className={styles.container}>
19
+ <nav className={styles.sidebar}>
20
+ <ul>
21
+ {menus.map(menu => (
22
+ <li key={menu.key}>
23
+ <button
24
+ className={selectedSection === menu.key ? styles.active : ''}
25
+ onClick={() => setSelectedSection(menu.key)}
26
+ >
27
+ {menu.label}
28
+ </button>
29
+ </li>
30
+ ))}
31
+ </ul>
32
+ </nav>
33
+ <main className={styles.content}>
34
+ {contents[selectedSection]}
35
+ </main>
36
+ </div>
37
+ );
38
+ };
39
+
40
+ export default MenuPage;
@@ -0,0 +1,36 @@
1
+ import React from "react";
2
+ import styles from "../styles/textPage.module.css";
3
+
4
+ interface TextPageProps {
5
+ imgLateral?: string;
6
+ imgCabecalho?: string;
7
+ texto: string;
8
+ }
9
+
10
+ const TextPage: React.FC<TextPageProps> = ({ imgLateral, imgCabecalho, texto }) => {
11
+
12
+ return (
13
+ <>
14
+ <div className={styles.container}>
15
+ {imgCabecalho && (
16
+ <div className={styles.imageCabecalho}>
17
+ <img src={imgCabecalho} alt={imgCabecalho} />
18
+ </div>
19
+ )}
20
+ <div className={`${styles.content} ${imgLateral ? styles.contentWithLateralImage : ''}`}>
21
+ {imgLateral && (
22
+ <div className={styles.imageLateral}>
23
+ <img src={imgLateral} alt={imgLateral} />
24
+ </div>
25
+ )}
26
+ <div
27
+ className={styles.text}
28
+ dangerouslySetInnerHTML={{ __html: texto }}
29
+ ></div>
30
+ </div>
31
+ </div>
32
+ </>
33
+ );
34
+ }
35
+
36
+ export default TextPage;
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import styles from '../styles/tituloPagina.module.css'; // Importa o CSS específico do componente
3
+
4
+ interface HeaderProps {
5
+ titulo: string;
6
+ onClick?: () => void;
7
+ empresa: '1' | '2' | '3';
8
+ }
9
+
10
+ const TituloPagina: React.FC<HeaderProps> = ({ titulo, onClick, empresa }) => {
11
+ const empresaClass = styles[`empresa${empresa}`];
12
+
13
+ return (
14
+ <div className={`${empresaClass}`}>
15
+ <div className={styles.header}>
16
+ <p className={styles.title}>{titulo}</p>
17
+ <button onClick={onClick} className={styles.backButton}>Voltar</button>
18
+ </div>
19
+ </div>
20
+ );
21
+ };
22
+
23
+ export default TituloPagina;
@@ -0,0 +1,18 @@
1
+ import React from 'react';
2
+ import styles from '../styles/componente.module.css';
3
+
4
+ interface ComponenteProps {
5
+ empresa: '1' | '2' | '3';
6
+ }
7
+
8
+ const Componente: React.FC<ComponenteProps> = ({ empresa }) => {
9
+ const empresaClass = styles[`empresa${empresa}`];
10
+
11
+ return (
12
+ <div className={`${empresaClass}`}>
13
+
14
+ </div>
15
+ );
16
+ };
17
+
18
+ export default Componente;
package/src/index.tsx CHANGED
@@ -1 +1,10 @@
1
- export * from './components';
1
+ import React, {useState} from 'react';
2
+ import './styles/geral.css';
3
+
4
+ export { default as TituloPagina } from "./components/TituloPagina";
5
+ export { default as Card } from "./components/Card";
6
+ export { default as CardImage } from "./components/CardImage";
7
+ export { default as Button } from "./components/Button";
8
+ export { default as InputField } from "./components/InputField";
9
+ export { default as TextPage } from "./components/TextPage";
10
+ export { default as MenuPage } from "./components/MenuPage";
@@ -0,0 +1,43 @@
1
+ .icone {
2
+ width: 55px;
3
+ height: 55px;
4
+ }
5
+
6
+ .item {
7
+ display: flex;
8
+ align-items: center;
9
+ border-radius: 10px;
10
+ color: white;
11
+ padding: 15px;
12
+ font-size: 18px;
13
+ margin-bottom: 1rem;
14
+ }
15
+
16
+ .imgLateral {
17
+ margin-left: auto;
18
+ margin-right: 10px;
19
+ width: 55px;
20
+ height: 55px;
21
+ }
22
+
23
+ /* Definicao de cores */
24
+
25
+ /* Empresa 1 - MPHU */
26
+ .empresa1 .item{
27
+ background-color: var(--blue);
28
+ }
29
+
30
+ .empresa1 .item:hover{
31
+ background-color: var(--red);
32
+ }
33
+
34
+ /* Empresa 2 - Reginal */
35
+
36
+ /* Empresa 3 - Upas */
37
+ .empresa3 .item{
38
+ background-color: var(--green);
39
+ }
40
+
41
+ .empresa3 .item:hover{
42
+ background-color: var(--lightblue);
43
+ }
@@ -0,0 +1,45 @@
1
+ .botaoCert {
2
+ display: flex;
3
+ flex-direction: column;
4
+ color: white;
5
+ border-color: transparent;
6
+ padding: 0.8rem;
7
+ border-radius: 1rem;
8
+ justify-content: center;
9
+ align-items: center;
10
+ width: 250px;
11
+ height: 170px;
12
+ text-decoration: none;
13
+ }
14
+
15
+ .iconeOna {
16
+ height: 150px;
17
+ }
18
+
19
+ .cardText{
20
+ font-size: 18px;
21
+ position: relative;
22
+ bottom: 0.5rem;
23
+ }
24
+
25
+ /* Definicao de cores */
26
+
27
+ /* Empresa 1 - MPHU */
28
+ .empresa1 .botaoCert{
29
+ background-color: var(--blue);
30
+ }
31
+
32
+ .empresa1 .botaoCert:hover{
33
+ background-color: var(--red);
34
+ }
35
+
36
+ /* Empresa 2 - Reginal */
37
+
38
+ /* Empresa 3 - Upas */
39
+ .empresa3 .botaoCert{
40
+ background-color: var(--green);
41
+ }
42
+
43
+ .empresa3 .botaoCert:hover{
44
+ background-color: var(--lightblue);
45
+ }
@@ -0,0 +1,20 @@
1
+ :root {
2
+ --blue: #1E2057;
3
+ --blueHover: #242881;
4
+ --red: #EB313D;
5
+ --redHover: #9E0F18;
6
+ --gray: #5D5D5D;
7
+ --greyHover: #e4e2e2;
8
+ --lightGray: #EDEDED;
9
+ --green: #00984B;
10
+ --greenHover: #14A857;
11
+ --lightblue: #006CB7;
12
+ --lightblueHover: #187BB2;
13
+ }
14
+
15
+ html {
16
+ margin: 0;
17
+ padding: 0;
18
+ width: 100%;
19
+ font-family: "Amelia", sans-serif;
20
+ }
@@ -0,0 +1,45 @@
1
+ .inputSubmit {
2
+ width: 10rem;
3
+ border: none;
4
+ border-radius: 20px;
5
+ padding: 10px;
6
+ color: #fff;
7
+ font-size: 15px;
8
+ cursor: pointer;
9
+ align-self: center;
10
+ }
11
+
12
+ .inputPadrao{
13
+ font-style: italic;
14
+ padding: 0.8rem 0;
15
+ border: 1px solid #ccc;
16
+ padding-left: 1rem;
17
+ width: 100%;
18
+ border-radius: 0.5rem;
19
+ }
20
+
21
+ .inputPadrao:focus{
22
+ outline: none;
23
+ }
24
+
25
+ /* Definicao de cores */
26
+
27
+ /* Empresa 1 - MPHU */
28
+ .empresa1 .inputSubmit{
29
+ background-color: var(--blue);
30
+ }
31
+
32
+ .empresa1 .inputSubmit:hover{
33
+ background-color: var(--red);
34
+ }
35
+
36
+ /* Empresa 2 - Reginal */
37
+
38
+ /* Empresa 3 - Upas */
39
+ .empresa3 .inputSubmit{
40
+ background-color: var(--green);
41
+ }
42
+
43
+ .empresa3 .inputSubmit:hover{
44
+ background-color: var(--lightblue);
45
+ }
@@ -0,0 +1,56 @@
1
+ .container {
2
+ display: flex;
3
+ height: 100%;
4
+ color: black;
5
+ }
6
+
7
+ .sidebar {
8
+ width: 250px;
9
+ background-color: #fff;
10
+ padding-bottom: 15px;
11
+ border-right: 1px solid #ddd;
12
+ overflow-y: auto;
13
+ max-height: 500px;
14
+ height: 500px;
15
+ }
16
+
17
+ .sidebar ul {
18
+ list-style: none;
19
+ padding: 0;
20
+ margin: 0;
21
+ }
22
+
23
+ .sidebar ul li {
24
+ margin: 10px 0;
25
+ }
26
+
27
+ .sidebar ul li button {
28
+ background: none;
29
+ border: none;
30
+ text-decoration: none;
31
+ color: var(--blue);
32
+ font-weight: bold;
33
+ cursor: pointer;
34
+ width: 100%;
35
+ text-align: left;
36
+ padding: 10px;
37
+ }
38
+
39
+ .sidebar ul li button.active {
40
+ background-color: var(--lightGray);
41
+ border-left: 4px solid var(--blue);
42
+ }
43
+
44
+ .content {
45
+ flex: 1;
46
+ padding: 20px;
47
+ overflow-y: auto;
48
+ max-height: 475px;
49
+ background-color: #fff;
50
+ }
51
+
52
+ @media (max-width: 800px) {
53
+ .sidebar{
54
+ width: 160px;
55
+ }
56
+ }
@@ -0,0 +1,60 @@
1
+ .container {
2
+ display: flex;
3
+ flex-direction: column;
4
+ align-items: center;
5
+ justify-content: center;
6
+ padding: 20px;
7
+ }
8
+
9
+ .content {
10
+ display: flex;
11
+ text-align: justify;
12
+ }
13
+
14
+ .imageCabecalho {
15
+ border-radius: 8px;
16
+ }
17
+
18
+ .imageCabecalho img {
19
+ width: 100%;
20
+ height: 100%;
21
+ object-fit: cover;
22
+ border-radius: 8px;
23
+ }
24
+
25
+ .contentWithLateralImage {
26
+ flex-direction: row;
27
+ }
28
+
29
+ .imageLateral {
30
+ width: 300px;
31
+ height: 230px;
32
+ margin-right: 20px;
33
+ align-self: flex-start;
34
+ margin-top: 15px;
35
+ }
36
+
37
+ .imageLateral img {
38
+ width: 100%;
39
+ height: 100%;
40
+ object-fit: cover;
41
+ border-radius: 8px;
42
+ }
43
+
44
+ .text {
45
+ flex: 2;
46
+ text-align: justify;
47
+ color: #5d5d5d;
48
+ line-height: 1.8;
49
+ }
50
+
51
+ .text p {
52
+ margin: 10px 0;
53
+ line-height: 1.6;
54
+ }
55
+
56
+ .text .coordenacao,
57
+ .text .direcao {
58
+ font-weight: bold;
59
+ margin-top: 20px;
60
+ }
@@ -0,0 +1,72 @@
1
+ .header {
2
+ color: white;
3
+ position: relative;
4
+ font-size: 23px;
5
+ display: flex;
6
+ justify-content: space-between;
7
+ align-items: center;
8
+ padding: 10px 20px;
9
+ border-radius: 8px 8px 0 0;
10
+ }
11
+
12
+ .title {
13
+ font-size: 24px;
14
+ font-weight: bold;
15
+ margin-left: 5rem;
16
+ }
17
+
18
+ .backButton {
19
+ background-color: white;
20
+ border: none;
21
+ padding: 10px 50px;
22
+ cursor: pointer;
23
+ height: auto;
24
+ border-radius: 20px;
25
+ display: flex;
26
+ align-items: center;
27
+ font-weight: bold;
28
+ font-size: 14px;
29
+ margin: 0;
30
+ margin-right: 5rem;
31
+ }
32
+
33
+ .backButton:hover{
34
+ background-color: var(--greyHover);
35
+ }
36
+
37
+ @media (max-width: 768px) {
38
+ .title {
39
+ margin-left: 1rem;
40
+ font-size: 16px;
41
+ }
42
+ }
43
+
44
+ @media (max-width: 500px) {
45
+ .backButton {
46
+ margin-right: 0rem;
47
+ padding: 10px 30px;
48
+ }
49
+ }
50
+
51
+
52
+ /* Definicao de cores */
53
+
54
+ /* Empresa 1 - MPHU */
55
+ .empresa1 .header{
56
+ background-color: var(--blue);
57
+ }
58
+
59
+ .empresa1 .backButton{
60
+ color: var(--blue);
61
+ }
62
+
63
+ /* Empresa 2 - Reginal */
64
+
65
+ /* Empresa 3 - Upas */
66
+ .empresa3 .header{
67
+ background-color: var(--green);
68
+ }
69
+
70
+ .empresa3 .backButton{
71
+ color: var(--green);
72
+ }
package/tsconfig.json CHANGED
@@ -1,13 +1,18 @@
1
1
  {
2
2
  "compilerOptions": {
3
- "target": "es5",
4
- "module": "commonjs",
3
+ "target": "ES5",
4
+ "module": "ESNext",
5
5
  "declaration": true,
6
+ "declarationDir": "./dist/types",
6
7
  "outDir": "./dist",
7
8
  "strict": true,
8
9
  "jsx": "react",
9
- "esModuleInterop": true
10
+ "esModuleInterop": true,
11
+ "skipLibCheck": true,
12
+ "forceConsistentCasingInFileNames": true,
13
+ "moduleResolution": "node",
14
+ "allowSyntheticDefaultImports": true
10
15
  },
11
16
  "include": ["src"],
12
17
  "exclude": ["node_modules", "dist"]
13
- }
18
+ }
package/.babelrc DELETED
@@ -1,4 +0,0 @@
1
- {
2
- "presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-typescript"]
3
- }
4
-
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- export interface ButtonProps {
3
- label: string;
4
- onClick: () => void;
5
- }
6
- export declare const Button: React.FC<ButtonProps>;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- export interface InputProps {
3
- placeholder: string;
4
- onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
5
- }
6
- export declare const Input: React.FC<InputProps>;
@@ -1,2 +0,0 @@
1
- export { Button, ButtonProps } from './Button';
2
- export { Input, InputProps } from './Input';
package/dist/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './components';
package/dist/index.js DELETED
@@ -1 +0,0 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("myLibrary",[],t):"object"==typeof exports?exports.myLibrary=t():e.myLibrary=t()}(this,(()=>(()=>{"use strict";var e={n:t=>{var r=t&&t.__esModule?()=>t.default:()=>t;return e.d(r,{a:r}),r},d:(t,r)=>{for(var o in r)e.o(r,o)&&!e.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:r[o]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Button:()=>u,ButtonProps:()=>r.ButtonProps,Input:()=>p,InputProps:()=>o.InputProps});var r={};e.r(r),e.d(r,{$:()=>u});var o={};e.r(o),e.d(o,{p:()=>p});const n=require("react");var a=e.n(n),u=function(e){var t=e.label,r=e.onClick;return a().createElement("button",{onClick:r},t)},p=function(e){var t=e.placeholder,r=e.onChange;return a().createElement("input",{placeholder:t,onChange:r})};return t})()));
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
-
3
- export interface InputProps {
4
- placeholder: string;
5
- onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
6
- }
7
-
8
- export const Input: React.FC<InputProps> = ({ placeholder, onChange }) => {
9
- return <input placeholder={placeholder} onChange={onChange} />;
10
- };
@@ -1,2 +0,0 @@
1
- export { Button, ButtonProps } from './Button';
2
- export { Input, InputProps } from './Input';
package/webpack.config.js DELETED
@@ -1,28 +0,0 @@
1
- const path = require('path');
2
- const nodeExternals = require('webpack-node-externals');
3
-
4
- module.exports = {
5
- mode: 'production',
6
- entry: './src/index.tsx',
7
- output: {
8
- path: path.resolve(__dirname, 'dist'),
9
- filename: 'index.js',
10
- library: 'myLibrary',
11
- libraryTarget: 'umd',
12
- umdNamedDefine: true,
13
- globalObject: 'this'
14
- },
15
- resolve: {
16
- extensions: ['.ts', '.tsx', '.js', '.jsx']
17
- },
18
- module: {
19
- rules: [
20
- {
21
- test: /\.tsx?$/,
22
- use: 'babel-loader',
23
- exclude: /node_modules/
24
- }
25
- ]
26
- },
27
- externals: [nodeExternals()]
28
- };