hive-react-kit 1.5.7 → 1.5.9

package/dist/build.css

@@ -50,7 +50,6 @@
     --color-sky-300: oklch(82.8% 0.111 230.318);
     --color-sky-400: oklch(74.6% 0.16 232.661);
     --color-sky-500: oklch(68.5% 0.169 237.323);
-    --color-sky-900: oklch(39.1% 0.09 240.876);
     --color-blue-100: oklch(93.2% 0.032 255.585);
     --color-blue-200: oklch(88.2% 0.059 254.128);
     --color-blue-300: oklch(80.9% 0.105 251.813);
@@ -1112,6 +1111,9 @@
   .max-w-\[250px\] {
     max-width: 250px;
   }
+  .max-w-\[260px\] {
+    max-width: 260px;
+  }
   .max-w-\[280px\] {
     max-width: 280px;
   }
@@ -2519,13 +2521,6 @@
     --tw-gradient-from: var(--color-purple-600);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
   }
-  .from-sky-900\/40 {
-    --tw-gradient-from: color-mix(in srgb, oklch(39.1% 0.09 240.876) 40%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      --tw-gradient-from: color-mix(in oklab, var(--color-sky-900) 40%, transparent);
-    }
-    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-  }
   .from-violet-900\/40 {
     --tw-gradient-from: color-mix(in srgb, oklch(38% 0.189 293.745) 40%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2579,13 +2574,6 @@
     }
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
   }
-  .to-slate-950\/60 {
-    --tw-gradient-to: color-mix(in srgb, oklch(12.9% 0.042 264.695) 60%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      --tw-gradient-to: color-mix(in oklab, var(--color-slate-950) 60%, transparent);
-    }
-    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-  }
   .to-transparent {
     --tw-gradient-to: transparent;
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@@ -3168,12 +3156,6 @@
   .text-white {
     color: var(--color-white);
   }
-  .text-white\/40 {
-    color: color-mix(in srgb, #fff 40%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      color: color-mix(in oklab, var(--color-white) 40%, transparent);
-    }
-  }
   .text-white\/50 {
     color: color-mix(in srgb, #fff 50%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -3367,6 +3349,10 @@
     outline-style: var(--tw-outline-style);
     outline-width: 1px;
   }
+  .blur {
+    --tw-blur: blur(8px);
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+  }
   .drop-shadow-md {
     --tw-drop-shadow-size: drop-shadow(0 3px 3px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.12)));
     --tw-drop-shadow: drop-shadow(var(--drop-shadow-md));
@@ -6300,6 +6286,14 @@
   border-radius: 0.75rem;
   object-fit: contain;
 }
+.three-speak-snap-strip .threeSpeakNative, .three-speak-snap-strip .threeSpeakNative.threeSpeakNativeNoThumb, .three-speak-snap-strip .threeSpeakNative.threeSpeakNativeLandscape, .three-speak-snap-strip .threeSpeakNative.threeSpeakNativePortrait {
+  width: auto;
+  height: 100%;
+  max-width: 100%;
+  max-height: 100%;
+  min-height: 0;
+  margin: 0;
+}
 .threeSpeakNativeMessage {
   color: var(--hrk-text-tertiary);
   font-size: 0.875rem;

package/dist/components/comments/AddCommentInput.d.ts

@@ -177,11 +177,18 @@ export interface PostComposerProps {
     walletApprovalLabel?: string;
     /** When true, force the blinking wallet-approval banner on (e.g. during a post/reply broadcast). */
     awaitingWalletApproval?: boolean;
+    /** Seed list for the `@`-mention autocomplete dropdown. Typically the
+     *  parent post's author followed by every `@account` mentioned in the
+     *  post body, deduped. These appear at the top of the suggestion list
+     *  before the user types anything; once they type 3+ chars the kit
+     *  also calls `condenser_api.get_account_reputations` for live
+     *  results. Omit to disable autocomplete entirely. */
+    mentionSeedAccounts?: string[];
 }
 /** @deprecated Use PostComposerProps instead */
 export type AddCommentInputProps = PostComposerProps;
-declare const PostComposer: ({ onSubmit, onCancel, currentUser, placeholder, parentAuthor, parentPermlink, ecencyToken, onSignMessage, signingUsername, threeSpeakApiKey, giphyApiKey, youtubeApiKey, templateToken, templateApiBaseUrl, hideBold, hideItalic, hideLink, hideImage, hideAudio, hideVideo, hideEmoji, hideGif, hideYoutube, hideCode, hideMention, hideTemplate, hideMeme, hideDecentMeme, decentMemesAppAccount, decentMemesTheme, onDecentMemesChange, hidePreview, hidePoll, onPollChange, defaultTags, initialUserTags, maxTags, onTagsChange, hideTags, reward, defaultReward, onRewardChange, hideReward, beneficiaries, defaultBeneficiaries, onBeneficiariesChange, beneficiaryFavorites, hideBeneficiaries, showVoteButton, defaultVoteEnabled, defaultVotePercent, voteWeightStep, allowLandscapeVideos, onVoteChange, voteLabel, showCancel, submitLabel, title, defaultPreviewOn, value, onChange, disabled, hideSubmitArea, submitRef, hideUserHeader, bgColor, borderColor, disableAutoFocus, walletApprovalLabel, awaitingWalletApproval, }: PostComposerProps) => import("react/jsx-runtime").JSX.Element;
+declare const PostComposer: ({ onSubmit, onCancel, currentUser, placeholder, parentAuthor, parentPermlink, ecencyToken, onSignMessage, signingUsername, threeSpeakApiKey, giphyApiKey, youtubeApiKey, templateToken, templateApiBaseUrl, hideBold, hideItalic, hideLink, hideImage, hideAudio, hideVideo, hideEmoji, hideGif, hideYoutube, hideCode, hideMention, hideTemplate, hideMeme, hideDecentMeme, decentMemesAppAccount, decentMemesTheme, onDecentMemesChange, hidePreview, hidePoll, onPollChange, defaultTags, initialUserTags, maxTags, onTagsChange, hideTags, reward, defaultReward, onRewardChange, hideReward, beneficiaries, defaultBeneficiaries, onBeneficiariesChange, beneficiaryFavorites, hideBeneficiaries, showVoteButton, defaultVoteEnabled, defaultVotePercent, voteWeightStep, allowLandscapeVideos, onVoteChange, voteLabel, showCancel, submitLabel, title, defaultPreviewOn, value, onChange, disabled, hideSubmitArea, submitRef, hideUserHeader, bgColor, borderColor, disableAutoFocus, walletApprovalLabel, awaitingWalletApproval, mentionSeedAccounts, }: PostComposerProps) => import("react/jsx-runtime").JSX.Element;
 /** @deprecated Use PostComposer instead */
-declare const AddCommentInput: ({ onSubmit, onCancel, currentUser, placeholder, parentAuthor, parentPermlink, ecencyToken, onSignMessage, signingUsername, threeSpeakApiKey, giphyApiKey, youtubeApiKey, templateToken, templateApiBaseUrl, hideBold, hideItalic, hideLink, hideImage, hideAudio, hideVideo, hideEmoji, hideGif, hideYoutube, hideCode, hideMention, hideTemplate, hideMeme, hideDecentMeme, decentMemesAppAccount, decentMemesTheme, onDecentMemesChange, hidePreview, hidePoll, onPollChange, defaultTags, initialUserTags, maxTags, onTagsChange, hideTags, reward, defaultReward, onRewardChange, hideReward, beneficiaries, defaultBeneficiaries, onBeneficiariesChange, beneficiaryFavorites, hideBeneficiaries, showVoteButton, defaultVoteEnabled, defaultVotePercent, voteWeightStep, allowLandscapeVideos, onVoteChange, voteLabel, showCancel, submitLabel, title, defaultPreviewOn, value, onChange, disabled, hideSubmitArea, submitRef, hideUserHeader, bgColor, borderColor, disableAutoFocus, walletApprovalLabel, awaitingWalletApproval, }: PostComposerProps) => import("react/jsx-runtime").JSX.Element;
+declare const AddCommentInput: ({ onSubmit, onCancel, currentUser, placeholder, parentAuthor, parentPermlink, ecencyToken, onSignMessage, signingUsername, threeSpeakApiKey, giphyApiKey, youtubeApiKey, templateToken, templateApiBaseUrl, hideBold, hideItalic, hideLink, hideImage, hideAudio, hideVideo, hideEmoji, hideGif, hideYoutube, hideCode, hideMention, hideTemplate, hideMeme, hideDecentMeme, decentMemesAppAccount, decentMemesTheme, onDecentMemesChange, hidePreview, hidePoll, onPollChange, defaultTags, initialUserTags, maxTags, onTagsChange, hideTags, reward, defaultReward, onRewardChange, hideReward, beneficiaries, defaultBeneficiaries, onBeneficiariesChange, beneficiaryFavorites, hideBeneficiaries, showVoteButton, defaultVoteEnabled, defaultVotePercent, voteWeightStep, allowLandscapeVideos, onVoteChange, voteLabel, showCancel, submitLabel, title, defaultPreviewOn, value, onChange, disabled, hideSubmitArea, submitRef, hideUserHeader, bgColor, borderColor, disableAutoFocus, walletApprovalLabel, awaitingWalletApproval, mentionSeedAccounts, }: PostComposerProps) => import("react/jsx-runtime").JSX.Element;
 export { PostComposer };
 export default AddCommentInput;

package/dist/components/comments/MentionSuggest.d.ts

@@ -0,0 +1,55 @@
+export interface MentionMatch {
+    /** The active query (lowercased, no leading @). */
+    query: string;
+    /** Caret column of the `@`. */
+    start: number;
+    /** Caret column right after the active token. */
+    end: number;
+}
+/** Find the active `@…` token at the caret position, or null. */
+export declare function findMentionAtCaret(value: string, caret: number): MentionMatch | null;
+export interface UseMentionAutocompleteOptions {
+    /** Seed list — typically `[parentAuthor, ...mentionsFromBody]`, deduped.
+     *  Shown verbatim before the user types anything, filtered locally
+     *  while they type 1–2 chars, then merged ahead of API results. */
+    seedAccounts?: string[];
+    /** How many API rows to fetch when query length ≥ 3. */
+    apiLimit?: number;
+}
+export interface UseMentionAutocompleteResult {
+    active: boolean;
+    match: MentionMatch | null;
+    candidates: string[];
+    highlightedIndex: number;
+    setHighlightedIndex: (i: number) => void;
+    onValueChange: (value: string, caret: number) => void;
+    onKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => boolean;
+    /** Apply the selected username — returns the new value + new caret. */
+    apply: (selection?: string) => {
+        value: string;
+        caret: number;
+    } | null;
+    dismiss: () => void;
+}
+export declare function useMentionAutocomplete(value: string, options?: UseMentionAutocompleteOptions): UseMentionAutocompleteResult;
+/** Approximate the caret's pixel offset inside a textarea so the
+ *  mention dropdown can dock right under the current line instead of
+ *  covering the typed text. Reads computed line-height + padding from
+ *  the live element; accounts for the textarea's own scrollTop so the
+ *  position stays correct when the body has scrolled. */
+export declare function caretOffsetInTextarea(textarea: HTMLTextAreaElement | null, caret: number): {
+    top: number;
+    left: number;
+};
+export interface MentionSuggestProps {
+    candidates: string[];
+    highlightedIndex: number;
+    onHover: (index: number) => void;
+    onSelect: (account: string) => void;
+    className?: string;
+}
+/** Floating panel that lists the candidate accounts. Position it via the
+ *  containing element's CSS — `MentionSuggest` itself just paints the
+ *  list with a `absolute`-friendly layout. */
+export declare const MentionSuggest: React.FC<MentionSuggestProps>;
+export default MentionSuggest;

package/dist/components/composer/ParentPostComposer.d.ts

@@ -165,6 +165,36 @@ export interface ParentPostComposerProps {
     requirePoll?: boolean;
     /** Allow landscape videos (default true on the parent post composer). */
     allowLandscapeVideos?: boolean;
+    /** Seed accounts for the `@`-mention autocomplete dropdown. Empty by
+     *  default — for a brand-new parent post we have no upstream body to
+     *  pull mentions from, so the dropdown only fills in once the user
+     *  types 3+ characters and the kit queries
+     *  `condenser_api.get_account_reputations`. Pass a list to surface
+     *  curated accounts (e.g. recent collaborators) at the top of the
+     *  suggestion list. */
+    mentionSeedAccounts?: string[];
+    /** Called when the user clicks a `@username` mention in the live
+     *  preview pane. Lets the consumer route to its own user-profile
+     *  page instead of letting the anchor's default `https://peakd.com/…`
+     *  href open peakd in a new tab. */
+    onUserClick?: (username: string) => void;
+    /** Called when the user clicks a Hive post link inside the live
+     *  preview pane (peakd / hive.blog / ecency / inleo URLs). Routes
+     *  to the consumer's own post-detail page. */
+    onNavigateToPost?: (author: string, permlink: string) => void;
+    /** Renderer URL overrides applied to the live preview pane. Same
+     *  shape as `HiveDetailPost.renderOptions` so consumers can use one
+     *  config object for both surfaces. */
+    renderOptions?: {
+        /** Replace user-mention URL (e.g. `(u) => '#/@' + u`). */
+        userLinkUrlFn?: (username: string) => string;
+        /** Replace hashtag URL (e.g. `(t) => '#/tag/' + t`). */
+        tagLinkUrlFn?: (tag: string) => string;
+        /** Replace the renderer's base URL used when `convertHiveUrls` is on. */
+        postBaseUrl?: string;
+        /** Replace the IPFS gateway prefix used for ipfs:// embeds. */
+        ipfsGateway?: string;
+    };
     /**
      * When set, the composer auto-saves its state to `localStorage[draftKey]`
      * (debounced, ~500 ms after the last change) and rehydrates from it on

package/dist/components/inlineComments/InlineCommentItem.d.ts

@@ -31,6 +31,10 @@ interface InlineCommentItemProps {
     /** Read function — controls the filled vs outline state of the
      *  bookmark item inside the kebab. */
     isCommentBookmarked?: (author: string, permlink: string) => boolean;
+    /** Seed accounts for the `@`-mention autocomplete in the reply
+     *  composer attached to this row. Forwarded from
+     *  `InlineCommentSection.mentionSeedAccounts`. */
+    mentionSeedAccounts?: string[];
     /** Called when the author of this comment taps Edit. Each row gates
      *  the entry-point internally to `comment.author === currentUser`. */
     onEditComment?: (data: {
@@ -70,5 +74,5 @@ interface InlineCommentItemProps {
         ipfsGateway?: string;
     };
 }
-export default function InlineCommentItem({ comment, allComments, onReply, onCancelReply, onCommentSubmit, activeReplyKey, currentUser, token, depth, onVotedRefresh, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, hiveIconUrl, onShareComment, onTipComment, onReportComment, onToggleCommentBookmark, isCommentBookmarked, onEditComment, onNavigateToPost, onUserClick, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, awaitingWalletApproval, renderOptions, }: InlineCommentItemProps): import("react/jsx-runtime").JSX.Element;
+export default function InlineCommentItem({ comment, allComments, onReply, onCancelReply, onCommentSubmit, activeReplyKey, currentUser, token, depth, onVotedRefresh, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, hiveIconUrl, onShareComment, onTipComment, onReportComment, onToggleCommentBookmark, isCommentBookmarked, mentionSeedAccounts, onEditComment, onNavigateToPost, onUserClick, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, awaitingWalletApproval, renderOptions, }: InlineCommentItemProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inlineComments/InlineCommentSection.d.ts

@@ -58,6 +58,10 @@ interface InlineCommentSectionProps {
      *  kebab with a Bookmark item on each comment row. */
     onToggleCommentBookmark?: (author: string, permlink: string) => void;
     isCommentBookmarked?: (author: string, permlink: string) => boolean;
+    /** Seed accounts for the `@`-mention autocomplete in every reply
+     *  composer rendered under this section — typically the post author
+     *  followed by every `@account` mentioned in the post body. */
+    mentionSeedAccounts?: string[];
     /** Called when the comment author taps Edit on one of their own
      *  comments. Each comment row gates the entry-point internally to
      *  `comment.author === currentUser`. Payload mirrors HiveDetailPost
@@ -75,5 +79,5 @@ interface InlineCommentSectionProps {
     /** Intercept intra-body Hive profile links in comment bodies. */
     onUserClick?: (username: string) => void;
 }
-export default function InlineCommentSection({ author, permlink, currentUser, token, onSubmitComment, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, reportedAuthors, reportedPosts, hiveIconUrl, onShareComment, onTipComment, onReportComment, onToggleCommentBookmark, isCommentBookmarked, onEditComment, onNavigateToPost, onUserClick, showVoteButton, alreadyVoted, parentTags, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, awaitingWalletApproval, renderOptions, }: InlineCommentSectionProps): import("react/jsx-runtime").JSX.Element;
+export default function InlineCommentSection({ author, permlink, currentUser, token, onSubmitComment, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, reportedAuthors, reportedPosts, hiveIconUrl, onShareComment, onTipComment, onReportComment, onToggleCommentBookmark, isCommentBookmarked, mentionSeedAccounts, onEditComment, onNavigateToPost, onUserClick, showVoteButton, alreadyVoted, parentTags, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, awaitingWalletApproval, renderOptions, }: InlineCommentSectionProps): import("react/jsx-runtime").JSX.Element;
 export {};