@pie-element/multiple-choice 13.0.1 → 13.1.1-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/author/defaults.d.ts +206 -0
- package/dist/author/defaults.d.ts.map +1 -0
- package/dist/author/defaults.js +151 -0
- package/dist/author/index.d.ts +27 -0
- package/dist/author/index.d.ts.map +1 -0
- package/dist/author/index.js +116 -0
- package/dist/author/main.d.ts +35 -0
- package/dist/author/main.d.ts.map +1 -0
- package/dist/author/main.js +290 -0
- package/dist/author/utils.d.ts +10 -0
- package/dist/author/utils.d.ts.map +1 -0
- package/dist/author/utils.js +7 -0
- package/dist/controller/defaults.d.ts +36 -0
- package/dist/controller/defaults.d.ts.map +1 -0
- package/dist/controller/defaults.js +29 -0
- package/dist/controller/index.d.ts +66 -0
- package/dist/controller/index.d.ts.map +1 -0
- package/dist/controller/index.js +124 -0
- package/dist/controller/utils.d.ts +11 -0
- package/dist/controller/utils.d.ts.map +1 -0
- package/dist/controller/utils.js +8 -0
- package/dist/delivery/choice-input.d.ts +45 -0
- package/dist/delivery/choice-input.d.ts.map +1 -0
- package/dist/delivery/choice-input.js +274 -0
- package/dist/delivery/choice.d.ts +21 -0
- package/dist/delivery/choice.d.ts.map +1 -0
- package/dist/delivery/choice.js +109 -0
- package/dist/delivery/feedback-tick.d.ts +21 -0
- package/dist/delivery/feedback-tick.d.ts.map +1 -0
- package/dist/delivery/feedback-tick.js +104 -0
- package/dist/delivery/index.d.ts +38 -0
- package/dist/delivery/index.d.ts.map +1 -0
- package/dist/delivery/index.js +217 -0
- package/dist/delivery/main.d.ts +32 -0
- package/dist/delivery/main.d.ts.map +1 -0
- package/dist/delivery/main.js +51 -0
- package/dist/delivery/multiple-choice.d.ts +63 -0
- package/dist/delivery/multiple-choice.d.ts.map +1 -0
- package/dist/delivery/multiple-choice.js +252 -0
- package/dist/delivery/session-updater.d.ts +11 -0
- package/dist/delivery/session-updater.d.ts.map +1 -0
- package/dist/delivery/session-updater.js +9 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.iife.d.ts +9 -0
- package/dist/index.iife.d.ts.map +1 -0
- package/dist/index.iife.js +148 -0
- package/dist/index.js +2 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_DataView.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Hash.js +16 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_ListCache.js +16 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Map.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_MapCache.js +16 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Promise.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Set.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_SetCache.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Stack.js +13 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Symbol.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_Uint8Array.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_WeakMap.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_apply.js +12 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_arrayEach.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_arrayFilter.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_arrayLikeKeys.js +15 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_arrayPush.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_arraySome.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_assignMergeValue.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_assignValue.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_assocIndexOf.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseAssign.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseAssignIn.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseAssignValue.js +12 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseClone.js +57 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseCreate.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseFor.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseGetAllKeys.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseGetTag.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsArguments.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsEqual.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsEqualDeep.js +30 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsMap.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsNative.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsSet.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseIsTypedArray.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseKeys.js +12 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseKeysIn.js +13 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseMerge.js +19 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseMergeDeep.js +31 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseRest.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseSetToString.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseTimes.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseTrim.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_baseUnary.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cacheHas.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneArrayBuffer.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneBuffer.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneDataView.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneRegExp.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneSymbol.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_cloneTypedArray.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_copyArray.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_copyObject.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_copySymbols.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_copySymbolsIn.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_coreJsData.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_createAssigner.js +15 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_createBaseFor.js +12 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_defineProperty.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_equalArrays.js +35 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_equalByTag.js +35 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_equalObjects.js +32 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_freeGlobal.js +4 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getAllKeys.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getAllKeysIn.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getMapData.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getNative.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getPrototype.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getRawTag.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getSymbols.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getSymbolsIn.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getTag.js +23 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_getValue.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_hashClear.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_hashDelete.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_hashGet.js +13 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_hashHas.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_hashSet.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_initCloneArray.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_initCloneByTag.js +33 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_initCloneObject.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_isIndex.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_isIterateeCall.js +12 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_isKeyable.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_isMasked.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_isPrototype.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_listCacheClear.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_listCacheDelete.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_listCacheGet.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_listCacheHas.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_listCacheSet.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheClear.js +13 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheDelete.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheGet.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheHas.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheSet.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_mapToArray.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_nativeCreate.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_nativeKeys.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_nativeKeysIn.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_nodeUtil.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_objectToString.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_overArg.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_overRest.js +13 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_root.js +5 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_safeGet.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_setCacheAdd.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_setCacheHas.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_setToArray.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_setToString.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_shortOut.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_stackClear.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_stackDelete.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_stackGet.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_stackHas.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_stackSet.js +16 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_toSource.js +15 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/_trimmedEndIndex.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/cloneDeep.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/constant.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/debounce.js +50 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/defaults.js +16 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/eq.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/identity.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isArguments.js +10 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isArray.js +4 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isArrayLike.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isArrayLikeObject.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isBuffer.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isEmpty.js +21 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isEqual.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isFunction.js +11 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isLength.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isMap.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isObject.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isObjectLike.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isPlainObject.js +14 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isSet.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isSymbol.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/isTypedArray.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/keys.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/keysIn.js +9 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/merge.js +8 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/now.js +7 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/stubArray.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/stubFalse.js +6 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/toNumber.js +19 -0
- package/dist/node_modules/.bun/lodash-es@4.17.23/node_modules/lodash-es/toPlainObject.js +8 -0
- package/dist/print/index.d.ts +16 -0
- package/dist/print/index.d.ts.map +1 -0
- package/dist/print/index.js +44 -0
- package/package.json +58 -26
- package/{configure/lib/defaults.js → src/author/defaults.ts} +55 -90
- package/{configure/lib/index.js → src/author/index.ts} +98 -51
- package/src/author/main.tsx +509 -0
- package/src/author/utils.ts +25 -0
- package/{controller/lib/defaults.js → src/controller/defaults.ts} +11 -8
- package/{controller/lib/index.js → src/controller/index.ts} +123 -109
- package/src/controller/utils.ts +22 -0
- package/src/delivery/choice-input.tsx +413 -0
- package/src/delivery/choice.tsx +203 -0
- package/src/delivery/feedback-tick.tsx +156 -0
- package/src/delivery/index.ts +489 -0
- package/src/delivery/main.tsx +85 -0
- package/src/delivery/multiple-choice.tsx +485 -0
- package/{lib/session-updater.js → src/delivery/session-updater.ts} +17 -13
- package/src/index.iife.ts +16 -0
- package/src/index.ts +1 -0
- package/src/print/index.tsx +112 -0
- package/CHANGELOG.json +0 -1972
- package/CHANGELOG.md +0 -2690
- package/LICENSE.md +0 -5
- package/PRINT.md +0 -35
- package/README.md +0 -56
- package/choice.png +0 -0
- package/configure/CHANGELOG.json +0 -1387
- package/configure/CHANGELOG.md +0 -2046
- package/configure/lib/defaults.js.map +0 -1
- package/configure/lib/index.js.map +0 -1
- package/configure/lib/main.js +0 -477
- package/configure/lib/main.js.map +0 -1
- package/configure/lib/utils.js +0 -18
- package/configure/lib/utils.js.map +0 -1
- package/configure/package.json +0 -22
- package/controller/CHANGELOG.json +0 -527
- package/controller/CHANGELOG.md +0 -1388
- package/controller/lib/defaults.js.map +0 -1
- package/controller/lib/index.js.map +0 -1
- package/controller/lib/utils.js +0 -15
- package/controller/lib/utils.js.map +0 -1
- package/controller/package.json +0 -15
- package/docs/config-schema.json +0 -2993
- package/docs/config-schema.json.md +0 -2217
- package/docs/demo/config.js +0 -8
- package/docs/demo/generate.js +0 -61
- package/docs/demo/index.html +0 -1
- package/docs/demo/session.js +0 -7
- package/docs/pie-schema.json +0 -1332
- package/docs/pie-schema.json.md +0 -1015
- package/lib/choice-input.js +0 -380
- package/lib/choice-input.js.map +0 -1
- package/lib/choice.js +0 -197
- package/lib/choice.js.map +0 -1
- package/lib/feedback-tick.js +0 -134
- package/lib/feedback-tick.js.map +0 -1
- package/lib/index.js +0 -337
- package/lib/index.js.map +0 -1
- package/lib/main.js +0 -57
- package/lib/main.js.map +0 -1
- package/lib/multiple-choice.js +0 -385
- package/lib/multiple-choice.js.map +0 -1
- package/lib/print.js +0 -94
- package/lib/print.js.map +0 -1
- package/lib/session-updater.js.map +0 -1
- package/module/configure.js +0 -1
- package/module/controller.js +0 -3045
- package/module/demo.js +0 -86
- package/module/element.js +0 -1
- package/module/index.html +0 -21
- package/module/manifest.json +0 -14
- package/module/print-demo.js +0 -124
- package/module/print.html +0 -18
- package/module/print.js +0 -1
package/lib/choice-input.js
DELETED
|
@@ -1,380 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = exports.StyledRadio = exports.StyledFormControlLabel = exports.StyledCheckbox = exports.ChoiceInput = void 0;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
|
-
var _FormControlLabel = _interopRequireDefault(require("@mui/material/FormControlLabel"));
|
|
11
|
-
var _react = _interopRequireDefault(require("react"));
|
|
12
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
var _styles = require("@mui/material/styles");
|
|
14
|
-
var _Box = _interopRequireDefault(require("@mui/material/Box"));
|
|
15
|
-
var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
|
|
16
|
-
var _renderUi = require("@pie-lib/render-ui");
|
|
17
|
-
var _Radio = _interopRequireDefault(require("@mui/material/Radio"));
|
|
18
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
19
|
-
var _feedbackTick = _interopRequireDefault(require("./feedback-tick"));
|
|
20
|
-
const CLASS_NAME = 'multiple-choice-component';
|
|
21
|
-
const Row = (0, _styles.styled)(_Box.default)({
|
|
22
|
-
display: 'flex',
|
|
23
|
-
alignItems: 'center',
|
|
24
|
-
backgroundColor: _renderUi.color.background()
|
|
25
|
-
});
|
|
26
|
-
const CheckboxHolder = (0, _styles.styled)(_Box.default)({
|
|
27
|
-
display: 'flex',
|
|
28
|
-
alignItems: 'center',
|
|
29
|
-
backgroundColor: _renderUi.color.background(),
|
|
30
|
-
flex: 1,
|
|
31
|
-
'& .MuiFormControlLabel-root': {
|
|
32
|
-
marginLeft: '-14px' // to be consistent to previous versions before MUI v5 upgrade
|
|
33
|
-
},
|
|
34
|
-
'& label': {
|
|
35
|
-
color: _renderUi.color.text(),
|
|
36
|
-
'& > span': {
|
|
37
|
-
fontSize: 'inherit'
|
|
38
|
-
},
|
|
39
|
-
'& > .MuiButtonBase-root': {
|
|
40
|
-
padding: '12px' // to be consistent to previous versions before MUI v5 upgrade
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
});
|
|
44
|
-
const BelowSelectionComponent = (0, _styles.styled)('span')(({
|
|
45
|
-
theme
|
|
46
|
-
}) => ({
|
|
47
|
-
display: 'flex',
|
|
48
|
-
alignItems: 'center',
|
|
49
|
-
'& > span': {
|
|
50
|
-
// visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles
|
|
51
|
-
marginLeft: `-${theme.spacing(1)}`
|
|
52
|
-
}
|
|
53
|
-
}));
|
|
54
|
-
const SrOnly = (0, _styles.styled)('span')({
|
|
55
|
-
position: 'absolute',
|
|
56
|
-
left: '-10000px',
|
|
57
|
-
top: 'auto',
|
|
58
|
-
width: '1px',
|
|
59
|
-
height: '1px',
|
|
60
|
-
overflow: 'hidden'
|
|
61
|
-
});
|
|
62
|
-
const StyledFormControlLabel = exports.StyledFormControlLabel = (0, _styles.styled)(_FormControlLabel.default)({
|
|
63
|
-
'& .MuiFormControlLabel-label': {
|
|
64
|
-
color: `${_renderUi.color.text()} !important`,
|
|
65
|
-
backgroundColor: _renderUi.color.background(),
|
|
66
|
-
letterSpacing: 'normal'
|
|
67
|
-
},
|
|
68
|
-
'&.Mui-disabled *': {
|
|
69
|
-
cursor: 'not-allowed !important'
|
|
70
|
-
}
|
|
71
|
-
});
|
|
72
|
-
const colorStyle = (varName, fallback) => ({
|
|
73
|
-
[`&.${CLASS_NAME}`]: {
|
|
74
|
-
color: `var(--choice-input-${varName}, ${fallback}) !important`
|
|
75
|
-
}
|
|
76
|
-
});
|
|
77
|
-
const getInputStyles = correctness => {
|
|
78
|
-
const key = k => correctness ? `${correctness}-${k}` : k;
|
|
79
|
-
return {
|
|
80
|
-
[key('root')]: {
|
|
81
|
-
...colorStyle('color', _renderUi.color.text()),
|
|
82
|
-
...(correctness ? {} : {
|
|
83
|
-
'&:hover': {
|
|
84
|
-
color: `${_renderUi.color.primaryLight()} !important`
|
|
85
|
-
}
|
|
86
|
-
}),
|
|
87
|
-
...(correctness === 'correct' ? colorStyle('correct-color', _renderUi.color.text()) : {}),
|
|
88
|
-
...(correctness === 'incorrect' ? colorStyle('incorrect-color', _renderUi.color.incorrect()) : {})
|
|
89
|
-
},
|
|
90
|
-
[key('checked')]: {
|
|
91
|
-
...(correctness === 'correct' ? colorStyle('correct-selected-color', _renderUi.color.correct()) : {}),
|
|
92
|
-
...(correctness === 'incorrect' ? colorStyle('incorrect-checked', _renderUi.color.incorrect()) : {}),
|
|
93
|
-
...(!correctness ? colorStyle('selected-color', _renderUi.color.primary()) : {})
|
|
94
|
-
},
|
|
95
|
-
[key('disabled')]: {
|
|
96
|
-
...colorStyle('disabled-color', _renderUi.color.text()),
|
|
97
|
-
...(correctness === 'correct' ? colorStyle('correct-disabled-color', _renderUi.color.disabled()) : {}),
|
|
98
|
-
...(correctness === 'incorrect' ? colorStyle('incorrect-disabled-color', _renderUi.color.disabled()) : {}),
|
|
99
|
-
opacity: 0.6,
|
|
100
|
-
cursor: 'not-allowed !important',
|
|
101
|
-
pointerEvents: 'initial !important'
|
|
102
|
-
},
|
|
103
|
-
focusVisibleUnchecked: {
|
|
104
|
-
outline: `2px solid ${_renderUi.color.focusUncheckedBorder()}`,
|
|
105
|
-
backgroundColor: _renderUi.color.focusUnchecked()
|
|
106
|
-
},
|
|
107
|
-
focusVisibleChecked: {
|
|
108
|
-
outline: `2px solid ${_renderUi.color.focusCheckedBorder()}`,
|
|
109
|
-
backgroundColor: _renderUi.color.focusChecked()
|
|
110
|
-
}
|
|
111
|
-
};
|
|
112
|
-
};
|
|
113
|
-
const StyledCheckboxBase = (0, _styles.styled)(_Checkbox.default, {
|
|
114
|
-
shouldForwardProp: prop => prop !== 'correctness'
|
|
115
|
-
})(({
|
|
116
|
-
correctness
|
|
117
|
-
}) => {
|
|
118
|
-
const styles = getInputStyles(correctness);
|
|
119
|
-
const key = k => correctness ? `${correctness}-${k}` : k;
|
|
120
|
-
return {
|
|
121
|
-
[`&.${CLASS_NAME}`]: {
|
|
122
|
-
...styles[key('root')],
|
|
123
|
-
'&.Mui-checked': styles[key('checked')],
|
|
124
|
-
'&.Mui-disabled': correctness ? {} : styles[key('disabled')]
|
|
125
|
-
},
|
|
126
|
-
'&.Mui-focusVisible': {
|
|
127
|
-
'&:not(.Mui-checked)': styles.focusVisibleUnchecked,
|
|
128
|
-
'&.Mui-checked': styles.focusVisibleChecked
|
|
129
|
-
}
|
|
130
|
-
};
|
|
131
|
-
});
|
|
132
|
-
const StyledCheckbox = props => {
|
|
133
|
-
const {
|
|
134
|
-
correctness,
|
|
135
|
-
checked,
|
|
136
|
-
onChange,
|
|
137
|
-
disabled,
|
|
138
|
-
value,
|
|
139
|
-
id,
|
|
140
|
-
onKeyDown,
|
|
141
|
-
inputRef
|
|
142
|
-
} = props;
|
|
143
|
-
const miniProps = {
|
|
144
|
-
checked,
|
|
145
|
-
onChange,
|
|
146
|
-
disabled,
|
|
147
|
-
value
|
|
148
|
-
};
|
|
149
|
-
return /*#__PURE__*/_react.default.createElement(StyledCheckboxBase, (0, _extends2.default)({
|
|
150
|
-
id: id,
|
|
151
|
-
slotProps: {
|
|
152
|
-
input: {
|
|
153
|
-
ref: inputRef
|
|
154
|
-
}
|
|
155
|
-
},
|
|
156
|
-
onKeyDown: onKeyDown,
|
|
157
|
-
disableRipple: true
|
|
158
|
-
}, miniProps, {
|
|
159
|
-
correctness: correctness,
|
|
160
|
-
className: CLASS_NAME
|
|
161
|
-
}));
|
|
162
|
-
};
|
|
163
|
-
exports.StyledCheckbox = StyledCheckbox;
|
|
164
|
-
const StyledRadioBase = (0, _styles.styled)(_Radio.default, {
|
|
165
|
-
shouldForwardProp: prop => prop !== 'correctness'
|
|
166
|
-
})(({
|
|
167
|
-
correctness
|
|
168
|
-
}) => {
|
|
169
|
-
const styles = getInputStyles(correctness);
|
|
170
|
-
const key = k => correctness ? `${correctness}-${k}` : k;
|
|
171
|
-
return {
|
|
172
|
-
[`&.${CLASS_NAME}`]: {
|
|
173
|
-
...styles[key('root')],
|
|
174
|
-
'&.Mui-checked': styles[key('checked')],
|
|
175
|
-
'&.Mui-disabled': correctness ? {} : styles[key('disabled')]
|
|
176
|
-
},
|
|
177
|
-
'&.Mui-focusVisible': {
|
|
178
|
-
'&:not(.Mui-checked)': styles.focusVisibleUnchecked,
|
|
179
|
-
'&.Mui-checked': styles.focusVisibleChecked
|
|
180
|
-
}
|
|
181
|
-
};
|
|
182
|
-
});
|
|
183
|
-
const StyledRadio = props => {
|
|
184
|
-
const {
|
|
185
|
-
correctness,
|
|
186
|
-
checked,
|
|
187
|
-
onChange,
|
|
188
|
-
disabled,
|
|
189
|
-
value,
|
|
190
|
-
id,
|
|
191
|
-
tagName,
|
|
192
|
-
inputRef
|
|
193
|
-
} = props;
|
|
194
|
-
const miniProps = {
|
|
195
|
-
checked,
|
|
196
|
-
onChange,
|
|
197
|
-
disabled,
|
|
198
|
-
value
|
|
199
|
-
};
|
|
200
|
-
return /*#__PURE__*/_react.default.createElement(StyledRadioBase, (0, _extends2.default)({
|
|
201
|
-
id: id,
|
|
202
|
-
slotProps: {
|
|
203
|
-
input: {
|
|
204
|
-
ref: inputRef
|
|
205
|
-
}
|
|
206
|
-
},
|
|
207
|
-
disableRipple: true
|
|
208
|
-
}, miniProps, {
|
|
209
|
-
correctness: correctness,
|
|
210
|
-
className: CLASS_NAME,
|
|
211
|
-
name: tagName
|
|
212
|
-
}));
|
|
213
|
-
};
|
|
214
|
-
exports.StyledRadio = StyledRadio;
|
|
215
|
-
class ChoiceInput extends _react.default.Component {
|
|
216
|
-
constructor(props) {
|
|
217
|
-
super(props);
|
|
218
|
-
(0, _defineProperty2.default)(this, "handleKeyDown", event => {
|
|
219
|
-
const {
|
|
220
|
-
choiceMode
|
|
221
|
-
} = this.props;
|
|
222
|
-
if (choiceMode !== 'checkbox') return;
|
|
223
|
-
const isArrowDown = event.key === 'ArrowDown';
|
|
224
|
-
const isArrowUp = event.key === 'ArrowUp';
|
|
225
|
-
if (!isArrowDown && !isArrowUp) return;
|
|
226
|
-
event.preventDefault();
|
|
227
|
-
const currentEl = document.getElementById(this.choiceId);
|
|
228
|
-
if (!currentEl) return;
|
|
229
|
-
const fieldset = currentEl.closest('fieldset');
|
|
230
|
-
if (!fieldset) return;
|
|
231
|
-
const groupCheckboxes = Array.from(fieldset.querySelectorAll('input[type="checkbox"]'));
|
|
232
|
-
const currentIndex = groupCheckboxes.findIndex(el => el === currentEl);
|
|
233
|
-
if (currentIndex === -1) return;
|
|
234
|
-
const nextIndex = isArrowDown ? currentIndex + 1 : currentIndex - 1;
|
|
235
|
-
const nextEl = groupCheckboxes[nextIndex];
|
|
236
|
-
if (nextEl) {
|
|
237
|
-
nextEl.focus();
|
|
238
|
-
}
|
|
239
|
-
});
|
|
240
|
-
this.onToggleChoice = this.onToggleChoice.bind(this);
|
|
241
|
-
this.choiceId = this.generateChoiceId();
|
|
242
|
-
this.descId = `${this.choiceId}-desc`;
|
|
243
|
-
}
|
|
244
|
-
onToggleChoice(event) {
|
|
245
|
-
this.props.onChange(event);
|
|
246
|
-
}
|
|
247
|
-
generateChoiceId() {
|
|
248
|
-
return 'choice-' + (Math.random() * 10000).toFixed();
|
|
249
|
-
}
|
|
250
|
-
render() {
|
|
251
|
-
const {
|
|
252
|
-
choiceMode,
|
|
253
|
-
disabled,
|
|
254
|
-
displayKey,
|
|
255
|
-
feedback,
|
|
256
|
-
label,
|
|
257
|
-
correctness,
|
|
258
|
-
className,
|
|
259
|
-
rationale,
|
|
260
|
-
hideTick,
|
|
261
|
-
isEvaluateMode,
|
|
262
|
-
choicesLayout,
|
|
263
|
-
value,
|
|
264
|
-
checked,
|
|
265
|
-
tagName,
|
|
266
|
-
isSelectionButtonBelow
|
|
267
|
-
} = this.props;
|
|
268
|
-
const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;
|
|
269
|
-
const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';
|
|
270
|
-
const holderSx = {
|
|
271
|
-
...(choicesLayout === 'horizontal' && {
|
|
272
|
-
[`& .${CLASS_NAME}`]: {
|
|
273
|
-
padding: '8px',
|
|
274
|
-
margin: '4px 0 4px 4px'
|
|
275
|
-
}
|
|
276
|
-
}),
|
|
277
|
-
...(isSelectionButtonBelow && choicesLayout !== 'grid' && {
|
|
278
|
-
'& > label': {
|
|
279
|
-
alignItems: 'flex-start'
|
|
280
|
-
}
|
|
281
|
-
}),
|
|
282
|
-
...(isSelectionButtonBelow && choicesLayout === 'grid' && {
|
|
283
|
-
justifyContent: 'center',
|
|
284
|
-
'& > label': {
|
|
285
|
-
alignItems: 'center'
|
|
286
|
-
}
|
|
287
|
-
})
|
|
288
|
-
};
|
|
289
|
-
const hasMathOrImage = typeof label === 'string' && (label.includes('<math') || label.includes('\\(') || label.includes('\\[') || label.includes('<img') || label.includes('data-latex') || label.includes('data-raw') || label.includes('<mjx-container'));
|
|
290
|
-
const screenReaderLabel = displayKey ? /*#__PURE__*/_react.default.createElement(SrOnly, {
|
|
291
|
-
id: this.descId
|
|
292
|
-
}, hasMathOrImage ? `Pick the answer below, ${displayKey}` : displayKey) : null;
|
|
293
|
-
const choicelabel = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, displayKey && !isSelectionButtonBelow ? /*#__PURE__*/_react.default.createElement(Row, {
|
|
294
|
-
component: "span"
|
|
295
|
-
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
296
|
-
"aria-hidden": "true"
|
|
297
|
-
}, displayKey, ".", '\u00A0'), /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
|
|
298
|
-
className: "prompt-label",
|
|
299
|
-
prompt: label,
|
|
300
|
-
tagName: "span"
|
|
301
|
-
})) : /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
|
|
302
|
-
className: "prompt-label",
|
|
303
|
-
prompt: label,
|
|
304
|
-
tagName: "span"
|
|
305
|
-
}));
|
|
306
|
-
const tagProps = {
|
|
307
|
-
disabled,
|
|
308
|
-
checked,
|
|
309
|
-
correctness,
|
|
310
|
-
tagName,
|
|
311
|
-
value,
|
|
312
|
-
id: this.choiceId,
|
|
313
|
-
onChange: this.onToggleChoice,
|
|
314
|
-
onKeyDown: this.handleKeyDown,
|
|
315
|
-
...(screenReaderLabel ? {
|
|
316
|
-
'aria-describedby': this.descId
|
|
317
|
-
} : {})
|
|
318
|
-
};
|
|
319
|
-
const control = isSelectionButtonBelow ? /*#__PURE__*/_react.default.createElement(BelowSelectionComponent, null, screenReaderLabel, /*#__PURE__*/_react.default.createElement(Tag, (0, _extends2.default)({}, tagProps, {
|
|
320
|
-
style: {
|
|
321
|
-
padding: 0
|
|
322
|
-
}
|
|
323
|
-
})), /*#__PURE__*/_react.default.createElement("span", {
|
|
324
|
-
"aria-hidden": "true"
|
|
325
|
-
}, displayKey ? `${displayKey}.` : '')) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, screenReaderLabel, /*#__PURE__*/_react.default.createElement(Tag, (0, _extends2.default)({}, tagProps, {
|
|
326
|
-
slotProps: {
|
|
327
|
-
input: {
|
|
328
|
-
ref: this.props.autoFocusRef
|
|
329
|
-
}
|
|
330
|
-
}
|
|
331
|
-
})));
|
|
332
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
333
|
-
className: (0, _classnames.default)(className, 'corespring-' + classSuffix, 'choice-input')
|
|
334
|
-
}, /*#__PURE__*/_react.default.createElement(Row, null, !hideTick && isEvaluateMode && /*#__PURE__*/_react.default.createElement(_feedbackTick.default, {
|
|
335
|
-
correctness: correctness
|
|
336
|
-
}), /*#__PURE__*/_react.default.createElement(CheckboxHolder, {
|
|
337
|
-
className: "checkbox-holder",
|
|
338
|
-
sx: holderSx
|
|
339
|
-
}, /*#__PURE__*/_react.default.createElement(StyledFormControlLabel, {
|
|
340
|
-
label: choicelabel,
|
|
341
|
-
value: value,
|
|
342
|
-
htmlFor: this.choiceId,
|
|
343
|
-
labelPlacement: isSelectionButtonBelow ? 'top' : undefined,
|
|
344
|
-
control: control
|
|
345
|
-
}))), rationale && /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
|
|
346
|
-
className: "rationale",
|
|
347
|
-
defaultClassName: "rationale",
|
|
348
|
-
prompt: rationale
|
|
349
|
-
}), /*#__PURE__*/_react.default.createElement(_renderUi.Feedback, {
|
|
350
|
-
feedback: feedback,
|
|
351
|
-
correctness: correctness
|
|
352
|
-
}));
|
|
353
|
-
}
|
|
354
|
-
}
|
|
355
|
-
exports.ChoiceInput = ChoiceInput;
|
|
356
|
-
(0, _defineProperty2.default)(ChoiceInput, "propTypes", {
|
|
357
|
-
choiceMode: _propTypes.default.oneOf(['radio', 'checkbox']),
|
|
358
|
-
displayKey: _propTypes.default.string,
|
|
359
|
-
checked: _propTypes.default.bool.isRequired,
|
|
360
|
-
correctness: _propTypes.default.string,
|
|
361
|
-
disabled: _propTypes.default.bool.isRequired,
|
|
362
|
-
feedback: _propTypes.default.string,
|
|
363
|
-
label: _propTypes.default.string.isRequired,
|
|
364
|
-
rationale: _propTypes.default.string,
|
|
365
|
-
onChange: _propTypes.default.func.isRequired,
|
|
366
|
-
value: _propTypes.default.string.isRequired,
|
|
367
|
-
className: _propTypes.default.string,
|
|
368
|
-
tagName: _propTypes.default.string,
|
|
369
|
-
hideTick: _propTypes.default.bool,
|
|
370
|
-
isEvaluateMode: _propTypes.default.bool,
|
|
371
|
-
choicesLayout: _propTypes.default.oneOf(['vertical', 'grid', 'horizontal']),
|
|
372
|
-
isSelectionButtonBelow: _propTypes.default.bool
|
|
373
|
-
});
|
|
374
|
-
(0, _defineProperty2.default)(ChoiceInput, "defaultProps", {
|
|
375
|
-
rationale: null,
|
|
376
|
-
checked: false,
|
|
377
|
-
isEvaluateMode: false
|
|
378
|
-
});
|
|
379
|
-
var _default = exports.default = ChoiceInput;
|
|
380
|
-
//# sourceMappingURL=choice-input.js.map
|
package/lib/choice-input.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"choice-input.js","names":["_FormControlLabel","_interopRequireDefault","require","_react","_propTypes","_styles","_Box","_Checkbox","_renderUi","_Radio","_classnames","_feedbackTick","CLASS_NAME","Row","styled","Box","display","alignItems","backgroundColor","color","background","CheckboxHolder","flex","marginLeft","text","fontSize","padding","BelowSelectionComponent","theme","spacing","SrOnly","position","left","top","width","height","overflow","StyledFormControlLabel","exports","FormControlLabel","letterSpacing","cursor","colorStyle","varName","fallback","getInputStyles","correctness","key","k","primaryLight","incorrect","correct","primary","disabled","opacity","pointerEvents","focusVisibleUnchecked","outline","focusUncheckedBorder","focusUnchecked","focusVisibleChecked","focusCheckedBorder","focusChecked","StyledCheckboxBase","Checkbox","shouldForwardProp","prop","styles","StyledCheckbox","props","checked","onChange","value","id","onKeyDown","inputRef","miniProps","default","createElement","_extends2","slotProps","input","ref","disableRipple","className","StyledRadioBase","Radio","StyledRadio","tagName","name","ChoiceInput","React","Component","constructor","_defineProperty2","event","choiceMode","isArrowDown","isArrowUp","preventDefault","currentEl","document","getElementById","choiceId","fieldset","closest","groupCheckboxes","Array","from","querySelectorAll","currentIndex","findIndex","el","nextIndex","nextEl","focus","onToggleChoice","bind","generateChoiceId","descId","Math","random","toFixed","render","displayKey","feedback","label","rationale","hideTick","isEvaluateMode","choicesLayout","isSelectionButtonBelow","Tag","classSuffix","holderSx","margin","justifyContent","hasMathOrImage","includes","screenReaderLabel","choicelabel","Fragment","component","PreviewPrompt","prompt","tagProps","handleKeyDown","control","style","autoFocusRef","classNames","sx","htmlFor","labelPlacement","undefined","defaultClassName","Feedback","PropTypes","oneOf","string","bool","isRequired","func","_default"],"sources":["../src/choice-input.jsx"],"sourcesContent":["import FormControlLabel from '@mui/material/FormControlLabel';\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport Box from '@mui/material/Box';\nimport Checkbox from '@mui/material/Checkbox';\nimport { Feedback, color, PreviewPrompt } from '@pie-lib/render-ui';\nimport Radio from '@mui/material/Radio';\nimport classNames from 'classnames';\n\nimport FeedbackTick from './feedback-tick';\n\nconst CLASS_NAME = 'multiple-choice-component';\n\nconst Row = styled(Box)({\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n});\n\nconst CheckboxHolder = styled(Box)({\n display: 'flex',\n alignItems: 'center',\n backgroundColor: color.background(),\n flex: 1,\n '& .MuiFormControlLabel-root': {\n marginLeft: '-14px', // to be consistent to previous versions before MUI v5 upgrade\n },\n '& label': {\n color: color.text(),\n '& > span': {\n fontSize: 'inherit',\n },\n '& > .MuiButtonBase-root': {\n padding: '12px', // to be consistent to previous versions before MUI v5 upgrade\n },\n },\n});\n\nconst BelowSelectionComponent = styled('span')(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n '& > span': {\n // visually reduce right padding, but maintain accessibility padding for checkbox indicators to be circles\n marginLeft: `-${theme.spacing(1)}`,\n },\n}));\n\nconst SrOnly = styled('span')({\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n});\n\nexport const StyledFormControlLabel = styled(FormControlLabel)({\n '& .MuiFormControlLabel-label': {\n color: `${color.text()} !important`,\n backgroundColor: color.background(),\n letterSpacing: 'normal',\n },\n '&.Mui-disabled *': {\n cursor: 'not-allowed !important',\n },\n});\n\nconst colorStyle = (varName, fallback) => ({\n [`&.${CLASS_NAME}`]: {\n color: `var(--choice-input-${varName}, ${fallback}) !important`,\n },\n});\n\nconst getInputStyles = (correctness) => {\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n return {\n [key('root')]: {\n ...colorStyle('color', color.text()),\n ...(correctness ? {} : {\n '&:hover': { color: `${color.primaryLight()} !important` },\n }),\n ...(correctness === 'correct' ? colorStyle('correct-color', color.text()) : {}),\n ...(correctness === 'incorrect' ? colorStyle('incorrect-color', color.incorrect()) : {}),\n },\n [key('checked')]: {\n ...(correctness === 'correct' ? colorStyle('correct-selected-color', color.correct()) : {}),\n ...(correctness === 'incorrect' ? colorStyle('incorrect-checked', color.incorrect()) : {}),\n ...(!correctness ? colorStyle('selected-color', color.primary()) : {}),\n },\n [key('disabled')]: {\n ...colorStyle('disabled-color', color.text()),\n ...(correctness === 'correct' ? colorStyle('correct-disabled-color', color.disabled()) : {}),\n ...(correctness === 'incorrect' ? colorStyle('incorrect-disabled-color', color.disabled()) : {}),\n opacity: 0.6,\n cursor: 'not-allowed !important',\n pointerEvents: 'initial !important',\n },\n focusVisibleUnchecked: {\n outline: `2px solid ${color.focusUncheckedBorder()}`,\n backgroundColor: color.focusUnchecked(),\n },\n focusVisibleChecked: {\n outline: `2px solid ${color.focusCheckedBorder()}`,\n backgroundColor: color.focusChecked(),\n },\n };\n};\n\nconst StyledCheckboxBase = styled(Checkbox, {\n shouldForwardProp: (prop) => prop !== 'correctness',\n})(({ correctness }) => {\n const styles = getInputStyles(correctness);\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n return {\n [`&.${CLASS_NAME}`]: {\n ...styles[key('root')],\n '&.Mui-checked': styles[key('checked')],\n '&.Mui-disabled': correctness ? {} : styles[key('disabled')],\n },\n '&.Mui-focusVisible': {\n '&:not(.Mui-checked)': styles.focusVisibleUnchecked,\n '&.Mui-checked': styles.focusVisibleChecked,\n },\n };\n});\n\nexport const StyledCheckbox = (props) => {\n const { correctness, checked, onChange, disabled, value, id, onKeyDown, inputRef } = props;\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <StyledCheckboxBase\n id={id}\n slotProps={{ input: { ref: inputRef } }}\n onKeyDown={onKeyDown}\n disableRipple\n {...miniProps}\n correctness={correctness}\n className={CLASS_NAME}\n />\n );\n};\n\nconst StyledRadioBase = styled(Radio, {\n shouldForwardProp: (prop) => prop !== 'correctness',\n})(({ correctness }) => {\n const styles = getInputStyles(correctness);\n const key = (k) => (correctness ? `${correctness}-${k}` : k);\n\n return {\n [`&.${CLASS_NAME}`]: {\n ...styles[key('root')],\n '&.Mui-checked': styles[key('checked')],\n '&.Mui-disabled': correctness ? {} : styles[key('disabled')],\n },\n '&.Mui-focusVisible': {\n '&:not(.Mui-checked)': styles.focusVisibleUnchecked,\n '&.Mui-checked': styles.focusVisibleChecked,\n },\n };\n});\n\nexport const StyledRadio = (props) => {\n const { correctness, checked, onChange, disabled, value, id, tagName, inputRef } = props;\n\n const miniProps = { checked, onChange, disabled, value };\n\n return (\n <StyledRadioBase\n id={id}\n slotProps={{ input: { ref: inputRef } }}\n disableRipple\n {...miniProps}\n correctness={correctness}\n className={CLASS_NAME}\n name={tagName}\n />\n );\n};\n\nexport class ChoiceInput extends React.Component {\n static propTypes = {\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n displayKey: PropTypes.string,\n checked: PropTypes.bool.isRequired,\n correctness: PropTypes.string,\n disabled: PropTypes.bool.isRequired,\n feedback: PropTypes.string,\n label: PropTypes.string.isRequired,\n rationale: PropTypes.string,\n onChange: PropTypes.func.isRequired,\n value: PropTypes.string.isRequired,\n className: PropTypes.string,\n tagName: PropTypes.string,\n hideTick: PropTypes.bool,\n isEvaluateMode: PropTypes.bool,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n isSelectionButtonBelow: PropTypes.bool,\n };\n\n static defaultProps = {\n rationale: null,\n checked: false,\n isEvaluateMode: false,\n };\n\n constructor(props) {\n super(props);\n this.onToggleChoice = this.onToggleChoice.bind(this);\n this.choiceId = this.generateChoiceId();\n this.descId = `${this.choiceId}-desc`;\n }\n\n onToggleChoice(event) {\n this.props.onChange(event);\n }\n\n generateChoiceId() {\n return 'choice-' + (Math.random() * 10000).toFixed();\n }\n\n handleKeyDown = (event) => {\n const { choiceMode } = this.props;\n\n if (choiceMode !== 'checkbox') return;\n\n const isArrowDown = event.key === 'ArrowDown';\n const isArrowUp = event.key === 'ArrowUp';\n\n if (!isArrowDown && !isArrowUp) return;\n\n event.preventDefault();\n\n const currentEl = document.getElementById(this.choiceId);\n if (!currentEl) return;\n\n const fieldset = currentEl.closest('fieldset');\n if (!fieldset) return;\n\n const groupCheckboxes = Array.from(fieldset.querySelectorAll('input[type=\"checkbox\"]'));\n\n const currentIndex = groupCheckboxes.findIndex((el) => el === currentEl);\n if (currentIndex === -1) return;\n\n const nextIndex = isArrowDown ? currentIndex + 1 : currentIndex - 1;\n const nextEl = groupCheckboxes[nextIndex];\n\n if (nextEl) {\n nextEl.focus();\n }\n };\n\n render() {\n const {\n choiceMode,\n disabled,\n displayKey,\n feedback,\n label,\n correctness,\n className,\n rationale,\n hideTick,\n isEvaluateMode,\n choicesLayout,\n value,\n checked,\n tagName,\n isSelectionButtonBelow,\n } = this.props;\n\n const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;\n const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';\n\n const holderSx = {\n ...(choicesLayout === 'horizontal' && {\n [`& .${CLASS_NAME}`]: {\n padding: '8px',\n margin: '4px 0 4px 4px',\n },\n }),\n ...(isSelectionButtonBelow && choicesLayout !== 'grid' && {\n '& > label': {\n alignItems: 'flex-start',\n },\n }),\n ...(isSelectionButtonBelow && choicesLayout === 'grid' && {\n justifyContent: 'center',\n '& > label': {\n alignItems: 'center',\n },\n }),\n };\n\n const hasMathOrImage =\n typeof label === 'string' &&\n (label.includes('<math') ||\n label.includes('\\\\(') ||\n label.includes('\\\\[') ||\n label.includes('<img') ||\n label.includes('data-latex') ||\n label.includes('data-raw') ||\n label.includes('<mjx-container'));\n\n const screenReaderLabel = displayKey ? (\n <SrOnly id={this.descId}>\n {hasMathOrImage ? `Pick the answer below, ${displayKey}` : displayKey}\n </SrOnly>\n ) : null;\n\n const choicelabel = (\n <>\n {displayKey && !isSelectionButtonBelow ? (\n <Row component=\"span\">\n <span aria-hidden=\"true\">{displayKey}.{'\\u00A0'}</span>\n <PreviewPrompt className=\"prompt-label\" prompt={label} tagName=\"span\" />\n </Row>\n ) : (\n <PreviewPrompt className=\"prompt-label\" prompt={label} tagName=\"span\" />\n )}\n </>\n );\n\n const tagProps = {\n disabled,\n checked,\n correctness,\n tagName,\n value,\n id: this.choiceId,\n onChange: this.onToggleChoice,\n onKeyDown: this.handleKeyDown,\n ...(screenReaderLabel ? { 'aria-describedby': this.descId } : {}),\n };\n\n const control = isSelectionButtonBelow ? (\n <BelowSelectionComponent>\n {screenReaderLabel}\n <Tag {...tagProps} style={{ padding: 0 }} />\n <span aria-hidden=\"true\">{displayKey ? `${displayKey}.` : ''}</span>\n </BelowSelectionComponent>\n ) : (\n <>\n {screenReaderLabel}\n <Tag {...tagProps} slotProps={{ input: { ref: this.props.autoFocusRef } }} />\n </>\n );\n\n return (\n <div className={classNames(className, 'corespring-' + classSuffix, 'choice-input')}>\n <Row>\n {!hideTick && isEvaluateMode && <FeedbackTick correctness={correctness} />}\n <CheckboxHolder className=\"checkbox-holder\" sx={holderSx}>\n <StyledFormControlLabel\n label={choicelabel}\n value={value}\n htmlFor={this.choiceId}\n labelPlacement={isSelectionButtonBelow ? 'top' : undefined}\n control={control}\n />\n </CheckboxHolder>\n </Row>\n {rationale && <PreviewPrompt className=\"rationale\" defaultClassName=\"rationale\" prompt={rationale} />}\n <Feedback feedback={feedback} correctness={correctness} />\n </div>\n );\n }\n}\n\nexport default ChoiceInput;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/choice.js
DELETED
|
@@ -1,197 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = exports.Choice = void 0;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
-
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
|
-
var _styles = require("@mui/material/styles");
|
|
13
|
-
var _Box = _interopRequireDefault(require("@mui/material/Box"));
|
|
14
|
-
var _choiceInput = _interopRequireDefault(require("./choice-input"));
|
|
15
|
-
const ChoiceContainer = (0, _styles.styled)(_Box.default, {
|
|
16
|
-
shouldForwardProp: prop => prop !== 'noBorder' && prop !== 'horizontalLayout'
|
|
17
|
-
})(({
|
|
18
|
-
theme,
|
|
19
|
-
noBorder,
|
|
20
|
-
horizontalLayout
|
|
21
|
-
}) => ({
|
|
22
|
-
paddingTop: theme.spacing(2.5),
|
|
23
|
-
paddingBottom: `calc(${theme.spacing(1)} + 2px)`,
|
|
24
|
-
paddingLeft: `calc(${theme.spacing(1)} + 2px)`,
|
|
25
|
-
paddingRight: `calc(${theme.spacing(1)} + 2px)`,
|
|
26
|
-
borderBottom: noBorder ? 'none' : `1px solid ${theme.palette.grey[300]}`,
|
|
27
|
-
...(horizontalLayout && {
|
|
28
|
-
paddingRight: theme.spacing(2.5),
|
|
29
|
-
'& label': {
|
|
30
|
-
marginRight: theme.spacing(1)
|
|
31
|
-
}
|
|
32
|
-
})
|
|
33
|
-
}));
|
|
34
|
-
class Choice extends _react.default.Component {
|
|
35
|
-
constructor(...args) {
|
|
36
|
-
super(...args);
|
|
37
|
-
(0, _defineProperty2.default)(this, "state", {
|
|
38
|
-
isHovered: false
|
|
39
|
-
});
|
|
40
|
-
(0, _defineProperty2.default)(this, "handleMouseEnter", () => {
|
|
41
|
-
const {
|
|
42
|
-
disabled,
|
|
43
|
-
checked
|
|
44
|
-
} = this.props;
|
|
45
|
-
if (!disabled && !checked) {
|
|
46
|
-
this.setState({
|
|
47
|
-
isHovered: true
|
|
48
|
-
});
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
(0, _defineProperty2.default)(this, "handleMouseLeave", () => {
|
|
52
|
-
this.setState({
|
|
53
|
-
isHovered: false
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
(0, _defineProperty2.default)(this, "onChange", choice => {
|
|
57
|
-
const {
|
|
58
|
-
disabled,
|
|
59
|
-
onChoiceChanged
|
|
60
|
-
} = this.props;
|
|
61
|
-
if (!disabled) {
|
|
62
|
-
onChoiceChanged(choice);
|
|
63
|
-
}
|
|
64
|
-
});
|
|
65
|
-
}
|
|
66
|
-
render() {
|
|
67
|
-
const {
|
|
68
|
-
choice,
|
|
69
|
-
index,
|
|
70
|
-
choicesLength,
|
|
71
|
-
showCorrect,
|
|
72
|
-
isEvaluateMode,
|
|
73
|
-
choiceMode,
|
|
74
|
-
disabled,
|
|
75
|
-
checked,
|
|
76
|
-
correctness,
|
|
77
|
-
displayKey,
|
|
78
|
-
choicesLayout,
|
|
79
|
-
gridColumns,
|
|
80
|
-
isSelectionButtonBelow,
|
|
81
|
-
selectedAnswerBackgroundColor,
|
|
82
|
-
selectedAnswerStrokeColor,
|
|
83
|
-
selectedAnswerStrokeWidth,
|
|
84
|
-
hoverAnswerBackgroundColor,
|
|
85
|
-
hoverAnswerStrokeColor,
|
|
86
|
-
hoverAnswerStrokeWidth,
|
|
87
|
-
autoFocusRef,
|
|
88
|
-
tagName
|
|
89
|
-
} = this.props;
|
|
90
|
-
const {
|
|
91
|
-
isHovered
|
|
92
|
-
} = this.state;
|
|
93
|
-
const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');
|
|
94
|
-
const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;
|
|
95
|
-
const choiceProps = {
|
|
96
|
-
...choice,
|
|
97
|
-
checked,
|
|
98
|
-
choiceMode,
|
|
99
|
-
disabled,
|
|
100
|
-
feedback,
|
|
101
|
-
correctness,
|
|
102
|
-
displayKey,
|
|
103
|
-
index,
|
|
104
|
-
choicesLayout,
|
|
105
|
-
gridColumns,
|
|
106
|
-
onChange: this.onChange,
|
|
107
|
-
isEvaluateMode,
|
|
108
|
-
isSelectionButtonBelow,
|
|
109
|
-
selectedAnswerStrokeColor,
|
|
110
|
-
selectedAnswerStrokeWidth,
|
|
111
|
-
tagName
|
|
112
|
-
};
|
|
113
|
-
const normalizeStrokeWidth = width => {
|
|
114
|
-
if (!width) return '2px'; // default
|
|
115
|
-
const trimmed = String(width).trim();
|
|
116
|
-
|
|
117
|
-
// add 'px' if the value is a number
|
|
118
|
-
if (/^\d+(\.\d+)?$/.test(trimmed)) {
|
|
119
|
-
return `${trimmed}px`;
|
|
120
|
-
}
|
|
121
|
-
return trimmed;
|
|
122
|
-
};
|
|
123
|
-
const hasSelectedStroke = selectedAnswerStrokeColor && selectedAnswerStrokeColor !== 'initial';
|
|
124
|
-
const hasHoverStroke = hoverAnswerStrokeColor && hoverAnswerStrokeColor !== 'initial';
|
|
125
|
-
let currentStrokeColor = 'transparent';
|
|
126
|
-
let currentStrokeWidth = '2px';
|
|
127
|
-
let currentBackgroundColor = 'initial';
|
|
128
|
-
if (hasSelectedStroke || hasHoverStroke) {
|
|
129
|
-
if (checked && hasSelectedStroke) {
|
|
130
|
-
// selected state takes priority when selected stroke is configured
|
|
131
|
-
currentStrokeColor = selectedAnswerStrokeColor;
|
|
132
|
-
currentStrokeWidth = selectedAnswerStrokeWidth;
|
|
133
|
-
} else if (isHovered && !disabled && hasHoverStroke) {
|
|
134
|
-
// hover state when not selected and not disabled, and hover stroke is configured
|
|
135
|
-
currentStrokeColor = hoverAnswerStrokeColor;
|
|
136
|
-
currentStrokeWidth = hoverAnswerStrokeWidth;
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
if (checked && selectedAnswerBackgroundColor && selectedAnswerBackgroundColor !== 'initial') {
|
|
140
|
-
currentBackgroundColor = selectedAnswerBackgroundColor;
|
|
141
|
-
} else if (isHovered && !disabled && hoverAnswerBackgroundColor && hoverAnswerBackgroundColor !== 'initial') {
|
|
142
|
-
currentBackgroundColor = hoverAnswerBackgroundColor;
|
|
143
|
-
}
|
|
144
|
-
const hasStroke = hasSelectedStroke || hasHoverStroke;
|
|
145
|
-
const strokeStyle = hasStroke ? {
|
|
146
|
-
border: `${normalizeStrokeWidth(currentStrokeWidth)} solid ${currentStrokeColor}`,
|
|
147
|
-
borderRadius: '8px'
|
|
148
|
-
} : {};
|
|
149
|
-
const noBorder = index === choicesLength - 1 || choicesLayout !== 'vertical' || hasStroke;
|
|
150
|
-
const horizontalLayout = choicesLayout === 'horizontal';
|
|
151
|
-
const choiceBackground = currentBackgroundColor !== 'initial' ? currentBackgroundColor : 'initial';
|
|
152
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
153
|
-
className: choiceClass,
|
|
154
|
-
key: index,
|
|
155
|
-
style: {
|
|
156
|
-
backgroundColor: choiceBackground,
|
|
157
|
-
...strokeStyle
|
|
158
|
-
},
|
|
159
|
-
onMouseEnter: this.handleMouseEnter,
|
|
160
|
-
onMouseLeave: this.handleMouseLeave
|
|
161
|
-
}, /*#__PURE__*/_react.default.createElement(ChoiceContainer, {
|
|
162
|
-
component: "div",
|
|
163
|
-
noBorder: noBorder,
|
|
164
|
-
horizontalLayout: horizontalLayout
|
|
165
|
-
}, /*#__PURE__*/_react.default.createElement(_choiceInput.default, (0, _extends2.default)({}, choiceProps, {
|
|
166
|
-
autoFocusRef: autoFocusRef
|
|
167
|
-
}))));
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
exports.Choice = Choice;
|
|
171
|
-
(0, _defineProperty2.default)(Choice, "propTypes", {});
|
|
172
|
-
Choice.propTypes = {
|
|
173
|
-
choiceMode: _propTypes.default.oneOf(['radio', 'checkbox']),
|
|
174
|
-
choice: _propTypes.default.object,
|
|
175
|
-
disabled: _propTypes.default.bool.isRequired,
|
|
176
|
-
onChoiceChanged: _propTypes.default.func,
|
|
177
|
-
index: _propTypes.default.number,
|
|
178
|
-
choicesLength: _propTypes.default.number,
|
|
179
|
-
showCorrect: _propTypes.default.bool,
|
|
180
|
-
isEvaluateMode: _propTypes.default.bool,
|
|
181
|
-
checked: _propTypes.default.bool,
|
|
182
|
-
correctness: _propTypes.default.string,
|
|
183
|
-
displayKey: _propTypes.default.string,
|
|
184
|
-
choicesLayout: _propTypes.default.oneOf(['vertical', 'grid', 'horizontal']),
|
|
185
|
-
gridColumns: _propTypes.default.string,
|
|
186
|
-
selectedAnswerBackgroundColor: _propTypes.default.string,
|
|
187
|
-
selectedAnswerStrokeColor: _propTypes.default.string,
|
|
188
|
-
selectedAnswerStrokeWidth: _propTypes.default.string,
|
|
189
|
-
hoverAnswerBackgroundColor: _propTypes.default.string,
|
|
190
|
-
hoverAnswerStrokeColor: _propTypes.default.string,
|
|
191
|
-
hoverAnswerStrokeWidth: _propTypes.default.string,
|
|
192
|
-
tagName: _propTypes.default.string,
|
|
193
|
-
isSelectionButtonBelow: _propTypes.default.bool,
|
|
194
|
-
autoFocusRef: _propTypes.default.object
|
|
195
|
-
};
|
|
196
|
-
var _default = exports.default = Choice;
|
|
197
|
-
//# sourceMappingURL=choice.js.map
|
package/lib/choice.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"choice.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_Box","_choiceInput","ChoiceContainer","styled","Box","shouldForwardProp","prop","theme","noBorder","horizontalLayout","paddingTop","spacing","paddingBottom","paddingLeft","paddingRight","borderBottom","palette","grey","marginRight","Choice","React","Component","constructor","args","_defineProperty2","default","isHovered","disabled","checked","props","setState","choice","onChoiceChanged","render","index","choicesLength","showCorrect","isEvaluateMode","choiceMode","correctness","displayKey","choicesLayout","gridColumns","isSelectionButtonBelow","selectedAnswerBackgroundColor","selectedAnswerStrokeColor","selectedAnswerStrokeWidth","hoverAnswerBackgroundColor","hoverAnswerStrokeColor","hoverAnswerStrokeWidth","autoFocusRef","tagName","state","choiceClass","feedback","choiceProps","onChange","normalizeStrokeWidth","width","trimmed","String","trim","test","hasSelectedStroke","hasHoverStroke","currentStrokeColor","currentStrokeWidth","currentBackgroundColor","hasStroke","strokeStyle","border","borderRadius","choiceBackground","createElement","className","key","style","backgroundColor","onMouseEnter","handleMouseEnter","onMouseLeave","handleMouseLeave","component","_extends2","exports","propTypes","PropTypes","oneOf","object","bool","isRequired","func","number","string","_default"],"sources":["../src/choice.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport Box from '@mui/material/Box';\n\nimport ChoiceInput from './choice-input';\n\nconst ChoiceContainer = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'noBorder' && prop !== 'horizontalLayout',\n})(({ theme, noBorder, horizontalLayout }) => ({\n paddingTop: theme.spacing(2.5),\n paddingBottom: `calc(${theme.spacing(1)} + 2px)`,\n paddingLeft: `calc(${theme.spacing(1)} + 2px)`,\n paddingRight: `calc(${theme.spacing(1)} + 2px)`,\n borderBottom: noBorder ? 'none' : `1px solid ${theme.palette.grey[300]}`,\n ...(horizontalLayout && {\n paddingRight: theme.spacing(2.5),\n '& label': {\n marginRight: theme.spacing(1),\n },\n }),\n}));\n\nexport class Choice extends React.Component {\n static propTypes = {};\n\n state = {\n isHovered: false,\n };\n\n handleMouseEnter = () => {\n const { disabled, checked } = this.props;\n\n if (!disabled && !checked) {\n this.setState({ isHovered: true });\n }\n };\n\n handleMouseLeave = () => {\n this.setState({ isHovered: false });\n };\n\n onChange = (choice) => {\n const { disabled, onChoiceChanged } = this.props;\n\n if (!disabled) {\n onChoiceChanged(choice);\n }\n };\n\n render() {\n const {\n choice,\n index,\n choicesLength,\n showCorrect,\n isEvaluateMode,\n choiceMode,\n disabled,\n checked,\n correctness,\n displayKey,\n choicesLayout,\n gridColumns,\n isSelectionButtonBelow,\n selectedAnswerBackgroundColor,\n selectedAnswerStrokeColor,\n selectedAnswerStrokeWidth,\n hoverAnswerBackgroundColor,\n hoverAnswerStrokeColor,\n hoverAnswerStrokeWidth,\n autoFocusRef,\n tagName\n } = this.props;\n \n const { isHovered } = this.state;\n const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');\n\n const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;\n\n const choiceProps = {\n ...choice,\n checked,\n choiceMode,\n disabled,\n feedback,\n correctness,\n displayKey,\n index,\n choicesLayout,\n gridColumns,\n onChange: this.onChange,\n isEvaluateMode,\n isSelectionButtonBelow,\n selectedAnswerStrokeColor,\n selectedAnswerStrokeWidth,\n tagName,\n };\n\n const normalizeStrokeWidth = (width) => {\n if (!width) return '2px'; // default\n const trimmed = String(width).trim();\n \n // add 'px' if the value is a number\n if (/^\\d+(\\.\\d+)?$/.test(trimmed)) {\n return `${trimmed}px`;\n }\n\n return trimmed;\n };\n\n const hasSelectedStroke = selectedAnswerStrokeColor && selectedAnswerStrokeColor !== 'initial';\n const hasHoverStroke = hoverAnswerStrokeColor && hoverAnswerStrokeColor !== 'initial';\n \n let currentStrokeColor = 'transparent';\n let currentStrokeWidth = '2px';\n let currentBackgroundColor = 'initial';\n \n if ((hasSelectedStroke || hasHoverStroke)) {\n if (checked && hasSelectedStroke) {\n // selected state takes priority when selected stroke is configured\n currentStrokeColor = selectedAnswerStrokeColor;\n currentStrokeWidth = selectedAnswerStrokeWidth;\n } else if (isHovered && !disabled && hasHoverStroke) {\n // hover state when not selected and not disabled, and hover stroke is configured\n currentStrokeColor = hoverAnswerStrokeColor;\n currentStrokeWidth = hoverAnswerStrokeWidth;\n }\n }\n \n if (checked && selectedAnswerBackgroundColor && selectedAnswerBackgroundColor !== 'initial') {\n currentBackgroundColor = selectedAnswerBackgroundColor;\n } else if (isHovered && !disabled && hoverAnswerBackgroundColor && hoverAnswerBackgroundColor !== 'initial') {\n currentBackgroundColor = hoverAnswerBackgroundColor;\n }\n\n const hasStroke = hasSelectedStroke || hasHoverStroke;\n const strokeStyle = hasStroke ? {\n border: `${normalizeStrokeWidth(currentStrokeWidth)} solid ${currentStrokeColor}`,\n borderRadius: '8px',\n } : {};\n\n const noBorder = index === choicesLength - 1 || choicesLayout !== 'vertical' || hasStroke;\n const horizontalLayout = choicesLayout === 'horizontal';\n\n const choiceBackground = currentBackgroundColor !== 'initial' ? currentBackgroundColor : 'initial';\n\n return (\n <div \n className={choiceClass} \n key={index} \n style={{ backgroundColor: choiceBackground, ...strokeStyle }}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n <ChoiceContainer \n component=\"div\"\n noBorder={noBorder}\n horizontalLayout={horizontalLayout}\n >\n <ChoiceInput {...choiceProps} autoFocusRef={autoFocusRef} />\n </ChoiceContainer>\n </div>\n );\n }\n}\n\nChoice.propTypes = {\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n choice: PropTypes.object,\n disabled: PropTypes.bool.isRequired,\n onChoiceChanged: PropTypes.func,\n index: PropTypes.number,\n choicesLength: PropTypes.number,\n showCorrect: PropTypes.bool,\n isEvaluateMode: PropTypes.bool,\n checked: PropTypes.bool,\n correctness: PropTypes.string,\n displayKey: PropTypes.string,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n selectedAnswerStrokeColor: PropTypes.string,\n selectedAnswerStrokeWidth: PropTypes.string,\n hoverAnswerBackgroundColor: PropTypes.string,\n hoverAnswerStrokeColor: PropTypes.string,\n hoverAnswerStrokeWidth: PropTypes.string,\n tagName: PropTypes.string,\n isSelectionButtonBelow: PropTypes.bool,\n autoFocusRef: PropTypes.object,\n};\n\nexport default Choice;\n"],"mappings":"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","ignoreList":[]}
|