@instructure/quiz-interactions
Version:
A React UI component Library for quiz interaction types.
54 lines (53 loc) • 2.78 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import t from '@instructure/quiz-i18n/format-message';
import { Button, CloseButton } from '@instructure/ui-buttons';
import { Text } from '@instructure/ui-text';
import { Heading } from '@instructure/ui-heading';
import { Modal } from '@instructure/ui-modal';
export default function RequirementHelpModal(param) {
var mountNode = param.mountNode, onDismiss = param.onDismiss, open = param.open;
return /*#__PURE__*/ React.createElement(Modal, {
label: t('Requirement help'),
mountNode: mountNode,
onDismiss: onDismiss,
open: open,
size: "medium"
}, /*#__PURE__*/ React.createElement(Modal.Header, null, /*#__PURE__*/ React.createElement(CloseButton, {
onClick: onDismiss,
placement: "end",
screenReaderLabel: t('Close')
}), /*#__PURE__*/ React.createElement(Heading, null, t('Requirement'))), /*#__PURE__*/ React.createElement(Modal.Body, null, /*#__PURE__*/ React.createElement(Heading, {
as: "h3",
level: "h4"
}, t('Exact Response')), /*#__PURE__*/ React.createElement(Text, {
as: "p"
}, t('Student responses will be marked correct if they match the answer exactly. ' + 'Answers can be in scientific notation (Accepted format: 1.234*10^3).')), /*#__PURE__*/ React.createElement(Heading, {
as: "h3",
level: "h4"
}, t('Margin of Error')), /*#__PURE__*/ React.createElement(Text, {
as: "p"
}, t('Student responses will be marked correct if they fall within the ' + 'margin above or below the answer.')), /*#__PURE__*/ React.createElement(Heading, {
as: "h3",
level: "h4"
}, t('Within a Range')), /*#__PURE__*/ React.createElement(Text, {
as: "p"
}, t('Student responses will be marked correct if they are greater than ' + 'or equal to the range start and less than or equal to the range end. ' + 'Range inputs can be in scientific notation (Accepted format: 1.234*10^3).')), /*#__PURE__*/ React.createElement(Heading, {
as: "h3",
level: "h4"
}, t('Precise Response')), /*#__PURE__*/ React.createElement(Text, {
as: "p"
}, t('Student responses will be marked correct if they match the answer ' + 'to the given number of significant digits or decimal places.'))), /*#__PURE__*/ React.createElement(Modal.Footer, null, /*#__PURE__*/ React.createElement(Button, {
onClick: onDismiss,
color: "primary"
}, t('Done'))));
}
RequirementHelpModal.propTypes = {
mountNode: PropTypes.node,
onDismiss: PropTypes.func.isRequired,
open: PropTypes.bool.isRequired
};
RequirementHelpModal.defaultProps = {
mountNode: void 0
};
RequirementHelpModal.displayName = 'RequirementHelpModal';