@hydralms/components 0.1.3 → 0.3.0

package/dist/sections/AssignmentSubmission/types.d.ts

@@ -50,6 +50,12 @@ export interface AssignmentSubmissionProps {
     isSubmitting?: boolean;
     /** When true, disables all interactions */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/CertificateViewer/CertificateViewer.d.ts

@@ -1,2 +1,2 @@
 import { CertificateViewerProps } from './types';
-export declare function CertificateViewer({ recipientName, courseTitle, completionDate, organizationName, organizationLogo, signatory, certificateId, variant, showActions, onPrint, onDownload, className, style, }: CertificateViewerProps): import("react/jsx-runtime").JSX.Element;
+export declare function CertificateViewer({ recipientName, courseTitle, completionDate, organizationName, organizationLogo, signatory, certificateId, variant, showActions, onPrint, onDownload, isLoading, error, onRetry, className, style, }: CertificateViewerProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/CertificateViewer/certificate-variants.d.ts

@@ -0,0 +1,42 @@
+import { CertificateVariant } from './types';
+export interface CornerConfig {
+    size: number;
+    paths: {
+        d: string;
+        strokeWidth: number;
+    }[];
+    dots?: {
+        cx: number;
+        cy: number;
+        r: number;
+    }[];
+    color: string;
+}
+export declare const CORNER_CONFIGS: Record<CertificateVariant, CornerConfig | null>;
+export declare const CORNER_POSITIONS: readonly [{
+    readonly key: "tl";
+    readonly pos: "top-3 left-3";
+    readonly transform: undefined;
+}, {
+    readonly key: "tr";
+    readonly pos: "top-3 right-3";
+    readonly transform: "scaleX(-1)";
+}, {
+    readonly key: "bl";
+    readonly pos: "bottom-3 left-3";
+    readonly transform: "scaleY(-1)";
+}, {
+    readonly key: "br";
+    readonly pos: "bottom-3 right-3";
+    readonly transform: "scale(-1)";
+}];
+export interface DividerConfig {
+    lineColor: string;
+    motif: React.ReactNode;
+}
+export declare const DIVIDER_CONFIGS: Record<CertificateVariant, DividerConfig>;
+export declare const BACKGROUND_GLOW: Record<CertificateVariant, React.CSSProperties | null>;
+export declare const ICON_COLORS: Record<CertificateVariant, string>;
+export declare const HEADING_STYLES: Record<CertificateVariant, string>;
+export declare const COURSE_TITLE_COLORS: Record<CertificateVariant, string>;
+export declare const SERIF_VARIANTS: ReadonlySet<CertificateVariant>;

package/dist/sections/CertificateViewer/types.d.ts

@@ -1,9 +1,11 @@
+/** Available certificate visual styles */
+export type CertificateVariant = "classic" | "modern" | "elegant" | "academic" | "minimal" | "bold";
 /**
  * CertificateViewer section — a printable completion certificate.
  *
  * Displays a certificate with recipient details, course information,
- * signatory, and verification ID. Supports three visual variants:
- * classic, modern, and minimal.
+ * signatory, and verification ID. Supports six visual variants:
+ * classic, modern, elegant, academic, minimal, and bold.
  *
  * @example
  * <CertificateViewer
@@ -11,7 +13,7 @@
  *   courseTitle="Advanced React"
  *   completionDate="2025-03-01"
  *   organizationName="HydraLMS Academy"
- *   variant="modern"
+ *   variant="elegant"
  * />
  */
 export interface CertificateViewerProps {
@@ -32,14 +34,20 @@ export interface CertificateViewerProps {
     };
     /** Unique certificate ID */
     certificateId?: string;
-    /** Certificate template variant */
-    variant?: "classic" | "modern" | "minimal";
+    /** Certificate template variant @default "classic" */
+    variant?: CertificateVariant;
     /** Whether to show print/download actions */
     showActions?: boolean;
     /** Called when print is triggered */
     onPrint?: () => void;
     /** Called when download is triggered */
     onDownload?: () => void;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/CourseCatalog/CourseCatalog.d.ts

@@ -0,0 +1,2 @@
+import { CourseCatalogProps } from './types';
+export declare function CourseCatalog({ courses, categories, onCourseClick, onEnroll, viewMode: initialViewMode, allowViewToggle, showSearch, emptyMessage, readOnly, isLoading, error, onRetry, pageSize, currentPage, totalItems, onPageChange, className, style, }: CourseCatalogProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/CourseCatalog/types.d.ts

@@ -0,0 +1,80 @@
+/**
+ * CourseCatalog section — a searchable, filterable course catalog.
+ *
+ * Displays courses in a grid or list view with search, category tabs,
+ * view mode toggling, and optional pagination.
+ *
+ * @example
+ * <CourseCatalog
+ *   courses={courses}
+ *   categories={categories}
+ *   onCourseClick={(c) => navigate(`/courses/${c.uid}`)}
+ *   onEnroll={(c) => enroll(c.uid)}
+ * />
+ */
+export interface CourseCatalogProps {
+    /** Courses to display */
+    courses: CourseInfo[];
+    /** Optional categories for tab filtering */
+    categories?: {
+        uid: string;
+        label: string;
+    }[];
+    /** Called when the user clicks a course */
+    onCourseClick: (course: CourseInfo) => void;
+    /** Called when the user clicks enroll on a course */
+    onEnroll?: (course: CourseInfo) => void;
+    /** Layout view mode */
+    viewMode?: "grid" | "list";
+    /** Whether the user can toggle between grid and list */
+    allowViewToggle?: boolean;
+    /** Whether to show search */
+    showSearch?: boolean;
+    /** Empty state message */
+    emptyMessage?: string;
+    /** When true, disables interactions */
+    readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** Number of items per page (enables pagination when set with onPageChange) */
+    pageSize?: number;
+    /** Current page (1-indexed) */
+    currentPage?: number;
+    /** Total number of items (for server-side pagination) */
+    totalItems?: number;
+    /** Called when the user navigates to a different page */
+    onPageChange?: (page: number) => void;
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}
+export interface CourseInfo {
+    /** Unique identifier */
+    uid: string;
+    /** Course title */
+    title: string;
+    /** Course description */
+    description?: string;
+    /** Thumbnail image URL */
+    thumbnailUrl?: string;
+    /** Instructor info */
+    instructor?: {
+        displayName: string;
+        avatarUrl?: string;
+    };
+    /** Category UID for filtering */
+    categoryUid?: string;
+    /** Progress percentage (0-100) */
+    progress?: number;
+    /** Enrollment status */
+    enrollmentStatus?: "enrolled" | "completed" | "available" | "locked";
+    /** Number of enrolled students */
+    studentCount?: number;
+    /** Estimated duration (e.g. "12 hours") */
+    duration?: string;
+}

package/dist/sections/CourseOutline/CourseOutline.d.ts

@@ -1,2 +1,2 @@
 import { CourseOutlineProps } from './types';
-export declare function CourseOutline({ items, progress, courseTitle, activeItemUid, onItemClick, showOverallProgress, showDuration, showIcons, readOnly, className, style, }: CourseOutlineProps): import("react/jsx-runtime").JSX.Element;
+export declare function CourseOutline({ items, progress, courseTitle, activeItemUid, onItemClick, showOverallProgress, showDuration, showIcons, readOnly, isLoading, error, onRetry, className, style, }: CourseOutlineProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/CourseOutline/types.d.ts

@@ -42,6 +42,12 @@ export interface CourseOutlineProps {
     showIcons?: boolean;
     /** When true, disables all click interactions */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/DiscussionThread/DiscussionThread.d.ts

@@ -1,2 +1,2 @@
 import { DiscussionThreadProps } from './types';
-export declare function DiscussionThread({ title, rootPost, replies, currentUser, onReply, onToggleLike, onMarkAnswer, maxDepth, allowReplies, sortOrder, readOnly, className, style, }: DiscussionThreadProps): import("react/jsx-runtime").JSX.Element;
+export declare function DiscussionThread({ title, rootPost, replies, currentUser, onReply, onToggleLike, onMarkAnswer, maxDepth, allowReplies, sortOrder, readOnly, isLoading, error, onRetry, className, style, }: DiscussionThreadProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/DiscussionThread/types.d.ts

@@ -37,6 +37,12 @@ export interface DiscussionThreadProps {
     sortOrder?: "newest" | "oldest" | "most_liked";
     /** When true, disables interactions */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/EnrollmentWizard/EnrollmentWizard.d.ts

@@ -0,0 +1,2 @@
+import { EnrollmentWizardProps } from './types';
+export declare function EnrollmentWizard({ course, prerequisites, onEnroll, onCancel, enrollLabel, isEnrolling, isLoading, error, onRetry, className, style, }: EnrollmentWizardProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/EnrollmentWizard/types.d.ts

@@ -0,0 +1,66 @@
+/**
+ * EnrollmentWizard section — a multi-step course enrollment flow.
+ *
+ * Guides users through course details, prerequisite checks, and enrollment
+ * confirmation with visual step progress.
+ *
+ * @example
+ * <EnrollmentWizard
+ *   course={{ uid: "c1", title: "React 101", description: "Learn React" }}
+ *   prerequisites={[{ uid: "p1", label: "JavaScript Basics", isMet: true }]}
+ *   onEnroll={(courseUid) => enroll(courseUid)}
+ * />
+ */
+export interface EnrollmentWizardProps {
+    /** Course information to display */
+    course: EnrollmentCourse;
+    /** Prerequisites for enrollment */
+    prerequisites?: Prerequisite[];
+    /** Called when the user confirms enrollment */
+    onEnroll: (courseUid: string) => void;
+    /** Called when the user cancels the wizard */
+    onCancel?: () => void;
+    /** Label for the enroll button */
+    enrollLabel?: string;
+    /** Whether enrollment is in progress (shows spinner) */
+    isEnrolling?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}
+export interface EnrollmentCourse {
+    /** Course UID */
+    uid: string;
+    /** Course title */
+    title: string;
+    /** Course description */
+    description?: string;
+    /** Thumbnail image URL */
+    thumbnailUrl?: string;
+    /** Instructor info */
+    instructor?: {
+        displayName: string;
+        avatarUrl?: string;
+    };
+    /** Estimated duration */
+    duration?: string;
+    /** Syllabus bullet points */
+    syllabus?: string[];
+}
+export interface Prerequisite {
+    /** Unique identifier */
+    uid: string;
+    /** Prerequisite label */
+    label: string;
+    /** Whether this prerequisite has been met */
+    isMet: boolean;
+    /** Optional description */
+    description?: string;
+}

package/dist/sections/ExamSession/ExamSession.d.ts

@@ -1,2 +1,2 @@
 import { ExamSessionProps } from './types';
-export declare function ExamSession({ questions, initialAnswers, onSubmit, onAnswerChange, timeLimitSeconds, timeElapsedSeconds, autoSubmitOnTimeout, timeWarningThreshold, allowBackNavigation, confirmBeforeSubmit, examTitle, instructions, isSubmitting, readOnly, className, style, }: ExamSessionProps): import("react/jsx-runtime").JSX.Element;
+export declare function ExamSession({ questions, initialAnswers, onSubmit, onAnswerChange, timeLimitSeconds, timeElapsedSeconds, autoSubmitOnTimeout, timeWarningThreshold, allowBackNavigation, confirmBeforeSubmit, examTitle, instructions, questionMaterials, isSubmitting, readOnly, isLoading, error, onRetry, className, style, }: ExamSessionProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/ExamSession/types.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { QuestionData, SessionAnswer } from '../../questions/types';
+import { QuestionData, QuestionMaterial, SessionAnswer } from '../../questions/types';
 /**
  * ExamSession section — a formal timed exam experience.
  *
@@ -43,8 +43,19 @@ export interface ExamSessionProps {
     instructions?: ReactNode;
     /** Whether the submit action is in flight */
     isSubmitting?: boolean;
+    /**
+     * Related materials keyed by question UID. When provided, a "Materials"
+     * button appears in the question header, opening a drawer with content blocks.
+     */
+    questionMaterials?: QuestionMaterial[];
     /** When true, all inputs are disabled */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/FlashcardStudySession/FlashcardStudySession.d.ts

@@ -1,2 +1,2 @@
 import { FlashcardStudySessionProps } from './types';
-export declare function FlashcardStudySession({ cards, title, description, shuffled, onComplete, readOnly, className, style, }: FlashcardStudySessionProps): import("react/jsx-runtime").JSX.Element;
+export declare function FlashcardStudySession({ cards, title, description, shuffled, onComplete, readOnly, isLoading, error, onRetry, className, style, }: FlashcardStudySessionProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/FlashcardStudySession/types.d.ts

@@ -27,6 +27,12 @@ export interface FlashcardStudySessionProps {
     onComplete?: (stats: FlashcardSessionStats) => void;
     /** When true, disables card flipping */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/ForumBoard/ForumBoard.d.ts

@@ -0,0 +1,8 @@
+import { ForumBoardProps } from './types';
+/**
+ * ForumBoard — a topic listing view for a discussion forum.
+ *
+ * Displays a searchable, sortable list of discussion topics with author info,
+ * reply/like counts, timestamps, and new topic creation.
+ */
+export declare function ForumBoard({ title, topics, onTopicClick, onCreateTopic, sortOrder, onSortChange, searchQuery, onSearchChange, readOnly, isLoading, error, onRetry, pageSize, currentPage, totalItems, onPageChange, className, style, }: ForumBoardProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/ForumBoard/types.d.ts

@@ -0,0 +1,78 @@
+import { DiscussionUser } from '../DiscussionThread/types';
+export type ForumSortOrder = "newest" | "oldest" | "most_replies" | "most_liked";
+/**
+ * ForumBoard section — a topic listing view for a discussion forum.
+ *
+ * Displays a searchable, sortable list of discussion topics with author info,
+ * reply/like counts, and timestamps. Supports creating new topics inline.
+ *
+ * @example
+ * <ForumBoard
+ *   title="Class Discussion"
+ *   topics={topics}
+ *   onTopicClick={(uid) => openThread(uid)}
+ *   onCreateTopic={(title, content) => createTopic(title, content)}
+ * />
+ */
+export interface ForumBoardProps {
+    /** Forum title */
+    title?: string;
+    /** List of discussion topics */
+    topics: ForumTopic[];
+    /** The currently authenticated user (reserved for future use) */
+    currentUser?: DiscussionUser;
+    /** Called when a topic is clicked */
+    onTopicClick: (topicUid: string) => void;
+    /** Called when a new topic is created */
+    onCreateTopic?: (title: string, content: string) => void;
+    /** Current sort order */
+    sortOrder?: ForumSortOrder;
+    /** Called when sort order changes */
+    onSortChange?: (sort: ForumSortOrder) => void;
+    /** Current search query (controlled) */
+    searchQuery?: string;
+    /** Called when search query changes */
+    onSearchChange?: (query: string) => void;
+    /** When true, disables create and interactions */
+    readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** Number of items per page (enables pagination when set with onPageChange) */
+    pageSize?: number;
+    /** Current page (1-indexed) */
+    currentPage?: number;
+    /** Total number of items (for server-side pagination) */
+    totalItems?: number;
+    /** Called when the user navigates to a different page */
+    onPageChange?: (page: number) => void;
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}
+export interface ForumTopic {
+    /** Unique identifier */
+    uid: string;
+    /** Topic title */
+    title: string;
+    /** Topic author */
+    author: DiscussionUser;
+    /** Creation timestamp */
+    createdAt: string;
+    /** Number of replies */
+    replyCount: number;
+    /** Number of likes */
+    likeCount: number;
+    /** Timestamp of the most recent reply */
+    lastReplyAt?: string;
+    /** Whether this topic is pinned to the top */
+    isPinned?: boolean;
+    /** Whether this topic has a marked answer */
+    isAnswered?: boolean;
+    /** Preview text (first ~100 chars of content) */
+    preview?: string;
+}

package/dist/sections/GradebookTable/GradebookTable.d.ts

@@ -1,2 +1,2 @@
 import { GradebookTableProps } from './types';
-export declare function GradebookTable({ items, categories, overallGrade, showWeights, showCategoryTotals, onItemClick, readOnly, className, style, }: GradebookTableProps): import("react/jsx-runtime").JSX.Element;
+export declare function GradebookTable({ items, categories, overallGrade, showWeights, showCategoryTotals, onItemClick, readOnly, isLoading, error, onRetry, pageSize, currentPage, totalItems, onPageChange, className, style, }: GradebookTableProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/GradebookTable/types.d.ts

@@ -26,6 +26,20 @@ export interface GradebookTableProps {
     onItemClick?: (item: GradeItem) => void;
     /** When true, disables interactions */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** Number of items per page (enables pagination when set with onPageChange) */
+    pageSize?: number;
+    /** Current page (1-indexed) */
+    currentPage?: number;
+    /** Total number of items (for server-side pagination) */
+    totalItems?: number;
+    /** Called when the user navigates to a different page */
+    onPageChange?: (page: number) => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/LecturePlayer/LecturePlayer.d.ts

@@ -1,2 +1,2 @@
 import { LecturePlayerProps } from './types';
-export declare function LecturePlayer({ video, notes, layout, notesPanelWidth, notesPanelHeight, className, style, }: LecturePlayerProps): import("react/jsx-runtime").JSX.Element;
+export declare function LecturePlayer({ video, notes, layout, notesPanelWidth, notesPanelHeight, isLoading, error, onRetry, onComplete, className, style, }: LecturePlayerProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/LecturePlayer/types.d.ts

@@ -40,6 +40,14 @@ export interface LecturePlayerProps {
      * @default "240px"
      */
     notesPanelHeight?: string | number;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** Called when the video playback ends. */
+    onComplete?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/LessonPage/LessonPage.d.ts

@@ -1,2 +1,2 @@
 import { LessonPageProps } from './types';
-export declare function LessonPage({ title, blocks, isCompleted, onMarkComplete, onNextLesson, nextLessonTitle, estimatedDuration, showDuration, readOnly, className, style, }: LessonPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function LessonPage({ title, blocks, isCompleted, onMarkComplete, onNextLesson, nextLessonTitle, estimatedDuration, showDuration, readOnly, isLoading, error, onRetry, className, style, }: LessonPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/LessonPage/types.d.ts

@@ -33,6 +33,12 @@ export interface LessonPageProps {
     showDuration?: boolean;
     /** When true, disables interactive elements */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/PracticeQuiz/PracticeQuiz.d.ts

@@ -1,2 +1,2 @@
 import { PracticeQuizProps } from './types';
-export declare function PracticeQuiz({ questions: questionsProp, instantFeedback, allowRetry, onComplete, shuffled, readOnly, className, style, }: PracticeQuizProps): import("react/jsx-runtime").JSX.Element;
+export declare function PracticeQuiz({ questions: questionsProp, instantFeedback, allowRetry, onComplete, shuffled, readOnly, isLoading, error, onRetry, className, style, }: PracticeQuizProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/PracticeQuiz/types.d.ts

@@ -27,6 +27,12 @@ export interface PracticeQuizProps {
     shuffled?: boolean;
     /** When true, all inputs are disabled */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/ProgressDashboard/ProgressDashboard.d.ts

@@ -1,2 +1,2 @@
 import { ProgressDashboardProps } from './types';
-export declare function ProgressDashboard({ overallProgress, totalTimeSpent, modules, recentActivity, streak, achievements, recentActivityLimit, onModuleClick, className, style, }: ProgressDashboardProps): import("react/jsx-runtime").JSX.Element;
+export declare function ProgressDashboard({ overallProgress, totalTimeSpent, modules, recentActivity, streak, achievements, recentActivityLimit, onModuleClick, isLoading, error, onRetry, className, style, }: ProgressDashboardProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/ProgressDashboard/types.d.ts

@@ -32,6 +32,12 @@ export interface ProgressDashboardProps {
     recentActivityLimit?: number;
     /** Called when the user clicks a module */
     onModuleClick?: (moduleUid: string) => void;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/QuizSession/QuizSession.d.ts

@@ -1,2 +1,2 @@
 import { QuizSessionProps } from './types';
-export declare function QuizSession({ questions, initialAnswers, onSubmit, onAnswerChange, timeElapsedSeconds, timeLimitSeconds, isSubmitting, readOnly, className, style, }: QuizSessionProps): import("react/jsx-runtime").JSX.Element;
+export declare function QuizSession({ questions, initialAnswers, onSubmit, onAnswerChange, timeElapsedSeconds, timeLimitSeconds, questionMaterials, isSubmitting, readOnly, isLoading, error, onRetry, className, style, }: QuizSessionProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/QuizSession/types.d.ts

@@ -1,4 +1,4 @@
-import { QuestionData, SessionAnswer } from '../../questions/types';
+import { QuestionData, QuestionMaterial, SessionAnswer } from '../../questions/types';
 /**
  * QuizSession section — a complete assessment session experience.
  *
@@ -37,8 +37,19 @@ export interface QuizSessionProps {
     timeLimitSeconds?: number;
     /** Whether the submit action is currently in flight */
     isSubmitting?: boolean;
+    /**
+     * Related materials keyed by question UID. When provided, a "Materials"
+     * button appears in the question header, opening a drawer with content blocks.
+     */
+    questionMaterials?: QuestionMaterial[];
     /** When true, all inputs are disabled (e.g. after submission) */
     readOnly?: boolean;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
     /** CSS class name for the root element */
     className?: string;
     /** Inline styles for the root element */

package/dist/sections/RequirementsChecklist/RequirementsChecklist.d.ts

@@ -0,0 +1,8 @@
+import { RequirementsChecklistProps } from './types';
+/**
+ * RequirementsChecklist — shows completion requirements with checked/unchecked status.
+ *
+ * Displays a vertical list of requirements with an overall progress bar.
+ * Incomplete items can be clicked to navigate to the relevant content.
+ */
+export declare function RequirementsChecklist({ title, requirements, onRequirementClick, isLoading, error, onRetry, className, style, }: RequirementsChecklistProps): import("react/jsx-runtime").JSX.Element;

package/dist/sections/RequirementsChecklist/types.d.ts

@@ -0,0 +1,43 @@
+/**
+ * RequirementsChecklist section — shows completion requirements with progress tracking.
+ *
+ * Displays a list of requirements with checked/unchecked status and an overall
+ * progress bar. Incomplete items can be clicked to navigate to the relevant content.
+ *
+ * @example
+ * <RequirementsChecklist
+ *   title="Certificate Requirements"
+ *   requirements={requirements}
+ *   onRequirementClick={(uid) => navigateTo(uid)}
+ * />
+ */
+export interface RequirementsChecklistProps {
+    /** Section title */
+    title?: string;
+    /** List of requirements to display */
+    requirements: Requirement[];
+    /** Called when the user clicks an incomplete requirement */
+    onRequirementClick?: (uid: string) => void;
+    /** Render skeleton placeholders instead of content */
+    isLoading?: boolean;
+    /** Error message — renders an error state with optional retry */
+    error?: string | null;
+    /** Called when the user clicks retry in the error state */
+    onRetry?: () => void;
+    /** CSS class name for the root element */
+    className?: string;
+    /** Inline styles for the root element */
+    style?: React.CSSProperties;
+}
+export interface Requirement {
+    /** Unique identifier */
+    uid: string;
+    /** Requirement label */
+    label: string;
+    /** Optional description */
+    description?: string;
+    /** Whether this requirement has been completed */
+    completed: boolean;
+    /** Optional action label for clickable items */
+    actionLabel?: string;
+}

package/dist/sections/ResourceLibrary/ResourceLibrary.d.ts

@@ -1,2 +1,2 @@
 import { ResourceLibraryProps } from './types';
-export declare function ResourceLibrary({ resources, categories, onResourceClick, onDownload, viewMode: initialViewMode, allowViewToggle, showSearch, emptyMessage, readOnly, className, style, }: ResourceLibraryProps): import("react/jsx-runtime").JSX.Element;
+export declare function ResourceLibrary({ resources, categories, onResourceClick, onDownload, viewMode: initialViewMode, allowViewToggle, showSearch, emptyMessage, readOnly, isLoading, error, onRetry, pageSize, currentPage, totalItems, onPageChange, className, style, }: ResourceLibraryProps): import("react/jsx-runtime").JSX.Element;