@layers-app/shared 0.1.5 → 0.2.0

package/dist/components/CommentFilterMenu/index.js

@@ -0,0 +1,92 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { useTranslation as I } from "react-i18next";
+import { UserAvatar as g } from "../UserAvatar/index.js";
+import { Menu as r, ActionIcon as k, Text as v } from "@mantine/core";
+import { IconCheck as x } from "@tabler/icons-react";
+import S from "../CommentsPanel/components/Icon.js";
+import { useCommentsStore as l } from "../CommentsPanel/store.js";
+import { toggleFilter as y } from "../CommentsPanel/utils.js";
+const j = ({
+  commentsFilter: a,
+  setCommentsFilter: c,
+  disabled: d = !1,
+  onCollapse: i,
+  listRef: m
+}) => {
+  const n = l((e) => e.workspaceMembers), { i18n: f } = I("comments"), h = l((e) => e.commentsLocales), p = f.language === "ru" ? 245 : 216;
+  return /* @__PURE__ */ s(
+    r,
+    {
+      position: "bottom-start",
+      closeOnItemClick: !1,
+      shadow: "md",
+      withArrow: !0,
+      width: p,
+      children: [
+        /* @__PURE__ */ t(r.Target, { children: /* @__PURE__ */ t(
+          k,
+          {
+            color: "light-dark(black, white)",
+            size: "md",
+            disabled: d,
+            "aria-label": "Filter",
+            variant: "transparent",
+            children: /* @__PURE__ */ t(S, { size: 20, name: "filter" })
+          }
+        ) }),
+        /* @__PURE__ */ s(r.Dropdown, { children: [
+          /* @__PURE__ */ t(r.Label, { children: h.filter?.byPerson }),
+          n && n.map((e) => {
+            const u = a.filteredUsers.some(
+              (o) => o.userId === e.userId
+            ), w = {
+              id: e.userId,
+              avatar: e.avatarUrl,
+              name: e.name
+            };
+            return /* @__PURE__ */ t(
+              r.Item,
+              {
+                onClick: () => {
+                  i && i?.((o) => o === null ? "open" : o), y(
+                    c,
+                    "filteredUsers",
+                    e,
+                    m
+                  );
+                },
+                leftSection: /* @__PURE__ */ t(g, { user: w }),
+                rightSection: u ? /* @__PURE__ */ t(x, { size: 14 }) : null,
+                style: {
+                  fontSize: 12,
+                  display: "flex",
+                  alignItems: "center",
+                  overflow: "hidden"
+                },
+                children: /* @__PURE__ */ t(
+                  v,
+                  {
+                    truncate: !0,
+                    size: "sm",
+                    style: {
+                      maxWidth: 110,
+                      overflow: "hidden",
+                      textOverflow: "ellipsis",
+                      whiteSpace: "nowrap",
+                      display: "block"
+                    },
+                    children: e.name
+                  }
+                )
+              },
+              e.userId
+            );
+          })
+        ] })
+      ]
+    }
+  );
+};
+export {
+  j as CommentFilterMenu
+};

package/dist/components/CommentsPanel/CommentsPanel.module.css.js

@@ -0,0 +1,109 @@
+const n = "_commentPluginCommentsPanelSidebar_j6pyq_13", e = "_commentPluginThreadWrapper_j6pyq_33", m = "_commentsBodyWrapper_j6pyq_37", t = "_commentsPanelBody_j6pyq_41", o = "_commentPluginImagePreviewList_j6pyq_47", i = "_commentPluginCommentsPanelList_j6pyq_51", l = "_commentPluginImagePreviewItem_j6pyq_55", c = "_commentPluginCommentsPanelEmpty_j6pyq_61", P = "_commentPluginGeneralCommentWrapper_j6pyq_65", a = "_commentPluginCommentsPanel_j6pyq_13", s = "_commentPluginCommentsPanelListThreadEditor_j6pyq_87", r = "_commentPluginImagePreviewContainer_j6pyq_95", _ = "_commentPluginImagePreviewImage_j6pyq_99", u = "_commentPluginInputFooterContainer_j6pyq_110", g = "_edited_j6pyq_180", C = "_commentPluginEditorContainer_j6pyq_186", p = "_commentPluginCommentsPanelListDetails_j6pyq_194", d = "_commentPluginCommentsPanelListCommentAuthor_j6pyq_200", y = "_commentPluginCommentsPanelListCommentTime_j6pyq_204", j = "_commentPluginCommentsPanelListThread_j6pyq_87", q = "_commentPluginCommentsPanelListThreadComments_j6pyq_214", h = "_commentPluginThreadContainer_j6pyq_218", I = "_commentPluginShowMoreBtn_j6pyq_222", T = "_commentPluginCommentsPanelListThreadQuoteBox_j6pyq_250", L = "_commentPluginCommentsPanelListThreadQuote_j6pyq_250", v = "_commentPluginCommentsPanelListThreadQuoteText_j6pyq_268", w = "_commentPluginCommentsPanelReactionsContainer_j6pyq_297", F = "_commentPluginCommentsPanelListContentContainer_j6pyq_310", E = "_commentPluginFilePreviewList_j6pyq_355", B = "_commentPluginFilePreviewItem_j6pyq_355", A = "_threadActionIcon_j6pyq_420", W = "_commentPluginCommentsPanelActionContainer_j6pyq_426", S = "_commentEmojiPopupIcon_j6pyq_487", Q = "_commentPluginCommentsPanelListThreadAccepted_j6pyq_498", R = "_commentsHeaderTitle_j6pyq_505", x = "_commentsHeaderWrapper_j6pyq_531", b = "_commentPluginThreadEditorControls_j6pyq_613", H = "_commentSubmitButton_j6pyq_618", f = "_threadEditorControlsUpload_j6pyq_623", z = "_threadEditorControlsFileInput_j6pyq_631", D = "_threadEditorControlsActionIcon_j6pyq_645", G = "_commentPluginCommentThreadResponses_j6pyq_655", M = "_guest_j6pyq_674", N = "_commentPluginImagePreviewWrapper_j6pyq_729", U = "_commentPluginImagePreviewRemoveButton_j6pyq_753", k = "_commentPluginFilePreviewContainer_j6pyq_776", J = "_commentPluginFileCard_j6pyq_587", K = "_commentPluginFileCardIcon_j6pyq_840", O = "_commentPluginFileCardInfo_j6pyq_848", V = "_commentPluginFileCardName_j6pyq_856", X = "_commentPluginFileCardSize_j6pyq_865", Y = "_commentPluginCommentsPanelEmptyTitle_j6pyq_1074", Z = {
+  commentPluginCommentsPanelSidebar: n,
+  commentPluginThreadWrapper: e,
+  commentsBodyWrapper: m,
+  commentsPanelBody: t,
+  commentPluginImagePreviewList: o,
+  commentPluginCommentsPanelList: i,
+  commentPluginImagePreviewItem: l,
+  commentPluginCommentsPanelEmpty: c,
+  commentPluginGeneralCommentWrapper: P,
+  commentPluginCommentsPanel: a,
+  commentPluginCommentsPanelListThreadEditor: s,
+  commentPluginImagePreviewContainer: r,
+  commentPluginImagePreviewImage: _,
+  commentPluginInputFooterContainer: u,
+  edited: g,
+  commentPluginEditorContainer: C,
+  commentPluginCommentsPanelListDetails: p,
+  commentPluginCommentsPanelListCommentAuthor: d,
+  commentPluginCommentsPanelListCommentTime: y,
+  commentPluginCommentsPanelListThread: j,
+  commentPluginCommentsPanelListThreadComments: q,
+  commentPluginThreadContainer: h,
+  commentPluginShowMoreBtn: I,
+  commentPluginCommentsPanelListThreadQuoteBox: T,
+  commentPluginCommentsPanelListThreadQuote: L,
+  commentPluginCommentsPanelListThreadQuoteText: v,
+  commentPluginCommentsPanelReactionsContainer: w,
+  commentPluginCommentsPanelListContentContainer: F,
+  commentPluginFilePreviewList: E,
+  commentPluginFilePreviewItem: B,
+  threadActionIcon: A,
+  commentPluginCommentsPanelActionContainer: W,
+  commentEmojiPopupIcon: S,
+  commentPluginCommentsPanelListThreadAccepted: Q,
+  commentsHeaderTitle: R,
+  commentsHeaderWrapper: x,
+  commentPluginThreadEditorControls: b,
+  commentSubmitButton: H,
+  threadEditorControlsUpload: f,
+  threadEditorControlsFileInput: z,
+  threadEditorControlsActionIcon: D,
+  commentPluginCommentThreadResponses: G,
+  guest: M,
+  commentPluginImagePreviewWrapper: N,
+  commentPluginImagePreviewRemoveButton: U,
+  commentPluginFilePreviewContainer: k,
+  commentPluginFileCard: J,
+  commentPluginFileCardIcon: K,
+  commentPluginFileCardInfo: O,
+  commentPluginFileCardName: V,
+  commentPluginFileCardSize: X,
+  commentPluginCommentsPanelEmptyTitle: Y
+};
+export {
+  S as commentEmojiPopupIcon,
+  G as commentPluginCommentThreadResponses,
+  a as commentPluginCommentsPanel,
+  W as commentPluginCommentsPanelActionContainer,
+  c as commentPluginCommentsPanelEmpty,
+  Y as commentPluginCommentsPanelEmptyTitle,
+  i as commentPluginCommentsPanelList,
+  d as commentPluginCommentsPanelListCommentAuthor,
+  y as commentPluginCommentsPanelListCommentTime,
+  F as commentPluginCommentsPanelListContentContainer,
+  p as commentPluginCommentsPanelListDetails,
+  j as commentPluginCommentsPanelListThread,
+  Q as commentPluginCommentsPanelListThreadAccepted,
+  q as commentPluginCommentsPanelListThreadComments,
+  s as commentPluginCommentsPanelListThreadEditor,
+  L as commentPluginCommentsPanelListThreadQuote,
+  T as commentPluginCommentsPanelListThreadQuoteBox,
+  v as commentPluginCommentsPanelListThreadQuoteText,
+  w as commentPluginCommentsPanelReactionsContainer,
+  n as commentPluginCommentsPanelSidebar,
+  C as commentPluginEditorContainer,
+  J as commentPluginFileCard,
+  K as commentPluginFileCardIcon,
+  O as commentPluginFileCardInfo,
+  V as commentPluginFileCardName,
+  X as commentPluginFileCardSize,
+  k as commentPluginFilePreviewContainer,
+  B as commentPluginFilePreviewItem,
+  E as commentPluginFilePreviewList,
+  P as commentPluginGeneralCommentWrapper,
+  r as commentPluginImagePreviewContainer,
+  _ as commentPluginImagePreviewImage,
+  l as commentPluginImagePreviewItem,
+  o as commentPluginImagePreviewList,
+  U as commentPluginImagePreviewRemoveButton,
+  N as commentPluginImagePreviewWrapper,
+  u as commentPluginInputFooterContainer,
+  I as commentPluginShowMoreBtn,
+  h as commentPluginThreadContainer,
+  b as commentPluginThreadEditorControls,
+  e as commentPluginThreadWrapper,
+  H as commentSubmitButton,
+  m as commentsBodyWrapper,
+  R as commentsHeaderTitle,
+  x as commentsHeaderWrapper,
+  t as commentsPanelBody,
+  Z as default,
+  g as edited,
+  M as guest,
+  A as threadActionIcon,
+  D as threadEditorControlsActionIcon,
+  z as threadEditorControlsFileInput,
+  f as threadEditorControlsUpload
+};

package/dist/components/CommentsPanel/components/CommentActionMenu.js

@@ -0,0 +1,49 @@
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { Menu as e, ActionIcon as a } from "@mantine/core";
+import { IconDotsVertical as u, IconDownload as h, IconTrash as p } from "@tabler/icons-react";
+import { useCommentsStore as f } from "../store.js";
+const g = ({
+  onDownload: n,
+  onDelete: i,
+  iconColor: c = "light-dark(black, #E0E0E0)",
+  hasPermission: l,
+  locales: s
+}) => {
+  const d = f((m) => m.commentsLocales), t = s ?? d;
+  return /* @__PURE__ */ r(e, { radius: "md", width: 190, position: "bottom-end", withArrow: !0, children: [
+    /* @__PURE__ */ o(e.Target, { children: /* @__PURE__ */ o(
+      a,
+      {
+        size: 24,
+        variant: "subtle",
+        color: c,
+        radius: 6,
+        children: /* @__PURE__ */ o(u, {})
+      }
+    ) }),
+    /* @__PURE__ */ r(e.Dropdown, { children: [
+      /* @__PURE__ */ o(
+        e.Item,
+        {
+          "data-ignore-blur": "true",
+          leftSection: /* @__PURE__ */ o(h, { size: 16 }),
+          onClick: n,
+          children: t.menuActions.download
+        }
+      ),
+      l && /* @__PURE__ */ o(
+        e.Item,
+        {
+          "data-ignore-blur": "true",
+          leftSection: /* @__PURE__ */ o(p, { size: 16 }),
+          color: "red",
+          onClick: i,
+          children: t.menuActions.delete
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  g as CommentActionMenu
+};

package/dist/components/CommentsPanel/components/CommentActions.js

@@ -0,0 +1,151 @@
+import { jsx as t, jsxs as C, Fragment as b } from "react/jsx-runtime";
+import { useState as T } from "react";
+import { EmojiPicker as E } from "../../EmojiPicker/EmojiPicker.js";
+import { ProjectIcon as L } from "../../ProjectIcon/ProjectIcon.js";
+import { Tooltip as s, ActionIcon as i } from "@mantine/core";
+import { IconFile as R } from "@tabler/icons-react";
+import { CommentsListItemMenu as $ } from "./CommentsListItemMenu.js";
+import l from "./Icon.js";
+import e from "../CommentsPanel.module.css.js";
+import { useCommentsStore as v } from "../store.js";
+import { useOutsideClick as j } from "../../../hooks/useOutsideClick.js";
+const w = {
+  transition: "fade",
+  duration: 300
+}, B = [
+  "e=%F0%9F%91%8D",
+  "e=%F0%9F%91%8E",
+  "e=%E2%9C%8D%EF%B8%8F",
+  "e=%F0%9F%98%80",
+  "e=%F0%9F%94%A5"
+], V = ({
+  accepted: a,
+  showEmojiPicker: c,
+  setShowEmojiPicker: m,
+  resolveThreat: F,
+  commentOrThread: r,
+  commentSelected: d,
+  handleBlur: I,
+  hasPermission: p,
+  toggleRepliesInput: g,
+  deleteCommentOrThread: k,
+  handleEditClick: A,
+  handleReactionClick: f
+}) => {
+  const [z, N] = T(null), n = v((o) => o.commentsLocales), P = v((o) => o.adminPermission), u = new Set(r.reactions.map((o) => o.reaction)).size > 4, y = j((o) => {
+    o.target.closest(".mantine-Popover-dropdown") || m(!1);
+  }), x = (o) => {
+    o.startsWith("c=") && !o.includes("&") ? N(o) : (f(o), m(!1));
+  };
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      className: e.commentPluginCommentsPanelActionContainer,
+      style: { ...c && { opacity: 1 } },
+      ref: c ? y : null,
+      children: c ? /* @__PURE__ */ C(b, { children: [
+        B.map((o, h) => /* @__PURE__ */ t(
+          i,
+          {
+            color: "black",
+            size: 16,
+            className: e.threadActionIcon,
+            variant: "transparent",
+            onClick: () => f(o),
+            children: /* @__PURE__ */ t(L, { icon: o, fallback: /* @__PURE__ */ t(R, { size: "1em" }) })
+          },
+          h
+        )),
+        /* @__PURE__ */ t(
+          E,
+          {
+            onChange: x,
+            showIcons: !0,
+            value: z,
+            position: "left-start",
+            showColors: !0,
+            withinPortal: !0,
+            popoverProps: {
+              transitionProps: w
+            },
+            showRemoveButton: !1,
+            children: /* @__PURE__ */ t(s, { label: n.actionTooltips.addReaction, children: /* @__PURE__ */ t(
+              i,
+              {
+                color: "black",
+                size: 20,
+                className: e.commentEmojiPopupIcon,
+                variant: "transparent",
+                children: /* @__PURE__ */ t(l, { name: "emoji" })
+              }
+            ) })
+          }
+        )
+      ] }) : /* @__PURE__ */ C(b, { children: [
+        p && /* @__PURE__ */ t(
+          s,
+          {
+            label: a ? n.actionTooltips.reopen : n.actionTooltips.resolve,
+            children: /* @__PURE__ */ t(
+              i,
+              {
+                color: "black",
+                size: 16,
+                className: `${e.threadActionIcon} resolve`,
+                variant: "transparent",
+                onClick: (o) => {
+                  d && o.stopPropagation(), I(o), F(r);
+                },
+                children: /* @__PURE__ */ t(l, { name: `${a ? "reOpen" : "check-mark"}` })
+              }
+            )
+          },
+          a.toString()
+        ),
+        /* @__PURE__ */ t(
+          s,
+          {
+            label: u ? n.actionTooltips.reactionLimit : n.actionTooltips.addReaction,
+            children: /* @__PURE__ */ t(
+              i,
+              {
+                color: "black",
+                disabled: u,
+                size: 16,
+                className: e.threadActionIcon,
+                variant: "transparent",
+                onClick: () => m(!0),
+                children: /* @__PURE__ */ t(l, { name: "emoji" })
+              }
+            )
+          }
+        ),
+        !a && /* @__PURE__ */ t(s, { label: n.actionTooltips.reply, children: /* @__PURE__ */ t(
+          i,
+          {
+            color: "black",
+            size: "xs",
+            className: `${e.threadActionIcon} reply`,
+            variant: "transparent",
+            onClick: (o) => {
+              d && o.stopPropagation(), g(r.id, o);
+            },
+            children: /* @__PURE__ */ t(l, { name: "messages" })
+          }
+        ) }),
+        (P || p) && /* @__PURE__ */ t(
+          $,
+          {
+            hasPermission: p,
+            commentOrThread: r,
+            deleteCommentOrThread: k,
+            handleEditClick: A
+          }
+        )
+      ] })
+    }
+  );
+};
+export {
+  V as CommentActions
+};

package/dist/components/CommentsPanel/components/CommentPanelListItem.d.ts

@@ -1,6 +1,7 @@
-import { NodeKey, RangeSelection } from '@layers-app/editor';
 import { Comment, CommentsNs, GeneralComment, ICommentFile, SharedCommentProps, Thread, UpdateCommentTextArgs } from '../types.ts';
 import * as React from 'react';
+type NodeKey = string;
+type RangeSelection = any;
 interface ICommentPanelListItemProps extends SharedCommentProps {
     deleteCommentImage: (photoToRemove: string, threadOrGeneralId: string, commentId?: string) => void;
     addCommentReaction: (reaction: string, comment: Thread | GeneralComment | Comment, threatOrGeneral?: Thread | GeneralComment) => void;