@citolab/qti-components 7.0.6-next.0 → 7.0.6-next.1

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 (286) hide show
  1. package/cdn/chunk-2F5323DC.js +8 -0
  2. package/cdn/chunk-2WPNLHGH.js +43 -0
  3. package/cdn/chunk-3M77CJJH.js +8 -0
  4. package/cdn/chunk-4DFVJE2A.js +48 -0
  5. package/cdn/chunk-4HKDXRGE.js +5 -0
  6. package/cdn/chunk-5WCOPF7O.js +73 -0
  7. package/cdn/chunk-D4K2EXYX.js +8 -0
  8. package/cdn/chunk-II7AGB2E.js +11 -0
  9. package/cdn/chunk-KUOLGIA5.js +1 -0
  10. package/cdn/chunk-KXRA4DBZ.js +8 -0
  11. package/cdn/chunk-L4TDHAKL.js +24 -0
  12. package/cdn/chunk-LY27H7YF.js +1 -0
  13. package/cdn/chunk-M6AATWPS.js +59 -0
  14. package/cdn/{chunk-L26FOTPN.js → chunk-MFWSHIPH.js} +1 -1
  15. package/cdn/chunk-NAARXANC.js +11 -0
  16. package/cdn/chunk-OEBYNBRS.js +129 -0
  17. package/cdn/chunk-RBATSYIS.js +43 -0
  18. package/cdn/chunk-RM352RXQ.js +5 -0
  19. package/cdn/{chunk-Y63VPWCG.js → chunk-SQDSHH6N.js} +18 -2
  20. package/cdn/chunk-V2RMP73O.js +1 -0
  21. package/cdn/chunk-WI7KK7NI.js +8 -0
  22. package/cdn/chunk-YHB534QY.js +8 -0
  23. package/cdn/chunk-YXST4IEX.js +5 -0
  24. package/cdn/qti-components/index.js +939 -1
  25. package/cdn/qti-item/core/index.global.js +149 -0
  26. package/cdn/qti-item/core/index.js +5 -0
  27. package/cdn/qti-loader/index.js +1 -1
  28. package/cdn/qti-test/components/index.global.js +1 -36
  29. package/cdn/qti-test/components/index.js +1 -1
  30. package/cdn/qti-test/components/styles.js +1 -1
  31. package/cdn/qti-test/components/test-component.abstract.js +1 -1
  32. package/cdn/qti-test/components/test-item-link.js +1 -1
  33. package/cdn/qti-test/components/test-next.js +1 -1
  34. package/cdn/qti-test/components/test-next.spec.global.js +25 -60
  35. package/cdn/qti-test/components/test-next.spec.js +212 -212
  36. package/cdn/qti-test/components/test-paging-buttons-stamp.js +1 -1
  37. package/cdn/qti-test/components/test-prev.js +1 -1
  38. package/cdn/qti-test/components/test-view.js +1 -1
  39. package/cdn/qti-test/core/index.global.js +205 -0
  40. package/cdn/qti-test/core/index.js +1 -0
  41. package/dist/{chunk-3WLCQQN7.js → chunk-2CHF3TMY.js} +2 -2
  42. package/dist/chunk-2CHF3TMY.js.map +1 -0
  43. package/dist/{chunk-JDHBXMKF.js → chunk-2GKDJDI5.js} +2 -2
  44. package/dist/{chunk-L7MBIXEX.js → chunk-3F3DCHHM.js} +2 -2
  45. package/dist/chunk-4YR7ZPE3.js +72 -0
  46. package/dist/{chunk-R4HSV7U7.js → chunk-E3656TSN.js} +2 -2
  47. package/dist/chunk-E3656TSN.js.map +1 -0
  48. package/dist/{chunk-TXRSYXG3.js → chunk-ERLGA6TC.js} +2 -2
  49. package/dist/{chunk-GTYLWGDG.js → chunk-EXJQ3ZUE.js} +2 -2
  50. package/dist/chunk-KI3A6ZT6.js +50 -0
  51. package/dist/chunk-KI3A6ZT6.js.map +1 -0
  52. package/dist/{chunk-ENVUIH2A.js → chunk-KVFH5VBC.js} +5 -5
  53. package/dist/chunk-KVFH5VBC.js.map +1 -0
  54. package/dist/chunk-LJU3MHXE.js +43 -0
  55. package/dist/chunk-LJU3MHXE.js.map +1 -0
  56. package/dist/chunk-MAC76UNI.js +1 -0
  57. package/dist/chunk-NUXEGEMP.js +65 -0
  58. package/dist/chunk-NUXEGEMP.js.map +1 -0
  59. package/dist/chunk-O3GIZH57.js +121 -0
  60. package/dist/chunk-O3GIZH57.js.map +1 -0
  61. package/dist/chunk-QNR4WQAC.js +568 -0
  62. package/dist/chunk-QNR4WQAC.js.map +1 -0
  63. package/dist/chunk-SLMQZKDH.js +568 -0
  64. package/dist/chunk-SLMQZKDH.js.map +1 -0
  65. package/dist/{chunk-VODOQFTJ.js → chunk-TAQAVEQ2.js} +2 -2
  66. package/dist/chunk-TAQAVEQ2.js.map +1 -0
  67. package/dist/chunk-TLPISJ3Z.js +78 -0
  68. package/dist/chunk-TLPISJ3Z.js.map +1 -0
  69. package/dist/chunk-UDWEOEOS.js +50 -0
  70. package/dist/chunk-UDWEOEOS.js.map +1 -0
  71. package/dist/qti-components/index.d.ts +2 -2
  72. package/dist/qti-components/index.js +6157 -94
  73. package/dist/qti-components/index.js.map +1 -1
  74. package/dist/qti-components-jsx.d.ts +83 -83
  75. package/dist/qti-item/{components/item-container.d.ts → core/index.d.ts} +22 -1
  76. package/dist/{chunk-XNBWN7N2.js → qti-item/core/index.js} +20 -9
  77. package/dist/qti-item/core/index.js.map +1 -0
  78. package/dist/qti-loader/index.d.ts +1 -1
  79. package/dist/qti-loader/index.js +22 -4
  80. package/dist/qti-loader/index.js.map +1 -1
  81. package/dist/{qti-simple-choice-DxWcdKHi.d.ts → qti-simple-choice-DB7hqAMS.d.ts} +1 -1
  82. package/dist/qti-test/components/index.d.ts +2 -4
  83. package/dist/qti-test/components/index.js +10 -17
  84. package/dist/qti-test/components/test-component.abstract.d.ts +2 -3
  85. package/dist/qti-test/components/test-component.abstract.js +2 -3
  86. package/dist/qti-test/components/test-item-link.d.ts +2 -3
  87. package/dist/qti-test/components/test-item-link.js +3 -4
  88. package/dist/qti-test/components/test-next.d.ts +2 -3
  89. package/dist/qti-test/components/test-next.js +3 -4
  90. package/dist/qti-test/components/test-next.spec.d.ts +3 -7
  91. package/dist/qti-test/components/test-next.spec.js +11 -31
  92. package/dist/qti-test/components/test-next.spec.js.map +1 -1
  93. package/dist/qti-test/components/test-paging-buttons-stamp.d.ts +2 -3
  94. package/dist/qti-test/components/test-paging-buttons-stamp.js +3 -4
  95. package/dist/qti-test/components/test-prev.d.ts +2 -3
  96. package/dist/qti-test/components/test-prev.js +3 -4
  97. package/dist/qti-test/components/test-view.d.ts +2 -3
  98. package/dist/qti-test/components/test-view.js +3 -4
  99. package/dist/qti-test/core/index.d.ts +121 -0
  100. package/dist/qti-test/core/index.js +25 -0
  101. package/dist/test-component.abstract-DWJ0XNiI.d.ts +108 -0
  102. package/dist/test.context-DKSpQHyg.d.ts +93 -0
  103. package/dist/{test-base-BJwG9Ie8.d.ts → test.context-K2w-1mWi.d.ts} +19 -29
  104. package/dist/vscode.html-custom-data.json +21 -21
  105. package/package.json +70 -74
  106. package/cdn/chunk-25BMUTLC.js +0 -1
  107. package/cdn/chunk-3DWLPGTE.js +0 -1
  108. package/cdn/chunk-7BKWTY4S.js +0 -1
  109. package/cdn/chunk-7CQ4ETXL.js +0 -1
  110. package/cdn/chunk-7ENNZNJ4.js +0 -1
  111. package/cdn/chunk-7LGM2TQA.js +0 -1
  112. package/cdn/chunk-DLMFCDQX.js +0 -1
  113. package/cdn/chunk-DPR6SGCZ.js +0 -1
  114. package/cdn/chunk-EQGXFSYL.js +0 -8
  115. package/cdn/chunk-F5VW77RE.js +0 -1
  116. package/cdn/chunk-FNVXN5CO.js +0 -1
  117. package/cdn/chunk-GB7DLBFM.js +0 -0
  118. package/cdn/chunk-GBB54IPA.js +0 -8
  119. package/cdn/chunk-H4A34YRT.js +0 -0
  120. package/cdn/chunk-ITXNNGVQ.js +0 -0
  121. package/cdn/chunk-IV7UP34N.js +0 -5
  122. package/cdn/chunk-IZZ36JQV.js +0 -0
  123. package/cdn/chunk-JNT54FPI.js +0 -1
  124. package/cdn/chunk-JS4S7ZI7.js +0 -1
  125. package/cdn/chunk-LA7TBIPQ.js +0 -0
  126. package/cdn/chunk-POT65ZY7.js +0 -1
  127. package/cdn/chunk-Q7PVZA43.js +0 -5
  128. package/cdn/chunk-QJPHXAUE.js +0 -1
  129. package/cdn/chunk-QP57JHGY.js +0 -11
  130. package/cdn/chunk-RB6CONZW.js +0 -3
  131. package/cdn/chunk-RSRX5JYB.js +0 -1
  132. package/cdn/chunk-TG6AE3DB.js +0 -0
  133. package/cdn/chunk-V6YPUNZC.js +0 -0
  134. package/cdn/chunk-W7X6GNEX.js +0 -902
  135. package/cdn/chunk-ZEX7TYC7.js +0 -8
  136. package/cdn/index.global.js +0 -277
  137. package/cdn/index.js +0 -1
  138. package/cdn/qti-item/components/index.global.js +0 -149
  139. package/cdn/qti-item/components/index.js +0 -1
  140. package/cdn/qti-item/components/item-container.global.js +0 -149
  141. package/cdn/qti-item/components/item-container.js +0 -1
  142. package/cdn/qti-item/index.global.js +0 -149
  143. package/cdn/qti-item/index.js +0 -1
  144. package/cdn/qti-item/qti-item.global.js +0 -114
  145. package/cdn/qti-item/qti-item.js +0 -1
  146. package/cdn/qti-test/components/test-container.global.js +0 -149
  147. package/cdn/qti-test/components/test-container.js +0 -1
  148. package/cdn/qti-test/context/index.global.js +0 -58
  149. package/cdn/qti-test/context/index.js +0 -1
  150. package/cdn/qti-test/context/test.context.global.js +0 -58
  151. package/cdn/qti-test/context/test.context.js +0 -1
  152. package/cdn/qti-test/index.global.js +0 -242
  153. package/cdn/qti-test/index.js +0 -1
  154. package/cdn/qti-test/mixins/index.global.js +0 -1
  155. package/cdn/qti-test/mixins/index.js +0 -1
  156. package/cdn/qti-test/mixins/test-loader.mixin.global.js +0 -1
  157. package/cdn/qti-test/mixins/test-loader.mixin.js +0 -1
  158. package/cdn/qti-test/mixins/test-navigation.mixin.global.js +0 -1
  159. package/cdn/qti-test/mixins/test-navigation.mixin.js +0 -1
  160. package/cdn/qti-test/mixins/test-view.mixin.global.js +0 -1
  161. package/cdn/qti-test/mixins/test-view.mixin.js +0 -1
  162. package/cdn/qti-test/qti-assessment-test/index.global.js +0 -170
  163. package/cdn/qti-test/qti-assessment-test/index.js +0 -1
  164. package/cdn/qti-test/qti-assessment-test/qti-assessment-item-ref.global.js +0 -170
  165. package/cdn/qti-test/qti-assessment-test/qti-assessment-item-ref.js +0 -1
  166. package/cdn/qti-test/qti-assessment-test/qti-assessment-section.global.js +0 -170
  167. package/cdn/qti-test/qti-assessment-test/qti-assessment-section.js +0 -1
  168. package/cdn/qti-test/qti-assessment-test/qti-assessment-test.global.js +0 -170
  169. package/cdn/qti-test/qti-assessment-test/qti-assessment-test.js +0 -1
  170. package/cdn/qti-test/qti-assessment-test/qti-test-part.global.js +0 -114
  171. package/cdn/qti-test/qti-assessment-test/qti-test-part.js +0 -1
  172. package/cdn/qti-test/qti-test.global.js +0 -170
  173. package/cdn/qti-test/qti-test.js +0 -1
  174. package/cdn/qti-test/test-base.global.js +0 -170
  175. package/cdn/qti-test/test-base.js +0 -1
  176. package/dist/chunk-37X6KZO3.js +0 -1
  177. package/dist/chunk-3WLCQQN7.js.map +0 -1
  178. package/dist/chunk-3YVIK6LO.js +0 -1
  179. package/dist/chunk-3YVIK6LO.js.map +0 -1
  180. package/dist/chunk-7A6KCSAU.js +0 -44
  181. package/dist/chunk-7A6KCSAU.js.map +0 -1
  182. package/dist/chunk-ENVUIH2A.js.map +0 -1
  183. package/dist/chunk-ENZVY5X6.js +0 -20
  184. package/dist/chunk-ENZVY5X6.js.map +0 -1
  185. package/dist/chunk-EUCEENQQ.js +0 -6253
  186. package/dist/chunk-EUCEENQQ.js.map +0 -1
  187. package/dist/chunk-FNFNAV3G.js +0 -56
  188. package/dist/chunk-FNFNAV3G.js.map +0 -1
  189. package/dist/chunk-GSFDTSLL.js +0 -1
  190. package/dist/chunk-GSFDTSLL.js.map +0 -1
  191. package/dist/chunk-IAFQ5ZPI.js +0 -29
  192. package/dist/chunk-IAFQ5ZPI.js.map +0 -1
  193. package/dist/chunk-LYFMLDNV.js +0 -1
  194. package/dist/chunk-LYFMLDNV.js.map +0 -1
  195. package/dist/chunk-NNPTSZGC.js +0 -1
  196. package/dist/chunk-NNPTSZGC.js.map +0 -1
  197. package/dist/chunk-NQM35JUI.js +0 -1
  198. package/dist/chunk-NQM35JUI.js.map +0 -1
  199. package/dist/chunk-ODUHPWTX.js +0 -65
  200. package/dist/chunk-ODUHPWTX.js.map +0 -1
  201. package/dist/chunk-OGHHCP23.js +0 -36
  202. package/dist/chunk-OGHHCP23.js.map +0 -1
  203. package/dist/chunk-OQZW2B47.js +0 -75
  204. package/dist/chunk-OQZW2B47.js.map +0 -1
  205. package/dist/chunk-OXDOQVRL.js +0 -63
  206. package/dist/chunk-OXDOQVRL.js.map +0 -1
  207. package/dist/chunk-PBSMP6VF.js +0 -128
  208. package/dist/chunk-PBSMP6VF.js.map +0 -1
  209. package/dist/chunk-Q7OPFS4A.js +0 -1
  210. package/dist/chunk-Q7OPFS4A.js.map +0 -1
  211. package/dist/chunk-R4HSV7U7.js.map +0 -1
  212. package/dist/chunk-U3RLYKL5.js +0 -51
  213. package/dist/chunk-U3RLYKL5.js.map +0 -1
  214. package/dist/chunk-VW7VIQBE.js +0 -34
  215. package/dist/chunk-VW7VIQBE.js.map +0 -1
  216. package/dist/chunk-X4ZBUCOD.js +0 -94
  217. package/dist/chunk-X4ZBUCOD.js.map +0 -1
  218. package/dist/chunk-XFHB6KQW.js +0 -1
  219. package/dist/chunk-XFHB6KQW.js.map +0 -1
  220. package/dist/chunk-XNBWN7N2.js.map +0 -1
  221. package/dist/index.d.ts +0 -19
  222. package/dist/index.js +0 -278
  223. package/dist/qti-item/components/index.d.ts +0 -3
  224. package/dist/qti-item/components/index.js +0 -12
  225. package/dist/qti-item/components/index.js.map +0 -1
  226. package/dist/qti-item/components/item-container.js +0 -11
  227. package/dist/qti-item/components/item-container.js.map +0 -1
  228. package/dist/qti-item/index.d.ts +0 -4
  229. package/dist/qti-item/index.js +0 -17
  230. package/dist/qti-item/index.js.map +0 -1
  231. package/dist/qti-item/qti-item.d.ts +0 -25
  232. package/dist/qti-item/qti-item.js +0 -8
  233. package/dist/qti-item/qti-item.js.map +0 -1
  234. package/dist/qti-test/components/test-container.d.ts +0 -37
  235. package/dist/qti-test/components/test-container.js +0 -11
  236. package/dist/qti-test/components/test-container.js.map +0 -1
  237. package/dist/qti-test/context/index.d.ts +0 -6
  238. package/dist/qti-test/context/index.js +0 -11
  239. package/dist/qti-test/context/index.js.map +0 -1
  240. package/dist/qti-test/context/test.context.d.ts +0 -6
  241. package/dist/qti-test/context/test.context.js +0 -10
  242. package/dist/qti-test/context/test.context.js.map +0 -1
  243. package/dist/qti-test/index.d.ts +0 -14
  244. package/dist/qti-test/index.js +0 -72
  245. package/dist/qti-test/index.js.map +0 -1
  246. package/dist/qti-test/mixins/index.d.ts +0 -8
  247. package/dist/qti-test/mixins/index.js +0 -18
  248. package/dist/qti-test/mixins/index.js.map +0 -1
  249. package/dist/qti-test/mixins/test-loader.mixin.d.ts +0 -8
  250. package/dist/qti-test/mixins/test-loader.mixin.js +0 -9
  251. package/dist/qti-test/mixins/test-loader.mixin.js.map +0 -1
  252. package/dist/qti-test/mixins/test-navigation.mixin.d.ts +0 -22
  253. package/dist/qti-test/mixins/test-navigation.mixin.js +0 -8
  254. package/dist/qti-test/mixins/test-navigation.mixin.js.map +0 -1
  255. package/dist/qti-test/mixins/test-view.mixin.d.ts +0 -6
  256. package/dist/qti-test/mixins/test-view.mixin.js +0 -8
  257. package/dist/qti-test/mixins/test-view.mixin.js.map +0 -1
  258. package/dist/qti-test/qti-assessment-test/index.d.ts +0 -6
  259. package/dist/qti-test/qti-assessment-test/index.js +0 -23
  260. package/dist/qti-test/qti-assessment-test/index.js.map +0 -1
  261. package/dist/qti-test/qti-assessment-test/qti-assessment-item-ref.d.ts +0 -6
  262. package/dist/qti-test/qti-assessment-test/qti-assessment-item-ref.js +0 -10
  263. package/dist/qti-test/qti-assessment-test/qti-assessment-item-ref.js.map +0 -1
  264. package/dist/qti-test/qti-assessment-test/qti-assessment-section.d.ts +0 -6
  265. package/dist/qti-test/qti-assessment-test/qti-assessment-section.js +0 -10
  266. package/dist/qti-test/qti-assessment-test/qti-assessment-section.js.map +0 -1
  267. package/dist/qti-test/qti-assessment-test/qti-assessment-test.d.ts +0 -6
  268. package/dist/qti-test/qti-assessment-test/qti-assessment-test.js +0 -10
  269. package/dist/qti-test/qti-assessment-test/qti-assessment-test.js.map +0 -1
  270. package/dist/qti-test/qti-assessment-test/qti-test-part.d.ts +0 -19
  271. package/dist/qti-test/qti-assessment-test/qti-test-part.js +0 -8
  272. package/dist/qti-test/qti-assessment-test/qti-test-part.js.map +0 -1
  273. package/dist/qti-test/qti-test.d.ts +0 -68
  274. package/dist/qti-test/qti-test.js +0 -16
  275. package/dist/qti-test/qti-test.js.map +0 -1
  276. package/dist/qti-test/test-base.d.ts +0 -6
  277. package/dist/qti-test/test-base.js +0 -10
  278. package/dist/qti-test/test-base.js.map +0 -1
  279. /package/cdn/{chunk-CYJMNT76.js → chunk-22HAPLRD.js} +0 -0
  280. /package/dist/{chunk-JDHBXMKF.js.map → chunk-2GKDJDI5.js.map} +0 -0
  281. /package/dist/{chunk-L7MBIXEX.js.map → chunk-3F3DCHHM.js.map} +0 -0
  282. /package/dist/{chunk-VODOQFTJ.js.map → chunk-4YR7ZPE3.js.map} +0 -0
  283. /package/dist/{chunk-TXRSYXG3.js.map → chunk-ERLGA6TC.js.map} +0 -0
  284. /package/dist/{chunk-GTYLWGDG.js.map → chunk-EXJQ3ZUE.js.map} +0 -0
  285. /package/dist/{chunk-37X6KZO3.js.map → chunk-MAC76UNI.js.map} +0 -0
  286. /package/dist/{index.js.map → qti-test/core/index.js.map} +0 -0
package/dist/chunk-2CHF3TMY.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 /* 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 /* Point elements */\n --qti-point-size: 2rem;\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 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: unset;\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 width: var(--qti-point-size);\n height: var(--qti-point-size);\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 .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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem) !important; /* 1.5rem for the drag */ border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color); outline: none; 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 ); background-repeat: repeat-y; background-position: left center; background-size: 14px 8px;\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\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 border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\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 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: flexbox;\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 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: #16a34a; /* text-green-600 */\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: unset;\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:hover {\n background-color: var(--qti-hover-bg);\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: unset;\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\n }\n\n &:hover {\n background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\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\n background-repeat: repeat-y;\n\n background-position: left center;\n\n background-size: 14px 8px\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 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 border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none\n }\n }\n\n qti-hotspot-interaction {\n & qti-hotspot-choice {\n &[shape='circle'] {\n\n &:hover {\n background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 gap: 0.5rem;\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\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\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\n background-repeat: repeat-y;\n\n background-position: left center;\n\n background-size: 14px 8px\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 gap: var(--qti-gap-size);\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\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 border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\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 background-color: var(--qti-hover-bg);\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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\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\n background-repeat: repeat-y;\n\n background-position: left center;\n\n background-size: 14px 8px;\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 background-color: var(--qti-hover-bg);\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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\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\n background-repeat: repeat-y;\n\n background-position: left center;\n\n background-size: 14px 8px\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 background-color: var(--qti-hover-bg);\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 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 border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 padding-left: calc(var(--qti-padding-horizontal) + 0.5rem);\n\n border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n\n outline: none;\n\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\n background-repeat: repeat-y;\n\n background-position: left center;\n\n background-size: 14px 8px\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 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 border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);\n outline: none;\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\n &:hover {\n background-color: var(--qti-hover-bg);\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 &[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 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 &.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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 background-color: var(--qti-hover-bg);\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 width: var(--qti-point-size);\n\n height: var(--qti-point-size);\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-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"],"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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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/{chunk-JDHBXMKF.js → chunk-2GKDJDI5.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  TestComponent
3
- } from "./chunk-ENVUIH2A.js";
3
+ } from "./chunk-KVFH5VBC.js";
4
4
  import {
5
5
  __decorateClass
6
6
  } from "./chunk-44VE5POH.js";
@@ -75,4 +75,4 @@ TestPagingButtonsStamp = __decorateClass([
75
75
  export {
76
76
  TestPagingButtonsStamp
77
77
  };
78
- //# sourceMappingURL=chunk-JDHBXMKF.js.map
78
+ //# sourceMappingURL=chunk-2GKDJDI5.js.map
package/dist/{chunk-L7MBIXEX.js → chunk-3F3DCHHM.js} RENAMED
@@ -4,7 +4,7 @@ import {
4
4
  } from "./chunk-UB5K44DB.js";
5
5
  import {
6
6
  TestComponent
7
- } from "./chunk-ENVUIH2A.js";
7
+ } from "./chunk-O3GIZH57.js";
8
8
  import {
9
9
  __decorateClass
10
10
  } from "./chunk-44VE5POH.js";
@@ -47,4 +47,4 @@ TestNext = __decorateClass([
47
47
  export {
48
48
  TestNext
49
49
  };
50
- //# sourceMappingURL=chunk-L7MBIXEX.js.map
50
+ //# sourceMappingURL=chunk-3F3DCHHM.js.map
package/dist/chunk-4YR7ZPE3.js ADDED
@@ -0,0 +1,72 @@
1
+ import {
2
+ TestComponent
3
+ } from "./chunk-O3GIZH57.js";
4
+ import {
5
+ watch
6
+ } from "./chunk-NUXEGEMP.js";
7
+ import {
8
+ __decorateClass
9
+ } from "./chunk-44VE5POH.js";
10
+
11
+ // src/lib/qti-test/components/test-view.ts
12
+ import { html } from "lit";
13
+ import { customElement, property, state } from "lit/decorators.js";
14
+ var TestView = class extends TestComponent {
15
+ constructor() {
16
+ super(...arguments);
17
+ this.label = "view";
18
+ this._handleViewOptionsChange = () => {
19
+ this.updateViewOptions();
20
+ };
21
+ this._viewOptions = TestView.DEFAULT_VIEW_OPTIONS;
22
+ }
23
+ connectedCallback() {
24
+ super.connectedCallback();
25
+ this.updateViewOptions();
26
+ }
27
+ updateViewOptions() {
28
+ if (this.viewOptions) {
29
+ const options = this.viewOptions.split(",").map((opt) => opt.trim());
30
+ this._viewOptions = options.filter((opt) => TestView.DEFAULT_VIEW_OPTIONS.includes(opt));
31
+ } else {
32
+ this._viewOptions = TestView.DEFAULT_VIEW_OPTIONS;
33
+ }
34
+ }
35
+ render() {
36
+ return html`
37
+ <label part="label" for="viewSelect">${this.label}</label>
38
+ <select
39
+ part="select"
40
+ id="viewSelect"
41
+ .disabled=${this.disabled}
42
+ @change=${(e) => {
43
+ const el = e.target;
44
+ this._switchView(el.value);
45
+ }}
46
+ >
47
+ ${this._viewOptions.map((v) => html`<option value="${v}" ?selected=${v === this.view}>${v}</option>`)}
48
+ </select>
49
+ `;
50
+ }
51
+ };
52
+ TestView.DEFAULT_VIEW_OPTIONS = ["author", "candidate", "proctor", "scorer", "testConstructor", "tutor"];
53
+ __decorateClass([
54
+ property({ type: String })
55
+ ], TestView.prototype, "label", 2);
56
+ __decorateClass([
57
+ property({ type: String, attribute: "view-options" })
58
+ ], TestView.prototype, "viewOptions", 2);
59
+ __decorateClass([
60
+ watch("viewOptions", { waitUntilFirstUpdate: true })
61
+ ], TestView.prototype, "_handleViewOptionsChange", 2);
62
+ __decorateClass([
63
+ state()
64
+ ], TestView.prototype, "_viewOptions", 2);
65
+ TestView = __decorateClass([
66
+ customElement("test-view")
67
+ ], TestView);
68
+
69
+ export {
70
+ TestView
71
+ };
72
+ //# sourceMappingURL=chunk-4YR7ZPE3.js.map
package/dist/{chunk-R4HSV7U7.js → chunk-E3656TSN.js} RENAMED
@@ -1,4 +1,4 @@
1
- // src/lib/qti-test/context/test.context.ts
1
+ // src/lib/qti-test/core/context/test.context.ts
2
2
  import { createContext } from "@lit/context";
3
3
  var testContext = createContext(Symbol("test"));
4
4
  var testElement = createContext(Symbol("testElement"));
@@ -7,4 +7,4 @@ export {
7
7
  testContext,
8
8
  testElement
9
9
  };
10
- //# sourceMappingURL=chunk-R4HSV7U7.js.map
10
+ //# sourceMappingURL=chunk-E3656TSN.js.map
package/dist/chunk-E3656TSN.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/qti-test/core/context/test.context.ts"],"sourcesContent":["import { createContext } from '@lit/context';\nimport { QtiAssessmentTest } from '../qti-assessment-test';\nimport { ItemContext, VariableDeclaration } from '../../../qti-components';\nimport { View } from '../mixins/test-view.mixin';\n\nexport interface TestContext {\n items: (ItemContext & { category?: string })[];\n testOutcomeVariables: VariableDeclaration<string | string[]>[];\n navPartId?: string | null;\n navSectionId?: string | null;\n navItemId?: string | null;\n navItemLoading?: boolean;\n navTestLoading?: boolean;\n view?: View;\n}\n\nexport const testContext = createContext<Readonly<TestContext>>(Symbol('test'));\n\nexport type TestElement = {\n el: QtiAssessmentTest;\n};\n\nexport const testElement = createContext<Readonly<TestElement>>(Symbol('testElement'));\n"],"mappings":";AAAA,SAAS,qBAAqB;AAgBvB,IAAM,cAAc,cAAqC,OAAO,MAAM,CAAC;AAMvE,IAAM,cAAc,cAAqC,OAAO,aAAa,CAAC;","names":[]}
package/dist/{chunk-TXRSYXG3.js → chunk-ERLGA6TC.js} RENAMED
@@ -4,7 +4,7 @@ import {
4
4
  } from "./chunk-UB5K44DB.js";
5
5
  import {
6
6
  TestComponent
7
- } from "./chunk-ENVUIH2A.js";
7
+ } from "./chunk-KVFH5VBC.js";
8
8
  import {
9
9
  __decorateClass
10
10
  } from "./chunk-44VE5POH.js";
@@ -47,4 +47,4 @@ TestPrev = __decorateClass([
47
47
  export {
48
48
  TestPrev
49
49
  };
50
- //# sourceMappingURL=chunk-TXRSYXG3.js.map
50
+ //# sourceMappingURL=chunk-ERLGA6TC.js.map
package/dist/{chunk-GTYLWGDG.js → chunk-EXJQ3ZUE.js} RENAMED
@@ -4,7 +4,7 @@ import {
4
4
  } from "./chunk-UB5K44DB.js";
5
5
  import {
6
6
  TestComponent
7
- } from "./chunk-ENVUIH2A.js";
7
+ } from "./chunk-KVFH5VBC.js";
8
8
  import {
9
9
  __decorateClass
10
10
  } from "./chunk-44VE5POH.js";
@@ -40,4 +40,4 @@ TestItemLink = __decorateClass([
40
40
  export {
41
41
  TestItemLink
42
42
  };
43
- //# sourceMappingURL=chunk-GTYLWGDG.js.map
43
+ //# sourceMappingURL=chunk-EXJQ3ZUE.js.map
package/dist/chunk-KI3A6ZT6.js ADDED
@@ -0,0 +1,50 @@
1
+ import {
2
+ btn,
3
+ dis
4
+ } from "./chunk-UB5K44DB.js";
5
+ import {
6
+ TestComponent
7
+ } from "./chunk-KVFH5VBC.js";
8
+ import {
9
+ __decorateClass
10
+ } from "./chunk-44VE5POH.js";
11
+
12
+ // src/lib/qti-test/components/test-next.ts
13
+ import { css, html } from "lit";
14
+ import { customElement } from "lit/decorators.js";
15
+ var TestNext = class extends TestComponent {
16
+ constructor() {
17
+ super();
18
+ this._internals.role = "button";
19
+ this._internals.ariaLabel = "Next item";
20
+ this.addEventListener("click", (e) => {
21
+ e.preventDefault();
22
+ if (!this.disabled) this._requestItem(this.items[this.itemIndex + 1].identifier);
23
+ });
24
+ }
25
+ willUpdate(changedProperties) {
26
+ super.willUpdate(changedProperties);
27
+ if (changedProperties.has("_testContext")) {
28
+ this.disabled = !this._testElement?.el || this.itemIndex < 0 || this.itemIndex >= this.items.length - 1;
29
+ }
30
+ }
31
+ render() {
32
+ return html`<slot></slot>`;
33
+ }
34
+ };
35
+ TestNext.styles = css`
36
+ :host {
37
+ ${btn};
38
+ }
39
+ :host([disabled]) {
40
+ ${dis};
41
+ }
42
+ `;
43
+ TestNext = __decorateClass([
44
+ customElement("test-next")
45
+ ], TestNext);
46
+
47
+ export {
48
+ TestNext
49
+ };
50
+ //# sourceMappingURL=chunk-KI3A6ZT6.js.map
package/dist/chunk-KI3A6ZT6.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/qti-test/components/test-next.ts"],"sourcesContent":["import { css, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport * as styles from './styles';\nimport { TestComponent } from './test-component.abstract';\n\n/**\n * Represents a custom element for navigating to the next test item.\n *\n * @remarks\n * This element provides functionality for navigating to the next test item.\n *\n * @example\n * ```html\n * <test-next></test-next>\n * ```\n */\n@customElement('test-next')\nexport class TestNext extends TestComponent {\n static styles = css`\n :host {\n ${styles.btn};\n }\n :host([disabled]) {\n ${styles.dis};\n }\n `;\n\n constructor() {\n super();\n this._internals.role = 'button';\n this._internals.ariaLabel = 'Next item';\n\n this.addEventListener('click', e => {\n e.preventDefault();\n if (!this.disabled) this._requestItem(this.items[this.itemIndex + 1].identifier);\n });\n }\n\n willUpdate(changedProperties: Map<string | number | symbol, unknown>) {\n super.willUpdate(changedProperties);\n if (changedProperties.has('_testContext')) {\n this.disabled = !this._testElement?.el || this.itemIndex < 0 || this.itemIndex >= this.items.length - 1;\n }\n }\n\n render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'test-next': TestNext;\n }\n}\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,KAAK,YAAY;AAC1B,SAAS,qBAAqB;AAgBvB,IAAM,WAAN,cAAuB,cAAc;AAAA,EAU1C,cAAc;AACZ,UAAM;AACN,SAAK,WAAW,OAAO;AACvB,SAAK,WAAW,YAAY;AAE5B,SAAK,iBAAiB,SAAS,OAAK;AAClC,QAAE,eAAe;AACjB,UAAI,CAAC,KAAK,SAAU,MAAK,aAAa,KAAK,MAAM,KAAK,YAAY,CAAC,EAAE,UAAU;AAAA,IACjF,CAAC;AAAA,EACH;AAAA,EAEA,WAAW,mBAA2D;AACpE,UAAM,WAAW,iBAAiB;AAClC,QAAI,kBAAkB,IAAI,cAAc,GAAG;AACzC,WAAK,WAAW,CAAC,KAAK,cAAc,MAAM,KAAK,YAAY,KAAK,KAAK,aAAa,KAAK,MAAM,SAAS;AAAA,IACxG;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO;AAAA,EACT;AACF;AA/Ba,SACJ,SAAS;AAAA;AAAA,QAEH,GAAG;AAAA;AAAA;AAAA,QAGH,GAAG;AAAA;AAAA;AANL,WAAN;AAAA,EADN,cAAc,WAAW;AAAA,GACb;","names":[]}
package/dist/{chunk-ENVUIH2A.js → chunk-KVFH5VBC.js} RENAMED
@@ -1,10 +1,10 @@
1
- import {
2
- watch
3
- } from "./chunk-4YG2FPKK.js";
4
1
  import {
5
2
  testContext,
6
3
  testElement
7
- } from "./chunk-R4HSV7U7.js";
4
+ } from "./chunk-E3656TSN.js";
5
+ import {
6
+ watch
7
+ } from "./chunk-4YG2FPKK.js";
8
8
  import {
9
9
  __decorateClass
10
10
  } from "./chunk-44VE5POH.js";
@@ -115,4 +115,4 @@ __decorateClass([
115
115
  export {
116
116
  TestComponent
117
117
  };
118
- //# sourceMappingURL=chunk-ENVUIH2A.js.map
118
+ //# sourceMappingURL=chunk-KVFH5VBC.js.map
package/dist/chunk-KVFH5VBC.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/qti-test/components/test-component.abstract.ts","../src/lib/decorators/prop-internal-state.ts"],"sourcesContent":["import { consume } from '@lit/context';\nimport { LitElement } from 'lit';\nimport { state } from 'lit/decorators.js';\nimport { propInternalState } from '../../decorators';\nimport { testContext, testElement, TestElement, TestContext } from '../core/context';\nimport { watch } from '../../decorators/watch';\n\nexport abstract class TestComponent extends LitElement {\n @propInternalState({\n type: Boolean,\n reflect: true,\n aria: 'ariaDisabled' // Maps to `aria-disabled` attribute\n })\n public disabled = true;\n\n @state()\n @consume({ context: testContext, subscribe: true })\n protected _testContext?: TestContext;\n\n @state()\n @consume({ context: testElement, subscribe: true })\n protected _testElement?: TestElement;\n @watch('_testElement')\n _handleTestElementChange(_oldValue: TestElement, newValue: TestElement) {\n if (newValue.el) {\n this.disabled = false;\n }\n }\n\n protected _internals: ElementInternals;\n\n protected items;\n protected itemIndex;\n protected view;\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n protected willUpdate(changedProperties: Map<string | number | symbol, unknown>) {\n if (changedProperties.has('_testContext')) {\n const { items = [], navItemId } = this._testContext ?? {};\n this.itemIndex = items.findIndex(item => item.identifier === navItemId);\n this.items = items;\n this.view = this._testContext?.view;\n }\n }\n\n protected _switchView(view: string) {\n this.dispatchEvent(\n new CustomEvent('on-test-switch-view', {\n composed: true,\n bubbles: true,\n detail: view\n })\n );\n }\n\n protected _requestItem(identifier: string): void {\n this.dispatchEvent(\n new CustomEvent('qti-request-test-item', {\n composed: true,\n bubbles: true,\n detail: identifier\n })\n );\n }\n}\n","import { ReactiveElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { PropertyDeclaration } from 'lit';\n\n// Extended decorator options\ninterface InternalStateOptions extends PropertyDeclaration {\n aria?: string; // Corresponding ARIA attribute, e.g., 'aria-disabled'\n}\n\nexport function propInternalState(options: InternalStateOptions) {\n return (protoOrDescriptor: any, name: string) => {\n // Apply the default Lit `@property` decorator\n property(options)(protoOrDescriptor, name);\n\n // Intercept the property descriptor to enhance functionality\n const key = `__${name}`; // Internal backing field\n\n Object.defineProperty(protoOrDescriptor, name, {\n get() {\n return this[key];\n },\n set(value: any) {\n const oldValue = this[key];\n this[key] = value;\n\n // Trigger updates if value changes\n if (oldValue !== value) {\n // Update internals state\n if (this._internals?.states) {\n const stateName = name.toLowerCase();\n if (value) {\n this._internals.states.add(`--${stateName}`);\n } else {\n this._internals.states.delete(`--${stateName}`);\n }\n }\n\n // Update ARIA attributes if specified\n if (options.aria && this._internals) {\n const ariaAttribute = options.aria;\n if (value) {\n this._internals[ariaAttribute] = 'true';\n } else {\n this._internals[ariaAttribute] = null;\n }\n }\n\n // Request an update\n (this as ReactiveElement).requestUpdate(name, oldValue);\n }\n },\n configurable: true,\n enumerable: true\n });\n };\n}\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B,SAAS,aAAa;;;ACDtB,SAAS,gBAAgB;AAQlB,SAAS,kBAAkB,SAA+B;AAC/D,SAAO,CAAC,mBAAwB,SAAiB;AAE/C,aAAS,OAAO,EAAE,mBAAmB,IAAI;AAGzC,UAAM,MAAM,KAAK,IAAI;AAErB,WAAO,eAAe,mBAAmB,MAAM;AAAA,MAC7C,MAAM;AACJ,eAAO,KAAK,GAAG;AAAA,MACjB;AAAA,MACA,IAAI,OAAY;AACd,cAAM,WAAW,KAAK,GAAG;AACzB,aAAK,GAAG,IAAI;AAGZ,YAAI,aAAa,OAAO;AAEtB,cAAI,KAAK,YAAY,QAAQ;AAC3B,kBAAM,YAAY,KAAK,YAAY;AACnC,gBAAI,OAAO;AACT,mBAAK,WAAW,OAAO,IAAI,KAAK,SAAS,EAAE;AAAA,YAC7C,OAAO;AACL,mBAAK,WAAW,OAAO,OAAO,KAAK,SAAS,EAAE;AAAA,YAChD;AAAA,UACF;AAGA,cAAI,QAAQ,QAAQ,KAAK,YAAY;AACnC,kBAAM,gBAAgB,QAAQ;AAC9B,gBAAI,OAAO;AACT,mBAAK,WAAW,aAAa,IAAI;AAAA,YACnC,OAAO;AACL,mBAAK,WAAW,aAAa,IAAI;AAAA,YACnC;AAAA,UACF;AAGA,UAAC,KAAyB,cAAc,MAAM,QAAQ;AAAA,QACxD;AAAA,MACF;AAAA,MACA,cAAc;AAAA,MACd,YAAY;AAAA,IACd,CAAC;AAAA,EACH;AACF;;;ADhDO,IAAe,gBAAf,cAAqC,WAAW;AAAA,EA4BrD,cAAc;AACZ,UAAM;AAvBR,SAAO,WAAW;AAwBhB,SAAK,aAAa,KAAK,gBAAgB;AAAA,EACzC;AAAA,EAfA,yBAAyB,WAAwB,UAAuB;AACtE,QAAI,SAAS,IAAI;AACf,WAAK,WAAW;AAAA,IAClB;AAAA,EACF;AAAA,EAaU,WAAW,mBAA2D;AAC9E,QAAI,kBAAkB,IAAI,cAAc,GAAG;AACzC,YAAM,EAAE,QAAQ,CAAC,GAAG,UAAU,IAAI,KAAK,gBAAgB,CAAC;AACxD,WAAK,YAAY,MAAM,UAAU,UAAQ,KAAK,eAAe,SAAS;AACtE,WAAK,QAAQ;AACb,WAAK,OAAO,KAAK,cAAc;AAAA,IACjC;AAAA,EACF;AAAA,EAEU,YAAY,MAAc;AAClC,SAAK;AAAA,MACH,IAAI,YAAY,uBAAuB;AAAA,QACrC,UAAU;AAAA,QACV,SAAS;AAAA,QACT,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEU,aAAa,YAA0B;AAC/C,SAAK;AAAA,MACH,IAAI,YAAY,yBAAyB;AAAA,QACvC,UAAU;AAAA,QACV,SAAS;AAAA,QACT,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AAAA,EACF;AACF;AAvDS;AAAA,EALN,kBAAkB;AAAA,IACjB,MAAM;AAAA,IACN,SAAS;AAAA,IACT,MAAM;AAAA;AAAA,EACR,CAAC;AAAA,GALmB,cAMb;AAIG;AAAA,EAFT,MAAM;AAAA,EACN,QAAQ,EAAE,SAAS,aAAa,WAAW,KAAK,CAAC;AAAA,GAT9B,cAUV;AAIA;AAAA,EAFT,MAAM;AAAA,EACN,QAAQ,EAAE,SAAS,aAAa,WAAW,KAAK,CAAC;AAAA,GAb9B,cAcV;AAEV;AAAA,EADC,MAAM,cAAc;AAAA,GAfD,cAgBpB;","names":[]}
package/dist/chunk-LJU3MHXE.js ADDED
@@ -0,0 +1,43 @@
1
+ import {
2
+ btn,
3
+ dis
4
+ } from "./chunk-UB5K44DB.js";
5
+ import {
6
+ TestComponent
7
+ } from "./chunk-O3GIZH57.js";
8
+ import {
9
+ __decorateClass
10
+ } from "./chunk-44VE5POH.js";
11
+
12
+ // src/lib/qti-test/components/test-item-link.ts
13
+ import { css, html } from "lit";
14
+ import { customElement, property } from "lit/decorators.js";
15
+ var TestItemLink = class extends TestComponent {
16
+ constructor() {
17
+ super();
18
+ this.itemId = null;
19
+ this.addEventListener("click", () => this._requestItem(this.itemId));
20
+ }
21
+ render() {
22
+ return html` <slot></slot> `;
23
+ }
24
+ };
25
+ TestItemLink.styles = css`
26
+ :host {
27
+ ${btn};
28
+ }
29
+ :host([disabled]) {
30
+ ${dis};
31
+ }
32
+ `;
33
+ __decorateClass([
34
+ property({ type: String, attribute: "item-id" })
35
+ ], TestItemLink.prototype, "itemId", 2);
36
+ TestItemLink = __decorateClass([
37
+ customElement("test-item-link")
38
+ ], TestItemLink);
39
+
40
+ export {
41
+ TestItemLink
42
+ };
43
+ //# sourceMappingURL=chunk-LJU3MHXE.js.map
package/dist/chunk-LJU3MHXE.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/qti-test/components/test-item-link.ts"],"sourcesContent":["import { css, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { TestComponent } from './test-component.abstract';\nimport * as styles from './styles';\n\n@customElement('test-item-link')\nexport class TestItemLink extends TestComponent {\n static styles = css`\n :host {\n ${styles.btn};\n }\n :host([disabled]) {\n ${styles.dis};\n }\n `;\n\n @property({ type: String, attribute: 'item-id' })\n private itemId: string = null;\n\n constructor() {\n super();\n this.addEventListener('click', () => this._requestItem(this.itemId));\n }\n\n render() {\n return html` <slot></slot> `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'test-item-link': TestItemLink;\n }\n}\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,KAAK,YAAY;AAC1B,SAAS,eAAe,gBAAgB;AAKjC,IAAM,eAAN,cAA2B,cAAc;AAAA,EAa9C,cAAc;AACZ,UAAM;AAHR,SAAQ,SAAiB;AAIvB,SAAK,iBAAiB,SAAS,MAAM,KAAK,aAAa,KAAK,MAAM,CAAC;AAAA,EACrE;AAAA,EAEA,SAAS;AACP,WAAO;AAAA,EACT;AACF;AArBa,aACJ,SAAS;AAAA;AAAA,QAEH,GAAG;AAAA;AAAA;AAAA,QAGH,GAAG;AAAA;AAAA;AAKR;AAAA,EADP,SAAS,EAAE,MAAM,QAAQ,WAAW,UAAU,CAAC;AAAA,GAVrC,aAWH;AAXG,eAAN;AAAA,EADN,cAAc,gBAAgB;AAAA,GAClB;","names":[]}
package/dist/chunk-MAC76UNI.js ADDED
@@ -0,0 +1 @@
1
+ //# sourceMappingURL=chunk-MAC76UNI.js.map
package/dist/chunk-NUXEGEMP.js ADDED
@@ -0,0 +1,65 @@
1
+ // src/lib/decorators/watch.ts
2
+ function watch(propertyName, options) {
3
+ const resolvedOptions = {
4
+ waitUntilFirstUpdate: false,
5
+ ...options
6
+ };
7
+ return (proto, decoratedFnName) => {
8
+ const { update } = proto;
9
+ const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];
10
+ proto.update = function(changedProps) {
11
+ watchedProperties.forEach((property) => {
12
+ const key = property;
13
+ if (changedProps.has(key)) {
14
+ const oldValue = changedProps.get(key);
15
+ const newValue = this[key];
16
+ if (oldValue !== newValue) {
17
+ if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {
18
+ this[decoratedFnName](oldValue, newValue);
19
+ }
20
+ }
21
+ }
22
+ });
23
+ update.call(this, changedProps);
24
+ };
25
+ };
26
+ }
27
+
28
+ // src/lib/decorators/live-query.ts
29
+ function liveQuery(querySelector, _options) {
30
+ let observer;
31
+ return (proto, decoratedFnName) => {
32
+ const { connectedCallback, disconnectedCallback } = proto;
33
+ proto.connectedCallback = function() {
34
+ connectedCallback.call(this);
35
+ const callback = (mutationList) => {
36
+ const elementsToWatch = Array.from(this.querySelectorAll(querySelector)).concat(
37
+ Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])
38
+ );
39
+ for (const mutation of mutationList) {
40
+ const addedNodes = Array.from(mutation.addedNodes).map((e) => e);
41
+ const removedNodes = Array.from(mutation.addedNodes).map((e) => e);
42
+ if (mutation.type === "childList" && addedNodes.find((n) => elementsToWatch.includes(n))) {
43
+ this[decoratedFnName](addedNodes, removedNodes);
44
+ }
45
+ }
46
+ };
47
+ observer = new MutationObserver(callback);
48
+ observer.observe(this, { childList: true, subtree: true });
49
+ const elementsAdded = Array.from(this.querySelectorAll(querySelector)).concat(
50
+ Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])
51
+ );
52
+ this[decoratedFnName](Array.from(elementsAdded), []);
53
+ };
54
+ proto.disconnectedCallback = function() {
55
+ disconnectedCallback.call(this);
56
+ observer.disconnect();
57
+ };
58
+ };
59
+ }
60
+
61
+ export {
62
+ watch,
63
+ liveQuery
64
+ };
65
+ //# sourceMappingURL=chunk-NUXEGEMP.js.map
package/dist/chunk-NUXEGEMP.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/lib/decorators/watch.ts","../src/lib/decorators/live-query.ts"],"sourcesContent":["import type { LitElement } from 'lit';\n\ntype UpdateHandler = (prev?: unknown, next?: unknown) => void;\n\ntype NonUndefined<A> = A extends undefined ? never : A;\n\nexport type UpdateHandlerFunctionKeys<T extends object> = {\n [K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;\n}[keyof T];\n\ninterface WatchOptions {\n /**\n * If true, will only start watching after the initial update/render\n */\n waitUntilFirstUpdate?: boolean;\n}\n\n/**\n * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an\n * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the\n * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n *\n * Usage:\n *\n * @watch('propName')\n * handlePropChange(oldValue, newValue) {\n * ...\n * }\n */\nexport function watch(propertyName: string | string[], options?: WatchOptions) {\n const resolvedOptions: Required<WatchOptions> = {\n waitUntilFirstUpdate: false,\n ...options\n };\n return <ElemClass extends LitElement>(\n proto: ElemClass,\n decoratedFnName: UpdateHandlerFunctionKeys<ElemClass> | any\n ) => {\n // @ts-expect-error - update is a protected property\n const { update } = proto;\n const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];\n\n // @ts-expect-error - update is a protected property\n proto.update = function (this: ElemClass, changedProps: Map<keyof ElemClass, ElemClass[keyof ElemClass]>) {\n watchedProperties.forEach(property => {\n const key = property as keyof ElemClass;\n if (changedProps.has(key)) {\n const oldValue = changedProps.get(key);\n const newValue = this[key];\n\n if (oldValue !== newValue) {\n if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {\n (this[decoratedFnName] as unknown as UpdateHandler)(oldValue, newValue);\n }\n }\n }\n });\n\n update.call(this, changedProps);\n };\n };\n}\n","// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n// @watch('propName')\n// handlePropChange(oldValue, newValue) {\n// ...\n// }\n\nimport type { LitElement } from 'lit';\n\ntype UpdateHandler = (prev?: unknown, next?: unknown) => void;\n\ntype NonUndefined<A> = A extends undefined ? never : A;\n\ntype UpdateHandlerFunctionKeys<T extends object> = {\n [K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;\n}[keyof T];\n\ninterface LiveQueryOptions {\n /**\n * If true, will only start watching after the initial update/render\n */\n}\n\nexport function liveQuery(querySelector: string, _options?: LiveQueryOptions) {\n let observer: MutationObserver;\n // const resolvedOptions: Required<LiveQueryOptions> = {\n // ...options\n // };\n return <ElemClass extends LitElement>(\n proto: ElemClass,\n decoratedFnName: UpdateHandlerFunctionKeys<ElemClass>\n ): void => {\n const { connectedCallback, disconnectedCallback } = proto;\n\n proto.connectedCallback = function (this: ElemClass) {\n connectedCallback.call(this);\n const callback = (mutationList: MutationRecord[]) => {\n const elementsToWatch = Array.from(this.querySelectorAll(querySelector)).concat(\n Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])\n );\n for (const mutation of mutationList) {\n const addedNodes = Array.from(mutation.addedNodes).map(e => e as Element);\n const removedNodes = Array.from(mutation.addedNodes).map(e => e as Element);\n if (mutation.type === 'childList' && addedNodes.find(n => elementsToWatch.includes(n))) {\n (this[decoratedFnName] as unknown as UpdateHandler)(addedNodes, removedNodes);\n }\n }\n };\n observer = new MutationObserver(callback);\n observer.observe(this, { childList: true, subtree: true });\n\n const elementsAdded = Array.from(this.querySelectorAll(querySelector)).concat(\n Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])\n );\n (this[decoratedFnName] as unknown as UpdateHandler)(Array.from(elementsAdded), []);\n };\n\n proto.disconnectedCallback = function (this: ElemClass) {\n disconnectedCallback.call(this);\n observer.disconnect();\n };\n };\n}\n"],"mappings":";AA6BO,SAAS,MAAM,cAAiC,SAAwB;AAC7E,QAAM,kBAA0C;AAAA,IAC9C,sBAAsB;AAAA,IACtB,GAAG;AAAA,EACL;AACA,SAAO,CACL,OACA,oBACG;AAEH,UAAM,EAAE,OAAO,IAAI;AACnB,UAAM,oBAAoB,MAAM,QAAQ,YAAY,IAAI,eAAe,CAAC,YAAY;AAGpF,UAAM,SAAS,SAA2B,cAAgE;AACxG,wBAAkB,QAAQ,cAAY;AACpC,cAAM,MAAM;AACZ,YAAI,aAAa,IAAI,GAAG,GAAG;AACzB,gBAAM,WAAW,aAAa,IAAI,GAAG;AACrC,gBAAM,WAAW,KAAK,GAAG;AAEzB,cAAI,aAAa,UAAU;AACzB,gBAAI,CAAC,gBAAgB,wBAAwB,KAAK,YAAY;AAC5D,cAAC,KAAK,eAAe,EAA+B,UAAU,QAAQ;AAAA,YACxE;AAAA,UACF;AAAA,QACF;AAAA,MACF,CAAC;AAED,aAAO,KAAK,MAAM,YAAY;AAAA,IAChC;AAAA,EACF;AACF;;;AC/BO,SAAS,UAAU,eAAuB,UAA6B;AAC5E,MAAI;AAIJ,SAAO,CACL,OACA,oBACS;AACT,UAAM,EAAE,mBAAmB,qBAAqB,IAAI;AAEpD,UAAM,oBAAoB,WAA2B;AACnD,wBAAkB,KAAK,IAAI;AAC3B,YAAM,WAAW,CAAC,iBAAmC;AACnD,cAAM,kBAAkB,MAAM,KAAK,KAAK,iBAAiB,aAAa,CAAC,EAAE;AAAA,UACvE,MAAM,KAAK,KAAK,YAAY,iBAAiB,aAAa,KAAK,CAAC,CAAC;AAAA,QACnE;AACA,mBAAW,YAAY,cAAc;AACnC,gBAAM,aAAa,MAAM,KAAK,SAAS,UAAU,EAAE,IAAI,OAAK,CAAY;AACxE,gBAAM,eAAe,MAAM,KAAK,SAAS,UAAU,EAAE,IAAI,OAAK,CAAY;AAC1E,cAAI,SAAS,SAAS,eAAe,WAAW,KAAK,OAAK,gBAAgB,SAAS,CAAC,CAAC,GAAG;AACtF,YAAC,KAAK,eAAe,EAA+B,YAAY,YAAY;AAAA,UAC9E;AAAA,QACF;AAAA,MACF;AACA,iBAAW,IAAI,iBAAiB,QAAQ;AACxC,eAAS,QAAQ,MAAM,EAAE,WAAW,MAAM,SAAS,KAAK,CAAC;AAEzD,YAAM,gBAAgB,MAAM,KAAK,KAAK,iBAAiB,aAAa,CAAC,EAAE;AAAA,QACrE,MAAM,KAAK,KAAK,YAAY,iBAAiB,aAAa,KAAK,CAAC,CAAC;AAAA,MACnE;AACA,MAAC,KAAK,eAAe,EAA+B,MAAM,KAAK,aAAa,GAAG,CAAC,CAAC;AAAA,IACnF;AAEA,UAAM,uBAAuB,WAA2B;AACtD,2BAAqB,KAAK,IAAI;AAC9B,eAAS,WAAW;AAAA,IACtB;AAAA,EACF;AACF;","names":[]}