triafly-ui-kit 1.0.22 → 1.0.23

package/dist/components/Ui/SearchInput/SearchInput.js

@@ -1,109 +0,0 @@
-import { jsxs as I, Fragment as T, jsx as l } from "react/jsx-runtime";
-import { useState as o, useRef as H, useEffect as w } from "react";
-import { TextInput as U } from "../TextInput/TextInput.js";
-import { IconCaretUpDown as q } from "../Icons/Icons.js";
-import '../../../assets/SearchInput.css';const z = ({
-  name: k = "SearchInput",
-  label: x,
-  placeholder: y = "",
-  type: N = "text",
-  id: $,
-  isDisabled: h = !1,
-  errorMessage: F = "",
-  hasError: V = !1,
-  className: D = "",
-  isClearable: E,
-  isLoading: L,
-  value: c = "",
-  onChange: s,
-  options: n = []
-}) => {
-  const [m, v] = o(c), [j, i] = o(""), [u, p] = o([]), [d, r] = o(!1), [g, A] = o(!1), [B, C] = o(!1), f = H(null);
-  w(() => {
-    if (c) {
-      const e = n.find((t) => t.value === c);
-      i(e ? e.label : c);
-    } else
-      i("");
-  }, [c, n]), w(() => {
-    if (m.trim() === "" && g) {
-      p(n);
-      return;
-    }
-    const e = n.filter(
-      (t) => t.label.toLowerCase().includes(m.toLowerCase())
-    );
-    p(e);
-  }, [m, n, g]), w(() => {
-    const e = (t) => {
-      f.current && !f.current.contains(t.target) && r(!1);
-    };
-    return document.addEventListener("mousedown", e), () => {
-      document.removeEventListener("mousedown", e);
-    };
-  }, []);
-  const K = (e) => {
-    const t = e.target.value;
-    v(t), i(t), s == null || s(t), r(!0);
-  }, b = (e) => {
-    v(e.value), i(e.label), s == null || s(e.value), r(!1);
-  }, O = () => {
-    A(!0), r(!0), p(n);
-  }, P = (e) => {
-    e.key === "Enter" && u.length > 0 && d && b(u[0]);
-  }, S = (e) => {
-    var t;
-    if (e.stopPropagation(), !d) {
-      const a = (t = f.current) == null ? void 0 : t.getBoundingClientRect(), R = window.innerHeight - ((a == null ? void 0 : a.bottom) || 0);
-      C(R < 304);
-    }
-    r((a) => !a);
-  };
-  return /* @__PURE__ */ I(T, { children: [
-    /* @__PURE__ */ l(
-      U,
-      {
-        name: k,
-        label: x,
-        type: N,
-        className: `${D}`,
-        value: j,
-        onChange: K,
-        placeholder: y,
-        id: $,
-        isDisabled: h,
-        isClearable: E,
-        hasError: V,
-        errorMessage: F,
-        isLoading: L,
-        onFocus: O,
-        onKeyDown: P
-      }
-    ),
-    /* @__PURE__ */ I("div", { className: "dropdown-input-test", children: [
-      /* @__PURE__ */ l("div", { className: "caret", onClick: S, children: /* @__PURE__ */ l(q, {}) }),
-      d && g && u.length > 0 && /* @__PURE__ */ l(
-        "div",
-        {
-          className: `input-box
-        ${d ? "opened" : ""} 
-        ${h ? "disabled" : ""}`,
-          ref: f,
-          onClick: S,
-          children: /* @__PURE__ */ l("ul", { className: `options ${B ? "above" : ""}`, children: u.map((e, t) => /* @__PURE__ */ l(
-            "li",
-            {
-              onClick: () => b(e),
-              children: e.label
-            },
-            `${e.value}-${t}`
-          )) })
-        }
-      )
-    ] })
-  ] });
-};
-z.displayName = "SearchInput";
-export {
-  z as SearchInput
-};

package/dist/components/Ui/Skeleton/Skeleton.js

@@ -1,28 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import { c as r } from "../../../index-2QXL0WYc.js";
-import '../../../assets/Skeleton.css';const c = "_skeleton_yatxz_1", d = "_animated_yatxz_6", e = {
-  skeleton: c,
-  animated: d
-}, x = ({
-  width: t = "100%",
-  height: s = "100%",
-  borderRadius: a = "4px",
-  circle: o = !1,
-  animated: n = !0,
-  className: l,
-  style: m
-}) => /* @__PURE__ */ i(
-  "div",
-  {
-    className: r(e.skeleton, { [e.animated]: n }, l),
-    style: {
-      width: t,
-      height: s,
-      borderRadius: o ? "50%" : a,
-      ...m
-    }
-  }
-);
-export {
-  x as Skeleton
-};

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

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

package/dist/components/Ui/Switch/Switch.js

@@ -1,25 +0,0 @@
-import { jsx as c, jsxs as t } from "react/jsx-runtime";
-import '../../../assets/Switch.css';const d = ({
-  label: s,
-  isDisabled: e,
-  isChecked: a = !1,
-  onChange: i,
-  name: l = "Switch"
-}) => /* @__PURE__ */ c("div", { className: "switch-container", children: /* @__PURE__ */ t("label", { className: `switch ${e ? "disabled" : ""}`, children: [
-  /* @__PURE__ */ c(
-    "input",
-    {
-      name: l,
-      type: "checkbox",
-      checked: a,
-      onChange: i,
-      disabled: e
-    }
-  ),
-  s,
-  /* @__PURE__ */ c("span", { className: "slider" })
-] }) });
-d.displayName = "Switch";
-export {
-  d as Switch
-};

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

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

package/dist/components/Ui/Table/MemoizedRow/MemoizedRow.js

@@ -1,79 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import b from "react";
-import { g } from "../../../../_commonjsHelpers-C6fGbg64.js";
-import { c as s } from "../../../../index-2QXL0WYc.js";
-var p, c;
-function y() {
-  return c || (c = 1, p = function r(t, e) {
-    if (t === e) return !0;
-    if (t && e && typeof t == "object" && typeof e == "object") {
-      if (t.constructor !== e.constructor) return !1;
-      var o, n, u;
-      if (Array.isArray(t)) {
-        if (o = t.length, o != e.length) return !1;
-        for (n = o; n-- !== 0; )
-          if (!r(t[n], e[n])) return !1;
-        return !0;
-      }
-      if (t.constructor === RegExp) return t.source === e.source && t.flags === e.flags;
-      if (t.valueOf !== Object.prototype.valueOf) return t.valueOf() === e.valueOf();
-      if (t.toString !== Object.prototype.toString) return t.toString() === e.toString();
-      if (u = Object.keys(t), o = u.length, o !== Object.keys(e).length) return !1;
-      for (n = o; n-- !== 0; )
-        if (!Object.prototype.hasOwnProperty.call(e, u[n])) return !1;
-      for (n = o; n-- !== 0; ) {
-        var f = u[n];
-        if (!r(t[f], e[f])) return !1;
-      }
-      return !0;
-    }
-    return t !== t && e !== e;
-  }), p;
-}
-var O = y();
-const i = /* @__PURE__ */ g(O), S = b.memo(
-  ({
-    record: r,
-    columns: t,
-    rowKey: e,
-    rowClassName: o,
-    index: n,
-    stickyLeft: u,
-    onClickTr: f,
-    bordered: m
-  }) => {
-    const d = (a) => {
-      !a.target.closest("[data-no-bubble]") && f && f(r);
-    };
-    return /* @__PURE__ */ l(
-      "tr",
-      {
-        className: s(
-          "table-component__wrapper__table__tbody__tr",
-          o == null ? void 0 : o(r, n),
-          {
-            "table-component__wrapper__table__tbody__tr--hoverable": !!f
-          }
-        ),
-        onClick: d,
-        children: t.map((a, _) => /* @__PURE__ */ l(
-          "td",
-          {
-            className: s("table-component__wrapper__table__tbody__td", a.className, {
-              "table-component__wrapper__table__tbody__td--bordered": m,
-              "table-component__wrapper__table__tbody__td--sticky-left": u && _ === 0
-            }),
-            align: a.align,
-            children: a.render ? a.render(r[a.dataIndex], r) : String(r[a.dataIndex] ?? "")
-          },
-          `${a.key}-${_}`
-        ))
-      },
-      typeof e == "function" ? e(r) : String(r[e])
-    );
-  },
-  (r, t) => i(r.columns, t.columns) && i(r.record, t.record)
-);
-export {
-  S as MemoizedRow
-};

package/dist/components/Ui/Table/Table.js

@@ -1,160 +0,0 @@
-import { jsx as t, jsxs as _ } from "react/jsx-runtime";
-import U, { useState as N, useEffect as q, useCallback as d } from "react";
-import { c as o } from "../../../index-2QXL0WYc.js";
-import { IconCaretDown as w, IconCaretUp as F } from "../Icons/Icons.js";
-import { MemoizedRow as G } from "./MemoizedRow/MemoizedRow.js";
-import { Loader as H } from "../Loader/Loader.js";
-import '../../../assets/Table.css';const y = {
-  asc: /* @__PURE__ */ t(w, { viewBox: "0 -6 24 24", "aria-hidden": "true" }),
-  desc: /* @__PURE__ */ t(F, { viewBox: "0 -4 24 24", "aria-hidden": "true" }),
-  default: /* @__PURE__ */ t(w, { viewBox: "0 -6 24 24", "aria-hidden": "true" })
-};
-function J({
-  columns: f,
-  dataSource: c,
-  rowKey: i,
-  tableClassName: v,
-  theadClassName: k,
-  trTheadClassNames: x,
-  thTheadClassNames: D,
-  tbodyClassName: I,
-  wrapperClassName: A,
-  borderBottom: u = !1,
-  stickyHeader: C = !1,
-  stickyLeft: h = !1,
-  bordered: l = !1,
-  rowClassName: j,
-  defaultSort: B,
-  onClickTr: m,
-  onClickTrHeader: R,
-  loading: S = !1
-}) {
-  const [T, b] = N(c), [n, z] = N(
-    B || null
-  );
-  q(() => {
-    b(c);
-  }, [c]);
-  const $ = d(
-    (e) => typeof i == "function" ? i(e) : typeof i == "string" && i in e ? String(e[i]) : "unknown",
-    [i]
-  ), g = d((e, a) => {
-    b((p) => [...p].sort((L, M) => {
-      const s = L[e], r = M[e];
-      return typeof s == "string" && typeof r == "string" ? a === "asc" ? s.localeCompare(r) : r.localeCompare(s) : typeof s == "number" && typeof r == "number" ? a === "asc" ? s - r : r - s : s instanceof Date && r instanceof Date ? a === "asc" ? s.getTime() - r.getTime() : r.getTime() - s.getTime() : 0;
-    })), z({ key: e, order: a });
-  }, []), E = d(
-    (e) => {
-      const p = (n == null ? void 0 : n.key) === e && n.order === "asc" ? "desc" : "asc";
-      g(e, p);
-    },
-    [n, g]
-  );
-  return /* @__PURE__ */ t("div", { className: o("table-component", A), children: /* @__PURE__ */ t(
-    "div",
-    {
-      className: o(
-        "table-component__wrapper",
-        {
-          bordered: l,
-          borderBottom: u
-        },
-        v
-      ),
-      children: /* @__PURE__ */ _(
-        "table",
-        {
-          className: o("table-component__wrapper__table", {
-            bordered: l,
-            borderBottom: u
-          }),
-          children: [
-            /* @__PURE__ */ t(
-              "thead",
-              {
-                className: o(
-                  "table-component__wrapper__table__thead",
-                  {
-                    stickyHeader: C
-                  },
-                  k
-                ),
-                children: /* @__PURE__ */ t(
-                  "tr",
-                  {
-                    className: o(
-                      "table-component__wrapper__table__thead__tr",
-                      x
-                    ),
-                    onClick: R,
-                    children: f.map((e, a) => /* @__PURE__ */ t(
-                      "th",
-                      {
-                        className: o(
-                          "table-component__wrapper__table__thead__th",
-                          {
-                            bordered: l,
-                            stickyLeft: h && a === 0
-                          },
-                          D
-                        ),
-                        style: {
-                          ...e.width ? { width: e.width } : {},
-                          ...e.align ? { textAlign: e.align } : {}
-                        },
-                        onClick: () => e.sorted && E(e.key),
-                        children: /* @__PURE__ */ _("div", { className: "th-content", children: [
-                          e.title,
-                          e.sorted && /* @__PURE__ */ t("span", { className: "sort-icon", children: (n == null ? void 0 : n.key) === e.key ? y[n.order] : y.default })
-                        ] })
-                      },
-                      `${e.key}-${a}`
-                    ))
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ _("tbody", { className: o("table-component__wrapper__table__tbody", I), children: [
-              T.map((e, a) => /* @__PURE__ */ t(
-                G,
-                {
-                  record: e,
-                  onClickTr: () => m == null ? void 0 : m(e),
-                  columns: f,
-                  rowKey: i,
-                  rowClassName: j,
-                  index: a,
-                  stickyLeft: h,
-                  bordered: l
-                },
-                $(e)
-              )),
-              S ? /* @__PURE__ */ t(
-                "div",
-                {
-                  style: {
-                    position: "absolute",
-                    top: 0,
-                    left: 0,
-                    right: 0,
-                    bottom: 0,
-                    display: "flex",
-                    justifyContent: "center",
-                    alignItems: "center",
-                    backgroundColor: "rgba(255, 255, 255, 0.7)",
-                    zIndex: 10
-                  },
-                  children: /* @__PURE__ */ t(H, { className: "centered" })
-                }
-              ) : null
-            ] })
-          ]
-        }
-      )
-    }
-  ) });
-}
-const Z = U.memo(J);
-export {
-  Z as Table
-};

package/dist/components/Ui/Table/TableTypes.js

@@ -1 +0,0 @@
-

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

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

package/dist/components/Ui/Tabs/Tabs.js

@@ -1,24 +0,0 @@
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import { useState as v } from "react";
-import '../../../assets/Tabs.css';const f = ({ items: s, defaultActiveKey: t, onChange: d }) => {
-  var c, b;
-  const [l, i] = v(t || ((c = s[0]) == null ? void 0 : c.key)), n = (a) => {
-    s.some((r) => r.key === a && !r.disabled) && (i(a), d == null || d(a));
-  };
-  return /* @__PURE__ */ o("div", { className: "tabs", children: [
-    /* @__PURE__ */ e("div", { className: "tabs-bar", children: s.map((a) => /* @__PURE__ */ e(
-      "button",
-      {
-        onClick: () => !a.disabled && n(a.key),
-        className: `tab-button ${l === a.key ? "active" : ""} ${a.disabled ? "disabled" : ""}`,
-        disabled: a.disabled,
-        children: a.label
-      },
-      a.key
-    )) }),
-    /* @__PURE__ */ e("div", { className: "tabs-content", children: (b = s.find((a) => a.key === l)) == null ? void 0 : b.children })
-  ] });
-};
-export {
-  f as Tabs
-};

package/dist/components/Ui/Tabs/Tabs.stories.js

@@ -1,67 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { Tabs as t } from "./Tabs.js";
-const n = {
-  title: "UIKit/Tabs",
-  component: t,
-  tags: ["autodocs"],
-  argTypes: {
-    items: {
-      control: "object",
-      description: "Массив объектов вкладок {label: string, content: ReactNode}"
-    }
-  }
-}, s = {
-  args: {
-    items: [
-      {
-        key: "profile",
-        label: "Профиль",
-        children: /* @__PURE__ */ e("div", { children: "Информация о пользователе" })
-      },
-      {
-        key: "settings",
-        label: "Настройки",
-        children: /* @__PURE__ */ e("div", { children: "Параметры аккаунта" })
-      },
-      {
-        key: "notifications",
-        label: "Уведомления",
-        children: /* @__PURE__ */ e("div", { children: "Настройки уведомлений" })
-      }
-    ]
-  }
-}, a = {
-  args: {
-    items: [
-      {
-        key: "favorites",
-        label: "Избранное",
-        children: /* @__PURE__ */ e("div", { children: "Ваши избранные элементы" })
-      },
-      {
-        key: "projects",
-        label: "Проекты",
-        children: /* @__PURE__ */ e("div", { children: "Список ваших проектов" })
-      }
-    ]
-  },
-  decorators: [
-    (i) => /* @__PURE__ */ e("div", { style: { maxWidth: "500px", margin: "0 auto" }, children: /* @__PURE__ */ e(i, {}) })
-  ]
-}, c = {
-  args: {
-    items: [
-      {
-        key: "single",
-        label: "Единственная вкладка",
-        children: /* @__PURE__ */ e("div", { children: "Контент единственной вкладки" })
-      }
-    ]
-  }
-};
-export {
-  s as Basic,
-  c as SingleTab,
-  a as StyledTabs,
-  n as default
-};

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

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

package/dist/components/Ui/TextInput/TextInput.js

@@ -1,85 +0,0 @@
-import { jsxs as m, jsx as e, Fragment as b } from "react/jsx-runtime";
-import { forwardRef as g, useState as A } from "react";
-import { IconX as F, IconCheck as R, IconSearch as T, IconLock as X, IconAt as q } from "../Icons/Icons.js";
-import { Loader as B } from "../Loader/Loader.js";
-import '../../../assets/TextInput.css';const D = g(
-  ({
-    label: t,
-    placeholder: h = "",
-    value: n,
-    // Значение из пропсов
-    type: f = "text",
-    name: I = "TextInput",
-    id: v,
-    isDisabled: x = !1,
-    iconType: c,
-    errorMessage: l = !1,
-    hasError: N = !1,
-    onChange: a,
-    // Обработчик из пропсов
-    className: p,
-    isClearable: r,
-    isLoading: i,
-    onFocus: k,
-    onKeyDown: z,
-    onBlur: $
-  }, w) => {
-    const [C, o] = A(""), s = n !== void 0, u = s ? n : C, j = (d) => {
-      const V = d.target.value;
-      s || o(V), a && a(d);
-    }, L = () => {
-      s && a ? a({ target: { value: "" } }) : o("");
-    }, S = () => {
-      switch (c) {
-        case "email":
-          return /* @__PURE__ */ e(q, { className: "icon", size: 20 });
-        case "password":
-          return /* @__PURE__ */ e(X, { className: "icon", size: 20 });
-        case "search":
-          return /* @__PURE__ */ e(T, { className: "icon", size: 20 });
-        case "checkmark":
-          return /* @__PURE__ */ e(R, { className: "icon", size: 20 });
-        default:
-          return /* @__PURE__ */ e(b, {});
-      }
-    };
-    return /* @__PURE__ */ m(
-      "div",
-      {
-        className: `text-input 
-        ${p} 
-        ${N && "invalid"}
-        ${r && "clearable"}`,
-        children: [
-          t && /* @__PURE__ */ e("label", { children: t }),
-          /* @__PURE__ */ m("div", { className: `input-container ${c ? `has-icon icon-${c}` : ""}`, children: [
-            /* @__PURE__ */ e(
-              "input",
-              {
-                onBlur: $,
-                type: f,
-                value: u,
-                onChange: j,
-                placeholder: h,
-                name: I,
-                id: v,
-                disabled: x,
-                ref: w,
-                onFocus: k,
-                onKeyDown: z
-              }
-            ),
-            S(),
-            r && u && !i && /* @__PURE__ */ e("div", { className: "clear-value", onClick: L, children: /* @__PURE__ */ e(F, { size: 20 }) }),
-            i && /* @__PURE__ */ e(B, {})
-          ] }),
-          l && /* @__PURE__ */ e("span", { className: "helper-text", children: l })
-        ]
-      }
-    );
-  }
-);
-D.displayName = "TextInput";
-export {
-  D as TextInput
-};