dgz-ui/dist/progress/index.es.js

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript

import { jsx as d, jsxs as E } from "react/jsx-runtime";
import * as l from "react";
import "react-dom";
import { c as R } from "../chunks/index-DvGm4EwH.es.js";
import { c as V } from "../chunks/utils-CnvKSirc.es.js";
function A(e, r = []) {
  let s = [];
  function a(u, i) {
    const t = l.createContext(i);
    t.displayName = u + "Context";
    const n = s.length;
    s = [...s, i];
    const p = (m) => {
      var N;
      const { scope: c, children: g, ...v } = m, f = ((N = c == null ? void 0 : c[e]) == null ? void 0 : N[n]) || t, M = l.useMemo(() => v, Object.values(v));
      return /* @__PURE__ */ d(f.Provider, { value: M, children: g });
    };
    p.displayName = u + "Provider";
    function h(m, c) {
      var f;
      const g = ((f = c == null ? void 0 : c[e]) == null ? void 0 : f[n]) || t, v = l.useContext(g);
      if (v) return v;
      if (i !== void 0) return i;
      throw new Error(`\`${m}\` must be used within \`${u}\``);
    }
    return [p, h];
  }
  const o = () => {
    const u = s.map((i) => l.createContext(i));
    return function(t) {
      const n = (t == null ? void 0 : t[e]) || u;
      return l.useMemo(
        () => ({ [`__scope${e}`]: { ...t, [e]: n } }),
        [t, n]
      );
    };
  };
  return o.scopeName = e, [a, D(o, ...r)];
}
function D(...e) {
  const r = e[0];
  if (e.length === 1) return r;
  const s = () => {
    const a = e.map((o) => ({
      useScope: o(),
      scopeName: o.scopeName
    }));
    return function(u) {
      const i = a.reduce((t, { useScope: n, scopeName: p }) => {
        const m = n(u)[`__scope${p}`];
        return { ...t, ...m };
      }, {});
      return l.useMemo(() => ({ [`__scope${r.scopeName}`]: i }), [i]);
    };
  };
  return s.scopeName = r.scopeName, s;
}
var O = [
  "a",
  "button",
  "div",
  "form",
  "h2",
  "h3",
  "img",
  "input",
  "label",
  "li",
  "nav",
  "ol",
  "p",
  "select",
  "span",
  "svg",
  "ul"
], w = O.reduce((e, r) => {
  const s = R(`Primitive.${r}`), a = l.forwardRef((o, u) => {
    const { asChild: i, ...t } = o, n = i ? s : r;
    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ d(n, { ...t, ref: u });
  });
  return a.displayName = `Primitive.${r}`, { ...e, [r]: a };
}, {}), P = "Progress", b = 100, [L] = A(P), [j, T] = L(P), C = l.forwardRef(
  (e, r) => {
    const {
      __scopeProgress: s,
      value: a = null,
      max: o,
      getValueLabel: u = G,
      ...i
    } = e;
    (o || o === 0) && !$(o) && console.error(X(`${o}`, "Progress"));
    const t = $(o) ? o : b;
    a !== null && !S(a, t) && console.error(k(`${a}`, "Progress"));
    const n = S(a, t) ? a : null, p = x(n) ? u(n, t) : void 0;
    return /* @__PURE__ */ d(j, { scope: s, value: n, max: t, children: /* @__PURE__ */ d(
      w.div,
      {
        "aria-valuemax": t,
        "aria-valuemin": 0,
        "aria-valuenow": x(n) ? n : void 0,
        "aria-valuetext": p,
        role: "progressbar",
        "data-state": I(n, t),
        "data-value": n ?? void 0,
        "data-max": t,
        ...i,
        ref: r
      }
    ) });
  }
);
C.displayName = P;
var y = "ProgressIndicator", _ = l.forwardRef(
  (e, r) => {
    const { __scopeProgress: s, ...a } = e, o = T(y, s);
    return /* @__PURE__ */ d(
      w.div,
      {
        "data-state": I(o.value, o.max),
        "data-value": o.value ?? void 0,
        "data-max": o.max,
        ...a,
        ref: r
      }
    );
  }
);
_.displayName = y;
function G(e, r) {
  return `${Math.round(e / r * 100)}%`;
}
function I(e, r) {
  return e == null ? "indeterminate" : e === r ? "complete" : "loading";
}
function x(e) {
  return typeof e == "number";
}
function $(e) {
  return x(e) && !isNaN(e) && e > 0;
}
function S(e, r) {
  return x(e) && !isNaN(e) && e <= r && e >= 0;
}
function X(e, r) {
  return `Invalid prop \`max\` of value \`${e}\` supplied to \`${r}\`. Only numbers greater than 0 are valid max values. Defaulting to \`${b}\`.`;
}
function k(e, r) {
  return `Invalid prop \`value\` of value \`${e}\` supplied to \`${r}\`. The \`value\` prop must be:
  - a positive number
  - less than the value passed to \`max\` (or ${b} if no \`max\` prop is set)
  - \`null\` or \`undefined\` if the progress is indeterminate.

Defaulting to \`null\`.`;
}
var B = C, F = _;
function J({
  className: e,
  value: r,
  children: s,
  ...a
}) {
  return /* @__PURE__ */ E(
    B,
    {
      "data-slot": "progress",
      className: V(
        "bg-primary/20 relative h-3 w-full overflow-hidden rounded-full",
        e
      ),
      ...a,
      children: [
        /* @__PURE__ */ d(
          F,
          {
            "data-slot": "progress-indicator",
            className: "bg-primary h-full w-full flex-1 transition-all",
            style: { transform: `translateX(-${100 - (r || 0)}%)` }
          }
        ),
        /* @__PURE__ */ d(
          "div",
          {
            className: "text-body-2xs-semi-bold text-inverted absolute top-0 left-1 leading-3.5",
            children: s
          }
        )
      ]
    }
  );
}
export {
  J as Progress
};
//# sourceMappingURL=index.es.js.map