import { jsxs as s, Fragment as d, jsx as e } from "react/jsx-runtime";
import { useState as n, useEffect as c } from "react";
import { H as u, C as l, a as r, bK as a, c as h, P as g, A as b } from "../index-sdOMz8GW.js";
import { Activity as w } from "lucide-react";
import "react-router-dom";
import "react-dom";
const V = () => {
  const [o, m] = n(0);
  return c(() => {
    const t = setInterval(() => {
      m((i) => i >= 100 ? 0 : i + 1);
    }, 80);
    return () => clearInterval(t);
  }, []), /* @__PURE__ */ s(d, { children: [
    /* @__PURE__ */ e(
      u,
      {
        title: "Progress Bar",
        description: "Determinate and indeterminate progress indicators with glass material track, accent fill, and optional label/value display.",
        icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-violet-600 rounded-full flex items-center justify-center shadow-lg border border-blue-500/50", children: /* @__PURE__ */ e(w, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
      }
    ),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Sizes", className: "mt-2 mb-2", children: /* @__PURE__ */ s("div", { className: "flex flex-col gap-5 max-w-md", children: [
      /* @__PURE__ */ e(
        a,
        {
          value: 35,
          size: "sm",
          label: "Small",
          showValue: !0
        }
      ),
      /* @__PURE__ */ e(
        a,
        {
          value: 60,
          size: "md",
          label: "Medium (default)",
          showValue: !0
        }
      ),
      /* @__PURE__ */ e(
        a,
        {
          value: 85,
          size: "lg",
          label: "Large",
          showValue: !0
        }
      )
    ] }) }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Animated (Determinate)", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "max-w-md", children: /* @__PURE__ */ e(
      a,
      {
        value: o,
        size: "md",
        label: "Downloading update...",
        showValue: !0
      }
    ) }) }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Indeterminate", className: "mt-2 mb-2", children: /* @__PURE__ */ s("div", { className: "flex flex-col gap-5 max-w-md", children: [
      /* @__PURE__ */ e(a, { indeterminate: !0, size: "sm" }),
      /* @__PURE__ */ e(a, { indeterminate: !0, size: "md", label: "Loading..." }),
      /* @__PURE__ */ e(
        a,
        {
          indeterminate: !0,
          size: "lg",
          label: "Processing files..."
        }
      )
    ] }) }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Static Values", className: "mt-2 mb-2", children: /* @__PURE__ */ s("div", { className: "flex flex-col gap-4 max-w-md", children: [
      /* @__PURE__ */ e(a, { value: 0, label: "0%", showValue: !0 }),
      /* @__PURE__ */ e(a, { value: 25, label: "25%", showValue: !0 }),
      /* @__PURE__ */ e(a, { value: 50, label: "50%", showValue: !0 }),
      /* @__PURE__ */ e(a, { value: 75, label: "75%", showValue: !0 }),
      /* @__PURE__ */ e(a, { value: 100, label: "Complete", showValue: !0 })
    ] }) }) }),
    /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(r, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
      h,
      {
        code: `import { MacOSTahoeProgressBar } from '@e-burgos/tucu-ui';

// Determinate
<MacOSTahoeProgressBar
  value={65}
  size="md"
  label="Uploading..."
  showValue
/>

// Indeterminate
<MacOSTahoeProgressBar
  indeterminate
  size="md"
  label="Loading..."
/>`,
        language: "tsx"
      }
    ) }) }),
    /* @__PURE__ */ e(
      g,
      {
        componentName: "MacOSTahoeProgressBar",
        defaultValues: {
          value: 65,
          size: "md",
          label: "Loading...",
          showValue: !0,
          indeterminate: !1
        },
        includeProps: ["value", "size", "label", "showValue", "indeterminate"],
        excludeProps: ["className"],
        children: (t) => /* @__PURE__ */ e("div", { className: "max-w-md w-full", children: /* @__PURE__ */ e(a, { ...t }) })
      }
    ),
    /* @__PURE__ */ e(b, { componentName: "MacOSTahoeProgressBar" })
  ] });
};
export {
  V as TahoeProgressBarSection,
  V as default
};
