@citolab/qti-components 7.2.1 → 7.2.2

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.
Files changed (248) hide show
  1. package/cdn/chunks/chunk-2EE5IVNF.js +1 -0
  2. package/cdn/chunks/chunk-2S62LLS5.js +2 -0
  3. package/cdn/chunks/chunk-33KVDPBT.js +5 -0
  4. package/cdn/chunks/chunk-4TNE5ZQS.js +5 -0
  5. package/cdn/chunks/chunk-57ZBXU3V.js +5 -0
  6. package/cdn/chunks/chunk-5RGC3O3Z.js +3 -0
  7. package/cdn/chunks/chunk-5WJBI6M7.js +1033 -0
  8. package/cdn/chunks/chunk-66BMMESW.js +2 -0
  9. package/cdn/chunks/chunk-6D53FU3U.js +2 -0
  10. package/cdn/chunks/chunk-72GJGEI2.js +2 -0
  11. package/cdn/chunks/chunk-73GTDWYG.js +2 -0
  12. package/cdn/chunks/chunk-7G2JKRYL.js +3 -0
  13. package/cdn/chunks/chunk-7HDBTHS7.js +2 -0
  14. package/cdn/chunks/chunk-7U6V7TMQ.js +1 -0
  15. package/cdn/chunks/chunk-BH7YS4N7.js +5 -0
  16. package/cdn/chunks/chunk-DAKW2UJX.js +3 -0
  17. package/cdn/chunks/chunk-DPW6VAG2.js +3441 -0
  18. package/cdn/chunks/chunk-DQCUGHMI.js +2 -0
  19. package/cdn/chunks/chunk-DTD5NE7V.js +2 -0
  20. package/cdn/chunks/chunk-EJE3C3VD.js +5 -0
  21. package/cdn/chunks/chunk-FGT2KVW2.js +1 -0
  22. package/cdn/chunks/chunk-FXG6JQNB.js +3 -0
  23. package/cdn/chunks/chunk-G3O7FTGW.js +2 -0
  24. package/cdn/chunks/chunk-GSDSRYPT.js +5 -0
  25. package/cdn/chunks/chunk-GW7MTJY4.js +2 -0
  26. package/cdn/chunks/chunk-HNZFDARC.js +2 -0
  27. package/cdn/chunks/chunk-I37HIF37.js +2 -0
  28. package/cdn/chunks/chunk-IFSRAUBH.js +1 -0
  29. package/cdn/chunks/chunk-IJ47QETV.js +2 -0
  30. package/cdn/chunks/chunk-JVY3MIVH.js +5 -0
  31. package/cdn/chunks/chunk-JXGYDOJM.js +3 -0
  32. package/cdn/chunks/chunk-K3HDRUZ2.js +2 -0
  33. package/cdn/chunks/chunk-KGNJ44AT.js +2 -0
  34. package/cdn/chunks/chunk-KM6BQLUW.js +2 -0
  35. package/cdn/chunks/chunk-KMPDXXNC.js +5 -0
  36. package/cdn/chunks/chunk-KPFC2HQR.js +3 -0
  37. package/cdn/chunks/chunk-KZQ2VXMQ.js +2 -0
  38. package/cdn/chunks/chunk-LEC3TBJ3.js +2 -0
  39. package/cdn/chunks/chunk-ME2BEQTK.js +3463 -0
  40. package/cdn/chunks/chunk-MM3TTGOD.js +5 -0
  41. package/cdn/chunks/chunk-NBXY7TMD.js +2 -0
  42. package/cdn/chunks/chunk-NCNOPEEF.js +2 -0
  43. package/cdn/chunks/chunk-O7JELRBY.js +2 -0
  44. package/cdn/chunks/chunk-OCQAZUB6.js +2 -0
  45. package/cdn/chunks/chunk-QBBWQ5J6.js +5 -0
  46. package/cdn/chunks/chunk-QPP7ZB2K.js +5 -0
  47. package/cdn/chunks/chunk-RSOX5VS5.js +3 -0
  48. package/cdn/chunks/chunk-SHXTMXYU.js +1 -0
  49. package/cdn/chunks/chunk-SNRRONMC.js +2 -0
  50. package/cdn/chunks/chunk-SUDAVHNM.js +1 -0
  51. package/cdn/chunks/chunk-UUKFU4BI.js +2 -0
  52. package/cdn/chunks/chunk-V65TZQVT.js +2 -0
  53. package/cdn/chunks/chunk-VIW7IGYG.js +2 -0
  54. package/cdn/chunks/chunk-W7LBE76A.js +5 -0
  55. package/cdn/chunks/chunk-WANQ7VHH.js +2 -0
  56. package/cdn/chunks/chunk-WI3S4WLU.js +2 -0
  57. package/cdn/chunks/chunk-WQK3JD6Q.js +5 -0
  58. package/cdn/chunks/chunk-WRAMSS3Q.js +3465 -0
  59. package/cdn/chunks/chunk-XLY6GBBJ.js +2 -0
  60. package/cdn/chunks/chunk-XNII2G63.js +3468 -0
  61. package/cdn/chunks/chunk-YSCJG7CX.js +3461 -0
  62. package/cdn/index.js +1 -1
  63. package/cdn/qti-item/components/item-container.js +1 -1
  64. package/cdn/qti-item/core/index.js +1 -1
  65. package/cdn/qti-test/components/index.js +1 -1
  66. package/cdn/qti-test/components/test-container.js +1 -1
  67. package/cdn/qti-test/components/test-navigation.js +1 -1
  68. package/cdn/qti-test/components/test-print-context.js +1 -1
  69. package/cdn/qti-test/components/test-stamp.js +1 -1
  70. package/cdn/qti-test/core/index.js +1 -1
  71. package/dist/chunks/chunk-25AXOL6N.js +73 -0
  72. package/dist/chunks/chunk-25AXOL6N.js.map +1 -0
  73. package/dist/chunks/chunk-34ZMZ5GH.js +76 -0
  74. package/dist/chunks/chunk-34ZMZ5GH.js.map +1 -0
  75. package/dist/chunks/chunk-3UPSFFDF.js +45 -0
  76. package/dist/chunks/chunk-3UPSFFDF.js.map +1 -0
  77. package/dist/chunks/chunk-4NZYGJLT.js +94 -0
  78. package/dist/chunks/chunk-4NZYGJLT.js.map +1 -0
  79. package/dist/chunks/chunk-4UIDYSZL.js +78 -0
  80. package/dist/chunks/chunk-4UIDYSZL.js.map +1 -0
  81. package/dist/chunks/chunk-4V7ZPUTP.js +78 -0
  82. package/dist/chunks/chunk-4V7ZPUTP.js.map +1 -0
  83. package/dist/chunks/chunk-5IQUODBV.js +94 -0
  84. package/dist/chunks/chunk-5IQUODBV.js.map +1 -0
  85. package/dist/chunks/chunk-6B7USFAR.js +82 -0
  86. package/dist/chunks/chunk-6B7USFAR.js.map +1 -0
  87. package/dist/chunks/chunk-6IC436D3.js +95 -0
  88. package/dist/chunks/chunk-6IC436D3.js.map +1 -0
  89. package/dist/chunks/chunk-6MXANZQB.js +80 -0
  90. package/dist/chunks/chunk-6MXANZQB.js.map +1 -0
  91. package/dist/chunks/chunk-6UZG2X74.js +870 -0
  92. package/dist/chunks/chunk-6UZG2X74.js.map +1 -0
  93. package/dist/chunks/chunk-6XLSPSL3.js +94 -0
  94. package/dist/chunks/chunk-6XLSPSL3.js.map +1 -0
  95. package/dist/chunks/chunk-AXVMZW54.js +73 -0
  96. package/dist/chunks/chunk-AXVMZW54.js.map +1 -0
  97. package/dist/chunks/chunk-B5Y4EZF6.js +80 -0
  98. package/dist/chunks/chunk-B5Y4EZF6.js.map +1 -0
  99. package/dist/chunks/chunk-B7NLQTW7.js +69 -0
  100. package/dist/chunks/chunk-B7NLQTW7.js.map +1 -0
  101. package/dist/chunks/chunk-BAEQ4MHU.js +69 -0
  102. package/dist/chunks/chunk-BAEQ4MHU.js.map +1 -0
  103. package/dist/chunks/chunk-C2KEHCRU.js +80 -0
  104. package/dist/chunks/chunk-C2KEHCRU.js.map +1 -0
  105. package/dist/chunks/chunk-CL6HNHNL.js +72 -0
  106. package/dist/chunks/chunk-CL6HNHNL.js.map +1 -0
  107. package/dist/chunks/chunk-DH2EP5PV.js +81 -0
  108. package/dist/chunks/chunk-DH2EP5PV.js.map +1 -0
  109. package/dist/chunks/chunk-DIETZXSR.js +78 -0
  110. package/dist/chunks/chunk-DIETZXSR.js.map +1 -0
  111. package/dist/chunks/chunk-DOP7DN3W.js +78 -0
  112. package/dist/chunks/chunk-DOP7DN3W.js.map +1 -0
  113. package/dist/chunks/chunk-DTZHLZH2.js +8 -0
  114. package/dist/chunks/chunk-DTZHLZH2.js.map +1 -0
  115. package/dist/chunks/chunk-EBKJVMIY.js +79 -0
  116. package/dist/chunks/chunk-EBKJVMIY.js.map +1 -0
  117. package/dist/chunks/chunk-ECXRMWLT.js +94 -0
  118. package/dist/chunks/chunk-ECXRMWLT.js.map +1 -0
  119. package/dist/chunks/chunk-FDIYM6TD.js +68 -0
  120. package/dist/chunks/chunk-FDIYM6TD.js.map +1 -0
  121. package/dist/chunks/chunk-FROMX3AY.js +78 -0
  122. package/dist/chunks/chunk-FROMX3AY.js.map +1 -0
  123. package/dist/chunks/chunk-FVD3INZH.js +69 -0
  124. package/dist/chunks/chunk-FVD3INZH.js.map +1 -0
  125. package/dist/chunks/chunk-GJVATV62.js +43 -0
  126. package/dist/chunks/chunk-GJVATV62.js.map +1 -0
  127. package/dist/chunks/chunk-GWSHKTCL.js +33 -0
  128. package/dist/chunks/chunk-GWSHKTCL.js.map +1 -0
  129. package/dist/chunks/chunk-H2Z5FH4R.js +76 -0
  130. package/dist/chunks/chunk-H2Z5FH4R.js.map +1 -0
  131. package/dist/chunks/chunk-HAP6ALTQ.js +78 -0
  132. package/dist/chunks/chunk-HAP6ALTQ.js.map +1 -0
  133. package/dist/chunks/chunk-HL7H4ZGY.js +82 -0
  134. package/dist/chunks/chunk-HL7H4ZGY.js.map +1 -0
  135. package/dist/chunks/chunk-HQ7IWQPH.js +80 -0
  136. package/dist/chunks/chunk-HQ7IWQPH.js.map +1 -0
  137. package/dist/chunks/chunk-IA235UXD.js +79 -0
  138. package/dist/chunks/chunk-IA235UXD.js.map +1 -0
  139. package/dist/chunks/chunk-IIDUZWYL.js +78 -0
  140. package/dist/chunks/chunk-IIDUZWYL.js.map +1 -0
  141. package/dist/chunks/chunk-IKVCQGA6.js +79 -0
  142. package/dist/chunks/chunk-IKVCQGA6.js.map +1 -0
  143. package/dist/chunks/chunk-IT6EGJUH.js +68 -0
  144. package/dist/chunks/chunk-IT6EGJUH.js.map +1 -0
  145. package/dist/chunks/chunk-IWSVL7HX.js +94 -0
  146. package/dist/chunks/chunk-IWSVL7HX.js.map +1 -0
  147. package/dist/chunks/chunk-K5SSEHCG.js +92 -0
  148. package/dist/chunks/chunk-K5SSEHCG.js.map +1 -0
  149. package/dist/chunks/chunk-KYGAKC4X.js +82 -0
  150. package/dist/chunks/chunk-KYGAKC4X.js.map +1 -0
  151. package/dist/chunks/chunk-LT563K5H.js +78 -0
  152. package/dist/chunks/chunk-LT563K5H.js.map +1 -0
  153. package/dist/chunks/chunk-LVWZUV4A.js +86 -0
  154. package/dist/chunks/chunk-LVWZUV4A.js.map +1 -0
  155. package/dist/chunks/chunk-MCMAHBGE.js +3455 -0
  156. package/dist/chunks/chunk-MCMAHBGE.js.map +1 -0
  157. package/dist/chunks/chunk-NFPHKFFE.js +78 -0
  158. package/dist/chunks/chunk-NFPHKFFE.js.map +1 -0
  159. package/dist/chunks/chunk-NLW7S5TN.js +94 -0
  160. package/dist/chunks/chunk-NLW7S5TN.js.map +1 -0
  161. package/dist/chunks/chunk-O2YP7VIE.js +245 -0
  162. package/dist/chunks/chunk-O2YP7VIE.js.map +1 -0
  163. package/dist/chunks/chunk-OAKKH2XA.js +99 -0
  164. package/dist/chunks/chunk-OAKKH2XA.js.map +1 -0
  165. package/dist/chunks/chunk-OBIKEFCI.js +56 -0
  166. package/dist/chunks/chunk-OBIKEFCI.js.map +1 -0
  167. package/dist/chunks/chunk-OEJMOV45.js +78 -0
  168. package/dist/chunks/chunk-OEJMOV45.js.map +1 -0
  169. package/dist/chunks/chunk-OFYYP7AK.js +94 -0
  170. package/dist/chunks/chunk-OFYYP7AK.js.map +1 -0
  171. package/dist/chunks/chunk-PJMWNLXZ.js +80 -0
  172. package/dist/chunks/chunk-PJMWNLXZ.js.map +1 -0
  173. package/dist/chunks/chunk-QGVSNUAF.js +79 -0
  174. package/dist/chunks/chunk-QGVSNUAF.js.map +1 -0
  175. package/dist/chunks/chunk-QIN2S2F7.js +94 -0
  176. package/dist/chunks/chunk-QIN2S2F7.js.map +1 -0
  177. package/dist/chunks/chunk-QKYFFNPR.js +3453 -0
  178. package/dist/chunks/chunk-QKYFFNPR.js.map +1 -0
  179. package/dist/chunks/chunk-QMIYPOBM.js +3458 -0
  180. package/dist/chunks/chunk-QMIYPOBM.js.map +1 -0
  181. package/dist/chunks/chunk-QMYMPOQQ.js +69 -0
  182. package/dist/chunks/chunk-QMYMPOQQ.js.map +1 -0
  183. package/dist/chunks/chunk-RGQDJQVE.js +3451 -0
  184. package/dist/chunks/chunk-RGQDJQVE.js.map +1 -0
  185. package/dist/chunks/chunk-SWROECSL.js +82 -0
  186. package/dist/chunks/chunk-SWROECSL.js.map +1 -0
  187. package/dist/chunks/chunk-TGF5F45T.js +94 -0
  188. package/dist/chunks/chunk-TGF5F45T.js.map +1 -0
  189. package/dist/chunks/chunk-TUVS6HU4.js +85 -0
  190. package/dist/chunks/chunk-TUVS6HU4.js.map +1 -0
  191. package/dist/chunks/chunk-UHU4AWX2.js +28 -0
  192. package/dist/chunks/chunk-UHU4AWX2.js.map +1 -0
  193. package/dist/chunks/chunk-V53ESOPP.js +79 -0
  194. package/dist/chunks/chunk-V53ESOPP.js.map +1 -0
  195. package/dist/chunks/chunk-VGGCSCVL.js +94 -0
  196. package/dist/chunks/chunk-VGGCSCVL.js.map +1 -0
  197. package/dist/chunks/chunk-WTN76Y5P.js +74 -0
  198. package/dist/chunks/chunk-WTN76Y5P.js.map +1 -0
  199. package/dist/chunks/chunk-WVMOFVRE.js +74 -0
  200. package/dist/chunks/chunk-WVMOFVRE.js.map +1 -0
  201. package/dist/chunks/chunk-WXQLAXP4.js +73 -0
  202. package/dist/chunks/chunk-WXQLAXP4.js.map +1 -0
  203. package/dist/chunks/chunk-X2ZV2OFN.js +82 -0
  204. package/dist/chunks/chunk-X2ZV2OFN.js.map +1 -0
  205. package/dist/chunks/chunk-XAJNR7FS.js +74 -0
  206. package/dist/chunks/chunk-XAJNR7FS.js.map +1 -0
  207. package/dist/chunks/chunk-YBDDKT65.js +69 -0
  208. package/dist/chunks/chunk-YBDDKT65.js.map +1 -0
  209. package/dist/chunks/chunk-YKKQ6AI7.js +69 -0
  210. package/dist/chunks/chunk-YKKQ6AI7.js.map +1 -0
  211. package/dist/chunks/chunk-YLHGELZY.js +79 -0
  212. package/dist/chunks/chunk-YLHGELZY.js.map +1 -0
  213. package/dist/chunks/chunk-YQC26WHY.js +79 -0
  214. package/dist/chunks/chunk-YQC26WHY.js.map +1 -0
  215. package/dist/chunks/chunk-ZBUXIAEV.js +3431 -0
  216. package/dist/chunks/chunk-ZBUXIAEV.js.map +1 -0
  217. package/dist/chunks/chunk-ZU6ANMBF.js +28 -0
  218. package/dist/chunks/chunk-ZU6ANMBF.js.map +1 -0
  219. package/dist/exports/computed.context.d.ts +4 -0
  220. package/dist/exports/computed.context.js +1 -1
  221. package/dist/exports/session.context.d.ts +1 -1
  222. package/dist/index.d.ts +1 -1
  223. package/dist/index.js +28 -28
  224. package/dist/item.css +6 -0
  225. package/dist/qti-components-jsx.d.ts +10 -7
  226. package/dist/qti-item/components/item-container.js +2 -2
  227. package/dist/qti-item/core/index.js +2 -2
  228. package/dist/qti-test/components/index.d.ts +1 -1
  229. package/dist/qti-test/components/index.js +19 -19
  230. package/dist/qti-test/components/test-container.js +2 -2
  231. package/dist/qti-test/components/test-navigation.d.ts +1 -1
  232. package/dist/qti-test/components/test-navigation.js +2 -2
  233. package/dist/qti-test/components/test-next.js +2 -2
  234. package/dist/qti-test/components/test-paging-buttons-stamp.js +2 -2
  235. package/dist/qti-test/components/test-prev.js +2 -2
  236. package/dist/qti-test/components/test-print-context.js +2 -2
  237. package/dist/qti-test/components/test-print-item-variables.js +2 -2
  238. package/dist/qti-test/components/test-scoring-buttons.js +2 -2
  239. package/dist/qti-test/components/test-scoring-feedback.js +2 -2
  240. package/dist/qti-test/components/test-section-buttons-stamp.js +2 -2
  241. package/dist/qti-test/components/test-show-correct-response.js +2 -2
  242. package/dist/qti-test/components/test-stamp.d.ts +8 -1
  243. package/dist/qti-test/components/test-stamp.js +2 -2
  244. package/dist/qti-test/core/index.d.ts +2 -2
  245. package/dist/qti-test/core/index.js +1 -1
  246. package/dist/qti-test-feedback-C4bd_5i4.d.ts +98 -0
  247. package/dist/vscode.html-custom-data.json +13 -7
  248. package/package.json +3 -1
package/dist/chunks/chunk-RGQDJQVE.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["inline:../../../item.css?inline"],"sourcesContent":["@layer qti-base, qti-components, qti-utilities, qti-variants, qti-extended;\n\n:root,\n:host {\n /* Active colors */\n --qti-bg-active: #ffecec;\n --qti-border-active: #f86d70;\n\n /* Correct colors */\n --qti-correct-light: #c8e6c9;\n --qti-correct: #66bb6a;\n\n /* Gap size */\n --qti-gap-size: 1rem;\n\n /* Background colors */\n --qti-bg: white;\n --qti-hover-bg: #f9fafb;\n\n /* Light theme colors */\n --qti-light-bg-active: #f0f0f0; /* Light gray */\n --qti-light-border-active: #d0d0d0; /* Medium gray */\n\n /* Dark theme colors */\n --qti-dark-bg-active: #1f2937; /* Dark gray */\n --qti-dark-border-active: #64748b; /* Medium gray */\n\n /* Disabled colors */\n --qti-disabled-bg: #f3f4f6;\n --qti-disabled-color: #45484f;\n\n /* Border properties */\n --qti-border-thickness: 2px;\n --qti-border-style: solid;\n --qti-border-color: #c6cad0;\n --qti-border-radius: 0.3rem;\n --qti-drop-border-radius: calc(var(--qti-border-radius) + var(--qti-border-thickness));\n\n /* Focus & active states */\n --qti-focus-border-width: 5px;\n --qti-focus-color: #bddcff7e;\n\n /* Class-specific variables */\n\n /* Form elements */\n --qti-form-size: 1rem;\n\n /* Order buttons */\n --qti-order-size: 2rem;\n\n /* Generic padding for all elements */\n --qti-padding-vertical: 0.5rem; /* py-2 */\n --qti-padding-horizontal: 0.5rem; /* px-2 */\n}\n\n/* SVG masks and backgrounds */\n\n.chevron {\n background: url(\"data:image/svg+xml,%3Csvg fill='currentColor' width='22' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' aria-hidden='true'%3E%3Cpath clip-rule='evenodd' fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z'%3E%3C/path%3E%3C/svg%3E\")\n no-repeat center right 6px;\n}\n\n.handle {\n background-image: radial-gradient(\n circle at center,\n rgb(0 0 0 / 10%) 0,\n rgb(0 0 0 / 20%) 2px,\n rgb(255 255 255 / 0%) 2px,\n rgb(255 255 255 / 0%) 100%\n );\n background-repeat: repeat-y;\n background-position: left center;\n background-size: 14px 8px;\n}\n\n.check-mask {\n -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n}\n\n/* \n Following are classes that can be applied to elements and element states, so they are not used directly \n The @apply directive is used to apply these classes to elements\n*/\n\n/* Apply .bordered to an element */\n\n.bordered {\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .form rules for checkbox and radiobutton */\n\n.form {\n\n /* background-color: var(--qti-bg); */\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .button rules for button-like elements, such as drags and buttons */\n\n.button {\n\n border-radius: var(--qti-border-radius);\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .select for the select dropdown element */\n\n.select {\n\n border-radius: var(--qti-border-radius);\n position: relative;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n padding-right: calc(var(--qti-padding-horizontal) + 1.5rem); /* 1.5rem for the chevron */ border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color); outline: none; background: url(\"data:image/svg+xml,%3Csvg fill='currentColor' width='22' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' aria-hidden='true'%3E%3Cpath clip-rule='evenodd' fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z'%3E%3C/path%3E%3C/svg%3E\")\n no-repeat center right 6px;\n}\n\n/* Apply .text for the input text and textarea */\n\n.text {\n\n border-radius: 0;\n cursor: text;\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n background: var(--qti-bg);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .spot for hotspot shapes */\n\n.spot {\n\n width: 100%;\n height: 100%;\n background-color: transparent;\n padding: 0;\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .point for circular small hotspots */\n\n.point {\n\n border-radius: 100%;\n border: 1px solid white;\n background-color: black;\n opacity: 0.5;\n padding: 0;\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .drag for draggable elements */\n\n.drag {\n\n transition:\n transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n cursor: grab;\n background-color: var(--qti-bg);\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n border-radius: var(--qti-border-radius);\n\n /* padding-left: calc(var(--qti-padding-horizontal) + 0.5rem) !important; */\n\n /* 1.5rem for the drag */\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n}\n\n/* Apply .dragging for the dragging state of a draggable element */\n\n.dragging {\n pointer-events: none;\n rotate: -2deg;\n box-shadow:\n 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n}\n\n/* Apply .drop for an element where you can drop the draggable */\n\n.drop {\n /* @apply bordered; */\n border: var(--qti-border-thickness) dashed var(--qti-border-color);\n background: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"><circle cx=\"10\" cy=\"10\" r=\"7\" stroke=\"%23CCCCCC\" stroke-width=\"1\" fill=\"transparent\" /></svg>')\n center no-repeat;\n border-radius: var(--qti-border-radius);\n position: relative;\n background-color: var(--qti-bg);\n}\n\n/* Apply .dropping for an indicator where you can drop the draggable */\n\n.dropping {\n background-color: var(--qti-bg-active);\n}\n\n/* Apply .order for a small circular button */\n\n.order {\n\n display: grid;\n place-content: center;\n\n /* background-color: var(--qti-bg-active); */\n border-radius: 100%;\n width: var(--qti-order-size);\n height: var(--qti-order-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .check-size for radio and checkbox size */\n\n.check-size {\n width: calc(var(--qti-form-size) - 6px);\n height: calc(var(--qti-form-size) - 6px);\n}\n\n/* Apply .check for checkbox */\n\n.check {\n gap: 0.5rem;\n background-color: var(--qti-bg);\n border-radius: var(--qti-border-radius);\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n outline: none;\n cursor: pointer;\n}\n\n/* Apply .check-radio for outer circle of the radio buttons */\n\n.check-radio {\n\n border-radius: 100%;\n\n display: grid;\n\n place-content: center;\n\n width: var(--qti-form-size);\n\n height: var(--qti-form-size);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n}\n\n/* Apply .check-radio-checked for the inner checked radio */\n\n.check-radio-checked {\n background-color: var(--qti-border-active);\n border-radius: 100%;\n}\n\n/* Apply .check-checkbox for outer square of the checkbox */\n\n.check-checkbox {\n\n display: flex;\n place-items: center;\n border-radius: var(--qti-border-radius);\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n}\n\n/* Apply .check-checkbox-checked for the inner checkmark */\n\n.check-checkbox-checked {\n background-color: var(--qti-border-active);\n -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n}\n\n/* Apply .hov for hover state */\n\n.hov {\n /* background-color: var(--qti-hover-bg); */\n}\n\n/* Apply .foc for focus state */\n\n.foc {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n}\n\n/* Apply .act for active state */\n\n.act {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n}\n\n.act-bg {\n background-color: var(--qti-bg-active);\n}\n\n.act-bor {\n border-color: var(--qti-border-active);\n}\n\n/* Apply .rdo for readonly state */\n\n.rdo {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n}\n\n/* Apply .dis for disabled state */\n\n.dis {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n}\n\n/* base */\n\n/* ============================\n QTI 3 shared css\n 1. Display\n 2. Special Flex styles\n 3. Margin\n 4. Padding\n 5. Horizontal Alignment styles\n 6. Vertical Alignment styles\n 7. Height\n 8. Width\n 9. Text-Indent\n 10. List Style\n 11. Layout\n 12. Other QTI 3 presentation utilities\n ============================ */\n\n/* ==========\n Display css\n =========== */\n\n.qti-display-inline {\n display: inline;\n}\n\n.qti-display-inline-block {\n display: inline-block;\n}\n\n.qti-display-block {\n display: block;\n}\n\n.qti-display-flex {\n display: flex;\n}\n\n.qti-display-inline-flex {\n display: inline-flex;\n}\n\n.qti-display-grid {\n display: grid;\n}\n\n.qti-display-inline-grid {\n display: inline-grid;\n}\n\n.qti-display-table {\n display: table;\n}\n\n.qti-display-table-cell {\n display: table-cell;\n}\n\n.qti-display-table-row {\n display: table-row;\n}\n\n.qti-display-list-item {\n display: list-item;\n}\n\n.qti-display-inherit {\n display: inherit;\n}\n\n/* \n * hidden to screen readers and sighted\n */\n\n.qti-hidden {\n display: none;\n}\n\n/*\n * visible to screen readers, hidden to sighted\n */\n\n.qti-visually-hidden {\n position: fixed !important;\n overflow: hidden;\n clip: rect(1px 1px 1px 1px);\n height: 1px;\n width: 1px;\n border: 0;\n margin: -1px;\n}\n\n/* =============================\n Special flex styles\n ============================= */\n\n.qti-flex-direction-column {\n flex-direction: column;\n}\n\n.qti-flex-direction-row {\n flex-direction: row;\n}\n\n.qti-flex-grow-1 {\n flex-grow: 1;\n}\n\n.qti-flex-grow-0 {\n flex-grow: 0;\n}\n\n/* =========\n Margin css\n ========== */\n\n/**\n * For margin Top and Bottom and Left and Right\n */\n\n.qti-margin-0 {\n margin: 0 !important;\n}\n\n.qti-margin-1 {\n margin: 0.25rem !important;\n}\n\n.qti-margin-2 {\n margin: 0.5rem !important;\n}\n\n.qti-margin-3 {\n margin: 1rem !important;\n}\n\n.qti-margin-4 {\n margin: 1.5rem !important;\n}\n\n.qti-margin-5 {\n margin: 3rem !important;\n}\n\n.qti-margin-auto {\n margin: auto !important;\n}\n\n/*\n For margin Left and Right\n */\n\n.qti-margin-x-0 {\n margin-right: 0 !important;\n margin-left: 0 !important;\n}\n\n.qti-margin-x-1 {\n margin-right: 0.25rem !important;\n margin-left: 0.25rem !important;\n}\n\n.qti-margin-x-2 {\n margin-right: 0.5rem !important;\n margin-left: 0.5rem !important;\n}\n\n.qti-margin-x-3 {\n margin-right: 1rem !important;\n margin-left: 1rem !important;\n}\n\n.qti-margin-x-4 {\n margin-right: 1.5rem !important;\n margin-left: 1.5rem !important;\n}\n\n.qti-margin-x-5 {\n margin-right: 3rem !important;\n margin-left: 3rem !important;\n}\n\n.qti-margin-x-auto {\n margin-right: auto !important;\n margin-left: auto !important;\n}\n\n/*\n For margin Top and Bottom\n */\n\n.qti-margin-y-0 {\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n}\n\n.qti-margin-y-1 {\n margin-top: 0.25rem !important;\n margin-bottom: 0.25rem !important;\n}\n\n.qti-margin-y-2 {\n margin-top: 0.5rem !important;\n margin-bottom: 0.5rem !important;\n}\n\n.qti-margin-y-3 {\n margin-top: 1rem !important;\n margin-bottom: 1rem !important;\n}\n\n.qti-margin-y-4 {\n margin-top: 1.5rem !important;\n margin-bottom: 1.5rem !important;\n}\n\n.qti-margin-y-5 {\n margin-top: 3rem !important;\n margin-bottom: 3rem !important;\n}\n\n.qti-margin-y-auto {\n margin-top: auto !important;\n margin-bottom: auto !important;\n}\n\n/*\n For margin Top\n */\n\n.qti-margin-t-0 {\n margin-top: 0 !important;\n}\n\n.qti-margin-t-1 {\n margin-top: 0.25rem !important;\n}\n\n.qti-margin-t-2 {\n margin-top: 0.5rem !important;\n}\n\n.qti-margin-t-3 {\n margin-top: 1rem !important;\n}\n\n.qti-margin-t-4 {\n margin-top: 1.5rem !important;\n}\n\n.qti-margin-t-5 {\n margin-top: 3rem !important;\n}\n\n.qti-margin-t-auto {\n margin-top: auto !important;\n}\n\n/* \n For margin Bottom\n */\n\n.qti-margin-b-0 {\n margin-bottom: 0 !important;\n}\n\n.qti-margin-b-1 {\n margin-bottom: 0.25rem !important;\n}\n\n.qti-margin-b-2 {\n margin-bottom: 0.5rem !important;\n}\n\n.qti-margin-b-3 {\n margin-bottom: 1rem !important;\n}\n\n.qti-margin-b-4 {\n margin-bottom: 1.5rem !important;\n}\n\n.qti-margin-b-5 {\n margin-bottom: 3rem !important;\n}\n\n.qti-margin-b-auto {\n margin-bottom: auto !important;\n}\n\n/*\n For margin Start LTR\n */\n\n.qti-margin-s-0 {\n margin-left: 0 !important;\n}\n\n.qti-margin-s-1 {\n margin-left: 0.25rem !important;\n}\n\n.qti-margin-s-2 {\n margin-left: 0.5rem !important;\n}\n\n.qti-margin-s-3 {\n margin-left: 1rem !important;\n}\n\n.qti-margin-s-4 {\n margin-left: 1.5rem !important;\n}\n\n.qti-margin-s-5 {\n margin-left: 3rem !important;\n}\n\n.qti-margin-s-auto {\n margin-left: auto !important;\n}\n\n/* \n For margin End LTR\n */\n\n.qti-margin-e-0 {\n margin-right: 0 !important;\n}\n\n.qti-margin-e-1 {\n margin-right: 0.25rem !important;\n}\n\n.qti-margin-e-2 {\n margin-right: 0.5rem !important;\n}\n\n.qti-margin-e-3 {\n margin-right: 1rem !important;\n}\n\n.qti-margin-e-4 {\n margin-right: 1.5rem !important;\n}\n\n.qti-margin-e-5 {\n margin-right: 3rem !important;\n}\n\n.qti-margin-e-auto {\n margin-right: auto !important;\n}\n\n/* =========\n Padding css\n ========== */\n\n/*\n For padding Top and Bottom and Left and Right\n */\n\n.qti-padding-0 {\n padding: 0 !important;\n}\n\n.qti-padding-1 {\n padding: 0.25rem !important;\n}\n\n.qti-padding-2 {\n padding: 0.5rem !important;\n}\n\n.qti-padding-3 {\n padding: 1rem !important;\n}\n\n.qti-padding-4 {\n padding: 1.5rem !important;\n}\n\n.qti-padding-5 {\n padding: 3rem !important;\n}\n\n/*\n For padding Left and Right\n */\n\n.qti-padding-x-0 {\n padding-right: 0 !important;\n padding-left: 0 !important;\n}\n\n.qti-padding-x-1 {\n padding-right: 0.25rem !important;\n padding-left: 0.25rem !important;\n}\n\n.qti-padding-x-2 {\n padding-right: 0.5rem !important;\n padding-left: 0.5rem !important;\n}\n\n.qti-padding-x-3 {\n padding-right: 1rem !important;\n padding-left: 1rem !important;\n}\n\n.qti-padding-x-4 {\n padding-right: 1.5rem !important;\n padding-left: 1.5rem !important;\n}\n\n.qti-padding-x-5 {\n padding-right: 3rem !important;\n padding-left: 3rem !important;\n}\n\n/*\n For padding Top and Bottom\n */\n\n.qti-padding-y-0 {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n}\n\n.qti-padding-y-1 {\n padding-top: 0.25rem !important;\n padding-bottom: 0.25rem !important;\n}\n\n.qti-padding-y-2 {\n padding-top: 0.5rem !important;\n padding-bottom: 0.5rem !important;\n}\n\n.qti-padding-y-3 {\n padding-top: 1rem !important;\n padding-bottom: 1rem !important;\n}\n\n.qti-padding-y-4 {\n padding-top: 1.5rem !important;\n padding-bottom: 1.5rem !important;\n}\n\n.qti-padding-y-5 {\n padding-top: 3rem !important;\n padding-bottom: 3rem !important;\n}\n\n/*\n For padding Top\n */\n\n.qti-padding-t-0 {\n padding-top: 0 !important;\n}\n\n.qti-padding-t-1 {\n padding-top: 0.25rem !important;\n}\n\n.qti-padding-t-2 {\n padding-top: 0.5rem !important;\n}\n\n.qti-padding-t-3 {\n padding-top: 1rem !important;\n}\n\n.qti-padding-t-4 {\n padding-top: 1.5rem !important;\n}\n\n.qti-padding-t-5 {\n padding-top: 3rem !important;\n}\n\n/*\n For padding Bottom\n */\n\n.qti-padding-b-0 {\n padding-bottom: 0 !important;\n}\n\n.qti-padding-b-1 {\n padding-bottom: 0.25rem !important;\n}\n\n.qti-padding-b-2 {\n padding-bottom: 0.5rem !important;\n}\n\n.qti-padding-b-3 {\n padding-bottom: 1rem !important;\n}\n\n.qti-padding-b-4 {\n padding-bottom: 1.5rem !important;\n}\n\n.qti-padding-b-5 {\n padding-bottom: 3rem !important;\n}\n\n/*\n For padding Start LTR\n */\n\n.qti-padding-s-0 {\n padding-left: 0 !important;\n}\n\n.qti-padding-s-1 {\n padding-left: 0.25rem !important;\n}\n\n.qti-padding-s-2 {\n padding-left: 0.5rem !important;\n}\n\n.qti-padding-s-3 {\n padding-left: 1rem !important;\n}\n\n.qti-padding-s-4 {\n padding-left: 1.5rem !important;\n}\n\n.qti-padding-s-5 {\n padding-left: 3rem !important;\n}\n\n/*\n For padding End LTR\n */\n\n.qti-padding-e-0 {\n padding-right: 0 !important;\n}\n\n.qti-padding-e-1 {\n padding-right: 0.25rem !important;\n}\n\n.qti-padding-e-2 {\n padding-right: 0.5rem !important;\n}\n\n.qti-padding-e-3 {\n padding-right: 1rem !important;\n}\n\n.qti-padding-e-4 {\n padding-right: 1.5rem !important;\n}\n\n.qti-padding-e-5 {\n padding-right: 3rem !important;\n}\n\n/* ====================\n Horizontal alignment\n ==================== */\n\n.qti-align-left {\n text-align: left;\n}\n\n.qti-align-center {\n text-align: center;\n}\n\n.qti-align-right {\n text-align: right;\n}\n\n/* ==================\n Vertical alignment\n ================== */\n\n.qti-valign-top {\n vertical-align: top;\n}\n\n.qti-valign-middle {\n vertical-align: middle;\n}\n\n.qti-valign-baseline {\n vertical-align: baseline;\n}\n\n.qti-valign-bottom {\n vertical-align: bottom;\n}\n\n/* =============\n Height styles\n ============= */\n\n.qti-height-0 {\n height: 0;\n}\n\n.qti-height-px {\n height: 1px;\n}\n\n.qti-height-0p5 {\n height: 0.125rem;\n}\n\n.qti-height-1 {\n height: 0.25rem;\n}\n\n.qti-height-1p5 {\n height: 0.375rem;\n}\n\n.qti-height-2 {\n height: 0.5rem;\n}\n\n.qti-height-2p5 {\n height: 0.625rem;\n}\n\n.qti-height-3 {\n height: 0.75rem;\n}\n\n.qti-height-3p5 {\n height: 0.875rem;\n}\n\n.qti-height-4 {\n height: 1rem;\n}\n\n.qti-height-5 {\n height: 1.25rem;\n}\n\n.qti-height-6 {\n height: 1.5rem;\n}\n\n.qti-height-7 {\n height: 1.75rem;\n}\n\n.qti-height-8 {\n height: 2rem;\n}\n\n.qti-height-9 {\n height: 2.25rem;\n}\n\n.qti-height-10 {\n height: 2.5rem;\n}\n\n.qti-height-11 {\n height: 2.75rem;\n}\n\n.qti-height-12 {\n height: 3rem;\n}\n\n.qti-height-14 {\n height: 3.5rem;\n}\n\n.qti-height-16 {\n height: 4rem;\n}\n\n.qti-height-20 {\n height: 5rem;\n}\n\n.qti-height-24 {\n height: 6rem;\n}\n\n.qti-height-28 {\n height: 7rem;\n}\n\n.qti-height-32 {\n height: 8rem;\n}\n\n.qti-height-36 {\n height: 9rem;\n}\n\n.qti-height-40 {\n height: 10rem;\n}\n\n.qti-height-44 {\n height: 11rem;\n}\n\n.qti-height-48 {\n height: 12rem;\n}\n\n.qti-height-52 {\n height: 13rem;\n}\n\n.qti-height-56 {\n height: 14rem;\n}\n\n.qti-height-60 {\n height: 15rem;\n}\n\n.qti-height-64 {\n height: 16rem;\n}\n\n.qti-height-72 {\n height: 18rem;\n}\n\n.qti-height-80 {\n height: 20rem;\n}\n\n.qti-height-96 {\n height: 24rem;\n}\n\n.qti-height-1-2 {\n height: 50%;\n}\n\n.qti-height-1-3 {\n height: 33.3333%;\n}\n\n.qti-height-2-3 {\n height: 66.6667%;\n}\n\n.qti-height-1-4 {\n height: 25%;\n}\n\n.qti-height-2-4 {\n height: 50%;\n}\n\n.qti-height-3-4 {\n height: 75%;\n}\n\n.qti-height-1-5 {\n height: 20%;\n}\n\n.qti-height-2-5 {\n height: 40%;\n}\n\n.qti-height-3-5 {\n height: 60%;\n}\n\n.qti-height-4-5 {\n height: 80%;\n}\n\n.qti-height-1-6 {\n height: 16.6667%;\n}\n\n.qti-height-2-6 {\n height: 33.3333%;\n}\n\n.qti-height-3-6 {\n height: 50%;\n}\n\n.qti-height-4-6 {\n height: 66.6667%;\n}\n\n.qti-height-5-6 {\n height: 83.3333%;\n}\n\n.qti-height-auto {\n height: auto;\n}\n\n.qti-height-full {\n height: 100%;\n}\n\n/* ============\n Width styles\n ============ */\n\n.qti-width-0 {\n width: 0;\n}\n\n.qti-width-px {\n width: 1px;\n}\n\n.qti-width-0p5 {\n width: 0.125rem;\n}\n\n.qti-width-1 {\n width: 0.25rem;\n}\n\n.qti-width-1p5 {\n width: 0.375rem;\n}\n\n.qti-width-2 {\n width: 0.5rem;\n}\n\n.qti-width-2p5 {\n width: 0.625rem;\n}\n\n.qti-width-3 {\n width: 0.75rem;\n}\n\n.qti-width-3p5 {\n width: 0.875rem;\n}\n\n.qti-width-4 {\n width: 1rem;\n}\n\n.qti-width-5 {\n width: 1.25rem;\n}\n\n.qti-width-6 {\n width: 1.5rem;\n}\n\n.qti-width-7 {\n width: 1.75rem;\n}\n\n.qti-width-8 {\n width: 2rem;\n}\n\n.qti-width-9 {\n width: 2.25rem;\n}\n\n.qti-width-10 {\n width: 2.5rem;\n}\n\n.qti-width-11 {\n width: 2.75rem;\n}\n\n.qti-width-12 {\n width: 3rem;\n}\n\n.qti-width-14 {\n width: 3.5rem;\n}\n\n.qti-width-16 {\n width: 4rem;\n}\n\n.qti-width-20 {\n width: 5rem;\n}\n\n.qti-width-24 {\n width: 6rem;\n}\n\n.qti-width-28 {\n width: 7rem;\n}\n\n.qti-width-32 {\n width: 8rem;\n}\n\n.qti-width-36 {\n width: 9rem;\n}\n\n.qti-width-40 {\n width: 10rem;\n}\n\n.qti-width-44 {\n width: 11rem;\n}\n\n.qti-width-48 {\n width: 12rem;\n}\n\n.qti-width-52 {\n width: 13rem;\n}\n\n.qti-width-56 {\n width: 14rem;\n}\n\n.qti-width-60 {\n width: 15rem;\n}\n\n.qti-width-64 {\n width: 16rem;\n}\n\n.qti-width-72 {\n width: 18rem;\n}\n\n.qti-width-80 {\n width: 20rem;\n}\n\n.qti-width-96 {\n width: 24rem;\n}\n\n.qti-width-auto {\n width: auto;\n}\n\n.qti-width-1-2 {\n width: 50%;\n}\n\n.qti-width-1-3 {\n width: 33.3333%;\n}\n\n.qti-width-2-3 {\n width: 66.6667%;\n}\n\n.qti-width-1-4 {\n width: 25%;\n}\n\n.qti-width-2-4 {\n width: 50%;\n}\n\n.qti-width-3-4 {\n width: 75%;\n}\n\n.qti-width-1-5 {\n width: 20%;\n}\n\n.qti-width-2-5 {\n width: 40%;\n}\n\n.qti-width-3-5 {\n width: 60%;\n}\n\n.qti-width-4-5 {\n width: 80%;\n}\n\n.qti-width-1-6 {\n width: 16.6667%;\n}\n\n.qti-width-2-6 {\n width: 33.3333%;\n}\n\n.qti-width-3-6 {\n width: 50%;\n}\n\n.qti-width-4-6 {\n width: 66.6667%;\n}\n\n.qti-width-5-6 {\n width: 83.3333%;\n}\n\n.qti-width-1-12 {\n width: 8.3333%;\n}\n\n.qti-width-2-12 {\n width: 16.6667%;\n}\n\n.qti-width-3-12 {\n width: 25%;\n}\n\n.qti-width-4-12 {\n width: 33.3333%;\n}\n\n.qti-width-5-12 {\n width: 41.6667%;\n}\n\n.qti-width-6-12 {\n width: 50%;\n}\n\n.qti-width-7-12 {\n width: 58.3333%;\n}\n\n.qti-width-8-12 {\n width: 66.6667%;\n}\n\n.qti-width-9-12 {\n width: 75%;\n}\n\n.qti-width-10-12 {\n width: 83.3333%;\n}\n\n.qti-width-11-12 {\n width: 91.6667%;\n}\n\n.qti-width-full,\n.qti-fullwidth {\n width: 100%;\n}\n\n/* ==================\n Text Indent styles\n ================== */\n\n.qti-text-indent-0 {\n text-indent: 0;\n}\n\n.qti-text-indent-px {\n text-indent: 1px;\n}\n\n.qti-text-indent-0p5 {\n text-indent: 0.125rem;\n}\n\n.qti-text-indent-1 {\n text-indent: 0.25rem;\n}\n\n.qti-text-indent-1p5 {\n text-indent: 0.375rem;\n}\n\n.qti-text-indent-2 {\n text-indent: 0.5rem;\n}\n\n.qti-text-indent-2p5 {\n text-indent: 0.625rem;\n}\n\n.qti-text-indent-3 {\n text-indent: 0.75rem;\n}\n\n.qti-text-indent-3p5 {\n text-indent: 0.875rem;\n}\n\n.qti-text-indent-4 {\n text-indent: 1rem;\n}\n\n.qti-text-indent-5 {\n text-indent: 1.25rem;\n}\n\n.qti-text-indent-6 {\n text-indent: 1.5rem;\n}\n\n.qti-text-indent-7 {\n text-indent: 1.75rem;\n}\n\n.qti-text-indent-8 {\n text-indent: 2rem;\n}\n\n.qti-text-indent-12 {\n text-indent: 3rem;\n}\n\n.qti-text-indent-16 {\n text-indent: 4rem;\n}\n\n.qti-text-indent-20 {\n text-indent: 5rem;\n}\n\n.qti-text-indent-24 {\n text-indent: 6rem;\n}\n\n.qti-text-indent-28 {\n text-indent: 7rem;\n}\n\n.qti-text-indent-32 {\n text-indent: 8rem;\n}\n\n/* =================\n List Style styles\n ================= */\n\n.qti-list-style-type-none {\n list-style-type: none;\n}\n\n.qti-list-style-type-disc {\n list-style-type: disc;\n}\n\n.qti-list-style-type-circle {\n list-style-type: circle;\n}\n\n.qti-list-style-type-square {\n list-style-type: square;\n}\n\n.qti-list-style-type-decimal {\n list-style-type: decimal;\n}\n\n.qti-list-style-type-decimal-leading-zero {\n list-style-type: decimal-leading-zero;\n}\n\n.qti-list-style-type-lower-alpha {\n list-style-type: lower-alpha;\n}\n\n.qti-list-style-type-upper-alpha {\n list-style-type: upper-alpha;\n}\n\n.qti-list-style-type-lower-roman {\n list-style-type: lower-roman;\n}\n\n.qti-list-style-type-upper-roman {\n list-style-type: upper-roman;\n}\n\n.qti-list-style-type-lower-latin {\n list-style-type: lower-latin;\n}\n\n.qti-list-style-type-upper-latin {\n list-style-type: upper-latin;\n}\n\n.qti-list-style-type-lower-greek {\n list-style-type: lower-greek;\n}\n\n.qti-list-style-type-arabic-indic {\n list-style-type: arabic-indic;\n}\n\n.qti-list-style-type-armenian {\n list-style-type: armenian;\n}\n\n.qti-list-style-type-lower-armenian {\n list-style-type: lower-armenian;\n}\n\n.qti-list-style-type-upper-armenian {\n list-style-type: upper-armenian;\n}\n\n.qti-list-style-type-bengali {\n list-style-type: bengali;\n}\n\n.qti-list-style-type-cambodian {\n list-style-type: cambodian;\n}\n\n.qti-list-style-type-simp-chinese-formal {\n list-style-type: simp-chinese-formal;\n}\n\n.qti-list-style-type-simp-chinese-informal {\n list-style-type: simp-chinese-informal;\n}\n\n.qti-list-style-type-trad-chinese-formal {\n list-style-type: trad-chinese-formal;\n}\n\n.qti-list-style-type-trad-chinese-informal {\n list-style-type: trad-chinese-informal;\n}\n\n.qti-list-style-type-cjk-ideographic {\n list-style-type: cjk-ideographic;\n}\n\n.qti-list-style-type-cjk-heavenly-stem {\n list-style-type: cjk-heavenly-stem;\n}\n\n.qti-list-style-type-cjk-earthly-branch {\n list-style-type: cjk-earthly-branch;\n}\n\n.qti-list-style-type-devanagari {\n list-style-type: devanagari;\n}\n\n.qti-list-style-type-ethiopic-halehame-ti-er {\n list-style-type: ethiopic-halehame-ti-er;\n}\n\n.qti-list-style-type-ethiopic-halehame-ti-et {\n list-style-type: ethiopic-halehame-ti-et;\n}\n\n.qti-list-style-type-ethiopic-halehame-am {\n list-style-type: ethiopic-halehame-am;\n}\n\n.qti-list-style-type-ethiopic-halehame {\n list-style-type: ethiopic-halehame;\n}\n\n.qti-list-style-type-georgian {\n list-style-type: georgian;\n}\n\n.qti-list-style-type-gujarati {\n list-style-type: gujarati;\n}\n\n.qti-list-style-type-gurmukhi {\n list-style-type: gurmukhi;\n}\n\n.qti-list-style-type-hangul {\n list-style-type: hangul;\n}\n\n.qti-list-style-type-hangul-consonant {\n list-style-type: hangul-consonant;\n}\n\n.qti-list-style-type-hebrew {\n list-style-type: hebrew;\n}\n\n.qti-list-style-type-hiragana {\n list-style-type: hiragana;\n}\n\n.qti-list-style-type-hiragana-iroha {\n list-style-type: hiragana-iroha;\n}\n\n.qti-list-style-type-khmer {\n list-style-type: khmer;\n}\n\n.qti-list-style-type-korean-hangul-formal {\n list-style-type: korean-hangul-formal;\n}\n\n.qti-list-style-type-korean-hanja-formal {\n list-style-type: korean-hanja-formal;\n}\n\n.qti-list-style-type-korean-hanja-informal {\n list-style-type: korean-hanja-informal;\n}\n\n.qti-list-style-type-lao {\n list-style-type: lao;\n}\n\n.qti-list-style-type-malayalam {\n list-style-type: malayalam;\n}\n\n.qti-list-style-type-mongolian {\n list-style-type: mongolian;\n}\n\n.qti-list-style-type-myanmar {\n list-style-type: myanmar;\n}\n\n.qti-list-style-type-oriya {\n list-style-type: oriya;\n}\n\n.qti-list-style-type-persian {\n list-style-type: persian;\n}\n\n.qti-list-style-type-thai {\n list-style-type: thai;\n}\n\n.qti-list-style-type-tibetan {\n list-style-type: tibetan;\n}\n\n.qti-list-style-type-telugu {\n list-style-type: telugu;\n}\n\n.qti-list-style-type-urdu {\n list-style-type: urdu;\n}\n\n/* =========================\n Other QTI 3 Presentation Utilities\n ========================= */\n\n.qti-bordered {\n border: 1px solid var(--table-border-color);\n}\n\n.qti-underline {\n text-decoration: underline;\n text-decoration-color: var(--foreground);\n}\n\n.qti-italic {\n font-style: italic;\n}\n\n.qti-well {\n min-height: 20px;\n padding: 19px;\n margin-bottom: 20px;\n background-color: var(--well-bg);\n border: var(--well-border);\n border-radius: 4px;\n box-shadow: var(--well-box-shadow);\n}\n\n/* Set writing-mode to vertical-rl \n Typical for CJK vertical text */\n\n.qti-writing-mode-vertical-rl {\n writing-mode: vertical-rl;\n}\n\n/* Set writing-mode to vertical-lr\n Typical for Mongolian vertical text */\n\n.qti-writing-mode-vertical-lr {\n writing-mode: vertical-lr;\n}\n\n/* Set writing-mode to horizontal-tb \n Browser default */\n\n.qti-writing-mode-horizontal-tb {\n writing-mode: horizontal-tb;\n}\n\n/* Float an element left */\n\n.qti-float-left {\n float: left;\n}\n\n/* Float an element right */\n\n.qti-float-right {\n float: right;\n}\n\n/* Remove a float */\n\n.qti-float-none {\n float: none;\n}\n\n/* Clearfix Hack to apply to a container of \n floated content that overflows the container. */\n\n.qti-float-clearfix::after {\n content: '';\n clear: both;\n display: table;\n}\n\n.qti-float-clear-left\n .qti-float-clear-right\n .qti-float-clear-both\n \n /* Set text-orientation to upright */\n .qti-text-orientation-upright {\n text-orientation: upright;\n}\n\n/* stylelint-disable number-max-precision */\n\n@layer qti-base {\n .qti-layout-row {\n display: flex;\n flex-wrap: wrap;\n width: 100%;\n gap: 2.1276595745%;\n }\n\n .qti-layout-row [class*='qti-layout-col']:not(:empty) {\n box-sizing: border-box;\n }\n\n .qti-layout-row [class*='qti-layout-col']:empty {\n width: 0;\n overflow: hidden; /* to fully collapse if there’s padding or borders */\n }\n\n .qti-layout-col1 {\n width: 6.3829787234%;\n }\n\n .qti-layout-col2 {\n width: 14.8936170213%;\n }\n\n .qti-layout-col3 {\n width: 23.4042553191%;\n }\n\n .qti-layout-col4 {\n width: 31.914893617%;\n }\n\n .qti-layout-col5 {\n width: 40.4255319149%;\n }\n\n .qti-layout-col6 {\n width: 48.9361702128%;\n }\n\n .qti-layout-col7 {\n width: 57.4468085106%;\n }\n\n .qti-layout-col8 {\n width: 65.9574468085%;\n }\n\n .qti-layout-col9 {\n width: 74.4680851064%;\n }\n\n .qti-layout-col10 {\n width: 82.9787234043%;\n }\n\n .qti-layout-col11 {\n width: 91.4893617021%;\n }\n\n .qti-layout-col12 {\n width: 100%;\n }\n\n .qti-layout-offset1 {\n margin-left: 8.5106382979%;\n }\n\n .qti-layout-offset2 {\n margin-left: 17.0212765957%;\n }\n\n .qti-layout-offset3 {\n margin-left: 25.5319148936%;\n }\n\n .qti-layout-offset4 {\n margin-left: 34.0425531915%;\n }\n\n .qti-layout-offset5 {\n margin-left: 42.5531914894%;\n }\n\n .qti-layout-offset6 {\n margin-left: 51.0638297872%;\n }\n\n .qti-layout-offset7 {\n margin-left: 59.5744680851%;\n }\n\n .qti-layout-offset8 {\n margin-left: 68.085106383%;\n }\n\n .qti-layout-offset9 {\n margin-left: 76.5957446809%;\n }\n\n .qti-layout-offset10 {\n margin-left: 85.1063829787%;\n }\n\n .qti-layout-offset11 {\n margin-left: 93.6170212766%;\n }\n\n .qti-layout-offset12 {\n margin-left: 102.1276595745%;\n }\n\n @media (width <= 767px) {\n [class*='qti-layout-col'] {\n width: 100%;\n }\n }\n}\n\n[view],\nqti-outcome-declaration,\nqti-response-declaration {\n display: none;\n}\n\n[view].show {\n display: block;\n}\n\n:host {\n box-sizing: border-box;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: inherit;\n}\n\n/* components */\n\n@layer qti-components {\n qti-choice-interaction {\n &.qti-input-control-hidden {\n & qti-simple-choice {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &::part(ch) {\n display: none;\n }\n\n &:state(--checked),\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(readonly),\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &:state(disabled),\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n border-radius: var(--qti-border-radius);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n }\n\n &:not(.qti-input-control-hidden) {\n & qti-simple-choice {\n\n &:not([aria-disabled='true'], [aria-readonly='true'], :state(--checked)):hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &:state(--checked),\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(readonly),\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &:state(disabled),\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n &::part(cha) {\n width: calc(var(--qti-form-size) - 6px);\n height: calc(var(--qti-form-size) - 6px);\n }\n\n &:state(radio)::part(ch) {\n border-radius: 100%;\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:state(radio):state(--checked)::part(cha) {\n background-color: var(--qti-border-active);\n border-radius: 100%;\n }\n\n &:state(checkbox)::part(ch) {\n display: flex;\n place-items: center;\n border-radius: var(--qti-border-radius);\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:state(checkbox):state(--checked)::part(cha) {\n background-color: var(--qti-border-active);\n -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n }\n\n gap: 0.5rem;\n\n background-color: var(--qti-bg);\n\n border-radius: var(--qti-border-radius);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n outline: none;\n\n cursor: pointer\n }\n }\n\n & qti-simple-choice {\n width: -moz-fit-content;\n width: fit-content;\n cursor: pointer;\n\n &:state(correct-response),\n &[data-correct-response='true'] {\n &::after {\n content: '\\02714';\n color: var(--qti-correct);\n }\n }\n }\n\n & qti-simple-choice > p {\n margin: 0 !important;\n padding: 0 !important;\n }\n }\n\n .hover-border {\n border: 2px solid #000; /* Adjust the border style and color as needed */\n }\n\n qti-graphic-gap-match-interaction {\n position: relative;\n\n &.qti-selections-light {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-light-bg-active);\n }\n }\n\n &.qti-selections-dark {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n }\n }\n\n /* General styles for active and enabled states */\n &:state(--dragzone-active)::part(drags) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-bg-active);\n }\n\n & qti-gap-img,\n qti-gap-text {\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: grab;\n }\n\n & qti-associable-hotspot {\n display: flex;\n justify-content: center;\n align-items: center;\n border: 2px solid transparent;\n\n &[enabled] {\n\n /* Light theme override */\n .qti-selections-light {\n background-color: var(--qti-light-bg-active);\n }\n\n /* Dark theme override */\n .qti-selections-dark {\n background-color: var(--qti-dark-bg-active);\n }\n background-color: var(--qti-bg-active)\n }\n\n &[active] {\n\n /* Light theme override */\n .qti-selections-light {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n /* Dark theme override */\n .qti-selections-dark {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active)\n }\n\n &[disabled] {\n\n &:not(:empty) {\n cursor: default !important;\n }\n\n cursor: not-allowed;\n\n background-color: var(--qti-disabled-bg);\n\n color: var(--qti-disabled-color);\n\n border-color: var(--qti-border-color);\n\n outline: 4px solid var(--qti-disabled-bg)\n }\n\n &:empty::after {\n padding: var(--qti-padding-md) var(--qti-padding-lg); /* Padding shorthand */\n content: '\\0000a0'; /* when empty, put a space in it */\n }\n\n &:not(:empty) {\n padding: 0;\n width: auto;\n }\n\n &:not(:empty) > * {\n flex: 1;\n transform: rotate(0); /* rotate-0 */\n box-shadow: 0 0 0 1px #e5e7eb; /* ring-gray-200 */\n }\n }\n\n & img {\n margin: 0;\n padding: 0;\n }\n }\n\n qti-text-entry-interaction {\n &::part(input) {\n border-radius: 0;\n cursor: text;\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n background: var(--qti-bg);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:hover {\n }\n\n &:focus-within {\n &::part(input) {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n border-color: var(--qti-border-active);\n }\n }\n }\n\n qti-extended-text-interaction {\n &::part(textarea) {\n border-radius: 0;\n cursor: text;\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n background: var(--qti-bg);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:hover {\n }\n\n &:focus-within {\n &::part(textarea) {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n border-color: var(--qti-border-active);\n }\n }\n }\n\n qti-gap-match-interaction {\n &.qti-selections-light {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-light-bg-active);\n }\n }\n\n &.qti-selections-dark {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n }\n }\n\n /* General styles for active and enabled states */\n &:state(--dragzone-active)::part(drags) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-bg-active);\n }\n\n & qti-gap-text {\n\n &[dragging] {\n pointer-events: none;\n rotate: -2deg;\n box-shadow: 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n }\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n transition: transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n\n cursor: grab;\n\n background-color: var(--qti-bg);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border-radius: var(--qti-border-radius);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n & qti-gap {\n\n &[disabled] {\n\n &:not(:empty) {\n cursor: default !important;\n }\n\n cursor: not-allowed;\n\n background-color: var(--qti-disabled-bg);\n\n color: var(--qti-disabled-color);\n\n border-color: var(--qti-border-color);\n\n outline: 4px solid var(--qti-disabled-bg)\n }\n\n &[enabled] {\n\n /* Light theme override */\n .qti-selections-light {\n border-color: var(--qti-light-border-active);\n }\n\n /* Dark theme override */\n .qti-selections-dark {\n border-color: var(--qti-dark-border-active);\n }\n background-color: var(--qti-bg-active)\n }\n\n &[active] {\n\n /* Light theme override */\n .qti-selections-light {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n /* Dark theme override */\n .qti-selections-dark {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active)\n }\n\n display: inline-flex;\n align-items: center;\n\n &:empty::after {\n padding: var(--qti-padding-md) var(--qti-padding-lg); /* Padding shorthand */\n content: '\\0000a0'; /* when empty, put a space in it */\n }\n\n &:not(:empty) {\n display: inline-flex;\n padding: 0;\n width: auto;\n }\n\n &:not(:empty) > * {\n flex: 1;\n transform: rotate(0); /* rotate-0 */\n box-shadow: 0 0 0 1px #e5e7eb; /* ring-gray-200 */\n }\n\n border: var(--qti-border-thickness) dashed var(--qti-border-color);\n\n background: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"><circle cx=\"10\" cy=\"10\" r=\"7\" stroke=\"%23CCCCCC\" stroke-width=\"1\" fill=\"transparent\" /></svg>')\n center no-repeat;\n\n border-radius: var(--qti-border-radius);\n\n position: relative;\n\n background-color: var(--qti-bg)\n }\n }\n\n qti-hotspot-interaction {\n & qti-hotspot-choice {\n &[shape='circle'] {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &:state(--checked),\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n }\n\n &:state(--readonly),\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &:state(--disabled),\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n &[shape='rect'] {\n\n /* &:hover {\n @apply hov;\n } */\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &:state(--checked),\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n &[shape='poly'] {\n &:hover::after {\n content: '';\n width: 100%;\n height: 100%;\n background: repeating-linear-gradient(\n 45deg,\n var(--qti-border-active),\n var(--qti-border-active) 5px,\n transparent 5px,\n transparent 10px\n );\n display: block;\n }\n\n &:state(--checked)::after,\n &[aria-checked='true']::after {\n content: '';\n width: 100%;\n height: 100%;\n background: repeating-linear-gradient(\n 45deg,\n transparent,\n transparent 5px,\n var(--qti-border-active) 5px,\n var(--qti-border-active) 10px\n );\n display: block;\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n }\n }\n }\n\n qti-hottext-interaction {\n /* &:not(.qti-input-control-hidden),\n &:not(.qti-unselected-hidden) { */\n qti-hottext {\n display: inline-flex;\n align-items: center;\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &::part(cha) {\n width: calc(var(--qti-form-size) - 6px);\n height: calc(var(--qti-form-size) - 6px);\n }\n\n &:state(radio)::part(ch) {\n border-radius: 100%;\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:state(radio):state(--checked)::part(cha) {\n background-color: var(--qti-border-active);\n border-radius: 100%;\n }\n\n &:state(checkbox)::part(ch) {\n display: flex;\n place-items: center;\n border-radius: var(--qti-border-radius);\n display: grid;\n place-content: center;\n width: var(--qti-form-size);\n height: var(--qti-form-size);\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:state(checkbox):state(--checked)::part(cha) {\n background-color: var(--qti-border-active);\n -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='100%' height='100%' viewBox='0 0 24 24'%3E%3Cpath d='M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z'/%3E%3C/svg%3E\");\n }\n\n &:state(correct-response),\n &[data-correct-response='true'] {\n &::after {\n content: '\\02714';\n color: #16a34a; /* text-green-600 */\n }\n }\n\n gap: 0.5rem;\n\n background-color: var(--qti-bg);\n\n border-radius: var(--qti-border-radius);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n outline: none;\n\n cursor: pointer\n }\n\n &.qti-input-control-hidden {\n qti-hottext {\n /* --qti-padding-md: 0.1rem;\n --qti-padding-lg: 0.2rem;\n --qti-border-radius-md: 0.3rem;\n --qti-border-thickness: 1px;\n --qti-font-weight-semibold: 400; */\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n /* @layer qti-variants { */\n &::part(ch) {\n display: none;\n }\n\n &:state(--checked) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n border-radius: var(--qti-border-radius);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n /* } */\n }\n\n &.qti-unselected-hidden {\n qti-hottext {\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n cursor: pointer;\n\n &::part(ch) {\n display: none;\n }\n\n &:state(--checked) {\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n }\n }\n }\n\n qti-inline-choice-interaction {\n &::part(select) {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n border-radius: var(--qti-border-radius);\n\n position: relative;\n\n -webkit-appearance: none;\n\n -moz-appearance: none;\n\n appearance: none;\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n padding-right: calc(var(--qti-padding-horizontal) + 1.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\n background: url(\"data:image/svg+xml,%3Csvg fill='currentColor' width='22' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' aria-hidden='true'%3E%3Cpath clip-rule='evenodd' fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z'%3E%3C/path%3E%3C/svg%3E\")\n no-repeat center right 6px\n }\n }\n\n qti-match-interaction:not(.qti-match-tabular) {\n &:state(--dragzone-enabled) qti-simple-match-set:first-of-type {\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-active) qti-simple-match-set:first-of-type {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n /* The draggables */\n & qti-simple-match-set:first-of-type {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start; /* Prevents children from stretching */\n gap: var(--qti-gap-size);\n border: 2px solid transparent;\n\n & qti-simple-associable-choice {\n\n &[dragging] {\n pointer-events: none;\n rotate: -2deg;\n box-shadow: 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n }\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n transition: transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n\n cursor: grab;\n\n background-color: var(--qti-bg);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border-radius: var(--qti-border-radius);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n }\n\n /* The droppables */\n & qti-simple-match-set:last-of-type {\n display: grid;\n grid-auto-columns: 1fr; /* auto-cols-fr */\n grid-auto-flow: column; /* grid-flow-col */\n gap: var(--qti-gap-size); /* gap-2 */\n width: 100%; /* w-full */\n\n & qti-simple-associable-choice {\n display: flex;\n flex-direction: column;\n }\n\n & > qti-simple-associable-choice {\n /* a droppable qti-simple-associable-choice */\n box-sizing: border-box;\n display: grid;\n grid-row: 2 / 4;\n grid-template-rows: subgrid;\n\n & img {\n max-width: 100%;\n height: auto;\n }\n\n &[enabled] {\n &::part(dropslot) {\n background-color: var(--qti-bg-active);\n }\n }\n\n &[disabled] {\n &::part(dropslot) {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n }\n\n &[active] {\n &::part(dropslot) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n }\n\n &::part(dropslot) {\n\n &[dragging] {\n pointer-events: none;\n rotate: -2deg;\n box-shadow: 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n /* min-height: 6rem; */\n min-height: calc(1lh + 2 * var(--qti-padding-vertical));\n gap: var(--qti-gap-size);\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border: var(--qti-border-thickness) dashed var(--qti-border-color);\n background: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"><circle cx=\"10\" cy=\"10\" r=\"7\" stroke=\"%23CCCCCC\" stroke-width=\"1\" fill=\"transparent\" /></svg>')\n center no-repeat;\n border-radius: var(--qti-border-radius);\n position: relative;\n background-color: var(--qti-bg);\n }\n\n & > *:not(qti-simple-associable-choice) {\n pointer-events: none;\n }\n\n & > qti-simple-associable-choice {\n\n &::part(dropslot) {\n display: none;\n }\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n flex-basis: fit-content;\n\n transition: transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n\n cursor: grab;\n\n background-color: var(--qti-bg);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border-radius: var(--qti-border-radius);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n }\n }\n }\n }\n\n qti-order-interaction:state(--dragzone-active)::part(drags) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n qti-order-interaction:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-bg-active);\n }\n\n qti-order-interaction {\n &::part(qti-simple-choice),\n & qti-simple-choice {\n\n &[dragging] {\n pointer-events: none;\n rotate: -2deg;\n box-shadow: 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n }\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n transition: transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n\n cursor: grab;\n\n background-color: var(--qti-bg);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border-radius: var(--qti-border-radius);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n &::part(qti-simple-choice) {\n display: flex;\n overflow: hidden;\n align-items: center;\n width: 100%;\n text-overflow: ellipsis;\n }\n\n &::part(drops) {\n gap: 0.5rem; /* gap-2 */\n }\n\n &::part(drags) {\n gap: 0.5rem; /* gap-2 */\n }\n\n &::part(drop-list) {\n\n &[enabled] {\n\n /* Light theme override */\n .qti-selections-light {\n border-color: var(--qti-light-border-active);\n }\n\n /* Dark theme override */\n .qti-selections-dark {\n border-color: var(--qti-dark-border-active);\n }\n background-color: var(--qti-bg-active)\n }\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n display: flex;\n min-height: 4rem;\n border: var(--qti-border-thickness) dashed var(--qti-border-color);\n background: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"><circle cx=\"10\" cy=\"10\" r=\"7\" stroke=\"%23CCCCCC\" stroke-width=\"1\" fill=\"transparent\" /></svg>')\n center no-repeat;\n border-radius: var(--qti-border-radius);\n position: relative;\n background-color: var(--qti-bg);\n }\n\n &::part(active) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n & drop-list {\n &[shape='circle'] {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n &[shape='square'] {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n }\n }\n\n qti-associate-interaction {\n /* General styles for active and enabled states */\n &:state(--dragzone-active) slot[name='qti-simple-associable-choice'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-enabled) slot[name='qti-simple-associable-choice'] {\n background-color: var(--qti-bg-active);\n }\n\n & qti-simple-associable-choice, /* drags when in lightdom */\n &::part(qti-simple-associable-choice) /* drags when in shadowdom */ {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &[dragging] {\n pointer-events: none;\n rotate: -2deg;\n box-shadow: 0 8px 12px rgb(0 0 0 / 20%),\n 0 4px 8px rgb(0 0 0 / 10%);\n }\n\n transition: transform 200ms ease-out,\n box-shadow 200ms ease-out,\n rotate 200ms ease-out;\n\n cursor: grab;\n\n background-color: var(--qti-bg);\n\n padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);\n\n border-radius: var(--qti-border-radius);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n /* display: flex;\n overflow: hidden;\n align-items: center; */\n\n /* &::part(drop-container) {\n display: flex;\n flex-direction: column;\n gap: var(--qti-gap-size);\n } */\n\n &::part(drop-list) {\n\n display: grid;\n height: 3rem;\n min-width: 10rem;\n border: var(--qti-border-thickness) dashed var(--qti-border-color);\n background: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"><circle cx=\"10\" cy=\"10\" r=\"7\" stroke=\"%23CCCCCC\" stroke-width=\"1\" fill=\"transparent\" /></svg>')\n center no-repeat;\n border-radius: var(--qti-border-radius);\n position: relative;\n background-color: var(--qti-bg);\n }\n\n &::part(drop-list):focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &::part(drop-list)[dragging] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n /* &::part(drop-list) {\n @apply act;\n } */\n }\n\n qti-graphic-order-interaction {\n & qti-hotspot-choice {\n width: 100%;\n height: 100%;\n background-color: rgb(128 128 128 / 30%);\n padding: 0;\n\n &:hover {\n background-color: rgb(128 128 128 / 70%);\n }\n\n &:focus {\n background-color: rgb(128 128 128 / 70%);\n }\n\n &:state(--checked),\n &[aria-checked='true'] {\n background-color: rgb(128 128 128 / 70%);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n &[aria-ordervalue] {\n display: grid;\n place-content: center;\n }\n\n &[aria-ordervalue]::after {\n content: attr(aria-ordervalue) !important;\n }\n\n &[aria-ordercorrectvalue] {\n display: grid;\n place-content: center;\n }\n\n /* When both attributes are present */\n &[aria-ordercorrectvalue][aria-ordervalue]::after {\n content: 'C=' attr(aria-ordercorrectvalue) ' R=' attr(aria-ordervalue) !important;\n color: var(--qti-correct);\n }\n\n /* When only aria-ordercorrectvalue is present */\n &[aria-ordercorrectvalue]:not([aria-ordervalue])::after {\n content: 'C=' attr(aria-ordercorrectvalue) !important;\n color: var(--qti-correct);\n }\n }\n\n &.qti-selections-light {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-light-bg-active);\n }\n }\n\n &.qti-selections-dark {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n }\n }\n\n /* General styles for active and enabled states */\n &:state(--dragzone-active)::part(drags) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-bg-active);\n }\n }\n\n qti-graphic-associate-interaction {\n position: relative;\n display: block;\n\n & qti-associable-hotspot {\n &[shape='circle'] {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n\n &[shape='square'] {\n\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n &[aria-checked='true'] {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &[aria-readonly='true'] {\n cursor: pointer;\n background-color: var(--qti-bg);\n outline: 0;\n border: none;\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: var(--qti-disabled-bg);\n color: var(--qti-disabled-color);\n border-color: var(--qti-border-color);\n outline: 4px solid var(--qti-disabled-bg);\n }\n\n width: 100%;\n\n height: 100%;\n\n background-color: transparent;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n }\n\n &.qti-selections-light {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-light-bg-active);\n border-color: var(--qti-light-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-light-bg-active);\n }\n }\n\n &.qti-selections-dark {\n &:state(--dragzone-active)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n border-color: var(--qti-dark-border-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-dark-bg-active);\n }\n }\n\n /* General styles for active and enabled states */\n &:state(--dragzone-active)::part(drags) {\n border-color: var(--qti-border-active);\n background-color: var(--qti-bg-active);\n }\n\n &:state(--dragzone-enabled)::part(drags) {\n background-color: var(--qti-bg-active);\n }\n }\n\n qti-slider-interaction {\n --qti-tick-color: rgb(229 231 235 / 100%);\n --qti-tick-width: 1px;\n }\n\n qti-select-point-interaction {\n &::part(point) {\n &:hover {\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--qti-focus-border-width) var(--qti-focus-color);\n }\n\n border-radius: 100%;\n\n border: 1px solid white;\n\n background-color: black;\n\n opacity: 0.5;\n\n padding: 0;\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n }\n }\n\n qti-position-object-stage {\n & qti-position-object-interaction {\n /* no styles necessary, only layout styles, defined in the component */\n }\n }\n\n qti-prompt {\n margin: 0.5rem 0; /* my-2 */\n display: block;\n width: 100%;\n }\n}\n\nqti-test-part:not(:has(qti-assessment-item)),\nqti-assessment-section:not(:has(qti-assessment-item)),\nqti-assessment-item-ref:not(:has(qti-assessment-item)) {\n display: none;\n}\n"],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}
package/dist/chunks/chunk-SWROECSL.js ADDED
@@ -0,0 +1,82 @@
1
+ import {
2
+ computedContext
3
+ } from "./chunk-DTZHLZH2.js";
4
+ import {
5
+ __decorateClass
6
+ } from "./chunk-H2JE6IVU.js";
7
+
8
+ // src/lib/qti-test/components/test-stamp.ts
9
+ import { html, LitElement, nothing } from "lit";
10
+ import { customElement, property, state } from "lit/decorators.js";
11
+ import { prepareTemplate } from "stampino";
12
+ import { consume } from "@lit/context";
13
+ var TestStamp = class extends LitElement {
14
+ constructor() {
15
+ super(...arguments);
16
+ this.debug = false;
17
+ this.stampContext = null;
18
+ }
19
+ createRenderRoot() {
20
+ return this;
21
+ }
22
+ connectedCallback() {
23
+ super.connectedCallback();
24
+ const templateElement = this.querySelector("template");
25
+ if (!templateElement) {
26
+ this.myTemplate = null;
27
+ return;
28
+ }
29
+ this.myTemplate = prepareTemplate(templateElement);
30
+ }
31
+ willUpdate(_changedProperties) {
32
+ if (!this.computedContext) {
33
+ this.stampContext = null;
34
+ return;
35
+ }
36
+ const activeTestPart = this.computedContext.testParts.find((testPart) => testPart.active);
37
+ if (!activeTestPart) {
38
+ this.stampContext = null;
39
+ return;
40
+ }
41
+ const augmentedTestPart = {
42
+ ...activeTestPart,
43
+ items: activeTestPart.sections.flatMap((section) => section.items.map(({ variables, ...rest }) => rest)),
44
+ sections: activeTestPart.sections.map((section) => ({
45
+ ...section,
46
+ items: section.items.map(({ variables, ...rest }) => rest)
47
+ }))
48
+ };
49
+ const activeSection = augmentedTestPart.sections.find((section) => section.active);
50
+ const augmentedSection = activeSection ? { ...activeSection, items: activeSection.items } : null;
51
+ const augmentedItem = augmentedSection?.items.find((item) => item.active);
52
+ const { testParts, ...activeTest } = this.computedContext;
53
+ this.stampContext = {
54
+ item: augmentedItem || null,
55
+ section: augmentedSection || null,
56
+ testpart: augmentedTestPart,
57
+ test: activeTest
58
+ };
59
+ }
60
+ render() {
61
+ return html` ${this.debug ? html`<small><pre>${JSON.stringify(this.stampContext, null, 2)}</pre></small>` : nothing}
62
+ ${this.stampContext && this.myTemplate ? this.myTemplate(this.stampContext) : nothing}`;
63
+ }
64
+ };
65
+ __decorateClass([
66
+ property({ type: Boolean, reflect: true })
67
+ ], TestStamp.prototype, "debug", 2);
68
+ __decorateClass([
69
+ state(),
70
+ consume({ context: computedContext, subscribe: true })
71
+ ], TestStamp.prototype, "computedContext", 2);
72
+ __decorateClass([
73
+ state()
74
+ ], TestStamp.prototype, "stampContext", 2);
75
+ TestStamp = __decorateClass([
76
+ customElement("test-stamp")
77
+ ], TestStamp);
78
+
79
+ export {
80
+ TestStamp
81
+ };
82
+ //# sourceMappingURL=chunk-SWROECSL.js.map
package/dist/chunks/chunk-SWROECSL.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/lib/qti-test/components/test-stamp.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { prepareTemplate } from 'stampino';\nimport { consume } from '@lit/context';\n\nimport { computedContext } from '../../exports/computed.context';\n\nimport type { PropertyValues } from 'lit';\nimport type { ComputedContext } from '../../exports/computed.context';\nimport type { TemplateFunction } from 'stampino';\n\n@customElement('test-stamp')\nexport class TestStamp extends LitElement {\n /**\n * Indicates whether the component is in debug mode.\n * When set to `true`, the available objects and properties (i.e.: stampContext) is displayed.\n */\n @property({ type: Boolean, reflect: true })\n public debug = false;\n\n @state()\n @consume({ context: computedContext, subscribe: true })\n private computedContext: ComputedContext;\n\n @state()\n private stampContext: {\n test?: unknown;\n testpart?: unknown;\n section?: unknown;\n item?: unknown;\n } | null = null;\n\n myTemplate: TemplateFunction;\n\n protected createRenderRoot(): HTMLElement | DocumentFragment {\n return this;\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n const templateElement = this.querySelector<HTMLTemplateElement>('template');\n if (!templateElement) {\n this.myTemplate = null;\n return;\n }\n this.myTemplate = prepareTemplate(templateElement);\n }\n\n protected willUpdate(_changedProperties: PropertyValues): void {\n // If no computed context is available, clear the stamp context\n if (!this.computedContext) {\n this.stampContext = null;\n return;\n }\n\n // Find the active test part\n const activeTestPart = this.computedContext.testParts.find(testPart => testPart.active);\n if (!activeTestPart) {\n this.stampContext = null;\n return;\n }\n\n // Augment the active test part by removing variables from items\n const augmentedTestPart = {\n ...activeTestPart,\n items: activeTestPart.sections.flatMap(section => section.items.map(({ variables, ...rest }) => rest)),\n sections: activeTestPart.sections.map(section => ({\n ...section,\n items: section.items.map(({ variables, ...rest }) => rest)\n }))\n };\n\n // Find and augment the active section\n const activeSection = augmentedTestPart.sections.find(section => section.active);\n const augmentedSection = activeSection ? { ...activeSection, items: activeSection.items } : null;\n\n // Find the active item within the active section\n const augmentedItem = augmentedSection?.items.find(item => item.active);\n\n // Extract the active test data excluding test parts\n const { testParts, ...activeTest } = this.computedContext;\n\n // Set the stamp context with the augmented data\n this.stampContext = {\n item: augmentedItem || null,\n section: augmentedSection || null,\n testpart: augmentedTestPart,\n test: activeTest\n };\n }\n\n render() {\n return html` ${this.debug ? html`<small><pre>${JSON.stringify(this.stampContext, null, 2)}</pre></small>` : nothing}\n ${this.stampContext && this.myTemplate ? this.myTemplate(this.stampContext) : nothing}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'test-stamp': TestStamp;\n }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,MAAM,YAAY,eAAe;AAC1C,SAAS,eAAe,UAAU,aAAa;AAC/C,SAAS,uBAAuB;AAChC,SAAS,eAAe;AASjB,IAAM,YAAN,cAAwB,WAAW;AAAA,EAAnC;AAAA;AAML,SAAO,QAAQ;AAOf,SAAQ,eAKG;AAAA;AAAA,EAID,mBAAmD;AAC3D,WAAO;AAAA,EACT;AAAA,EAEA,oBAA0B;AACxB,UAAM,kBAAkB;AACxB,UAAM,kBAAkB,KAAK,cAAmC,UAAU;AAC1E,QAAI,CAAC,iBAAiB;AACpB,WAAK,aAAa;AAClB;AAAA,IACF;AACA,SAAK,aAAa,gBAAgB,eAAe;AAAA,EACnD;AAAA,EAEU,WAAW,oBAA0C;AAE7D,QAAI,CAAC,KAAK,iBAAiB;AACzB,WAAK,eAAe;AACpB;AAAA,IACF;AAGA,UAAM,iBAAiB,KAAK,gBAAgB,UAAU,KAAK,cAAY,SAAS,MAAM;AACtF,QAAI,CAAC,gBAAgB;AACnB,WAAK,eAAe;AACpB;AAAA,IACF;AAGA,UAAM,oBAAoB;AAAA,MACxB,GAAG;AAAA,MACH,OAAO,eAAe,SAAS,QAAQ,aAAW,QAAQ,MAAM,IAAI,CAAC,EAAE,WAAW,GAAG,KAAK,MAAM,IAAI,CAAC;AAAA,MACrG,UAAU,eAAe,SAAS,IAAI,cAAY;AAAA,QAChD,GAAG;AAAA,QACH,OAAO,QAAQ,MAAM,IAAI,CAAC,EAAE,WAAW,GAAG,KAAK,MAAM,IAAI;AAAA,MAC3D,EAAE;AAAA,IACJ;AAGA,UAAM,gBAAgB,kBAAkB,SAAS,KAAK,aAAW,QAAQ,MAAM;AAC/E,UAAM,mBAAmB,gBAAgB,EAAE,GAAG,eAAe,OAAO,cAAc,MAAM,IAAI;AAG5F,UAAM,gBAAgB,kBAAkB,MAAM,KAAK,UAAQ,KAAK,MAAM;AAGtE,UAAM,EAAE,WAAW,GAAG,WAAW,IAAI,KAAK;AAG1C,SAAK,eAAe;AAAA,MAClB,MAAM,iBAAiB;AAAA,MACvB,SAAS,oBAAoB;AAAA,MAC7B,UAAU;AAAA,MACV,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO,QAAQ,KAAK,QAAQ,mBAAmB,KAAK,UAAU,KAAK,cAAc,MAAM,CAAC,CAAC,mBAAmB,OAAO;AAAA,MACjH,KAAK,gBAAgB,KAAK,aAAa,KAAK,WAAW,KAAK,YAAY,IAAI,OAAO;AAAA,EACvF;AACF;AA7ES;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAL/B,UAMJ;AAIC;AAAA,EAFP,MAAM;AAAA,EACN,QAAQ,EAAE,SAAS,iBAAiB,WAAW,KAAK,CAAC;AAAA,GAT3C,UAUH;AAGA;AAAA,EADP,MAAM;AAAA,GAZI,UAaH;AAbG,YAAN;AAAA,EADN,cAAc,YAAY;AAAA,GACd;","names":[]}
package/dist/chunks/chunk-TGF5F45T.js ADDED
@@ -0,0 +1,94 @@
1
+ import {
2
+ item_default
3
+ } from "./chunk-MCMAHBGE.js";
4
+ import {
5
+ watch
6
+ } from "./chunk-ELDMXTUQ.js";
7
+ import {
8
+ qtiTransformItem
9
+ } from "./chunk-VEWD22O5.js";
10
+ import {
11
+ __decorateClass
12
+ } from "./chunk-H2JE6IVU.js";
13
+
14
+ // src/lib/qti-item/components/item-container.ts
15
+ import { LitElement, html } from "lit";
16
+ import { customElement, property, state } from "lit/decorators.js";
17
+ import { until } from "lit/directives/until.js";
18
+ var ItemContainer = class extends LitElement {
19
+ constructor() {
20
+ super(...arguments);
21
+ this.itemURL = null;
22
+ this.itemDoc = null;
23
+ this.itemXML = null;
24
+ /** Template content if provided */
25
+ this.templateContent = null;
26
+ }
27
+ async handleItemURLChange() {
28
+ if (!this.itemURL) return;
29
+ try {
30
+ const { promise: api } = await qtiTransformItem().load(this.itemURL);
31
+ this.itemDoc = (await api).htmlDoc();
32
+ } catch (error) {
33
+ console.error("Error loading or parsing XML:", error);
34
+ }
35
+ }
36
+ handleItemXMLChange() {
37
+ if (!this.itemXML) return;
38
+ try {
39
+ this.itemDoc = qtiTransformItem().parse(this.itemXML).htmlDoc();
40
+ } catch (error) {
41
+ console.error("Error parsing XML:", error);
42
+ }
43
+ }
44
+ async connectedCallback() {
45
+ super.connectedCallback();
46
+ this.initializeTemplateContent();
47
+ this.applyStyles();
48
+ if (this.itemURL) {
49
+ this.handleItemURLChange();
50
+ }
51
+ if (this.itemXML) {
52
+ this.handleItemXMLChange();
53
+ }
54
+ }
55
+ initializeTemplateContent() {
56
+ const template = this.querySelector("template");
57
+ this.templateContent = template ? template.content : html``;
58
+ }
59
+ applyStyles() {
60
+ const sheet = new CSSStyleSheet();
61
+ sheet.replaceSync(item_default);
62
+ this.shadowRoot.adoptedStyleSheets = [sheet];
63
+ }
64
+ render() {
65
+ return html`
66
+ ${this.templateContent}
67
+ <slot></slot>
68
+ ${until(this.itemDoc, html`<span>Loading...</span>`)}
69
+ `;
70
+ }
71
+ };
72
+ __decorateClass([
73
+ property({ type: String, attribute: "item-url" })
74
+ ], ItemContainer.prototype, "itemURL", 2);
75
+ __decorateClass([
76
+ state()
77
+ ], ItemContainer.prototype, "itemDoc", 2);
78
+ __decorateClass([
79
+ state()
80
+ ], ItemContainer.prototype, "itemXML", 2);
81
+ __decorateClass([
82
+ watch("itemURL", { waitUntilFirstUpdate: true })
83
+ ], ItemContainer.prototype, "handleItemURLChange", 1);
84
+ __decorateClass([
85
+ watch("itemXML", { waitUntilFirstUpdate: true })
86
+ ], ItemContainer.prototype, "handleItemXMLChange", 1);
87
+ ItemContainer = __decorateClass([
88
+ customElement("item-container")
89
+ ], ItemContainer);
90
+
91
+ export {
92
+ ItemContainer
93
+ };
94
+ //# sourceMappingURL=chunk-TGF5F45T.js.map
package/dist/chunks/chunk-TGF5F45T.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/lib/qti-item/components/item-container.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { until } from 'lit/directives/until.js';\n\nimport { watch } from '../../decorators/watch';\nimport itemCss from '../../../item.css?inline';\nimport { qtiTransformItem } from '../../qti-transformers';\n\n/**\n * `<item-container>` is a custom element designed for hosting the qti-assessment-item.\n * The `qti-assessment-item` will be placed inside the shadow DOM of this element.\n * The element loads the item from the provided URL and renders it inside the shadow DOM.\n *\n * ### Styling\n * Add a class to the element for styling.\n *\n * ```html\n * <qti-item>\n * <item-container class=\"m-4 bg-white\" item-url=\"./path/to/item.xml\"></item-container>\n * </qti-item>\n * ```\n */\n@customElement('item-container')\nexport class ItemContainer extends LitElement {\n /** URL of the item to load */\n @property({ type: String, attribute: 'item-url' })\n itemURL: string = null;\n\n /** A parsed HTML document */\n @state()\n itemDoc: DocumentFragment = null;\n\n /** The raw XML string */\n @state()\n itemXML: string = null;\n\n /** Template content if provided */\n private templateContent = null;\n\n @watch('itemURL', { waitUntilFirstUpdate: true })\n protected async handleItemURLChange() {\n if (!this.itemURL) return;\n try {\n const { promise: api } = await qtiTransformItem().load(this.itemURL);\n this.itemDoc = (await api).htmlDoc();\n } catch (error) {\n console.error('Error loading or parsing XML:', error);\n }\n }\n\n @watch('itemXML', { waitUntilFirstUpdate: true })\n protected handleItemXMLChange() {\n if (!this.itemXML) return;\n try {\n this.itemDoc = qtiTransformItem().parse(this.itemXML).htmlDoc();\n } catch (error) {\n console.error('Error parsing XML:', error);\n }\n }\n\n async connectedCallback(): Promise<void> {\n super.connectedCallback();\n this.initializeTemplateContent();\n this.applyStyles();\n if (this.itemURL) {\n this.handleItemURLChange();\n }\n if (this.itemXML) {\n this.handleItemXMLChange();\n }\n }\n\n private initializeTemplateContent() {\n const template = this.querySelector('template') as HTMLTemplateElement;\n this.templateContent = template ? template.content : html``;\n }\n\n private applyStyles() {\n const sheet = new CSSStyleSheet();\n sheet.replaceSync(itemCss);\n this.shadowRoot.adoptedStyleSheets = [sheet];\n }\n\n render() {\n return html`\n ${this.templateContent}\n <slot></slot>\n ${until(this.itemDoc, html`<span>Loading...</span>`)}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'item-container': ItemContainer;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,YAAY,YAAY;AACjC,SAAS,eAAe,UAAU,aAAa;AAC/C,SAAS,aAAa;AAqBf,IAAM,gBAAN,cAA4B,WAAW;AAAA,EAAvC;AAAA;AAGL,mBAAkB;AAIlB,mBAA4B;AAI5B,mBAAkB;AAGlB;AAAA,SAAQ,kBAAkB;AAAA;AAAA,EAG1B,MAAgB,sBAAsB;AACpC,QAAI,CAAC,KAAK,QAAS;AACnB,QAAI;AACF,YAAM,EAAE,SAAS,IAAI,IAAI,MAAM,iBAAiB,EAAE,KAAK,KAAK,OAAO;AACnE,WAAK,WAAW,MAAM,KAAK,QAAQ;AAAA,IACrC,SAAS,OAAO;AACd,cAAQ,MAAM,iCAAiC,KAAK;AAAA,IACtD;AAAA,EACF;AAAA,EAGU,sBAAsB;AAC9B,QAAI,CAAC,KAAK,QAAS;AACnB,QAAI;AACF,WAAK,UAAU,iBAAiB,EAAE,MAAM,KAAK,OAAO,EAAE,QAAQ;AAAA,IAChE,SAAS,OAAO;AACd,cAAQ,MAAM,sBAAsB,KAAK;AAAA,IAC3C;AAAA,EACF;AAAA,EAEA,MAAM,oBAAmC;AACvC,UAAM,kBAAkB;AACxB,SAAK,0BAA0B;AAC/B,SAAK,YAAY;AACjB,QAAI,KAAK,SAAS;AAChB,WAAK,oBAAoB;AAAA,IAC3B;AACA,QAAI,KAAK,SAAS;AAChB,WAAK,oBAAoB;AAAA,IAC3B;AAAA,EACF;AAAA,EAEQ,4BAA4B;AAClC,UAAM,WAAW,KAAK,cAAc,UAAU;AAC9C,SAAK,kBAAkB,WAAW,SAAS,UAAU;AAAA,EACvD;AAAA,EAEQ,cAAc;AACpB,UAAM,QAAQ,IAAI,cAAc;AAChC,UAAM,YAAY,YAAO;AACzB,SAAK,WAAW,qBAAqB,CAAC,KAAK;AAAA,EAC7C;AAAA,EAEA,SAAS;AACP,WAAO;AAAA,QACH,KAAK,eAAe;AAAA;AAAA,QAEpB,MAAM,KAAK,SAAS,6BAA6B,CAAC;AAAA;AAAA,EAExD;AACF;AAhEE;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,WAAW,CAAC;AAAA,GAFtC,cAGX;AAIA;AAAA,EADC,MAAM;AAAA,GANI,cAOX;AAIA;AAAA,EADC,MAAM;AAAA,GAVI,cAWX;AAMgB;AAAA,EADf,MAAM,WAAW,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAhBrC,cAiBK;AAWN;AAAA,EADT,MAAM,WAAW,EAAE,sBAAsB,KAAK,CAAC;AAAA,GA3BrC,cA4BD;AA5BC,gBAAN;AAAA,EADN,cAAc,gBAAgB;AAAA,GAClB;","names":[]}
package/dist/chunks/chunk-TUVS6HU4.js ADDED
@@ -0,0 +1,85 @@
1
+ import {
2
+ computedContext
3
+ } from "./chunk-DTZHLZH2.js";
4
+ import {
5
+ __decorateClass
6
+ } from "./chunk-H2JE6IVU.js";
7
+
8
+ // src/lib/qti-test/components/test-print-item-variables.ts
9
+ import { html, css, LitElement } from "lit";
10
+ import { consume } from "@lit/context";
11
+ import { customElement } from "lit/decorators.js";
12
+ var TestPrintVariables = class extends LitElement {
13
+ render() {
14
+ const activeItem = this.computedContext?.testParts.flatMap((testPart) => testPart.sections.flatMap((section) => section.items)).find((item) => item.active);
15
+ if (!activeItem || !activeItem.variables) return html``;
16
+ const responseVariables = activeItem.variables.filter((v) => v.type === "response");
17
+ const outcomeVariables = activeItem.variables.filter((v) => v.type === "outcome");
18
+ const renderTable = (variables, title) => html`
19
+ <h3>${title}</h3>
20
+ <table>
21
+ <thead>
22
+ <tr>
23
+ <th>Identifier</th>
24
+ <th>Value</th>
25
+ <th>Cardinality</th>
26
+ <th>Base Type</th>
27
+ <th>Correct Response / Mappings</th>
28
+ </tr>
29
+ </thead>
30
+ <tbody>
31
+ ${variables.map((v) => {
32
+ const correctResponse = v.correctResponse ? Array.isArray(v.correctResponse) ? v.correctResponse.join(", ") : v.correctResponse : "";
33
+ const mapEntries = v.mapping?.mapEntries?.map((m) => `${m.mapKey}=${m.mappedValue}pt`).join(", ") || "";
34
+ const areaMapEntries = v.areaMapping?.areaMapEntries?.map((m) => `${m.shape}(${m.coords})=${m.mappedValue}pt`).join(", ") || "";
35
+ return html`
36
+ <tr>
37
+ <td>${v.identifier}</td>
38
+ <td>${Array.isArray(v.value) ? v.value.join(", ") : v.value}</td>
39
+ <td>${v.cardinality}</td>
40
+ <td>${v.baseType}</td>
41
+ <td>${correctResponse || mapEntries || areaMapEntries}</td>
42
+ </tr>
43
+ `;
44
+ })}
45
+ </tbody>
46
+ </table>
47
+ `;
48
+ return html`
49
+ ${renderTable(responseVariables, "Response Variables")} ${renderTable(outcomeVariables, "Outcome Variables")}
50
+ `;
51
+ }
52
+ };
53
+ TestPrintVariables.styles = css`
54
+ table {
55
+ width: 100%;
56
+ border-collapse: collapse;
57
+ margin: 20px 0;
58
+ font-size: 14px;
59
+ text-align: left;
60
+ }
61
+ th,
62
+ td {
63
+ border: 1px solid #ddd;
64
+ padding: 8px;
65
+ }
66
+ th {
67
+ background-color: #f4f4f4;
68
+ font-weight: bold;
69
+ }
70
+ h3 {
71
+ margin-top: 20px;
72
+ font-size: 16px;
73
+ }
74
+ `;
75
+ __decorateClass([
76
+ consume({ context: computedContext, subscribe: true })
77
+ ], TestPrintVariables.prototype, "computedContext", 2);
78
+ TestPrintVariables = __decorateClass([
79
+ customElement("test-print-item-variables")
80
+ ], TestPrintVariables);
81
+
82
+ export {
83
+ TestPrintVariables
84
+ };
85
+ //# sourceMappingURL=chunk-TUVS6HU4.js.map
package/dist/chunks/chunk-TUVS6HU4.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/lib/qti-test/components/test-print-item-variables.ts"],"sourcesContent":["import { html, css, LitElement } from 'lit';\nimport { consume } from '@lit/context';\nimport { customElement } from 'lit/decorators.js';\n\nimport { computedContext } from '../../exports/computed.context';\n\nimport type { ResponseVariable } from '../../exports/variables';\nimport type { ComputedContext } from '../../exports/computed.context';\n\n@customElement('test-print-item-variables')\nexport class TestPrintVariables extends LitElement {\n @consume({ context: computedContext, subscribe: true })\n public computedContext?: ComputedContext;\n\n static styles = css`\n table {\n width: 100%;\n border-collapse: collapse;\n margin: 20px 0;\n font-size: 14px;\n text-align: left;\n }\n th,\n td {\n border: 1px solid #ddd;\n padding: 8px;\n }\n th {\n background-color: #f4f4f4;\n font-weight: bold;\n }\n h3 {\n margin-top: 20px;\n font-size: 16px;\n }\n `;\n\n render() {\n const activeItem = this.computedContext?.testParts\n .flatMap(testPart => testPart.sections.flatMap(section => section.items))\n .find(item => item.active);\n\n if (!activeItem || !activeItem.variables) return html``;\n\n const responseVariables: ResponseVariable[] = activeItem.variables.filter(v => v.type === 'response');\n const outcomeVariables = activeItem.variables.filter(v => v.type === 'outcome');\n\n const renderTable = (variables: ResponseVariable[], title: string) => html`\n <h3>${title}</h3>\n <table>\n <thead>\n <tr>\n <th>Identifier</th>\n <th>Value</th>\n <th>Cardinality</th>\n <th>Base Type</th>\n <th>Correct Response / Mappings</th>\n </tr>\n </thead>\n <tbody>\n ${variables.map(v => {\n const correctResponse = v.correctResponse\n ? Array.isArray(v.correctResponse)\n ? v.correctResponse.join(', ')\n : v.correctResponse\n : '';\n\n const mapEntries = v.mapping?.mapEntries?.map(m => `${m.mapKey}=${m.mappedValue}pt`).join(', ') || '';\n\n const areaMapEntries =\n v.areaMapping?.areaMapEntries?.map(m => `${m.shape}(${m.coords})=${m.mappedValue}pt`).join(', ') || '';\n\n return html`\n <tr>\n <td>${v.identifier}</td>\n <td>${Array.isArray(v.value) ? v.value.join(', ') : v.value}</td>\n <td>${v.cardinality}</td>\n <td>${v.baseType}</td>\n <td>${correctResponse || mapEntries || areaMapEntries}</td>\n </tr>\n `;\n })}\n </tbody>\n </table>\n `;\n\n return html`\n ${renderTable(responseVariables, 'Response Variables')} ${renderTable(outcomeVariables, 'Outcome Variables')}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'test-print-item-variables': TestPrintVariables;\n }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,MAAM,KAAK,kBAAkB;AACtC,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAQvB,IAAM,qBAAN,cAAiC,WAAW;AAAA,EA2BjD,SAAS;AACP,UAAM,aAAa,KAAK,iBAAiB,UACtC,QAAQ,cAAY,SAAS,SAAS,QAAQ,aAAW,QAAQ,KAAK,CAAC,EACvE,KAAK,UAAQ,KAAK,MAAM;AAE3B,QAAI,CAAC,cAAc,CAAC,WAAW,UAAW,QAAO;AAEjD,UAAM,oBAAwC,WAAW,UAAU,OAAO,OAAK,EAAE,SAAS,UAAU;AACpG,UAAM,mBAAmB,WAAW,UAAU,OAAO,OAAK,EAAE,SAAS,SAAS;AAE9E,UAAM,cAAc,CAAC,WAA+B,UAAkB;AAAA,YAC9D,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAYL,UAAU,IAAI,OAAK;AACnB,YAAM,kBAAkB,EAAE,kBACtB,MAAM,QAAQ,EAAE,eAAe,IAC7B,EAAE,gBAAgB,KAAK,IAAI,IAC3B,EAAE,kBACJ;AAEJ,YAAM,aAAa,EAAE,SAAS,YAAY,IAAI,OAAK,GAAG,EAAE,MAAM,IAAI,EAAE,WAAW,IAAI,EAAE,KAAK,IAAI,KAAK;AAEnG,YAAM,iBACJ,EAAE,aAAa,gBAAgB,IAAI,OAAK,GAAG,EAAE,KAAK,IAAI,EAAE,MAAM,KAAK,EAAE,WAAW,IAAI,EAAE,KAAK,IAAI,KAAK;AAEtG,aAAO;AAAA;AAAA,sBAEG,EAAE,UAAU;AAAA,sBACZ,MAAM,QAAQ,EAAE,KAAK,IAAI,EAAE,MAAM,KAAK,IAAI,IAAI,EAAE,KAAK;AAAA,sBACrD,EAAE,WAAW;AAAA,sBACb,EAAE,QAAQ;AAAA,sBACV,mBAAmB,cAAc,cAAc;AAAA;AAAA;AAAA,IAG3D,CAAC,CAAC;AAAA;AAAA;AAAA;AAKR,WAAO;AAAA,QACH,YAAY,mBAAmB,oBAAoB,CAAC,IAAI,YAAY,kBAAkB,mBAAmB,CAAC;AAAA;AAAA,EAEhH;AACF;AAhFa,mBAIJ,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFT;AAAA,EADN,QAAQ,EAAE,SAAS,iBAAiB,WAAW,KAAK,CAAC;AAAA,GAD3C,mBAEJ;AAFI,qBAAN;AAAA,EADN,cAAc,2BAA2B;AAAA,GAC7B;","names":[]}
package/dist/chunks/chunk-UHU4AWX2.js ADDED
@@ -0,0 +1,28 @@
1
+ import {
2
+ computedContext
3
+ } from "./chunk-DTZHLZH2.js";
4
+ import {
5
+ __decorateClass
6
+ } from "./chunk-H2JE6IVU.js";
7
+
8
+ // src/lib/qti-test/components/test-print-context.ts
9
+ import { html, LitElement } from "lit";
10
+ import { consume } from "@lit/context";
11
+ import { customElement, state } from "lit/decorators.js";
12
+ var TestPrintContext = class extends LitElement {
13
+ render() {
14
+ return html` <small><pre>${JSON.stringify(this.computedContext, null, 2)}</pre></small> `;
15
+ }
16
+ };
17
+ __decorateClass([
18
+ state(),
19
+ consume({ context: computedContext, subscribe: true })
20
+ ], TestPrintContext.prototype, "computedContext", 2);
21
+ TestPrintContext = __decorateClass([
22
+ customElement("test-print-context")
23
+ ], TestPrintContext);
24
+
25
+ export {
26
+ TestPrintContext
27
+ };
28
+ //# sourceMappingURL=chunk-UHU4AWX2.js.map
package/dist/chunks/chunk-UHU4AWX2.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/lib/qti-test/components/test-print-context.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { consume } from '@lit/context';\nimport { customElement, state } from 'lit/decorators.js';\n\nimport { computedContext } from '../../exports/computed.context';\n\nimport type { ComputedContext } from '../../exports/computed.context';\n\n@customElement('test-print-context')\nexport class TestPrintContext extends LitElement {\n @state()\n @consume({ context: computedContext, subscribe: true })\n public computedContext?: ComputedContext;\n\n render() {\n // const activeItems = this.computedContext?.testParts.flatMap(testPart =>\n // testPart.sections.flatMap(section => section.items).find(item => item.active)\n // );\n // if (!activeItems) return html``;\n // const activeItem = activeItems.length > 0 ? activeItems[0] : null;\n // delete activeItem?.variables;\n return html` <small><pre>${JSON.stringify(this.computedContext, null, 2)}</pre></small> `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'test-print-context': TestPrintContext;\n }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,MAAM,kBAAkB;AACjC,SAAS,eAAe;AACxB,SAAS,eAAe,aAAa;AAO9B,IAAM,mBAAN,cAA+B,WAAW;AAAA,EAK/C,SAAS;AAOP,WAAO,oBAAoB,KAAK,UAAU,KAAK,iBAAiB,MAAM,CAAC,CAAC;AAAA,EAC1E;AACF;AAXS;AAAA,EAFN,MAAM;AAAA,EACN,QAAQ,EAAE,SAAS,iBAAiB,WAAW,KAAK,CAAC;AAAA,GAF3C,iBAGJ;AAHI,mBAAN;AAAA,EADN,cAAc,oBAAoB;AAAA,GACtB;","names":[]}
package/dist/chunks/chunk-V53ESOPP.js ADDED
@@ -0,0 +1,79 @@
1
+ import {
2
+ computedContext
3
+ } from "./chunk-DTZHLZH2.js";
4
+ import {
5
+ __decorateClass
6
+ } from "./chunk-H2JE6IVU.js";
7
+
8
+ // src/lib/qti-test/components/test-stamp.ts
9
+ import { html, LitElement, nothing } from "lit";
10
+ import { customElement, property, state } from "lit/decorators.js";
11
+ import { prepareTemplate } from "stampino";
12
+ import { consume } from "@lit/context";
13
+ var TestStamp = class extends LitElement {
14
+ constructor() {
15
+ super(...arguments);
16
+ this.debug = false;
17
+ this.stampContext = null;
18
+ }
19
+ createRenderRoot() {
20
+ return this;
21
+ }
22
+ connectedCallback() {
23
+ super.connectedCallback();
24
+ const templateElement = this.querySelector("template");
25
+ if (!templateElement) {
26
+ this.myTemplate = null;
27
+ return;
28
+ }
29
+ this.myTemplate = prepareTemplate(templateElement);
30
+ }
31
+ willUpdate(_changedProperties) {
32
+ if (!this.computedContext) {
33
+ this.stampContext = null;
34
+ return;
35
+ }
36
+ const activeTestPart = this.computedContext.testParts.find((testPart) => testPart.active);
37
+ const augmentedTestPart = {
38
+ ...activeTestPart,
39
+ items: activeTestPart.sections.flatMap((section) => section.items)
40
+ };
41
+ const activeSection = this.computedContext.testParts.flatMap((testPart) => testPart.sections).find((section) => section.active);
42
+ const { items, ...augmentedSection } = activeSection;
43
+ const activeItem = this.computedContext.testParts.flatMap((testPart) => testPart.sections.flatMap((section) => section.items)).find((item) => item.active);
44
+ const { variables, ...augmentedItem } = activeItem;
45
+ if (!activeTestPart || !activeItem) {
46
+ this.stampContext = null;
47
+ return;
48
+ }
49
+ const { testParts, ...activeTest } = this.computedContext;
50
+ this.stampContext = {
51
+ test: activeTest,
52
+ testpart: augmentedTestPart,
53
+ section: augmentedSection,
54
+ item: augmentedItem
55
+ };
56
+ }
57
+ render() {
58
+ return html` ${this.debug ? html`<small><pre>${JSON.stringify(this.stampContext, null, 2)}</pre></small>` : nothing}
59
+ ${this.stampContext && this.myTemplate ? this.myTemplate(this.stampContext) : nothing}`;
60
+ }
61
+ };
62
+ __decorateClass([
63
+ property({ type: Boolean, reflect: true })
64
+ ], TestStamp.prototype, "debug", 2);
65
+ __decorateClass([
66
+ state(),
67
+ consume({ context: computedContext, subscribe: true })
68
+ ], TestStamp.prototype, "computedContext", 2);
69
+ __decorateClass([
70
+ state()
71
+ ], TestStamp.prototype, "stampContext", 2);
72
+ TestStamp = __decorateClass([
73
+ customElement("test-stamp")
74
+ ], TestStamp);
75
+
76
+ export {
77
+ TestStamp
78
+ };
79
+ //# sourceMappingURL=chunk-V53ESOPP.js.map