@meith/theme-phasebook 0.28.0 → 0.29.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meith/theme-phasebook",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "description": "A theme for Meith with a familiar social shape, built on the default theme's slots.",
   "license": "MIT",
   "repository": {
@@ -20,9 +20,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@meith/theme-default": "^0.28.0",
-    "@meith/theme-kit": "^0.28.0",
-    "@meith/ui": "^0.28.0"
+    "@meith/theme-default": "^0.29.0",
+    "@meith/theme-kit": "^0.29.0",
+    "@meith/ui": "^0.29.0"
   },
   "peerDependencies": {
     "react": "^19.2.0"

package/src/shared.tsx

@@ -1,4 +1,10 @@
-import type { CountModel, PrefixModel, TimeModel, UserRefModel } from '@meith/theme-kit'
+import type {
+  CountModel,
+  GroupTagModel,
+  PrefixModel,
+  TimeModel,
+  UserRefModel,
+} from '@meith/theme-kit'
 import { Avatar, cn } from '@meith/ui'
 
 export const PAGE = 'mx-auto w-full max-w-6xl px-3 sm:px-4'
@@ -183,3 +189,11 @@ export function count(value: CountModel): string {
 export function plural(value: CountModel, one: string, many: string): string {
   return value.value === 1 ? one : many
 }
+
+export function groupTags(
+  groups: readonly GroupTagModel[] | undefined,
+  title: string | null,
+): readonly GroupTagModel[] {
+  if (groups !== undefined && groups.length > 0) return groups
+  return title === null ? [] : [{ title }]
+}

package/src/slots/member-profile.tsx

@@ -2,12 +2,13 @@ import type { MemberProfileModel, SlotCopy } from '@meith/theme-kit'
 import { fromSlotCopy } from '@meith/theme-kit'
 import { cn } from '@meith/ui'
 
-import { Circle, count, FEED, NUMERIC, PAGE, PILL, PILL_PRIMARY, Stamp } from '../shared'
+import { Circle, count, FEED, groupTags, NUMERIC, PAGE, PILL, PILL_PRIMARY, Stamp } from '../shared'
 
 export function MemberProfile({
   user,
   avatarUrl,
   title,
+  groups,
   joinedAt,
   lastVisitAt,
   postCount,
@@ -43,7 +44,11 @@ export function MemberProfile({
                 >
                   {user.username}
                 </h1>
-                {title !== null && <p className="text-sm text-muted-foreground">{title}</p>}
+                {groupTags(groups, title).map((group) => (
+                  <p key={group.title} className="text-sm text-muted-foreground">
+                    <span className={group.nameClass ?? undefined}>{group.title}</span>
+                  </p>
+                ))}
               </div>
             </div>
 

package/src/slots/post-bit.tsx

@@ -5,6 +5,7 @@ import { cn } from '@meith/ui'
 import {
   Circle,
   count,
+  groupTags,
   LINK,
   MUTED_LINK,
   NUMERIC,
@@ -155,7 +156,11 @@ export function PostBit({ post, select, regions, copy }: PostBitSlotModel & { co
           <p className="flex flex-wrap items-center gap-x-2 gap-y-1.5 text-[0.9375rem] leading-snug">
             <UserRef user={author} className="text-[0.9375rem]" />
             {author.badge != null && <GroupBadge badge={author.badge} />}
-            {author.title !== null && <Tag>{author.title}</Tag>}
+            {groupTags(author.groups, author.title).map((group) => (
+              <Tag key={group.title}>
+                <span className={group.nameClass ?? undefined}>{group.title}</span>
+              </Tag>
+            ))}
           </p>
 
           <p className="mt-1.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground">

package/src/theme.ts

@@ -70,7 +70,7 @@ import { WhoIsOnline } from './slots/who-is-online'
 export const phasebookTheme = defineTheme({
   key: 'phasebook',
   title: 'Phasebook',
-  version: '0.28.0',
+  version: '0.29.0',
   extends: defaultTheme,
   slots: {
     Shell,