@credithub/harlan-components 1.21.2 → 1.22.0

package/dist/assets/btn/printIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare function PrintIcon({ fill, ...rest }: React.SVGProps<SVGSVGElement>): React.JSX.Element;
+export default PrintIcon;

package/dist/assets/btn/printIcon.js

@@ -0,0 +1,30 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import theme from '../../components/interface/theme';
+import React from 'react';
+function PrintIcon(_a) {
+    var _b = _a.fill, fill = _b === void 0 ? theme.colors.cinzaEscuro : _b, rest = __rest(_a, ["fill"]);
+    return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: "20", height: "18", fill: "none", viewBox: "0 0 20 18" }, rest),
+        React.createElement("path", { fill: fill, d: "M6 18c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 014 16v-2H2c-.55 0-1.02-.196-1.413-.588A1.926 1.926 0 010 12V8c0-.85.292-1.563.875-2.138S2.167 5 3 5h14c.85 0 1.563.287 2.137.862C19.712 6.438 20 7.15 20 8v4c0 .55-.196 1.02-.587 1.412A1.926 1.926 0 0118 14h-2v2c0 .55-.196 1.02-.588 1.413A1.926 1.926 0 0114 18H6zm-4-6h2c0-.55.196-1.02.588-1.412A1.926 1.926 0 016 10h8c.55 0 1.02.196 1.412.588.392.391.588.862.588 1.412h2V8a.967.967 0 00-.288-.713A.968.968 0 0017 7H3a.968.968 0 00-.712.287A.968.968 0 002 8v4zm12-7V2H6v3H4V2c0-.55.196-1.02.588-1.413A1.926 1.926 0 016 0h8c.55 0 1.02.196 1.412.588C15.804.979 16 1.45 16 2v3h-2zm2 4.5c.283 0 .52-.096.712-.287A.967.967 0 0017 8.5a.967.967 0 00-.288-.713A.968.968 0 0016 7.5a.968.968 0 00-.713.287A.967.967 0 0015 8.5c0 .283.096.52.287.713.192.191.43.287.713.287zM14 16v-4H6v4h8z" })));
+}
+export default PrintIcon;

package/dist/components/chart/chartSystem.js

@@ -17,6 +17,7 @@ import useChartData from './hooks/useChartData';
 import ResumoDeNegativacoesIcon from '../../assets/icones/resumoNegativacoes';
 import { ConsultasComplementaresContext } from '../consultasComplementares';
 import { converterParaFormatoValido } from '../../utils/string';
+import { PrintSectionWrapper } from '../common/printSectionWrapper';
 var Content = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: ", ";\n  padding: 0px 30px;\n\n  @media print {\n    display: block;\n  }\n"], ["\n  display: ", ";\n  padding: 0px 30px;\n\n  @media print {\n    display: block;\n  }\n"])), function (props) { return (props.isOpen ? 'block' : 'none'); });
 var ChartSystem = function (_a) {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k;
@@ -51,7 +52,7 @@ var ChartSystem = function (_a) {
         if (consultaPefinBoaVista || consultaPefinSerasa)
             refetch();
     }, [consultaPefinBoaVista, consultaPefinSerasa]);
-    return (React.createElement(React.Fragment, null,
+    return (React.createElement(PrintSectionWrapper, null,
         React.createElement(Header, { title: "Resumo de Negativa\u00E7\u00F5es", subtitle: "Veja a quantidade de ocorr\u00EAncias conforme o documento foi consultado ao longo do tempo", description: errorMessage && (React.createElement(StatusMessage, { type: "error" }, errorMessage)), variant: isLoading ? 'loading' : 'default', icon: ResumoDeNegativacoesIcon, actions: React.createElement(BtnWrapper, { onClick: toggleOpen }, isOpen ? React.createElement(ChevronUp, null) : React.createElement(ChevronDown, null)) }),
         React.createElement(Content, { isOpen: isOpen },
             data && React.createElement(ChartContent, { dataInput: data }),

package/dist/components/common/button.js

@@ -28,7 +28,7 @@ import classNames from 'classnames';
 import React from 'react';
 import styled from 'styled-components';
 import theme from '../interface/theme';
-var StyledButton = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  background-color: ", ";\n  color: ", ";\n\n  padding: 8px 20px;\n  border: none;\n  border-radius: 60px;\n  cursor: pointer;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  transition:\n    background-color 0.3s ease-in-out,\n    color 0.3s ease-in-out;\n\n  &:hover {\n    background-color: #0056b3;\n  }\n\n  width: 100% !important;\n"], ["\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  background-color: ", ";\n  color: ", ";\n\n  padding: 8px 20px;\n  border: none;\n  border-radius: 60px;\n  cursor: pointer;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  transition:\n    background-color 0.3s ease-in-out,\n    color 0.3s ease-in-out;\n\n  &:hover {\n    background-color: #0056b3;\n  }\n\n  width: 100% !important;\n"])), theme.typography.headline14.fontStyle, theme.typography.headline14.fontWeight, theme.typography.headline14.fontSize, theme.typography.headline14.lineHeight, theme.colors.azulCredithub, theme.colors.white);
+var StyledButton = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  background-color: ", ";\n  color: ", ";\n\n  padding: 8px 20px;\n  border: none;\n  border-radius: 60px;\n  cursor: pointer;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  transition:\n    background-color 0.3s ease-in-out,\n    color 0.3s ease-in-out;\n\n  &:hover {\n    background-color: #0056b3;\n  }\n\n  width: 100% !important;\n  min-height: 40px;\n"], ["\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  background-color: ", ";\n  color: ", ";\n\n  padding: 8px 20px;\n  border: none;\n  border-radius: 60px;\n  cursor: pointer;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  transition:\n    background-color 0.3s ease-in-out,\n    color 0.3s ease-in-out;\n\n  &:hover {\n    background-color: #0056b3;\n  }\n\n  width: 100% !important;\n  min-height: 40px;\n"])), theme.typography.headline14.fontStyle, theme.typography.headline14.fontWeight, theme.typography.headline14.fontSize, theme.typography.headline14.lineHeight, theme.colors.azulCredithub, theme.colors.white);
 var SmallContent = styled.small(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  color: #fdeb35;\n  display: block;\n  margin-top: 4px;\n\n  @media print {\n    display: none;\n  }\n"], ["\n  color: #fdeb35;\n  display: block;\n  margin-top: 4px;\n\n  @media print {\n    display: none;\n  }\n"])));
 var Button = function (_a) {
     var children = _a.children, className = _a.className, smallContent = _a.smallContent, props = __rest(_a, ["children", "className", "smallContent"]);

package/dist/components/common/printSectionWrapper.d.ts

@@ -0,0 +1,5 @@
+import { FC, PropsWithChildren } from 'react';
+export type PrintSectionWrapperProps = {
+    enabled?: boolean;
+};
+export declare const PrintSectionWrapper: FC<PropsWithChildren<PrintSectionWrapperProps>>;

package/dist/components/common/printSectionWrapper.js

@@ -0,0 +1,36 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import styled, { css } from 'styled-components';
+var PrintSectionStyle = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) {
+    return props.enabled && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      @media print {\n        background: #ffffff;\n        box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n        border-radius: 30px;\n      }\n    "], ["\n      @media print {\n        background: #ffffff;\n        box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n        border-radius: 30px;\n      }\n    "])));
+});
+export var PrintSectionWrapper = function (_a) {
+    var _b = _a.enabled, enabled = _b === void 0 ? true : _b, children = _a.children, rest = __rest(_a, ["enabled", "children"]);
+    return (React.createElement(PrintSectionStyle, __assign({ enabled: enabled }, rest), children));
+};
+var templateObject_1, templateObject_2;

package/dist/components/dominios/dominios.js

@@ -15,8 +15,8 @@ var Dominios = function () {
     var Section = ctx.Section;
     return (React.createElement(Section, { title: "Dom\u00EDnios na Internet", subtitle: "Informa\u00E7\u00F5es de dom\u00EDnios na internet.", icon: DominiosIcon, onSuccess: function (document) {
             return {
-                children: (React.createElement(Result, { resultContentStriped: false }, document.map(function (data) { return (React.createElement(ResultContent, { desktop: "1fr 1fr 1fr", tablet: "1fr 1fr", mobile: "1fr 1fr", key: data },
-                    React.createElement(AddItemField, { name: "Dom\u00EDnio", value: React.createElement(Link, { href: "https://www.".concat(data), target: "_blank", rel: "noreferrer" }, data) }))); }))),
+                children: document.length ? (React.createElement(Result, { resultContentStriped: false }, document.map(function (data) { return (React.createElement(ResultContent, { desktop: "1fr 1fr 1fr", tablet: "1fr 1fr", mobile: "1fr 1fr", key: data },
+                    React.createElement(AddItemField, { name: "Dom\u00EDnio", value: React.createElement(Link, { href: "https://www.".concat(data), target: "_blank", rel: "noreferrer" }, data) }))); }))) : null,
                 description: (React.createElement(StatusMessage, { type: (document === null || document === void 0 ? void 0 : document.length) ? 'success' : 'default' }, document.length
                     ? (document === null || document === void 0 ? void 0 : document.length) === 1
                         ? 'Foi encontrado 1 registro de domínio'

package/dist/components/dossie/dossie.d.ts

@@ -3,7 +3,6 @@ interface DossieProps {
     documento: string;
     rfbResponse?: Document;
     onOpenNewTransactionModal?: () => void;
-    onClickPrint: () => void;
 }
 declare const Dossie: React.FC<DossieProps>;
 export default Dossie;

package/dist/components/dossie/dossie.js

@@ -2,8 +2,6 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
 };
-/* eslint-disable @typescript-eslint/no-unused-vars */
-//eslint-disable-ban-types
 import React, { useContext } from 'react';
 import { Summary } from './summary/summary';
 import { TransactionsTable } from './transactionTable/transactionTable';
@@ -16,26 +14,30 @@ import styled from 'styled-components';
 import { useConsultaRfb } from '../../hooks/useConsultaRfb';
 var DossieContent = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  justify-items: center;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 20px;\n\n  @media screen and (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"], ["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  justify-items: center;\n  align-items: flex-start;\n  margin-bottom: 20px;\n  gap: 20px;\n\n  @media screen and (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"])));
 var DossieContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 0px 70px;\n\n  @media (max-width: 1000px) {\n    padding: 0px 30px;\n  }\n"], ["\n  padding: 0px 70px;\n\n  @media (max-width: 1000px) {\n    padding: 0px 30px;\n  }\n"])));
+var useDossieData = function (documento, rfbResponse) {
+    var isPF = (documento === null || documento === void 0 ? void 0 : documento.length) === 11;
+    var name = isPF
+        ? XPathUtils.select('string(//cadastro/nome)', rfbResponse)
+        : XPathUtils.select('string(//cadastro/razaoSocial)', rfbResponse) ||
+            (rfbResponse && XPathUtils.select('string(//RFB/nome)', rfbResponse));
+    var document = isPF ? formatCpf(documento) : formatCnpj(documento);
+    return { isPF: isPF, name: name, document: document };
+};
 var Dossie = function (_a) {
-    var documento = _a.documento, onClickPrint = _a.onClickPrint;
+    var documento = _a.documento;
     var finderCtx = useContext(Queries.Finder);
     var rfbResponse = useConsultaRfb().rfbResponse;
     var Section = finderCtx.Section;
+    var _b = useDossieData(documento, rfbResponse), isPF = _b.isPF, name = _b.name, document = _b.document;
+    var DossieCarrousel = function () {
+        return !isPF ? (React.createElement(ReclameAquiCarousel, { documento: document, nome: name })) : (React.createElement(Carrousel, { name: name, document: document }));
+    };
     var response = function (_data) {
         var data = _data instanceof Error ? undefined : _data;
-        var isPF = (documento === null || documento === void 0 ? void 0 : documento.length) === 11;
-        var name = (isPF
-            ? XPathUtils.select('string(//cadastro/nome)', data)
-            : XPathUtils.select('string(//cadastro/razaoSocial)', data) ||
-                (rfbResponse && XPathUtils.select('string(//RFB/nome)', rfbResponse)));
-        var document = isPF ? formatCpf(documento) : formatCnpj(documento);
-        var DossieCarrousel = function () {
-            return !isPF ? (React.createElement(ReclameAquiCarousel, { documento: document, nome: name })) : (React.createElement(Carrousel, { name: name, document: document }));
-        };
         return (React.createElement(DossieContainer, null,
             React.createElement(DossieContent, null,
                 React.createElement(DossieCarrousel, null),
-                React.createElement(Summary, { onClickPrint: onClickPrint, finderResponse: data, rfbResponse: rfbResponse, document: document })),
+                React.createElement(Summary, { finderResponse: data, rfbResponse: rfbResponse, document: document })),
             React.createElement(TransactionsTable, { events: XPathUtils.select('//historico/consulta', data) || [] })));
     };
     return (React.createElement(Section, { ctx: finderCtx, hideHeader: true, minimized: false, isError: function (e) { return response(e); }, onSuccess: response }));

package/dist/components/dossie/summary/summary.d.ts

@@ -14,7 +14,6 @@ interface SummaryProps {
     finderResponse?: Document;
     rfbResponse?: Document;
     document: string;
-    onClickPrint: () => void;
 }
 export declare const Summary: React.FC<SummaryProps>;
 export default Summary;

package/dist/components/dossie/summary/summary.js

@@ -12,10 +12,10 @@ var ContainerSummary = styled.div(templateObject_1 || (templateObject_1 = __make
 var ContentSummary = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: grid;\n  grid-row: 1 / 8;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 0 16px;\n\n  @media (max-width: 1280px) {\n    grid-template-columns: repeat(3, 1fr);\n    justify-content: center;\n    align-items: center;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n    width: 100%;\n  }\n"], ["\n  display: grid;\n  grid-row: 1 / 8;\n  grid-template-columns: repeat(4, 1fr);\n  gap: 0 16px;\n\n  @media (max-width: 1280px) {\n    grid-template-columns: repeat(3, 1fr);\n    justify-content: center;\n    align-items: center;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n    width: 100%;\n  }\n"])));
 var FieldSummary = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  margin-bottom: 16px;\n  grid-column: ", ";\n"], ["\n  align-items: center;\n  margin-bottom: 16px;\n  grid-column: ", ";\n"])), function (props) { return (props.fullRow ? '1 / 3' : 'auto'); });
 var ButtonsSummary = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 8px;\n\n  @media (max-width: 768px) {\n    align-items: center;\n    max-width: 100%;\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 8px;\n\n  @media (max-width: 768px) {\n    align-items: center;\n    max-width: 100%;\n  }\n"])));
-var ButtonsWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  gap: 10px;\n  flex-direction: column;\n\n  @media (max-width: 1000px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(1, 1fr);\n    flex-direction: row;\n  }\n\n  @media print {\n    display: none;\n  }\n"], ["\n  display: flex;\n  gap: 10px;\n  flex-direction: column;\n\n  @media (max-width: 1000px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(1, 1fr);\n    flex-direction: row;\n  }\n\n  @media print {\n    display: none;\n  }\n"])));
+var ButtonsWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  gap: 10px;\n  min-width: fit-content;\n  flex-direction: column;\n\n  @media (max-width: 1000px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(1, 1fr);\n    flex-direction: row;\n  }\n\n  @media print {\n    display: none;\n  }\n"], ["\n  display: flex;\n  gap: 10px;\n  min-width: fit-content;\n  flex-direction: column;\n\n  @media (max-width: 1000px) {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    flex-direction: row;\n  }\n\n  @media (max-width: 768px) {\n    display: grid;\n    grid-template-columns: repeat(1, 1fr);\n    flex-direction: row;\n  }\n\n  @media print {\n    display: none;\n  }\n"])));
 var SummaryButton = styled(Button)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n"], ["\n  height: 100%;\n"])));
 export var Summary = function (_a) {
-    var finderResponse = _a.finderResponse, rfbResponse = _a.rfbResponse, onClickPrint = _a.onClickPrint;
+    var finderResponse = _a.finderResponse, rfbResponse = _a.rfbResponse;
     var _b = useCardsAndProducts({
         finderResponse: finderResponse,
         rfbResponse: rfbResponse
@@ -24,15 +24,8 @@ export var Summary = function (_a) {
         React.createElement(ContainerSummary, { className: "credithub-container-summary" },
             React.createElement(ContentSummary, { className: "credithub-content-summary" }, cards.map(function (card, index) { return (React.createElement(FieldSummary, { key: index, fullRow: card.header === 'Nome' || card.header === 'Nome Da Mãe' },
                 React.createElement(AddItemField, { name: card.header, value: card.title }))); })),
-            React.createElement(ButtonsWrapper, null,
-                products.map(function (product, index) { return (React.createElement(ButtonsSummary, { key: index, style: { display: (product === null || product === void 0 ? void 0 : product.hide) ? 'none' : '', width: '100%' } },
-                    React.createElement(SummaryButton, { onClick: function () { return (product === null || product === void 0 ? void 0 : product.onClick) && (product === null || product === void 0 ? void 0 : product.onClick()); }, smallContent: product.price ? formatMoney(product.price) : undefined }, product.title))); }),
-                React.createElement(PrintButton, { onClickPrint: onClickPrint })))));
-};
-var PrintButton = function (_a) {
-    var onClickPrint = _a.onClickPrint;
-    return (React.createElement(ButtonsSummary, null,
-        React.createElement(SummaryButton, { onClick: onClickPrint }, "PDF para Impress\u00E3o")));
+            React.createElement(ButtonsWrapper, null, products.map(function (product, index) { return (React.createElement(ButtonsSummary, { key: index, style: { display: (product === null || product === void 0 ? void 0 : product.hide) ? 'none' : '', width: '100%' } },
+                React.createElement(SummaryButton, { onClick: function () { return (product === null || product === void 0 ? void 0 : product.onClick) && (product === null || product === void 0 ? void 0 : product.onClick()); }, smallContent: product.price ? formatMoney(product.price) : undefined }, product.title))); })))));
 };
 export default Summary;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/dossie/transactionTable/transactionTable.js

@@ -8,8 +8,8 @@ import XPathUtils from '../../../utils/xpath';
 import styled from 'styled-components';
 import IconePessoa from '../../../assets/icones/iconePessoa';
 import theme from '../../../components/interface/theme';
-var StyledContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  margin-bottom: 20px;\n  border-top: 1.6px solid ", ";\n  padding: 16px;\n  @media (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"], ["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  margin-bottom: 20px;\n  border-top: 1.6px solid ", ";\n  padding: 16px;\n  @media (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"])), theme.colors.cinzaClaro);
-var Header = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  grid-row: 1 / 6;\n  padding: 16px;\n  margin: 16px;\n  row-gap: 20px;\n  @media (max-width: 992px) {\n    padding: 0 0 16px 0;\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  grid-row: 1 / 6;\n  padding: 16px;\n  margin: 16px;\n  row-gap: 20px;\n  @media (max-width: 992px) {\n    padding: 0 0 16px 0;\n  }\n"])));
+var StyledContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  margin-bottom: 20px;\n  border-top: 1.6px solid ", ";\n  padding: 16px;\n  @media screen and (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"], ["\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  margin-bottom: 20px;\n  border-top: 1.6px solid ", ";\n  padding: 16px;\n  @media screen and (max-width: 992px) {\n    grid-template-columns: 1fr;\n  }\n"])), theme.colors.cinzaClaro);
+var Header = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  grid-row: 1 / 6;\n  padding: 16px;\n  margin: 16px;\n  row-gap: 20px;\n  @media (max-width: 992px) {\n    padding: 0 0 16px 0;\n    justify-content: flex-start;\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  grid-row: 1 / 6;\n  padding: 16px;\n  margin: 16px;\n  row-gap: 20px;\n  @media (max-width: 992px) {\n    padding: 0 0 16px 0;\n    justify-content: flex-start;\n  }\n"])));
 var Title = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: 18px;\n  font-weight: bold;\n  text-align: center;\n"], ["\n  font-size: 18px;\n  font-weight: bold;\n  text-align: center;\n"])));
 var TransactionContent = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: 16px;\n  align-items: flex-start;\n"], ["\n  display: flex;\n  align-items: center;\n  padding: 16px;\n  align-items: flex-start;\n"])));
 var UserField = styled.span(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  flex: 1;\n  padding-right: 16px;\n"], ["\n  flex: 1;\n  padding-right: 16px;\n"])));

package/dist/components/interface/header.d.ts

@@ -18,6 +18,7 @@ export type HeaderProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTML
     actionsClassName?: string;
     innerRef?: React.LegacyRef<HTMLDivElement>;
     variant?: 'default' | 'error' | 'loading';
+    printBar?: boolean;
 };
 declare const Header: React.FC<HeaderProps>;
 export default Header;

package/dist/components/interface/header.js

@@ -24,40 +24,42 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React from 'react';
+import React, { useMemo } from 'react';
 import classNames from 'classnames';
 import styled from 'styled-components';
 import theme from './theme';
 import LoadingBar from './loadingBar';
 var Title = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  color: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  color: ", ";\n"])), theme.typography.headline24.fontSize, theme.typography.headline24.fontWeight, theme.typography.headline24.lineHeight, theme.colors.azulCredithub);
-var Subtitle = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  font-style: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  font-size: ", ";\n  font-style: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), theme.typography.body18.fontSize, theme.typography.body18.fontStyle, theme.typography.body18.fontWeight, theme.typography.body18.lineHeight);
-var Description = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  gap: 10px;\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  letter-spacing: ", ";\n"], ["\n  display: flex;\n  gap: 10px;\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  letter-spacing: ", ";\n"])), theme.typography.label14.fontStyle, theme.typography.label14.fontWeight, theme.typography.label14.fontSize, theme.typography.label14.lineHeight, theme.typography.label14.letterSpacing);
+var Subtitle = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: ", ";\n  font-size: ", ";\n  font-style: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"], ["\n  display: ", ";\n  font-size: ", ";\n  font-style: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n"])), function (props) { return (props.hidden ? 'none' : 'block'); }, theme.typography.body18.fontSize, theme.typography.body18.fontStyle, theme.typography.body18.fontWeight, theme.typography.body18.lineHeight);
+var Description = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: ", ";\n  gap: 10px;\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  letter-spacing: ", ";\n\n  @media screen and (max-width: 768px) {\n    flex-direction: column;\n  }\n"], ["\n  display: ", ";\n  gap: 10px;\n  font-style: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  letter-spacing: ", ";\n\n  @media screen and (max-width: 768px) {\n    flex-direction: column;\n  }\n"])), function (props) { return (props.hidden ? 'none' : 'flex'); }, theme.typography.label14.fontStyle, theme.typography.label14.fontWeight, theme.typography.label14.fontSize, theme.typography.label14.lineHeight, theme.typography.label14.letterSpacing);
 var HeaderUI = styled(function (_a) {
     var children = _a.children, props = __rest(_a, ["children"]);
     return (React.createElement("header", __assign({}, props), children));
-})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background: #ffffff !important;\n  box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n  border-radius: 30px;\n  padding: 30px 20px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n\n  ", " {\n    color: ", ";\n  }\n"], ["\n  background: #ffffff !important;\n  box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n  border-radius: 30px;\n  padding: 30px 20px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n\n  ", " {\n    color: ", ";\n  }\n"])), Title, function (props) { return props.color; });
-var HeaderContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  gap: 20px;\n"], ["\n  display: flex;\n  gap: 20px;\n"])));
+})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  @media screen {\n    background: #ffffff !important;\n    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n    border-radius: 30px;\n  }\n  padding: 30px 20px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n\n  ", " {\n    color: ", ";\n  }\n"], ["\n  @media screen {\n    background: #ffffff !important;\n    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15);\n    border-radius: 30px;\n  }\n  padding: 30px 20px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n\n  ", " {\n    color: ", ";\n  }\n"])), Title, function (props) { return props.color; });
+var HeaderContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  gap: 20px;\n\n  @media print {\n    width: 100%;\n  }\n"], ["\n  display: flex;\n  gap: 20px;\n\n  @media print {\n    width: 100%;\n  }\n"])));
 var ActionsList = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  gap: 10px;\n"], ["\n  display: flex;\n  flex-direction: row;\n  gap: 10px;\n"])));
-var IconWrapper = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  width: 30px;\n"], ["\n  display: flex;\n  align-items: center;\n  width: 30px;\n"])));
-var TextWrapper = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n\n  .text-wrapper-subtitle-description {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 20px;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      align-items: flex-start;\n    }\n\n    @media print {\n      flex-direction: row;\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n\n  .text-wrapper-subtitle-description {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 20px;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      align-items: flex-start;\n    }\n\n    @media print {\n      flex-direction: row;\n    }\n  }\n"])));
+var IconWrapper = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: flex;\n  align-items: flex-start;\n  padding-top: 5px;\n  width: 30px;\n"], ["\n  display: flex;\n  align-items: flex-start;\n  padding-top: 5px;\n  width: 30px;\n"])));
+var TextWrapper = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n\n  @media print {\n    width: 100%;\n    border-bottom: ", " solid\n      ", ";\n    padding-bottom: 30px;\n  }\n\n  .text-wrapper-subtitle-description {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 20px;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      align-items: flex-start;\n    }\n\n    @media print {\n      flex-direction: row;\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n\n  @media print {\n    width: 100%;\n    border-bottom: ", " solid\n      ", ";\n    padding-bottom: 30px;\n  }\n\n  .text-wrapper-subtitle-description {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 20px;\n    align-items: center;\n\n    @media (max-width: 768px) {\n      align-items: flex-start;\n    }\n\n    @media print {\n      flex-direction: row;\n    }\n  }\n"])), function (_a) {
+    var _b = _a.printBar, printBar = _b === void 0 ? true : _b;
+    return (printBar ? '1px' : '0px');
+}, theme.colors.cinzaClaro);
 var Header = function (_a) {
-    var title = _a.title, subtitle = _a.subtitle, description = _a.description, actions = _a.actions, Icon = _a.icon, type = _a.variant, iconProps = _a.iconProps, loadingProps = _a.loadingProps, className = _a.className, titleClassName = _a.titleClassName, subtitleClassName = _a.subtitleClassName, descriptionClassName = _a.descriptionClassName, containerClassName = _a.containerClassName, actionsClassName = _a.actionsClassName, innerRef = _a.innerRef, props = __rest(_a, ["title", "subtitle", "description", "actions", "icon", "variant", "iconProps", "loadingProps", "className", "titleClassName", "subtitleClassName", "descriptionClassName", "containerClassName", "actionsClassName", "innerRef"]);
+    var title = _a.title, subtitle = _a.subtitle, description = _a.description, actions = _a.actions, Icon = _a.icon, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, iconProps = _a.iconProps, loadingProps = _a.loadingProps, className = _a.className, titleClassName = _a.titleClassName, subtitleClassName = _a.subtitleClassName, descriptionClassName = _a.descriptionClassName, containerClassName = _a.containerClassName, actionsClassName = _a.actionsClassName, innerRef = _a.innerRef, _c = _a.printBar, printBar = _c === void 0 ? true : _c, props = __rest(_a, ["title", "subtitle", "description", "actions", "icon", "variant", "iconProps", "loadingProps", "className", "titleClassName", "subtitleClassName", "descriptionClassName", "containerClassName", "actionsClassName", "innerRef", "printBar"]);
     var headerClass = classNames(className);
     var actionsClass = classNames(actionsClassName);
     var containerClass = classNames(containerClassName);
-    var isLoading = type === 'loading';
-    var variantColor = getVariantColor(type);
-    return (React.createElement("div", { ref: innerRef },
-        React.createElement(HeaderUI, __assign({ className: headerClass, color: variantColor }, props),
-            React.createElement(HeaderContainer, { className: containerClass },
-                React.createElement(IconWrapper, null, Icon && React.createElement(Icon, __assign({}, iconProps, { circleFill: variantColor }))),
-                React.createElement(TextWrapper, null,
-                    React.createElement(Title, { hidden: !title, className: classNames(titleClassName) }, title),
-                    React.createElement("div", { className: "text-wrapper-subtitle-description" },
-                        React.createElement(Subtitle, { hidden: isLoading || !subtitle, className: subtitleClassName }, subtitle),
-                        React.createElement(Description, { hidden: isLoading || !description, className: descriptionClassName }, description)),
-                    React.createElement(LoadingBar, { percentage: (loadingProps === null || loadingProps === void 0 ? void 0 : loadingProps.percentage) || 0, hidden: !isLoading }))),
-            React.createElement(ActionsList, { className: actionsClass }, actions && actions))));
+    var isLoading = variant === 'loading';
+    var variantColor = useMemo(function () { return getVariantColor(variant); }, [variant]);
+    return (React.createElement(HeaderUI, __assign({ className: headerClass, ref: innerRef, color: variantColor }, props),
+        React.createElement(HeaderContainer, { className: containerClass },
+            React.createElement(IconWrapper, null, Icon && React.createElement(Icon, __assign({}, iconProps, { circleFill: variantColor }))),
+            React.createElement(TextWrapper, { printBar: printBar },
+                React.createElement(Title, { hidden: !title, className: classNames(titleClassName) }, title),
+                React.createElement("div", { className: "text-wrapper-subtitle-description" },
+                    React.createElement(Subtitle, { hidden: isLoading || !subtitle, className: subtitleClassName }, subtitle),
+                    React.createElement(Description, { hidden: isLoading || !description, className: descriptionClassName }, description)),
+                React.createElement(LoadingBar, { percentage: (loadingProps === null || loadingProps === void 0 ? void 0 : loadingProps.percentage) || 0, hidden: !isLoading }))),
+        React.createElement(ActionsList, { className: actionsClass }, actions && actions)));
 };
 var getVariantColor = function (type) {
     if (type === void 0) { type = 'default'; }

package/dist/components/interface/responsiveGrid.js

@@ -3,6 +3,6 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     return cooked;
 };
 import styled from 'styled-components';
-var ResponsiveGrid = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  ", ";\n\n  @media (max-width: 767px) {\n    grid-template-columns: ", ";\n    gap: 16px;\n  }\n\n  @media (min-width: 768px) {\n    grid-template-columns: ", ";\n  }\n\n  @media (min-width: 1000px) {\n    grid-template-columns: ", ";\n  }\n\n  @media print {\n    grid-template-columns: ", ";\n  }\n"], ["\n  display: grid;\n  ", ";\n\n  @media (max-width: 767px) {\n    grid-template-columns: ", ";\n    gap: 16px;\n  }\n\n  @media (min-width: 768px) {\n    grid-template-columns: ", ";\n  }\n\n  @media (min-width: 1000px) {\n    grid-template-columns: ", ";\n  }\n\n  @media print {\n    grid-template-columns: ", ";\n  }\n"])), function (props) { return props.fullWidth && 'width: 100%'; }, function (props) { return props.mobile || 'auto'; }, function (props) { return props.tablet || 'auto'; }, function (props) { return props.desktop || 'auto'; }, function (props) { return props.desktop || 'auto'; });
+var ResponsiveGrid = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  ", ";\n\n  @media (max-width: 767px) {\n    grid-template-columns: ", ";\n    gap: 16px;\n  }\n\n  @media (min-width: 768px) {\n    grid-template-columns: ", ";\n  }\n\n  @media (min-width: 1000px) {\n    grid-template-columns: ", ";\n  }\n\n  @media print {\n    grid-template-columns: ", ";\n  }\n"], ["\n  display: grid;\n  ", ";\n\n  @media (max-width: 767px) {\n    grid-template-columns: ", ";\n    gap: 16px;\n  }\n\n  @media (min-width: 768px) {\n    grid-template-columns: ", ";\n  }\n\n  @media (min-width: 1000px) {\n    grid-template-columns: ", ";\n  }\n\n  @media print {\n    grid-template-columns: ", ";\n  }\n"])), function (props) { return props.fullWidth && 'width: 100%'; }, function (props) { return props.mobile || 'auto'; }, function (props) { return props.tablet || 'auto'; }, function (props) { return props.desktop || 'auto'; }, function (props) { return props.print || props.desktop || 'auto'; });
 export default ResponsiveGrid;
 var templateObject_1;

package/dist/components/interface/result.js

@@ -4,8 +4,9 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
 };
 import styled from 'styled-components';
 import ResponsiveGrid from './responsiveGrid';
+import theme from './theme';
 export var ResultContent = styled(ResponsiveGrid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 18px 59px;\n  box-sizing: border-box;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: 8px;\n\n  > * {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n  }\n"], ["\n  padding: 18px 59px;\n  box-sizing: border-box;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  gap: 8px;\n\n  > * {\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-start;\n  }\n"])));
-export var Result = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: ", ";\n  flex-direction: column;\n  padding: 37px 20px;\n\n  ", " {\n    :nth-child(odd) {\n      background: ", ";\n      border-radius: 60px;\n    }\n  }\n"], ["\n  display: ", ";\n  flex-direction: column;\n  padding: 37px 20px;\n\n  ", " {\n    :nth-child(odd) {\n      background: ", ";\n      border-radius: 60px;\n    }\n  }\n"])), function (props) {
+export var Result = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: ", ";\n  flex-direction: column;\n  padding: 37px 20px;\n\n  ", " {\n    :nth-child(odd) {\n      background: ", ";\n      border-radius: 60px;\n    }\n\n    @media print {\n      :not(:last-child) {\n        border-radius: 0px !important;\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n"], ["\n  display: ", ";\n  flex-direction: column;\n  padding: 37px 20px;\n\n  ", " {\n    :nth-child(odd) {\n      background: ", ";\n      border-radius: 60px;\n    }\n\n    @media print {\n      :not(:last-child) {\n        border-radius: 0px !important;\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n"])), function (props) {
     var _a;
     var haveChildren = Array.isArray(props.children)
         ? (_a = props.children) === null || _a === void 0 ? void 0 : _a.length
@@ -14,5 +15,5 @@ export var Result = styled.div(templateObject_2 || (templateObject_2 = __makeTem
 }, ResultContent, function (_a) {
     var _b = _a.resultContentStriped, resultContentStriped = _b === void 0 ? true : _b;
     return resultContentStriped ? '#FFFFFF' : 'transparent';
-});
+}, theme.colors.cinzaClaro);
 var templateObject_1, templateObject_2;

package/dist/components/interface/section.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { HeaderProps } from './header';
 export interface SectionProps extends React.PropsWithChildren<{
     onClose?: () => void;
+    onClickPrint?: () => void;
     minimized?: boolean;
     contentClassName?: string;
 } & HeaderProps> {

package/dist/components/interface/section.js

@@ -11,15 +11,18 @@ import ChevronUp from '../../assets/btn/chevronUp';
 import CloseIcon from '../../assets/btn/closeIcon';
 import BtnWrapper from '../../assets/btn/btnWrapper';
 import styled from 'styled-components';
+import PrintIcon from '../../assets/btn/printIcon';
 var SectionContaner = styled.section(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  @media screen {\n    background-color: rgb(239, 239, 239);\n  }\n"], ["\n  @media screen {\n    background-color: rgb(239, 239, 239);\n  }\n"])));
 var ResultContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: ", ";\n  position: relative;\n  margin-top: 20px;\n  flex-direction: column;\n  row-gap: 20px;\n  @media screen {\n    background-color: #efefef;\n  }\n"], ["\n  display: ", ";\n  position: relative;\n  margin-top: 20px;\n  flex-direction: column;\n  row-gap: 20px;\n  @media screen {\n    background-color: #efefef;\n  }\n"])), function (props) { return (props.hide ? 'none' : 'flex'); });
 var Section = function (_a) {
-    var title = _a.title, subtitle = _a.subtitle, description = _a.description, _b = _a.minimized, minimized = _b === void 0 ? false : _b, onClose = _a.onClose, variant = _a.variant, loadingProps = _a.loadingProps, icon = _a.icon, actions = _a.actions, children = _a.children, className = _a.className, contentClassName = _a.contentClassName;
+    var title = _a.title, subtitle = _a.subtitle, description = _a.description, _b = _a.minimized, minimized = _b === void 0 ? false : _b, onClose = _a.onClose, variant = _a.variant, loadingProps = _a.loadingProps, icon = _a.icon, actions = _a.actions, children = _a.children, onClickPrint = _a.onClickPrint, className = _a.className, contentClassName = _a.contentClassName;
     var _c = useToggle(!minimized), isOpen = _c[0], toggleOpen = _c[1];
     var sectionClass = classNames(className);
     var sectionContentClass = classNames(contentClassName);
     return (React.createElement(SectionContaner, { className: sectionClass },
         React.createElement(Header, { title: title, subtitle: subtitle, description: description, loadingProps: loadingProps, icon: icon, variant: variant, actions: React.createElement(React.Fragment, null,
+                React.createElement(BtnWrapper, null,
+                    React.createElement(PrintIcon, { onClick: onClickPrint })),
                 children && (React.createElement(BtnWrapper, { hidden: variant === 'loading', onClick: toggleOpen }, isOpen ? React.createElement(ChevronUp, null) : React.createElement(ChevronDown, null))),
                 onClose && (React.createElement(BtnWrapper, { onClick: onClose },
                     React.createElement(CloseIcon, null))),

package/dist/components/protestos/protestosList.js

@@ -51,7 +51,7 @@ export var ProtestoItem = memo(function (_a) {
     var formatBooleanField = function (value) {
         return value === 'true' ? 'Sim' : 'Não';
     };
-    return (React.createElement(ResultContent, { desktop: "repeat(8, 1fr)", tablet: "repeat(4, 1fr)", mobile: 'repeat(2, 1fr)' },
+    return (React.createElement(ResultContent, { print: "repeat(7, 1fr)", desktop: "repeat(8, 1fr)", tablet: "repeat(4, 1fr)", mobile: "repeat(2, 1fr)" },
         React.createElement(AddItemField, { name: "Quem Protestou", value: getField('./nomeCedente') }),
         React.createElement(AddItemField, { name: "Atrav\u00E9s De", value: getField('./nomeApresentante') }),
         React.createElement(AddItemField, { name: "CPF/CNPJ Protestado", value: formatDocument(getField('./cpfCnpj')) }),

package/dist/components/webservice.js

@@ -25,6 +25,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 var _a;
+/* eslint-disable react-hooks/exhaustive-deps */
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable react-hooks/rules-of-hooks */
 import { Client } from '@credithub/webservice';
@@ -37,6 +38,7 @@ import useToggle from '../hooks/useToggle';
 import ChevronUp from '../assets/btn/chevronUp';
 import ChevronDown from '../assets/btn/chevronDown';
 import styled from 'styled-components';
+import { PrintSectionWrapper } from './common/printSectionWrapper';
 export var WebService = createContext(new Client.WebService());
 export var WebServiceProvider = function (_a) {
     var credential = _a.credential, children = _a.children;
@@ -189,38 +191,33 @@ var Section = function (_a) {
     var _f = useToggle(!minimized), isOpen = _f[0], toggleOpen = _f[1];
     if (!ctx)
         return null;
-    var renderResponse = function () {
-        switch (ctx.type) {
+    var type = ctx.type;
+    var renderResponse = useCallback(function () {
+        switch (type) {
             case RequestStatus.Success:
-                return onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(ctx.document, ctx);
+                return onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(ctx === null || ctx === void 0 ? void 0 : ctx.document, ctx);
             case RequestStatus.Error:
-                return isError === null || isError === void 0 ? void 0 : isError(ctx.error, ctx);
+                return isError === null || isError === void 0 ? void 0 : isError(ctx === null || ctx === void 0 ? void 0 : ctx.error, ctx);
             case RequestStatus.Loading:
                 return onLoading === null || onLoading === void 0 ? void 0 : onLoading(ctx);
             default:
                 return children;
         }
-    };
+    }, [type]);
     var renderedResponse = renderResponse();
-    var defaultHeaderActions = (React.createElement(React.Fragment, null,
-        React.createElement(BtnWrapper, { hidden: (ctx === null || ctx === void 0 ? void 0 : ctx.type) === RequestStatus.Loading, onClick: toggleOpen }, isOpen ? React.createElement(ChevronUp, null) : React.createElement(ChevronDown, null))));
+    var defaultHeaderActions = useMemo(function () { return (React.createElement(BtnWrapper, { hidden: type === RequestStatus.Loading, onClick: toggleOpen }, isOpen ? React.createElement(ChevronUp, null) : React.createElement(ChevronDown, null))); }, [type, isOpen, toggleOpen]);
+    var renderHeader = function (props) { return (React.createElement(Header, __assign({ printBar: renderedResponse !== null && isOpen }, props, { className: cn(className, headerStatus[type], props.className), variant: type === RequestStatus.Loading ? 'loading' : props.variant, actions: React.createElement(React.Fragment, null,
+            props.actions,
+            renderedResponse && defaultHeaderActions) }))); };
     if (React.isValidElement(renderedResponse)) {
-        return (React.createElement("div", null,
-            !hideHeader && (React.createElement(Header, __assign({}, headerProps, { className: cn(className, headerStatus[ctx.type]), hidden: hideHeader, variant: ctx.type === RequestStatus.Loading
-                    ? 'loading'
-                    : headerProps.variant, actions: React.createElement(React.Fragment, null,
-                    headerProps.actions,
-                    defaultHeaderActions) }))),
+        return (React.createElement(PrintSectionWrapper, { enabled: !hideHeader },
+            !hideHeader && renderHeader(headerProps),
             React.createElement(ShowRenderedChildren, { isOpen: isOpen }, renderedResponse)));
     }
     var _g = renderedResponse, renderedChildren = _g.children, headerReplaceProps = __rest(_g, ["children"]);
-    var headerPropsUnified = Object.assign(headerProps, headerReplaceProps);
-    return (React.createElement("div", null,
-        !hideHeader && (React.createElement(Header, __assign({}, headerPropsUnified, { className: cn(className, headerStatus[ctx.type], headerPropsUnified.className), variant: ctx.type === RequestStatus.Loading
-                ? 'loading'
-                : headerPropsUnified.variant, actions: React.createElement(React.Fragment, null,
-                headerPropsUnified.actions,
-                renderedChildren && defaultHeaderActions) }))),
+    var headerPropsUnified = __assign(__assign(__assign({}, headerProps), headerReplaceProps), { printBar: renderedChildren !== null && isOpen });
+    return (React.createElement(PrintSectionWrapper, { enabled: !hideHeader },
+        !hideHeader && renderHeader(headerPropsUnified),
         React.createElement(ShowRenderedChildren, { isOpen: isOpen }, renderedChildren)));
 };
 var ShowRenderedChildren = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: ", ";\n\n  /* @media print {\n    display: block;\n  } */\n"], ["\n  display: ", ";\n\n  /* @media print {\n    display: block;\n  } */\n"])), function (props) { return (props.isOpen ? 'block' : 'none'); });

package/dist/consultaSimples.js

@@ -16,7 +16,7 @@ import Dominios from './components/dominios/dominios';
 import Liminar from './components/liminar/liminar';
 import ConsultaSimplesSection from './components/consultaSimplesSection/consultaSimplesSection';
 Chart.register.apply(Chart, registerables);
-var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-family: 'Open Sans Condensed';\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  * {\n    -webkit-print-color-adjust: exact !important;\n    color-adjust: exact !important;\n    print-color-adjust: exact !important;\n  }\n\n  @media print {\n    @page {\n      size: auto;\n      margin: 0mm 0mm 0mm 0mm;\n    }\n  }\n"], ["\n  font-family: 'Open Sans Condensed';\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  * {\n    -webkit-print-color-adjust: exact !important;\n    color-adjust: exact !important;\n    print-color-adjust: exact !important;\n  }\n\n  @media print {\n    @page {\n      size: auto;\n      margin: 0mm 0mm 0mm 0mm;\n    }\n  }\n"])));
+var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-family: 'Open Sans Condensed';\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  * {\n    -webkit-print-color-adjust: exact !important;\n    color-adjust: exact !important;\n    print-color-adjust: exact !important;\n  }\n\n  @media print {\n    @page {\n      size: auto;\n      margin: 5mm;\n    }\n  }\n"], ["\n  font-family: 'Open Sans Condensed';\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  * {\n    -webkit-print-color-adjust: exact !important;\n    color-adjust: exact !important;\n    print-color-adjust: exact !important;\n  }\n\n  @media print {\n    @page {\n      size: auto;\n      margin: 5mm;\n    }\n  }\n"])));
 var ConsultaSimples = function (_a) {
     var _documento = _a.documento, onClickConsultarProcessoJuridico = _a.onClickConsultarProcessoJuridico, onClickQSA = _a.onClickQSA, onClickPrint = _a.onClickPrint, apiKey = _a.apiKey, onClose = _a.onClose, hasCredits = _a.hasCredits;
     var documento = _documento.replace(/\D+/g, '');
@@ -31,9 +31,9 @@ var ConsultaSimples = function (_a) {
                                 React.createElement(Queries.ProcessosJuridicos.Request, { data: { documento: documento } },
                                     React.createElement(Queries.Liminar.Request, { data: { documento: documento } },
                                         React.createElement(Wrapper, null,
-                                            React.createElement(ConsultaSimplesSection, { documento: documento, onClose: onClose },
+                                            React.createElement(ConsultaSimplesSection, { documento: documento, onClose: onClose, onClickPrint: onClickPrint },
                                                 React.createElement(ConsultaRfbProvider, { documento: documento },
-                                                    React.createElement(Dossie, { onClickPrint: onClickPrint, documento: documento }),
+                                                    React.createElement(Dossie, { documento: documento }),
                                                     React.createElement(Liminar, null),
                                                     React.createElement(Addresses, { apiKey: apiKey }),
                                                     React.createElement(Contacts, null),