@digabi/exam-engine-core 19.0.2 → 19.0.4-alpha.1

package/dist/components/grading/AnnotationPopup.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare const AnnotationPopup: React.FunctionComponent<{
+    setMessage: (message: string) => void;
+    message: string;
+    popupVisible: boolean;
+    position: {
+        left: number;
+        top: number;
+    };
+}>;
+//# sourceMappingURL=AnnotationPopup.d.ts.map

package/dist/components/grading/AnnotationPopup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationPopup.d.ts","sourceRoot":"","sources":["../../../src/components/grading/AnnotationPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAE1D,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACpD,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,YAAY,EAAE,OAAO,CAAA;IACrB,QAAQ,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAA;CACxC,CAuCA,CAAA"}

package/dist/components/grading/AnnotationPopup.js

@@ -0,0 +1,20 @@
+import React, { useEffect, useRef, useState } from 'react';
+export const AnnotationPopup = ({ setMessage, message, popupVisible, position }) => {
+    const popupRef = useRef(null);
+    const [field, setField] = useState('');
+    useEffect(() => {
+        setField(message);
+    }, [message]);
+    return popupVisible ? (React.createElement("div", { style: {
+            display: popupVisible ? 'block' : 'none',
+            position: 'absolute',
+            left: position.left,
+            top: position.top,
+        }, className: "popup", ref: popupRef },
+        React.createElement("div", { className: "popup add-annotation-popup" },
+            React.createElement("form", { onSubmit: (e) => e.preventDefault() },
+                React.createElement("input", { onChange: (e) => setField(e.target.value), value: field, className: "add-annotation-text", type: "text", autoFocus: true }),
+                React.createElement("i", { className: "fa fa-comment" }),
+                React.createElement("button", { type: "submit", "data-i18n": "arpa.annotate", onClick: () => setMessage(field) }, "Merkitse"))))) : (React.createElement(React.Fragment, null));
+};
+//# sourceMappingURL=AnnotationPopup.js.map

package/dist/components/grading/AnnotationPopup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationPopup.js","sourceRoot":"","sources":["../../../src/components/grading/AnnotationPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE1D,MAAM,CAAC,MAAM,eAAe,GAKvB,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvD,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE7C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAA;IAE9C,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,OAAO,CAAC,CAAA;IACnB,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,OAAO,YAAY,CAAC,CAAC,CAAC,CACpB,6BACE,KAAK,EAAE;YACL,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;YACxC,QAAQ,EAAE,UAAU;YACpB,IAAI,EAAE,QAAQ,CAAC,IAAI;YACnB,GAAG,EAAE,QAAQ,CAAC,GAAG;SAClB,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,QAAQ;QAEb,6BAAK,SAAS,EAAC,4BAA4B;YACzC,8BAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE;gBACvC,+BACE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,KAAK,EAAE,KAAK,EACZ,SAAS,EAAC,qBAAqB,EAC/B,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,IAAI,GACf;gBACF,2BAAG,SAAS,EAAC,eAAe,GAAK;gBACjC,gCAAQ,IAAI,EAAC,QAAQ,eAAW,eAAe,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,eAEvE,CACJ,CACH,CACF,CACP,CAAC,CAAC,CAAC,CACF,yCAAK,CACN,CAAA;AACH,CAAC,CAAA"}

package/dist/components/grading/AnswerWithAnnotations.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Annotation } from '../..';
+export declare const AnswerWithAnnotations: React.FunctionComponent<{
+    type: 'richText' | 'text';
+    value?: string;
+    annotations: {
+        pregrading: Annotation[];
+        censoring: Annotation[];
+    };
+}>;
+//# sourceMappingURL=AnswerWithAnnotations.d.ts.map

package/dist/components/grading/AnswerWithAnnotations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnswerWithAnnotations.d.ts","sourceRoot":"","sources":["../../../src/components/grading/AnswerWithAnnotations.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAIlC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAC1D,IAAI,EAAE,UAAU,GAAG,MAAM,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,EAAE;QAAE,UAAU,EAAE,UAAU,EAAE,CAAC;QAAC,SAAS,EAAE,UAAU,EAAE,CAAA;KAAE,CAAA;CACnE,CAmBA,CAAA"}

package/dist/components/grading/AnswerWithAnnotations.js

@@ -0,0 +1,15 @@
+import React, { useLayoutEffect, useRef } from 'react';
+import { renderAnnotations } from '../../renderAnnotations';
+export const AnswerWithAnnotations = ({ type, annotations, value }) => {
+    const answerRef = useRef(null);
+    useLayoutEffect(() => {
+        console.log('LAYOUT', annotations.censoring.length);
+        if (answerRef.current) {
+            answerRef.current.innerHTML = value || '';
+            renderAnnotations(answerRef.current, annotations.pregrading, annotations.censoring);
+        }
+    });
+    return type === 'richText' ? (React.createElement("div", { ref: answerRef })) : (React.createElement("span", { className: "text-answer text-answer--single-line" },
+        React.createElement("span", { className: "e-inline-block", ref: answerRef }, value)));
+};
+//# sourceMappingURL=AnswerWithAnnotations.js.map

package/dist/components/grading/AnswerWithAnnotations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnswerWithAnnotations.js","sourceRoot":"","sources":["../../../src/components/grading/AnswerWithAnnotations.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAG3D,MAAM,CAAC,MAAM,qBAAqB,GAI7B,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE;IACpC,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE9C,eAAe,CAAC,GAAG,EAAE;QACnB,OAAO,CAAC,GAAG,CAAC,QAAQ,EAAE,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;QACnD,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,SAAS,CAAC,OAAO,CAAC,SAAS,GAAG,KAAK,IAAI,EAAE,CAAA;YACzC,iBAAiB,CAAC,SAAS,CAAC,OAAO,EAAE,WAAW,CAAC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;SACpF;IACH,CAAC,CAAC,CAAA;IACF,OAAO,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,CAC3B,6BAAK,GAAG,EAAE,SAAS,GAAI,CACxB,CAAC,CAAC,CAAC,CACF,8BAAM,SAAS,EAAC,sCAAsC;QACpD,8BAAM,SAAS,EAAC,gBAAgB,EAAC,GAAG,EAAE,SAAS,IAC5C,KAAK,CACD,CACF,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/components/grading/ChoiceAnswer.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ExamComponentProps } from '../../createRenderChildNodes';
+declare function ChoiceAnswer({ element, renderChildNodes }: ExamComponentProps): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof ChoiceAnswer>;
+export default _default;
+//# sourceMappingURL=ChoiceAnswer.d.ts.map

package/dist/components/grading/ChoiceAnswer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChoiceAnswer.d.ts","sourceRoot":"","sources":["../../../src/components/grading/ChoiceAnswer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAA;AAuEjE,iBAAS,YAAY,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,EAAE,kBAAkB,eAyCtE;;AAED,wBAAuC"}

package/dist/components/grading/ChoiceAnswer.js

@@ -0,0 +1,57 @@
+import classNames from 'classnames';
+import React, { useContext } from 'react';
+import { getNumericAttribute, mapChildElements, query } from '../../dom-utils';
+import { useExamTranslation } from '../../i18n';
+import { ScreenReaderOnly } from '../ScreenReaderOnly';
+import { findMultiChoiceFromGradingStructure, ResultsContext } from '../context/ResultsContext';
+import ResultsExamQuestionAutoScore from './internal/QuestionAutoScore';
+function ChoiceAnswerOption({ renderChildNodes, selected, element, questionId, direction, isCorrect, }) {
+    const { t } = useExamTranslation();
+    const className = element.getAttribute('class');
+    const optionId = element.getAttribute('option-id');
+    const content = (React.createElement("div", { className: classNames('e-choice-answer-option e-column', className, {
+            'e-choice-answer-option--selected': selected,
+        }) }, renderChildNodes(element)));
+    const Content = ({ narrow = false }) => (React.createElement(React.Fragment, null,
+        React.createElement("input", { type: "radio", className: classNames('e-radio-button', { 'e-column e-column--narrow': narrow }), name: String(questionId), value: optionId, checked: selected, readOnly: true }),
+        content,
+        isCorrect && React.createElement(ScreenReaderOnly, null, t('screen-reader.correct-answer'))));
+    return direction === 'vertical' ? (React.createElement("div", { className: "e-mrg-b-1" },
+        React.createElement("label", { className: classNames('e-columns', {
+                'e-correct-answer-left': isCorrect,
+                'e-columns--inline': query(element, ['image', 'video']) == null /* Force full width for options containing responsive media */,
+            }) },
+            React.createElement(Content, { narrow: true })))) : (React.createElement("div", { className: "e-column e-mrg-b-1" },
+        React.createElement("label", { className: classNames('e-block e-text-center', { 'e-correct-answer-bottom': isCorrect }) },
+            React.createElement(Content, null))));
+}
+function ChoiceAnswer({ element, renderChildNodes }) {
+    const { answersByQuestionId, gradingStructure } = useContext(ResultsContext);
+    const questionId = getNumericAttribute(element, 'question-id');
+    const answer = answersByQuestionId[questionId];
+    const direction = element.getAttribute('direction') || 'vertical';
+    const className = element.getAttribute('class');
+    const choice = findMultiChoiceFromGradingStructure(gradingStructure, questionId);
+    const scoreValue = answer && choice.options.find((option) => option.id === Number(answer.value)).score;
+    const maxScore = getNumericAttribute(element, 'max-score');
+    return (React.createElement(React.Fragment, null,
+        scoreValue !== undefined && React.createElement(ResultsExamQuestionAutoScore, { score: scoreValue, maxScore: maxScore }),
+        React.createElement("div", { className: classNames('e-choice-answer', className, {
+                'e-columns': direction === 'horizontal',
+            }) }, mapChildElements(element, (childElement) => {
+            const optionId = getNumericAttribute(childElement, 'option-id');
+            const selected = answer != null && Number(answer.value) === optionId;
+            const grading = choice.options.find((option) => option.id === optionId);
+            return (React.createElement(ChoiceAnswerOption, { ...{
+                    element: childElement,
+                    renderChildNodes,
+                    questionId,
+                    key: optionId,
+                    direction,
+                    selected,
+                    isCorrect: grading.correct,
+                } }));
+        }))));
+}
+export default React.memo(ChoiceAnswer);
+//# sourceMappingURL=ChoiceAnswer.js.map

package/dist/components/grading/ChoiceAnswer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChoiceAnswer.js","sourceRoot":"","sources":["../../../src/components/grading/ChoiceAnswer.tsx"],"names":[],"mappings":"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"}

package/dist/components/grading/DropdownAnswer.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ExamComponentProps } from '../../createRenderChildNodes';
+declare function DropdownAnswer({ element, renderChildNodes }: ExamComponentProps): JSX.Element | null;
+declare const _default: React.MemoExoticComponent<typeof DropdownAnswer>;
+export default _default;
+//# sourceMappingURL=DropdownAnswer.d.ts.map

package/dist/components/grading/DropdownAnswer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownAnswer.d.ts","sourceRoot":"","sources":["../../../src/components/grading/DropdownAnswer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAA;AASjE,iBAAS,cAAc,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,EAAE,kBAAkB,sBA2DxE;;AAED,wBAAyC"}

package/dist/components/grading/DropdownAnswer.js

@@ -0,0 +1,43 @@
+import classNames from 'classnames';
+import React, { useContext } from 'react';
+import { findChildElement, getNumericAttribute } from '../../dom-utils';
+import { useExamTranslation } from '../../i18n';
+import { shortDisplayNumber } from '../../shortDisplayNumber';
+import { QuestionContext } from '../context/QuestionContext';
+import { ScreenReaderOnly } from '../ScreenReaderOnly';
+import { findMultiChoiceFromGradingStructure, ResultsContext } from '../context/ResultsContext';
+import ResultsExamQuestionAutoScore from './internal/QuestionAutoScore';
+function DropdownAnswer({ element, renderChildNodes }) {
+    const { t } = useExamTranslation();
+    const { answersByQuestionId, gradingStructure } = useContext(ResultsContext);
+    const { answers } = useContext(QuestionContext);
+    const questionId = getNumericAttribute(element, 'question-id');
+    const answer = answersByQuestionId[questionId];
+    const selectedOption = findChildElement(element, (childElement) => (answer === null || answer === void 0 ? void 0 : answer.value) === childElement.getAttribute('option-id'));
+    const choice = findMultiChoiceFromGradingStructure(gradingStructure, questionId);
+    if (selectedOption) {
+        const correctIds = choice.options.filter((o) => o.correct).map((o) => o.id);
+        const correctOptions = Array.from(element.children).filter((childElement) => correctIds.includes(getNumericAttribute(childElement, 'option-id')));
+        const isAnswerCorrect = correctIds.includes(getNumericAttribute(selectedOption, 'option-id'));
+        const displayNumber = shortDisplayNumber(element.getAttribute('display-number'));
+        const scoreValue = answer && choice.options.find((option) => option.id === Number(answer.value)).score;
+        const maxScore = getNumericAttribute(element, 'max-score');
+        return (React.createElement(React.Fragment, null,
+            answers.length > 1 && React.createElement("sup", null, displayNumber),
+            React.createElement("span", { className: classNames('e-dropdown-answer__answered', {
+                    'e-dropdown-answer__answered--correct': isAnswerCorrect,
+                    'e-dropdown-answer__answered--wrong': !isAnswerCorrect,
+                }) },
+                React.createElement(ScreenReaderOnly, null, t('screen-reader.answer-begin')),
+                renderChildNodes(selectedOption),
+                React.createElement(ScreenReaderOnly, null, t('screen-reader.answer-end')),
+                isAnswerCorrect && React.createElement(ScreenReaderOnly, null, t('screen-reader.correct-answer'))),
+            !isAnswerCorrect && (React.createElement("span", { className: "e-dropdown-answer__correct", "aria-hidden": true }, correctOptions.map((correctOption, i) => (React.createElement(React.Fragment, { key: i },
+                renderChildNodes(correctOption),
+                i < correctOptions.length - 1 && ', '))))),
+            scoreValue != null && (React.createElement(ResultsExamQuestionAutoScore, { score: scoreValue, maxScore: maxScore, displayNumber: displayNumber }))));
+    }
+    return null;
+}
+export default React.memo(DropdownAnswer);
+//# sourceMappingURL=DropdownAnswer.js.map

package/dist/components/grading/DropdownAnswer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownAnswer.js","sourceRoot":"","sources":["../../../src/components/grading/DropdownAnswer.tsx"],"names":[],"mappings":"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"}

package/dist/components/grading/Grading.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<React.ComponentType<any>>;
+export default _default;
+//# sourceMappingURL=Grading.d.ts.map

package/dist/components/grading/Grading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grading.d.ts","sourceRoot":"","sources":["../../../src/components/grading/Grading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAA;;AAmHtE,wBAA6E"}

package/dist/components/grading/Grading.js

@@ -0,0 +1,81 @@
+import React, { useContext, useEffect, useRef, useState } from 'react';
+import { I18nextProvider } from 'react-i18next';
+import { changeLanguage, initI18n } from '../../i18n';
+import { useCached } from '../../useCached';
+import { withCommonExamContext } from '../context/CommonExamContext';
+import { ResultsContext, withResultsContext } from '../context/ResultsContext';
+import { GradingAnswer } from './GradingAnswer';
+function Grading() {
+    const { answersByQuestionId } = useContext(ResultsContext);
+    const i18n = useCached(() => initI18n('FI-fi'));
+    useEffect(changeLanguage(i18n, 'FI-fi'));
+    const answerIds = Object.keys(answersByQuestionId).map(Number);
+    if (answerIds.length === 0) {
+        return React.createElement("div", null, "No answers");
+    }
+    const [answerId, setAnswerId] = useState(answerIds[0]);
+    const annotationsStorage = useRef(Object.fromEntries(answerIds.map((id) => [
+        id,
+        {
+            pregrading: [
+                {
+                    startIndex: 2,
+                    length: 5,
+                    message: '+1',
+                },
+                {
+                    x: 0.07434944237918215,
+                    y: 0.8599562363238512,
+                    type: 'rect',
+                    width: 0.16604708798017348,
+                    height: 0.03063457330415753,
+                    message: '+2',
+                    attachmentIndex: 0,
+                },
+                {
+                    x1: 0.4035532994923858,
+                    x2: 0.5621827411167513,
+                    y1: 0.957983193277311,
+                    y2: 0.957983193277311,
+                    type: 'line',
+                    message: 'trk, +1',
+                    attachmentIndex: 0,
+                },
+            ],
+            censoring: [],
+        },
+    ])));
+    const [annotations, setAnnotations] = useState({
+        pregrading: [],
+        censoring: [],
+    });
+    useEffect(() => {
+        setAnnotations(annotationsStorage.current[answerId]);
+    });
+    const { type: answerType, value } = answersByQuestionId[answerId];
+    if (answerType === 'choice') {
+        return React.createElement("div", null, "choice answer");
+    }
+    function selectQuestion(e, id) {
+        e.preventDefault();
+        setAnswerId(id);
+        setAnnotations(annotationsStorage.current[id]);
+    }
+    function saveAnnotations(annotations) {
+        annotationsStorage.current[answerId] = annotations;
+        setAnnotations({ ...annotationsStorage.current[answerId] });
+    }
+    return (React.createElement(I18nextProvider, { i18n: i18n },
+        React.createElement("main", { className: "e-exam" },
+            React.createElement("div", { className: "grading-navi" }, answerIds.map((id) => id === answerId ? (React.createElement("span", { key: id, className: "grading-navi-item" }, answersByQuestionId[id].displayNumber)) : (React.createElement("a", { className: "grading-navi-item", href: "", onClick: (e) => selectQuestion(e, id), key: id }, answersByQuestionId[id].displayNumber)))),
+            React.createElement(GradingAnswer, { ...{
+                    isReadOnly: false,
+                    answerType,
+                    gradingRole: 'censoring',
+                    value,
+                    annotations,
+                    saveAnnotations,
+                } }))));
+}
+export default React.memo(withResultsContext(withCommonExamContext(Grading)));
+//# sourceMappingURL=Grading.js.map

package/dist/components/grading/Grading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grading.js","sourceRoot":"","sources":["../../../src/components/grading/Grading.tsx"],"names":[],"mappings":"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"}

package/dist/components/grading/GradingAnswer.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Annotation } from '../..';
+type Annotations = {
+    pregrading: Annotation[];
+    censoring: Annotation[];
+};
+type GradingType = 'pregrading' | 'censoring';
+export declare function GradingAnswer({ isReadOnly, answerType, gradingRole, annotations, saveAnnotations, value, }: {
+    isReadOnly: boolean;
+    answerType: 'richText' | 'text';
+    gradingRole: GradingType;
+    value: string;
+    annotations: Annotations;
+    saveAnnotations: (annotations: Annotations) => void;
+}): JSX.Element;
+export {};
+//# sourceMappingURL=GradingAnswer.d.ts.map

package/dist/components/grading/GradingAnswer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GradingAnswer.d.ts","sourceRoot":"","sources":["../../../src/components/grading/GradingAnswer.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAkBlC,KAAK,WAAW,GAAG;IAAE,UAAU,EAAE,UAAU,EAAE,CAAC;IAAC,SAAS,EAAE,UAAU,EAAE,CAAA;CAAE,CAAA;AAOxE,KAAK,WAAW,GAAG,YAAY,GAAG,WAAW,CAAA;AAE7C,wBAAgB,aAAa,CAAC,EAC5B,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,EACX,eAAe,EACf,KAAK,GACN,EAAE;IACD,UAAU,EAAE,OAAO,CAAA;IACnB,UAAU,EAAE,UAAU,GAAG,MAAM,CAAA;IAC/B,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,WAAW,CAAA;IACxB,eAAe,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAA;CACpD,eA6NA"}

package/dist/components/grading/GradingAnswer.js

@@ -0,0 +1,179 @@
+import React, { useLayoutEffect, useRef } from 'react';
+import { annotationFromMousePosition, hasTextSelectedInAnswerText, imageAnnotationMouseDownInfo, mergeAnnotation, popupPosition, selectionHasNothingToUnderline, textAnnotationFromRange, } from './editAnnotations';
+import { renderAnnotations, renderImageAnnotationByImage, updateImageAnnotationMarkSize, wrapAllImages, } from '../../renderAnnotations';
+function preventDefaults(e) {
+    e.preventDefault();
+    e.stopPropagation();
+}
+export function GradingAnswer({ isReadOnly, answerType, gradingRole, annotations, saveAnnotations, value, }) {
+    const answerRef = useRef(null);
+    const popupRef = useRef(null);
+    const messageRef = useRef(null);
+    const tooltipRef = useRef(null);
+    let newAnnotationObject;
+    // let isMouseDown = false
+    let latestSavedAnnotations;
+    let mouseDownInfo;
+    let newImageAnnotationMark;
+    let imageAtHand;
+    let isPopupVisible = false;
+    let fadeTooltipOut;
+    let annotationDataForTooltip;
+    useLayoutEffect(() => {
+        if (answerRef.current) {
+            latestSavedAnnotations = annotations;
+            tooltipRef.current.style.display = 'none';
+            popupRef.current.style.display = 'none';
+            renderAnswerWithAnnotations(latestSavedAnnotations);
+        }
+    });
+    function removeAnnotation(e) {
+        e.preventDefault();
+        closeTooltip();
+        latestSavedAnnotations[annotationDataForTooltip.type].splice(annotationDataForTooltip.index, 1);
+        annotationDataForTooltip = undefined;
+        saveAnnotations(latestSavedAnnotations);
+    }
+    return (React.createElement("div", { className: "e-grading-answer-wrapper" },
+        React.createElement("div", { className: "answer e-grading-answer e-line-height-l e-pad-l-2 e-mrg-b-1", ref: answerRef, onKeyUp: (e) => onKeyUp(e), onMouseDown: (e) => onMouseDown(e), onMouseOver: (e) => onMouseOver(e) }),
+        React.createElement("form", { style: { display: 'none', position: 'absolute' }, ref: popupRef, className: "e-grading-answer-popup e-grading-answer-add-annotation", onSubmit: (e) => onSubmit(e) },
+            React.createElement("input", { name: "message", className: "e-grading-answer-add-annotation-text", type: "text", ref: messageRef }),
+            React.createElement("button", { className: "e-grading-answer-add-annotation-button", type: "submit", "data-i18n": "arpa.annotate" }, "Merkitse")),
+        React.createElement("div", { style: { display: 'none' }, ref: tooltipRef, className: "e-grading-answer-tooltip e-grading-answer-popup", onMouseOver: onMouseOverTooltip, onMouseOut: closeTooltip },
+            React.createElement("span", { className: "e-grading-answer-tooltip-label" }, "tooltip text"),
+            React.createElement("button", { onClick: (e) => removeAnnotation(e), className: "e-grading-answer-tooltip-remove" }, "\u00D7"))));
+    function closeTooltip() {
+        fadeTooltipOut = setTimeout(() => {
+            tooltipRef.current.style.display = 'none';
+        }, 400);
+    }
+    function onMouseOverTooltip() {
+        clearTimeout(fadeTooltipOut);
+    }
+    function onMouseOut(e) {
+        const target = e.target;
+        if (target.tagName === 'MARK') {
+            clearTimeout(fadeTooltipOut);
+            closeTooltip();
+        }
+        answerRef.current.removeEventListener('mouseout', onMouseOut);
+    }
+    function showTooltip(target) {
+        clearTimeout(fadeTooltipOut);
+        const tooltip = tooltipRef.current;
+        const type = target.dataset.type;
+        tooltip.querySelector('.e-grading-answer-tooltip-remove').style.display =
+            isReadOnly || type !== gradingRole ? 'none' : 'initial';
+        const rect = target.getBoundingClientRect();
+        Object.assign(tooltip.style, popupPosition(rect, answerRef.current), { display: 'block' });
+        tooltip.querySelector('.e-grading-answer-tooltip-label').textContent = target.dataset.message || '–';
+        annotationDataForTooltip = { index: Number(target.dataset.listIndex), type };
+        answerRef.current.addEventListener('mouseout', onMouseOut);
+    }
+    function onMouseOver(e) {
+        const target = e.target;
+        if (target.tagName === 'MARK' &&
+            !isPopupVisible &&
+            (!hasTextSelectedInAnswerText() || isReadOnly) &&
+            !newImageAnnotationMark) {
+            showTooltip(target);
+        }
+    }
+    function showAnnotationPopup(rect) {
+        Object.assign(popupRef.current.style, popupPosition(rect, answerRef.current), {
+            display: 'block',
+        });
+        const inputElement = messageRef.current;
+        inputElement.value = '';
+        inputElement.focus();
+        isPopupVisible = true;
+    }
+    function closePopupAndRefresh() {
+        newAnnotationObject = undefined;
+        newImageAnnotationMark = undefined;
+        imageAtHand = undefined;
+        isPopupVisible = false;
+        popupRef.current.style.display = 'none';
+        renderAnswerWithAnnotations(latestSavedAnnotations);
+    }
+    function onMouseDown(e) {
+        var _a;
+        if (isReadOnly) {
+            return;
+        }
+        window.addEventListener('mouseup', onWindowMouseUp);
+        if (e.button !== 0) {
+            return;
+        }
+        const target = e.target;
+        imageAtHand = ((_a = target.closest('.e-annotation-wrapper')) === null || _a === void 0 ? void 0 : _a.querySelector('img')) || undefined;
+        if (!imageAtHand) {
+            return;
+        }
+        imageAtHand.addEventListener('dragstart', preventDefaults);
+        mouseDownInfo = imageAnnotationMouseDownInfo(e, imageAtHand);
+        window.addEventListener('mousemove', onMouseMoveForImageAnnotation);
+    }
+    function onWindowMouseUp(e) {
+        imageAtHand === null || imageAtHand === void 0 ? void 0 : imageAtHand.removeEventListener('dragstart', preventDefaults);
+        window.removeEventListener('mousemove', onMouseMoveForImageAnnotation);
+        window.removeEventListener('mouseup', onWindowMouseUp);
+        if (isPopupVisible && e.target.closest('.popup') === null) {
+            closePopupAndRefresh();
+            return;
+        }
+        if (newImageAnnotationMark) {
+            showAnnotationPopup(newImageAnnotationMark === null || newImageAnnotationMark === void 0 ? void 0 : newImageAnnotationMark.getBoundingClientRect());
+            return;
+        }
+        const selection = window.getSelection();
+        if (selection && answerRef.current !== null && hasTextSelectedInAnswerText()) {
+            const range = selection.getRangeAt(0);
+            if (selectionHasNothingToUnderline(range)) {
+                return;
+            }
+            const position = textAnnotationFromRange(answerRef.current, range);
+            newAnnotationObject = { ...position, type: 'text', message: '' };
+            showAnnotationPopup(range.getBoundingClientRect());
+            const newAnnotations = { ...latestSavedAnnotations };
+            newAnnotations[gradingRole] = mergeAnnotation(answerRef.current, newAnnotationObject, latestSavedAnnotations[gradingRole]);
+            renderAnswerWithAnnotations(newAnnotations);
+        }
+    }
+    function onMouseMoveForImageAnnotation(e) {
+        preventDefaults(e);
+        newAnnotationObject = annotationFromMousePosition(e, mouseDownInfo);
+        if (newImageAnnotationMark) {
+            updateImageAnnotationMarkSize(newImageAnnotationMark, newAnnotationObject);
+        }
+        else {
+            newImageAnnotationMark = renderImageAnnotationByImage(imageAtHand, '', newAnnotationObject, gradingRole, 999);
+        }
+    }
+    function renderAnswerWithAnnotations(annotations) {
+        const container = answerRef.current;
+        if (answerType === 'richText') {
+            container.innerHTML = value;
+        }
+        else {
+            container.textContent = value;
+        }
+        wrapAllImages(container);
+        renderAnnotations(container, annotations.pregrading, annotations.censoring);
+        //TODO make titles optional for annotation rendering
+        container.querySelectorAll('mark').forEach((mark) => mark.removeAttribute('title'));
+    }
+    function onSubmit(e) {
+        e.preventDefault();
+        const message = messageRef.current.value;
+        latestSavedAnnotations[gradingRole] = mergeAnnotation(answerRef.current, { ...newAnnotationObject, message }, latestSavedAnnotations[gradingRole] || []);
+        popupRef.current.style.display = 'none';
+        saveAnnotations(latestSavedAnnotations);
+    }
+    function onKeyUp(e) {
+        if (e.key === 'Escape' && newAnnotationObject) {
+            closePopupAndRefresh();
+        }
+    }
+}
+//# sourceMappingURL=GradingAnswer.js.map

package/dist/components/grading/GradingAnswer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GradingAnswer.js","sourceRoot":"","sources":["../../../src/components/grading/GradingAnswer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEjE,OAAO,EACL,2BAA2B,EAC3B,2BAA2B,EAC3B,4BAA4B,EAC5B,eAAe,EAEf,aAAa,EACb,8BAA8B,EAC9B,uBAAuB,GACxB,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EACL,iBAAiB,EACjB,4BAA4B,EAC5B,6BAA6B,EAC7B,aAAa,GACd,MAAM,yBAAyB,CAAA;AAIhC,SAAS,eAAe,CAAC,CAAQ;IAC/B,CAAC,CAAC,cAAc,EAAE,CAAA;IAClB,CAAC,CAAC,eAAe,EAAE,CAAA;AACrB,CAAC;AAID,MAAM,UAAU,aAAa,CAAC,EAC5B,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,EACX,eAAe,EACf,KAAK,GAQN;IACC,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9C,MAAM,QAAQ,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAA;IAC9C,MAAM,UAAU,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IACjD,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC/C,IAAI,mBAA2C,CAAA;IAC/C,0BAA0B;IAC1B,IAAI,sBAAmC,CAAA;IACvC,IAAI,aAAiC,CAAA;IACrC,IAAI,sBAA+C,CAAA;IACnD,IAAI,WAAyC,CAAA;IAC7C,IAAI,cAAc,GAAG,KAAK,CAAA;IAC1B,IAAI,cAA6C,CAAA;IACjD,IAAI,wBAA0E,CAAA;IAC9E,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,sBAAsB,GAAG,WAAW,CAAA;YACpC,UAAU,CAAC,OAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;YAC1C,QAAQ,CAAC,OAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;YACxC,2BAA2B,CAAC,sBAAsB,CAAC,CAAA;SACpD;IACH,CAAC,CAAC,CAAA;IAEF,SAAS,gBAAgB,CAAC,CAAkD;QAC1E,CAAC,CAAC,cAAc,EAAE,CAAA;QAClB,YAAY,EAAE,CAAA;QACd,sBAAsB,CAAC,wBAAyB,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,wBAAyB,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;QACjG,wBAAwB,GAAG,SAAS,CAAA;QACpC,eAAe,CAAC,sBAAsB,CAAC,CAAA;IACzC,CAAC;IACD,OAAO,CACL,6BAAK,SAAS,EAAC,0BAA0B;QACvC,6BACE,SAAS,EAAC,6DAA6D,EACvE,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,EAC1B,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,EAClC,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,GAClC;QAEF,8BACE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,EAChD,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,wDAAwD,EAClE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;YAE5B,+BAAO,IAAI,EAAC,SAAS,EAAC,SAAS,EAAC,sCAAsC,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAE,UAAU,GAAI;YACtG,gCAAQ,SAAS,EAAC,wCAAwC,EAAC,IAAI,EAAC,QAAQ,eAAW,eAAe,eAEzF,CACJ;QACP,6BACE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAC1B,GAAG,EAAE,UAAU,EACf,SAAS,EAAC,iDAAiD,EAC3D,WAAW,EAAE,kBAAkB,EAC/B,UAAU,EAAE,YAAY;YAExB,8BAAM,SAAS,EAAC,gCAAgC,mBAAoB;YACpE,gCAAQ,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,SAAS,EAAC,iCAAiC,aAE/E,CACL,CACF,CACP,CAAA;IAED,SAAS,YAAY;QACnB,cAAc,GAAG,UAAU,CAAC,GAAG,EAAE;YAC/B,UAAU,CAAC,OAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;QAC5C,CAAC,EAAE,GAAG,CAAC,CAAA;IACT,CAAC;IAED,SAAS,kBAAkB;QACzB,YAAY,CAAC,cAAc,CAAC,CAAA;IAC9B,CAAC;IACD,SAAS,UAAU,CAAC,CAAa;QAC/B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAiB,CAAA;QAClC,IAAI,MAAM,CAAC,OAAO,KAAK,MAAM,EAAE;YAC7B,YAAY,CAAC,cAAc,CAAC,CAAA;YAC5B,YAAY,EAAE,CAAA;SACf;QACD,SAAS,CAAC,OAAQ,CAAC,mBAAmB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAA;IAChE,CAAC;IAED,SAAS,WAAW,CAAC,MAAmB;QACtC,YAAY,CAAC,cAAc,CAAC,CAAA;QAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,OAAQ,CAAA;QACnC,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC,IAAmB,CAAA;QAC/C,OAAO,CAAC,aAAa,CAAiB,kCAAkC,CAAE,CAAC,KAAK,CAAC,OAAO;YACtF,UAAU,IAAI,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAA;QACzD,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAA;QAC3C,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,OAAQ,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAA;QAC3F,OAAO,CAAC,aAAa,CAAC,iCAAiC,CAAE,CAAC,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,IAAI,GAAG,CAAA;QACrG,wBAAwB,GAAG,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,CAAA;QAC5E,SAAS,CAAC,OAAQ,CAAC,gBAAgB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAA;IAC7D,CAAC;IAED,SAAS,WAAW,CAAC,CAA+C;QAClE,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;QACtC,IACE,MAAM,CAAC,OAAO,KAAK,MAAM;YACzB,CAAC,cAAc;YACf,CAAC,CAAC,2BAA2B,EAAE,IAAI,UAAU,CAAC;YAC9C,CAAC,sBAAsB,EACvB;YACA,WAAW,CAAC,MAAM,CAAC,CAAA;SACpB;IACH,CAAC;IACD,SAAS,mBAAmB,CAAC,IAAa;QACxC,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,OAAQ,CAAC,EAAE;YAC9E,OAAO,EAAE,OAAO;SACjB,CAAC,CAAA;QACF,MAAM,YAAY,GAAG,UAAU,CAAC,OAAQ,CAAA;QACxC,YAAY,CAAC,KAAK,GAAG,EAAE,CAAA;QACvB,YAAY,CAAC,KAAK,EAAE,CAAA;QACpB,cAAc,GAAG,IAAI,CAAA;IACvB,CAAC;IAED,SAAS,oBAAoB;QAC3B,mBAAmB,GAAG,SAAS,CAAA;QAC/B,sBAAsB,GAAG,SAAS,CAAA;QAClC,WAAW,GAAG,SAAS,CAAA;QACvB,cAAc,GAAG,KAAK,CAAA;QACtB,QAAQ,CAAC,OAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;QACxC,2BAA2B,CAAC,sBAAsB,CAAC,CAAA;IACrD,CAAC;IAED,SAAS,WAAW,CAAC,CAA+C;;QAClE,IAAI,UAAU,EAAE;YACd,OAAM;SACP;QACD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAA;QAEnD,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,EAAE;YAClB,OAAM;SACP;QACD,MAAM,MAAM,GAAG,CAAC,CAAC,MAAiB,CAAA;QAClC,WAAW,GAAG,CAAA,MAAA,MAAM,CAAC,OAAO,CAAC,uBAAuB,CAAC,0CAAE,aAAa,CAAmB,KAAK,CAAC,KAAI,SAAS,CAAA;QAC1G,IAAI,CAAC,WAAW,EAAE;YAChB,OAAM;SACP;QACD,WAAW,CAAC,gBAAgB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAA;QAC1D,aAAa,GAAG,4BAA4B,CAAC,CAAC,EAAE,WAAW,CAAC,CAAA;QAE5D,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,6BAA6B,CAAC,CAAA;IACrE,CAAC;IAED,SAAS,eAAe,CAAC,CAAa;QACpC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAA;QAC9D,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,6BAA6B,CAAC,CAAA;QACtE,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAA;QAEtD,IAAI,cAAc,IAAK,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,IAAI,EAAE;YACtE,oBAAoB,EAAE,CAAA;YACtB,OAAM;SACP;QAED,IAAI,sBAAsB,EAAE;YAC1B,mBAAmB,CAAC,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,qBAAqB,EAAG,CAAC,CAAA;YACrE,OAAM;SACP;QAED,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,EAAE,CAAA;QACvC,IAAI,SAAS,IAAI,SAAS,CAAC,OAAO,KAAK,IAAI,IAAI,2BAA2B,EAAE,EAAE;YAC5E,MAAM,KAAK,GAAG,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;YACrC,IAAI,8BAA8B,CAAC,KAAK,CAAC,EAAE;gBACzC,OAAM;aACP;YACD,MAAM,QAAQ,GAAG,uBAAuB,CAAC,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;YAClE,mBAAmB,GAAG,EAAE,GAAG,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,CAAA;YAChE,mBAAmB,CAAC,KAAK,CAAC,qBAAqB,EAAE,CAAC,CAAA;YAClD,MAAM,cAAc,GAAG,EAAE,GAAG,sBAAsB,EAAE,CAAA;YACpD,cAAc,CAAC,WAAW,CAAC,GAAG,eAAe,CAC3C,SAAS,CAAC,OAAO,EACjB,mBAAmB,EACnB,sBAAsB,CAAC,WAAW,CAAC,CACpC,CAAA;YACD,2BAA2B,CAAC,cAAc,CAAC,CAAA;SAC5C;IACH,CAAC;IAED,SAAS,6BAA6B,CAAC,CAAa;QAClD,eAAe,CAAC,CAAC,CAAC,CAAA;QAClB,mBAAmB,GAAG,2BAA2B,CAAC,CAAC,EAAE,aAAa,CAAC,CAAA;QACnE,IAAI,sBAAsB,EAAE;YAC1B,6BAA6B,CAAC,sBAAsB,EAAE,mBAAmB,CAAC,CAAA;SAC3E;aAAM;YACL,sBAAsB,GAAG,4BAA4B,CAAC,WAAY,EAAE,EAAE,EAAE,mBAAmB,EAAE,WAAW,EAAE,GAAG,CAAC,CAAA;SAC/G;IACH,CAAC;IAED,SAAS,2BAA2B,CAAC,WAAwB;QAC3D,MAAM,SAAS,GAAG,SAAS,CAAC,OAAQ,CAAA;QACpC,IAAI,UAAU,KAAK,UAAU,EAAE;YAC7B,SAAS,CAAC,SAAS,GAAG,KAAK,CAAA;SAC5B;aAAM;YACL,SAAS,CAAC,WAAW,GAAG,KAAK,CAAA;SAC9B;QACD,aAAa,CAAC,SAAS,CAAC,CAAA;QACxB,iBAAiB,CAAC,SAAS,EAAE,WAAW,CAAC,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;QAC3E,oDAAoD;QACpD,SAAS,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAA;IACrF,CAAC;IAED,SAAS,QAAQ,CAAC,CAA6B;QAC7C,CAAC,CAAC,cAAc,EAAE,CAAA;QAClB,MAAM,OAAO,GAAG,UAAU,CAAC,OAAQ,CAAC,KAAK,CAAA;QACzC,sBAAsB,CAAC,WAAW,CAAC,GAAG,eAAe,CACnD,SAAS,CAAC,OAAQ,EAClB,EAAE,GAAG,mBAAoB,EAAE,OAAO,EAAE,EACpC,sBAAsB,CAAC,WAAW,CAAC,IAAI,EAAE,CAC1C,CAAA;QACD,QAAQ,CAAC,OAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAA;QACxC,eAAe,CAAC,sBAAsB,CAAC,CAAA;IACzC,CAAC;IAED,SAAS,OAAO,CAAC,CAAsC;QACrD,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,mBAAmB,EAAE;YAC7C,oBAAoB,EAAE,CAAA;SACvB;IACH,CAAC;AACH,CAAC"}

package/dist/components/grading/MultiLineAnswer.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Score } from '../..';
+export declare const MultiLineAnswer: React.FunctionComponent<{
+    type: 'rich-text' | 'single-line';
+    value?: string;
+    score?: Score;
+}>;
+export declare function calculatePosition(answerTextNode: HTMLDivElement, range: Range): {
+    startIndex: number;
+    length: number;
+};
+export declare function toNodeLength(node: Node): number | undefined;
+export declare function allNodesUnder(el: Node, documentObject?: Document): Node[];
+//# sourceMappingURL=MultiLineAnswer.d.ts.map

package/dist/components/grading/MultiLineAnswer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiLineAnswer.d.ts","sourceRoot":"","sources":["../../../src/components/grading/MultiLineAnswer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAA;AAM7B,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACpD,IAAI,EAAE,WAAW,GAAG,aAAa,CAAA;IACjC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,KAAK,CAAA;CACd,CAwCA,CAAA;AAED,wBAAgB,iBAAiB,CAAC,cAAc,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK;;;EAgB7E;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,IAAI,sBAEtC;AAED,wBAAgB,aAAa,CAAC,EAAE,EAAE,IAAI,EAAE,cAAc,WAAW,GAAG,IAAI,EAAE,CAQzE"}

package/dist/components/grading/MultiLineAnswer.js

@@ -0,0 +1,61 @@
+import React, { useLayoutEffect, useRef } from 'react';
+import { useExamTranslation } from '../../i18n';
+import { renderAnnotations } from '../../renderAnnotations';
+import { ScreenReaderOnly } from '../ScreenReaderOnly';
+import * as _ from 'lodash-es';
+export const MultiLineAnswer = ({ type, score, value }) => {
+    const { t } = useExamTranslation();
+    const answerRef = useRef(null);
+    useLayoutEffect(() => {
+        var _a, _b, _c, _d;
+        if (answerRef.current) {
+            renderAnnotations(answerRef.current, (_b = (_a = score === null || score === void 0 ? void 0 : score.pregrading) === null || _a === void 0 ? void 0 : _a.annotations) !== null && _b !== void 0 ? _b : [], (_d = (_c = score === null || score === void 0 ? void 0 : score.censoring) === null || _c === void 0 ? void 0 : _c.annotations) !== null && _d !== void 0 ? _d : []);
+            document.addEventListener('selectionchange', onSelect);
+            console.log('annotations rendered2');
+        }
+    });
+    function onSelect(e) {
+        console.log(e);
+        const selection = window.getSelection();
+        if (selection && answerRef.current !== null) {
+            const range = selection.getRangeAt(0);
+            const position = calculatePosition(answerRef.current, range);
+            console.log(position, '\n=== position');
+        }
+    }
+    return type === 'rich-text' ? (React.createElement("div", { className: "e-multiline-results-text-answer e-line-height-l e-pad-l-2 e-mrg-b-1" },
+        React.createElement(ScreenReaderOnly, null, t('screen-reader.answer-begin')),
+        type === 'rich-text' ? (React.createElement("div", { dangerouslySetInnerHTML: { __html: value || '' }, ref: answerRef })) : (React.createElement("div", { className: "e-pre-wrap", ref: answerRef }, value)))) : (React.createElement("span", { className: "text-answer text-answer--single-line" },
+        React.createElement(ScreenReaderOnly, null, t('screen-reader.answer-begin')),
+        React.createElement("span", { className: "e-inline-block", ref: answerRef }, value)));
+};
+export function calculatePosition(answerTextNode, range) {
+    const answerNodes = allNodesUnder(answerTextNode);
+    const charactersBefore = charactersBeforeContainer(range.startContainer, range.startOffset);
+    const charactersUntilEnd = charactersBeforeContainer(range.endContainer, range.endOffset);
+    return {
+        startIndex: charactersBefore,
+        length: charactersUntilEnd - charactersBefore,
+    };
+    function charactersBeforeContainer(rangeContainer, offset) {
+        const containerIsTag = rangeContainer === answerTextNode;
+        const container = containerIsTag ? rangeContainer.childNodes[offset] : rangeContainer;
+        const offsetInside = containerIsTag ? 0 : offset;
+        const nodesBeforeContainer = _.takeWhile(answerNodes, (node) => node !== container);
+        return offsetInside + _.sum(nodesBeforeContainer.map(toNodeLength));
+    }
+}
+export function toNodeLength(node) {
+    var _a;
+    return node.nodeType === Node.TEXT_NODE ? (_a = node.textContent) === null || _a === void 0 ? void 0 : _a.length : node.nodeName === 'IMG' ? 1 : 0;
+}
+export function allNodesUnder(el, documentObject = document) {
+    let n = null;
+    const a = [];
+    const walk = documentObject.createTreeWalker(el, NodeFilter.SHOW_ALL, null);
+    while ((n = walk.nextNode())) {
+        a.push(n);
+    }
+    return a;
+}
+//# sourceMappingURL=MultiLineAnswer.js.map