@replyke/ui-core-react-js 4.0.0

package/dist/esm/components/GiphyContainer.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState, useCallback, useMemo } from "react";
+import { Grid } from "@giphy/react-components";
+import { GiphyFetch } from "@giphy/js-fetch-api";
+import { MagnifyingGlassIcon } from "../icons";
+function GiphyContainer({ onClickBack, onSelectGif, giphyApiKey, visible, }) {
+    const gridParentRef = useRef(null);
+    const [parentWidth, setParentWidth] = useState(0);
+    const [query, setQuery] = useState(""); // Current search query
+    const [debouncedQuery, setDebouncedQuery] = useState(""); // Debounced query
+    const gf = useMemo(() => new GiphyFetch(giphyApiKey), [giphyApiKey]);
+    // Debounce effect
+    useEffect(() => {
+        const handler = setTimeout(() => {
+            setDebouncedQuery(query);
+        }, 500); // 500ms debounce delay
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [query]);
+    // Update parent width on mount and resize
+    useEffect(() => {
+        const updateWidth = () => {
+            if (gridParentRef.current) {
+                setParentWidth(gridParentRef.current.offsetWidth);
+            }
+        };
+        updateWidth();
+        window.addEventListener("resize", updateWidth);
+        return () => {
+            window.removeEventListener("resize", updateWidth);
+        };
+    }, []);
+    // Conditionally fetch Gifs only when visible
+    const fetchGifs = useCallback((offset) => {
+        if (!visible) {
+            // Return a valid GifsResult object with empty values
+            return Promise.resolve({
+                data: [],
+                pagination: { total_count: 0, count: 0, offset: 0 }, // Provide complete pagination properties
+                meta: { status: 200, msg: "OK", response_id: "" },
+            });
+        }
+        // Fetch  search results if visible
+        if (debouncedQuery.trim().length > 0) {
+            return gf.search(debouncedQuery, { offset, limit: 10 });
+        }
+        // Fetch trending
+        return gf.trending({ offset, limit: 10 });
+    }, [debouncedQuery, gf, visible]);
+    useEffect(() => {
+        if (!visible)
+            setQuery("");
+    }, [visible]);
+    // Memoize the Grid component
+    const memoizedGrid = useMemo(() => {
+        if (parentWidth > 0) {
+            return (_jsx(Grid, { width: parentWidth, columns: 2, fetchGifs: fetchGifs, onGifClick: (gifData, e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    const aspectRatio = Number(gifData.images.fixed_width.width) /
+                        Number(gifData.images.fixed_width.height);
+                    const selectedGif = {
+                        id: gifData.id.toString(),
+                        url: gifData.url,
+                        gifUrl: gifData.images.fixed_width.url,
+                        gifPreviewUrl: gifData.images.preview_gif.url,
+                        altText: gifData.alt_text,
+                        aspectRatio,
+                    };
+                    onSelectGif(selectedGif);
+                } }, `${debouncedQuery}-${visible}`));
+        }
+        return null;
+    }, [parentWidth, fetchGifs, debouncedQuery, onSelectGif, visible]);
+    return (_jsxs("div", { style: {
+            position: "absolute",
+            inset: 0,
+            opacity: visible ? 1 : 0, // Opacity based on visibility
+            backgroundColor: "white",
+            height: "100%",
+            width: "100%",
+            display: "grid",
+            gridTemplateRows: "auto 1fr",
+            overflow: "hidden",
+            padding: "0.25rem",
+            gap: "0.25rem",
+            zIndex: 1000,
+            pointerEvents: visible ? "auto" : "none", // Make it unclickable when not visible
+            transition: "opacity 0.1s ease", // Smooth fade effect
+        }, children: [_jsxs("div", { style: {
+                    display: "flex",
+                    gap: "0.25rem",
+                    alignItems: "stretch",
+                }, children: [_jsx("button", { onClick: onClickBack, style: {
+                            backgroundColor: "#e5e7eb",
+                            borderRadius: "0.5rem",
+                            width: 28,
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            flexShrink: 0,
+                            color: "#888",
+                        }, children: "\u2190" }), _jsxs("div", { style: {
+                            width: "100%",
+                            borderRadius: "0.5rem",
+                            paddingLeft: 8,
+                            backgroundColor: "#e5e7eb",
+                            display: "flex",
+                            alignItems: "center",
+                            flex: 1,
+                        }, children: [_jsx("div", { className: "pt-1", children: _jsx(MagnifyingGlassIcon, { width: 14, color: "#888" }) }), _jsx("input", { type: "text", placeholder: "Search GIPHY", value: query, onChange: (e) => setQuery(e.target.value), style: {
+                                    width: "100%",
+                                    padding: "0.5rem",
+                                    boxSizing: "border-box",
+                                    backgroundColor: "transparent",
+                                    fontSize: 13,
+                                    outline: "none", // Removes the default focus outline
+                                    boxShadow: "none", // Removes any focus ring or shadow
+                                } })] })] }), _jsx("div", { ref: gridParentRef, style: {
+                    flex: 1,
+                    height: "100%",
+                    width: "100%",
+                    overflowY: "scroll",
+                    scrollbarWidth: "none",
+                    msOverflowStyle: "none",
+                }, children: memoizedGrid })] }));
+}
+export default GiphyContainer;
+//# sourceMappingURL=GiphyContainer.js.map

package/dist/esm/components/GiphyContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GiphyContainer.js","sourceRoot":"","sources":["../../../src/components/GiphyContainer.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/InfiniteScrollTrigger.d.ts

@@ -0,0 +1,4 @@
+declare const InfiniteScrollTrigger: ({ onTriggered, }: {
+    onTriggered: () => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default InfiniteScrollTrigger;

package/dist/esm/components/InfiniteScrollTrigger.js

@@ -0,0 +1,29 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+const InfiniteScrollTrigger = ({ onTriggered, }) => {
+    const commentsEndRef = useRef(null);
+    useEffect(() => {
+        const currentEndRef = commentsEndRef.current;
+        const observer = new IntersectionObserver(([entry]) => {
+            if (entry.isIntersecting) {
+                onTriggered();
+            }
+        }, {
+            root: null, // Use the document's viewport as the container
+            rootMargin: "0px",
+            threshold: 0.1, // Trigger when 10% of the target is visible
+        });
+        if (currentEndRef) {
+            observer.observe(currentEndRef);
+        }
+        return () => {
+            if (currentEndRef) {
+                observer.unobserve(currentEndRef);
+            }
+        };
+    }, [onTriggered]);
+    return _jsx("div", { ref: commentsEndRef, style: { height: 1 } });
+};
+export default InfiniteScrollTrigger;
+//# sourceMappingURL=InfiniteScrollTrigger.js.map

package/dist/esm/components/InfiniteScrollTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfiniteScrollTrigger.js","sourceRoot":"","sources":["../../../src/components/InfiniteScrollTrigger.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,qBAAqB,GAAG,CAAC,EAC7B,WAAW,GAGZ,EAAE,EAAE;IACH,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEpC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,CAAC;QAE7C,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE;YACV,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;gBACzB,WAAW,EAAE,CAAC;YAChB,CAAC;QACH,CAAC,EACD;YACE,IAAI,EAAE,IAAI,EAAE,+CAA+C;YAC3D,UAAU,EAAE,KAAK;YACjB,SAAS,EAAE,GAAG,EAAE,4CAA4C;SAC7D,CACF,CAAC;QAEF,IAAI,aAAa,EAAE,CAAC;YAClB,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAClC,CAAC;QAED,OAAO,GAAG,EAAE;YACV,IAAI,aAAa,EAAE,CAAC;gBAClB,QAAQ,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;YACpC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,cAAK,GAAG,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,GAAI,CAAC;AAC5D,CAAC,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/esm/components/Modal.d.ts

@@ -0,0 +1,8 @@
+import React, { ReactNode } from "react";
+interface ModalProps {
+    show: boolean;
+    onClose?: () => void;
+    children: ReactNode;
+}
+declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/esm/components/Modal.js

@@ -0,0 +1,84 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+const Modal = ({ show, onClose, children }) => {
+    const [isVisible, setIsVisible] = useState(show);
+    useEffect(() => {
+        if (show) {
+            setIsVisible(true);
+        }
+    }, [show]);
+    const handleOverlayClick = (e) => {
+        e.stopPropagation();
+        onClose?.();
+    };
+    // const handleContentClick = (e: MouseEvent<HTMLDivElement>) => {
+    //   e.stopPropagation();
+    // };
+    const handleAnimationEnd = () => {
+        if (!show) {
+            setIsVisible(false);
+        }
+    };
+    useEffect(() => {
+        const styleSheet = document.createElement("style");
+        styleSheet.type = "text/css";
+        styleSheet.innerText = `
+      @keyframes fadeIn {
+        from {
+          background: rgba(0, 0, 0, 0);
+        }
+        to {
+          background: rgba(0, 0, 0, 0.5);
+        }
+      }
+      @keyframes fadeOut {
+        from {
+          background: rgba(0, 0, 0, 0.5);
+        }
+        to {
+          background: rgba(0, 0, 0, 0);
+        }
+      }
+    `;
+        document.head.appendChild(styleSheet);
+        return () => {
+            document.head.removeChild(styleSheet);
+        };
+    }, []);
+    if (!isVisible) {
+        return null;
+    }
+    const modalOverlayStyle = {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        background: show ? "rgba(0, 0, 0, 0.5)" : "rgba(0, 0, 0, 0)", // Background based on show state
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "stretch",
+        zIndex: 1000,
+        animation: show ? "fadeIn 0.5s forwards" : "fadeOut 0.5s forwards", // Apply fadeIn or fadeOut
+        visibility: show ? "visible" : "hidden",
+    };
+    // const modalContentStyle: React.CSSProperties = {
+    //   position: "relative",
+    //   width: "max-content",
+    //   backgroundColor:"yellow",
+    // };
+    // const modalCloseStyle: React.CSSProperties = {
+    //   position: 'absolute',
+    //   top: '10px',
+    //   right: '10px',
+    //   background: 'none',
+    //   border: 'none',
+    //   fontSize: '20px',
+    //   cursor: 'pointer',
+    // };
+    return (_jsx("div", { style: modalOverlayStyle, onAnimationEnd: handleAnimationEnd, onClick: handleOverlayClick, children: children }));
+};
+export default Modal;
+//# sourceMappingURL=Modal.js.map

package/dist/esm/components/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAyB,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAQ1E,MAAM,KAAK,GAAyB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE;IAClE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE,CAAC;YACT,YAAY,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,kBAAkB,GAAG,CAAC,CAA6B,EAAE,EAAE;QAC3D,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,OAAO,EAAE,EAAE,CAAC;IACd,CAAC,CAAC;IAEF,kEAAkE;IAClE,yBAAyB;IACzB,KAAK;IAEL,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACnD,UAAU,CAAC,IAAI,GAAG,UAAU,CAAC;QAC7B,UAAU,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;KAiBtB,CAAC;QACF,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QAEtC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QACxC,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,iBAAiB,GAAwB;QAC7C,QAAQ,EAAE,OAAO;QACjB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,kBAAkB,EAAE,iCAAiC;QAC/F,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,SAAS;QACrB,MAAM,EAAE,IAAI;QACZ,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,uBAAuB,EAAE,0BAA0B;QAC9F,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;KACxC,CAAC;IAEF,mDAAmD;IACnD,0BAA0B;IAC1B,0BAA0B;IAC1B,8BAA8B;IAC9B,KAAK;IAEL,iDAAiD;IACjD,0BAA0B;IAC1B,iBAAiB;IACjB,mBAAmB;IACnB,wBAAwB;IACxB,oBAAoB;IACpB,sBAAsB;IACtB,uBAAuB;IACvB,KAAK;IAEL,OAAO,CACL,cACE,KAAK,EAAE,iBAAiB,EACxB,cAAc,EAAE,kBAAkB,EAClC,OAAO,EAAE,kBAAkB,YAM1B,QAAQ,GAEL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/esm/components/Skeleton.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+declare function Skeleton({ style }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+declare function CommentSkeleton({ extraLeftPadding, }: {
+    extraLeftPadding?: number;
+}): import("react/jsx-runtime").JSX.Element;
+declare function UserMentionSkeleton(): import("react/jsx-runtime").JSX.Element;
+export { CommentSkeleton, UserMentionSkeleton, Skeleton };

package/dist/esm/components/Skeleton.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+function Skeleton({ style }) {
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
+      @keyframes pulse {
+        0% { opacity: 1; }
+        50% { opacity: 0.3; }
+        100% { opacity: 1; }
+      }
+    ` }), _jsx("div", { style: {
+                    animation: "pulse 1.5s ease-in-out infinite",
+                    width: "100%",
+                    height: 16,
+                    borderRadius: 8,
+                    backgroundColor: "#efefef",
+                    ...style,
+                } })] }));
+}
+function CommentSkeleton({ extraLeftPadding = 0, }) {
+    return (_jsxs("div", { style: {
+            display: "flex",
+            gap: "8px",
+            width: "100%",
+            paddingLeft: 16 + extraLeftPadding,
+        }, children: [_jsx(Skeleton, { style: { height: 32, width: 32, borderRadius: "50%" } }), _jsxs("div", { style: { display: "grid", gap: "8px", flex: 1 }, children: [_jsx(Skeleton, { style: { width: "30%", height: 12 } }), _jsx(Skeleton, { style: { height: 12 } }), _jsx(Skeleton, { style: { width: "15%", height: 12 } })] })] }));
+}
+function UserMentionSkeleton() {
+    return (_jsxs("div", { style: {
+            display: "flex",
+            gap: "8px",
+            width: "100%",
+            alignItems: "center",
+        }, children: [_jsx(Skeleton, { style: { height: "35px", width: "35px", borderRadius: "100%" } }), _jsx("div", { style: { flex: 1 }, children: _jsx(Skeleton, {}) })] }));
+}
+export { CommentSkeleton, UserMentionSkeleton, Skeleton };
+//# sourceMappingURL=Skeleton.js.map

package/dist/esm/components/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../src/components/Skeleton.tsx"],"names":[],"mappings":";AAEA,SAAS,QAAQ,CAAC,EAAE,KAAK,EAAwC;IAC/D,OAAO,CACL,8BACE,0BACG;;;;;;KAMJ,GACS,EACR,cACE,KAAK,EAAE;oBACL,SAAS,EAAE,iCAAiC;oBAC5C,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,EAAE;oBACV,YAAY,EAAE,CAAC;oBACf,eAAe,EAAE,SAAS;oBAC1B,GAAG,KAAK;iBACT,GACD,IACD,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,eAAe,CAAC,EACvB,gBAAgB,GAAG,CAAC,GAGrB;IACC,OAAO,CACL,eACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,GAAG,EAAE,KAAK;YACV,KAAK,EAAE,MAAM;YACb,WAAW,EAAE,EAAE,GAAG,gBAAgB;SACnC,aAED,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,GAAI,EACnE,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAE,aAClD,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,GAAI,EACjD,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,GAAI,EACnC,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,GAAI,IAC7C,IACF,CACP,CAAC;AACJ,CAAC;AAED,SAAS,mBAAmB;IAC1B,OAAO,CACL,eACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,GAAG,EAAE,KAAK;YACV,KAAK,EAAE,MAAM;YACb,UAAU,EAAE,QAAQ;SACrB,aAED,KAAC,QAAQ,IACP,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,GAC9D,EACF,cAAK,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACrB,KAAC,QAAQ,KAAG,GACR,IACF,CACP,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,QAAQ,EAAE,CAAC"}

package/dist/esm/components/UserAvatar.d.ts

@@ -0,0 +1,12 @@
+interface UserProps {
+    id?: string;
+    avatar?: string | null | undefined;
+    name?: string | null | undefined;
+    username?: string | null | undefined;
+}
+declare function UserAvatar({ user, size, borderRadius, }: {
+    user: UserProps | undefined;
+    size?: number | undefined;
+    borderRadius?: number | undefined;
+}): import("react/jsx-runtime").JSX.Element | null;
+export default UserAvatar;

package/dist/esm/components/UserAvatar.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { resetImg } from "../constants/reset-styles";
+function UserAvatar({ user, size = 32, borderRadius, }) {
+    if (!user)
+        return null;
+    return (_jsx("div", { style: {
+            overflow: "hidden",
+            width: size,
+            height: size,
+            borderRadius: borderRadius || size,
+            borderWidth: 1,
+            borderColor: "#E6E6E6",
+            display: "inline-block",
+            flexShrink: 0,
+        }, children: _jsx("img", { src: user.avatar ??
+                `https://api.dicebear.com/9.x/thumbs/svg?seed=${user.id}`, alt: user.name || user.id, style: {
+                ...resetImg,
+                width: "100%",
+                height: "100%",
+                objectFit: "cover",
+            } }) }));
+}
+export default UserAvatar;
+//# sourceMappingURL=UserAvatar.js.map

package/dist/esm/components/UserAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserAvatar.js","sourceRoot":"","sources":["../../../src/components/UserAvatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AASrD,SAAS,UAAU,CAAC,EAClB,IAAI,EACJ,IAAI,GAAG,EAAE,EACT,YAAY,GAKb;IACC,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACvB,OAAO,CACL,cACE,KAAK,EAAE;YACL,QAAQ,EAAE,QAAQ;YAClB,KAAK,EAAE,IAAI;YACX,MAAM,EAAE,IAAI;YACZ,YAAY,EAAE,YAAY,IAAI,IAAI;YAClC,WAAW,EAAE,CAAC;YACd,WAAW,EAAE,SAAS;YACtB,OAAO,EAAE,cAAc;YACvB,UAAU,EAAE,CAAC;SACd,YAED,cACE,GAAG,EACD,IAAI,CAAC,MAAM;gBACX,gDAAgD,IAAI,CAAC,EAAE,EAAE,EAE3D,GAAG,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,EACzB,KAAK,EAAE;gBACL,GAAG,QAAQ;gBACX,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,SAAS,EAAE,OAAO;aACnB,GACD,GACE,CACP,CAAC;AACJ,CAAC;AAED,eAAe,UAAU,CAAC"}

package/dist/esm/components/index.d.ts

@@ -0,0 +1,7 @@
+export { default as EmojiSuggestions } from "./EmojiSuggestions";
+export { default as FromNow } from "./FromNow";
+export { default as GiphyContainer } from "./GiphyContainer";
+export { default as InfiniteScrollTrigger } from "./InfiniteScrollTrigger";
+export { default as Modal } from "./Modal";
+export { default as UserAvatar } from "./UserAvatar";
+export { Skeleton, CommentSkeleton, UserMentionSkeleton } from "./Skeleton";

package/dist/esm/components/index.js

@@ -0,0 +1,8 @@
+export { default as EmojiSuggestions } from "./EmojiSuggestions";
+export { default as FromNow } from "./FromNow";
+export { default as GiphyContainer } from "./GiphyContainer";
+export { default as InfiniteScrollTrigger } from "./InfiniteScrollTrigger";
+export { default as Modal } from "./Modal";
+export { default as UserAvatar } from "./UserAvatar";
+export { Skeleton, CommentSkeleton, UserMentionSkeleton } from "./Skeleton";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC"}

package/dist/esm/constants/index.d.ts

@@ -0,0 +1 @@
+export * from "./reset-styles";

package/dist/esm/constants/index.js

@@ -0,0 +1,2 @@
+export * from "./reset-styles";
+//# sourceMappingURL=index.js.map

package/dist/esm/constants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/constants/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/esm/constants/reset-styles.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export declare const resetDiv: React.CSSProperties;
+export declare const resetButton: React.CSSProperties;
+export declare const resetUl: React.CSSProperties;
+export declare const resetIl: React.CSSProperties;
+export declare const resetP: React.CSSProperties;
+export declare const resetTextInput: React.CSSProperties;
+export declare const resetImg: React.CSSProperties;
+export declare const resetIcon: React.CSSProperties;

package/dist/esm/constants/reset-styles.js

@@ -0,0 +1,51 @@
+export const resetDiv = {
+    padding: 0,
+    margin: 0,
+};
+export const resetButton = {
+    margin: 0,
+    padding: 0,
+    borderStyle: "none",
+    borderWidth: 0,
+    backgroundColor: "transparent",
+    outline: "none",
+    fontFamily: "inherit",
+    cursor: "pointer",
+};
+export const resetUl = {
+    listStyleType: "none",
+    padding: 0,
+    margin: 0,
+    fontFamily: "inherit",
+};
+export const resetIl = {
+    padding: 0,
+    margin: 0,
+    fontFamily: "inherit",
+};
+export const resetP = {
+    padding: 0,
+    margin: 0,
+    fontFamily: "inherit",
+    cursor: "default",
+};
+export const resetTextInput = {
+    padding: 0,
+    margin: 0,
+    fontFamily: "inherit",
+    resize: "none",
+    border: "none",
+    outline: "none",
+    overflow: "auto",
+    boxShadow: "none",
+    WebkitBoxShadow: "none",
+};
+export const resetImg = {
+    padding: 0,
+    margin: 0,
+};
+export const resetIcon = {
+    padding: 0,
+    margin: 0,
+};
+//# sourceMappingURL=reset-styles.js.map

package/dist/esm/constants/reset-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reset-styles.js","sourceRoot":"","sources":["../../../src/constants/reset-styles.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,QAAQ,GAAwB;IAC3C,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAwB;IAC9C,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;IACV,WAAW,EAAE,MAAM;IACnB,WAAW,EAAE,CAAC;IACd,eAAe,EAAE,aAAa;IAC9B,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,SAAS;IACrB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAwB;IAC1C,aAAa,EAAE,MAAM;IACrB,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,SAAS;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAwB;IAC1C,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,SAAS;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAwB;IACzC,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,SAAS;IACrB,MAAM,EAAE,SAAS;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAwB;IACjD,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,SAAS;IACrB,MAAM,EAAE,MAAM;IACd,MAAM,EAAE,MAAM;IACd,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;IAChB,SAAS,EAAE,MAAM;IACjB,eAAe,EAAE,MAAM;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAwB;IAC3C,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;CACV,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAwB;IAC5C,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;CACV,CAAC"}

package/dist/esm/helpers/index.d.ts

@@ -0,0 +1 @@
+export { parseContentWithMentions } from "./parseContentWithMentions";

package/dist/esm/helpers/index.js

@@ -0,0 +1,2 @@
+export { parseContentWithMentions } from "./parseContentWithMentions";
+//# sourceMappingURL=index.js.map

package/dist/esm/helpers/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/helpers/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC"}

package/dist/esm/helpers/parseContentWithMentions.d.ts

@@ -0,0 +1,2 @@
+import { Mention } from "@replyke/core";
+export declare const parseContentWithMentions: (content: string, mentions: Mention[], currentUserId: string | undefined, currentUserClickCallback: (() => void) | undefined, otherUserClickCallback: ((userId: string) => void) | undefined) => (string | JSX.Element)[];

package/dist/esm/helpers/parseContentWithMentions.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const parseContentWithMentions = (content, mentions, currentUserId, currentUserClickCallback, otherUserClickCallback) => {
+    if (!mentions.length)
+        return [content];
+    // Create a regex pattern to match all mentions in the array, escaping special characters
+    const mentionPattern = new RegExp(mentions
+        .map((mention) => `@${mention.username.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&")}`)
+        .join("|"), "g");
+    // Replace mentions with a placeholder and split content based on the regex
+    const parts = content.split(mentionPattern);
+    // Find all matched mentions in the content
+    const matches = Array.from(content.matchAll(mentionPattern));
+    // Construct the parsed output
+    const parsedContent = [];
+    let lastIndex = 0;
+    parts.forEach((part, index) => {
+        if (part) {
+            parsedContent.push(part);
+            lastIndex += part.length;
+        }
+        const match = matches[index];
+        if (match) {
+            const matchedMention = mentions.find((mention) => `@${mention.username}` === match[0]);
+            if (matchedMention) {
+                parsedContent.push(_jsx("span", { style: { color: "#1e40af" }, onClick: () => {
+                        if (matchedMention.id === currentUserId) {
+                            currentUserClickCallback?.();
+                        }
+                        else {
+                            otherUserClickCallback?.(matchedMention.id);
+                        }
+                    }, children: match[0] }, lastIndex));
+                lastIndex += match[0].length;
+            }
+        }
+    });
+    return parsedContent;
+};
+//# sourceMappingURL=parseContentWithMentions.js.map

package/dist/esm/helpers/parseContentWithMentions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parseContentWithMentions.js","sourceRoot":"","sources":["../../../src/helpers/parseContentWithMentions.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,MAAM,wBAAwB,GAAG,CACtC,OAAe,EACf,QAAmB,EACnB,aAAiC,EACjC,wBAAkD,EAClD,sBAA8D,EACpC,EAAE;IAC5B,IAAI,CAAC,QAAQ,CAAC,MAAM;QAAE,OAAO,CAAC,OAAO,CAAC,CAAC;IAEvC,yFAAyF;IACzF,MAAM,cAAc,GAAG,IAAI,MAAM,CAC/B,QAAQ;SACL,GAAG,CACF,CAAC,OAAO,EAAE,EAAE,CACV,IAAI,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,uBAAuB,EAAE,MAAM,CAAC,EAAE,CAClE;SACA,IAAI,CAAC,GAAG,CAAC,EACZ,GAAG,CACJ,CAAC;IAEF,2EAA2E;IAC3E,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IAE5C,2CAA2C;IAC3C,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC;IAE7D,8BAA8B;IAC9B,MAAM,aAAa,GAA6B,EAAE,CAAC;IACnD,IAAI,SAAS,GAAG,CAAC,CAAC;IAElB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QAC5B,IAAI,IAAI,EAAE,CAAC;YACT,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACzB,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC;QAC3B,CAAC;QAED,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;QAC7B,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAClC,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,OAAO,CAAC,QAAQ,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CACjD,CAAC;YACF,IAAI,cAAc,EAAE,CAAC;gBACnB,aAAa,CAAC,IAAI,CAChB,eACE,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAC3B,OAAO,EAAE,GAAG,EAAE;wBACZ,IAAI,cAAc,CAAC,EAAE,KAAK,aAAa,EAAE,CAAC;4BACxC,wBAAwB,EAAE,EAAE,CAAC;wBAC/B,CAAC;6BAAM,CAAC;4BACN,sBAAsB,EAAE,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;wBAC9C,CAAC;oBACH,CAAC,YAGA,KAAK,CAAC,CAAC,CAAC,IAFJ,SAAS,CAGT,CACR,CAAC;gBACF,SAAS,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;YAC/B,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC"}

package/dist/esm/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { default as useTextareaCursorIndicator } from "./useTextareaCursorIndicator";
+export { default as useWidth } from "./useWidth";

package/dist/esm/hooks/index.js

@@ -0,0 +1,3 @@
+export { default as useTextareaCursorIndicator } from "./useTextareaCursorIndicator";
+export { default as useWidth } from "./useWidth";
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC"}

package/dist/esm/hooks/useTextareaCursorIndicator.d.ts

@@ -0,0 +1,8 @@
+declare function useTextareaCursorIndicator({ textAreaRef, }: {
+    textAreaRef: React.RefObject<HTMLTextAreaElement>;
+}): {
+    textAreaRef: import("react").RefObject<HTMLTextAreaElement>;
+    cursorPosition: number;
+    isSelectionActive: boolean;
+};
+export default useTextareaCursorIndicator;

package/dist/esm/hooks/useTextareaCursorIndicator.js

@@ -0,0 +1,30 @@
+import { useState, useEffect, useCallback } from "react";
+function useTextareaCursorIndicator({ textAreaRef, }) {
+    const [cursorPosition, setCursorPosition] = useState(0);
+    const [isSelectionActive, setIsSelectionActive] = useState(false);
+    const updateCursorAndSelection = useCallback(() => {
+        if (textAreaRef.current) {
+            const { selectionStart, selectionEnd } = textAreaRef.current;
+            setCursorPosition(selectionStart);
+            setIsSelectionActive(selectionStart !== selectionEnd);
+        }
+    }, [textAreaRef]);
+    useEffect(() => {
+        const textArea = textAreaRef.current;
+        if (textArea) {
+            textArea.addEventListener("input", updateCursorAndSelection);
+            textArea.addEventListener("click", updateCursorAndSelection);
+            textArea.addEventListener("keydown", updateCursorAndSelection);
+            textArea.addEventListener("keyup", updateCursorAndSelection);
+            return () => {
+                textArea.removeEventListener("input", updateCursorAndSelection);
+                textArea.removeEventListener("click", updateCursorAndSelection);
+                textArea.removeEventListener("keydown", updateCursorAndSelection);
+                textArea.removeEventListener("keyup", updateCursorAndSelection);
+            };
+        }
+    }, [updateCursorAndSelection, textAreaRef]);
+    return { textAreaRef, cursorPosition, isSelectionActive };
+}
+export default useTextareaCursorIndicator;
+//# sourceMappingURL=useTextareaCursorIndicator.js.map

package/dist/esm/hooks/useTextareaCursorIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTextareaCursorIndicator.js","sourceRoot":"","sources":["../../../src/hooks/useTextareaCursorIndicator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEzD,SAAS,0BAA0B,CAAC,EAClC,WAAW,GAGZ;IACC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC,CAAC;IAChE,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAE3E,MAAM,wBAAwB,GAAG,WAAW,CAAC,GAAG,EAAE;QAChD,IAAI,WAAW,CAAC,OAAO,EAAE,CAAC;YACxB,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAG,WAAW,CAAC,OAAO,CAAC;YAC7D,iBAAiB,CAAC,cAAc,CAAC,CAAC;YAClC,oBAAoB,CAAC,cAAc,KAAK,YAAY,CAAC,CAAC;QACxD,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;QAErC,IAAI,QAAQ,EAAE,CAAC;YACb,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;YAC7D,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;YAC7D,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,wBAAwB,CAAC,CAAC;YAC/D,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;YAE7D,OAAO,GAAG,EAAE;gBACV,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;gBAChE,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;gBAChE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,wBAAwB,CAAC,CAAC;gBAClE,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAC;YAClE,CAAC,CAAC;QACJ,CAAC;IACH,CAAC,EAAE,CAAC,wBAAwB,EAAE,WAAW,CAAC,CAAC,CAAC;IAE5C,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,iBAAiB,EAAE,CAAC;AAC5D,CAAC;AAED,eAAe,0BAA0B,CAAC"}

package/dist/esm/hooks/useWidth.d.ts

@@ -0,0 +1,2 @@
+declare function useWidth(): readonly [number, import("react").MutableRefObject<HTMLDivElement | null>];
+export default useWidth;

package/dist/esm/hooks/useWidth.js

@@ -0,0 +1,26 @@
+"use client";
+import { useEffect, useRef, useState } from "react";
+function useWidth() {
+    const [width, setWidth] = useState(0);
+    const ref = useRef(null);
+    useEffect(() => {
+        const handleResize = (entries) => {
+            if (entries[0].contentRect) {
+                setWidth(entries[0].contentRect.width);
+            }
+        };
+        const resizeObserver = new ResizeObserver(handleResize);
+        const currentRef = ref.current;
+        if (currentRef) {
+            resizeObserver.observe(currentRef);
+        }
+        return () => {
+            if (currentRef) {
+                resizeObserver.unobserve(currentRef);
+            }
+        };
+    }, []);
+    return [width, ref];
+}
+export default useWidth;
+//# sourceMappingURL=useWidth.js.map

package/dist/esm/hooks/useWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWidth.js","sourceRoot":"","sources":["../../../src/hooks/useWidth.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEpD,SAAS,QAAQ;IACf,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtC,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,CAAC,OAA8B,EAAE,EAAE;YACtD,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;gBAC3B,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;YACzC,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC;QACxD,MAAM,UAAU,GAAG,GAAG,CAAC,OAAO,CAAC;QAC/B,IAAI,UAAU,EAAE,CAAC;YACf,cAAc,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;QACrC,CAAC;QAED,OAAO,GAAG,EAAE;YACV,IAAI,UAAU,EAAE,CAAC;gBACf,cAAc,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;YACvC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CAAC,KAAK,EAAE,GAAG,CAAU,CAAC;AAC/B,CAAC;AAED,eAAe,QAAQ,CAAC"}