analytica-frontend-lib/dist/chunk-CMUIZOUV.js

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

"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }

var _chunkANT66KVKjs = require('./chunk-ANT66KVK.js');


var _chunkTN3AYOMVjs = require('./chunk-TN3AYOMV.js');

// src/components/ProgressBar/ProgressBar.tsx
var _jsxruntime = require('react/jsx-runtime');
var SIZE_CLASSES = {
  small: {
    container: "h-1",
    // 4px height (h-1 = 4px in Tailwind)
    bar: "h-1",
    // 4px height for the fill bar
    spacing: "gap-2",
    // 8px gap between label and progress bar
    layout: "flex-col",
    // vertical layout for small
    borderRadius: "rounded-full"
    // 9999px border radius
  },
  medium: {
    container: "h-2",
    // 8px height (h-2 = 8px in Tailwind)
    bar: "h-2",
    // 8px height for the fill bar
    spacing: "gap-2",
    // 8px gap between progress bar and label
    layout: "flex-row items-center",
    // horizontal layout for medium
    borderRadius: "rounded-lg"
    // 8px border radius
  }
};
var VARIANT_CLASSES = {
  blue: {
    background: "bg-background-300",
    // Background track color (#D5D4D4)
    fill: "bg-primary-700"
    // Blue for activity progress (#2271C4)
  },
  green: {
    background: "bg-background-300",
    // Background track color (#D5D4D4)
    fill: "bg-success-200"
    // Green for performance (#84D3A2)
  }
};
var calculateProgressValues = (value, max) => {
  const safeValue = isNaN(value) ? 0 : value;
  const clampedValue = Math.max(0, Math.min(safeValue, max));
  const percentage = max === 0 ? 0 : clampedValue / max * 100;
  return { clampedValue, percentage };
};
var shouldShowHeader = (label, showPercentage, showHitCount) => {
  return !!(label || showPercentage || showHitCount);
};
var getDisplayPriority = (showHitCount, showPercentage, label, clampedValue, max, percentage) => {
  if (showHitCount) {
    return {
      type: "hitCount",
      content: `${Math.round(clampedValue)} de ${max}`,
      hasMetrics: true
    };
  }
  if (showPercentage) {
    return {
      type: "percentage",
      content: `${Math.round(percentage)}%`,
      hasMetrics: true
    };
  }
  return {
    type: "label",
    content: label,
    hasMetrics: false
  };
};
var getCompactLayoutConfig = ({
  showPercentage,
  showHitCount,
  percentage,
  clampedValue,
  max,
  label,
  percentageClassName,
  labelClassName
}) => {
  const displayPriority = getDisplayPriority(
    showHitCount,
    showPercentage,
    label,
    clampedValue,
    max,
    percentage
  );
  return {
    color: displayPriority.hasMetrics ? "text-primary-600" : "text-primary-700",
    className: displayPriority.hasMetrics ? percentageClassName : labelClassName,
    content: displayPriority.content
  };
};
var getDefaultLayoutDisplayConfig = (size, label, showPercentage) => ({
  showHeader: size === "small" && !!(label || showPercentage),
  showPercentage: size === "medium" && showPercentage,
  showLabel: size === "medium" && !!label && !showPercentage
  // Only show label when percentage is not shown
});
var renderStackedHitCountDisplay = (showHitCount, showPercentage, clampedValue, max, percentage, percentageClassName) => {
  if (!showHitCount && !showPercentage) return null;
  const displayPriority = getDisplayPriority(
    showHitCount,
    showPercentage,
    null,
    // label is not relevant for stacked layout metrics display
    clampedValue,
    max,
    percentage
  );
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
    "div",
    {
      className: _chunkTN3AYOMVjs.cn.call(void 0, 
        "text-xs font-medium leading-[14px] text-right",
        percentageClassName
      ),
      children: displayPriority.type === "hitCount" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-success-200", children: Math.round(clampedValue) }),
        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "text-text-600", children: [
          " de ",
          max
        ] })
      ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkANT66KVKjs.Text_default, { size: "xs", weight: "medium", className: "text-success-200", children: [
        Math.round(percentage),
        "%"
      ] })
    }
  );
};
var ProgressBarBase = ({
  clampedValue,
  max,
  percentage,
  label,
  variantClasses,
  containerClassName,
  fillClassName
}) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
  "div",
  {
    className: _chunkTN3AYOMVjs.cn.call(void 0, 
      containerClassName,
      variantClasses.background,
      "overflow-hidden relative"
    ),
    children: [
      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
        "progress",
        {
          value: clampedValue,
          max,
          "aria-label": typeof label === "string" ? `${label}: ${Math.round(percentage)}% complete` : `Progress: ${Math.round(percentage)}% of ${max}`,
          className: "absolute inset-0 w-full h-full opacity-0"
        }
      ),
      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
        "div",
        {
          className: _chunkTN3AYOMVjs.cn.call(void 0, 
            fillClassName,
            variantClasses.fill,
            "transition-all duration-300 ease-out"
          ),
          style: { width: `${percentage}%` }
        }
      )
    ]
  }
);
var StackedLayout = ({
  className,
  label,
  showPercentage,
  showHitCount,
  labelClassName,
  percentageClassName,
  clampedValue,
  max,
  percentage,
  variantClasses,
  dimensions
}) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
  "div",
  {
    className: _chunkTN3AYOMVjs.cn.call(void 0, 
      "flex flex-col items-start gap-2",
      dimensions.width,
      dimensions.height,
      className
    ),
    children: [
      shouldShowHeader(label, showPercentage, showHitCount) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-row justify-between items-center w-full h-[19px]", children: [
        label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
          _chunkANT66KVKjs.Text_default,
          {
            as: "div",
            size: "md",
            weight: "medium",
            className: _chunkTN3AYOMVjs.cn.call(void 0, "text-text-600 leading-[19px]", labelClassName),
            children: label
          }
        ),
        renderStackedHitCountDisplay(
          showHitCount,
          showPercentage,
          clampedValue,
          max,
          percentage,
          percentageClassName
        )
      ] }),
      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
        ProgressBarBase,
        {
          clampedValue,
          max,
          percentage,
          label,
          variantClasses,
          containerClassName: "w-full h-2 rounded-lg",
          fillClassName: "h-2 rounded-lg shadow-hard-shadow-3"
        }
      )
    ]
  }
);
var CompactLayout = ({
  className,
  label,
  showPercentage,
  showHitCount,
  labelClassName,
  percentageClassName,
  clampedValue,
  max,
  percentage,
  variantClasses,
  dimensions
}) => {
  const {
    color,
    className: compactClassName,
    content
  } = getCompactLayoutConfig({
    showPercentage,
    showHitCount,
    percentage,
    clampedValue,
    max,
    label,
    percentageClassName,
    labelClassName
  });
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
    "div",
    {
      className: _chunkTN3AYOMVjs.cn.call(void 0, 
        "flex flex-col items-start gap-1",
        dimensions.width,
        dimensions.height,
        className
      ),
      children: [
        shouldShowHeader(label, showPercentage, showHitCount) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
          _chunkANT66KVKjs.Text_default,
          {
            as: "div",
            size: "sm",
            weight: "medium",
            color,
            className: _chunkTN3AYOMVjs.cn.call(void 0, "leading-4 w-full", compactClassName),
            children: content
          }
        ),
        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
          ProgressBarBase,
          {
            clampedValue,
            max,
            percentage,
            label,
            variantClasses,
            containerClassName: "w-full h-1 rounded-full",
            fillClassName: "h-1 rounded-full"
          }
        )
      ]
    }
  );
};
var DefaultLayout = ({
  className,
  size,
  sizeClasses,
  variantClasses,
  label,
  showPercentage,
  labelClassName,
  percentageClassName,
  clampedValue,
  max,
  percentage
}) => {
  const gapClass = size === "medium" ? "gap-2" : sizeClasses.spacing;
  const progressBarClass = size === "medium" ? "flex-grow" : "w-full";
  const displayConfig = getDefaultLayoutDisplayConfig(
    size,
    label,
    showPercentage
  );
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkTN3AYOMVjs.cn.call(void 0, "flex", sizeClasses.layout, gapClass, className), children: [
    displayConfig.showHeader && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-row items-center justify-between w-full", children: [
      label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
        _chunkANT66KVKjs.Text_default,
        {
          as: "div",
          size: "xs",
          weight: "medium",
          className: _chunkTN3AYOMVjs.cn.call(void 0, 
            "text-text-950 leading-none tracking-normal text-center",
            labelClassName
          ),
          children: label
        }
      ),
      showPercentage && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
        _chunkANT66KVKjs.Text_default,
        {
          size: "xs",
          weight: "medium",
          className: _chunkTN3AYOMVjs.cn.call(void 0, 
            "text-text-950 leading-none tracking-normal text-center",
            percentageClassName
          ),
          children: [
            Math.round(percentage),
            "%"
          ]
        }
      )
    ] }),
    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      ProgressBarBase,
      {
        clampedValue,
        max,
        percentage,
        label,
        variantClasses,
        containerClassName: _chunkTN3AYOMVjs.cn.call(void 0, 
          progressBarClass,
          sizeClasses.container,
          sizeClasses.borderRadius
        ),
        fillClassName: _chunkTN3AYOMVjs.cn.call(void 0, 
          sizeClasses.bar,
          sizeClasses.borderRadius,
          "shadow-hard-shadow-3"
        )
      }
    ),
    displayConfig.showPercentage && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
      _chunkANT66KVKjs.Text_default,
      {
        size: "xs",
        weight: "medium",
        className: _chunkTN3AYOMVjs.cn.call(void 0, 
          "text-text-950 leading-none tracking-normal text-center flex-none",
          percentageClassName
        ),
        children: [
          Math.round(percentage),
          "%"
        ]
      }
    ),
    displayConfig.showLabel && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      _chunkANT66KVKjs.Text_default,
      {
        as: "div",
        size: "xs",
        weight: "medium",
        className: _chunkTN3AYOMVjs.cn.call(void 0, 
          "text-text-950 leading-none tracking-normal text-center flex-none",
          labelClassName
        ),
        children: label
      }
    )
  ] });
};
var ProgressBar = ({
  value,
  max = 100,
  size = "medium",
  variant = "blue",
  layout = "default",
  label,
  showPercentage = false,
  showHitCount = false,
  className = "",
  labelClassName = "",
  percentageClassName = "",
  stackedWidth,
  stackedHeight,
  compactWidth,
  compactHeight
}) => {
  const { clampedValue, percentage } = calculateProgressValues(value, max);
  const sizeClasses = SIZE_CLASSES[size];
  const variantClasses = VARIANT_CLASSES[variant];
  if (layout === "stacked") {
    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      StackedLayout,
      {
        className,
        label,
        showPercentage,
        showHitCount,
        labelClassName,
        percentageClassName,
        clampedValue,
        max,
        percentage,
        variantClasses,
        dimensions: {
          width: _nullishCoalesce(stackedWidth, () => ( "w-[380px]")),
          height: _nullishCoalesce(stackedHeight, () => ( "h-[35px]"))
        }
      }
    );
  }
  if (layout === "compact") {
    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      CompactLayout,
      {
        className,
        label,
        showPercentage,
        showHitCount,
        labelClassName,
        percentageClassName,
        clampedValue,
        max,
        percentage,
        variantClasses,
        dimensions: {
          width: _nullishCoalesce(compactWidth, () => ( "w-[131px]")),
          height: _nullishCoalesce(compactHeight, () => ( "h-[24px]"))
        }
      }
    );
  }
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
    DefaultLayout,
    {
      className,
      size,
      sizeClasses,
      variantClasses,
      label,
      showPercentage,
      labelClassName,
      percentageClassName,
      clampedValue,
      max,
      percentage
    }
  );
};
var ProgressBar_default = ProgressBar;



exports.ProgressBar_default = ProgressBar_default;
//# sourceMappingURL=chunk-CMUIZOUV.js.map