Hiyve Components - v1.0.0
    Preparing search index...

    Interface AssignmentEditorProps

    Props for the AssignmentEditor component.

    The AssignmentEditor provides a rich text editing interface using TipTap with assignment-specific features including due dates, time estimates, status tracking, user assignment, and per-user activity tracking.

    Features:

    • Rich text formatting (bold, italic, strikethrough, highlight)
    • Headings (H1, H2, H3)
    • Lists (bullet, numbered, task)
    • Tables with full editing support
    • Blockquotes and horizontal rules
    • Auto-save to S3 with debouncing
    • Due date and time estimate metadata
    • Status tracking (not started, in progress, on hold, completed)
    • User assignment with participant selection
    • Per-user activity tracking with session timers
    • Activity dashboard for monitoring team progress
    • Full customization (labels, icons, colors, styles)

    Basic usage inside HiyveProvider:

    import { AssignmentEditor } from '@hiyve/react-assignments';

    function AssignmentsSidebar() {
      return <AssignmentEditor title="Assignments" maxHeight={500} enableAutoSave />;
    }

    With customization:

    <AssignmentEditor
      title="Design Review"
      initialTitle="Sprint Planning Task"
      placeholder="Describe the assignment..."
      showMetadata
      showTabs
      enableAutoSave
      enableActivityTracking
      autoSaveInterval={5000}
      labels={{ saving: 'Saving...', saved: 'All changes saved' }}
      onSave={(assignment) => console.log('Saved:', assignment.id)}
      onStatusChange={(status) => console.log('Status:', status)}
    />
    interface AssignmentEditorProps {
        autoSaveInterval?: number;
        colors?: Partial<AssignmentEditorColors>;
        disabled?: boolean;
        enableActivityTracking?: boolean;
        enableAutoSave?: boolean;
        enableHighlight?: boolean;
        enableTableSupport?: boolean;
        enableTaskLists?: boolean;
        fileId?: string;
        fileLocation?: string;
        icons?: Partial<AssignmentEditorIcons>;
        initialAssignment?: AssignmentFile;
        initialContent?: JSONContent;
        initialTitle?: string;
        isOwner?: boolean;
        labels?: Partial<AssignmentEditorLabels>;
        maxHeight?: string | number;
        minHeight?: string | number;
        onAutoSave?: (fileId: string) => void;
        onBlur?: () => void;
        onChange?: (content: JSONContent) => void;
        onFocus?: () => void;
        onSave?: (assignment: AssignmentFile) => void;
        onSaveError?: (error: Error) => void;
        onStatusChange?: (status: AssignmentStatus) => void;
        onTitleChange?: (title: string) => void;
        placeholder?: string;
        readOnly?: boolean;
        showHeader?: boolean;
        showMetadata?: boolean;
        showTabs?: boolean;
        showTitleInput?: boolean;
        showToolbar?: boolean;
        styles?: Partial<AssignmentEditorStyles>;
        sx?: SxProps<Theme>;
        title?: string;
    }
    Index

    Properties

    autoSaveInterval? colors? disabled? enableActivityTracking? enableAutoSave? enableHighlight? enableTableSupport? enableTaskLists? fileId? fileLocation? icons? initialAssignment? initialContent? initialTitle? isOwner? labels? maxHeight? minHeight? onAutoSave? onBlur? onChange? onFocus? onSave? onSaveError? onStatusChange? onTitleChange? placeholder? readOnly? showHeader? showMetadata? showTabs? showTitleInput? showToolbar? styles? sx? title?

    Properties

    autoSaveInterval?: number

    Auto-save interval in milliseconds (default: 3000)

    colors?: Partial<AssignmentEditorColors>

    Custom colors

    disabled?: boolean

    Whether the panel is disabled

    enableActivityTracking?: boolean

    Enable per-user activity tracking with session timers (default: false)

    enableAutoSave?: boolean

    Enable auto-save to file storage (default: false)

    enableHighlight?: boolean

    Enable highlighting (default: true)

    enableTableSupport?: boolean

    Enable table support (default: true)

    enableTaskLists?: boolean

    Enable task list support (default: true)

    fileId?: string

    Existing file ID to update (for editing existing assignments)

    fileLocation?: string

    File storage location (default: '/Assignments')

    icons?: Partial<AssignmentEditorIcons>

    Custom icons

    initialAssignment?: AssignmentFile

    Initial assignment data to populate all fields

    initialContent?: JSONContent

    Initial content for the editor (TipTap JSON format)

    initialTitle?: string

    Initial title for the assignment

    isOwner?: boolean

    Override ownership check. When true, always treats user as owner.

    labels?: Partial<AssignmentEditorLabels>

    Custom labels for i18n support

    maxHeight?: string | number

    Maximum height before scrolling

    minHeight?: string | number

    Minimum height of the editor

    onAutoSave?: (fileId: string) => void

    Callback after successful auto-save with file ID

    onBlur?: () => void

    Callback when editor is blurred

    onChange?: (content: JSONContent) => void

    Callback when content changes

    onFocus?: () => void

    Callback when editor is focused

    onSave?: (assignment: AssignmentFile) => void

    Callback after successful save

    onSaveError?: (error: Error) => void

    Callback on save error

    onStatusChange?: (status: AssignmentStatus) => void

    Callback when assignment status changes

    onTitleChange?: (title: string) => void

    Callback when title changes

    placeholder?: string

    Placeholder text when editor is empty

    readOnly?: boolean

    Whether the editor is read-only

    showHeader?: boolean

    Show the header (default: true)

    showMetadata?: boolean

    Show the metadata panel with due date, time, status, and assignees (default: false)

    showTabs?: boolean

    Show the tab bar for switching between editor, activity, and my activity views (default: false)

    showTitleInput?: boolean

    Show the title input field (default: true)

    showToolbar?: boolean

    Show the toolbar (default: true)

    styles?: Partial<AssignmentEditorStyles>

    Custom styles

    sx?: SxProps<Theme>

    MUI sx styling prop

    title?: string

    Header title for the assignments panel (default: 'Assignments')

    Settings

    Member Visibility

    On This Page

    Properties