triafly-ui-kit 1.0.23 → 1.0.25

package/dist/components/Ui/FileUpload/FileUpload.js

@@ -0,0 +1,197 @@
+import { jsxs as i, jsx as a } from "react/jsx-runtime";
+import { forwardRef as Y, useState as w, useRef as F, useCallback as P, useImperativeHandle as R } from "react";
+import b from "../../../_virtual/papaparse.min.js";
+import '../../../assets/src/components/Ui/FileUpload/FileUpload.css';/* empty css                                                    */
+import { Button as V } from "../Button/Button.js";
+import { IconFile as E } from "../Icons/Icons.js";
+import { Loader as C } from "../Loader/Loader.js";
+import { formatFileSize as ee, SIZE_UNITS as le } from "./fn.js";
+const ae = Y(
+  ({
+    acceptedFormats: _ = [".csv", ".pdf", ".jpg", ".png", ".xlsx"],
+    maxSize: v = 7,
+    sizeUnit: N = "MB",
+    multiple: x = !1,
+    onFilesChange: d,
+    onError: s,
+    parserCsv: $ = !1,
+    onReset: h,
+    visibilityFileUpload: W = !0,
+    onVisibilityChange: c,
+    onChange: m,
+    isDisabled: p = !1,
+    hasError: A = !1,
+    errorMessage: S,
+    label: k,
+    isNotDeleteElement: H
+  }, O) => {
+    const [f, T] = w([]), [U, B] = w(!1), [D, n] = w(""), L = F(null), [Z, g] = w(!1), q = P(() => {
+      T([]), n(""), L.current && (L.current.value = ""), h == null || h(), m == null || m([]), d == null || d([], []), c == null || c(!0);
+    }, [h, d, c]);
+    R(O, () => ({
+      reset: q,
+      getFiles: () => f.map((e) => e.file),
+      getParsedData: () => f.map((e) => e.parsedData)
+    }));
+    const G = v * le[N], J = P(
+      async (e) => $ && e.name.endsWith(".csv") ? new Promise((o, r) => {
+        b.parse(e, {
+          complete: (u) => {
+            u.errors.length && r(new Error("Ошибка при парсинге CSV файла")), o(u.data);
+          },
+          error: () => {
+            r(new Error("Не удалось прочитать CSV файл"));
+          },
+          skipEmptyLines: !0
+        });
+      }) : [],
+      [$]
+    ), M = async (e) => {
+      if (!e.target.files || p) return;
+      n("");
+      const o = Array.from(e.target.files), r = [];
+      B(!0);
+      try {
+        for (const l of o) {
+          const y = _.some(
+            (t) => l.name.toLowerCase().endsWith(t.replace(".", ""))
+          ), X = l.size <= G;
+          if (f.some(
+            (t) => t.file.name === l.name && t.file.size === l.size && t.file.lastModified === l.lastModified
+          )) {
+            s == null || s(`Файл "${l.name}" уже загружен`), n(`Файл "${l.name}" уже загружен`);
+            continue;
+          }
+          if (!y) {
+            const t = `Неподдерживаемый формат: ${l.name}`;
+            s == null || s(t), n(`Неподдерживаемый формат: ${l.name}`);
+            continue;
+          }
+          if (!X) {
+            const t = `Файл слишком большой (максимум ${v} ${N}): ${l.name}`;
+            s == null || s(t), n(`Файл слишком большой (максимум ${v} ${N}): ${l.name}`);
+            continue;
+          }
+          try {
+            const t = $ ? await J(l) : void 0;
+            r.push({ file: l, parsedData: t });
+          } catch (t) {
+            const z = t instanceof Error ? t.message : "Неизвестная ошибка";
+            s == null || s(z), r.push({
+              file: l,
+              error: z,
+              isLoading: !1
+            });
+          }
+        }
+        T((l) => x ? [...l, ...r] : r);
+        const I = (x ? [...f, ...r] : r).filter((l) => !l.error);
+        m == null || m(I.map((l) => l.file)), d == null || d(
+          I.map((l) => l.file),
+          $ ? I.map((l) => l.parsedData).filter(Boolean) : void 0
+        ), I.length > 0 && (c == null || c(!1));
+      } finally {
+        B(!1);
+      }
+    }, j = (e) => {
+      e.preventDefault(), g(!0);
+    }, K = (e) => {
+      e.preventDefault(), g(!1);
+    }, Q = (e) => {
+      if (e.preventDefault(), n(""), g(!1), e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+        if (!_.some(
+          (u) => e.dataTransfer.files[0].name.toLowerCase().endsWith(u.replace(".", ""))
+        )) {
+          n(`Неподдерживаемый формат: ${e.dataTransfer.files[0].name}`);
+          return;
+        }
+        const r = {
+          target: { files: e.dataTransfer.files }
+        };
+        M(r);
+      }
+    };
+    return /* @__PURE__ */ i("div", { className: "file-upload", children: [
+      k && /* @__PURE__ */ a("label", { className: "form-item-label", children: k }),
+      W && /* @__PURE__ */ a("div", { children: U ? /* @__PURE__ */ i("div", { className: "file-upload__loading", children: [
+        /* @__PURE__ */ a("div", { style: { position: "relative", height: "40px", width: "40px" }, children: /* @__PURE__ */ a(C, { size: 40 }) }),
+        /* @__PURE__ */ a("span", { children: "Файл загружается..." })
+      ] }) : /* @__PURE__ */ i(
+        "label",
+        {
+          htmlFor: "fileInput",
+          className: `file-upload__label ${p ? "disabled" : ""}`,
+          children: [
+            /* @__PURE__ */ a(
+              "input",
+              {
+                ref: L,
+                type: "file",
+                id: "fileInput",
+                multiple: !1,
+                accept: _.join(","),
+                onChange: M,
+                className: "file-upload__input",
+                disabled: p
+              }
+            ),
+            /* @__PURE__ */ i(
+              "div",
+              {
+                onDragEnter: j,
+                onDragOver: j,
+                onDragLeave: K,
+                onDrop: Q,
+                className: `file-upload__drop-area ${Z ? "dragging" : ""} ${D ? "error" : ""} ${p ? "disabled" : ""}`,
+                children: [
+                  /* @__PURE__ */ a("p", { children: "Перетащите или выберите файлы чтобы загрузить" }),
+                  /* @__PURE__ */ a(
+                    V,
+                    {
+                      onClick: () => {
+                        var e;
+                        return !p && ((e = document.getElementById("fileInput")) == null ? void 0 : e.click());
+                      },
+                      label: "Выбрать файлы",
+                      type: "button",
+                      className: "file-upload__select-btn",
+                      isDisabled: p
+                    }
+                  ),
+                  /* @__PURE__ */ i("div", { className: "file-upload__formats", children: [
+                    /* @__PURE__ */ i("span", { children: [
+                      "Поддерживаемые форматы: ",
+                      _.join(", ")
+                    ] }),
+                    /* @__PURE__ */ i("span", { children: [
+                      "Максимальный размер: ",
+                      v,
+                      " ",
+                      N
+                    ] })
+                  ] }),
+                  (D || A && S) && /* @__PURE__ */ a("span", { style: { color: "red" }, children: D || S })
+                ]
+              }
+            )
+          ]
+        }
+      ) }),
+      f.length > 0 && /* @__PURE__ */ a("div", { className: "file-upload__files-list", children: /* @__PURE__ */ a("ul", { children: f == null ? void 0 : f.map((e, o) => /* @__PURE__ */ i("li", { className: "file-upload__file-item", children: [
+        /* @__PURE__ */ i("div", { className: "file-upload__file-info", children: [
+          /* @__PURE__ */ a("div", { className: "file-upload__box-icon", children: /* @__PURE__ */ a(E, { className: "icon" }) }),
+          /* @__PURE__ */ i("div", { className: "file-upload__block-text", children: [
+            /* @__PURE__ */ a("span", { className: "file-upload__file-name", children: e.file.name }),
+            /* @__PURE__ */ a("span", { className: "file-upload__file-size", children: ee(e.file.size) })
+          ] }),
+          e.error && /* @__PURE__ */ a("span", { className: "file-upload__file-error", children: e.error })
+        ] }),
+        null
+      ] }, `${e.file.name}-${o}`)) }) })
+    ] });
+  }
+);
+ae.displayName = "FileUpload";
+export {
+  ae as FileUpload
+};

package/dist/components/Ui/FileUpload/fn.js

@@ -0,0 +1,10 @@
+const r = {
+  B: 1,
+  KB: 1024,
+  MB: 1048576,
+  GB: 1073741824
+}, i = (B) => B < r.KB ? `${B} B` : B < r.MB ? `${(B / r.KB).toFixed(2)} KB` : B < r.GB ? `${(B / r.MB).toFixed(2)} MB` : `${(B / r.GB).toFixed(2)} GB`;
+export {
+  r as SIZE_UNITS,
+  i as formatFileSize
+};

package/dist/components/Ui/FileUpload/index.js

@@ -0,0 +1,4 @@
+import { FileUpload as l } from "./FileUpload.js";
+export {
+  l as FileUpload
+};

package/dist/components/Ui/FileUpload/types.js

@@ -0,0 +1 @@
+

package/dist/components/Ui/Form/FormContext/FormContext.js

@@ -0,0 +1,5 @@
+import { createContext as t } from "react";
+const e = t(null);
+export {
+  e as FormContext
+};

package/dist/components/Ui/Form/FormItem/FormItem.js

@@ -0,0 +1,107 @@
+import { jsx as k } from "react/jsx-runtime";
+import d, { useContext as A, useMemo as C, useEffect as E, useCallback as I } from "react";
+import { FormContext as f } from "../FormContext/FormContext.js";
+import { validateRule as D } from "../utils/fn.js";
+import { getChildType as R } from "./fn.js";
+const N = d.memo(
+  ({
+    name: t,
+    children: r,
+    rules: c,
+    label: h,
+    isDisabled: p,
+    style: b,
+    classNameItem: m
+  }) => {
+    const e = A(f), [, v] = d.useReducer((a) => a + 1, 0), u = p || (e == null ? void 0 : e.disabled), s = C(() => Array.isArray(t) ? t : [t], [t]);
+    E(() => {
+      if (e)
+        return e.setFieldRules(s, c || []), e.subscribe(s, v);
+    }, [s, c, e]);
+    const n = e == null ? void 0 : e.getFieldValue(s), l = e == null ? void 0 : e.getFieldError(s), o = I(
+      (a) => {
+        if (!u && (e == null || e.setFieldValue(s, a), c)) {
+          const i = c.map((F) => D(F, a)).filter(Boolean);
+          e == null || e.setFieldError(s, i);
+        }
+      },
+      [s, c, u]
+    ), g = R(r), y = C(() => {
+      const a = {
+        name: s,
+        label: h,
+        isDisabled: u,
+        hasError: !!(l != null && l.length),
+        errorMessage: l == null ? void 0 : l[0]
+      };
+      switch (g) {
+        case "TextareaInput":
+          return {
+            ...a,
+            value: n || "",
+            onChange: o
+          };
+        case "DropdownInput":
+          return {
+            ...a,
+            value: n,
+            onChange: o
+          };
+        case "TextInput":
+          return {
+            ...a,
+            value: n || "",
+            onChange: (i) => o(i.target.value)
+          };
+        case "Checkbox":
+          return {
+            ...a,
+            isChecked: !!n,
+            onChange: (i) => o(i.target.checked)
+          };
+        case "Radio":
+          return {
+            ...a,
+            radioId: `radio-${Array.isArray(t) ? t.join("-") : t}`,
+            value: r.props.value,
+            isChecked: n === r.props.value,
+            onChange: () => o(r.props.value)
+          };
+        case "SearchInput":
+          return {
+            ...a,
+            value: n,
+            onChange: o
+          };
+        case "Switch":
+          return {
+            ...a,
+            isChecked: !!n,
+            onChange: (i) => o(i.target.checked)
+          };
+        case "FileUpload":
+          return {
+            ...a,
+            value: Array.isArray(n) ? n : [],
+            onChange: (i) => o(i)
+          };
+        default:
+          return a;
+      }
+    }, [
+      s,
+      h,
+      l,
+      n,
+      g,
+      o,
+      r.props.value,
+      u
+    ]);
+    return /* @__PURE__ */ k("div", { className: m, style: b, children: d.cloneElement(r, y) });
+  },
+  (t, r) => t.name === r.name && t.rules === r.rules && t.label === r.label && t.isDisabled === r.isDisabled
+);
+export {
+  N as FormItem
+};

package/dist/components/Ui/Form/FormItem/fn.js

@@ -0,0 +1,25 @@
+const p = (e) => {
+  var n, r, a, f;
+  if (typeof e == "string")
+    return e;
+  if (typeof e == "object" && e !== null) {
+    const t = e;
+    if (t.$$typeof === Symbol.for("react.forward_ref")) {
+      const o = e;
+      return o.displayName || ((n = o.render) == null ? void 0 : n.displayName) || ((r = o.render) == null ? void 0 : r.name) || "ForwardRefComponent";
+    }
+    if (t.$$typeof === Symbol.for("react.memo")) {
+      const o = e;
+      return o.displayName || ((a = o.type) == null ? void 0 : a.displayName) || ((f = o.type) == null ? void 0 : f.name) || "MemoComponent";
+    }
+  }
+  if (typeof e == "function") {
+    const t = e;
+    return t.displayName || t.name || "FunctionComponent";
+  }
+  return "UnknownComponent";
+}, m = (e) => e.props.name || p(e.type);
+export {
+  m as getChildType,
+  p as getComponentName
+};

package/dist/components/Ui/Form/FormItem/types.js

@@ -0,0 +1 @@
+

package/dist/components/Ui/Form/FormRoot/FormRoot.js

@@ -0,0 +1,26 @@
+import { jsx as a } from "react/jsx-runtime";
+import '../../../../assets/src/components/Ui/Form/FormRoot/Form.css';/* empty css                                                    */
+import { useMemo as l } from "react";
+import { FormContext as f } from "../FormContext/FormContext.js";
+import { FormItem as i } from "../FormItem/FormItem.js";
+import { useForm as p } from "../useForm/useForm.js";
+const v = ({ form: m, children: c, onFinish: o, disabled: t = !1 }) => {
+  const n = p()[0], s = l(() => {
+    const r = m || n;
+    return r.disabled = t, r;
+  }, [m, n, t]), u = async (r) => {
+    r.preventDefault();
+    try {
+      if (t) return;
+      const e = await s.validateFields();
+      o == null || o(e);
+    } catch (e) {
+      console.error("Form submission error:", e);
+    }
+  };
+  return /* @__PURE__ */ a(f.Provider, { value: s || null, children: /* @__PURE__ */ a("form", { onSubmit: u, children: c }) });
+};
+v.Item = i;
+export {
+  v as Form
+};

package/dist/components/Ui/Form/FormRoot/index.js

@@ -0,0 +1,4 @@
+import { Form as m } from "./FormRoot.js";
+export {
+  m as Form
+};

package/dist/components/Ui/Form/FormRoot/types.js

@@ -0,0 +1 @@
+

package/dist/components/Ui/Form/index.js

@@ -0,0 +1,6 @@
+import { Form as m } from "./FormRoot/FormRoot.js";
+import { useForm as f } from "./useForm/useForm.js";
+export {
+  m as Form,
+  f as useForm
+};

package/dist/components/Ui/Form/useForm/index.js

@@ -0,0 +1,4 @@
+import { useForm as e } from "./useForm.js";
+export {
+  e as useForm
+};

package/dist/components/Ui/Form/useForm/useForm.js

@@ -0,0 +1,111 @@
+import { useRef as y, useCallback as g } from "react";
+import { normalizePath as i, validateRule as b, getFieldKey as f, getByPath as k, getNestedValue as V, setByPath as v } from "../utils/fn.js";
+class O extends Error {
+  constructor(l) {
+    super("Form validation failed"), this.errorFields = l, this.name = "FormValidationError";
+  }
+}
+function N() {
+  const a = y({}), l = y({}), p = y({}), o = y({}), d = g((t) => {
+    const r = i(t), e = /* @__PURE__ */ new Set();
+    e.add(r.join("."));
+    for (let n = 1; n < r.length; n++)
+      e.add(r.slice(0, n).join("."));
+    e.forEach((n) => {
+      var s;
+      (s = o.current[n]) == null || s.forEach((c) => c());
+    });
+  }, []), m = g(
+    async (t, r, e) => {
+      if (!e) return [];
+      const n = (await Promise.all(e.map((c) => b(c, r)))).filter(Boolean), s = f(t);
+      return l.current[s] = n, d(s), n;
+    },
+    [d]
+  ), w = g(
+    async (t) => {
+      const r = t || Object.keys(p.current).map((n) => n.includes(".") ? n.split(".") : n), e = {};
+      if (await Promise.all(
+        r.map(async (n) => {
+          const s = i(n), c = f(s), u = p.current[c] || [], F = k(a.current, s), h = await m(s, F, u);
+          h.length && (e[c] = h);
+        })
+      ), Object.keys(e).length)
+        throw new O(
+          Object.entries(e).map(([n, s]) => ({
+            name: n,
+            errors: s
+          }))
+        );
+      return { ...a.current };
+    },
+    [m]
+  ), E = (t) => Array.isArray(t) ? t : typeof t == "string" && t.includes(".") ? t.split(".") : [t], j = y({
+    resetFields: () => {
+      a.current = {}, l.current = {}, Object.keys(o.current).forEach(d);
+    },
+    setFieldsValue: (t) => {
+      const r = { ...a.current };
+      Object.entries(t).forEach(([e, n]) => {
+        const s = E(e);
+        v(r, s, n);
+      }), a.current = r, Object.keys(t).forEach((e) => {
+        d(Array.isArray(e) ? e.join(".") : e);
+      });
+    },
+    setFieldValue: (t, r) => {
+      const e = i(t), n = JSON.parse(JSON.stringify(a.current));
+      let s = n;
+      for (let c = 0; c < e.length - 1; c++) {
+        const u = e[c];
+        s[u] || (s[u] = {}), s = s[u];
+      }
+      s[e[e.length - 1]] = r, a.current = n, d(e);
+    },
+    getFieldValue: (t) => {
+      const r = i(t);
+      return V(a.current, r);
+    },
+    getFieldsValue: () => ({ ...a.current }),
+    submit: async () => {
+      await j.validateFields();
+    },
+    validateFields: w,
+    getFieldError: (t) => {
+      const r = f(i(t));
+      return l.current[r] || [];
+    },
+    setFieldError: (t, r) => {
+      const e = f(i(t));
+      l.current[e] = r, d(e);
+    },
+    getFieldRules: (t) => {
+      const r = f(i(t));
+      return p.current[r] || [];
+    },
+    setFieldRules: (t, r) => {
+      const e = f(i(t));
+      p.current[e] = r;
+    },
+    subscribe: (t, r) => {
+      const e = i(t), n = e.join(".");
+      if (o.current[n] || (o.current[n] = /* @__PURE__ */ new Set()), o.current[n].add(r), e.length > 1) {
+        const c = e.slice(0, -1).join(".");
+        o.current[c] || (o.current[c] = /* @__PURE__ */ new Set());
+        const u = () => r();
+        return o.current[c].add(u), () => {
+          var F, h;
+          (F = o.current[n]) == null || F.delete(r), (h = o.current[c]) == null || h.delete(u);
+        };
+      }
+      return () => {
+        var s;
+        return (s = o.current[n]) == null ? void 0 : s.delete(r);
+      };
+    }
+  }).current;
+  return [j];
+}
+export {
+  N as useForm
+};

package/dist/components/Ui/Form/utils/fn.js

@@ -0,0 +1,31 @@
+const f = /^[^\s@]+@[^\s@]+\.[^\s@]+$/, c = (t, s) => {
+  const e = s == null ? "" : String(s);
+  return t.required && e.trim() === "" ? t.message || "Это поле обязательно" : t.pattern && e && !t.pattern.test(e) ? t.message || "Некорректный формат" : t.type === "email" && e && !f.test(e) ? t.message || "Некорректный email" : t.validator ? t.validator(s) : typeof t.min == "number" && e.length < t.min ? t.message || `Минимум ${t.min} символов` : typeof t.max == "number" && e.length > t.max ? t.message || `Максимум ${t.max} символов` : null;
+}, a = (t) => Array.isArray(t) ? t : [t], g = (t) => Array.isArray(t) ? t.join(".") : t, m = (t, s, e) => {
+  const n = a(s);
+  let r = t;
+  for (let i = 0; i < n.length - 1; i++) {
+    const o = n[i];
+    (!r[o] || typeof r[o] != "object") && (r[o] = {}), r = r[o];
+  }
+  r[n[n.length - 1]] = e;
+}, p = (t, s) => {
+  const e = a(s);
+  let n = t;
+  for (const r of e) {
+    if (!n || typeof n != "object") return;
+    n = n[r];
+  }
+  return n;
+}, y = (t, s) => s.reduce((e, n) => {
+  if (e && typeof e == "object" && n in e)
+    return e[n];
+}, t);
+export {
+  p as getByPath,
+  g as getFieldKey,
+  y as getNestedValue,
+  a as normalizePath,
+  m as setByPath,
+  c as validateRule
+};

package/dist/components/Ui/Form/utils/types.js

@@ -0,0 +1 @@
+