@mjhls/mjh-framework 1.0.1069-poll-update → 1.0.1069-test

package/dist/esm/{index-4bf993d8.js → index-c10c03a2.js}

@@ -2,14 +2,14 @@ import React__default, { useState, useEffect, useRef, useLayoutEffect, useCallba
 import { _ as _slicedToArray, a as _getIterator } from './slicedToArray-6ebcbfea.js';
 import { Carousel, Table, Figure as Figure$1, Card, Row, Col, Button as Button$1, ProgressBar } from 'react-bootstrap';
 import urlFor from './urlFor.js';
-import { l as lib_3 } from './index-5cc7b406.js';
+import { l as lib_3 } from './index-f0fc23eb.js';
 import Router, { useRouter } from 'next/router';
 import { g as getYoutubeId } from './index-c7e2ac95.js';
 import PropTypes from 'prop-types';
 import { c as createCommonjsModule, u as unwrapExports } from './_commonjsHelpers-0c4b6f40.js';
 import './Beam.js';
 import Segment from './Segment.js';
-import { f as main_18, b as main_42, m as main_43 } from './main-754d4992.js';
+import { f as main_18, b as main_42, m as main_43 } from './main-f97773b2.js';
 import { B as BlockContent } from './BlockContent-1e73bd2c.js';
 import { _ as _extends, b as _extends$1 } from './extends-1559c147.js';
 import { u as urlForFile } from './urlForFile-f6485737.js';
@@ -28,7 +28,7 @@ import ReactGA from 'react-ga';
 import GroupDeck from './GroupDeck.js';
 import { m as moment } from './moment-bc12cb97.js';
 import SocialShare from './SocialShare.js';
-import { _ as _toConsumableArray, a as _Array$from } from './toConsumableArray-f7074d7c.js';
+import { a as _Array$from, _ as _toConsumableArray } from './toConsumableArray-f7074d7c.js';
 import Pagination from 'react-bootstrap/Pagination';
 import { h as html_decode_1 } from './entities-6d9154b4.js';
 import DFPAdSlot from './AdSlot.js';
@@ -8695,7 +8695,6 @@ var Poll$1 = function Poll(_ref) {
       _node$showResults = node.showResults,
       showResults = _node$showResults === undefined ? false : _node$showResults;
 
-  var inputRef = useRef([]);
 
   var onSubmitPoll = function onSubmitPoll(e, setShowAnswer) {
     e.preventDefault();
@@ -8716,16 +8715,6 @@ var Poll$1 = function Poll(_ref) {
       return acc;
     }
   }, 0);
-
-  var userChoiceSelection = function userChoiceSelection(e) {
-    if (inputRef.current[e.currentTarget.dataset['index']].checked) {
-      inputRef.current[e.currentTarget.dataset['index']].checked = false;
-    } else {
-      inputRef.current[e.currentTarget.dataset['index']].checked = true;
-      setSelectedChoice(inputRef.current[e.currentTarget.dataset['index']].value);
-    }
-  };
-
   return React__default.createElement(
     React__default.Fragment,
     null,
@@ -8736,84 +8725,78 @@ var Poll$1 = function Poll(_ref) {
     ),
     !showAnswer && choices && choices.length > 0 && React__default.createElement(
       'form',
-      { className: 'formPoll', onSubmit: function onSubmit(e) {
+      { onSubmit: function onSubmit(e) {
           return onSubmitPoll(e);
         } },
-      choices && choices.map(function (choice, index) {
+      choices && choices.map(function (choice) {
         return React__default.createElement(
           'div',
-          { key: choice._key, 'data-index': index, onClick: function onClick(e) {
-              return userChoiceSelection(e);
-            } },
+          { key: choice._key },
           React__default.createElement(
             'label',
             { className: 'pl-2' },
-            React__default.createElement('input', { ref: function ref(el) {
-                return inputRef.current[index] = el;
-              }, type: 'radio', id: 'male', name: choice._type, value: choice._key }),
+            React__default.createElement('input', { type: 'radio', id: 'male', name: choice._type, value: choice._key, onChange: function onChange(e) {
+                return setSelectedChoice(e.target.value);
+              } }),
             ' ' + choice.choiceText
           )
         );
       }),
       React__default.createElement(
         Button$1,
-        { disabled: !selectedChoice, className: 'mt-3', type: 'submit' },
+        { disabled: !selectedChoice, type: 'submit' },
         'Vote'
       )
     ),
-    showAnswer && React__default.createElement(
+    React__default.createElement(
       'div',
-      { className: 'progress-container mb-3' },
+      { className: 'progress-container' },
       showAnswer && choices && choices.length > 0 && choices.map(function (choice) {
         var percentage = choicesTotalCount && choicesTotalCount > 0 ? choice.choiceCount ? Math.floor(choice.choiceCount * 100 / choicesTotalCount) : 0 : 0;
         return React__default.createElement(
-          React__default.Fragment,
-          null,
-          choice.choiceAnswer === true && React__default.createElement(
-            'div',
-            null,
-            React__default.createElement(
-              'span',
-              { style: { color: 'limegreen' } },
-              'Correct!'
-            )
-          ),
+          'div',
+          { key: choice._key, className: 'mb-3' },
           React__default.createElement(
             'div',
-            { key: choice._key, className: 'mb-3' },
+            { className: 'correct-answer' },
             React__default.createElement(
               'div',
-              { className: 'correct-answer' },
-              React__default.createElement(ProgressBar, { now: percentage }),
-              React__default.createElement(
-                'div',
-                null,
-                choice.choiceText
-              ),
+              null,
+              choice.choiceText
+            ),
+            choice.choiceAnswer === true && React__default.createElement(
+              'div',
+              null,
               React__default.createElement(
-                'div',
-                { className: 'float-right' },
-                percentage,
-                '% (',
-                choice.choiceCount ? choice.choiceCount : 0,
-                ' Votes)'
+                'span',
+                { style: { color: 'limegreen' } },
+                'Correct!'
               )
             )
+          ),
+          React__default.createElement(ProgressBar, { now: percentage }),
+          React__default.createElement(
+            'span',
+            { className: 'float-right' },
+            percentage,
+            '% (',
+            choice.choiceCount ? choice.choiceCount : 0,
+            ' Votes)'
           )
         );
-      }),
-      showAnswer && React__default.createElement(
-        'h4',
-        { className: 'text-center small p-3' },
-        'Total Votes: ',
-        choicesTotalCount
-      )
+      })
+    ),
+    showAnswer && React__default.createElement(
+      'h4',
+      { className: 'text-center small p-3' },
+      'Total Votes: ',
+      choicesTotalCount
     ),
     showAnswer && response && React__default.createElement(BlockContent, { blocks: response, serializers: getSerializers }),
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n        .formPoll > div {\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n          border-radius: 5px;\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0.5rem 0;\n          text-align: center;\n          margin: 0.5rem 0;\n          cursor: pointer;\n        }\n        .formPoll > div:hover {\n          background-color: #cbcbcb;\n        }\n        .formPoll > div > label {\n          pointer-events: none;\n          margin-bottom: 0;\n        }\n        .progress-container,\n        .formPoll {\n          background-color: #eaeaea;\n          padding: 1rem;\n          border-radius: 5px;\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n        }\n        .progress-container > div {\n          position: relative;\n          font-weight: bold;\n          border-radius: 5px;\n        }\n        .progress-container > div:not(:nth-child(1)) {\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n        }\n        .correct-answer {\n          display: flex;\n          justify-content: space-between;\n          flex-direction: row;\n          align-items: center;\n          height: 2rem;\n          background-color: darkgrey;\n          border-radius: 5px;\n        }\n        .float-right {\n          z-index: 2;\n          padding-right: 1rem;\n          color: #fff;\n        }\n        .progress {\n          align-self: flex-start;\n          display: contents;\n          border-radius: 5px;\n        }\n        .progress-bar {\n          width: 33%;\n          height: 100%;\n          position: absolute;\n          border-radius: 5px 0 0 5px;\n          background-color: var(--primary);\n        }\n        .correct-answer > div:nth-child(2) {\n          z-index: 1;\n          color: white;\n          padding-left: 0.5rem;\n        }\n      '
+      '\n        .correct-answer {\n          display: flex;\n          justify-content: space-between;\n        }\n        .progress-bar {\n          color: #fff;\n        }\n      '
     )
   );
 };
@@ -8827,7 +8810,7 @@ var Poll = function Poll(_ref) {
       _ref.showVotes;
       var getSerializers = _ref.getSerializers;
 
-  var _useState = useState([]),
+  var _useState = useState(null),
       _useState2 = _slicedToArray(_useState, 2),
       selectedChoice = _useState2[0],
       setSelectedChoice = _useState2[1];
@@ -8843,7 +8826,6 @@ var Poll = function Poll(_ref) {
       _node$showResults = node.showResults,
       showResults = _node$showResults === undefined ? false : _node$showResults;
 
-  var inputRef = useRef([]);
 
   var onSubmitPoll = function onSubmitPoll(e, setShowAnswer) {
     e.preventDefault();
@@ -8892,23 +8874,6 @@ var Poll = function Poll(_ref) {
       return acc;
     }
   }, 0);
-
-  var userChoiceSelection = function userChoiceSelection(e) {
-    if (inputRef.current[e.currentTarget.dataset['index']].checked) {
-      inputRef.current[e.currentTarget.dataset['index']].checked = false;
-      var updateChoices = selectedChoice.filter(function (choice) {
-        if (inputRef.current[e.currentTarget.dataset['index']].value !== choice) {
-          return choice;
-        }
-      });
-      setSelectedChoice(updateChoices);
-    } else {
-      inputRef.current[e.currentTarget.dataset['index']].checked = true;
-
-      setSelectedChoice.apply(undefined, [inputRef.current[e.currentTarget.dataset['index']].value].concat(_toConsumableArray(selectedChoice)));
-    }
-  };
-
   return React__default.createElement(
     React__default.Fragment,
     null,
@@ -8919,84 +8884,78 @@ var Poll = function Poll(_ref) {
     ),
     !showAnswer && choices && choices.length > 0 && React__default.createElement(
       'form',
-      { className: 'multiChoicePoll', onSubmit: function onSubmit(e) {
+      { onSubmit: function onSubmit(e) {
           return onSubmitPoll(e);
         } },
-      choices && choices.map(function (choice, index) {
+      choices && choices.map(function (choice) {
         return React__default.createElement(
           'div',
-          { key: choice._key, 'data-index': index, onClick: function onClick(e) {
-              return userChoiceSelection(e);
-            } },
+          { key: choice._key },
           React__default.createElement(
             'label',
             { className: 'pl-2' },
-            React__default.createElement('input', { ref: function ref(el) {
-                return inputRef.current[index] = el;
-              }, type: 'checkbox', id: 'male', name: choice._type, value: choice._key }),
+            React__default.createElement('input', { type: 'checkbox', id: 'male', name: choice._type, value: choice._key, onChange: function onChange(e) {
+                return setSelectedChoice(e.target.value);
+              } }),
             ' ' + choice.choiceText
           )
         );
       }),
       React__default.createElement(
         Button$1,
-        { disabled: !selectedChoice, className: 'mt-3', type: 'submit' },
+        { disabled: !selectedChoice, type: 'submit' },
         'Vote'
       )
     ),
-    showAnswer && React__default.createElement(
+    React__default.createElement(
       'div',
-      { className: 'progress-container mb-3' },
+      { className: 'progress-container' },
       showAnswer && choices && choices.length > 0 && choices.map(function (choice) {
         var percentage = choicesTotalCount && choicesTotalCount > 0 ? choice.choiceCount ? Math.floor(choice.choiceCount * 100 / choicesTotalCount) : 0 : 0;
         return React__default.createElement(
-          React__default.Fragment,
-          null,
-          choice.choiceAnswer === true && React__default.createElement(
-            'div',
-            null,
-            React__default.createElement(
-              'span',
-              { style: { color: 'limegreen' } },
-              'Correct!'
-            )
-          ),
+          'div',
+          { key: choice._key, className: 'mb-3' },
           React__default.createElement(
             'div',
-            { key: choice._key, className: 'mb-3' },
+            { className: 'correct-answer' },
             React__default.createElement(
               'div',
-              { className: 'correct-answer' },
-              React__default.createElement(ProgressBar, { now: percentage }),
-              React__default.createElement(
-                'div',
-                null,
-                choice.choiceText
-              ),
+              null,
+              choice.choiceText
+            ),
+            choice.choiceAnswer === true && React__default.createElement(
+              'div',
+              null,
               React__default.createElement(
-                'div',
-                { className: 'float-right' },
-                percentage,
-                '% (',
-                choice.choiceCount ? choice.choiceCount : 0,
-                ' Votes)'
+                'span',
+                { style: { color: 'limegreen' } },
+                'Correct!'
               )
             )
+          ),
+          React__default.createElement(ProgressBar, { now: percentage }),
+          React__default.createElement(
+            'span',
+            { className: 'float-right' },
+            percentage,
+            '% (',
+            choice.choiceCount ? choice.choiceCount : 0,
+            ' Votes)'
           )
         );
-      }),
-      showAnswer && React__default.createElement(
-        'h4',
-        { className: 'text-center small p-3' },
-        'Total Votes: ',
-        choicesTotalCount
-      )
+      })
+    ),
+    showAnswer && React__default.createElement(
+      'h4',
+      { className: 'text-center small p-3' },
+      'Total Votes: ',
+      choicesTotalCount
     ),
     showAnswer && response && React__default.createElement(BlockContent, { blocks: response, serializers: getSerializers }),
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n        .multiChoicePoll > div {\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n          border-radius: 5px;\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0.5rem 0;\n          text-align: center;\n          margin: 0.5rem 0;\n          cursor: pointer;\n        }\n        .multiChoicePoll > div:hover {\n          background-color: #cbcbcb;\n        }\n        .multiChoicePoll > div > label {\n          pointer-events: none;\n          margin-bottom: 0;\n        }\n        .progress-container,\n        .multiChoicePoll {\n          background-color: #eaeaea;\n          padding: 1rem;\n          border-radius: 5px;\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n        }\n        .progress-container > div {\n          position: relative;\n          font-weight: bold;\n          border-radius: 5px;\n        }\n        .progress-container > div:not(:nth-child(1)) {\n          box-shadow: 0 0 5px 2px #9b9b9b6b;\n        }\n        .correct-answer {\n          display: flex;\n          justify-content: space-between;\n          flex-direction: row;\n          align-items: center;\n          height: 2rem;\n          background-color: darkgrey;\n          border-radius: 5px;\n        }\n        .float-right {\n          z-index: 2;\n          padding-right: 1rem;\n          color: #fff;\n        }\n        .progress {\n          align-self: flex-start;\n          display: contents;\n          border-radius: 5px;\n        }\n        .progress-bar {\n          width: 33%;\n          height: 100%;\n          position: absolute;\n          border-radius: 5px 0 0 5px;\n          background-color: var(--primary);\n        }\n        .correct-answer > div:nth-child(2) {\n          z-index: 1;\n          color: white;\n          padding-left: 0.5rem;\n        }\n      '
+      '\n        .correct-answer {\n          width: 100%;\n          display: flex;\n          justify-content: space-between;\n          padding: 0 0.5rem;\n        }\n        .progress-bar {\n          color: #fff;\n        }\n      '
     )
   );
 };