@credithub/harlan-components 1.13.8 → 1.14.0

package/lib/esm/components/chart/hooks/useChartData.d.ts

@@ -0,0 +1,8 @@
+import { DataInput } from "../../../components/chart/types/iChart";
+declare const useChartData: (documento: string) => {
+    data: DataInput | null;
+    isLoading: boolean;
+    error: string | Error | null;
+    refetch: () => void;
+};
+export default useChartData;

package/lib/esm/components/chart/hooks/useChartData.js

@@ -0,0 +1,59 @@
+import { useContext, useEffect, useState, useMemo } from "react";
+import { useQuery, Queries, RequestStatus } from "../../../components/webservice";
+import { processData, processProtestData } from "../utils/dataProcessing";
+var useChartData = function (documento) {
+    var _a = useState(null), data = _a[0], setData = _a[1];
+    var _b = useState(null), errorState = _b[0], setErrorState = _b[1];
+    var _c = useQuery("SELECT FROM 'DOCUMENTHISTORY'.'BASICHISTORY'", {
+        documento: documento,
+    }), response = _c.response, queryError = _c.error, isLoading = _c.isLoading, refetch = _c.refetch;
+    var ctxProtestos = useContext(Queries.Protestos);
+    var ctxCCF = useContext(Queries.CCF);
+    var ctxProcessosJuridicos = useContext(Queries.ProcessosJuridicos);
+    var quantidadeProcessosJuridicos = useMemo(function () {
+        var _a;
+        if ((ctxProcessosJuridicos === null || ctxProcessosJuridicos === void 0 ? void 0 : ctxProcessosJuridicos.type) === RequestStatus.Success &&
+            ((_a = ctxProcessosJuridicos.document) === null || _a === void 0 ? void 0 : _a.empresa)) {
+            return ctxProcessosJuridicos.document.empresa.length;
+        }
+        return 0;
+    }, [ctxProcessosJuridicos]);
+    var liveQueriesIsFinish = useMemo(function () {
+        return [
+            ctxProtestos === null || ctxProtestos === void 0 ? void 0 : ctxProtestos.type,
+            ctxCCF === null || ctxCCF === void 0 ? void 0 : ctxCCF.type,
+            ctxProcessosJuridicos === null || ctxProcessosJuridicos === void 0 ? void 0 : ctxProcessosJuridicos.type,
+        ].every(function (status) { return status !== RequestStatus.Loading; });
+    }, [ctxProtestos, ctxCCF, ctxProcessosJuridicos]);
+    var dadosProtestos = useMemo(function () {
+        if ((ctxProtestos === null || ctxProtestos === void 0 ? void 0 : ctxProtestos.type) === RequestStatus.Success && ctxProtestos.data) {
+            return processProtestData(ctxProtestos.document);
+        }
+        return [];
+    }, [ctxProtestos]);
+    useEffect(function () {
+        if (!isLoading &&
+            !queryError &&
+            (response === null || response === void 0 ? void 0 : response.document) &&
+            liveQueriesIsFinish) {
+            try {
+                var parsedData = JSON.parse(response.document);
+                parsedData.protestosCategory = dadosProtestos;
+                var processedData = processData(parsedData, quantidadeProcessosJuridicos);
+                setData(processedData);
+            }
+            catch (e) {
+                console.error("Erro ao processar os dados", e);
+                setErrorState("Erro ao processar os dados");
+            }
+        }
+    }, [
+        isLoading,
+        response,
+        queryError,
+        liveQueriesIsFinish,
+        quantidadeProcessosJuridicos,
+    ]);
+    return { data: data, isLoading: isLoading, error: errorState || queryError, refetch: refetch };
+};
+export default useChartData;

package/lib/esm/components/chart/hooks/useMixedChartData.d.ts

@@ -0,0 +1,10 @@
+import { ChartData, ChartOptions } from "chart.js";
+import { DataInput, TimeFilter } from "../types/iChart";
+import "chartjs-adapter-date-fns";
+export declare const useMixedChartData: (dataInput: DataInput, timeFilter?: TimeFilter) => {
+    data: ChartData<"line" | "bar", (number | {
+        x: string;
+        y: number;
+    })[], string>;
+    options: ChartOptions<"line" | "bar">;
+};

package/lib/esm/components/chart/hooks/useMixedChartData.js

@@ -0,0 +1,43 @@
+import { useMemo } from "react";
+import "chartjs-adapter-date-fns";
+import { getEndDate, getUniqueDates, addMissingDateEntries, getFilteredStartDate, getEarliestDate, } from "../utils/dataManipulation";
+import { createDatasets, getChartOptions } from "../utils/chartCustomization";
+export var useMixedChartData = function (dataInput, timeFilter) {
+    if (timeFilter === void 0) { timeFilter = "1m"; }
+    return useMemo(function () {
+        var filteredStartDate = getFilteredStartDate(timeFilter, dataInput);
+        var endDate = getEndDate();
+        var fullDataStartDate = getEarliestDate(dataInput);
+        var fullProcessedData = {
+            protestos: addMissingDateEntries(dataInput.protestos, fullDataStartDate, endDate),
+            ccfs: addMissingDateEntries(dataInput.ccfs, fullDataStartDate, endDate),
+            serasa: addMissingDateEntries(dataInput.serasa, fullDataStartDate, endDate),
+            boaVista: addMissingDateEntries(dataInput.boaVista, fullDataStartDate, endDate),
+            dividasPublicasGrafico: addMissingDateEntries(dataInput.dividasPublicasGrafico, fullDataStartDate, endDate),
+        };
+        var processedData = {
+            protestos: fullProcessedData.protestos.filter(function (d) { return new Date(d.data) >= filteredStartDate; }),
+            ccfs: fullProcessedData.ccfs.filter(function (d) { return new Date(d.data) >= filteredStartDate; }),
+            serasa: fullProcessedData.serasa.filter(function (d) { return new Date(d.data) >= filteredStartDate; }),
+            boaVista: fullProcessedData.boaVista.filter(function (d) { return new Date(d.data) >= filteredStartDate; }),
+            dividasPublicasGrafico: fullProcessedData.dividasPublicasGrafico.filter(function (d) { return new Date(d.data) >= filteredStartDate; }),
+        };
+        var uniqueDates = getUniqueDates(processedData);
+        var datasets = createDatasets(processedData, uniqueDates, timeFilter);
+        var options = getChartOptions(timeFilter);
+        if (!options.plugins) {
+            options.plugins = {};
+        }
+        options.plugins.datalabels = {
+            display: false,
+        };
+        var labels = uniqueDates;
+        return {
+            data: {
+                labels: labels,
+                datasets: datasets,
+            },
+            options: options,
+        };
+    }, [dataInput, timeFilter]);
+};

package/lib/esm/components/chart/hooks/usePieChartData.d.ts

@@ -0,0 +1,6 @@
+import { ChartData, ChartOptions } from "chart.js";
+import { DataInput } from "../types/iChart";
+export declare const usePieChartData: (dataInput: DataInput) => {
+    data: ChartData<"pie", number[], string>;
+    options: ChartOptions<"pie">;
+};

package/lib/esm/components/chart/hooks/usePieChartData.js

@@ -0,0 +1,89 @@
+import { useMemo } from "react";
+import { useWindowSize } from "../../../hooks/useWindowSize";
+export var usePieChartData = function (dataInput) {
+    var width = useWindowSize().width;
+    return useMemo(function () {
+        var _a;
+        var getLastValue = function (arr) { var _a; return arr.length > 0 ? (_a = arr[arr.length - 1].quantidade) !== null && _a !== void 0 ? _a : 0 : 0; };
+        var totalProtestos = getLastValue(dataInput.protestos);
+        var totalCCFs = getLastValue(dataInput.ccfs);
+        var totalSerasa = getLastValue(dataInput.serasa);
+        var totalBoaVista = getLastValue(dataInput.boaVista);
+        var totalDividasPublicas = getLastValue(dataInput.dividasPublicasGrafico);
+        var processosJuridicos = (_a = dataInput.pieChartTotalConfig) === null || _a === void 0 ? void 0 : _a.processosJuridicos;
+        var chartData = {
+            labels: [
+                "Protestos",
+                "Cheques Devolvidos",
+                "Pefin/Refin Serasa",
+                "Pefin/Refin Boa Vista",
+                "Dívidas Públicas",
+                "Processos Jurídicos",
+            ],
+            datasets: [
+                {
+                    data: [
+                        totalProtestos,
+                        totalCCFs,
+                        totalSerasa,
+                        totalBoaVista,
+                        totalDividasPublicas,
+                        processosJuridicos !== null && processosJuridicos !== void 0 ? processosJuridicos : 0,
+                    ],
+                    backgroundColor: [
+                        "#ff4081",
+                        "#3f51b5",
+                        "#008cf8",
+                        "#ffc107",
+                        "#4caf50",
+                        "#58508d",
+                    ],
+                    hoverOffset: 4,
+                },
+            ],
+        };
+        var aspectRatio = width < 1000 ? 1.5 : 1;
+        var options = {
+            responsive: true,
+            maintainAspectRatio: true,
+            aspectRatio: aspectRatio,
+            layout: {
+                padding: {
+                    top: 32,
+                },
+            },
+            plugins: {
+                legend: {
+                    position: "right",
+                    align: "start",
+                    fullSize: true,
+                    labels: {
+                        boxWidth: 16,
+                        padding: 16,
+                    },
+                },
+                title: {
+                    display: true,
+                    text: "Quantidade de Ocorrências",
+                    font: {
+                        size: 12,
+                    },
+                    padding: {
+                        bottom: 8,
+                    },
+                },
+                datalabels: {
+                    color: "#fff",
+                    formatter: function (value) {
+                        return value > 0 ? value.toString() : "";
+                    },
+                    font: {
+                        weight: "bold",
+                    },
+                    textAlign: "center",
+                },
+            },
+        };
+        return { data: chartData, options: options };
+    }, [dataInput]);
+};

package/lib/esm/components/chart/quantityResult.js

@@ -6,35 +6,36 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
 import React from "react";
 import AddItemField from "../common/addItem";
 import { formatMoney, formatValue } from "../../utils/number";
-import { ResultContent } from "../interface/result";
+import { Result, ResultContent } from "../interface/result";
 import styled from "styled-components";
 import theme from "../interface/theme";
 var QuantityContainer = function (_a) {
     var children = _a.children;
-    return React.createElement("div", { className: "t" }, children);
+    return (React.createElement("div", { className: "t" }, children));
 };
-var QuantidadeResultadosWrapper = styled(ResultContent)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 18px 0px;\n  row-gap: 20px;\n  > * {\n    row-gap: 10px;\n  }\n  @media only screen and (max-width: 768px) {\n    > * {\n      :not(:last-child) {\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n  \n"], ["\n  padding: 18px 0px;\n  row-gap: 20px;\n  > * {\n    row-gap: 10px;\n  }\n  @media only screen and (max-width: 768px) {\n    > * {\n      :not(:last-child) {\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n  \n"])), theme.colors.cinzaClaro);
+var QuantidadeResultadosWrapper = styled(ResultContent)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 18px 20px;\n  row-gap: 20px;\n  > * {\n    row-gap: 10px;\n  }\n  @media only screen and (max-width: 768px) {\n    > * {\n      :not(:last-child) {\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n"], ["\n  padding: 18px 20px;\n  row-gap: 20px;\n  > * {\n    row-gap: 10px;\n  }\n  @media only screen and (max-width: 768px) {\n    > * {\n      :not(:last-child) {\n        border-bottom: 1px solid ", ";\n      }\n    }\n  }\n"])), theme.colors.cinzaClaro);
 var QuantidadeResultados = function (_a) {
     var _b = _a.quantidadeProtestos, quantidadeProtestos = _b === void 0 ? 0 : _b, _c = _a.quantidadeProcessos, quantidadeProcessos = _c === void 0 ? 0 : _c, _d = _a.quantidadeDividas, quantidadeDividas = _d === void 0 ? 0 : _d, _e = _a.quantidadeChequesSemFundos, quantidadeChequesSemFundos = _e === void 0 ? 0 : _e, _f = _a.quantidadeDividasSerasa, quantidadeDividasSerasa = _f === void 0 ? 0 : _f, _g = _a.quantidadeDividasBoaVista, quantidadeDividasBoaVista = _g === void 0 ? 0 : _g, _h = _a.valorTotalProtestos, valorTotalProtestos = _h === void 0 ? 0 : _h, _j = _a.valorTotalDividas, valorTotalDividas = _j === void 0 ? 0 : _j, _k = _a.valorTotalDividasSerasa, valorTotalDividasSerasa = _k === void 0 ? 0 : _k, _l = _a.valorTotalDividasBoaVista, valorTotalDividasBoaVista = _l === void 0 ? 0 : _l, _m = _a.ultimaOcorrenciaProtestos, ultimaOcorrenciaProtestos = _m === void 0 ? null : _m, _o = _a.ultimaOcorrenciaChequesSemFundos, ultimaOcorrenciaChequesSemFundos = _o === void 0 ? null : _o;
-    return (React.createElement(QuantidadeResultadosWrapper, { desktop: "repeat(6, 1fr)", tablet: "repeat(3, 1fr)", mobile: "1fr" },
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "Total Protestos", value: formatValue(quantidadeProtestos) }),
-            React.createElement(AddItemField, { name: "Valor Total Protestos", value: formatMoney(valorTotalProtestos) }),
-            React.createElement(AddItemField, { hidden: quantidadeProtestos == 0, name: "\u00DAltima Ocorr\u00EAncia", value: ultimaOcorrenciaProtestos })),
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "Cheques Sem Fundos", value: formatValue(quantidadeChequesSemFundos) }),
-            React.createElement(AddItemField, { hidden: quantidadeChequesSemFundos == 0, name: "\u00DAltima Ocorr\u00EAncia", value: ultimaOcorrenciaChequesSemFundos })),
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "Processos Jur\u00EDdicos", value: formatValue(quantidadeProcessos) })),
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "D\u00EDvidas P\u00FAblicas", value: formatValue(quantidadeDividas) }),
-            React.createElement(AddItemField, { name: "Total D\u00EDvidas P\u00FAblicas", value: formatMoney(valorTotalDividas) })),
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "Pefin Refin Serasa", value: formatValue(quantidadeDividasSerasa) }),
-            React.createElement(AddItemField, { name: "Total Pefin Refin Serasa", value: formatMoney(valorTotalDividasSerasa) })),
-        React.createElement(QuantityContainer, null,
-            React.createElement(AddItemField, { name: "Pefin Refin Boa Vista", value: formatValue(quantidadeDividasBoaVista) }),
-            React.createElement(AddItemField, { name: "Total Pefin Refin Boa Vista", value: formatMoney(valorTotalDividasBoaVista) }))));
+    return (React.createElement(Result, { resultContentStriped: false },
+        React.createElement(QuantidadeResultadosWrapper, { desktop: "repeat(6, 1fr)", tablet: "repeat(3, 1fr)", mobile: "1fr" },
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "Total Protestos", value: formatValue(quantidadeProtestos) }),
+                React.createElement(AddItemField, { name: "Valor Total Protestos", value: formatMoney(valorTotalProtestos) }),
+                React.createElement(AddItemField, { hidden: quantidadeProtestos == 0, name: "\u00DAltima Ocorr\u00EAncia", value: ultimaOcorrenciaProtestos })),
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "Cheques Sem Fundos", value: formatValue(quantidadeChequesSemFundos) }),
+                React.createElement(AddItemField, { hidden: quantidadeChequesSemFundos == 0, name: "\u00DAltima Ocorr\u00EAncia", value: ultimaOcorrenciaChequesSemFundos })),
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "Processos Jur\u00EDdicos", value: formatValue(quantidadeProcessos) })),
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "D\u00EDvidas P\u00FAblicas", value: formatValue(quantidadeDividas) }),
+                React.createElement(AddItemField, { name: "Total D\u00EDvidas P\u00FAblicas", value: formatMoney(valorTotalDividas) })),
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "Pefin Refin Serasa", value: formatValue(quantidadeDividasSerasa) }),
+                React.createElement(AddItemField, { name: "Total Pefin Refin Serasa", value: formatMoney(valorTotalDividasSerasa) })),
+            React.createElement(QuantityContainer, null,
+                React.createElement(AddItemField, { name: "Pefin Refin Boa Vista", value: formatValue(quantidadeDividasBoaVista) }),
+                React.createElement(AddItemField, { name: "Total Pefin Refin Boa Vista", value: formatMoney(valorTotalDividasBoaVista) })))));
 };
 export default QuantidadeResultados;
 var templateObject_1;

package/lib/esm/components/chart/types/iChart.d.ts

@@ -0,0 +1,58 @@
+export interface Consulta {
+    data: string | Date;
+    categoria?: string;
+    quantidade?: number | null;
+    creation?: string | Date;
+    valorTotal?: number | null;
+    total?: number | null;
+}
+export interface DataInput {
+    ccfs: Consulta[];
+    protestos: Consulta[];
+    serasa: Consulta[];
+    boaVista: Consulta[];
+    dividasPublicasGrafico: Consulta[];
+    pieChartTotalConfig?: {
+        protestos?: {
+            total: number | null;
+            valorTotal: number | null;
+            ultimaOcorrencia: string | null;
+        };
+        processosJuridicos?: number;
+        ccf?: {
+            total: number | null;
+            ultimaOcorrencia: string | null;
+        };
+    };
+    protestosCategory?: ProtestoData[];
+}
+export interface ProtestoData {
+    categoria: string;
+    quantidade: number;
+}
+export interface DataSetCommon {
+    label: string;
+    data: {
+        x: string;
+        y: number;
+    }[];
+    borderColor?: string;
+    backgroundColor?: string;
+    borderWidth?: number;
+    yAxisID?: "y" | "y2";
+}
+export interface DataSetLine extends DataSetCommon {
+    type: "line";
+    tension?: number;
+    spanGaps: boolean;
+    showLine: boolean;
+    pointRadius: number;
+    fill?: boolean;
+}
+export interface DataSetBar extends DataSetCommon {
+    type: "bar";
+    borderRadius?: number;
+    categoryPercentage?: number;
+    barPercentage?: number;
+}
+export type TimeFilter = "1y" | "6m" | "1m" | "all";

package/lib/esm/components/chart/utils/chartCustomization.d.ts

@@ -0,0 +1,7 @@
+import { DataInput, TimeFilter } from "../types/iChart";
+import { ChartDataset, ChartOptions } from "chart.js";
+export declare function createDatasets(data: DataInput, uniqueDates: string[], timeFilter: TimeFilter): ChartDataset<"line" | "bar", (number | {
+    x: string;
+    y: number;
+})[]>[];
+export declare function getChartOptions(timeFilter: TimeFilter): ChartOptions<"line" | "bar">;

package/lib/esm/components/chart/utils/chartCustomization.js

@@ -0,0 +1,154 @@
+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);
+};
+import { format, parseISO } from "date-fns";
+import { getBarSettings } from "./dataManipulation";
+export function createDatasets(data, uniqueDates, timeFilter) {
+    var _a = getBarSettings(timeFilter), categoryPercentage = _a.categoryPercentage, barPercentage = _a.barPercentage;
+    var createDataSet = function (entries, label, borderColor, chartType, valueKey, yAxisID) {
+        var dateValues = new Map(entries.map(function (entry) {
+            var _a;
+            return [
+                format(typeof entry.data === "string" ? parseISO(entry.data) : entry.data, "yyyy-MM-dd"),
+                (_a = entry[valueKey]) !== null && _a !== void 0 ? _a : 0,
+            ];
+        }));
+        var datasetData = uniqueDates.map(function (date) {
+            var _a;
+            var value = (_a = dateValues.get(date)) !== null && _a !== void 0 ? _a : 0;
+            return { x: date, y: value };
+        });
+        var datasetConfiguration = __assign({ type: chartType, label: label, data: datasetData, borderColor: borderColor, backgroundColor: chartType === "bar" ? borderColor + "60" : undefined, tension: chartType === "line" ? 0.4 : undefined, spanGaps: true, showLine: chartType === "line", pointRadius: 2, yAxisID: yAxisID }, (chartType === "bar" && {
+            categoryPercentage: categoryPercentage,
+            barPercentage: barPercentage,
+        }));
+        return datasetConfiguration;
+    };
+    return [
+        createDataSet(data.protestos, "Protestos - Quantidade", "#ff4081", "line", "quantidade", "y"),
+        createDataSet(data.protestos, "Protestos - Valor Total", "#ff4081", "bar", "valorTotal", "y2"),
+        createDataSet(data.ccfs, "CCFs - Quantidade", "#3f51b5", "line", "quantidade", "y"),
+        createDataSet(data.ccfs, "CCFs - Valor Total", "#3f51b5", "bar", "valorTotal", "y2"),
+        createDataSet(data.serasa, "Serasa - Quantidade", "#008cf8", "line", "quantidade", "y"),
+        createDataSet(data.serasa, "Serasa - Valor Total", "#008cf8", "bar", "valorTotal", "y2"),
+        createDataSet(data.boaVista, "Boa Vista - Quantidade", "#ffc107", "line", "quantidade", "y"),
+        createDataSet(data.boaVista, "Boa Vista - Valor Total", "#ffc107", "bar", "valorTotal", "y2"),
+        createDataSet(data.dividasPublicasGrafico, "Dívidas Públicas - Quantidade", "#4caf50", "line", "quantidade", "y"),
+        createDataSet(data.dividasPublicasGrafico, "Dívidas Públicas - Valor Total", "#4caf50", "bar", "valorTotal", "y2"),
+    ];
+}
+export function getChartOptions(timeFilter) {
+    var unit = "day";
+    switch (timeFilter) {
+        case "1m":
+            unit = "day";
+            break;
+        case "6m":
+            unit = "week";
+            break;
+        case "1y":
+            unit = "month";
+            break;
+        case "all":
+            unit = "quarter";
+            break;
+    }
+    return {
+        responsive: true,
+        maintainAspectRatio: true,
+        interaction: {
+            mode: "index",
+            intersect: false,
+        },
+        plugins: {
+            legend: {
+                fullSize: true,
+                position: "right",
+                labels: {
+                    boxWidth: 16,
+                    padding: 16,
+                },
+            },
+            title: {
+                display: true,
+                text: "Histórico de Consultas",
+            },
+        },
+        scales: {
+            y: {
+                type: "linear",
+                display: true,
+                position: "right",
+                beginAtZero: true,
+                title: {
+                    display: true,
+                    text: "Quantidade de Ocorrências por Consulta",
+                    font: {
+                        size: 14,
+                        family: "open sans",
+                        weight: "bold",
+                    },
+                },
+            },
+            y2: {
+                type: "logarithmic",
+                display: true,
+                position: "left",
+                suggestedMin: 1,
+                title: {
+                    display: true,
+                    text: "Valor Total de Negativações (R$)",
+                    font: {
+                        size: 14,
+                        family: "open sans",
+                        weight: "bold",
+                    },
+                },
+                grid: {
+                    drawOnChartArea: false,
+                },
+                ticks: {
+                    font: {
+                        size: 12,
+                    },
+                    callback: function (value) {
+                        return new Intl.NumberFormat("pt-BR", {
+                            style: "currency",
+                            currency: "BRL",
+                            minimumFractionDigits: 2,
+                            notation: "compact",
+                        }).format(value);
+                    },
+                },
+            },
+            x: {
+                type: "time",
+                time: {
+                    unit: unit,
+                    parser: "yyyy-MM-dd",
+                },
+                title: {
+                    display: true,
+                    text: "Data",
+                },
+            },
+        },
+        elements: {
+            line: {
+                fill: false,
+                tension: 0.4,
+            },
+            point: {
+                radius: 3,
+            },
+        },
+    };
+}

package/lib/esm/components/chart/utils/chartUtils.d.ts

@@ -0,0 +1,11 @@
+import { ItemCalculo } from "../../../utils/calculation";
+export declare const useCalculation: (itens: ItemCalculo[]) => {
+    quantidade: number;
+    valorTotal: number;
+    dataMaisRecente: string;
+};
+export declare const useUltimaOcorrenciaCCF: () => string | undefined;
+export declare const useDividasPublicas: () => {
+    quantidade: number;
+    valorTotal: number;
+};

package/lib/esm/components/chart/utils/chartUtils.js

@@ -0,0 +1,37 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import { useMemo, useContext } from "react";
+import { encontrarDataMaisRecente, somarQuantidades, somarValoresTotais, } from "../../../utils/calculation";
+import { Queries, RequestStatus } from "../../../components/webservice";
+import XPathUtils from "../../../utils/xpath";
+export var useCalculation = function (itens) {
+    var quantidade = useMemo(function () { return somarQuantidades(itens); }, [itens]);
+    var valorTotal = useMemo(function () { return somarValoresTotais(itens); }, [itens]);
+    var dataMaisRecente = useMemo(function () { return encontrarDataMaisRecente(itens); }, [itens]);
+    return { quantidade: quantidade, valorTotal: valorTotal, dataMaisRecente: dataMaisRecente };
+};
+export var useUltimaOcorrenciaCCF = function () {
+    var ctxCCF = useContext(Queries.CCF);
+    var ultimaOcorrenciaCCF = useMemo(function () {
+        if ((ctxCCF === null || ctxCCF === void 0 ? void 0 : ctxCCF.type) === RequestStatus.Success) {
+            return XPathUtils.select("string(//ultimaOcorrencia)", ctxCCF === null || ctxCCF === void 0 ? void 0 : ctxCCF.document);
+        }
+        return undefined;
+    }, [ctxCCF === null || ctxCCF === void 0 ? void 0 : ctxCCF.type]);
+    return ultimaOcorrenciaCCF;
+};
+export var useDividasPublicas = function () {
+    var ctxFinder = useContext(Queries.Finder);
+    var dividasPublicasData = useMemo(function () {
+        if ((ctxFinder === null || ctxFinder === void 0 ? void 0 : ctxFinder.type) === RequestStatus.Success) {
+            return {
+                quantidade: XPathUtils.select("number(//dividas/resumo/quantidade_dividas)", ctxFinder === null || ctxFinder === void 0 ? void 0 : ctxFinder.document) || 0,
+                valorTotal: XPathUtils.select("number(//dividas/resumo/valor_total_dividas)", ctxFinder === null || ctxFinder === void 0 ? void 0 : ctxFinder.document) || 0,
+            };
+        }
+        return {
+            quantidade: 0,
+            valorTotal: 0,
+        };
+    }, [ctxFinder === null || ctxFinder === void 0 ? void 0 : ctxFinder.type]);
+    return dividasPublicasData;
+};

package/lib/esm/components/chart/utils/dataManipulation.d.ts

@@ -0,0 +1,10 @@
+import { Consulta, DataInput, TimeFilter } from "../types/iChart";
+export declare const addMissingDateEntries: (data: Consulta[], startDate: Date, endDate: Date) => Consulta[];
+export declare const getFilteredStartDate: (timeFilter: TimeFilter, data: DataInput) => Date;
+export declare const getEarliestDate: (data: DataInput) => Date;
+export declare const getEndDate: () => Date;
+export declare function getUniqueDates(data: DataInput): string[];
+export declare const getBarSettings: (timeFilter: TimeFilter) => {
+    categoryPercentage: number;
+    barPercentage: number;
+};