UNPKG

react-sn-question

Version:

A react component to easily create a toggleable question.

1 lines 17 kB
module.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=13)}([function(e,t){e.exports=require("react")},,,function(e,t,n){},,function(e,t,n){},function(e,t,n){e.exports=function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=4)}([function(e,t){e.exports=n(0)},function(e,t,n){e.exports=n(6)()},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=i(n(0)),a=i(n(1));function i(e){return e&&e.__esModule?e:{default:e}}n(10),t.default=function e(t){e.propTypes={selectedIndex:a.default.number.isRequired,totalItems:a.default.number.isRequired,className:a.default.string},e.defaultProps={className:""};var n=t.selectedIndex,i=t.totalItems,u=t.className,s=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(t,["selectedIndex","totalItems","className"]),l=[u,"abg-switch__overlay"].join(" ");return o.default.createElement("span",r({className:l,style:{width:100/i+"%",transform:"translateX("+100*n+"%)"}},s))}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=u(n(0)),i=u(n(1));function u(e){return e&&e.__esModule?e:{default:e}}n(12);var s=function(e){function t(){return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,a.default.Component),o(t,[{key:"render",value:function(){var e=this.props,t=e.name,n=e.active,o=e.className,i=e.disable,u=e.value,s=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(e,["name","active","className","disable","value"]),l=["abg-switch__item",o,n?"abg-switch__item--on":"",i?"abg-switch__item--disable":""].join(" ");return a.default.createElement("span",r({className:l,tabIndex:i?-1:0},s),this.props.children,a.default.createElement("input",{tabIndex:i?-1:0,type:"radio",value:u,name:t,defaultChecked:n}))}}]),t}();s.propTypes={value:i.default.string.isRequired,children:i.default.node,disable:i.default.bool,active:i.default.bool},s.defaultProps={children:"",active:!1,disable:!1},t.default=s},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(5);Object.defineProperty(t,"default",{enumerable:!0,get:function(){return i(r).default}});var o=n(2);Object.defineProperty(t,"Overlay",{enumerable:!0,get:function(){return i(o).default}});var a=n(3);function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"State",{enumerable:!0,get:function(){return i(a).default}}),Object.defineProperty(t,"Item",{enumerable:!0,get:function(){return i(a).default}})},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.proxy=void 0;var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=n(0),i=c(a),u=c(n(1)),s=c(n(2)),l=c(n(3));function c(e){return e&&e.__esModule?e:{default:e}}function f(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}n(14);var d=t.proxy=function(e){return function(t){return function(){for(var n=arguments.length,r=Array(n),o=0;o<n;o++)r[o]=arguments[o];e.apply(void 0,r),t&&t.apply(t,r)}}},p=function(e){function t(){var e,n,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);for(var o=arguments.length,a=Array(o),i=0;i<o;i++)a[i]=arguments[i];return n=r=f(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(a))),r.state={activeIndex:r.getDefaultActiveIndex()},f(r,n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,a.Component),o(t,[{key:"onStateClicked",value:function(e){this.onSelection(e)}},{key:"onSwitchKeyDown",value:function(e){var t=e.key;"ArrowLeft"===t&&this.state.activeIndex>0?this.onSelection(this.state.activeIndex-1):"ArrowRight"===t&&this.state.activeIndex<this.props.children.length-1&&this.onSelection(this.state.activeIndex+1)}},{key:"onStateKeyDown",value:function(e,t){var n=t.key;"Enter"!==n&&" "!==n||this.onSelection(e)}},{key:"onSelection",value:function(e){this.props.disable||this.props.children[e].props.disable||(this.props.onSelection&&this.props.onSelection(e),this.props.onItemSelected&&this.props.onItemSelected(e),!1!==this.state.autoControlled&&this.setChecked(e))}},{key:"getDefaultActiveIndex",value:function(){var e=this.props.children.findIndex(function(e){return e.props.default});return e>-1?e:0}},{key:"setChecked",value:function(e){this.setState({activeIndex:e});var t=this.props,n=t.onValueChange,r=t.onItemChanged,o=void 0!==n?n:r;if(void 0!==o){var a=this.props.children[e],i=this.state.activeIndex;o(a.props.value,e,i,a)}}},{key:"getItemProps",value:function(e,t){return{onClick:d(this.onStateClicked.bind(this,t))(e.props.onClick),onKeyDown:d(this.onStateKeyDown.bind(this,t))(e.props.onKeyDown),tabIndex:this.props.disable?-1:e.props.tabIndex,active:this.state.activeIndex===t,name:this.props.name}}},{key:"render",value:function(){var e=this,t=this.props,n=t.disable,o=t.children,a=t.tabIndex,u=t.className,l=(t.name,t.onValueChange,t.onSelection,t.onItemSelected,t.onItemChanged,t.arrowSelection),c=t.customOverlay,f=t.onKeyDown,p=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(t,["disable","children","tabIndex","className","name","onValueChange","onSelection","onItemSelected","onItemChanged","arrowSelection","customOverlay","onKeyDown"]),h=["abg-switch abg-switch__container",u,n?"abg-switch--disable":""].join(" "),y=c||s.default;return i.default.createElement("div",r({role:"radiogroup","aria-disabled":n,tabIndex:n?-1:a},p,{className:h,onKeyDown:l?d(function(){return e.onSwitchKeyDown.apply(e,arguments)})(f):this.props.onKeyDown}),i.default.Children.map(o,function(t,n){return i.default.cloneElement(t,e.getItemProps(t,n))}),i.default.createElement(y,{selectedIndex:this.state.activeIndex,totalItems:o.length}))}}],[{key:"getDerivedStateFromProps",value:function(e,t){var n=e.children.findIndex(function(e){return e.props.active});return n<0?r({},t,{autoControlled:!0}):n!==t.activeIndex?r({},t,{activeIndex:n,autoControlled:!1}):null}}]),t}();p.propTypes={children:function(e){var t=e.children;if(!1===Array.isArray(t))return new Error("Children must be an array of <Item />.");if(!1===function(e,t){var n=!0;return i.default.Children.forEach(e,function(){!1===function(e){return t=e,n=l.default,t.type===n;var t,n}.apply(void 0,arguments)&&(n=!1)}),n}(t))return new Error("All Children of <Switch /> must be of type <Item />");var n=t.some(function(e){return e.props.default}),r=t.some(function(e){return e.props.active});return n&&r?new Error("Switch component can't have State with default and active property at the same time."):r&&e.onValueChange||r&&e.onItemChanged?new Error("onValueChange() | onItemChanged() is only available to switch components whose children don't use the 'active' attribute."):""},onValueChange:u.default.func,onSelection:u.default.func,onItemChanged:u.default.func,onItemSelected:u.default.func,tabIndex:u.default.number,disable:u.default.bool,arrowSelection:u.default.bool,className:u.default.string,name:u.default.string.isRequired,customOverlay:u.default.func,onKeyDown:u.default.func},p.defaultProps={onValueChange:void 0,onSelection:void 0,onItemChanged:void 0,onItemSelected:void 0,onKeyDown:void 0,customOverlay:void 0,tabIndex:0,disable:!1,arrowSelection:!0,className:"",children:[]},t.default=p},function(e,t,n){"use strict";var r=n(7),o=n(8),a=n(9);e.exports=function(){function e(e,t,n,r,i,u){u!==a&&o(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=r,n.PropTypes=n,n}},function(e,t,n){"use strict";function r(e){return function(){return e}}var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(e){return e},e.exports=o},function(e,t,n){"use strict";e.exports=function(e,t,n,r,o,a,i,u){if(!e){var s;if(void 0===t)s=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var l=[n,r,o,a,i,u],c=0;(s=new Error(t.replace(/%s/g,function(){return l[c++]}))).name="Invariant Violation"}throw s.framesToPop=1,s}}},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){},,function(e,t,n){},,function(e,t,n){}])},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){"use strict";var r=function(e){};e.exports=function(e,t,n,o,a,i,u,s){if(r(t),!e){var l;if(void 0===t)l=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var c=[n,o,a,i,u,s],f=0;(l=new Error(t.replace(/%s/g,function(){return c[f++]}))).name="Invariant Violation"}throw l.framesToPop=1,l}}},function(e,t,n){"use strict";function r(e){return function(){return e}}var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(e){return e},e.exports=o},function(e,t,n){"use strict";var r=n(9),o=n(8),a=n(7);e.exports=function(){function e(e,t,n,r,i,u){u!==a&&o(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=r,n.PropTypes=n,n}},function(e,t,n){e.exports=n(10)()},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=l(n(0)),i=l(n(11)),u=n(6),s=l(u);function l(e){return e&&e.__esModule?e:{default:e}}function c(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}n(5),n(3);var f=function(e){function t(){var e,n,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);for(var o=arguments.length,a=Array(o),i=0;i<o;i++)a[i]=arguments[i];return n=r=c(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(a))),r.state={classStates:[]},c(r,n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,a.default.Component),o(t,[{key:"getMainWrapperClasses",value:function(e){var n=t.computeScore(e);return["snquestion","snquestion--"+this.state.classStates[n]].join(" ").trim()}},{key:"changeHandler",value:function(e,t,n){this.props.onChange&&this.props.onChange(e,t,n)}},{key:"render",value:function(){var e=this,t=this.props,n=t.questions,r=t.title,o=t.disable,i=t.resolutionMessage;return a.default.createElement("div",{className:this.getMainWrapperClasses(n)},a.default.createElement("h1",{className:"snquestion__title"},r),n.map(function(t,n){return a.default.createElement(s.default,{name:t.id,key:t.id,disable:o,onItemSelected:function(t,r){return e.changeHandler(t,r,n)}},t.options.map(function(e,n){return a.default.createElement(u.Item,{active:t.selected===n,key:e.id,value:e.name},e.value)}))}),a.default.createElement("p",{className:"snquestion__result"},i))}}],[{key:"getDerivedStateFromProps",value:function(e,n){return e.classStates?{classStates:e.classStates}:0===n.classStates.length?{classStates:t.computeDefaultClasses(t.defaultClassStates,e.questions.length)}:null}}]),t}();f.propTypes={title:i.default.string.isRequired,resolutionMessage:i.default.string.isRequired,questions:i.default.arrayOf(i.default.shape({id:i.default.number.isRequired,correct:i.default.number.isRequired,options:i.default.arrayOf(i.default.shape({name:i.default.string.isRequired,value:i.default.string.isRequired})),selected:i.default.number})).isRequired,onChange:i.default.func,classStates:i.default.arrayOf(i.default.string),disable:i.default.bool},f.defaultProps={onChange:void 0,classStates:void 0,disable:!1},f.defaultClassStates=["failure","hot","medium","almost","success"],f.computeScore=function(e){return e.reduce(function(e,t){return e+(t.selected===t.correct?1:0)},0)},f.updateQuestions=function(e,t){var n=t.questionIndex,o=t.answerIndex;return e.map(function(e,t){return n===t?r({},e,{selected:o}):e})},f.isQuestionCorrect=function(e){return e.every(function(e){return e.selected===e.correct})},f.computeDefaultClasses=function(e,t){return[e[0]].concat(function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}(e.slice(1,t)),[e[e.length-1]])},t.default=f},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(12);Object.defineProperty(t,"default",{enumerable:!0,get:function(){return(e=r,e&&e.__esModule?e:{default:e}).default;var e}})}]);