ivt/dist/dash/index.mjs

Ivt Components Library

import React__default from 'react';
import { c as cn } from '../chunks/utils-05LlW3Cl.mjs';
import { f as formatNegative, a as formatNumberWithComma, b as formatMoney } from '../chunks/format-numbers-BMHnFGse.mjs';
import { C as Card, a as CardHeader, c as CardTitle, f as CardContent, b as CardFooter } from '../chunks/card-C_2pshaz.mjs';
import { T as TooltipIndicator } from '../chunks/TooltipIndicator-DgBUQgOI.mjs';
import { S as Skeleton } from '../chunks/skeleton-CIulxewv.mjs';
import { T as TriangleAlert } from '../chunks/triangle-alert-D5Cr5kOo.mjs';
import { f as formatDateToBrazilian } from '../chunks/date-bAe2UaSj.mjs';
import { c as TooltipProvider, T as Tooltip, a as TooltipTrigger, b as TooltipContent } from '../chunks/tooltip-BTEGteNb.mjs';
import '../chunks/bundle-mjs-BYcyWisL.mjs';
import '../chunks/createLucideIcon-DLrNgMqk.mjs';
import '../chunks/format-Cn5wls3k.mjs';
import '../chunks/index-Bl-WJHvp.mjs';
import '../chunks/index-1tQVI0Jh.mjs';
import '../chunks/index-DT8WgpCS.mjs';
import 'react/jsx-runtime';
import '../chunks/index-DUpRrJTH.mjs';
import '../chunks/index-DgKlJYZP.mjs';
import 'react-dom';
import '@radix-ui/react-slot';
import '../chunks/index-Cbm3--wc.mjs';
import '../chunks/index-tkRL9Tft.mjs';
import '../chunks/index-DKOlG3mh.mjs';
import '../chunks/index-aLIsJMgt.mjs';
import '../chunks/index-DmY774z-.mjs';
import '../chunks/index-BTe1rv5Z.mjs';
import '../chunks/index-C6s8KI_8.mjs';
import '../chunks/index-D4FMFHi9.mjs';
import '../chunks/index-An4yBrAZ.mjs';

function DashCard({ title, tooltip, value, footer, valueFormatter = (v)=>v, className, valueClassName, isLoading }) {
    return /*#__PURE__*/ React__default.createElement(Card, {
        className: cn("h-full gap-2", className)
    }, /*#__PURE__*/ React__default.createElement(CardHeader, {
        className: "gap-0"
    }, /*#__PURE__*/ React__default.createElement(CardTitle, {
        className: "flex flex-wrap items-center gap-2 text-sm font-medium"
    }, title, tooltip && /*#__PURE__*/ React__default.createElement(TooltipIndicator, null, tooltip))), /*#__PURE__*/ React__default.createElement(CardContent, null, isLoading ? /*#__PURE__*/ React__default.createElement(Skeleton, {
        className: cn("h-10 w-32 rounded-md", valueClassName)
    }) : /*#__PURE__*/ React__default.createElement("p", {
        className: cn("text-3xl font-bold", typeof value === "number" && formatNegative(+value), valueClassName)
    }, valueFormatter(value))), footer && /*#__PURE__*/ React__default.createElement(CardFooter, null, isLoading ? /*#__PURE__*/ React__default.createElement(Skeleton, {
        className: "h-4 w-20"
    }) : footer));
}

function DashCardList({ title, tooltip, footer, content, className, valueClassName, isLoading }) {
    return /*#__PURE__*/ React__default.createElement(Card, {
        className: cn("h-full gap-2", className)
    }, /*#__PURE__*/ React__default.createElement(CardHeader, {
        className: "gap-0"
    }, /*#__PURE__*/ React__default.createElement(CardTitle, {
        className: "flex flex-wrap items-center gap-2 text-sm font-medium"
    }, title, tooltip && /*#__PURE__*/ React__default.createElement(TooltipIndicator, null, tooltip))), /*#__PURE__*/ React__default.createElement(CardContent, null, isLoading ? /*#__PURE__*/ React__default.createElement(Skeleton, {
        className: cn("h-10 w-32 rounded-md", valueClassName)
    }) : content), footer && /*#__PURE__*/ React__default.createElement(CardFooter, null, isLoading ? /*#__PURE__*/ React__default.createElement(Skeleton, {
        className: "h-4 w-20"
    }) : footer));
}

const ErrorMessageDashCard = ({ children, className, shouldIcon = true, ...props })=>{
    return /*#__PURE__*/ React__default.createElement("div", {
        className: cn("text-destructive flex flex-wrap items-center gap-1 text-sm", className),
        ...props
    }, shouldIcon && /*#__PURE__*/ React__default.createElement(TriangleAlert, {
        className: "h-4 w-4"
    }), /*#__PURE__*/ React__default.createElement("span", null, children ?? "Erro ao carregar os dados"));
};

const ValuePercentage = ({ percentage, prevStartDate, prevEndDate, startDate, endDate, prevValue, value, valueMaxFractionDigits = 2, valueMinFractionDigits = 2, showText = true, text = "desde o último mês", formatAsMoney = false })=>{
    const cellCSS = percentage === 0 ? "text-muted-foreground" : percentage < 0 ? "text-destructive" : "text-positive";
    const iconValue = percentage < 0 ? "▼" : "▲";
    const formatValue = (val)=>{
        const options = {
            value: val,
            minimumFractionDigits: valueMinFractionDigits,
            maximumFractionDigits: valueMaxFractionDigits
        };
        return formatAsMoney ? formatMoney({
            value: options.value,
            minimumFractionDigits: options.minimumFractionDigits,
            maximumFractionDigits: options.maximumFractionDigits,
            currency: "BRL"
        }) : formatNumberWithComma(options);
    };
    return /*#__PURE__*/ React__default.createElement(TooltipProvider, null, /*#__PURE__*/ React__default.createElement(Tooltip, null, /*#__PURE__*/ React__default.createElement(TooltipTrigger, {
        asChild: true
    }, /*#__PURE__*/ React__default.createElement("div", {
        className: cn("text-xs", cellCSS)
    }, /*#__PURE__*/ React__default.createElement("span", {
        className: "mr-1"
    }, iconValue), /*#__PURE__*/ React__default.createElement("span", null, formatNumberWithComma({
        value: percentage,
        minimumFractionDigits: 0,
        maximumFractionDigits: 2
    }), "%"), " ", showText && /*#__PURE__*/ React__default.createElement("span", {
        className: "text-muted-foreground"
    }, text))), prevStartDate && startDate && /*#__PURE__*/ React__default.createElement(TooltipContent, {
        side: "bottom",
        className: "bg-secondary flex flex-col"
    }, /*#__PURE__*/ React__default.createElement("span", null, formatDateToBrazilian(prevStartDate), " ", prevEndDate && `- ${formatDateToBrazilian(prevEndDate)}`, ":", " ", formatValue(prevValue ?? 0)), /*#__PURE__*/ React__default.createElement("span", null, formatDateToBrazilian(startDate), " ", endDate && `- ${formatDateToBrazilian(endDate)}`, ":", " ", formatValue(value ?? 0)))));
};

export { DashCard, DashCardList, ErrorMessageDashCard, ValuePercentage };
//# sourceMappingURL=index.mjs.map