@collabdt/core 0.0.40

package/dist/core/components/ui/Command.js

@@ -0,0 +1,160 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Command as CommandPrimitive } from "cmdk";
+import { Search } from "lucide-react";
+import { cn } from "../../utils/utils";
+import { Dialog, DialogContent } from "./Dialog";
+const Command = React.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive,
+    __spreadValues({
+      ref,
+      className: cn(
+        "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
+        className
+      )
+    }, props)
+  );
+});
+Command.displayName = CommandPrimitive.displayName;
+const CommandDialog = (_c) => {
+  var _d = _c, { children } = _d, props = __objRest(_d, ["children"]);
+  return /* @__PURE__ */ jsx(Dialog, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(DialogContent, { className: "overflow-hidden p-0", children: /* @__PURE__ */ jsx(Command, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children }) }) }));
+};
+const CommandInput = React.forwardRef((_e, ref) => {
+  var _f = _e, { className } = _f, props = __objRest(_f, ["className"]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+    /* @__PURE__ */ jsx(Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+    /* @__PURE__ */ jsx(
+      CommandPrimitive.Input,
+      __spreadValues({
+        ref,
+        className: cn(
+          "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        )
+      }, props)
+    )
+  ] });
+});
+CommandInput.displayName = CommandPrimitive.Input.displayName;
+const CommandList = React.forwardRef((_g, ref) => {
+  var _h = _g, { className } = _h, props = __objRest(_h, ["className"]);
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.List,
+    __spreadValues({
+      ref,
+      className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)
+    }, props)
+  );
+});
+CommandList.displayName = CommandPrimitive.List.displayName;
+const CommandEmpty = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
+  CommandPrimitive.Empty,
+  __spreadValues({
+    ref,
+    className: "py-6 text-center text-sm"
+  }, props)
+));
+CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
+const CommandGroup = React.forwardRef((_i, ref) => {
+  var _j = _i, { className } = _j, props = __objRest(_j, ["className"]);
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.Group,
+    __spreadValues({
+      ref,
+      className: cn(
+        "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
+        className
+      )
+    }, props)
+  );
+});
+CommandGroup.displayName = CommandPrimitive.Group.displayName;
+const CommandSeparator = React.forwardRef((_k, ref) => {
+  var _l = _k, { className } = _l, props = __objRest(_l, ["className"]);
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.Separator,
+    __spreadValues({
+      ref,
+      className: cn("-mx-1 h-px bg-border", className)
+    }, props)
+  );
+});
+CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
+const CommandItem = React.forwardRef((_m, ref) => {
+  var _n = _m, { className } = _n, props = __objRest(_n, ["className"]);
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.Item,
+    __spreadValues({
+      ref,
+      className: cn(
+        "relative flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+        className
+      )
+    }, props)
+  );
+});
+CommandItem.displayName = CommandPrimitive.Item.displayName;
+const CommandShortcut = (_o) => {
+  var _p = _o, {
+    className
+  } = _p, props = __objRest(_p, [
+    "className"
+  ]);
+  return /* @__PURE__ */ jsx(
+    "span",
+    __spreadValues({
+      className: cn(
+        "ml-auto text-xs tracking-widest text-muted-foreground",
+        className
+      )
+    }, props)
+  );
+};
+CommandShortcut.displayName = "CommandShortcut";
+export {
+  Command,
+  CommandDialog,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  CommandSeparator,
+  CommandShortcut
+};
+//# sourceMappingURL=Command.js.map

package/dist/core/components/ui/Command.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/core/components/ui/Command.tsx"],"sourcesContent":["'use client'\r\n\r\nimport * as React from 'react'\r\nimport { type DialogProps } from '@radix-ui/react-dialog'\r\nimport { Command as CommandPrimitive } from 'cmdk'\r\nimport { Search } from 'lucide-react'\r\n\r\nimport { cn } from '../../utils/utils'\r\nimport { Dialog, DialogContent } from './Dialog'\r\n\r\nconst Command = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\r\n>(({ className, ...props }, ref) => (\r\n  <CommandPrimitive\r\n    ref={ref}\r\n    className={cn(\r\n      'flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground',\r\n      className,\r\n    )}\r\n    {...props}\r\n  />\r\n))\r\nCommand.displayName = CommandPrimitive.displayName\r\n\r\nconst CommandDialog = ({ children, ...props }: DialogProps) => {\r\n  return (\r\n    <Dialog {...props}>\r\n      <DialogContent className=\"overflow-hidden p-0\">\r\n        <Command className=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\r\n          {children}\r\n        </Command>\r\n      </DialogContent>\r\n    </Dialog>\r\n  )\r\n}\r\n\r\nconst CommandInput = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.Input>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\r\n>(({ className, ...props }, ref) => (\r\n  <div className=\"flex items-center border-b px-3\" cmdk-input-wrapper=\"\">\r\n    <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\r\n    <CommandPrimitive.Input\r\n      ref={ref}\r\n      className={cn(\r\n        'flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  </div>\r\n))\r\n\r\nCommandInput.displayName = CommandPrimitive.Input.displayName\r\n\r\nconst CommandList = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.List>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\r\n>(({ className, ...props }, ref) => (\r\n  <CommandPrimitive.List\r\n    ref={ref}\r\n    className={cn('max-h-[300px] overflow-y-auto overflow-x-hidden', className)}\r\n    {...props}\r\n  />\r\n))\r\n\r\nCommandList.displayName = CommandPrimitive.List.displayName\r\n\r\nconst CommandEmpty = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.Empty>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\r\n>((props, ref) => (\r\n  <CommandPrimitive.Empty\r\n    ref={ref}\r\n    className=\"py-6 text-center text-sm\"\r\n    {...props}\r\n  />\r\n))\r\n\r\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName\r\n\r\nconst CommandGroup = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.Group>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\r\n>(({ className, ...props }, ref) => (\r\n  <CommandPrimitive.Group\r\n    ref={ref}\r\n    className={cn(\r\n      'overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground',\r\n      className,\r\n    )}\r\n    {...props}\r\n  />\r\n))\r\n\r\nCommandGroup.displayName = CommandPrimitive.Group.displayName\r\n\r\nconst CommandSeparator = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.Separator>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\r\n>(({ className, ...props }, ref) => (\r\n  <CommandPrimitive.Separator\r\n    ref={ref}\r\n    className={cn('-mx-1 h-px bg-border', className)}\r\n    {...props}\r\n  />\r\n))\r\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName\r\n\r\nconst CommandItem = React.forwardRef<\r\n  React.ElementRef<typeof CommandPrimitive.Item>,\r\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\r\n>(({ className, ...props }, ref) => (\r\n  <CommandPrimitive.Item\r\n    ref={ref}\r\n    className={cn(\r\n      'relative flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',\r\n      className,\r\n    )}\r\n    {...props}\r\n  />\r\n))\r\n\r\nCommandItem.displayName = CommandPrimitive.Item.displayName\r\n\r\nconst CommandShortcut = ({\r\n  className,\r\n  ...props\r\n}: React.HTMLAttributes<HTMLSpanElement>) => {\r\n  return (\r\n    <span\r\n      className={cn(\r\n        'ml-auto text-xs tracking-widest text-muted-foreground',\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  )\r\n}\r\nCommandShortcut.displayName = 'CommandShortcut'\r\n\r\nexport {\r\n  Command,\r\n  CommandDialog,\r\n  CommandInput,\r\n  CommandList,\r\n  CommandEmpty,\r\n  CommandGroup,\r\n  CommandItem,\r\n  CommandShortcut,\r\n  CommandSeparator,\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcE,cA2BA,YA3BA;AAZF,YAAY,WAAW;AAEvB,SAAS,WAAW,wBAAwB;AAC5C,SAAS,cAAc;AAEvB,SAAS,UAAU;AACnB,SAAS,QAAQ,qBAAqB;AAEtC,MAAM,UAAU,MAAM,WAGpB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAbL,IAaG,IAAgB,kBAAhB,IAAgB,CAAd;AACH;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAAA,CACD;AACD,QAAQ,cAAc,iBAAiB;AAEvC,MAAM,gBAAgB,CAAC,OAAwC;AAAxC,eAAE,WAzBzB,IAyBuB,IAAe,kBAAf,IAAe,CAAb;AACvB,SACE,oBAAC,yCAAW,QAAX,EACC,8BAAC,iBAAc,WAAU,uBACvB,8BAAC,WAAQ,WAAU,+WAChB,UACH,GACF,IACF;AAEJ;AAEA,MAAM,eAAe,MAAM,WAGzB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAxCL,IAwCG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,8BAAC,SAAI,WAAU,mCAAkC,sBAAmB,IAClE;AAAA,wBAAC,UAAO,WAAU,oCAAmC;AAAA,IACrD;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,KACF;AAAA,CACD;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,MAAM,cAAc,MAAM,WAGxB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YA3DL,IA2DG,IAAgB,kBAAhB,IAAgB,CAAd;AACH;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACC;AAAA,MACA,WAAW,GAAG,mDAAmD,SAAS;AAAA,OACtE;AAAA,EACN;AAAA,CACD;AAED,YAAY,cAAc,iBAAiB,KAAK;AAEhD,MAAM,eAAe,MAAM,WAGzB,CAAC,OAAO,QACR;AAAA,EAAC,iBAAiB;AAAA,EAAjB;AAAA,IACC;AAAA,IACA,WAAU;AAAA,KACN;AACN,CACD;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,MAAM,eAAe,MAAM,WAGzB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YArFL,IAqFG,IAAgB,kBAAhB,IAAgB,CAAd;AACH;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAAA,CACD;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,MAAM,mBAAmB,MAAM,WAG7B,CAAC,IAAyB,QAAK;AAA9B,eAAE,YArGL,IAqGG,IAAgB,kBAAhB,IAAgB,CAAd;AACH;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACC;AAAA,MACA,WAAW,GAAG,wBAAwB,SAAS;AAAA,OAC3C;AAAA,EACN;AAAA,CACD;AACD,iBAAiB,cAAc,iBAAiB,UAAU;AAE1D,MAAM,cAAc,MAAM,WAGxB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAjHL,IAiHG,IAAgB,kBAAhB,IAAgB,CAAd;AACH;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAAA,CACD;AAED,YAAY,cAAc,iBAAiB,KAAK;AAEhD,MAAM,kBAAkB,CAAC,OAGoB;AAHpB,eACvB;AAAA;AAAA,EA/HF,IA8HyB,IAEpB,kBAFoB,IAEpB;AAAA,IADH;AAAA;AAGA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI;AAAA,EACN;AAEJ;AACA,gBAAgB,cAAc;","names":[]}

package/dist/core/components/ui/Comments/CollapsibleCommentItem.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { Comment } from '../../../types/dbTypes';
+type CommentAction = 'view' | 'edit' | 'delete' | 'reply';
+interface CollapsibleCommentItemProps {
+    comment: Comment;
+    onAction?: (action: CommentAction, id: number) => void;
+    replies?: Comment[];
+    onReply?: (id: number, replyText: string | number) => void;
+    onFileUpload?: (id: number, files: FileList) => void;
+    attachments?: Array<{
+        name: string;
+        url: string;
+        size: number;
+    }>;
+    depth?: number;
+    isVisible?: boolean;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+}
+export declare function CollapsibleCommentItem({ comment, onAction, replies, onReply, onFileUpload, attachments, depth, isVisible, onMouseEnter, onMouseLeave }: CollapsibleCommentItemProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=CollapsibleCommentItem.d.ts.map

package/dist/core/components/ui/Comments/CollapsibleCommentItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapsibleCommentItem.d.ts","sourceRoot":"","sources":["../../../../../src/core/components/ui/Comments/CollapsibleCommentItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAc9B,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAIhD,KAAK,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEzD,UAAU,2BAA2B;IACnC,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACtD,OAAO,CAAC,EAAE,OAAO,EAAE,CAAA;IACnB,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAA;IAC1D,YAAY,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAA;IACpD,WAAW,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAChE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;CAC1B;AAED,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,QAAQ,EACR,OAAY,EACZ,OAAO,EACP,YAAY,EACZ,WAAgB,EAChB,KAAS,EACT,SAAgB,EAChB,YAAY,EACZ,YAAY,EACb,EAAE,2BAA2B,qBA4N7B"}

package/dist/core/components/ui/Comments/CollapsibleCommentItem.js

@@ -0,0 +1,208 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { usePermissions } from "../../../store";
+import { Button } from "../Button";
+import { Badge } from "../Badge";
+import { Input } from "../Input";
+import { Avatar } from "../Avatar";
+import { UserAvatar } from "../UserAvatar";
+import * as LR from "lucide-react";
+import { useTranslations } from "next-intl";
+import { format } from "date-fns";
+import { cn } from "../../../utils/utils";
+import { useUser } from "../../../hooks/users/users";
+import { useSession } from "next-auth/react";
+function CollapsibleCommentItem({
+  comment,
+  onAction,
+  replies = [],
+  onReply,
+  onFileUpload,
+  attachments = [],
+  depth = 0,
+  isVisible = true,
+  onMouseEnter,
+  onMouseLeave
+}) {
+  var _a, _b;
+  const t = useTranslations("CommentsSection");
+  const { ability } = usePermissions();
+  const [isExpanded, setIsExpanded] = React.useState(false);
+  const [showReplyInput, setShowReplyInput] = React.useState(false);
+  const [replyText, setReplyText] = React.useState("");
+  const fileInputRef = React.useRef(null);
+  const prevVisibleRef = React.useRef(isVisible);
+  const user = (_a = useSession().data) == null ? void 0 : _a.user;
+  React.useEffect(() => {
+    const prevVisible = prevVisibleRef.current;
+    if (prevVisible && !isVisible) {
+      setIsExpanded(false);
+    }
+    prevVisibleRef.current = isVisible;
+  }, [isVisible]);
+  const handleReplySubmit = () => {
+    if (replyText.trim() && onReply) {
+      onReply(comment.id, replyText);
+      setReplyText("");
+      setShowReplyInput(false);
+    }
+  };
+  const handleFileSelect = (event) => {
+    if (event.target.files && event.target.files.length > 0 && onFileUpload) {
+      onFileUpload(comment.id, event.target.files);
+      event.target.value = "";
+    }
+  };
+  const indentClass = depth > 0 ? `ml-${Math.min(depth * 4, 12)}` : "";
+  const { user: author } = useUser(String(comment.authorId));
+  let authorName = (_b = author == null ? void 0 : author.name) != null ? _b : "Unknown User";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "border rounded-md overflow-hidden transition-opacity",
+        indentClass
+        // !isVisible && "opacity-50"
+      ),
+      onMouseEnter,
+      onMouseLeave,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between p-3 hover:bg-accent/50 transition-colors", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                className: cn("h-6 w-6 p-0 mt-1"),
+                onClick: () => setIsExpanded(!isExpanded),
+                children: /* @__PURE__ */ jsx(
+                  LR.ChevronRight,
+                  {
+                    className: cn(
+                      "h-4 w-4 transition-transform",
+                      isExpanded && "rotate-90"
+                    )
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(Avatar, { className: cn("h-8 w-8 mt-1 rounded-full overflow-hidden"), children: /* @__PURE__ */ jsx(UserAvatar, { imageFileId: author == null ? void 0 : author.imageFileId, name: authorName }) }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: cn("text-sm font-medium text-foreground "), children: authorName }),
+                comment.updatedAt !== comment.createdAt && /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-xs", children: t("edited") })
+              ] }),
+              /* @__PURE__ */ jsx("p", { className: cn("text-sm mt-1 line-clamp-1 text-foreground"), children: comment.text }),
+              replies.length > 0 && !isExpanded && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground mt-1", children: [
+                replies.length,
+                " ",
+                replies.length === 1 ? t("reply") : t("replies")
+              ] })
+            ] })
+          ] }),
+          onAction && /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-0 flex-shrink-0"), children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "icon",
+                className: "h-8 w-8 p-0",
+                onClick: () => setShowReplyInput(!showReplyInput),
+                title: t("replyToComment"),
+                disabled: !ability.can("create", "Comment"),
+                children: /* @__PURE__ */ jsx(LR.Reply, { className: "h-4 w-4" })
+              }
+            ),
+            (user == null ? void 0 : user.id) === String(comment.authorId) && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "h-8 w-8 p-0",
+                  onClick: () => onAction("edit", comment.id),
+                  title: t("editComment"),
+                  disabled: !ability.can("update", "Comment"),
+                  children: /* @__PURE__ */ jsx(LR.Pencil, { className: "h-4 w-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "h-8 w-8 p-0",
+                  onClick: () => onAction("delete", comment.id),
+                  title: t("deleteComment"),
+                  disabled: !ability.can("delete", "Comment"),
+                  children: /* @__PURE__ */ jsx(LR.Trash2, { className: "h-4 w-4" })
+                }
+              )
+            ] })
+          ] })
+        ] }),
+        isExpanded && /* @__PURE__ */ jsx("div", { className: "border-t bg-muted/30", children: /* @__PURE__ */ jsxs("div", { className: "p-4 space-y-4", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: format(new Date(comment.createdAt), "PPp") }),
+          /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground whitespace-pre-wrap", children: comment.text }) })
+        ] }) }),
+        showReplyInput && onReply && /* @__PURE__ */ jsx("div", { className: "border-t p-3 bg-muted/20", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              value: replyText,
+              onChange: (e) => setReplyText(e.target.value),
+              placeholder: t("writeReply"),
+              className: "flex-1",
+              onKeyDown: (e) => {
+                if (e.key === "Enter" && !e.shiftKey) {
+                  e.preventDefault();
+                  handleReplySubmit();
+                }
+              },
+              disabled: !ability.can("create", "Comment")
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              onClick: handleReplySubmit,
+              disabled: !replyText.trim() || !ability.can("create", "Comment"),
+              children: /* @__PURE__ */ jsx(LR.Send, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              onClick: () => {
+                setShowReplyInput(false);
+                setReplyText("");
+              },
+              disabled: !ability.can("create", "Comment"),
+              children: /* @__PURE__ */ jsx(LR.X, { className: "h-4 w-4" })
+            }
+          )
+        ] }) }),
+        isExpanded && replies.length > 0 && /* @__PURE__ */ jsx("div", { className: "border-t", children: replies.map((reply) => /* @__PURE__ */ jsx(
+          CollapsibleCommentItem,
+          {
+            comment: reply,
+            onAction,
+            onReply,
+            onFileUpload,
+            depth: depth + 1
+          },
+          reply.id
+        )) })
+      ]
+    }
+  );
+}
+export {
+  CollapsibleCommentItem
+};
+//# sourceMappingURL=CollapsibleCommentItem.js.map

package/dist/core/components/ui/Comments/CollapsibleCommentItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/core/components/ui/Comments/CollapsibleCommentItem.tsx"],"sourcesContent":["'use client'\r\n\r\nimport * as React from 'react'\r\nimport { usePermissions } from '../../../store'\r\n\r\n// Audit Phase 1.F (F-2c): direct file imports — `from '..'` lands at the\r\n// ui barrel which re-exports heavy modules (InfoSidebar, useFileUploadHandler).\r\nimport { Button } from '../Button'\r\nimport { Badge } from '../Badge'\r\nimport { Input } from '../Input'\r\nimport { Avatar } from '../Avatar'\r\nimport { UserAvatar } from '../UserAvatar'\r\nimport * as LR from 'lucide-react'\r\nimport { useTranslations } from 'next-intl'\r\nimport { format } from 'date-fns'\r\nimport { cn } from '../../../utils/utils'\r\nimport { Comment } from '../../../types/dbTypes'\r\nimport { useUser } from '../../../hooks/users/users'\r\nimport { useSession } from 'next-auth/react'\r\n\r\ntype CommentAction = 'view' | 'edit' | 'delete' | 'reply'\r\n\r\ninterface CollapsibleCommentItemProps {\r\n  comment: Comment\r\n  onAction?: (action: CommentAction, id: number) => void\r\n  replies?: Comment[]\r\n  onReply?: (id: number, replyText: string | number) => void\r\n  onFileUpload?: (id: number, files: FileList) => void\r\n  attachments?: Array<{ name: string; url: string; size: number }>\r\n  depth?: number\r\n  isVisible?: boolean\r\n  onMouseEnter?: () => void\r\n  onMouseLeave?: () => void\r\n}\r\n\r\nexport function CollapsibleCommentItem({\r\n  comment,\r\n  onAction,\r\n  replies = [],\r\n  onReply,\r\n  onFileUpload,\r\n  attachments = [],\r\n  depth = 0,\r\n  isVisible = true,\r\n  onMouseEnter,\r\n  onMouseLeave\r\n}: CollapsibleCommentItemProps) {\r\n  const t = useTranslations('CommentsSection')\r\n  // Permissions\r\n  const { ability } = usePermissions()\r\n\r\n  const [isExpanded, setIsExpanded] = React.useState(false)\r\n  const [showReplyInput, setShowReplyInput] = React.useState(false)\r\n  const [replyText, setReplyText] = React.useState('')\r\n  const fileInputRef = React.useRef<HTMLInputElement>(null)\r\n  const prevVisibleRef = React.useRef(isVisible)\r\n\r\n  const user = useSession().data?.user\r\n\r\n  // Auto-collapse when visibility turns off\r\n  React.useEffect(() => {\r\n    const prevVisible = prevVisibleRef.current\r\n    \r\n    if (prevVisible && !isVisible) {\r\n      // Just turned invisible - collapse\r\n      setIsExpanded(false)\r\n    }\r\n    \r\n    prevVisibleRef.current = isVisible\r\n  }, [isVisible])\r\n\r\n  const handleReplySubmit = () => {\r\n    if (replyText.trim() && onReply) {\r\n      onReply(comment.id, replyText)\r\n      setReplyText('')\r\n      setShowReplyInput(false)\r\n    }\r\n  }\r\n\r\n  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    if (event.target.files && event.target.files.length > 0 && onFileUpload) {\r\n      onFileUpload(comment.id, event.target.files)\r\n      event.target.value = ''\r\n    }\r\n  }\r\n\r\n  const indentClass = depth > 0 ? `ml-${Math.min(depth * 4, 12)}` : ''\r\n\r\n  const { user: author } = useUser(String(comment.authorId))\r\n  let authorName: string | undefined = author?.name ?? 'Unknown User'\r\n\r\n  return (\r\n    <div \r\n      className={cn(\r\n        \"border rounded-md overflow-hidden transition-opacity\",\r\n        indentClass,\r\n        // !isVisible && \"opacity-50\"\r\n      )}\r\n      onMouseEnter={onMouseEnter}\r\n      onMouseLeave={onMouseLeave}\r\n    >\r\n      {/* Comment Header */}\r\n      <div className=\"flex items-start justify-between p-3 hover:bg-accent/50 transition-colors\">\r\n        <div className=\"flex items-start gap-3 flex-1 min-w-0\">\r\n          <Button\r\n            variant=\"ghost\"\r\n            size=\"sm\"\r\n            className={cn(\"h-6 w-6 p-0 mt-1\")}\r\n            onClick={() => setIsExpanded(!isExpanded)}\r\n          >\r\n            <LR.ChevronRight\r\n              className={cn(\r\n                \"h-4 w-4 transition-transform\",\r\n                isExpanded && \"rotate-90\"\r\n              )}\r\n            />\r\n          </Button>\r\n\r\n          <Avatar className={cn(\"h-8 w-8 mt-1 rounded-full overflow-hidden\")}>\r\n            <UserAvatar imageFileId={author?.imageFileId} name={authorName} />\r\n          </Avatar>\r\n\r\n          <div className=\"flex-1 min-w-0\">\r\n            <div className=\"flex items-center gap-2\">\r\n                <span className={cn(\"text-sm font-medium text-foreground \")}>\r\n                {authorName}\r\n              </span>\r\n              {comment.updatedAt !== comment.createdAt && (\r\n                <Badge variant=\"outline\" className=\"text-xs\">\r\n                  {t('edited')}\r\n                </Badge>\r\n              )}\r\n            </div>\r\n              <p className={cn(\"text-sm mt-1 line-clamp-1 text-foreground\")}>\r\n              {comment.text}\r\n            </p>\r\n            {replies.length > 0 && !isExpanded && (\r\n              <span className=\"text-xs text-muted-foreground mt-1\">\r\n                {replies.length} {replies.length === 1 ? t('reply') : t('replies')}\r\n              </span>\r\n            )}\r\n          </div>\r\n        </div>\r\n\r\n      {/* Action Buttons */}\r\n      {onAction && (\r\n        <div className={cn(\"flex items-center gap-0 flex-shrink-0\")}>\r\n          <Button\r\n            variant=\"ghost\"\r\n            size=\"icon\"\r\n            className=\"h-8 w-8 p-0\"\r\n            onClick={() => setShowReplyInput(!showReplyInput)}\r\n            title={t('replyToComment')}\r\n            disabled={!ability.can('create', 'Comment')}\r\n          >\r\n            <LR.Reply className=\"h-4 w-4\" />\r\n          </Button>\r\n          {user?.id === String(comment.authorId) && (\r\n            <>\r\n              <Button\r\n                variant=\"ghost\"\r\n                size=\"icon\"\r\n                className=\"h-8 w-8 p-0\"\r\n                onClick={() => onAction('edit', comment.id)}\r\n                title={t('editComment')}\r\n                disabled={!ability.can('update', 'Comment')}\r\n              >\r\n                <LR.Pencil className=\"h-4 w-4\" />\r\n              </Button>\r\n              {/* TODO: Need 2-step confirmation dialog for DELETE COMMENT */}\r\n              <Button\r\n                variant=\"ghost\"\r\n                size=\"icon\"\r\n                className=\"h-8 w-8 p-0\"\r\n                onClick={() => onAction('delete', comment.id)}\r\n                title={t('deleteComment')}\r\n                disabled={!ability.can('delete', 'Comment')}\r\n\r\n              >\r\n                <LR.Trash2 className=\"h-4 w-4\" />\r\n              </Button>\r\n            </>\r\n          )}\r\n        </div>\r\n      )}\r\n    </div>\r\n\r\n      {/* Expanded Content */ }\r\n  {\r\n    isExpanded && (\r\n      <div className=\"border-t bg-muted/30\">\r\n        <div className=\"p-4 space-y-4\">\r\n          {/* Full Comment Text */}\r\n          <span className=\"text-xs text-muted-foreground\">\r\n            {format(new Date(comment.createdAt), 'PPp')}\r\n          </span>\r\n          <div>\r\n            <p className=\"text-sm text-foreground whitespace-pre-wrap\">\r\n              {comment.text}\r\n            </p>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    )\r\n  }\r\n\r\n  {/* Reply Input */ }\r\n  {\r\n    showReplyInput && onReply && (\r\n      <div className=\"border-t p-3 bg-muted/20\">\r\n        <div className=\"flex gap-2\">\r\n          <Input\r\n            value={replyText}\r\n            onChange={(e) => setReplyText(e.target.value)}\r\n            placeholder={t('writeReply')}\r\n            className=\"flex-1\"\r\n            onKeyDown={(e) => {\r\n              if (e.key === 'Enter' && !e.shiftKey) {\r\n                e.preventDefault()\r\n                handleReplySubmit()\r\n              }\r\n            }}\r\n            disabled={!ability.can('create', 'Comment')}\r\n          />\r\n          <Button\r\n            size=\"sm\"\r\n            onClick={handleReplySubmit}\r\n            disabled={!replyText.trim() || !ability.can('create', 'Comment')}\r\n          >\r\n            <LR.Send className=\"h-4 w-4\" />\r\n          </Button>\r\n          <Button\r\n            size=\"sm\"\r\n            variant=\"ghost\"\r\n            onClick={() => {\r\n              setShowReplyInput(false)\r\n              setReplyText('')\r\n            }}\r\n            disabled={!ability.can('create', 'Comment')}\r\n          >\r\n            <LR.X className=\"h-4 w-4\" />\r\n          </Button>\r\n        </div>\r\n      </div>\r\n    )\r\n  }\r\n\r\n  {/* Nested Replies */ }\r\n  {\r\n    isExpanded && replies.length > 0 && (\r\n      <div className=\"border-t\">\r\n        {replies.map((reply) => (\r\n          <CollapsibleCommentItem\r\n            key={reply.id}\r\n            comment={reply}\r\n            onAction={onAction}\r\n            onReply={onReply}\r\n            onFileUpload={onFileUpload}\r\n            depth={depth + 1}\r\n          />\r\n        ))}\r\n      </div>\r\n    )\r\n  }\r\n    </div >\r\n  )\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/core/components/ui/Comments/Comment.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+export type CommentProps = {
+    userName: string;
+    userImage: number | null;
+    userImageFileId?: number | null;
+    buildingId?: number;
+    text: string;
+    createdAt: string | Date;
+    onRemove?: () => void;
+    onClose?: () => void;
+    enableCollapse?: boolean;
+    defaultCollapsed?: boolean;
+    isPending?: boolean;
+    highlight?: boolean;
+};
+export default function Comment({ text, createdAt, userName, userImage, userImageFileId, onRemove, onClose, enableCollapse, defaultCollapsed, isPending, highlight, }: CommentProps): React.JSX.Element;
+//# sourceMappingURL=Comment.d.ts.map

package/dist/core/components/ui/Comments/Comment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Comment.d.ts","sourceRoot":"","sources":["../../../../../src/core/components/ui/Comments/Comment.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAU9B,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,SAAS,EACT,eAAe,EACf,QAAQ,EACR,OAAO,EACP,cAAsB,EACtB,gBAAwB,EACxB,SAAiB,EACjB,SAAiB,GAClB,EAAE,YAAY,qBA6Gd"}

package/dist/core/components/ui/Comments/Comment.js

@@ -0,0 +1,113 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as LR from "lucide-react";
+import { Avatar } from "../Avatar";
+import { Button } from "../Button";
+import { Card } from "../Card";
+import { formatTimestamp } from "../../../utils/timeUtils";
+import { markerStyleHighlight } from "../../../utils/markerUtils";
+import { UserAvatar } from "../UserAvatar";
+import { useFile } from "../../../hooks/files/files";
+function Comment({
+  text,
+  createdAt,
+  userName,
+  userImage,
+  userImageFileId,
+  onRemove,
+  onClose,
+  enableCollapse = false,
+  defaultCollapsed = false,
+  isPending = false,
+  highlight = false
+}) {
+  const [isCollapsed, setIsCollapsed] = React.useState(defaultCollapsed);
+  const lastTap = React.useRef(0);
+  const resolvedImageFileId = userImageFileId != null ? userImageFileId : userImage;
+  const { file } = useFile(resolvedImageFileId);
+  const previewSrc = file == null ? void 0 : file.url;
+  const handlePointerDown = (e) => {
+    if (!enableCollapse) return;
+    e.stopPropagation();
+    const now = performance.now();
+    if (now - lastTap.current < 300) setIsCollapsed((v) => !v);
+    lastTap.current = now;
+  };
+  if (enableCollapse && isCollapsed) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `h-9 w-9 rounded-full shadow-md overflow-hidden flex-shrink-0 pointer-events-auto ${highlight ? markerStyleHighlight : ""}`,
+        onPointerDown: handlePointerDown,
+        onDoubleClick: (e) => {
+          e.stopPropagation();
+          setIsCollapsed((v) => !v);
+        },
+        children: isPending ? /* @__PURE__ */ jsx("div", { className: "w-full h-full rounded-full bg-primary-light flex items-center justify-center", children: /* @__PURE__ */ jsx(LR.Loader2, { className: "h-4 w-4 animate-spin text-muted-foreground" }) }) : /* @__PURE__ */ jsx(Avatar, { className: "h-full w-full cursor-pointer", children: /* @__PURE__ */ jsx(
+          UserAvatar,
+          {
+            imageFileId: resolvedImageFileId,
+            previewSrc,
+            name: userName,
+            className: "h-full w-full rounded-full object-cover"
+          }
+        ) })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "relative inline-block group",
+      style: { pointerEvents: "auto" },
+      title: enableCollapse ? "Double click to collapse" : void 0,
+      onPointerDown: handlePointerDown,
+      onDoubleClick: (e) => {
+        e.stopPropagation();
+        if (enableCollapse) setIsCollapsed((v) => !v);
+        else onClose == null ? void 0 : onClose();
+      },
+      children: /* @__PURE__ */ jsxs(Card, { className: "w-48 px-3 py-2.5 shadow-md group-hover:shadow-lg transition-shadow duration-200", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsx("div", { className: "h-9 w-9 rounded-full shadow-sm flex items-center justify-center select-none flex-shrink-0 bg-card", children: isPending ? /* @__PURE__ */ jsx("div", { className: "h-10 w-10 rounded-full bg-muted flex items-center justify-center", children: /* @__PURE__ */ jsx(LR.Loader2, { className: "h-5 w-5 animate-spin text-muted-foreground" }) }) : /* @__PURE__ */ jsx(Avatar, { className: "h-10 w-10", children: /* @__PURE__ */ jsx(
+            UserAvatar,
+            {
+              imageFileId: resolvedImageFileId,
+              previewSrc,
+              name: userName,
+              className: "h-full w-full rounded-full object-cover"
+            }
+          ) }) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-sm text-foreground leading-none truncate", children: userName }),
+            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground leading-none", children: formatTimestamp(createdAt) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-start gap-2", children: [
+          /* @__PURE__ */ jsx("p", { className: "min-w-0 flex-1 text-sm leading-relaxed text-foreground whitespace-pre-wrap break-words", children: text }),
+          onRemove && /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "icon",
+              title: "Remove comment",
+              className: "z-50 h-7 w-7 shrink-0",
+              "aria-label": "Remove comment",
+              onClick: (e) => {
+                e.stopPropagation();
+                onRemove();
+              },
+              children: /* @__PURE__ */ jsx(LR.Trash2, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+}
+export {
+  Comment as default
+};
+//# sourceMappingURL=Comment.js.map

package/dist/core/components/ui/Comments/Comment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/core/components/ui/Comments/Comment.tsx"],"sourcesContent":["'use client'\r\n\r\nimport * as React from 'react'\r\nimport * as LR from 'lucide-react'\r\nimport { Avatar } from '../Avatar'\r\nimport { Button } from '../Button'\r\nimport { Card } from '../Card'\r\nimport { formatTimestamp } from '../../../utils/timeUtils'\r\nimport { markerStyleHighlight } from '../../../utils/markerUtils'\r\nimport { UserAvatar } from '../UserAvatar'\r\nimport { useFile } from '../../../hooks/files/files'\r\n\r\nexport type CommentProps = {\r\n  userName: string\r\n  userImage: number | null\r\n  userImageFileId?: number | null\r\n  buildingId?: number\r\n  text: string\r\n  createdAt: string | Date\r\n  onRemove?: () => void\r\n  onClose?: () => void\r\n  enableCollapse?: boolean\r\n  defaultCollapsed?: boolean\r\n  isPending?: boolean\r\n  highlight?: boolean\r\n}\r\n\r\nexport default function Comment({\r\n  text,\r\n  createdAt,\r\n  userName,\r\n  userImage,\r\n  userImageFileId,\r\n  onRemove,\r\n  onClose,\r\n  enableCollapse = false,\r\n  defaultCollapsed = false,\r\n  isPending = false,\r\n  highlight = false,\r\n}: CommentProps) {\r\n  const [isCollapsed, setIsCollapsed] = React.useState(defaultCollapsed)\r\n  const lastTap = React.useRef(0)\r\n  const resolvedImageFileId = userImageFileId ?? userImage\r\n  const { file } = useFile(resolvedImageFileId)\r\n  const previewSrc = file?.url\r\n\r\n  const handlePointerDown = (e: React.PointerEvent) => {\r\n    if (!enableCollapse) return\r\n    e.stopPropagation()\r\n\r\n    const now = performance.now()\r\n    if (now - lastTap.current < 300) setIsCollapsed(v => !v)\r\n    lastTap.current = now\r\n  }\r\n  if (enableCollapse && isCollapsed) {\r\n    return (\r\n      <div\r\n        className={`h-9 w-9 rounded-full shadow-md overflow-hidden flex-shrink-0 pointer-events-auto ${highlight ? markerStyleHighlight : ''}`}\r\n        onPointerDown={handlePointerDown}\r\n        onDoubleClick={(e) => {\r\n          e.stopPropagation()\r\n          setIsCollapsed(v => !v)\r\n        }}\r\n      >\r\n        {isPending ? (\r\n          <div className=\"w-full h-full rounded-full bg-primary-light flex items-center justify-center\">\r\n            <LR.Loader2 className=\"h-4 w-4 animate-spin text-muted-foreground\" />\r\n          </div>\r\n        ) : (\r\n          <Avatar className=\"h-full w-full cursor-pointer\">\r\n            <UserAvatar\r\n              imageFileId={resolvedImageFileId}\r\n              previewSrc={previewSrc}\r\n              name={userName}\r\n              className=\"h-full w-full rounded-full object-cover\"\r\n            />\r\n          </Avatar>\r\n        )}\r\n      </div>\r\n    )\r\n  }\r\n\r\n  return (\r\n    <div\r\n      className=\"relative inline-block group\"\r\n      style={{ pointerEvents: 'auto' }}\r\n      title={enableCollapse ? 'Double click to collapse' : undefined}\r\n      onPointerDown={handlePointerDown}\r\n      onDoubleClick={(e) => {\r\n        e.stopPropagation()\r\n        if (enableCollapse) setIsCollapsed(v => !v)\r\n        else onClose?.()\r\n      }}\r\n    >\r\n        <Card className=\"w-48 px-3 py-2.5 shadow-md group-hover:shadow-lg transition-shadow duration-200\">\r\n          <div className=\"flex items-start gap-3\">\r\n            <div className=\"h-9 w-9 rounded-full shadow-sm flex items-center justify-center select-none flex-shrink-0 bg-card\">\r\n              {isPending ? (\r\n                <div className=\"h-10 w-10 rounded-full bg-muted flex items-center justify-center\">\r\n                  <LR.Loader2 className=\"h-5 w-5 animate-spin text-muted-foreground\" />\r\n                </div>\r\n              ) : (\r\n                <Avatar className=\"h-10 w-10\">\r\n                  <UserAvatar\r\n                    imageFileId={resolvedImageFileId}\r\n                    previewSrc={previewSrc}\r\n                    name={userName}\r\n                    className=\"h-full w-full rounded-full object-cover\"\r\n                  />\r\n                </Avatar>\r\n              )}\r\n            </div>\r\n\r\n            <div className=\"flex-1 min-w-0 flex flex-col gap-1\">\r\n              <span className=\"font-medium text-sm text-foreground leading-none truncate\">\r\n                {userName}\r\n              </span>\r\n              <span className=\"text-xs text-muted-foreground leading-none\">\r\n                {formatTimestamp(createdAt)}\r\n              </span>\r\n            </div>\r\n          </div>\r\n\r\n          <div className=\"mt-2 flex items-start gap-2\">\r\n            <p className=\"min-w-0 flex-1 text-sm leading-relaxed text-foreground whitespace-pre-wrap break-words\">\r\n              {text}\r\n            </p>\r\n\r\n            {onRemove && (\r\n                  <Button\r\n                    type=\"button\"\r\n                    variant=\"ghost\"\r\n                    size=\"icon\"\r\n                    title=\"Remove comment\"\r\n                    className=\"z-50 h-7 w-7 shrink-0\"\r\n                    aria-label=\"Remove comment\"\r\n                    onClick={(e) => {\r\n                      e.stopPropagation()\r\n                      onRemove()\r\n                    }}\r\n                  >\r\n                    <LR.Trash2 className=\"h-4 w-4\" />\r\n                  </Button>\r\n            )}\r\n          </div>\r\n        </Card>\r\n    </div>\r\n  )\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/core/components/ui/Comments/CommentInput.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { ViewerNames } from '../../../types/dbTypes';
+export type CommentInputLayout = 'inline' | 'card' | 'dialog';
+export type BimCommentPlacementContext = {
+    world: any;
+    raycast: (data: {
+        camera: any;
+        mouse: any;
+        dom: any;
+    }) => Promise<any>;
+    buildingId?: number;
+    setCursor?: (cursor: string) => void;
+    addPendingMarker?: (position: {
+        x: number;
+        y: number;
+        z: number;
+    }) => number;
+    removePendingMarker?: (id: number) => void;
+};
+export type CommentInputProps = {
+    viewer: ViewerNames;
+    layout?: CommentInputLayout;
+    onCancel?: () => void;
+    bim?: BimCommentPlacementContext;
+    isOpen?: boolean;
+};
+export declare function CommentInput({ viewer, layout, onCancel, bim, isOpen, }: CommentInputProps): React.JSX.Element;
+//# sourceMappingURL=CommentInput.d.ts.map

package/dist/core/components/ui/Comments/CommentInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommentInput.d.ts","sourceRoot":"","sources":["../../../../../src/core/components/ui/Comments/CommentInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,OAAO,EAAW,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAG7D,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAA;AAE7D,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,GAAG,CAAA;IACV,OAAO,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,GAAG,CAAC;QAAC,KAAK,EAAE,GAAG,CAAC;QAAC,GAAG,EAAE,GAAG,CAAA;KAAE,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;IACtE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,MAAM,CAAA;IAC5E,mBAAmB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3C,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,WAAW,CAAA;IACnB,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,GAAG,CAAC,EAAE,0BAA0B,CAAA;IAChC,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,MAAiB,EACjB,QAAQ,EACR,GAAG,EACH,MAAc,GACf,EAAE,iBAAiB,qBA0SnB"}