triafly-ui-kit 1.0.22 → 1.0.23

package/dist/components/Ui/DropdownInput/DropdownInput.js

@@ -1,91 +0,0 @@
-import { jsxs as c, jsx as n } from "react/jsx-runtime";
-import { useState as m, useRef as O, useEffect as g } from "react";
-import { IconCaretUpDown as E, IconWarningCircle as P } from "../Icons/Icons.js";
-import '../../../assets/DropdownInput.css';const j = ({
-  label: v,
-  options: i,
-  value: o,
-  onChange: f,
-  name: C = "DropdownInput",
-  placeholder: r,
-  errorMessage: d = !1,
-  isDisabled: h = !1,
-  className: k = ""
-}) => {
-  var w;
-  const [u, p] = m(!1), [s, N] = m(o || ""), [I, x] = m(!1), t = O(null);
-  g(() => {
-    const e = (l) => {
-      t.current && !t.current.contains(l.target) && p(!1);
-    };
-    return document.addEventListener("click", e), () => {
-      document.removeEventListener("click", e);
-    };
-  }, []), g(() => {
-    N(o || "");
-  }, [o]);
-  const b = (e) => {
-    N(e), p(!1), f && f(e);
-  }, $ = (e) => {
-    var l;
-    if (e.stopPropagation(), !u) {
-      const a = (l = t.current) == null ? void 0 : l.getBoundingClientRect(), D = window.innerHeight - ((a == null ? void 0 : a.bottom) || 0);
-      x(D < 304);
-    }
-    p((a) => !a);
-  };
-  return /* @__PURE__ */ c("div", { className: `dropdown-input ${k}`, ref: t, children: [
-    /* @__PURE__ */ c(
-      "select",
-      {
-        name: C,
-        value: s,
-        onChange: (e) => b(e.target.value),
-        className: "dropdown-input__native",
-        disabled: h,
-        children: [
-          /* @__PURE__ */ n("option", { value: "", disabled: !0, children: r }),
-          i.map((e) => /* @__PURE__ */ n("option", { value: e.value, children: e.label }, e.value))
-        ]
-      }
-    ),
-    v && /* @__PURE__ */ n("label", { children: v }),
-    /* @__PURE__ */ c(
-      "div",
-      {
-        className: `input-box 
-          ${u ? "opened" : ""} 
-          ${h ? "disabled" : ""} 
-          ${d ? "invalid" : ""}`,
-        onClick: $,
-        children: [
-          /* @__PURE__ */ n("span", { className: "input-value", children: s === void 0 ? (
-            // Если значение не передано
-            /* @__PURE__ */ n("span", { className: "placeholder", children: r })
-          ) : ((w = i.find((e) => e.value === s)) == null ? void 0 : w.label) || /* @__PURE__ */ n("span", { className: "placeholder", children: r }) }),
-          /* @__PURE__ */ n(E, { className: "caret" }),
-          u && /* @__PURE__ */ n("ul", { className: `options ${I ? "above" : ""}`, children: i.map((e) => /* @__PURE__ */ n(
-            "li",
-            {
-              onClick: (l) => {
-                l.stopPropagation(), b(e.value);
-              },
-              className: s === e.value ? "option--selected" : "",
-              children: e.label
-            },
-            e.value
-          )) })
-        ]
-      }
-    ),
-    d && /* @__PURE__ */ c("span", { className: "helper-text error", children: [
-      /* @__PURE__ */ n(P, { className: "icon", size: 12 }),
-      d
-    ] })
-  ] });
-};
-j.displayName = "DropdownInput";
-export {
-  j as DropdownInput,
-  j as default
-};

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

@@ -1,77 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import s from "react";
-import { DropdownInput as a } from "./DropdownInput.js";
-const h = {
-  title: "UIKit/DropdownInput",
-  component: a,
-  parameters: { layout: "centered" },
-  argTypes: {
-    label: { control: "text" },
-    name: { control: "text" },
-    options: { control: "object" },
-    placeholder: { control: "text" },
-    value: { control: "text" },
-    errorMessage: { control: "text" },
-    isDisabled: { control: "boolean" }
-  }
-}, e = (l) => {
-  const [o, t] = s.useState(l.value || "");
-  return /* @__PURE__ */ r(a, { ...l, value: o, onChange: (n) => {
-    t(n);
-  } });
-}, d = e.bind({});
-d.args = {
-  label: "Выберите опцию",
-  name: "dropdown",
-  options: [
-    { value: "1", label: "Опция 1" },
-    { value: "2", label: "Опция 2" },
-    { value: "3", label: "Опция 3" }
-  ],
-  placeholder: "Выберите..."
-};
-const c = e.bind({});
-c.args = {
-  label: "Выберите опцию",
-  name: "dropdown",
-  options: [
-    { value: "1", label: "Опция 1" },
-    { value: "2", label: "Опция 2" },
-    { value: "3", label: "Опция 3" }
-  ],
-  placeholder: "Выберите...",
-  value: "2"
-  // Предустановленное значение
-};
-const u = e.bind({});
-u.args = {
-  label: "Выберите опцию",
-  name: "dropdown",
-  options: [
-    { value: "1", label: "Опция 1" },
-    { value: "2", label: "Опция 2" },
-    { value: "3", label: "Опция 3" }
-  ],
-  placeholder: "Выберите...",
-  isDisabled: !0
-  // Отключаем селект
-};
-const b = e.bind({});
-b.args = {
-  label: "Выберите опцию",
-  name: "dropdown",
-  options: [
-    { value: "1", label: "Опция 1" },
-    { value: "2", label: "Опция 2" },
-    { value: "3", label: "Опция 3" }
-  ],
-  placeholder: "Выберите...",
-  errorMessage: "Пожалуйста, выберите опцию."
-};
-export {
-  d as Default,
-  u as Disabled,
-  b as WithErrorMessage,
-  c as WithSelectedValue,
-  h as default
-};

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

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

package/dist/components/Ui/DropdownMenu/DropdownMenu.js

@@ -1,83 +0,0 @@
-import { jsxs as R, jsx as h } from "react/jsx-runtime";
-import { useState as a, useRef as b, useLayoutEffect as C } from "react";
-import '../../../assets/DropdownMenu.css';const O = ({
-  content: m,
-  horizontalPosition: s = "right",
-  verticalPosition: c = "bottom",
-  iconTrigger: N
-}) => {
-  const [d, o] = a(!1), [j, n] = a(s), [H, l] = a(c), f = b(null), u = b(null);
-  C(() => {
-    if (d && f.current && u.current) {
-      const e = u.current.getBoundingClientRect(), t = f.current.getBoundingClientRect(), r = window.innerHeight, i = window.innerWidth;
-      if (c === "bottom" && e.bottom + t.height > r ? l("top") : c === "top" && e.top - t.height < 0 ? l("bottom") : l(c), s === "left" && e.left + t.width > i)
-        n("right");
-      else if (s === "right" && e.right - t.width < 0)
-        n("left");
-      else if (s === "center") {
-        const g = e.left + e.width / 2 - t.width / 2;
-        g < 0 ? n("left") : g + t.width > i ? n("right") : n("center");
-      } else
-        n(s);
-    }
-  }, [d, s, c]), C(() => {
-    const e = (t) => {
-      f.current && !f.current.contains(t.target) && u.current && !u.current.contains(t.target) && o(!1);
-    };
-    return d && document.addEventListener("click", e), () => {
-      document.removeEventListener("click", e);
-    };
-  }, [d]);
-  const k = () => {
-    var e, t;
-    if (!d) {
-      const r = (e = u.current) == null ? void 0 : e.getBoundingClientRect(), i = (t = f.current) == null ? void 0 : t.getBoundingClientRect();
-      if (r && i) {
-        const g = window.innerHeight, w = window.innerWidth;
-        if (c === "bottom" && r.bottom + i.height > g ? l("top") : c === "top" && r.top - i.height < 0 ? l("bottom") : l(c), s === "left" && r.left + i.width > w)
-          n("right");
-        else if (s === "right" && r.right - i.width < 0)
-          n("left");
-        else if (s === "center") {
-          const p = r.left + r.width / 2 - i.width / 2;
-          p < 0 ? n("left") : p + i.width > w ? n("right") : n("center");
-        } else
-          n(s);
-      }
-    }
-    o(!d);
-  }, x = (e) => {
-    e && e(), o(!1);
-  };
-  return /* @__PURE__ */ R("div", { className: `dropdowm-menu ${d ? "open" : ""}`, children: [
-    /* @__PURE__ */ h("div", { className: "menu-trigger", onClick: k, ref: u, children: N || /* @__PURE__ */ h("div", { className: "dots" }) }),
-    /* @__PURE__ */ h("div", { className: "fader" }),
-    /* @__PURE__ */ h(
-      "ul",
-      {
-        className: "menu-list",
-        "data-x-fit": j,
-        "data-y-fit": H,
-        ref: f,
-        children: m == null ? void 0 : m.map(({ icon: e, isDanger: t, title: r, onClick: i }, g) => /* @__PURE__ */ R(
-          "li",
-          {
-            onClick: () => {
-              i && x(i);
-            },
-            className: `menu-item ${t ? "danger" : ""}`,
-            children: [
-              e,
-              /* @__PURE__ */ h("span", { className: "label", children: r })
-            ]
-          },
-          g
-        ))
-      }
-    )
-  ] });
-};
-export {
-  O as DropdownMenu,
-  O as default
-};

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

@@ -1,50 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { IconEye as t, IconRoleX as n, IconTrash as i } from "../Icons/Icons.js";
-import { DropdownMenu as e } from "./DropdownMenu.js";
-const l = {
-  title: "UIKit/DropdownMenu",
-  component: e,
-  tags: ["autodocs"],
-  // Автоматическая генерация документации
-  argTypes: {
-    content: {
-      control: "object",
-      // Позволяет редактировать content в интерфейсе Storybook
-      description: "Массив элементов меню"
-    },
-    horizontalPosition: {
-      control: "select",
-      options: ["left", "center", "right"],
-      description: "Позиционирование меню относительно триггера"
-    },
-    verticalPosition: {
-      control: "select",
-      options: ["top", "bottom"],
-      description: "Позиционирование меню относительно триггера"
-    }
-  }
-}, a = {
-  args: {
-    content: [
-      {
-        icon: /* @__PURE__ */ o(t, {}),
-        title: "Просмотр"
-      },
-      {
-        icon: /* @__PURE__ */ o(n, {}),
-        title: "Назначить другую роль"
-      },
-      {
-        icon: /* @__PURE__ */ o(i, {}),
-        title: "Удалить",
-        isDanger: !0
-      }
-    ],
-    horizontalPosition: "left",
-    verticalPosition: "bottom"
-  }
-};
-export {
-  a as Default,
-  l as default
-};

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

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