analytica-frontend-lib/dist/chunk-UQOLQPHL.mjs

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

import {
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
  Select_default
} from "./chunk-UU7Q5S52.mjs";
import {
  Button_default
} from "./chunk-LAYB7IKW.mjs";
import {
  Text_default
} from "./chunk-IMCIR6TJ.mjs";

// src/components/StatisticsCard/StatisticsCard.tsx
import { PlusIcon } from "@phosphor-icons/react/dist/csr/Plus";
import { jsx, jsxs } from "react/jsx-runtime";
var VARIANT_STYLES = {
  high: "bg-success-background",
  medium: "bg-warning-background",
  low: "bg-error-background",
  total: "bg-info-background"
};
var VALUE_TEXT_COLORS = {
  high: "text-success-700",
  medium: "text-warning-600",
  low: "text-error-700",
  total: "text-info-700"
};
var StatCard = ({ item, showPlaceholder = false }) => {
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: `rounded-xl py-[17px] px-6 min-h-[105px] flex flex-col justify-center items-start gap-1 ${VARIANT_STYLES[item.variant]}`,
      children: [
        /* @__PURE__ */ jsx(
          Text_default,
          {
            size: "4xl",
            weight: "bold",
            className: `${VALUE_TEXT_COLORS[item.variant]} leading-[42px] tracking-[0.2px] self-stretch`,
            children: showPlaceholder ? "-" : item.value
          }
        ),
        /* @__PURE__ */ jsx(
          Text_default,
          {
            size: "xs",
            weight: "bold",
            className: "uppercase text-[8px] leading-[9px] text-text-800 whitespace-nowrap",
            children: item.label
          }
        )
      ]
    }
  );
};
var getGridColumnsClass = (itemCount) => {
  if (itemCount === 6) return "lg:grid-cols-6";
  if (itemCount === 5) return "lg:grid-cols-5";
  if (itemCount === 4) return "lg:grid-cols-4";
  if (itemCount === 3) return "lg:grid-cols-3";
  if (itemCount === 2) return "lg:grid-cols-2";
  return "lg:grid-cols-1";
};
var StatisticsCard = ({
  title,
  description,
  data,
  showPlaceholder = false,
  emptyStateMessage,
  emptyStateButtonText,
  onEmptyStateButtonClick,
  dropdownOptions,
  selectedDropdownValue,
  onDropdownChange,
  selectPlaceholder = "Selecione um per\xEDodo",
  dropdownAriaLabel = "Filtro de per\xEDodo",
  className = ""
}) => {
  const hasData = data && data.length > 0;
  const gridColumnsClass = hasData ? getGridColumnsClass(data.length) : "";
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: `bg-background rounded-xl p-4 h-auto lg:min-h-[185px] flex flex-col gap-2 ${className}`,
      children: [
        /* @__PURE__ */ jsxs("div", { className: "flex flex-row justify-between items-center gap-4", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
            /* @__PURE__ */ jsx(Text_default, { as: "h3", size: "lg", weight: "bold", color: "text-text-950", children: title }),
            description && /* @__PURE__ */ jsx(Text_default, { size: "sm", color: "text-text-700", children: description })
          ] }),
          dropdownOptions && dropdownOptions.length > 0 && /* @__PURE__ */ jsx("div", { className: "w-[120px] min-w-[90px] sm:shrink-0", children: /* @__PURE__ */ jsxs(
            Select_default,
            {
              value: selectedDropdownValue,
              onValueChange: onDropdownChange,
              size: "medium",
              children: [
                /* @__PURE__ */ jsx(
                  SelectTrigger,
                  {
                    className: "border border-border-300 rounded [&>span]:whitespace-nowrap [&>span]:overflow-hidden [&>span]:text-ellipsis",
                    "aria-label": dropdownAriaLabel,
                    children: /* @__PURE__ */ jsx(SelectValue, { placeholder: selectPlaceholder })
                  }
                ),
                /* @__PURE__ */ jsx(SelectContent, { className: "min-w-[120px]", children: dropdownOptions.map((option) => /* @__PURE__ */ jsx(
                  SelectItem,
                  {
                    value: option.value,
                    className: "whitespace-nowrap",
                    children: option.label
                  },
                  option.value
                )) })
              ]
            }
          ) })
        ] }),
        hasData ? /* @__PURE__ */ jsx(
          "div",
          {
            className: `grid grid-cols-1 sm:grid-cols-2 gap-[13px] ${gridColumnsClass}`,
            children: data.map((item, index) => /* @__PURE__ */ jsx(
              StatCard,
              {
                item,
                showPlaceholder
              },
              `${item.variant}-${item.label}-${index}`
            ))
          }
        ) : /* @__PURE__ */ jsxs("div", { className: "border border-dashed border-border-300 rounded-lg p-6 min-h-[105px] flex flex-col items-center justify-center gap-2", children: [
          /* @__PURE__ */ jsx(
            Text_default,
            {
              size: "sm",
              color: "text-text-600",
              className: "text-center max-w-md",
              children: emptyStateMessage
            }
          ),
          onEmptyStateButtonClick && /* @__PURE__ */ jsx(
            Button_default,
            {
              variant: "outline",
              action: "primary",
              size: "small",
              onClick: onEmptyStateButtonClick,
              iconLeft: /* @__PURE__ */ jsx(PlusIcon, { size: 16, weight: "bold" }),
              children: emptyStateButtonText
            }
          )
        ] })
      ]
    }
  );
};

export {
  StatisticsCard
};
//# sourceMappingURL=chunk-UQOLQPHL.mjs.map