import { jsx as e } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { useMemo as l } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import y from "classnames";
/* empty css                 */
import i from "../Typography/Typography.js";
import { TypographyVariant as p, TypographyElement as c } from "../Typography/types.js";
import { Tooltip as u } from "../Tooltip/Tooltip.js";
import { clamp as _ } from "../../../utils/value/number.js";
const $ = ({ max: n = 1, value: a, labels: r, tooltips: o, className: s }) => {
  const t = l(() => _(0, a * 100 / n, 100), [a, n]), d = !!(r?.current || r?.max), g = r?.ariaLabel ?? (r?.current ? `${r.current}: ${a}` : `${a}/${n}`);
  return /* @__PURE__ */ e(
    "div",
    {
      role: "progressbar",
      "aria-valuenow": a,
      "aria-valuemin": 0,
      "aria-valuemax": n,
      "aria-valuetext": `${t}%`,
      "aria-label": g,
      className: y("adyen-pe-progress-bar", s),
      children: [
        /* @__PURE__ */ e("div", { className: "adyen-pe-progress-bar__track", role: "presentation", children: [
          /* @__PURE__ */ e("div", { className: "adyen-pe-progress-bar__track-background" }),
          /* @__PURE__ */ e(
            m,
            {
              tooltipContent: o?.progress,
              title: r?.current,
              percentage: t,
              className: "adyen-pe-progress-bar__track-fill"
            }
          ),
          /* @__PURE__ */ e(
            m,
            {
              tooltipContent: o?.remaining,
              title: r?.max,
              percentage: 100 - t,
              className: "adyen-pe-progress-bar__track-remaining"
            }
          )
        ] }),
        d && /* @__PURE__ */ e("div", { className: "adyen-pe-progress-bar__legend", "aria-hidden": "true", children: [
          r.current && /* @__PURE__ */ e(i, { el: c.SPAN, variant: p.CAPTION, className: "adyen-pe-progress-bar__legend-label", children: r.current }),
          r.max && /* @__PURE__ */ e(i, { el: c.SPAN, variant: p.CAPTION, className: "adyen-pe-progress-bar__legend-label", children: r.max })
        ] })
      ]
    }
  );
}, m = ({ tooltipContent: n, title: a, percentage: r, className: o }) => {
  const s = (t) => /* @__PURE__ */ e("div", { className: o, "aria-label": t, style: { width: `${r}%` } });
  return n ? /* @__PURE__ */ e(u, { content: n, children: s(a) }) : s(a);
};
export {
  $ as default
};
