hive-react-kit 0.10.0 → 0.10.1

package/README.md

@@ -69,7 +69,9 @@ import type { Video, Comment, Wallet as WalletType } from 'hive-react-kit/types'
 
 ### Composer Components
 
-- **PostComposer** - Rich markdown composer with live preview (@snapie/renderer), image/audio/video upload, paste & drag-drop, GIF search, emoji picker (500+, 9 categories), template picker, code blocks with copy, and @ mention. See [PostComposer docs](docs/PostComposer.md)
+- **PostComposer** — Rich markdown composer with live preview (@snapie/renderer), image/audio/video upload, paste & drag-drop, GIF search, emoji picker (500+, 9 categories), template picker, code blocks with copy, @ mention, locked + user tags (split on space/comma/Enter), reward routing dropdown, beneficiaries editor with auto `threespeakfund` 10% lock on video posts, and upvote-on-publish toggle. See [PostComposer docs](docs/PostComposer.md).
+- **ParentPostComposer** — Full-screen blog composer with title (≤120 chars), description (≤120 chars with counter), markdown body, **side-by-side live preview always on**, the same toolbar features as PostComposer, local draft persistence to `localStorage`, and the 3Speak v2 video pipeline (`upload_id` → `/api/upload/finalize`). See [ParentPostComposer docs](docs/ParentPostComposer.md).
+- **BeneficiariesEditor** — Standalone modal that powers the beneficiaries flow in both composers — per-row +/- spinners, Hive avatars, favourites strip, total/remaining indicator, mobile bottom-sheet layout, and the auto `threespeakfund` 10% lock when `hasVideo`. See [BeneficiariesEditor docs](docs/BeneficiariesEditor.md).
 
 ### Modal Components
 

package/dist/build.css

@@ -21,6 +21,7 @@
     --color-orange-400: oklch(75% 0.183 55.934);
     --color-orange-500: oklch(70.5% 0.213 47.604);
     --color-orange-900: oklch(40.8% 0.123 38.172);
+    --color-amber-200: oklch(92.4% 0.12 95.746);
     --color-amber-300: oklch(87.9% 0.169 91.605);
     --color-amber-400: oklch(82.8% 0.189 84.429);
     --color-amber-500: oklch(76.9% 0.188 70.08);
@@ -42,6 +43,7 @@
     --color-emerald-300: oklch(84.5% 0.143 164.978);
     --color-emerald-400: oklch(76.5% 0.177 163.223);
     --color-emerald-500: oklch(69.6% 0.17 162.48);
+    --color-emerald-600: oklch(59.6% 0.145 163.225);
     --color-emerald-900: oklch(37.8% 0.077 168.94);
     --color-sky-300: oklch(82.8% 0.111 230.318);
     --color-sky-400: oklch(74.6% 0.16 232.661);
@@ -85,6 +87,7 @@
     --color-black: #000;
     --color-white: #fff;
     --spacing: 0.25rem;
+    --breakpoint-2xl: 96rem;
     --container-xs: 20rem;
     --container-sm: 24rem;
     --container-md: 28rem;
@@ -324,6 +327,9 @@
   .inset-x-0 {
     inset-inline: calc(var(--spacing) * 0);
   }
+  .inset-x-3 {
+    inset-inline: calc(var(--spacing) * 3);
+  }
   .inset-y-0 {
     inset-block: calc(var(--spacing) * 0);
   }
@@ -438,6 +444,9 @@
   .left-4 {
     left: calc(var(--spacing) * 4);
   }
+  .isolate {
+    isolation: isolate;
+  }
   .z-0 {
     z-index: 0;
   }
@@ -477,6 +486,9 @@
   .z-\[9999\] {
     z-index: 9999;
   }
+  .z-\[10000\] {
+    z-index: 10000;
+  }
   .col-span-1 {
     grid-column: span 1 / span 1;
   }
@@ -781,6 +793,9 @@
   .h-\[400px\] {
     height: 400px;
   }
+  .h-\[480px\] {
+    height: 480px;
+  }
   .h-\[calc\(100vh-200px\)\] {
     height: calc(100vh - 200px);
   }
@@ -823,6 +838,9 @@
   .max-h-\[90vh\] {
     max-height: 90vh;
   }
+  .max-h-\[92vh\] {
+    max-height: 92vh;
+  }
   .max-h-\[300px\] {
     max-height: 300px;
   }
@@ -859,6 +877,9 @@
   .min-h-screen {
     min-height: 100vh;
   }
+  .w-1\.5 {
+    width: calc(var(--spacing) * 1.5);
+  }
   .w-1\/2 {
     width: calc(1 / 2 * 100%);
   }
@@ -1027,6 +1048,9 @@
   .max-w-none {
     max-width: none;
   }
+  .max-w-screen-2xl {
+    max-width: var(--breakpoint-2xl);
+  }
   .max-w-sm {
     max-width: var(--container-sm);
   }
@@ -1102,6 +1126,9 @@
   .resize {
     resize: both;
   }
+  .resize-none {
+    resize: none;
+  }
   .resize-y {
     resize: vertical;
   }
@@ -1129,6 +1156,9 @@
   .flex-col {
     flex-direction: column;
   }
+  .flex-col-reverse {
+    flex-direction: column-reverse;
+  }
   .flex-row {
     flex-direction: row;
   }
@@ -1358,6 +1388,10 @@
   .rounded-xl {
     border-radius: var(--radius-xl);
   }
+  .rounded-t-2xl {
+    border-top-left-radius: var(--radius-2xl);
+    border-top-right-radius: var(--radius-2xl);
+  }
   .rounded-b-lg {
     border-bottom-right-radius: var(--radius-lg);
     border-bottom-left-radius: var(--radius-lg);
@@ -1419,12 +1453,24 @@
   .border-\[\#e31337\] {
     border-color: #e31337;
   }
+  .border-amber-500\/30 {
+    border-color: color-mix(in srgb, oklch(76.9% 0.188 70.08) 30%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-amber-500) 30%, transparent);
+    }
+  }
   .border-amber-700\/40 {
     border-color: color-mix(in srgb, oklch(55.5% 0.163 48.998) 40%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
       border-color: color-mix(in oklab, var(--color-amber-700) 40%, transparent);
     }
   }
+  .border-blue-300\/40 {
+    border-color: color-mix(in srgb, oklch(80.9% 0.105 251.813) 40%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-blue-300) 40%, transparent);
+    }
+  }
   .border-blue-400 {
     border-color: var(--color-blue-400);
   }
@@ -1482,6 +1528,12 @@
   .border-gray-800 {
     border-color: var(--color-gray-800);
   }
+  .border-gray-800\/60 {
+    border-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 60%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-gray-800) 60%, transparent);
+    }
+  }
   .border-gray-900 {
     border-color: var(--color-gray-900);
   }
@@ -1551,6 +1603,12 @@
     background-color: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(255, 255, 255, 0.08);
   }
+  .bg-\[\#0c1014\]\/95 {
+    background-color: color-mix(in oklab, #0c1014 95%, transparent);
+  }
+  .bg-\[\#0f1216\] {
+    background-color: #0f1216;
+  }
   .bg-\[\#0f1419\] {
     background-color: #0f1419;
   }
@@ -1563,6 +1621,9 @@
   .bg-\[\#1a1e22\] {
     background-color: #1a1e22;
   }
+  .bg-\[\#1a1e22\]\/90 {
+    background-color: color-mix(in oklab, #1a1e22 90%, transparent);
+  }
   .bg-\[\#1f2429\] {
     background-color: #1f2429;
   }
@@ -1581,6 +1642,9 @@
   .bg-\[\#262b30\] {
     background-color: #262b30;
   }
+  .bg-\[\#15181c\] {
+    background-color: #15181c;
+  }
   .bg-\[\#212529\] {
     background-color: #212529;
   }
@@ -1596,6 +1660,12 @@
   .bg-\[\#e31337\]\/15 {
     background-color: color-mix(in oklab, #e31337 15%, transparent);
   }
+  .bg-amber-500\/10 {
+    background-color: color-mix(in srgb, oklch(76.9% 0.188 70.08) 10%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-amber-500) 10%, transparent);
+    }
+  }
   .bg-amber-500\/15 {
     background-color: color-mix(in srgb, oklch(76.9% 0.188 70.08) 15%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1695,6 +1765,12 @@
       background-color: color-mix(in oklab, var(--color-blue-600) 20%, transparent);
     }
   }
+  .bg-blue-600\/80 {
+    background-color: color-mix(in srgb, oklch(54.6% 0.245 262.881) 80%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-blue-600) 80%, transparent);
+    }
+  }
   .bg-blue-900 {
     background-color: var(--color-blue-900);
   }
@@ -1722,12 +1798,18 @@
       background-color: color-mix(in oklab, var(--color-blue-900) 50%, transparent);
     }
   }
+  .bg-emerald-400 {
+    background-color: var(--color-emerald-400);
+  }
   .bg-emerald-500\/15 {
     background-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 15%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
       background-color: color-mix(in oklab, var(--color-emerald-500) 15%, transparent);
     }
   }
+  .bg-emerald-600 {
+    background-color: var(--color-emerald-600);
+  }
   .bg-emerald-900\/40 {
     background-color: color-mix(in srgb, oklch(37.8% 0.077 168.94) 40%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1806,6 +1888,12 @@
       background-color: color-mix(in oklab, var(--color-gray-900) 30%, transparent);
     }
   }
+  .bg-gray-900\/40 {
+    background-color: color-mix(in srgb, oklch(21% 0.034 264.665) 40%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-gray-900) 40%, transparent);
+    }
+  }
   .bg-gray-900\/50 {
     background-color: color-mix(in srgb, oklch(21% 0.034 264.665) 50%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1944,6 +2032,9 @@
   .bg-slate-950 {
     background-color: var(--color-slate-950);
   }
+  .bg-transparent {
+    background-color: transparent;
+  }
   .bg-white {
     background-color: var(--color-white);
   }
@@ -2200,6 +2291,12 @@
   .pr-1 {
     padding-right: calc(var(--spacing) * 1);
   }
+  .pr-2 {
+    padding-right: calc(var(--spacing) * 2);
+  }
+  .pr-2\.5 {
+    padding-right: calc(var(--spacing) * 2.5);
+  }
   .pr-3 {
     padding-right: calc(var(--spacing) * 3);
   }
@@ -2233,6 +2330,12 @@
   .pb-8 {
     padding-bottom: calc(var(--spacing) * 8);
   }
+  .pl-0\.5 {
+    padding-left: calc(var(--spacing) * 0.5);
+  }
+  .pl-1 {
+    padding-left: calc(var(--spacing) * 1);
+  }
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
   }
@@ -2397,6 +2500,9 @@
   .text-\[\#ff8fa3\] {
     color: #ff8fa3;
   }
+  .text-amber-200 {
+    color: var(--color-amber-200);
+  }
   .text-amber-300 {
     color: var(--color-amber-300);
   }
@@ -2581,6 +2687,9 @@
   .underline {
     text-decoration-line: underline;
   }
+  .underline-offset-2 {
+    text-underline-offset: 2px;
+  }
   .placeholder-\[\#9ca3b0\] {
     &::placeholder {
       color: #9ca3b0;
@@ -2694,6 +2803,11 @@
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
     backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
   }
+  .backdrop-blur-\[1px\] {
+    --tw-backdrop-blur: blur(1px);
+    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+  }
   .backdrop-blur-md {
     --tw-backdrop-blur: blur(var(--blur-md));
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
@@ -2879,6 +2993,13 @@
       }
     }
   }
+  .hover\:border-blue-400 {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-blue-400);
+      }
+    }
+  }
   .hover\:border-blue-500 {
     &:hover {
       @media (hover: hover) {
@@ -2917,6 +3038,20 @@
       }
     }
   }
+  .hover\:bg-\[\#10161c\] {
+    &:hover {
+      @media (hover: hover) {
+        background-color: #10161c;
+      }
+    }
+  }
+  .hover\:bg-\[\#c51231\] {
+    &:hover {
+      @media (hover: hover) {
+        background-color: #c51231;
+      }
+    }
+  }
   .hover\:bg-black {
     &:hover {
       @media (hover: hover) {
@@ -2944,6 +3079,13 @@
       }
     }
   }
+  .hover\:bg-blue-500 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-blue-500);
+      }
+    }
+  }
   .hover\:bg-blue-600 {
     &:hover {
       @media (hover: hover) {
@@ -2968,6 +3110,13 @@
       }
     }
   }
+  .hover\:bg-emerald-500 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-emerald-500);
+      }
+    }
+  }
   .hover\:bg-gray-50 {
     &:hover {
       @media (hover: hover) {
@@ -3037,6 +3186,16 @@
       }
     }
   }
+  .hover\:bg-gray-800\/40 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 40%, transparent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-gray-800) 40%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-gray-800\/50 {
     &:hover {
       @media (hover: hover) {
@@ -3071,6 +3230,16 @@
       }
     }
   }
+  .hover\:bg-red-500\/10 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 10%, transparent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-red-500) 10%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-red-700 {
     &:hover {
       @media (hover: hover) {
@@ -3362,21 +3531,46 @@
       color: var(--color-gray-500);
     }
   }
+  .disabled\:opacity-30 {
+    &:disabled {
+      opacity: 30%;
+    }
+  }
+  .disabled\:opacity-40 {
+    &:disabled {
+      opacity: 40%;
+    }
+  }
   .disabled\:opacity-50 {
     &:disabled {
       opacity: 50%;
     }
   }
+  .sm\:inset-x-auto {
+    @media (width >= 40rem) {
+      inset-inline: auto;
+    }
+  }
   .sm\:-right-2 {
     @media (width >= 40rem) {
       right: calc(var(--spacing) * -2);
     }
   }
+  .sm\:right-4 {
+    @media (width >= 40rem) {
+      right: calc(var(--spacing) * 4);
+    }
+  }
   .sm\:-bottom-2 {
     @media (width >= 40rem) {
       bottom: calc(var(--spacing) * -2);
     }
   }
+  .sm\:bottom-4 {
+    @media (width >= 40rem) {
+      bottom: calc(var(--spacing) * 4);
+    }
+  }
   .sm\:m-0 {
     @media (width >= 40rem) {
       margin: calc(var(--spacing) * 0);
@@ -3448,6 +3642,11 @@
       -webkit-line-clamp: unset;
     }
   }
+  .sm\:block {
+    @media (width >= 40rem) {
+      display: block;
+    }
+  }
   .sm\:flex {
     @media (width >= 40rem) {
       display: flex;
@@ -3533,6 +3732,11 @@
       height: calc(var(--spacing) * 64);
     }
   }
+  .sm\:h-\[560px\] {
+    @media (width >= 40rem) {
+      height: 560px;
+    }
+  }
   .sm\:h-auto {
     @media (width >= 40rem) {
       height: auto;
@@ -3568,6 +3772,11 @@
       width: calc(var(--spacing) * 9);
     }
   }
+  .sm\:w-10 {
+    @media (width >= 40rem) {
+      width: calc(var(--spacing) * 10);
+    }
+  }
   .sm\:w-12 {
     @media (width >= 40rem) {
       width: calc(var(--spacing) * 12);
@@ -3598,6 +3807,11 @@
       width: calc(var(--spacing) * 48);
     }
   }
+  .sm\:w-auto {
+    @media (width >= 40rem) {
+      width: auto;
+    }
+  }
   .sm\:w-full {
     @media (width >= 40rem) {
       width: 100%;
@@ -3658,6 +3872,11 @@
       justify-content: center;
     }
   }
+  .sm\:justify-end {
+    @media (width >= 40rem) {
+      justify-content: flex-end;
+    }
+  }
   .sm\:gap-3 {
     @media (width >= 40rem) {
       gap: calc(var(--spacing) * 3);
@@ -3712,6 +3931,11 @@
       border-radius: 0;
     }
   }
+  .sm\:rounded-xl {
+    @media (width >= 40rem) {
+      border-radius: var(--radius-xl);
+    }
+  }
   .sm\:border {
     @media (width >= 40rem) {
       border-style: var(--tw-border-style);
@@ -3785,6 +4009,11 @@
       padding-inline: calc(var(--spacing) * 6);
     }
   }
+  .sm\:py-2 {
+    @media (width >= 40rem) {
+      padding-block: calc(var(--spacing) * 2);
+    }
+  }
   .sm\:py-2\.5 {
     @media (width >= 40rem) {
       padding-block: calc(var(--spacing) * 2.5);
@@ -3816,6 +4045,12 @@
       line-height: var(--tw-leading, var(--text-2xl--line-height));
     }
   }
+  .sm\:text-3xl {
+    @media (width >= 40rem) {
+      font-size: var(--text-3xl);
+      line-height: var(--tw-leading, var(--text-3xl--line-height));
+    }
+  }
   .sm\:text-base {
     @media (width >= 40rem) {
       font-size: var(--text-base);
@@ -4139,11 +4374,31 @@
       display: table-cell;
     }
   }
+  .lg\:h-\[640px\] {
+    @media (width >= 64rem) {
+      height: 640px;
+    }
+  }
+  .lg\:h-full {
+    @media (width >= 64rem) {
+      height: 100%;
+    }
+  }
+  .lg\:min-h-0 {
+    @media (width >= 64rem) {
+      min-height: calc(var(--spacing) * 0);
+    }
+  }
   .lg\:w-48 {
     @media (width >= 64rem) {
       width: calc(var(--spacing) * 48);
     }
   }
+  .lg\:flex-1 {
+    @media (width >= 64rem) {
+      flex: 1;
+    }
+  }
   .lg\:grid-cols-3 {
     @media (width >= 64rem) {
       grid-template-columns: repeat(3, minmax(0, 1fr));
@@ -4169,6 +4424,28 @@
       gap: calc(var(--spacing) * 8);
     }
   }
+  .lg\:overflow-hidden {
+    @media (width >= 64rem) {
+      overflow: hidden;
+    }
+  }
+  .lg\:overflow-y-auto {
+    @media (width >= 64rem) {
+      overflow-y: auto;
+    }
+  }
+  .lg\:border-r {
+    @media (width >= 64rem) {
+      border-right-style: var(--tw-border-style);
+      border-right-width: 1px;
+    }
+  }
+  .lg\:border-b-0 {
+    @media (width >= 64rem) {
+      border-bottom-style: var(--tw-border-style);
+      border-bottom-width: 0px;
+    }
+  }
   .lg\:px-8 {
     @media (width >= 64rem) {
       padding-inline: calc(var(--spacing) * 8);

package/dist/components/HiveDetailPost.d.ts

@@ -10,7 +10,7 @@ export interface HiveDetailPostProps {
      * `voteWeight` is non-null when the composer's upvote-on-publish toggle is enabled
      * (1–100, step 0.25) — consumer should broadcast vote+comment atomically.
      */
-    onSubmitComment?: (parentAuthor: string, parentPermlink: string, body: string, voteWeight?: number | null) => void | boolean | Promise<void | boolean>;
+    onSubmitComment?: (parentAuthor: string, parentPermlink: string, body: string, voteWeight?: number | null, beneficiaries?: import('../utils/beneficiaries').Beneficiary[]) => void | boolean | Promise<void | boolean>;
     /**
      * Show the upvote-on-publish toggle in the post's comment composer. Default false (opt-in).
      * Auto-hidden internally when the current user has already voted the post.
@@ -28,6 +28,18 @@ export interface HiveDetailPostProps {
      * Typically wired to a user setting.
      */
     defaultReward?: import('../utils/commentOptions').RewardOption;
+    /**
+     * Beneficiaries pre-populated into every comment composer on this detail
+     * page (top-level reply + nested sub-comment replies). Typically wired to
+     * the user's app-wide default beneficiaries setting.
+     */
+    defaultBeneficiaries?: import('../utils/beneficiaries').Beneficiary[];
+    /**
+     * Suggested beneficiary chips shown inside every comment composer's editor
+     * on this detail page — typically the user's previously-used beneficiary
+     * presets pulled from local history.
+     */
+    beneficiaryFavorites?: import('../utils/beneficiaries').Beneficiary[];
     /**
      * Initial percent (1–100) for the post's upvote slider AND every comment
      * composer's "upvote-on-publish" / comment-upvote slider on this page.
@@ -107,5 +119,5 @@ export interface HiveDetailPostProps {
     /** Called when user clicks "View parent post" — navigate to the parent post. */
     onNavigateToPost?: (author: string, permlink: string) => void;
 }
-export declare function HiveDetailPost({ author, permlink, currentUser, onUpvote, onSubmitComment, onClickCommentUpvote, onReblog, onShare, onTip, onReport, onShareComment, onTipComment, onReportComment, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, reportedAuthors, reportedPosts, hiveIconUrl, backgroundColor, onBack, onUserClick, onNavigateToPost, onVotePoll, showVoteButton, processBody, defaultReward, defaultVotePercent, voteWeightStep, allowLandscapeVideos, renderOptions, }: HiveDetailPostProps): import("react/jsx-runtime").JSX.Element;
+export declare function HiveDetailPost({ author, permlink, currentUser, onUpvote, onSubmitComment, onClickCommentUpvote, onReblog, onShare, onTip, onReport, onShareComment, onTipComment, onReportComment, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, reportedAuthors, reportedPosts, hiveIconUrl, backgroundColor, onBack, onUserClick, onNavigateToPost, onVotePoll, showVoteButton, processBody, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, renderOptions, }: HiveDetailPostProps): import("react/jsx-runtime").JSX.Element;
 export default HiveDetailPost;

package/dist/components/actionButtons/PostActionButton.d.ts

@@ -19,8 +19,10 @@ export interface PostActionButtonProps {
     /** Called when user submits a comment. Frontend handles signing/broadcast.
      *  Return `false` to indicate the operation was cancelled — the composer text will be preserved.
      *  `voteWeight` is non-null when the composer's upvote-on-publish toggle is enabled
-     *  (1–100, step 0.25) — consumer should broadcast vote+comment atomically. */
-    onSubmitComment?: (parentAuthor: string, parentPermlink: string, body: string, voteWeight?: number | null) => void | boolean | Promise<void | boolean>;
+     *  (1–100, step 0.25) — consumer should broadcast vote+comment atomically.
+     *  `beneficiaries` is the post-lock beneficiary list selected in the composer
+     *  (already includes threespeakfund 10% on video posts). */
+    onSubmitComment?: (parentAuthor: string, parentPermlink: string, body: string, voteWeight?: number | null, beneficiaries?: import('../../utils/beneficiaries').Beneficiary[]) => void | boolean | Promise<void | boolean>;
     /** Show the upvote-on-publish toggle in the comment composer.
      *  Auto-hidden when the current user has already voted this post. */
     showVoteButton?: boolean;
@@ -28,6 +30,10 @@ export interface PostActionButtonProps {
     parentTags?: string[];
     /** Default reward routing seeded into the comment composer. */
     defaultReward?: import('../../utils/commentOptions').RewardOption;
+    /** Beneficiaries pre-populated into the comment composer. */
+    defaultBeneficiaries?: import('../../utils/beneficiaries').Beneficiary[];
+    /** Suggested beneficiary chips shown inside the composer's editor. */
+    beneficiaryFavorites?: import('../../utils/beneficiaries').Beneficiary[];
     /** Initial percent for the upvote slider when opened (1–100). Default 100. */
     defaultVotePercent?: number;
     /** Slider precision used by both the post upvote slider AND the comment composer's
@@ -77,5 +83,5 @@ export interface PostActionButtonProps {
      *  the comment icon, so the tooltip can show what they wrote. */
     myReplyKey?: string;
 }
-export declare function PostActionButton({ author, permlink, currentUser: currentUserProp, hiveValue, hiveIconUrl, payoutTooltip, initialVotes, initialCommentsCount, onUpvote, onSubmitComment, onComments, onReblog, onShare, onTip, onReport, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, disableCommentsModal, onClickCommentIcon, onClickCommentCount, hasCommented, myReplyKey, showVoteButton, parentTags, defaultReward, defaultVotePercent, voteWeightStep, allowLandscapeVideos, }: PostActionButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function PostActionButton({ author, permlink, currentUser: currentUserProp, hiveValue, hiveIconUrl, payoutTooltip, initialVotes, initialCommentsCount, onUpvote, onSubmitComment, onComments, onReblog, onShare, onTip, onReport, onClickCommentUpvote, ecencyToken, threeSpeakApiKey, giphyApiKey, templateToken, templateApiBaseUrl, disableCommentsModal, onClickCommentIcon, onClickCommentCount, hasCommented, myReplyKey, showVoteButton, parentTags, defaultReward, defaultBeneficiaries, beneficiaryFavorites, defaultVotePercent, voteWeightStep, allowLandscapeVideos, }: PostActionButtonProps): import("react/jsx-runtime").JSX.Element;
 export default PostActionButton;