trely-ui-kit 0.1.0

package/dist/index.mjs

@@ -0,0 +1,493 @@
+import { jsxs as i, jsx as n } from "react/jsx-runtime";
+import m, { useId as V } from "react";
+import './index.css';function j(o) {
+  var s, r, t = "";
+  if (typeof o == "string" || typeof o == "number") t += o;
+  else if (typeof o == "object") if (Array.isArray(o)) {
+    var l = o.length;
+    for (s = 0; s < l; s++) o[s] && (r = j(o[s])) && (t && (t += " "), t += r);
+  } else for (r in o) o[r] && (t && (t += " "), t += r);
+  return t;
+}
+function C() {
+  for (var o, s, r = 0, t = "", l = arguments.length; r < l; r++) (o = arguments[r]) && (s = j(o)) && (t && (t += " "), t += s);
+  return t;
+}
+const v = "_button_1r0ns_1", A = "_button__content_1r0ns_152", E = "_button__loader_1r0ns_164", B = "_spin_1r0ns_1", c = {
+  button: v,
+  "button--xs": "_button--xs_1r0ns_16",
+  "button--xs--icon": "_button--xs--icon_1r0ns_23",
+  "button--s": "_button--s_1r0ns_26",
+  "button--s--icon": "_button--s--icon_1r0ns_34",
+  "button--m": "_button--m_1r0ns_37",
+  "button--m--icon": "_button--m--icon_1r0ns_45",
+  "button--l": "_button--l_1r0ns_48",
+  "button--l--icon": "_button--l--icon_1r0ns_56",
+  "button-gold--main": "_button-gold--main_1r0ns_59",
+  "button-gold--secondary": "_button-gold--secondary_1r0ns_74",
+  "button-gold--tertiary": "_button-gold--tertiary_1r0ns_89",
+  "button-green--main": "_button-green--main_1r0ns_105",
+  "button-green--secondary": "_button-green--secondary_1r0ns_120",
+  "button-green--tertiary": "_button-green--tertiary_1r0ns_135",
+  button__content: A,
+  "button--loading": "_button--loading_1r0ns_160",
+  button__loader: E,
+  spin: B
+}, F = ({
+  color: o = "gold",
+  variant: s = "main",
+  size: r = "m",
+  icon: t,
+  leftIcon: l,
+  rightIcon: p,
+  loading: k = !1,
+  children: d,
+  className: _ = "",
+  disabled: w,
+  type: a = "button",
+  ...b
+}) => {
+  const h = C(
+    c.button,
+    c[`button-${o}--${s}`],
+    c[`button--${r}`],
+    t && c[`button--${r}--icon`],
+    k && c["button--loading"],
+    _
+  );
+  return /* @__PURE__ */ i("button", { className: h, disabled: w || k, type: a, ...b, children: [
+    k && /* @__PURE__ */ n("span", { className: c.button__loader }),
+    /* @__PURE__ */ i("span", { className: c.button__content, children: [
+      l,
+      d,
+      p
+    ] })
+  ] });
+};
+F.displayName = "Button";
+const D = "_icon_1urm5_1", R = {
+  icon: D
+}, L = {
+  XS: 12,
+  S: 16,
+  M: 20,
+  L: 24
+}, e = ({
+  size: o = 24,
+  color: s = "currentColor",
+  className: r = "",
+  children: t,
+  ...l
+}) => {
+  const p = C(R.icon, r);
+  return /* @__PURE__ */ n(
+    "svg",
+    {
+      className: p,
+      width: L[o] || o,
+      height: L[o] || o,
+      fill: "none",
+      stroke: s,
+      viewBox: "0 0 24 24",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      focusable: "false",
+      ...l,
+      children: t
+    }
+  );
+};
+e.displayName = "Icon";
+const S = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n(
+    "circle",
+    {
+      cx: "16.5019",
+      cy: "16.5019",
+      r: "4.50187",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M14.0008 7.99805L5.82585 16.173C5.29519 16.7037 4.99707 17.4234 4.99707 18.1739C4.99707 18.9243 5.29519 19.644 5.82585 20.1747V20.1747C6.3565 20.7054 7.07622 21.0035 7.82668 21.0035C8.57714 21.0035 9.29686 20.7054 9.82751 20.1747L12.1931 17.8091",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M2.99609 13.0003L11.5499 4.44645C12.4786 3.5178 13.7381 2.99609 15.0514 2.99609C16.3647 2.99609 17.6242 3.5178 18.5529 4.44645V4.44645C19.4815 5.37509 20.0032 6.6346 20.0032 7.94791C20.0032 9.26121 19.4815 10.5207 18.5529 11.4494L17.8094 12.1928",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M18.0022 16.5022H15.001",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M16.5022 15.001V18.0022",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+S.displayName = "AddMediaIcon";
+const T = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    d: "M8 10L12 14L16 10",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+T.displayName = "ArrowDownIcon";
+const $ = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    d: "M14 8L10 12L14 16",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+$.displayName = "ArrowLeftIcon";
+const Z = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    d: "M10 16L14 12L10 8",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+Z.displayName = "ArrowRightIcon";
+const P = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    d: "M16 14L12 10L8 14",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+P.displayName = "ArrowUpIcon";
+const U = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n("path", { d: "M7 13.5217L11.1667 17L17 7", "stroke-width": "1.5", "stroke-linecap": "round" }) });
+U.displayName = "CheckmarkIcon";
+const y = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M17 7L7 17", "stroke-width": "1.5", "stroke-linecap": "round" }),
+  /* @__PURE__ */ n("path", { d: "M7 7L17 17", "stroke-width": "1.5", "stroke-linecap": "round" })
+] });
+y.displayName = "CrossIcon";
+const X = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n(
+    "path",
+    {
+      "fill-rule": "evenodd",
+      "clip-rule": "evenodd",
+      d: "M16.1378 21H7.85782C6.81082 21 5.94082 20.192 5.86282 19.147L4.96582 7H18.9998L18.1328 19.142C18.0578 20.189 17.1868 21 16.1378 21V21Z",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n("path", { d: "M12 11V17", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M4 7H20", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M17 7L15.987 4.298C15.694 3.517 14.948 3 14.114 3H9.886C9.052 3 8.306 3.517 8.013 4.298L7 7",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M15.4298 11L14.9998 17",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M8.57016 11L9.00016 17",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+X.displayName = "DeleteIcon";
+const q = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M12 17V3", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M20 21H4", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M17 12L11.999 17.001L6.99902 12",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+q.displayName = "DownloadIcon";
+const G = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M21 11V19C21 20.105 20.105 21 19 21H5C3.895 21 3 20.105 3 19V5C3 3.895 3.895 3 5 3H13",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      "fill-rule": "evenodd",
+      "clip-rule": "evenodd",
+      d: "M20.707 6.12125L9.828 17.0002H7V14.1722L17.879 3.29325C18.27 2.90225 18.903 2.90225 19.293 3.29325L20.707 4.70725C21.098 5.09825 21.098 5.73125 20.707 6.12125Z",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M16.0898 5.08984L18.9098 7.90984",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+G.displayName = "EditIcon";
+const J = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M18 5H21", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M3 5H14", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M10 12H21", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M3 12H6", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M18 19H21", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M3 19H14", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M17.4142 3.58579C18.1953 4.36684 18.1953 5.63317 17.4142 6.41422C16.6332 7.19527 15.3668 7.19527 14.5858 6.41422C13.8047 5.63317 13.8047 4.36684 14.5858 3.58579C15.3668 2.80474 16.6332 2.80474 17.4142 3.58579",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M9.41422 10.5858C10.1953 11.3668 10.1953 12.6332 9.41422 13.4142C8.63317 14.1953 7.36684 14.1953 6.58579 13.4142C5.80474 12.6332 5.80474 11.3668 6.58579 10.5858C7.36684 9.80474 8.63317 9.80474 9.41422 10.5858",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M17.4142 17.5858C18.1953 18.3668 18.1953 19.6332 17.4142 20.4142C16.6332 21.1953 15.3668 21.1953 14.5858 20.4142C13.8047 19.6332 13.8047 18.3668 14.5858 17.5858C15.3668 16.8047 16.6332 16.8047 17.4142 17.5858",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+J.displayName = "FilterIcon";
+const K = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    "fill-rule": "evenodd",
+    "clip-rule": "evenodd",
+    d: "M6.19807 7.55934L9.68086 3.49609L13.4357 7.87676L15.8653 5.04219L17.802 7.30168C19.0465 8.75357 19.7305 10.6027 19.7305 12.515V12.7726C19.7305 14.8229 18.9161 16.7892 17.4663 18.239C16.0166 19.6887 14.0503 20.5032 12 20.5032V20.5032C7.73059 20.5032 4.26953 17.0421 4.26953 12.7727V12.7727C4.26953 10.8604 4.95359 9.01124 6.19807 7.55934Z",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+K.displayName = "FireIcon";
+const O = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M5 12H19", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M10 7L5 12", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M10 17L5 12", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })
+] });
+O.displayName = "LongArrowLeftIcon";
+const Q = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M19 12H5", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M14 17L19 12", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }),
+  /* @__PURE__ */ n("path", { d: "M14 7L19 12", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })
+] });
+Q.displayName = "LongArrowRightIcon";
+const W = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n("path", { d: "M12 7V17", "stroke-width": "1.5", "stroke-linecap": "round" }),
+  /* @__PURE__ */ n("path", { d: "M7 12H17", "stroke-width": "1.5", "stroke-linecap": "round" })
+] });
+W.displayName = "PlusIcon";
+const Y = (o) => /* @__PURE__ */ n(e, { ...o, children: /* @__PURE__ */ n(
+  "path",
+  {
+    d: "M16.1176 17.6558C17.8646 16.383 19 14.3213 19 11.9944C19 8.1284 15.866 4.99439 12 4.99439H11.5882M12 18.9944C8.13401 18.9944 5 15.8604 5 11.9944C5 9.66748 6.13537 7.60575 7.88235 6.33296M11.1765 20.5591L12.8235 18.912L11.1765 17.265M12.8235 6.7238L11.1765 5.07675L12.8235 3.42969",
+    "stroke-width": "1.5",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }
+) });
+Y.displayName = "RegenerateIcon";
+const z = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M15.7138 6.8382C18.1647 9.28913 18.1647 13.2629 15.7138 15.7138C13.2629 18.1647 9.28913 18.1647 6.8382 15.7138C4.38727 13.2629 4.38727 9.28913 6.8382 6.8382C9.28913 4.38727 13.2629 4.38727 15.7138 6.8382",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M19 19L15.71 15.71",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+z.displayName = "SearchIcon";
+const nn = (o) => /* @__PURE__ */ i(e, { ...o, children: [
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M16.066 12.1193H11.4141",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "circle",
+    {
+      cx: "12.0174",
+      cy: "11.5164",
+      r: "9.00375",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  ),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M11.4143 12.1192V6.51465",
+      "stroke-width": "1.5",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }
+  )
+] });
+nn.displayName = "TimeIcon";
+const I = m.createContext(null);
+I.displayName = "HookFormContext";
+const on = () => m.useContext(I);
+typeof window < "u" ? m.useLayoutEffect : m.useEffect;
+const tn = "_wrapper_4297m_1", en = "_label_4297m_5", rn = "_inputContainer_4297m_14", sn = "_input_4297m_14", dn = "_inputError_4297m_52", ln = "_clearButton_4297m_57", an = "_errorText_4297m_81", u = {
+  wrapper: tn,
+  label: en,
+  inputContainer: rn,
+  input: sn,
+  inputError: dn,
+  clearButton: ln,
+  errorText: an
+}, cn = ({
+  label: o,
+  error: s,
+  clearable: r = !1,
+  onClear: t,
+  className: l = "",
+  value: p,
+  disabled: k,
+  name: d,
+  ..._
+}) => {
+  const w = V(), a = on(), b = d && a ? a.register(d) : {}, h = d && a?.formState?.errors?.[d], M = s || (h && typeof h == "object" && "message" in h ? String(h.message) : void 0), g = !!(d && a ? a.watch(d) : p), f = C(u.wrapper, l), N = C(u.input, {
+    [u.inputError]: !!M
+  }), x = () => {
+    if (t)
+      t();
+    else if (d && a)
+      a.setValue(d, "", { shouldValidate: !0, shouldDirty: !0 });
+    else if (_.onChange) {
+      const H = { target: { value: "" } };
+      _.onChange(H);
+    }
+  };
+  return /* @__PURE__ */ i("div", { className: f, children: [
+    o && /* @__PURE__ */ n("label", { htmlFor: w, className: u.label, children: o }),
+    /* @__PURE__ */ i("div", { className: u.inputContainer, children: [
+      /* @__PURE__ */ n(
+        "input",
+        {
+          className: N,
+          value: p,
+          disabled: k,
+          ...b,
+          ..._,
+          id: w
+        }
+      ),
+      r && g && !k && /* @__PURE__ */ n("button", { type: "button", className: u.clearButton, onClick: x, tabIndex: -1, children: /* @__PURE__ */ n(y, { size: "XS" }) })
+    ] }),
+    M && /* @__PURE__ */ n("div", { className: u.errorText, children: M })
+  ] });
+};
+cn.displayName = "Input";
+export {
+  S as AddMediaIcon,
+  T as ArrowDownIcon,
+  $ as ArrowLeftIcon,
+  Z as ArrowRightIcon,
+  P as ArrowUpIcon,
+  F as Button,
+  U as CheckmarkIcon,
+  y as CrossIcon,
+  X as DeleteIcon,
+  q as DownloadIcon,
+  G as EditIcon,
+  J as FilterIcon,
+  K as FireIcon,
+  e as Icon,
+  cn as Input,
+  O as LongArrowLeftIcon,
+  Q as LongArrowRightIcon,
+  W as PlusIcon,
+  Y as RegenerateIcon,
+  z as SearchIcon,
+  nn as TimeIcon
+};
+//# sourceMappingURL=index.mjs.map