@blocklet/discuss-kit-ux 2.4.35 → 2.4.37

package/dist/components/posts/post-content.mjs

@@ -0,0 +1,86 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Suspense } from "react";
+import { lazyRetry as lazy } from "@arcblock/ux/lib/Util";
+import CheckboxPlugin from "@blocklet/editor/lib/ext/CheckboxPlugin";
+import { styled } from "@mui/material/styles";
+import Box from "@mui/material/Box";
+import { inferInitialEditorState } from "../lexical.mjs";
+import { ViewMore } from "../view-more.mjs";
+import PostEdit from "../input/post-edit.mjs";
+import ImagePathFixerPlugin from "../input/image-path-fixer-plugin.mjs";
+import { VideoPathFixerPlugin } from "../editor/plugins/video-path-fixer-plugin.mjs";
+const BlockletEditor = lazy(() => import("@blocklet/editor"));
+const StyledBlockletEditor = styled(BlockletEditor)`
+  .editor-scroller {
+    min-height: initial;
+  }
+  .ContentEditable__root {
+    padding: 0;
+  }
+  .be-editable > p:last-child {
+    margin-bottom: 0;
+  }
+`;
+const innerHeight = parseInt(String(window.innerHeight / 3), 10);
+export default function PostContent({
+  content,
+  editing = false,
+  onExitEditing,
+  onSubmit,
+  autoCollapse,
+  enableHeadingsIdPlugin,
+  onReady,
+  children,
+  editorPrepend,
+  ...rest
+}) {
+  if (editing && onSubmit) {
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        sx: {
+          ".be-editable": { maxHeight: 768, overflow: "auto", minHeight: `${Math.max(innerHeight, 200)}px !important` }
+        },
+        children: /* @__PURE__ */ jsx(PostEdit, { content, onCancel: onExitEditing, send: onSubmit, onSuccess: onExitEditing })
+      }
+    );
+  }
+  if (!autoCollapse) {
+    return /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsxs(
+      StyledBlockletEditor,
+      {
+        editable: false,
+        editorState: inferInitialEditorState(content),
+        enableHeadingsIdPlugin,
+        onReady,
+        prepend: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(ImagePathFixerPlugin, {}),
+          /* @__PURE__ */ jsx(VideoPathFixerPlugin, {}),
+          editorPrepend
+        ] }),
+        children: [
+          /* @__PURE__ */ jsx(CheckboxPlugin, { send: onSubmit }),
+          children
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(ViewMore, { ...rest, children: /* @__PURE__ */ jsxs(
+    StyledBlockletEditor,
+    {
+      editable: false,
+      editorState: inferInitialEditorState(content),
+      enableHeadingsIdPlugin,
+      onReady,
+      prepend: /* @__PURE__ */ jsxs(Fragment, { children: [
+        editorPrepend,
+        /* @__PURE__ */ jsx(ImagePathFixerPlugin, {}),
+        /* @__PURE__ */ jsx(VideoPathFixerPlugin, {})
+      ] }),
+      children: [
+        /* @__PURE__ */ jsx(CheckboxPlugin, { send: onSubmit }),
+        children
+      ]
+    }
+  ) }) });
+}

package/dist/components/posts/post.d.ts

@@ -1,6 +1,6 @@
-import { default as React } from 'react';
-import { default as MuiMenuItem } from '@mui/material/MenuItem';
-import { Post } from '../../types';
+import React from 'react';
+import MuiMenuItem from '@mui/material/MenuItem';
+import type { Post } from '../../types';
 export interface PostProps {
     post: Post;
     interactive?: boolean;
@@ -22,5 +22,5 @@ interface PostContext {
     interactive: boolean;
     post: Post;
 }
-export default function PostComponent({ post, render, renderExtraContent, customMenu, interactive, onContentUpdate, allowCopyLink, autoCollapse, showProfileCard, resolveAuthorInfoAppend, editorPlugins, enableAutoTranslate, ...rest }: PostProps): import("react/jsx-runtime").JSX.Element;
+export default function PostComponent({ post, render, renderExtraContent, customMenu, interactive, onContentUpdate, allowCopyLink, autoCollapse, showProfileCard, resolveAuthorInfoAppend, editorPlugins, enableAutoTranslate, ...rest }: PostProps): JSX.Element;
 export {};

package/dist/components/posts/post.mjs

@@ -0,0 +1,198 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import Box from "@mui/material/Box";
+import { styled } from "@mui/material/styles";
+import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
+import MuiMenuItem from "@mui/material/MenuItem";
+import clsx from "clsx";
+import { useInViewport } from "ahooks";
+import ArrowForwardUpIcon from "virtual:icons/tabler/arrow-forward-up";
+import { Stack } from "@mui/material";
+import RelativeTime from "../shared/relative-time.mjs";
+import { AuthorInfo } from "../avatars/index.mjs";
+import PostContent from "./post-content.mjs";
+import { useSessionContext } from "../hooks/index.mjs";
+import { copy } from "../utils.mjs";
+import Menu from "./menu.mjs";
+import { ProfileCardTooltip } from "../profile-card/profile-card.mjs";
+import { PostAutoTranslatePlugin } from "../auto-translate/post-auto-translate-plugin.mjs";
+const Root = styled(Box)`
+  .post-highlighted {
+    animation: highlighted-post-fade 3s;
+    animation-timing-function: ease-out;
+  }
+  @-webkit-keyframes highlighted-post-fade {
+    0% {
+      background-color: #fcf4d9;
+    }
+    100% {
+      background-color: rgba(255, 255, 153, 0);
+    }
+  }
+  @-moz-keyframes highlighted-post-fade {
+    0% {
+      background-color: #fcf4d9;
+    }
+    100% {
+      background-color: rgba(255, 255, 153, 0);
+    }
+  }
+`;
+export default function PostComponent({
+  post,
+  render,
+  renderExtraContent,
+  customMenu,
+  interactive = true,
+  onContentUpdate,
+  allowCopyLink = false,
+  autoCollapse,
+  showProfileCard,
+  resolveAuthorInfoAppend = () => void 0,
+  editorPlugins,
+  enableAutoTranslate,
+  ...rest
+}) {
+  const { session, isAdmin } = useSessionContext();
+  const isAuthor = post.author.did === session?.user?.did;
+  const commentUrl = window.location.hash.substring(1);
+  const { t } = useLocaleContext();
+  const [editing, setEditing] = useState(false);
+  const postContext = { isAdmin, isAuthor, interactive, post };
+  const [inViewport] = useInViewport(() => document?.getElementById(post.id));
+  const [hasEnteredViewport, setHasEnteredViewport] = useState(false);
+  let menuItems = [];
+  if (isAuthor && !post.deletedAt) {
+    menuItems.push(
+      /* @__PURE__ */ jsx(MuiMenuItem, { onClick: () => setEditing(true), children: t("edit") }, "edit")
+    );
+  }
+  if (allowCopyLink) {
+    menuItems.push(
+      /* @__PURE__ */ jsx(
+        MuiMenuItem,
+        {
+          onClick: () => copy(
+            window.location.hash ? window.location.href.replace(window.location.hash, `#${post.id}`) : `${window.location.href}#${post.id}`
+          ),
+          children: t("copyLink")
+        },
+        "copyLink"
+      )
+    );
+  }
+  const isTargetPost = commentUrl === post.id;
+  menuItems = customMenu ? customMenu(menuItems, postContext) : menuItems;
+  const renderTime = () => {
+    if (allowCopyLink) {
+      return /* @__PURE__ */ jsx(Box, { component: "a", href: `#${post.id}`, sx: { color: "text.secondary", textDecoration: "none" }, children: /* @__PURE__ */ jsx(RelativeTime, { value: post.createdAt }) });
+    }
+    return /* @__PURE__ */ jsx(RelativeTime, { value: post.createdAt });
+  };
+  let systemTip = "";
+  if (post.deletedAt) {
+    systemTip = t("deleted");
+  } else if (!post.content) {
+    systemTip = t("emptyContent");
+  }
+  const showSystemTip = systemTip && !editing;
+  useEffect(() => {
+    if (inViewport) {
+      setHasEnteredViewport(inViewport);
+    }
+  }, [inViewport]);
+  return /* @__PURE__ */ jsxs(Root, { sx: { position: "relative", mt: 2, py: 1 }, ...rest, children: [
+    /* @__PURE__ */ jsxs(
+      Box,
+      {
+        id: post.id,
+        className: clsx({ "post-highlighted": isTargetPost && hasEnteredViewport }),
+        sx: {
+          flex: "1"
+        },
+        children: [
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              sx: {
+                display: "flex",
+                justifyContent: "space-between",
+                alignItems: "start"
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  AuthorInfo,
+                  {
+                    size: "sm",
+                    fontSize: 14,
+                    avatarSize: 32,
+                    user: post.author,
+                    createdAt: renderTime(),
+                    showProfileCard,
+                    append: resolveAuthorInfoAppend(post),
+                    showDID: false
+                  }
+                ),
+                /* @__PURE__ */ jsx(Menu, { items: menuItems, style: { position: "absolute", right: 0, top: 0 } })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box, { sx: { ml: { xs: 0, md: 5.5 } }, children: [
+            post.replyTo && /* @__PURE__ */ jsx(Box, { sx: { pt: 1 }, children: /* @__PURE__ */ jsx(ProfileCardTooltip, { user: post.replyTo, children: /* @__PURE__ */ jsxs(
+              Stack,
+              {
+                direction: "row",
+                sx: {
+                  alignItems: "center",
+                  gap: 0.5,
+                  display: "inline-flex",
+                  color: "text.secondary",
+                  cursor: "pointer",
+                  ".did-address-text": { color: "primary.light" }
+                },
+                children: [
+                  /* @__PURE__ */ jsx(Box, { component: ArrowForwardUpIcon }),
+                  /* @__PURE__ */ jsx("span", { children: "Reply to" }),
+                  /* @__PURE__ */ jsx(Box, { component: "span", children: post.replyTo.fullName })
+                ]
+              }
+            ) }) }),
+            showSystemTip && /* @__PURE__ */ jsx(
+              Box,
+              {
+                sx: {
+                  display: "inline-block",
+                  px: 2.5,
+                  py: 1,
+                  my: 1,
+                  fontSize: 14,
+                  bgcolor: "grey.100",
+                  color: "grey.600",
+                  borderRadius: 1
+                },
+                children: systemTip
+              }
+            ),
+            !showSystemTip && !post.deletedAt && /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+              PostContent,
+              {
+                content: post.content,
+                editing,
+                onExitEditing: () => setEditing(false),
+                onSubmit: (content) => onContentUpdate(post, content),
+                autoCollapse,
+                editorPrepend: /* @__PURE__ */ jsxs(Fragment, { children: [
+                  editorPlugins,
+                  enableAutoTranslate && /* @__PURE__ */ jsx(PostAutoTranslatePlugin, { postId: post.id, updatedAt: post.updatedAt || "" })
+                ] })
+              },
+              editing ? "comment-content" : post.synced || 0
+            ) }),
+            render && /* @__PURE__ */ jsx(Box, { sx: { mt: 1 }, children: render(postContext) })
+          ] })
+        ]
+      }
+    ),
+    renderExtraContent && renderExtraContent(postContext)
+  ] });
+}

package/dist/components/profile-card/index.mjs

@@ -0,0 +1 @@
+export * from "./profile-card.mjs";

package/dist/components/profile-card/profile-card.d.ts

@@ -1,14 +1,15 @@
-import { User } from '../../types';
+/// <reference types="react" />
+import type { User } from '../../types';
 interface ProfileCardProps {
     user: User;
     click: () => void;
 }
-export declare function ProfileCard({ user, click, ...rest }: ProfileCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function ProfileCard({ user, click, ...rest }: ProfileCardProps): import("react").JSX.Element;
 interface ProfileCardTooltipProps {
     user: User;
     children: React.ReactElement<any> | ((props: {
         navigateToProfile: () => void;
     }) => React.ReactElement<any>);
 }
-export declare function ProfileCardTooltip({ user, children }: ProfileCardTooltipProps): import("react/jsx-runtime").JSX.Element;
+export declare function ProfileCardTooltip({ user, children }: ProfileCardTooltipProps): import("react").JSX.Element;
 export {};

package/dist/components/profile-card/profile-card.mjs

@@ -0,0 +1,162 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Link, useNavigate } from "react-router-dom";
+import { Box, Button, styled } from "@mui/material";
+import Tooltip, { tooltipClasses } from "@mui/material/Tooltip";
+import DID from "@arcblock/ux/lib/DID";
+import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
+import { green } from "@mui/material/colors";
+import { ChatBubbleOutlineOutlined as ChatBubbleOutlineOutlinedIcon } from "@mui/icons-material";
+import { useBrowser } from "@arcblock/react-hooks";
+import { useState } from "react";
+import Avatar from "../avatars/avatar.mjs";
+import { useSessionContext } from "../hooks/index.mjs";
+import Badge from "../avatars/badge.mjs";
+import { useChatInWallet } from "../chat/hooks.mjs";
+import { openProfile, isInDiscussKitApp } from "../utils.mjs";
+export function ProfileCard({ user, click, ...rest }) {
+  const { session } = useSessionContext();
+  const { t } = useLocaleContext();
+  let chatUrl = user?.did && `/chat/dm/${user?.did}`;
+  if (chatUrl && window.location.pathname?.includes(user?.did)) {
+    chatUrl = "";
+  }
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      sx: {
+        boxSizing: "border-box",
+        width: 340,
+        p: 2,
+        border: "1px solid",
+        borderColor: "divider",
+        borderRadius: 1,
+        fontSize: 14,
+        color: "grey.700",
+        bgcolor: "background.paper"
+      },
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 2, cursor: "pointer" }, onClick: click, children: [
+          /* @__PURE__ */ jsx(Avatar, { did: user.did, src: user.avatar, size: 44, shape: "circle", variant: "circle" }),
+          /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", flex: 1, overflow: "hidden" }, children: [
+            /* @__PURE__ */ jsxs(
+              Box,
+              {
+                component: "span",
+                sx: {
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  lineHeight: 1.3
+                },
+                children: [
+                  /* @__PURE__ */ jsx(Box, { sx: { fontWeight: "bold" }, children: user.fullName }),
+                  user.role && /* @__PURE__ */ jsx(
+                    Box,
+                    {
+                      sx: {
+                        px: 1.25,
+                        border: 1,
+                        borderColor: green[600],
+                        color: green[600],
+                        fontSize: 12,
+                        fontWeight: "bold",
+                        lineHeight: 1.5,
+                        borderRadius: "100vh",
+                        textTransform: "capitalize"
+                      },
+                      children: user.role
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              DID,
+              {
+                style: { marginTop: 4, lineHeight: 1, height: 14, maxWidth: 250, color: "inherit !important" },
+                size: 14,
+                did: user.did
+              }
+            ),
+            /* @__PURE__ */ jsx(Box, { sx: { mt: 1 }, children: /* @__PURE__ */ jsx(Badge, { passports: user?.passports || [], pointInfo: user?.pointInfo || {}, did: user?.did }) })
+          ] })
+        ] }),
+        chatUrl && user?.did !== window.blocklet.appId && session?.user?.did && session?.user?.did !== user.did && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Box, { sx: { my: 2, borderTop: "1px solid", borderColor: "divider" } }),
+          /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              component: Link,
+              to: chatUrl,
+              variant: "outlined",
+              color: "inherit",
+              startIcon: /* @__PURE__ */ jsx(ChatBubbleOutlineOutlinedIcon, { style: { fontSize: 16 } }),
+              sx: { fontSize: 12 },
+              children: t("messages")
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+const HtmlTooltip = styled(({ className, ...props }) => /* @__PURE__ */ jsx(
+  Tooltip,
+  {
+    ...props,
+    classes: { popper: className },
+    slotProps: {
+      popper: {
+        disablePortal: true
+      }
+    }
+  }
+))(() => ({
+  [`& .${tooltipClasses.tooltip}`]: {
+    backgroundColor: "transparent",
+    maxWidth: "initial"
+  }
+}));
+export function ProfileCardTooltip({ user, children }) {
+  const navigate = useNavigate();
+  const [open, setOpen] = useState(false);
+  const { mobile } = useBrowser();
+  const { chatInWallet } = useChatInWallet();
+  const click = (e) => {
+    e?.stopPropagation?.();
+    e?.preventDefault?.();
+    setOpen(false);
+    if (chatInWallet) {
+      openProfile(user?.did, true);
+    } else {
+      setTimeout(() => {
+        if (isInDiscussKitApp) {
+          navigate(`/profile?did=${user?.did}`);
+        } else {
+          openProfile(user?.did);
+        }
+      }, 100);
+    }
+  };
+  const renderChildren = () => {
+    if (typeof children === "function") {
+      return children({ navigateToProfile: click });
+    }
+    return children;
+  };
+  if (mobile.any) {
+    return renderChildren();
+  }
+  return /* @__PURE__ */ jsx(
+    HtmlTooltip,
+    {
+      open,
+      onClose: () => setOpen(false),
+      onOpen: () => setOpen(true),
+      PopperProps: { disablePortal: false },
+      title: /* @__PURE__ */ jsx(ProfileCard, { user, click }),
+      children: renderChildren()
+    }
+  );
+}

package/dist/components/rating/binary-thumb.d.ts

@@ -1,8 +1,9 @@
-import { RatingProps } from './rating';
-import { Rating as RatingType } from '../../types';
+/// <reference types="react" />
+import { type RatingProps } from './rating';
+import type { Rating as RatingType } from '../../types';
 export type BinaryThumbProps = {
     data: RatingType[];
     variant?: 'default' | 'inverse';
     size?: 'sm' | 'lg';
 } & Pick<RatingProps, 'onRate' | 'onUnrate'>;
-export default function BinaryThumb({ data, variant, size, ...rest }: BinaryThumbProps): import("react/jsx-runtime").JSX.Element;
+export default function BinaryThumb({ data, variant, size, ...rest }: BinaryThumbProps): import("react").JSX.Element;

package/dist/components/rating/binary-thumb.mjs

@@ -0,0 +1,157 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { styled } from "@arcblock/ux/lib/Theme";
+import Box from "@mui/material/Box";
+import clsx from "clsx";
+import ThumbUpIcon from "virtual:icons/iconoir/thumbs-up";
+import RaterList from "./rater-list.mjs";
+import Rating from "./rating.mjs";
+import { useSessionContext } from "../hooks/index.mjs";
+const values = ["1", "-1"];
+export default function BinaryThumb({ data = [], variant = "default", size = "sm", ...rest }) {
+  const { session } = useSessionContext();
+  const [raterListVisible, setRaterListVisible] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const countPerValue = useMemo(() => {
+    return data.reduce((acc, cur) => {
+      acc[cur.value] = (acc[cur.value] || 0) + 1;
+      return acc;
+    }, {});
+  }, [data]);
+  const selectedValue = useMemo(() => {
+    return data.find((x) => x.rater?.did === session?.user?.did)?.value;
+  }, [data, session.user]);
+  const render = ({ options, toggleRate }) => {
+    const handleTextClick = (event, value) => {
+      setRaterListVisible(value);
+    };
+    const clickRateHandle = async (option) => {
+      if (loading) {
+        return;
+      }
+      setLoading(true);
+      await toggleRate(option.value);
+      setLoading(false);
+    };
+    return /* @__PURE__ */ jsx(Root, { children: options.map((option) => {
+      const icon = option.value === "-1" ? /* @__PURE__ */ jsx(ThumbUpIcon, { style: { transform: "rotate(180deg)" } }) : /* @__PURE__ */ jsx(ThumbUpIcon, {});
+      return /* @__PURE__ */ jsxs("div", { className: "reaction-item", children: [
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            className: "reaction-item-btn",
+            icon,
+            text: option.count,
+            selected: option.selected,
+            onClick: () => clickRateHandle(option),
+            variant,
+            size,
+            onTextClick: (e) => handleTextClick(e, option.value),
+            disabled: loading
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          RaterList,
+          {
+            open: raterListVisible === option.value,
+            onClose: () => setRaterListVisible(null),
+            value: raterListVisible,
+            ratings: data
+          }
+        )
+      ] }, option.value);
+    }) });
+  };
+  return /* @__PURE__ */ jsx(
+    Rating,
+    {
+      ...rest,
+      ratingType: "binary-thumb",
+      values,
+      countPerValue,
+      selectedValue,
+      render
+    }
+  );
+}
+const Root = styled(Box)`
+  display: flex;
+  .reaction-item {
+    display: flex;
+    align-items: center;
+  }
+`;
+function IconButton({ icon, text, onClick, selected, variant, size, onTextClick, disabled, ...rest }) {
+  const classes = clsx(rest.className, `reaction-btn-${size} reaction-btn-${variant}`, {
+    "reaction-btn-selected": selected,
+    "button-disabled": disabled
+  });
+  return /* @__PURE__ */ jsxs(IconButtonRoot, { ...rest, className: classes, children: [
+    /* @__PURE__ */ jsx("span", { className: "reaction-btn-icon", onClick, children: icon }),
+    !!text && /* @__PURE__ */ jsx("span", { className: "reaction-btn-text", onClick: (e) => onTextClick?.(e), children: text })
+  ] });
+}
+const IconButtonRoot = styled("div")`
+  display: flex;
+  align-items: center;
+  &.reaction-btn-selected {
+    color: ${(props) => props.theme.palette.primary.main};
+  }
+  .reaction-btn-icon {
+    display: flex;
+    line-height: 1;
+    cursor: pointer;
+  }
+  &.button-disabled {
+    opacity: 0.5;
+    .reaction-btn-icon {
+      cursor: not-allowed;
+    }
+  }
+  svg {
+    width: auto;
+  }
+  .reaction-btn-text {
+    display: inline-block;
+    cursor: pointer;
+  }
+  &.reaction-btn-sm {
+    min-width: 64px;
+    height: 18px;
+    font-size: 12px;
+    svg {
+      font-size: 15px;
+    }
+    .reaction-btn-text {
+      margin-left: 8px;
+    }
+  }
+  &.reaction-btn-lg {
+    min-width: 100px;
+    font-size: 14px;
+    .reaction-btn-icon {
+      justify-content: center;
+      align-items: center;
+      width: 44px;
+      height: 44px;
+      border-radius: 8px;
+    }
+    svg {
+      height: 20px;
+    }
+    .reaction-btn-text {
+      margin-left: 12px;
+    }
+  }
+  &.reaction-btn-inverse {
+    .reaction-btn-icon {
+      background-color: ${(props) => props.theme.palette.grey[200]};
+    }
+    &.reaction-btn-selected {
+      .reaction-btn-icon {
+        color: #fff;
+        background-color: ${(props) => props.theme.palette.primary.main};
+      }
+    }
+  }
+`;

package/dist/components/rating/github-reaction-container.d.ts

@@ -1,8 +1,9 @@
+/// <reference types="react" />
 import { AxiosInstance } from 'axios';
 import { GithubReactionProps } from './github-reaction';
 interface Props extends Omit<GithubReactionProps, 'data' | 'onRate' | 'onUnrate'> {
     id: string;
     request: AxiosInstance;
 }
-export declare function GithubReactionContainer({ id, request, ...rest }: Props): import("react/jsx-runtime").JSX.Element | null;
+export declare function GithubReactionContainer({ id, request, ...rest }: Props): import("react").JSX.Element | null;
 export {};