@instructure/quiz-interactions
Version:
A React UI component Library for quiz interaction types.
80 lines • 1.96 kB
JavaScript
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import FillBlankShow from './index';
var scoringDataFromBlank = function scoringDataFromBlank(blank) {
if (blank.answerType == 'openEntry') {
return 'freeform answer';
} else {
return blank.choices[0].id;
}
};
export default {
component: DragDropContext(HTML5Backend)(FillBlankShow),
propValues: {
blank: [{
id: 'fitb_uuid1',
answerType: 'openEntry'
}, {
id: 'fitb_uuid1',
answerType: 'wordbank',
choices: [{
id: 'choice_uuid1',
position: 1,
itemBody: 'one'
}, {
id: 'choice_uuid2',
position: 2,
itemBody: 'two'
}, {
id: 'choice_uuid3',
position: 3,
itemBody: 'three'
}]
}, {
id: 'fitb_uuid1',
answerType: 'dropdown',
choices: [{
id: 'choice_uuid1',
position: 1,
itemBody: 'one'
}, {
id: 'choice_uuid2',
position: 2,
itemBody: 'two'
}, {
id: 'choice_uuid3',
position: 3,
itemBody: 'three'
}]
}],
showScored: [true, false]
},
getComponentProps: function getComponentProps(props) {
return {
interactionData: {
// HTML added for effect
prompt: "<p><strong>Please</strong> fill in all the blanks (".concat(props.blank.answerType, ")</p>"),
stemItems: [{
id: 'stem_uuid0',
position: 1,
type: 'text',
value: 'Write a number word here: '
}, {
id: 'stem_uuid1',
position: 2,
type: 'blank',
blankId: 'fitb_uuid1'
}],
blanks: [props.blank]
},
scoringData: {
value: [{
id: props.blank.id,
scoringData: {
value: props.showScored ? scoringDataFromBlank(props.blank) : ''
}
}]
}
};
}
};