Options
All
  • Public
  • Public/Protected
  • All
Menu

sqc-ui-components

Index

Namespaces

Type Aliases

Functions

Type Aliases

EditorParams

EditorParams: { richtextMode?: boolean; value: string; onChange: any }

Type declaration

  • Optional richtextMode?: boolean

    if true, display as a RichTextEditor, otherwise, display as a textarea

  • value: string
  • onChange:function
    • onChange(val: string): void

PreviewParams

PreviewParams: { question: Question }

Type declaration

  • question: Question

QuestionsContextProps

QuestionsContextProps: { questions: Question[]; questionsDispatch: React.Dispatch<QuestionDispatchAction>; selectedQuestion: number; setSelectedQuestion: React.Dispatch<React.SetStateAction<number>> }

Type declaration

  • questions: Question[]
  • questionsDispatch: React.Dispatch<QuestionDispatchAction>
  • selectedQuestion: number
  • setSelectedQuestion: React.Dispatch<React.SetStateAction<number>>

QuizEditorParams

QuizEditorParams: { question: Question; richtextMode?: boolean; warning?: ReactNode; onChange: any }

Type declaration

  • question: Question

    The quiz question object

  • Optional richtextMode?: boolean

    Whether richtext mode is enabled

  • Optional warning?: ReactNode

    Warning message component to display

  • onChange:function
    • onChange(question: { choices: { answer: string; id?: string; isCorrect: boolean }[]; id?: string; question: string }): void

    • Function to handle any changes on the question, including adding/editing/removing answers

      Parameters

      • question: { choices: { answer: string; id?: string; isCorrect: boolean }[]; id?: string; question: string }
        • choices: { answer: string; id?: string; isCorrect: boolean }[]
        • Optional id?: string
        • question: string

      Returns void

ToastContextProps

ToastContextProps: { toast: any; toastError: any; toastSuccess: any }

Type declaration

ToastParams

ToastParams: { text: string; type?: "default" | "success" | "error"; onClose: any }

Type declaration

  • text: string

    Toast message

  • Optional type?: "default" | "success" | "error"

    Toast style

  • onClose:function
    • onClose(): void

Functions

Editor

Preview

QuestionsProvider

  • QuestionsProvider(__namedParameters: { children: ReactNode }): Element

QuizEditor

Toast

  • Toast component is used to display toasts in the application. It receives props like type , text and onClose for styling, text and close icon respectively. It can be used to display different types of toast in the application like success, error, default.

    Parameters

    Returns Element

ToastProvider

  • ToastProvider(__namedParameters: { children: ReactNode }): Element

deepEqual

  • deepEqual(obj1: any, obj2: any): boolean

  • Check if 2 objects/values are deeply equal. Doesn't work with circular references.

    example
    const value1 = 10;
    const value2 = 10;
    console.log(deepEqual(value1, value2)); // Output: true

    const obj1 = {a: 1, b: 2};
    const obj2 = {a: 1, b: 2};
    console.log(deepEqual(obj1, obj2)); // Output: true

    const obj1 = {a: 1, b: 2};
    const obj2 = {a: 1, b: 3};
    console.log(deepEqual(obj1, obj2)); // Output: false

    const obj1 = {a: 1, b: 2};
    const obj2 = {a: 1, c: 2};
    console.log(deepEqual(obj1, obj2)); // Output: false

    Parameters

    • obj1: any
    • obj2: any

    Returns boolean

downloadAsFile

  • downloadAsFile(__namedParameters: { data: string; fileName?: string; fileType?: string }): void

  • Trigger download file with provided content, file name and MIME type

    example
    downloadAsFile({
      data: '{"key": "value"}',
      fileName: 'myFile.json',
      fileType: 'application/json',
    })

    Parameters

    • __namedParameters: { data: string; fileName?: string; fileType?: string }
      • data: string

        file content

      • Optional fileName?: string

        Generated file name

      • Optional fileType?: string

        File MIME type

    Returns void

formatDateStamp

  • formatDateStamp(date: Date): string

  • Returns a formatted date string by combining the current date, month, year and timestamp.

    example
    const today = new Date('August 5, 2021 14:30:00');
    const formattedDate = formatDateStamp(today);
    console.log(formattedDate); // 20210805-1628165400000

    Parameters

    • date: Date

    Returns string

useQuestionsContext

useToastContext

Generated using TypeDoc