@hydralms/components 0.1.0

package/dist/social/index.d.ts

@@ -0,0 +1,3 @@
+export { UserAvatar } from './user-avatar';
+export { PostCard } from './post-card';
+export type { UserAvatarProps, PostCardProps } from './types';

package/dist/social/post-card.d.ts

@@ -0,0 +1,2 @@
+import { PostCardProps } from './types';
+export declare function PostCard({ author, content, createdAt, updatedAt, actions, highlight, indentLevel, className, style, }: PostCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/social/types.d.ts

@@ -0,0 +1,59 @@
+import { ReactNode } from 'react';
+/**
+ * UserAvatar renders a user avatar image with an initials fallback
+ * and an optional role badge.
+ *
+ * @example
+ * <UserAvatar displayName="Jane Smith" role="instructor" />
+ */
+export interface UserAvatarProps {
+    /** User's display name (used for initials fallback) */
+    displayName: string;
+    /** URL of the avatar image */
+    avatarUrl?: string;
+    /** User role — shown as a tooltip or small badge */
+    role?: "student" | "instructor" | "ta" | "admin";
+    /** Whether to show the role badge */
+    showRoleBadge?: boolean;
+    /** Avatar size */
+    size?: "small" | "medium" | "large";
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}
+/**
+ * PostCard renders a single discussion post or announcement with author info,
+ * timestamp, content body, and optional action buttons.
+ *
+ * @example
+ * <PostCard
+ *   author={{ displayName: "Jane Smith", role: "instructor" }}
+ *   content="Welcome to the course!"
+ *   createdAt="2025-01-15T10:30:00Z"
+ * />
+ */
+export interface PostCardProps {
+    /** Post author information */
+    author: {
+        displayName: string;
+        avatarUrl?: string;
+        role?: string;
+    };
+    /** Post body content */
+    content: string;
+    /** Creation timestamp as ISO string */
+    createdAt: string;
+    /** Last update timestamp */
+    updatedAt?: string;
+    /** Action buttons rendered in the card footer */
+    actions?: ReactNode;
+    /** Highlight variant for special posts */
+    highlight?: "pinned" | "answer" | "none";
+    /** Indentation level for nested replies */
+    indentLevel?: number;
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}

package/dist/social/user-avatar.d.ts

@@ -0,0 +1,2 @@
+import { UserAvatarProps } from './types';
+export declare function UserAvatar({ displayName, avatarUrl, role, showRoleBadge, size, className, style, }: UserAvatarProps): import("react/jsx-runtime").JSX.Element;