@sonhero/explanation-package 1.9.1

package/README.md

@@ -0,0 +1,40 @@
+# explanation package
+
+> Made with create-react-library
+
+[![NPM](https://img.shields.io/npm/v/examination.svg)](https://www.npmjs.com/package/examination) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Setup
+```bash
+yarn global add yalc
+```
+
+## Usage
+
+```bash
+# In explanation-package
+yarn
+yarn build
+
+yalc publish # Push package to yalc store
+nodemon -x 'yalc push' ## watch for change
+yarn start
+
+# In targeted app
+yalc add --link explanation-package
+
+# add to .gitignore
+# .yalc
+.yalc
+yalc.lock
+```
+
+## Unlink package
+```bash
+# In targeted app
+yarn remove explanation-package
+```
+
+## License
+
+MIT © [](https://github.com/)

package/dist/Quiz.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { IQuestion } from './conts';
+declare type Props = {
+    questions: IQuestion[];
+};
+declare const Quiz: ({ questions }: Props) => React.JSX.Element;
+export default Quiz;

package/dist/QuizComponent.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { FieldValues, UseFormReset } from 'react-hook-form';
+export declare type QuizComponentRef = {
+    onSubmit: ({ activityId, tabId, quizId, then }: {
+        activityId: string;
+        tabId: string;
+        quizId: string;
+        then?: (e: any) => void;
+    }) => void;
+    reset: UseFormReset<FieldValues>;
+};
+declare type Props = {
+    activeQuestion?: any;
+    document_id: string;
+    handleDownload: (param: any) => void;
+    getActiveQuestion: (id: string) => Promise<void>;
+    topic?: any;
+};
+declare const QuizComponent: {
+    ({ activeQuestion, document_id, handleDownload, getActiveQuestion, topic }: Props): React.JSX.Element;
+    displayName: string;
+};
+export default QuizComponent;

package/dist/button/ButtonCancelSubmit.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ButtonCancelSubmit: ({ submit, cancel, className, color, colorCancel, showOkButton, showCancelButton, revertFunction }: any) => React.JSX.Element;
+export default ButtonCancelSubmit;

package/dist/button/ErrorMessage.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+interface IProps {
+    className?: string;
+    children: ReactNode;
+}
+declare const ErrorMessage: ({ className, children }: IProps) => React.JSX.Element;
+export default ErrorMessage;

package/dist/button/SappButton.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IButtonProps } from '../conts';
+declare const SappButton: ({ title, onClick, className, link, size, full, disabled, loading, type, color, isUnderLine, isPadding, childClass }: IButtonProps) => React.JSX.Element;
+export default SappButton;

package/dist/button/YourAnswer.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type Props = {
+    show: boolean;
+};
+declare const YourAnswer: ({ show }: Props) => React.JSX.Element;
+export default YourAnswer;

package/dist/checkbox/HookFormCheckBox.d.ts

@@ -0,0 +1,19 @@
+import { Control } from 'react-hook-form';
+import React from 'react';
+interface IHookFormCheckBoxProps {
+    name: string;
+    control: Control<any>;
+    defaultValue?: string | boolean;
+    title?: string;
+    className?: string;
+    onChange?: React.ChangeEventHandler<any>;
+    checked?: string | boolean;
+    label?: string | undefined;
+    required?: boolean;
+    disabled?: boolean;
+    classNameTitle?: string;
+    state?: 'default' | 'error' | 'success';
+    size?: 'small' | 'medium' | 'lager';
+}
+declare const HookFormCheckBox: ({ name, control, defaultValue, title, className, onChange, checked, disabled, classNameTitle, size, state }: IHookFormCheckBoxProps) => React.JSX.Element;
+export default HookFormCheckBox;

package/dist/checkbox/HookFormCheckBoxGroup.d.ts

@@ -0,0 +1,37 @@
+import { Control } from 'react-hook-form';
+import React from 'react';
+interface IHookFormCheckBoxProps {
+    name: string;
+    control: Control<any>;
+    defaultValue?: string | boolean;
+    title?: string;
+    className?: string;
+    onChange?: (e: any) => void;
+    checked?: string | boolean;
+    isWrong?: boolean;
+    label?: string | undefined;
+    required?: boolean;
+    disabled?: boolean;
+    classNameTitle?: string;
+    options: Array<{
+        label?: string;
+        value: string | boolean;
+        description?: string;
+    }>;
+    direction?: 'horizontal' | 'vertical';
+    gap?: string;
+    justify?: 'between' | 'start' | 'center' | 'end';
+    multiple?: boolean;
+    state?: 'default' | 'error' | 'success';
+    size?: 'small' | 'medium' | 'lager';
+    corrects?: {
+        [key: string]: boolean;
+    };
+    toggle?: boolean;
+    positionCheckBox?: 'start' | 'center' | 'bottom';
+    lowerOptions?: boolean;
+    seprateLine?: boolean;
+    widthOptions?: string;
+}
+declare const HookFormCheckBoxGroup: ({ name, control, defaultValue, title, className, onChange, checked, isWrong, disabled, classNameTitle, options, direction, gap, justify, multiple, size, state, corrects, toggle, positionCheckBox, lowerOptions, seprateLine, widthOptions }: IHookFormCheckBoxProps) => React.JSX.Element;
+export default HookFormCheckBoxGroup;

package/dist/checkbox/SAPPCheckbox.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface IProps {
+    checked: boolean;
+    disabled?: boolean;
+    onChange: React.ChangeEventHandler<HTMLInputElement>;
+    className?: string;
+    name?: string;
+    value?: string | boolean;
+    state?: 'default' | 'error' | 'success' | 'primary';
+    size?: 'small' | 'medium' | 'lager';
+    lowerOptions?: boolean;
+}
+declare const SAPPCheckbox: ({ checked, disabled, onChange, className, value, state, size, lowerOptions }: IProps) => React.JSX.Element;
+export default SAPPCheckbox;

package/dist/common/ArrowIcon.d.ts

@@ -0,0 +1,9 @@
+import React, { ReactNode } from 'react';
+interface Props {
+    className?: string;
+    iconType?: 'chervon' | 'teeny';
+    right?: boolean;
+    children?: ReactNode;
+}
+declare const ArrowIcon: ({ className, iconType, right }: Props) => React.JSX.Element;
+export default ArrowIcon;

package/dist/common/CommentList.d.ts

@@ -0,0 +1,9 @@
+import React, { RefObject } from 'react';
+import { ICommment } from '../conts';
+interface IProps {
+    data?: ICommment;
+    editorRef?: RefObject<HTMLElement>;
+    commentRef?: RefObject<HTMLElement>;
+}
+declare const CommentList: ({ data, editorRef, commentRef }: IProps) => React.JSX.Element;
+export default CommentList;

package/dist/common/EssayRender.d.ts

@@ -0,0 +1,52 @@
+import React, { Dispatch, RefObject, SetStateAction } from 'react';
+import { ICommment, IFile, IFileAnswer, IRequirement } from '../conts';
+interface IProps {
+    activeQuestion: {
+        question_topic: {
+            files: IFile[];
+        };
+        requirements: IRequirement[];
+        exhibits: {
+            id: string;
+            description: string;
+            name: string;
+            files: IFile[];
+        }[];
+        short_answer: string | any;
+        answer_file: IFileAnswer;
+        question_content: string;
+        requirement_answers?: Array<any>;
+        grading_method?: string;
+    };
+    handleShowListRequirement: (e: any) => void;
+    showRequirement?: IRequirement | null;
+    showListRequirement: boolean;
+    handleShowRequirement: ({ description, index, name, files, explanation, answer_template_files }: {
+        description: string;
+        index: number;
+        name: string;
+        files: IFile[];
+        explanation: string;
+        answer_template_files?: string[];
+    }) => void;
+    setOpenPdf: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    handleShowExhibit: (data: {
+        id: string;
+        description: string;
+        index: number;
+        name: string;
+        files: IFile[];
+    }, e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    controlAnswer: any;
+    listRequirementRef: RefObject<HTMLDivElement>;
+    comment?: ICommment;
+    commentRef?: RefObject<HTMLDivElement>;
+    editorRef?: RefObject<HTMLDivElement>;
+    bodyRef?: RefObject<HTMLDivElement>;
+    submitted?: string;
+}
+declare const EssayRender: ({ activeQuestion, handleShowListRequirement, showListRequirement, showRequirement, handleShowRequirement, setOpenPdf, handleShowExhibit, controlAnswer, listRequirementRef, comment, commentRef, editorRef, bodyRef, submitted }: IProps) => React.JSX.Element;
+export default EssayRender;

package/dist/common/ExhibitMovableWindow.d.ts

@@ -0,0 +1,13 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import { IShowExhibit } from '../conts';
+interface IProps {
+    showExhibit: IShowExhibit;
+    setOpenPdf: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    setShowExhibit: Dispatch<SetStateAction<IShowExhibit | undefined>>;
+    exhibitText: string;
+}
+declare const ExhibitMovableWindow: ({ showExhibit, setOpenPdf, setShowExhibit, exhibitText }: IProps) => React.JSX.Element;
+export default ExhibitMovableWindow;

package/dist/common/ExhibitRender.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { IFile } from '../conts';
+interface IProps {
+    exhibits: Array<{
+        created_at: Date;
+        description: string;
+        files: IFile[];
+        id: string;
+        name: string;
+    }>;
+    handleShowExhibit: (params: {
+        id: string;
+        description: string;
+        index: number;
+        name: string;
+        files: IFile[];
+    }, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    exhibitText: string;
+}
+declare const ExhibitRender: ({ exhibits, handleShowExhibit, exhibitText }: IProps) => React.JSX.Element;
+export default ExhibitRender;

package/dist/common/Explanation.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { IRequirement } from '../conts';
+interface IProps {
+    activeQuestion: {
+        solution?: string;
+        confirmed?: boolean;
+    };
+    explanationTitle?: string;
+    showRequirement?: IRequirement | null;
+}
+declare const Explanation: ({ activeQuestion, explanationTitle, showRequirement }: IProps) => React.JSX.Element;
+export default Explanation;

package/dist/common/FileDisplay.d.ts

@@ -0,0 +1,14 @@
+import React, { Dispatch, SetStateAction } from 'react';
+interface IProps {
+    title?: string;
+    fileName?: string;
+    key?: number | string;
+    url?: string;
+    setOpenPdf?: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    isDownloadFile?: boolean;
+}
+declare const FileDisplay: ({ setOpenPdf, fileName, key, title, url, isDownloadFile }: IProps) => React.JSX.Element;
+export default FileDisplay;

package/dist/common/HookClick.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface ClickOutsideProps {
+    ref: React.RefObject<HTMLElement>;
+    callback: () => void;
+}
+declare const useClickOutside: ({ ref, callback }: ClickOutsideProps) => void;
+export default useClickOutside;

package/dist/common/Icon.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare type IconsPros = {
+    type?: string;
+    className?: string;
+};
+export default function Icon({ type, className }: IconsPros): import("react").JSX.Element;
+export declare const TimeIcon: () => import("react").JSX.Element;
+export {};

package/dist/common/MovableWindow.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface IProps {
+    children?: any;
+    getResize?: (data: any) => void;
+    position?: any;
+    onClick?: any;
+    zIndex?: number;
+    className?: string;
+}
+declare const MovableWindow: ({ children, getResize, position, onClick, zIndex, className }: IProps) => React.JSX.Element;
+export default MovableWindow;

package/dist/common/MoveQuestionBar.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+interface IProps {
+    activeQuestion: {
+        total_question: number;
+        index: string;
+        previous: {
+            id: string;
+        };
+        next: {
+            id: string;
+        };
+    };
+    getActiveQuestion: (id: string) => Promise<void>;
+}
+declare const MoveQuestionBar: ({ activeQuestion, getActiveQuestion }: IProps) => React.JSX.Element;
+export default MoveQuestionBar;

package/dist/common/SappIcon.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+declare type iconType = 'camera' | 'course_text' | 'course_video' | 'course_video_timeline' | 'arrow_left' | 'arrow_right' | 'arrow_down' | 'x';
+declare type SAPP_ICONS_TYPE = {
+    [key in iconType]: React.ReactNode;
+};
+declare type Props = {
+    icon: keyof SAPP_ICONS_TYPE;
+    className?: string;
+};
+declare const SappIcon: ({ icon, className }: Props) => React.JSX.Element;
+export default SappIcon;

package/dist/common/TopicDisplay.d.ts

@@ -0,0 +1,34 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import { IFile } from '../conts';
+interface Exhibit {
+    created_at: Date;
+    description: string;
+    files: IFile[];
+    id: string;
+    name: string;
+}
+interface IProps {
+    activeQuestion: {
+        question_topic?: {
+            description: string;
+            files: IFile[];
+            exhibits: Array<Exhibit>;
+        };
+        exhibits?: Array<Exhibit>;
+    };
+    isTwoColumn?: boolean;
+    setOpenPdf: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    handleShowExhibit: (params: {
+        id: string;
+        description: string;
+        index: number;
+        name: string;
+        files: IFile[];
+    }, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    exhibitText: string;
+}
+declare const TopicDisplay: ({ activeQuestion, setOpenPdf, handleShowExhibit, isTwoColumn, exhibitText }: IProps) => React.JSX.Element;
+export default TopicDisplay;

package/dist/components/ArrowIcon.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface Props {
+    className?: string;
+    iconType?: 'chervon' | 'teeny';
+    right?: boolean;
+}
+declare const ArrowIcon: ({ className, iconType, right }: Props) => React.JSX.Element;
+export default ArrowIcon;

package/dist/components/ExhibitMovableWindow.d.ts

@@ -0,0 +1,13 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import { IShowExhibit } from '../constant';
+interface IProps {
+    showExhibit: IShowExhibit;
+    setOpenPdf: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    setShowExhibit: Dispatch<SetStateAction<IShowExhibit | undefined>>;
+    exhibitText: string;
+}
+declare const ExhibitMovableWindow: ({ showExhibit, setOpenPdf, setShowExhibit, exhibitText }: IProps) => React.JSX.Element;
+export default ExhibitMovableWindow;

package/dist/components/ExhibitMovableWindowV2.d.ts

@@ -0,0 +1,13 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import { IShowExhibit } from '../constant';
+interface IProps {
+    showExhibit: IShowExhibit;
+    setOpenPdf: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+    } | undefined>>;
+    setShowExhibit: Dispatch<SetStateAction<IShowExhibit | undefined>>;
+    exhibitText: string;
+}
+declare const ExhibitMovableWindowV2: ({ showExhibit, setOpenPdf, setShowExhibit, exhibitText }: IProps) => React.JSX.Element;
+export default ExhibitMovableWindowV2;

package/dist/components/ExhibitRender.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { IFile } from '../constant';
+interface IProps {
+    exhibits: Array<{
+        description: string;
+        files: IFile[];
+        id: string;
+        name: string;
+    }>;
+    handleShowExhibit: (params: {
+        id: string;
+        description: string;
+        index: number;
+        name: string;
+        files: IFile[];
+    }, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    exhibitText: string;
+}
+declare const ExhibitRender: ({ exhibits, handleShowExhibit, exhibitText }: IProps) => React.JSX.Element;
+export default ExhibitRender;

package/dist/components/FileDisplay.d.ts

@@ -0,0 +1,15 @@
+import React, { Dispatch, SetStateAction } from 'react';
+interface IProps {
+    title?: string;
+    fileName?: string;
+    key?: number | string;
+    url?: string;
+    setOpenPdf?: Dispatch<SetStateAction<{
+        status: boolean;
+        url: string;
+        name?: string;
+    } | undefined>>;
+    isDownloadFile?: boolean;
+}
+declare const FileDisplay: ({ setOpenPdf, fileName, key, title, url, isDownloadFile }: IProps) => React.JSX.Element;
+export default FileDisplay;

package/dist/components/HookClick.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface ClickOutsideProps {
+    ref: React.RefObject<HTMLElement>;
+    callback: () => void;
+}
+declare const useClickOutside: ({ ref, callback }: ClickOutsideProps) => void;
+export default useClickOutside;

package/dist/components/Icon.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+declare type IconsPros = {
+    type?: string;
+    className?: string;
+};
+export default function Icon({ type, className }: IconsPros): React.JSX.Element;
+export declare const TimeIcon: () => React.JSX.Element;
+export declare const CollapseArrowIcon: React.MemoExoticComponent<({ selected, className }: {
+    selected?: boolean | undefined;
+    className?: string | undefined;
+}) => React.JSX.Element>;
+export declare const LoadingIcon: ({ loading, loadingPercentage, stroke }: {
+    loading?: boolean | undefined;
+    loadingPercentage?: number | undefined;
+    stroke?: "#ffffff" | "#404041" | undefined;
+}) => React.JSX.Element;
+export {};

package/dist/components/MovableWindow.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface IProps {
+    children?: any;
+    getResize?: (data: any) => void;
+    position?: any;
+    onClick?: any;
+    zIndex?: number;
+    className?: string;
+}
+declare const MovableWindow: ({ children, getResize, position, onClick, zIndex, className }: IProps) => React.JSX.Element;
+export default MovableWindow;

package/dist/components/SappIcon.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+declare type iconType = 'camera' | 'course_text' | 'course_video' | 'course_video_timeline' | 'arrow_left' | 'arrow_right' | 'arrow_down' | 'x';
+declare type SAPP_ICONS_TYPE = {
+    [key in iconType]: React.ReactNode;
+};
+declare type Props = {
+    icon: keyof SAPP_ICONS_TYPE;
+    className?: string;
+};
+declare const SappIcon: ({ icon, className }: Props) => React.JSX.Element;
+export default SappIcon;

package/dist/components/comment-list/commentList.styles.d.ts

@@ -0,0 +1 @@
+export declare const commentListStyles: import("styled-components").FlattenSimpleInterpolation;

package/dist/components/comment-list/index.d.ts

@@ -0,0 +1,11 @@
+import React, { RefObject } from 'react';
+import { ICommment } from 'constant';
+interface IProps {
+    data?: ICommment;
+    editorRef?: RefObject<HTMLElement>;
+    commentRef?: RefObject<HTMLDivElement>;
+    className?: string;
+    overlayClassName?: string;
+}
+declare const CommentList: ({ data, editorRef, commentRef, className, overlayClassName }: IProps) => React.JSX.Element;
+export default CommentList;

package/dist/components/comment-list-v2/commentListV2.styles.d.ts

@@ -0,0 +1 @@
+export declare const commentListStylesV2: import("styled-components").FlattenSimpleInterpolation;

package/dist/components/comment-list-v2/index.d.ts

@@ -0,0 +1,14 @@
+import React, { RefObject } from 'react';
+import { ICommment } from 'constant';
+interface IProps {
+    data?: ICommment;
+    editorRef?: RefObject<HTMLElement>;
+    commentRef?: RefObject<HTMLDivElement>;
+    className?: string;
+    overlayClassName?: string;
+    activeCommentId?: string | null;
+    setActiveCommentId: React.Dispatch<React.SetStateAction<string | null>>;
+    setOpenComment?: (status: boolean) => void;
+}
+declare const CommentListV2: ({ data, editorRef, commentRef, className, overlayClassName, activeCommentId, setActiveCommentId, setOpenComment, }: IProps) => React.JSX.Element;
+export default CommentListV2;

package/dist/components/comment-modal/CommentModal.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { GradingDetail } from 'constant';
+export interface CommentModalProps {
+    open: boolean;
+    detail: GradingDetail | null;
+    onClose: () => void;
+}
+declare const CommentModal: ({ open, detail }: CommentModalProps) => React.JSX.Element | null;
+export default CommentModal;

package/dist/components/comment-modal/commentModal.styles.d.ts

@@ -0,0 +1 @@
+export declare const commentModalStyles: import("styled-components").FlattenSimpleInterpolation;

package/dist/components/comment-modal/index.d.ts

@@ -0,0 +1,2 @@
+export { default as CommentModal } from './CommentModal';
+export type { CommentModalProps } from './CommentModal';

package/dist/components/common/button/ButtonCancelSubmit.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ButtonCancelSubmit: ({ submit, cancel, className, color, colorCancel, showOkButton, showCancelButton, revertFunction }: any) => React.JSX.Element;
+export default ButtonCancelSubmit;

package/dist/components/common/button/ErrorMessage.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+interface IProps {
+    className?: string;
+    children: ReactNode;
+}
+declare const ErrorMessage: ({ className, children }: IProps) => React.JSX.Element;
+export default ErrorMessage;

package/dist/components/common/button/SappButton.d.ts

@@ -0,0 +1,4 @@
+import { IButtonProps } from 'constant';
+import React from 'react';
+declare const SappButton: ({ title, onClick, className, link, size, full, disabled, loading, type, color, isUnderLine, isPadding, childClass }: IButtonProps) => React.JSX.Element;
+export default SappButton;

package/dist/components/common/button/YourAnswer.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type Props = {
+    show: boolean;
+};
+declare const YourAnswer: ({ show }: Props) => React.JSX.Element;
+export default YourAnswer;

package/dist/components/common/button/YourAnswerV2.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    show: boolean;
+    className?: string;
+};
+declare const YourAnswerV2: ({ show, className }: Props) => React.JSX.Element;
+export default YourAnswerV2;