@blogmcp/community 0.1.0 → 0.3.0

package/src/vue.ts

@@ -1,5 +1,7 @@
 /**
- * `<KbDiscussion>`, `<KbNoticeForm>`, `<KbMyCommunity>` for Vue / Nuxt: each mounts its element on the
+ * `<KbDiscussion>`, `<KbNoticeForm>`, `<KbMyCommunity>`, (M2) `<KbNotificationCentre>`, `<KbBadge>`,
+ * `<KbMemberSettings>`, `<KbProfile>`, `<KbWelcome>` and (M3) `<KbForum>`, `<KbForumCategory>`, `<KbTopic>`,
+ * `<KbForumSearch>`, `<KbFollowButton>`, `<KbForumModeration>` for Vue / Nuxt: each mounts its element on the
  * client, after hydration, and removes it on unmount. Each renders one empty `<div>` as the mount point —
  * nothing else, on the server or the client — so the element sits where the component does and the page's
  * markup is otherwise the site's alone.
@@ -12,7 +14,23 @@
 import { defineComponent, h, onBeforeUnmount, onMounted, ref, watch, type PropType } from 'vue'
 import type { CommunityTransport } from '@blogmcp/sdk/community'
 import type { CommunityRoutes } from './core/attrs'
-import type { MountDiscussionOptions, MountMyCommunityOptions, MountNoticeFormOptions } from './mount'
+import type { DiscussionRealtime, TopicRealtime } from './core/realtime'
+import type {
+  MountBadgeOptions,
+  MountDiscussionOptions,
+  MountFollowButtonOptions,
+  MountForumCategoryOptions,
+  MountForumModerationOptions,
+  MountForumOptions,
+  MountForumSearchOptions,
+  MountMemberSettingsOptions,
+  MountMyCommunityOptions,
+  MountNoticeFormOptions,
+  MountNotificationCentreOptions,
+  MountProfileOptions,
+  MountTopicOptions,
+  MountWelcomeOptions,
+} from './mount'
 
 type Mounter<O> = (o: O & { container: Element }) => () => void
 
@@ -60,6 +78,8 @@ export const KbDiscussion = defineComponent({
     pollMs: Number,
     nonce: String,
     transport: Function as PropType<CommunityTransport>,
+    /** M2: `createRealtimeSession` of `@blogmcp/sdk/community/realtime`. */
+    realtime: Function as PropType<DiscussionRealtime>,
   },
   setup(props) {
     return useMount<MountDiscussionOptions>(
@@ -113,4 +133,252 @@ export const KbMyCommunity = defineComponent({
   },
 })
 
-export type { MountDiscussionOptions, MountNoticeFormOptions, MountMyCommunityOptions, CommunityRoutes }
+export const KbNotificationCentre = defineComponent({
+  name: 'KbNotificationCentre',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountNotificationCentreOptions>(
+      'notification-centre',
+      () => defined({ ...props }) as MountNotificationCentreOptions,
+      async () => (await import('./mount')).mountNotificationCentre as Mounter<MountNotificationCentreOptions>,
+    )
+  },
+})
+
+export const KbBadge = defineComponent({
+  name: 'KbBadge',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    routes: Object as PropType<CommunityRoutes>,
+    pollMs: Number,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountBadgeOptions>(
+      'badge',
+      () => defined({ ...props }) as MountBadgeOptions,
+      async () => (await import('./mount')).mountBadge as Mounter<MountBadgeOptions>,
+    )
+  },
+})
+
+export const KbMemberSettings = defineComponent({
+  name: 'KbMemberSettings',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    swPath: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountMemberSettingsOptions>(
+      'member-settings',
+      () => defined({ ...props }) as MountMemberSettingsOptions,
+      async () => (await import('./mount')).mountMemberSettings as Mounter<MountMemberSettingsOptions>,
+    )
+  },
+})
+
+export const KbProfile = defineComponent({
+  name: 'KbProfile',
+  props: {
+    handle: { type: String, required: true },
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountProfileOptions>(
+      'profile',
+      () => defined({ ...props }) as MountProfileOptions,
+      async () => (await import('./mount')).mountProfile as Mounter<MountProfileOptions>,
+    )
+  },
+})
+
+export const KbWelcome = defineComponent({
+  name: 'KbWelcome',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountWelcomeOptions>(
+      'welcome',
+      () => defined({ ...props }) as MountWelcomeOptions,
+      async () => (await import('./mount')).mountWelcome as Mounter<MountWelcomeOptions>,
+    )
+  },
+})
+
+// ───────────────────────── M3: the forum (m3-contracts.md §5.3) ─────────────────────────
+
+export const KbForum = defineComponent({
+  name: 'KbForum',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountForumOptions>(
+      'forum',
+      () => defined({ ...props }) as MountForumOptions,
+      async () => (await import('./mount')).mountForum as Mounter<MountForumOptions>,
+    )
+  },
+})
+
+export const KbForumCategory = defineComponent({
+  name: 'KbForumCategory',
+  props: {
+    slug: { type: String, required: true },
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountForumCategoryOptions>(
+      'forum-category',
+      () => defined({ ...props }) as MountForumCategoryOptions,
+      async () => (await import('./mount')).mountForumCategory as Mounter<MountForumCategoryOptions>,
+    )
+  },
+})
+
+export const KbTopic = defineComponent({
+  name: 'KbTopic',
+  props: {
+    conversationId: { type: String, required: true },
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    pollMs: Number,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+    /** `createRealtimeSession` of `@blogmcp/sdk/community/realtime`. */
+    realtime: Function as PropType<TopicRealtime>,
+  },
+  setup(props) {
+    return useMount<MountTopicOptions>(
+      'topic',
+      () => defined({ ...props }) as MountTopicOptions,
+      async () => (await import('./mount')).mountTopic as Mounter<MountTopicOptions>,
+    )
+  },
+})
+
+export const KbForumSearch = defineComponent({
+  name: 'KbForumSearch',
+  props: {
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    signInHref: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountForumSearchOptions>(
+      'forum-search',
+      () => defined({ ...props }) as MountForumSearchOptions,
+      async () => (await import('./mount')).mountForumSearch as Mounter<MountForumSearchOptions>,
+    )
+  },
+})
+
+export const KbFollowButton = defineComponent({
+  name: 'KbFollowButton',
+  props: {
+    targetKind: { type: String as PropType<'conversation' | 'category'>, required: true },
+    targetId: { type: String, required: true },
+    following: { type: Boolean, default: undefined },
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountFollowButtonOptions>(
+      'follow-button',
+      () => defined({ ...props }) as MountFollowButtonOptions,
+      async () => (await import('./mount')).mountFollowButton as Mounter<MountFollowButtonOptions>,
+    )
+  },
+})
+
+export const KbForumModeration = defineComponent({
+  name: 'KbForumModeration',
+  props: {
+    categoryId: String,
+    apiBase: String,
+    siteBase: String,
+    lang: String,
+    routes: Object as PropType<CommunityRoutes>,
+    nonce: String,
+    transport: Function as PropType<CommunityTransport>,
+  },
+  setup(props) {
+    return useMount<MountForumModerationOptions>(
+      'forum-moderation',
+      () => defined({ ...props }) as MountForumModerationOptions,
+      async () => (await import('./mount')).mountForumModeration as Mounter<MountForumModerationOptions>,
+    )
+  },
+})
+
+export type {
+  MountDiscussionOptions,
+  MountNoticeFormOptions,
+  MountMyCommunityOptions,
+  MountNotificationCentreOptions,
+  MountBadgeOptions,
+  MountMemberSettingsOptions,
+  MountProfileOptions,
+  MountWelcomeOptions,
+  MountForumOptions,
+  MountForumCategoryOptions,
+  MountTopicOptions,
+  MountForumSearchOptions,
+  MountFollowButtonOptions,
+  MountForumModerationOptions,
+  CommunityRoutes,
+  DiscussionRealtime,
+  TopicRealtime,
+}