@konstructio/ui/dist/Counter-Qqu8PU85.js

A set of reusable and customizable React components built for konstruct.io

import { o as W } from "./chunk-cI0lbGMq.js";
import { t as M } from "./prop-types-CE0Kfmwk.js";
import { t as j } from "./dist-EV-1XXQr.js";
import { t as f } from "./utils-COaoD3PI.js";
import { Typography as T } from "./components/Typography/Typography.js";
import { buttonVariants as N, counterVariants as V, labelVariants as C } from "./components/Counter/Counter.variants.js";
import m, { forwardRef as g, useCallback as k, useId as R } from "react";
import { jsx as u, jsxs as p } from "react/jsx-runtime";
var a = /* @__PURE__ */ W(M());
function h() {
  return h = Object.assign || function(e) {
    for (var o = 1; o < arguments.length; o++) {
      var r = arguments[o];
      for (var t in r) Object.prototype.hasOwnProperty.call(r, t) && (e[t] = r[t]);
    }
    return e;
  }, h.apply(this, arguments);
}
function S(e, o) {
  if (e == null) return {};
  var r = B(e, o), t, n;
  if (Object.getOwnPropertySymbols) {
    var i = Object.getOwnPropertySymbols(e);
    for (n = 0; n < i.length; n++)
      t = i[n], !(o.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (r[t] = e[t]);
  }
  return r;
}
function B(e, o) {
  if (e == null) return {};
  var r = {}, t = Object.keys(e), n, i;
  for (i = 0; i < t.length; i++)
    n = t[i], !(o.indexOf(n) >= 0) && (r[n] = e[n]);
  return r;
}
var O = g(function(e, o) {
  var r = e.color, t = r === void 0 ? "currentColor" : r, n = e.size, i = n === void 0 ? 24 : n, l = S(e, ["color", "size"]);
  return /* @__PURE__ */ m.createElement("svg", h({
    ref: o,
    xmlns: "http://www.w3.org/2000/svg",
    width: i,
    height: i,
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: t,
    strokeWidth: "2",
    strokeLinecap: "round",
    strokeLinejoin: "round"
  }, l), /* @__PURE__ */ m.createElement("line", {
    x1: "5",
    y1: "12",
    x2: "19",
    y2: "12"
  }));
});
O.propTypes = {
  color: a.default.string,
  size: a.default.oneOfType([a.default.string, a.default.number])
};
O.displayName = "Minus";
function b() {
  return b = Object.assign || function(e) {
    for (var o = 1; o < arguments.length; o++) {
      var r = arguments[o];
      for (var t in r) Object.prototype.hasOwnProperty.call(r, t) && (e[t] = r[t]);
    }
    return e;
  }, b.apply(this, arguments);
}
function D(e, o) {
  if (e == null) return {};
  var r = q(e, o), t, n;
  if (Object.getOwnPropertySymbols) {
    var i = Object.getOwnPropertySymbols(e);
    for (n = 0; n < i.length; n++)
      t = i[n], !(o.indexOf(t) >= 0) && Object.prototype.propertyIsEnumerable.call(e, t) && (r[t] = e[t]);
  }
  return r;
}
function q(e, o) {
  if (e == null) return {};
  var r = {}, t = Object.keys(e), n, i;
  for (i = 0; i < t.length; i++)
    n = t[i], !(o.indexOf(n) >= 0) && (r[n] = e[n]);
  return r;
}
var w = g(function(e, o) {
  var r = e.color, t = r === void 0 ? "currentColor" : r, n = e.size, i = n === void 0 ? 24 : n, l = D(e, ["color", "size"]);
  return /* @__PURE__ */ m.createElement("svg", b({
    ref: o,
    xmlns: "http://www.w3.org/2000/svg",
    width: i,
    height: i,
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: t,
    strokeWidth: "2",
    strokeLinecap: "round",
    strokeLinejoin: "round"
  }, l), /* @__PURE__ */ m.createElement("line", {
    x1: "12",
    y1: "5",
    x2: "12",
    y2: "19"
  }), /* @__PURE__ */ m.createElement("line", {
    x1: "5",
    y1: "12",
    x2: "19",
    y2: "12"
  }));
});
w.propTypes = {
  color: a.default.string,
  size: a.default.oneOfType([a.default.string, a.default.number])
};
w.displayName = "Plus";
var X = g(({ canDecrement: e = !0, canIncrement: o = !0, className: r, decrementButtonClassName: t, incrementButtonClassName: n, isRequired: i, label: l, labelWrapperClassName: P, max: y = -1 / 0, min: v = 1 / 0, name: x, theme: _, value: z, onChange: d }, I) => {
  const E = R(), s = z ?? 0, L = k(() => {
    let c = 0;
    v === 1 / 0 ? c = s - 1 : c = Math.max(v, s - 1), d?.({ target: { value: c } });
  }, [
    s,
    v,
    d
  ]), $ = k(() => {
    let c = 0;
    y === -1 / 0 ? c = s + 1 : c = Math.min(y, s + 1), d?.({ target: { value: c } });
  }, [
    s,
    y,
    d
  ]);
  return /* @__PURE__ */ p("div", {
    className: "flex flex-col gap-2",
    "data-theme": _,
    children: [l ? /* @__PURE__ */ u("div", {
      className: f(P),
      children: /* @__PURE__ */ p(T, {
        component: "label",
        htmlFor: x ?? E,
        variant: "labelLarge",
        className: f(C()),
        children: [
          "Number of nodes",
          " ",
          i && /* @__PURE__ */ u("span", {
            className: "text-red-600 dark:text-red-500",
            children: "*"
          })
        ]
      })
    }) : null, /* @__PURE__ */ p("div", {
      className: "flex items-center",
      role: "presentation",
      children: [
        /* @__PURE__ */ p("button", {
          type: "button",
          onClick: L,
          className: f(N({
            button: "rigth",
            className: t
          })),
          disabled: !e,
          children: [/* @__PURE__ */ u(O, { className: "w-4 h-4" }), /* @__PURE__ */ u(j, { children: "Decrement" })]
        }),
        /* @__PURE__ */ u("input", {
          ref: I,
          type: "number",
          value: s,
          name: x,
          className: f(V({ className: r })),
          readOnly: !0,
          "aria-label": typeof l == "string" ? l : "number input"
        }),
        /* @__PURE__ */ p("button", {
          type: "button",
          onClick: $,
          className: f(N({
            button: "left",
            className: n
          })),
          disabled: !o,
          children: [/* @__PURE__ */ u(w, { className: "w-4 h-4" }), /* @__PURE__ */ u(j, { children: "Increment" })]
        })
      ]
    })]
  });
});
export {
  X as t
};