cognikit 0.2.0 → 1.0.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.
package/dist/client.js CHANGED
@@ -128,6 +128,7 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
128
128
 
129
129
  :host {
130
130
  display: inline-block;
131
+ container-type: size;
131
132
  --chip-color: rgb(var(--edu-first-accent));
132
133
  --chip-colored-color: #d1d1d1;
133
134
  }
@@ -135,20 +136,36 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
135
136
  :host([colored]) {
136
137
  & .chip-container { position: relative; }
137
138
 
139
+ & .content-zone {
140
+ border-color: color-mix(in srgb, var(--chip-colored-color) 55%, rgb(var(--edu-border)));
141
+ background:
142
+ linear-gradient(
143
+ 180deg,
144
+ color-mix(in srgb, var(--chip-colored-color) 18%, rgb(var(--edu-card))) 0%,
145
+ rgb(var(--edu-card)) 44%
146
+ );
147
+ box-shadow:
148
+ inset 0 4px 0 color-mix(in srgb, var(--chip-colored-color) 85%, white 15%),
149
+ 0 0 0 1px color-mix(in srgb, var(--chip-colored-color) 22%, transparent);
150
+ }
151
+
138
152
  & .chip-container::after {
139
153
  content: '';
140
154
  position: absolute;
141
- top: -2px;
142
- left: -2px;
143
- right: -2px;
144
- bottom: -2px;
155
+ top: 0.25rem;
156
+ left: 0.25rem;
157
+ right: 0.25rem;
158
+ height: 0.4rem;
145
159
  border-radius: 10px;
146
- background: var(--chip-colored-color);
147
- opacity: 0.18;
148
- mix-blend-mode: multiply;
160
+ background: color-mix(in srgb, var(--chip-colored-color) 90%, white 10%);
161
+ opacity: 0.95;
149
162
  z-index: 2;
150
163
  pointer-events: none;
151
164
  }
165
+
166
+ & .prefix {
167
+ color: color-mix(in srgb, var(--chip-colored-color) 82%, rgb(var(--edu-ink)));
168
+ }
152
169
  }
153
170
 
154
171
  :host([aria-disabled]) {
@@ -161,7 +178,8 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
161
178
  flex-direction: column;
162
179
  align-items: center;
163
180
  position: relative;
164
- width: 100%;height: 100%;
181
+ width: 100%;
182
+ height: 100%;
165
183
  }
166
184
 
167
185
  ::slotted(img.chip-image) {
@@ -195,8 +213,9 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
195
213
  border: 1px solid rgb(var(--edu-border));
196
214
  padding: 0.5rem 1rem;
197
215
  cursor: pointer;
198
- font-size: 1rem;
216
+ font-size: clamp(0.95rem, min(12cqi, 24cqb), 2.35rem);
199
217
  font-weight: 500;
218
+ line-height: 1.2;
200
219
  text-align: center;
201
220
  transition: all 0.2s ease;
202
221
  user-select: none;
@@ -234,6 +253,7 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
234
253
  align-items: center;
235
254
  justify-content: center;
236
255
  min-width: 0;
256
+ overflow-wrap: anywhere;
237
257
  }
238
258
 
239
259
  /* ==================== MODALITY ACTION BUTTON ==================== */
@@ -421,38 +441,45 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
421
441
  /* ==================== VARIANT: PLAYFUL ==================== */
422
442
 
423
443
  :host([variant="playful"]) .content-zone {
424
- background: var(--chip-color);
425
- color: rgb(var(--edu-inverted-ink));
426
- border-radius: 12px;
427
- border: none;
428
- box-shadow: 0 4px 12px rgb(var(--chip-color) / 0.3);
444
+ background:
445
+ linear-gradient(135deg, rgb(var(--edu-card)), rgb(var(--edu-muted) / 0.9));
446
+ color: rgb(var(--edu-ink));
447
+ border-radius: 14px;
448
+ border: 2px solid rgb(var(--edu-border));
449
+ box-shadow: 0 6px 14px rgb(var(--edu-shadow-color) / 0.12);
429
450
  font-weight: 600;
430
451
  }
431
452
 
432
453
  :host([variant="playful"]) .content-zone:hover:not([aria-disabled="true"]) {
433
- box-shadow: 0 6px 16px rgba(var(--chip-color), 0.4);
454
+ transform: translateY(-2px) rotate(-1deg);
455
+ border-color: rgb(var(--edu-first-accent) / 0.5);
456
+ box-shadow: 0 10px 22px rgb(var(--edu-shadow-color) / 0.18);
434
457
  }
435
458
 
436
459
  :host([variant="playful"]) .content-zone:active:not([aria-disabled="true"]) {
460
+ transform: translateY(0) rotate(0deg);
437
461
  }
438
462
 
439
463
  :host([variant="playful"]) .prefix {
440
- color: rgb(var(--edu-inverted-ink));
441
- opacity: 0.9;
464
+ color: var(--chip-color);
465
+ opacity: 1;
442
466
  }
443
467
 
444
468
  :host([variant="playful"]) .modality-action {
445
- background: rgb(var(--edu-card));
446
- color: var(--chip-color);
469
+ background: var(--chip-color);
470
+ color: rgb(var(--edu-inverted-ink));
447
471
  }
448
472
 
449
473
  :host([variant="playful"][selected]) .content-zone {
450
- box-shadow: 0 0 0 3px rgb(var(--edu-first-accent) / 0.4), 0 6px 16px rgb(var(--edu-first-accent) / 0.4);
474
+ background:
475
+ linear-gradient(135deg, rgb(var(--edu-card)), rgb(var(--edu-muted)));
476
+ border-color: var(--chip-color);
477
+ box-shadow: 0 0 0 3px rgb(var(--chip-color) / 0.22), 0 10px 22px rgb(var(--edu-shadow-color) / 0.16);
451
478
  }
452
479
 
453
480
  :host([variant="playful"]) ::slotted(img.chip-image) {
454
- border: 4px solid rgb(var(--edu-border) / 0.6);
455
- border-radius: 4px;
481
+ border: 3px solid rgb(var(--edu-border) / 0.6);
482
+ border-radius: 8px;
456
483
  }
457
484
 
458
485
 
@@ -517,7 +544,6 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
517
544
  border-radius: 2px;
518
545
  background: rgb(var(--edu-card));
519
546
  color: rgb(var(--edu-ink));
520
- font-size: 0.95rem;
521
547
  letter-spacing: 0.5px;
522
548
  }
523
549
 
@@ -545,82 +571,88 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
545
571
  /* ==================== VARIANT: MINIMAL ==================== */
546
572
 
547
573
  :host([variant="minimal"]) .content-zone {
548
- background: rgb(var(--edu-card));
574
+ background: transparent;
549
575
  border: 1px solid rgb(var(--edu-border));
550
- border-radius: 6px;
551
- color: rgb(var(--edu-ink));
552
- padding: 0.4rem 0.75rem;
553
- font-size: 0.9rem;
576
+ border-radius: 10px;
577
+ color: rgb(var(--edu-second-ink));
578
+ padding: 0.45rem 0.85rem;
554
579
  }
555
580
 
556
581
  :host([variant="minimal"]) .content-zone:hover:not([aria-disabled="true"]) {
557
- border-color: rgba(var(--chip-color), 0.5);
558
- box-shadow: 0 1px 4px rgba(var(--edu-shadow-color), 0.1);
582
+ background: rgb(var(--edu-card) / 0.8);
583
+ color: rgb(var(--edu-ink));
584
+ border-color: rgb(var(--edu-first-accent) / 0.35);
585
+ box-shadow: 0 4px 12px rgba(var(--edu-shadow-color), 0.08);
559
586
  }
560
587
 
561
588
  :host([variant="minimal"][selected]) .content-zone {
562
589
  border-color: var(--chip-color);
563
590
  background: rgba(var(--chip-color), 0.08);
591
+ color: rgb(var(--edu-ink));
564
592
  }
565
593
 
566
594
  /* ==================== VARIANT: GLASS ==================== */
567
595
 
568
596
  :host([variant="glass"]) .content-zone {
569
- background: rgb(var(--edu-card));
570
- border: 2px solid rgb(var(--edu-border));
571
- border-radius: 0;
597
+ background: rgb(var(--edu-card) / 0.65);
598
+ backdrop-filter: blur(10px);
599
+ border: 1px solid rgb(var(--edu-border) / 0.6);
600
+ border-radius: 14px;
572
601
  color: rgb(var(--edu-ink));
573
- padding: 0.5rem 1.2rem;
574
- font-weight: 700;
575
- letter-spacing: 1.5px;
576
- font-size: 0.9rem;
602
+ padding: 0.5rem 1rem;
603
+ font-weight: 600;
604
+ letter-spacing: 0.03em;
605
+ box-shadow: inset 0 1px 0 rgb(var(--edu-card) / 0.8), 0 8px 20px rgb(var(--edu-shadow-color) / 0.12);
577
606
  }
578
607
 
579
608
  :host([variant="glass"]) .content-zone:hover:not([aria-disabled="true"]) {
580
- background: var(--chip-color);
581
- color: rgb(var(--edu-inverted-ink));
582
- border-color: var(--chip-color);
609
+ background: rgb(var(--edu-card) / 0.78);
610
+ border-color: rgb(var(--edu-first-accent) / 0.45);
611
+ box-shadow: inset 0 1px 0 rgb(var(--edu-card) / 0.9), 0 12px 24px rgb(var(--edu-shadow-color) / 0.16);
583
612
  }
584
613
 
585
614
  :host([variant="glass"]) .content-zone:active:not([aria-disabled="true"]) {
586
- background: rgba(var(--chip-color), 0.9);
615
+ background: rgb(var(--edu-card) / 0.88);
587
616
  }
588
617
 
589
618
  :host([variant="glass"]) .prefix {
590
- font-weight: 800;
619
+ font-weight: 700;
620
+ color: rgb(var(--edu-first-accent));
591
621
  }
592
622
 
593
623
  :host([variant="glass"][selected]) .content-zone {
594
624
  background: rgba(var(--chip-color), 0.15);
595
625
  border-color: var(--chip-color);
596
- box-shadow: 0 0 0 2px rgba(var(--chip-color), 0.3);
626
+ box-shadow: 0 0 0 2px rgba(var(--chip-color), 0.24), inset 0 1px 0 rgb(var(--edu-card) / 0.85);
597
627
  }
598
628
 
599
629
  /* ==================== VARIANT: CARD ==================== */
600
630
 
601
631
  :host([variant="card"]) .content-zone {
602
- background: transparent;
603
- border: 2px solid rgb(var(--edu-border));
604
- border-radius: 4px;
632
+ background: rgb(var(--edu-card));
633
+ border: 1px solid rgb(var(--edu-border));
634
+ border-radius: 12px;
605
635
  color: rgb(var(--edu-ink));
636
+ box-shadow: 0 8px 18px rgb(var(--edu-shadow-color) / 0.1);
606
637
  }
607
638
 
608
639
  :host([variant="card"]) .content-zone:hover:not([aria-disabled="true"]) {
609
- background: rgb(var(--edu-muted));
610
- border-color: var(--chip-color);
640
+ background: linear-gradient(180deg, rgb(var(--edu-card)), rgb(var(--edu-muted) / 0.8));
641
+ border-color: rgb(var(--edu-first-accent) / 0.35);
642
+ box-shadow: 0 12px 24px rgb(var(--edu-shadow-color) / 0.14);
611
643
  }
612
644
 
613
645
  :host([variant="card"]) .content-zone:active:not([aria-disabled="true"]) {
614
- background: rgb(var(--edu-border));
646
+ transform: translateY(1px);
615
647
  }
616
648
 
617
649
  :host([variant="card"]) .prefix {
618
- color: var(--chip-color);
650
+ color: rgb(var(--edu-third-ink));
619
651
  }
620
652
 
621
653
  :host([variant="card"][selected]) .content-zone {
622
654
  border-color: var(--chip-color);
623
- box-shadow: 0 0 0 3px rgba(var(--chip-color), 0.2);
655
+ box-shadow: 0 0 0 3px rgba(var(--chip-color), 0.18), 0 12px 24px rgb(var(--edu-shadow-color) / 0.12);
624
656
  }
625
657
 
626
658
  /* ==================== VARIANT: SIGN ==================== */
@@ -630,9 +662,8 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
630
662
  border-radius: 0;
631
663
  color: rgb(var(--edu-ink));
632
664
  padding: 0.5rem 1.2rem;
633
- font-size: 0.9rem;
634
665
  font-weight: bold;
635
- transform: skewX(-10deg);
666
+ transform: skewX(-3deg);
636
667
  text-transform: uppercase;
637
668
  letter-spacing: 0.2rem;
638
669
  }
@@ -891,16 +922,17 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
891
922
  }
892
923
 
893
924
  .block[variant="playful"] {
894
- background: var(--accent-color);
895
- border: none;
896
- color: rgb(var(--edu-inverted-ink));
925
+ background: linear-gradient(135deg, rgb(var(--edu-card)), rgb(var(--edu-muted) / 0.92));
926
+ border: 2px solid rgb(var(--edu-border));
927
+ color: rgb(var(--edu-ink));
897
928
  border-radius: 16px;
898
- box-shadow: 2px 2px 0px rgba(var(--edu-shadow-color) / 0.2);
929
+ box-shadow: 0 6px 14px rgb(var(--edu-shadow-color) / 0.12);
899
930
  }
900
931
 
901
932
  .block[variant="playful"]:hover {
902
- transform: translateY(-2px) rotate(-2deg);
903
- box-shadow: 0 6px 16px rgba(var(--edu-first-accent), 0.4);
933
+ transform: translateY(-2px) rotate(-1deg);
934
+ border-color: color-mix(in srgb, var(--accent-color) 38%, rgb(var(--edu-border)));
935
+ box-shadow: 0 10px 22px rgb(var(--edu-shadow-color) / 0.18);
904
936
  }
905
937
 
906
938
  .block[variant="outline"] {
@@ -931,40 +963,45 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
931
963
  }
932
964
 
933
965
  .block[variant="minimal"] {
934
- background: rgb(var(--edu-card));
935
- color: rgb(var(--edu-ink));
966
+ background: transparent;
967
+ color: rgb(var(--edu-second-ink));
936
968
  border: 1px solid rgb(var(--edu-border));
937
- border-radius: 6px;
969
+ border-radius: 10px;
938
970
  padding: 0.75rem;
939
971
  }
940
972
 
941
973
  .block[variant="minimal"]:hover {
942
- border-color: rgb(var(--edu-first-accent) / 0.5);
943
- box-shadow: 0 1px 4px rgba(var(--edu-shadow-color), 0.1);
974
+ background: rgb(var(--edu-card) / 0.8);
975
+ color: rgb(var(--edu-ink));
976
+ border-color: rgb(var(--edu-first-accent) / 0.35);
977
+ box-shadow: 0 4px 12px rgba(var(--edu-shadow-color), 0.08);
944
978
  }
945
979
 
946
980
  .block[variant="glass"] {
947
981
  background: rgba(var(--edu-card), 0.7);
948
982
  backdrop-filter: blur(10px);
949
- border: 2px solid rgba(var(--edu-border), 0.35);
950
- border-radius: 12px;
983
+ border: 1px solid rgba(var(--edu-border), 0.45);
984
+ border-radius: 14px;
985
+ box-shadow: inset 0 1px 0 rgb(var(--edu-card) / 0.85), 0 8px 20px rgba(var(--edu-shadow-color), 0.12);
951
986
  }
952
987
 
953
988
  .block[variant="glass"]:hover {
954
- background: rgba(var(--edu-card), 0.85);
955
- border-color: rgba(var(--edu-first-accent), 0.5);
989
+ background: rgba(var(--edu-card), 0.82);
990
+ border-color: rgba(var(--edu-first-accent), 0.4);
991
+ box-shadow: inset 0 1px 0 rgb(var(--edu-card) / 0.95), 0 12px 24px rgba(var(--edu-shadow-color), 0.16);
956
992
  }
957
993
 
958
994
  .block[variant="card"] {
959
995
  background: rgb(var(--edu-card));
960
- border: 2px solid rgb(var(--edu-border));
961
- border-radius: 8px;
962
- box-shadow: 0 2px 8px rgba(var(--edu-shadow-color), 0.08);
996
+ border: 1px solid rgb(var(--edu-border));
997
+ border-radius: 12px;
998
+ box-shadow: 0 8px 18px rgba(var(--edu-shadow-color), 0.1);
963
999
  }
964
1000
 
965
1001
  .block[variant="card"]:hover {
966
- border-color: rgb(var(--edu-first-accent));
967
- box-shadow: 0 4px 12px rgba(var(--edu-shadow-color), 0.12);
1002
+ background: linear-gradient(180deg, rgb(var(--edu-card)), rgb(var(--edu-muted) / 0.8));
1003
+ border-color: rgb(var(--edu-first-accent) / 0.35);
1004
+ box-shadow: 0 12px 24px rgba(var(--edu-shadow-color), 0.14);
968
1005
  }
969
1006
 
970
1007
  .block[variant="sign"] {
@@ -980,7 +1017,7 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
980
1017
 
981
1018
  .block[variant="sign"]:hover {
982
1019
  border-color: var(--accent-color);
983
- background: var(accent-color);
1020
+ background: rgb(var(--edu-muted));
984
1021
  }
985
1022
 
986
1023
  .block[variant="empty"] {
@@ -1033,10 +1070,10 @@ ${Object.entries(e).map(([n,t])=>` ${n}: ${t};`).join(`
1033
1070
  `+e.slice(a+1):l+=e.slice(i),l.slice(1)}function _o(e){for(var n="",t=0,r,i=0;i<e.length;t>=65536?i+=2:i++)t=me(e,i),r=A[t],!r&&xe(t)?(n+=e[i],t>=65536&&(n+=e[i+1])):n+=r||wo(t);return n}function Io(e,n,t){var r="",i=e.tag,o,a,s;for(o=0,a=t.length;o<a;o+=1)s=t[o],e.replacer&&(s=e.replacer.call(t,String(o),s)),(z(e,n,s,!1,!1)||typeof s>"u"&&z(e,n,null,!1,!1))&&(r!==""&&(r+=","+(e.condenseFlow?"":" ")),r+=e.dump);e.tag=i,e.dump="["+r+"]"}function Ft(e,n,t,r){var i="",o=e.tag,a,s,l;for(a=0,s=t.length;a<s;a+=1)l=t[a],e.replacer&&(l=e.replacer.call(t,String(a),l)),(z(e,n+1,l,!0,!0,!1,!0)||typeof l>"u"&&z(e,n+1,null,!0,!0,!1,!0))&&((!r||i!=="")&&(i+=lt(e,n)),e.dump&&be===e.dump.charCodeAt(0)?i+="-":i+="- ",i+=e.dump);e.tag=o,e.dump=i||"[]"}function Mo(e,n,t){var r="",i=e.tag,o=Object.keys(t),a,s,l,c,d;for(a=0,s=o.length;a<s;a+=1)d="",r!==""&&(d+=", "),e.condenseFlow&&(d+='"'),l=o[a],c=t[l],e.replacer&&(c=e.replacer.call(t,l,c)),z(e,n,l,!1,!1)&&(e.dump.length>1024&&(d+="? "),d+=e.dump+(e.condenseFlow?'"':"")+":"+(e.condenseFlow?"":" "),z(e,n,c,!1,!1)&&(d+=e.dump,r+=d));e.tag=i,e.dump="{"+r+"}"}function Lo(e,n,t,r){var i="",o=e.tag,a=Object.keys(t),s,l,c,d,u,p;if(e.sortKeys===!0)a.sort();else if(typeof e.sortKeys=="function")a.sort(e.sortKeys);else if(e.sortKeys)throw new _("sortKeys must be a boolean or a function");for(s=0,l=a.length;s<l;s+=1)p="",(!r||i!=="")&&(p+=lt(e,n)),c=a[s],d=t[c],e.replacer&&(d=e.replacer.call(t,c,d)),z(e,n+1,c,!0,!0,!0)&&(u=e.tag!==null&&e.tag!=="?"||e.dump&&e.dump.length>1024,u&&(e.dump&&be===e.dump.charCodeAt(0)?p+="?":p+="? "),p+=e.dump,u&&(p+=lt(e,n)),z(e,n+1,d,!0,u)&&(e.dump&&be===e.dump.charCodeAt(0)?p+=":":p+=": ",p+=e.dump,i+=p));e.tag=o,e.dump=i||"{}"}function jt(e,n,t){var r,i,o,a,s,l;for(i=t?e.explicitTypes:e.implicitTypes,o=0,a=i.length;o<a;o+=1)if(s=i[o],(s.instanceOf||s.predicate)&&(!s.instanceOf||typeof n=="object"&&n instanceof s.instanceOf)&&(!s.predicate||s.predicate(n))){if(t?s.multi&&s.representName?e.tag=s.representName(n):e.tag=s.tag:e.tag="?",s.represent){if(l=e.styleMap[s.tag]||s.defaultStyle,Cr.call(s.represent)==="[object Function]")r=s.represent(n,l);else if(kr.call(s.represent,l))r=s.represent[l](n,l);else throw new _("!<"+s.tag+'> tag resolver accepts not "'+l+'" style');e.dump=r}return!0}return!1}function z(e,n,t,r,i,o,a){e.tag=null,e.dump=t,jt(e,t,!1)||jt(e,t,!0);var s=Cr.call(e.dump),l=r,c;r&&(r=e.flowLevel<0||e.flowLevel>n);var d=s==="[object Object]"||s==="[object Array]",u,p;if(d&&(u=e.duplicates.indexOf(t),p=u!==-1),(e.tag!==null&&e.tag!=="?"||p||e.indent!==2&&n>0)&&(i=!1),p&&e.usedDuplicates[u])e.dump="*ref_"+u;else{if(d&&p&&!e.usedDuplicates[u]&&(e.usedDuplicates[u]=!0),s==="[object Object]")r&&Object.keys(e.dump).length!==0?(Lo(e,n,e.dump,i),p&&(e.dump="&ref_"+u+e.dump)):(Mo(e,n,e.dump),p&&(e.dump="&ref_"+u+" "+e.dump));else if(s==="[object Array]")r&&e.dump.length!==0?(e.noArrayIndent&&!a&&n>0?Ft(e,n-1,e.dump,i):Ft(e,n,e.dump,i),p&&(e.dump="&ref_"+u+e.dump)):(Io(e,n,e.dump),p&&(e.dump="&ref_"+u+" "+e.dump));else if(s==="[object String]")e.tag!=="?"&&$o(e,e.dump,n,o,l);else{if(s==="[object Undefined]")return!1;if(e.skipInvalid)return!1;throw new _("unacceptable kind of an object to dump "+s)}e.tag!==null&&e.tag!=="?"&&(c=encodeURI(e.tag[0]==="!"?e.tag.slice(1):e.tag).replace(/!/g,"%21"),e.tag[0]==="!"?c="!"+c:c.slice(0,18)==="tag:yaml.org,2002:"?c="!!"+c.slice(18):c="!<"+c+">",e.dump=c+" "+e.dump)}return!0}function Do(e,n){var t=[],r=[],i,o;for(dt(e,t,r),i=0,o=r.length;i<o;i+=1)n.duplicates.push(t[r[i]]);n.usedDuplicates=new Array(o)}function dt(e,n,t){var r,i,o;if(e!==null&&typeof e=="object")if(i=n.indexOf(e),i!==-1)t.indexOf(i)===-1&&t.push(i);else if(n.push(e),Array.isArray(e))for(i=0,o=e.length;i<o;i+=1)dt(e[i],n,t);else for(r=Object.keys(e),i=0,o=r.length;i<o;i+=1)dt(e[r[i]],n,t)}function Ro(e,n){n=n||{};var t=new Eo(n);t.noRefs||Do(e,t);var r=e;return t.replacer&&(r=t.replacer.call({"":r},"",r)),z(t,0,r,!0,!0)?t.dump+`
1034
1071
  `:""}var Po=Ro,Bo={dump:Po};function ft(e,n){return function(){throw new Error("Function yaml."+e+" is removed in js-yaml 4. Use yaml."+n+" instead, which is now safe by default.")}}var qo=$,zo=Kt,Ho=Xt,No=ir,Go=nr,Oo=pt,Vo=Er.load,Fo=Er.loadAll,jo=Bo.dump,Uo=_,Yo={binary:cr,float:rr,map:Zt,null:Jt,pairs:ur,set:pr,timestamp:sr,bool:er,int:tr,merge:lr,omap:dr,seq:Qt,str:Wt},Ko=ft("safeLoad","load"),Wo=ft("safeLoadAll","loadAll"),Qo=ft("safeDump","dump"),Rr={Type:qo,Schema:zo,FAILSAFE_SCHEMA:Ho,JSON_SCHEMA:No,CORE_SCHEMA:Go,DEFAULT_SCHEMA:Oo,load:Vo,loadAll:Fo,dump:jo,YAMLException:Uo,types:Yo,safeLoad:Ko,safeLoadAll:Wo,safeDump:Qo};var U=["#10b981","#f59e0b","#06b6d4","#ec4899","#8b5cf6","#3b82f6","#f43f5e","#84cc16","#a855f7","#6366f1"];function T(e){let n=e.length,t;for(;n!==0;)t=Math.floor(Math.random()*n),n--,[e[n],e[t]]=[e[t],e[n]];return e}var P=(e,n=0)=>{let t=3735928559^n,r=1103547991^n;for(let i=0,o;i<e.length;i++)o=e.charCodeAt(i),t=Math.imul(t^o,265443561),r=Math.imul(r^o,159334677);return t=Math.imul(t^r>>>16,2246822507)^Math.imul(r^r>>>13,3266489909),r=Math.imul(r^r>>>16,2246822507)^Math.imul(t^t>>>13,3266489909),(4294967296*(2009751&r)+(t>>>0)).toString()};function C(e){return e.replace(/[&<>"']/g,n=>n==="&"?"&amp;":n==="<"?"&lt;":n===">"?"&gt;":n==='"'?"&quot;":"&#39;")}function Zo(e){try{return Rr.load(e)}catch(n){throw new Error(`Invalid YAML assets:
1035
1072
  ${n instanceof Error?n.message:String(n)}`)}}function M(e){return typeof e=="string"}function bt(e){return typeof e=="number"}function vt(e){return/^(\d{1,2}:)?\d{1,2}:\d{2}$/.test(e)}function Pr(e){return e===null?"null":Array.isArray(e)?"array":typeof e}function Ye(e){return typeof e=="object"&&e!==null&&(Object.getPrototypeOf(e)===Object.prototype||Object.getPrototypeOf(e)===null)}function Y(e){return e.split("|").map(n=>n.trim()).filter(Boolean)}var ee=e=>[...new Set(e)];var we=class extends Error{constructor(n){super(`Asset validation failed:n- ${n.join(`
1036
- - `)}`),this.name="AssetValidationError",this.issues=n}};function Xo(e){let n=[];if(!Ye(e))throw new we(["Top-level assets must be an object/map like { mango: {...}, trend: {...} }"]);let t=e,r={};for(let[o,a]of Object.entries(t)){if(!o||typeof o!="string"){n.push(`Asset key must be a non-empty string (got: ${String(o)})`);continue}if(/^[a-zA-Z0-9._-]+$/.test(o)||n.push(`Asset id "${o}" has invalid chars; use letters/numbers/._-`),!Ye(a)){n.push(`Asset "${o}" must be an object (got: ${Pr(a)})`);continue}let s=a,l=s.type,c=!!s.dialog;if(!M(l)){n.push(`Asset "${o}" missing string field "type"`);continue}if(!Jo(l)){n.push(`Asset "${o}" has unsupported type "${l}" (use image|video|audio|html)`);continue}switch(l){case"image":{let d=s.url;M(d)||n.push(`Asset "${o}" (image) missing "url"`);let u=s.size;u!==void 0&&!M(u)&&n.push(`Asset "${o}" (image) field "size" must be a string`),M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...M(u)?{size:u}:{}});break}case"video":{let d=s.url;M(d)||n.push(`Asset "${o}" (video) missing "url"`);let u=s.span,p;if(u!==void 0)if(!Ye(u))n.push(`Asset "${o}" (video) field "span" must be an object`);else{let h=u.from,g=u.to;!M(h)||!M(g)?n.push(`Asset "${o}" (video) span requires string "from" and "to"`):((!vt(h)||!vt(g))&&n.push(`Asset "${o}" (video) span times should look like "02:15" or "01:02:45"`),p={from:h,to:g})}M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...p?{span:p}:{}});break}case"audio":{let d=s.url;M(d)||n.push(`Asset "${o}" (audio) missing "url"`);let u=s.volume;u!==void 0&&(!bt(u)||!Number.isFinite(u)?n.push(`Asset "${o}" (audio) field "volume" must be a number`):(u<0||u>100)&&n.push(`Asset "${o}" (audio) field "volume" must be between 0 and 100`)),M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...bt(u)?{volume:u}:{}});break}case"html":{let d=s.content;if(!M(d)){n.push(`Asset "${o}" (html) missing string field "content"`);break}r[o]={id:o,type:l,dialog:c,content:d};break}case"tts":{let d=s.content;if(!M(d)){n.push(`Asset "${o}" (tts) missing string field "content"`);break}r[o]={id:o,type:l,dialog:c,content:d};break}}}if(n.length)throw new we(n);let i=Object.keys(r).sort((o,a)=>o.localeCompare(a)).map(o=>r[o]);return{assetsById:r,assetsList:i}}function Jo(e){return e==="image"||e==="video"||e==="audio"||e==="html"}function ye(e,n,t){let r=0,i=0;return e.forEach(a=>{a.items.forEach(s=>{i++;let l=n.get(s),c=t.querySelector(`[data-label="${s}"]`);l===a.label?(r++,c.chipState="correct"):c.chipState="wrong"})}),{score:i>0?Math.round(r/i*100):0,correct:r,total:i}}var Ee=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="static";this.categories=["none"];this.allItems=[];this.categoryColors=["#94a3b8","#3b82f6","#10b981","#f59e0b","#ef4444","#8b5cf6","#ec4899","#14b8a6","#f97316","#6366f1"];this.currentColor=this.categoryColors[0];this.data.categories.forEach(({label:o,items:a})=>{this.categories.push(o),this.allItems.push(...a)}),this.currentCategory=this.categories[0],this.data.distractors&&this.allItems.push(...this.data.distractors),this.allItems=T(this.allItems),this.categorized=new Map,this.initializeProgress(this.allItems.length)}initialize(){}cleanup(){}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)})}render(){this.innerHTML=`
1073
+ - `)}`),this.name="AssetValidationError",this.issues=n}};function Xo(e){let n=[];if(!Ye(e))throw new we(["Top-level assets must be an object/map like { mango: {...}, trend: {...} }"]);let t=e,r={};for(let[o,a]of Object.entries(t)){if(!o||typeof o!="string"){n.push(`Asset key must be a non-empty string (got: ${String(o)})`);continue}if(/^[a-zA-Z0-9._-]+$/.test(o)||n.push(`Asset id "${o}" has invalid chars; use letters/numbers/._-`),!Ye(a)){n.push(`Asset "${o}" must be an object (got: ${Pr(a)})`);continue}let s=a,l=s.type,c=!!s.dialog;if(!M(l)){n.push(`Asset "${o}" missing string field "type"`);continue}if(!Jo(l)){n.push(`Asset "${o}" has unsupported type "${l}" (use image|video|audio|html)`);continue}switch(l){case"image":{let d=s.url;M(d)||n.push(`Asset "${o}" (image) missing "url"`);let u=s.size;u!==void 0&&!M(u)&&n.push(`Asset "${o}" (image) field "size" must be a string`),M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...M(u)?{size:u}:{}});break}case"video":{let d=s.url;M(d)||n.push(`Asset "${o}" (video) missing "url"`);let u=s.span,p;if(u!==void 0)if(!Ye(u))n.push(`Asset "${o}" (video) field "span" must be an object`);else{let h=u.from,g=u.to;!M(h)||!M(g)?n.push(`Asset "${o}" (video) span requires string "from" and "to"`):((!vt(h)||!vt(g))&&n.push(`Asset "${o}" (video) span times should look like "02:15" or "01:02:45"`),p={from:h,to:g})}M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...p?{span:p}:{}});break}case"audio":{let d=s.url;M(d)||n.push(`Asset "${o}" (audio) missing "url"`);let u=s.volume;u!==void 0&&(!bt(u)||!Number.isFinite(u)?n.push(`Asset "${o}" (audio) field "volume" must be a number`):(u<0||u>100)&&n.push(`Asset "${o}" (audio) field "volume" must be between 0 and 100`)),M(d)&&(r[o]={id:o,type:l,dialog:c,url:d,...bt(u)?{volume:u}:{}});break}case"html":{let d=s.content;if(!M(d)){n.push(`Asset "${o}" (html) missing string field "content"`);break}r[o]={id:o,type:l,dialog:c,content:d};break}case"tts":{let d=s.content;if(!M(d)){n.push(`Asset "${o}" (tts) missing string field "content"`);break}r[o]={id:o,type:l,dialog:c,content:d};break}}}if(n.length)throw new we(n);let i=Object.keys(r).sort((o,a)=>o.localeCompare(a)).map(o=>r[o]);return{assetsById:r,assetsList:i}}function Jo(e){return e==="image"||e==="video"||e==="audio"||e==="html"}function ye(e,n,t,r){let i=0,o=0;return e.forEach(s=>{s.items.forEach(l=>{o++;let c=n.get(l),d=t.querySelector(`[data-label="${l}"]`);c===s.label?(i++,d.chipState="correct"):d.chipState="wrong"})}),r&&r.forEach(s=>{o++;let l=n.get(s),c=t.querySelector(`[data-label="${s}"]`);l==="Invalid"?(i++,c.chipState="correct"):c.chipState="wrong"}),{score:o>0?Math.round(i/o*100):0,correct:i,total:o}}var Ee=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="static";this.categories=[];this.allItems=[];this.categoryColors=["#6366f1","#3b82f6","#10b981","#f59e0b","#ef4444","#8b5cf6","#ec4899","#14b8a6","#f97316","#94a3b8"];this.currentColor=this.categoryColors[0];this.data.categories.forEach(({label:o,items:a})=>{this.categories.push(o),this.allItems.push(...a)}),this.currentCategory=this.categories[0],this.data.distractors&&(this.allItems.push(...this.data.distractors),this.categories.push("Invalid")),this.allItems=T(this.allItems),this.categorized=new Map,this.initializeProgress(this.allItems.length)}initialize(){}cleanup(){}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)})}render(){this.innerHTML=`
1037
1074
  <style>
1038
1075
  open-classification {
1039
- --current-color: #94a3b8;
1076
+ --current-color: #aa94b8;
1040
1077
  display: flex;
1041
1078
  width: 100%;
1042
1079
  height: 100%;
@@ -1081,7 +1118,7 @@ ${n instanceof Error?n.message:String(n)}`)}}function M(e){return typeof e=="str
1081
1118
  .items-container {
1082
1119
  display: grid;
1083
1120
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
1084
- grid-auto-rows: minmax(44px, 1fr);
1121
+ grid-auto-rows: minmax(clamp(56px, 12cqh, 88px), 1fr);
1085
1122
  gap: clamp(0.5rem, min(1.6cqw, 1.6cqh), 1rem);
1086
1123
  padding: clamp(0.5rem, min(1.6cqw, 1.6cqh), 1.25rem);
1087
1124
  background: rgb(var(--edu-muted));
@@ -1193,7 +1230,7 @@ ${n instanceof Error?n.message:String(n)}`)}}function M(e){return typeof e=="str
1193
1230
  </div>
1194
1231
  `,this.style.setProperty("--current-color",this.currentColor),this.$categoriesBar=this.querySelector("#categories-bar"),this.setCategories(this.$categoriesBar);let t=this.querySelector(".items-container");this.setItems(t)}setItems(t){this.allItems.forEach((r,i)=>{let o=document.createElement("edu-chip");o.variant=this.config.variant,o.dataset.label=r,D(r,o,this.assets?.assetsById),o.addEventListener("click",a=>{let s=a.currentTarget,l=s.dataset.label;if(this.categorized.get(l)===this.currentCategory){this.categorized.delete(l),s.colored=!1,this.decrementProgress(),this.emitStateChange();return}this.categorized.has(l)||this.incrementProgress(),this.categorized.set(l,this.currentCategory),s.color=this.currentColor,s.colored=!0,this.emitStateChange()}),t.append(o)})}setCategories(t){this.categories.forEach((r,i)=>{let o=new V;o.variant=this.config.variant;let a=this.categoryColors[i%this.categoryColors.length];o.dataset.category=r,o.dataset.color=a,o.style.setProperty("--category-color",a),o.innerHTML=`
1195
1232
  <div class="category-label">${r}</div>
1196
- `,o.addEventListener("click",s=>{let l=s.currentTarget;this.currentCategory=l.dataset.category,this.currentColor=l.dataset.color,this.style.setProperty("--current-color",this.currentColor),t.querySelectorAll("edu-block").forEach(c=>c.classList.remove("active")),o.classList.add("active")}),r===this.currentCategory&&o.classList.add("active"),t.append(o)})}getCurrentState(){return{categorized:Object.fromEntries(this.categorized),progress:this.progressTracker.current}}isInteractionComplete(){if(this.categorized.size!==this.allItems.length)return!1;for(let t of this.categorized.values())if(t==null)return!1;return!0}onHint(){let t=this.allItems.filter(i=>!this.categorized.has(i));if(t.length===0){alert('All items are categorized! Click "Check" to submit.'),this.emitHintShown("All items categorized");return}let r=t[0];alert(`Hint: You haven't categorized "${r}" yet. Which category does it belong to?`),this.emitHintShown(`Uncategorized item: ${r}`)}submit(){super.submit();let t=ye(this.data.categories,this.categorized,this);console.log(`Classification Score: ${t.score.toFixed(1)}% (${t.correct}/${t.total} correct)`),this.dispatchEvent(new CustomEvent("interaction:graded",{detail:{result:t},bubbles:!0,composed:!0})),this.setAttribute("inert","")}reset(){super.reset(),this.categorized.clear(),this.querySelectorAll("edu-chip").forEach(t=>{t.classList.remove("colorized"),t.style.setProperty("--current-color","")})}};customElements.get("open-classification")||customElements.define("open-classification",Ee);var Ce=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="automatic-sequencing";this.categories=[];this.allItems=[];this.categorized=new Map;this.zones=[];this.chips=[];this.activeChip=null;this.currentZone=null;this.isDragging=!1;this.startX=0;this.startY=0;this.offsetX=0;this.offsetY=0;this.data.categories.forEach(({label:o,items:a})=>{this.categories.push(o),this.allItems.push(...a)}),this.data.distractors&&console.warn("Found a distractor in a Sequential Classification interaction, those are not useful and will be ignored"),this.allItems=this.config.shuffle?T(this.allItems):this.allItems,this.initializeProgress(this.allItems.length),this.boundPointerMove=this.handlePointerMove.bind(this),this.boundPointerUp=this.handlePointerUp.bind(this),this.variant=this.config.variant}initialize(){window.addEventListener("pointermove",this.boundPointerMove),window.addEventListener("pointerup",this.boundPointerUp)}cleanup(){window.removeEventListener("pointermove",this.boundPointerMove),window.removeEventListener("pointerup",this.boundPointerUp)}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}render(){let t=Math.min(this.categories.length,4);this.innerHTML=`
1233
+ `,o.addEventListener("click",s=>{let l=s.currentTarget;this.currentCategory=l.dataset.category,this.currentColor=l.dataset.color,this.style.setProperty("--current-color",this.currentColor),t.querySelectorAll("edu-block").forEach(c=>c.classList.remove("active")),o.classList.add("active")}),r===this.currentCategory&&o.classList.add("active"),t.append(o)})}getCurrentState(){return{categorized:Object.fromEntries(this.categorized),progress:this.progressTracker.current}}isInteractionComplete(){if(this.categorized.size!==this.allItems.length)return!1;for(let t of this.categorized.values())if(t==null)return!1;return!0}onHint(){let t=this.allItems.filter(i=>!this.categorized.has(i));if(t.length===0){alert('All items are categorized! Click "Check" to submit.'),this.emitHintShown("All items categorized");return}let r=t[0];alert(`Hint: You haven't categorized "${r}" yet. Which category does it belong to?`),this.emitHintShown(`Uncategorized item: ${r}`)}submit(){super.submit();let t=ye(this.data.categories,this.categorized,this,this.data.distractors);console.log(`Classification Score: ${t.score.toFixed(1)}% (${t.correct}/${t.total} correct)`),this.dispatchEvent(new CustomEvent("interaction:graded",{detail:{result:t},bubbles:!0,composed:!0}))}reset(){super.reset(),this.categorized.clear(),this.querySelectorAll("edu-chip").forEach(t=>{t.classList.remove("colorized"),t.style.setProperty("--current-color","")})}};customElements.get("open-classification")||customElements.define("open-classification",Ee);var Ce=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="automatic-sequencing";this.categories=[];this.allItems=[];this.categorized=new Map;this.zones=[];this.chips=[];this.activeChip=null;this.currentZone=null;this.isDragging=!1;this.startX=0;this.startY=0;this.offsetX=0;this.offsetY=0;this.data.categories.forEach(({label:o,items:a})=>{this.categories.push(o),this.allItems.push(...a)}),this.data.distractors&&console.warn("Found a distractor in a Sequential Classification interaction, those are not useful and will be ignored"),this.allItems=this.config.shuffle?T(this.allItems):this.allItems,this.initializeProgress(this.allItems.length),this.boundPointerMove=this.handlePointerMove.bind(this),this.boundPointerUp=this.handlePointerUp.bind(this),this.variant=this.config.variant}initialize(){window.addEventListener("pointermove",this.boundPointerMove),window.addEventListener("pointerup",this.boundPointerUp)}cleanup(){window.removeEventListener("pointermove",this.boundPointerMove),window.removeEventListener("pointerup",this.boundPointerUp)}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}render(){let t=Math.min(this.categories.length,4);this.innerHTML=`
1197
1234
  <style>
1198
1235
  sequential-classification {
1199
1236
  display: flex;
@@ -1275,6 +1312,7 @@ ${n instanceof Error?n.message:String(n)}`)}}function M(e){return typeof e=="str
1275
1312
  gap: clamp(0.5rem, min(1.5cqw, 1.5cqh), 1rem);
1276
1313
  overflow-y: auto;
1277
1314
  overflow-x: hidden;
1315
+ scrollbar-gutter: stable;
1278
1316
  align-content: stretch;
1279
1317
  padding: clamp(0.25rem, min(1cqw, 1cqh), 0.5rem);
1280
1318
  min-height: 0;
@@ -1318,11 +1356,17 @@ ${n instanceof Error?n.message:String(n)}`)}}function M(e){return typeof e=="str
1318
1356
 
1319
1357
  edu-chip {
1320
1358
  position: absolute;
1359
+ width: clamp(160px, 20cqw, 280px);
1360
+ max-width: calc(100% - 0.5rem);
1321
1361
  user-select: none;
1322
1362
  touch-action: none;
1323
1363
  transition: transform 0.2s ease;
1324
1364
  }
1325
1365
 
1366
+ edu-chip::part(content-zone) {
1367
+ min-height: clamp(56px, 10cqh, 88px);
1368
+ }
1369
+
1326
1370
  edu-chip:hover {
1327
1371
  transform: scale(1.05);
1328
1372
  }
@@ -1575,7 +1619,7 @@ overflow-x: hidden;`;let r=document.createElement("edu-media");r.setAttribute("t
1575
1619
  }
1576
1620
  </style>
1577
1621
  <div class="media-html">${this.mediaData}</div>
1578
- `}parseTime(t){let r=t.split(":").map(i=>parseInt(i,10));return r.length===2?r[0]*60+r[1]:r.length===3?r[0]*3600+r[1]*60+r[2]:null}};customElements.get("edu-media")||customElements.define("edu-media",xt);function zr(e,n){let t=0,r=e.data.length;e.data.forEach(a=>{let s=new Set(a.correctOptions),l=new Set(n[a.question]||[]),c=0,d=0,u=0;l.forEach(m=>{s.has(m)?c++:d++}),s.forEach(m=>{l.has(m)||u++});let p=s.size,h=c-d-u,g=Math.max(0,h/p*100);t+=g});let i=Math.round(t/r),o=0;return e.data.forEach(a=>{let s=new Set(a.correctOptions),l=new Set(n[a.question]||[]);s.size===l.size&&[...s].every(c=>l.has(c))&&o++}),{score:i,correct:o,total:r}}var te=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="sequential";this.currentQuestionIndex=0;this.userAnswers={};this.shuffledOptions=new Map;this.isGraded=!1;this.data.data.forEach(o=>{this.userAnswers[o.question]=[],this.config.shuffle?this.shuffledOptions.set(o.question,T([...o.options])):this.shuffledOptions.set(o.question,[...o.options])}),this.variant=this.config.variant,this.initializeProgress(this.data.data.length)}get slidesCount(){return this.data.data.length}initialize(){}cleanup(){}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}setSteps(t){let r=t-1;r>=0&&r<this.data.data.length&&(this.currentQuestionIndex=r,this.renderCurrentQuestion())}render(){this.innerHTML=`
1622
+ `}parseTime(t){let r=t.split(":").map(i=>parseInt(i,10));return r.length===2?r[0]*60+r[1]:r.length===3?r[0]*3600+r[1]*60+r[2]:null}};customElements.get("edu-media")||customElements.define("edu-media",xt);function zr(e,n){let t=0,r=e.data.length;e.data.forEach(a=>{let s=new Set(a.correctOptions),l=new Set(n[a.question]||[]),c=0,d=0,u=0;l.forEach(m=>{s.has(m)?c++:d++}),s.forEach(m=>{l.has(m)||u++});let p=s.size,h=c-d-u,g=Math.max(0,h/p*100);t+=g});let i=Math.round(t/r),o=0;return e.data.forEach(a=>{let s=new Set(a.correctOptions),l=new Set(n[a.question]||[]);s.size===l.size&&[...s].every(c=>l.has(c))&&o++}),{score:i,correct:o,total:r}}var te=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="sequential";this.currentQuestionIndex=0;this.userAnswers={};this.shuffledOptions=new Map;this.isGraded=!1;this.data.data.forEach(o=>{this.userAnswers[o.question]=[],this.config.shuffle?this.shuffledOptions.set(o.question,T([...o.options,...o.correctOptions])):this.shuffledOptions.set(o.question,[...o.options,...o.correctOptions])}),this.variant=this.config.variant,this.initializeProgress(this.data.data.length)}get slidesCount(){return this.data.data.length}initialize(){}cleanup(){}onVariantChange(t){this.querySelectorAll("edu-chip, edu-block").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}setSteps(t){let r=t-1;r>=0&&r<this.data.data.length&&(this.currentQuestionIndex=r,this.renderCurrentQuestion())}render(){this.innerHTML=`
1579
1623
  <style>
1580
1624
  mcq-interaction {
1581
1625
  display: flex;
@@ -1612,17 +1656,17 @@ overflow-x: hidden;`;let r=document.createElement("edu-media");r.setAttribute("t
1612
1656
  flex-shrink: 0;
1613
1657
  display: flex;
1614
1658
  flex-direction: column;
1615
- min-height: clamp(64px, 10cqh, 120px);
1616
- max-height: clamp(120px, 30cqh, 260px);
1659
+ min-height: clamp(88px, 16cqh, 160px);
1660
+ max-height: clamp(132px, 32cqh, 280px);
1617
1661
  overflow: hidden;
1618
1662
  }
1619
1663
 
1620
1664
  .question-text {
1621
1665
  padding: 0;
1622
- font-size: clamp(0.95rem, 2.4cqh, 1.2rem);
1666
+ font-size: clamp(1.05rem, 2.6cqh, 1.45rem);
1623
1667
  font-weight: 600;
1624
1668
  color: rgb(var(--edu-ink));
1625
- line-height: 1.4;
1669
+ line-height: 1.35;
1626
1670
  }
1627
1671
 
1628
1672
  .divider {
@@ -1686,7 +1730,7 @@ overflow-x: hidden;`;let r=document.createElement("edu-media");r.setAttribute("t
1686
1730
  border: none;
1687
1731
  padding: clamp(0.5rem, min(1.6cqw, 1.6cqh), 1rem);
1688
1732
  height: 100%;
1689
- max-height: clamp(120px, 30cqh, 260px);
1733
+ max-height: clamp(132px, 32cqh, 280px);
1690
1734
  overflow: auto;
1691
1735
  align-items: center;
1692
1736
  justify-content: flex-start;
@@ -1771,7 +1815,7 @@ overflow-x: hidden;`;let r=document.createElement("edu-media");r.setAttribute("t
1771
1815
  .items-list {
1772
1816
  display: grid;
1773
1817
  grid-template-columns: 1fr;
1774
- grid-auto-rows: minmax(44px, 1fr);
1818
+ grid-auto-rows: minmax(clamp(56px, 12cqh, 88px), 1fr);
1775
1819
  gap: clamp(0.35rem, min(1.2cqw, 1.2cqh), 0.75rem);
1776
1820
  min-height: 0;
1777
1821
  height: 100%;
@@ -1839,8 +1883,8 @@ overflow-x: hidden;`;let r=document.createElement("edu-media");r.setAttribute("t
1839
1883
  .chips-container {
1840
1884
  flex: 1;
1841
1885
  display: grid;
1842
- grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
1843
- grid-auto-rows: minmax(44px, auto);
1886
+ grid-template-columns: 1fr 1fr;
1887
+ grid-auto-rows: minmax(56px, auto);
1844
1888
  gap: clamp(0.4rem, min(1.4cqw, 1.4cqh), 0.75rem);
1845
1889
  padding: clamp(0.5rem, min(1.6cqw, 1.6cqh), 1rem);
1846
1890
  border: 2px dashed rgb(var(--edu-border));
@@ -3461,7 +3505,7 @@ slot {
3461
3505
  <div class="text-wrapper"></div>
3462
3506
  </div>
3463
3507
  `,this.querySelector(".text-wrapper").appendChild(this._$text)}getTotalTargetCount(){return this._slides.reduce((t,r)=>t+r.targets.length,0)}saveCurrentStepResponse(){this._$text&&(this._responses[this._currentStep]=this._$text.getValue())}getResponseForStep(t){return this._responses[t]??{inputValues:{}}}updateProgressAcrossSteps(){let t=0;for(let r=0;r<this._slides.length;r++){let i=this._slides[r],a=this.getResponseForStep(r).inputValues??{};t+=i.targets.filter(s=>{let l=a[s.id];return l!=null&&String(l).trim()!==""}).length}this.setProgress(t)}getCurrentState(){return this.saveCurrentStepResponse(),{step:this._currentStep,responses:this._responses}}isInteractionComplete(){return this.getProgress().current===this.getProgress().total}onHint(){this.saveCurrentStepResponse();let t=this._slides[this._currentStep],i=this.getResponseForStep(this._currentStep).inputValues??{},o=t.targets.find(a=>{let s=i[a.id];return s==null||String(s).trim()===""});if(!o){this.emitHintShown("This step is complete. Move to another step or submit.");return}this.emitHintShown(`Complete the ${o.expectedValue.type} input on this step.`)}grade(){this.saveCurrentStepResponse();let t=0,r=0,i={};for(let s=0;s<this._slides.length;s++){let l=this._slides[s],c=this.getResponseForStep(s),d=Re(l,c);t+=d.correct,r+=d.total,i[s]=Pe(l,c)}this._gradingByStep=i,this._isGraded=!0;let o=this._gradingByStep[this._currentStep];return o&&this._$text.setGradingState(o),{score:r>0?Math.round(t/r*100):0,correct:t,total:r}}submit(){super.submit();let t=this.grade();this.dispatchEvent(new CustomEvent("interaction:graded",{detail:{result:t},bubbles:!0,composed:!0}))}reset(){super.reset(),this._responses={},this._gradingByStep={},this._isGraded=!1,this._currentStep=0,this._$text&&(this._$text.reset(),this._$text.clearGradingState()),this.setProgress(0),this.render()}};customElements.get("sequential-fill-blanks")||customElements.define("sequential-fill-blanks",ue);function ba(e){let n={};if(!e)return n.data="Data is required",{ok:!1,errors:n};if(e.type!=="seriation"&&(n.type='Data type must be "seriation"'),!Array.isArray(e.items))return n.items="Items must be an array",{ok:!1,errors:n};e.items.length<2&&(n.items="At least 2 items are required for seriation"),e.items.some(i=>typeof i!="string"||i.trim()==="")&&(n.items="All items must be non-empty strings"),new Set(e.items).size!==e.items.length&&(n.items="All items must be unique (duplicates found)");let r=Object.keys(n).length===0;return{ok:r,errors:r?null:n}}function yt(e,n,t){let r=0,i=0,o=e.length;e.forEach((s,l)=>{let c=n.indexOf(s),d=t.querySelector(`[data-item="${s}"]`);if(c===-1){d&&(d.chipState="wrong");return}let u=Math.abs(c-l);u===0?(r+=100,i++,d&&(d.chipState="correct")):u===1?(r+=50,d&&(d.chipState="missed")):d&&(d.chipState="wrong")});let a=o>0?r/o:0;return console.log(`Seriation Score: ${a.toFixed(1)}% (${i}/${o} in correct position)`),{score:a,correct:i,total:o,answerKey:e,userResponse:n}}function va(e){try{if(!e||typeof e!="string")return{ok:!1,errors:{input:"Input must be a non-empty string"}};let n=e.trim();if(n.length===0)return{ok:!1,errors:{input:"Input cannot be empty"}};let t=[];return n.includes("|")?t=n.split("|").map(i=>i.trim()).filter(i=>i.length>0):t=n.split(`
3464
- `).map(i=>i.replace(/^\s*[\d\w]+[\.\)]\s*/,"").trim()).filter(i=>i.length>0),t.length<2?{ok:!1,errors:{items:"At least 2 items are required for seriation"}}:{ok:!0,data:{type:"seriation",items:t}}}catch(n){return{ok:!1,errors:{"Parse Error":`${n instanceof Error?n.message:String(n)}`}}}}var pe=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="static";this.currentOrder=[];this.isGraded=!1;this.draggedRowIndex=null;this.dragOverRowIndex=null;this.isDragging=!1;this.draggedRow=null;this.dragOffsetY=0;this.MAX_ITEMS=10;this.MIN_ITEM_HEIGHT=44;if(!this.isValid||!this.data||!this.config)return;let o=this.data.items;this.data.items=o,this.config.shuffle?this.currentOrder=T([...this.data.items]):this.currentOrder=[...this.data.items],this.implementsProgress=!1,this.variant=this.config.variant}initialize(){this.boundPointerMove=this.handlePointerMove.bind(this),this.boundPointerUp=this.handlePointerUp.bind(this),window.addEventListener("pointermove",this.boundPointerMove),window.addEventListener("pointerup",this.boundPointerUp)}cleanup(){window.removeEventListener("pointermove",this.boundPointerMove),window.removeEventListener("pointerup",this.boundPointerUp)}onVariantChange(t){this.querySelectorAll("edu-chip").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}render(){this.innerHTML=`
3508
+ `).map(i=>i.replace(/^\s*[\d\w]+[\.\)]\s*/,"").trim()).filter(i=>i.length>0),t.length<2?{ok:!1,errors:{items:"At least 2 items are required for seriation"}}:{ok:!0,data:{type:"seriation",items:t}}}catch(n){return{ok:!1,errors:{"Parse Error":`${n instanceof Error?n.message:String(n)}`}}}}var pe=class extends x{constructor(t,r,i){super(t,r,i);this.interactionMechanic="static";this.currentOrder=[];this.isGraded=!1;this.draggedRowIndex=null;this.dragOverRowIndex=null;this.isDragging=!1;this.draggedRow=null;this.dragOffsetY=0;this.MAX_ITEMS=10;this.MIN_ITEM_HEIGHT=56;if(!this.isValid||!this.data||!this.config)return;let o=this.data.items;this.data.items=o,this.config.shuffle?this.currentOrder=T([...this.data.items]):this.currentOrder=[...this.data.items],this.implementsProgress=!1,this.variant=this.config.variant}initialize(){this.boundPointerMove=this.handlePointerMove.bind(this),this.boundPointerUp=this.handlePointerUp.bind(this),window.addEventListener("pointermove",this.boundPointerMove),window.addEventListener("pointerup",this.boundPointerUp)}cleanup(){window.removeEventListener("pointermove",this.boundPointerMove),window.removeEventListener("pointerup",this.boundPointerUp)}onVariantChange(t){this.querySelectorAll("edu-chip").forEach(r=>{r.variant!==void 0&&(r.variant=t)}),this.variant=t}render(){this.innerHTML=`
3465
3509
  <style>
3466
3510
  rank-order {
3467
3511
  display: flex;
@@ -3682,6 +3726,12 @@ slot {
3682
3726
  </div>
3683
3727
  `,this.$container=this.querySelector(".container"),this.$rowsContainer=this.querySelector(".rows-container"),this.renderRows()}renderRows(){this.$rowsContainer.innerHTML="",this.currentOrder.forEach((t,r)=>{let i=document.createElement("div");i.className="row",i.dataset.index=String(r);let o=document.createElement("div");o.className="chip-wrapper";let a=document.createElement("edu-chip");a.variant=this.variant,a.dataset.item=t,a.prefix=String(r+1),a.draggable=!0,D(t,a,this.assets?.assetsById),this.isGraded&&(this.data.items.indexOf(t)===r?a.chipState="correct":a.chipState="wrong"),o.appendChild(a);let s=document.createElement("div");s.className="controls";let l=this.createButton("up",r);s.appendChild(l),i.appendChild(o),i.appendChild(s),this.isGraded||i.addEventListener("pointerdown",c=>this.handlePointerDown(c,r)),this.$rowsContainer.appendChild(i)})}createButton(t,r){let i=document.createElement("button");i.className="btn",i.dataset.direction=t,i.dataset.index=String(r),i.setAttribute("aria-label",t==="up"?"Move up":"Move down"),t==="up"&&r===0&&(i.disabled=!0),t==="down"&&r===this.currentOrder.length-1&&(i.disabled=!0),this.isGraded&&(i.disabled=!0);let o=t==="up"?B("up"):B("down");return i.innerHTML=o,i.addEventListener("click",()=>{t==="up"&&r>0?this.swapItems(r,r-1):t==="down"&&r<this.currentOrder.length-1&&this.swapItems(r,r+1)}),i}swapItems(t,r){let i=this.currentOrder[t];this.currentOrder[t]=this.currentOrder[r],this.currentOrder[r]=i,this.renderRows(),this.emitStateChange()}handlePointerDown(t,r){if(t.target.closest(".btn, .controls"))return;t.preventDefault(),t.stopPropagation(),this.isDragging=!0,this.draggedRow=t.currentTarget,this.draggedRowIndex=r;let i=this.draggedRow.getBoundingClientRect();this.dragOffsetY=t.clientY-i.top;try{this.draggedRow.setPointerCapture(t.pointerId)}catch(o){console.warn("Failed to capture pointer:",o)}this.draggedRow.classList.add("dragging"),this.$rowsContainer.style.userSelect="none"}handlePointerMove(t){if(!this.isDragging||!this.draggedRow)return;let r=this.getRowIndexAtY(t.clientY);if(this.$rowsContainer.querySelectorAll(".row").forEach(i=>{i.classList.remove("drag-over")}),r!==-1&&r!==this.draggedRowIndex){let i=Array.from(this.$rowsContainer.children);i[r]&&i[r].classList.add("drag-over")}}handlePointerUp(t){if(!this.isDragging||!this.draggedRow)return;try{this.draggedRow.releasePointerCapture(t.pointerId)}catch{}let r=this.getRowIndexAtY(t.clientY);r!==-1&&r!==this.draggedRowIndex&&this.swapItems(this.draggedRowIndex,r),this.$rowsContainer.querySelectorAll(".row").forEach(i=>{i.classList.remove("dragging","drag-over")}),this.$rowsContainer.style.userSelect="",this.isDragging=!1,this.draggedRow=null,this.draggedRowIndex=null,this.dragOverRowIndex=null}getRowIndexAtY(t){let r=Array.from(this.$rowsContainer.children);for(let i=0;i<r.length;i++){let o=r[i].getBoundingClientRect();if(t>=o.top&&t<=o.bottom)return i}return-1}getCurrentState(){return{currentOrder:[...this.currentOrder],correctOrder:[...this.data.items]}}isInteractionComplete(){return!0}onHint(){let t=0;this.currentOrder.forEach((r,i)=>{this.data.items[i]===r&&t++}),t===this.currentOrder.length?(alert('All items are in the correct order! Click "Check" to submit.'),this.emitHintShown("All items correctly ordered")):(alert(`Hint: ${t} out of ${this.currentOrder.length} items are in the correct position. Keep reordering!`),this.emitHintShown(`${t}/${this.currentOrder.length} correct`))}submit(){super.submit();let t=yt(this.data.items,this.currentOrder,this);console.log(`Rank Order Score: ${t.score.toFixed(1)}% (${t.correct}/${t.total} correct)`),this.isGraded=!0,this.renderRows(),this.dispatchEvent(new CustomEvent("interaction:graded",{detail:{result:t},bubbles:!0,composed:!0})),this.setAttribute("inert","")}reset(){super.reset(),this.config.shuffle?this.currentOrder=T([...this.data.items]):this.currentOrder=[...this.data.items],this.isGraded=!1,this.renderRows()}};customElements.get("rank-order")||customElements.define("rank-order",pe);var hi=!1,xa=()=>{hi||(hi=!0,k({id:"open-classification",label:"Open Classification",elementTag:"open-classification",cognitiveOp:"classification",mechanic:"static",engine:"direct",ctor:Ee,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!0,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"sequential-classification",label:"Sequential Classification",elementTag:"sequential-classification",cognitiveOp:"classification",mechanic:"automatic-sequencing",engine:"direct",ctor:Ce,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!0,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"mcq",label:"Multiple Choice / Multiple Response",elementTag:"mcq-interaction",cognitiveOp:"recognition",mechanic:"sequential",engine:"direct",ctor:te,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!0,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"simultaneous-association",label:"Simultaneous Association",elementTag:"simultaneous-association",cognitiveOp:"association",mechanic:"static",engine:"direct",ctor:ke,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!0,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"list-recall",label:"List Recall",elementTag:"list-recall",cognitiveOp:"freerecall",mechanic:"static",engine:"direct",ctor:re,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"lookup-table",label:"Lookup Table",elementTag:"lookup-table",cognitiveOp:"production",mechanic:"static",engine:"tables",ctor:$e,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"classification-matrix",label:"Classification Matrix",elementTag:"classification-matrix",cognitiveOp:"classification",mechanic:"static",engine:"tables",ctor:Ae,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"nary-choice-table",label:"N-ary Choice Table",elementTag:"nary-choice-table",cognitiveOp:"discrimination",mechanic:"static",engine:"tables",ctor:_e,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"adjacency-table",label:"Adjacency Table",elementTag:"adjacency-table",cognitiveOp:"association",mechanic:"static",engine:"tables",ctor:Ie,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!0,hasValidator:!0,hasGrader:!0}}),k({id:"mark-the-words",label:"Mark The Words",elementTag:"mark-the-words",cognitiveOp:"recognition",mechanic:"static",engine:"text",ctor:ne,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"sequential-mark-the-words",label:"Sequential Mark The Words",elementTag:"sequential-mark-the-words",cognitiveOp:"recognition",mechanic:"sequential",engine:"text",ctor:oe,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"categorize-the-words",label:"Categorize The Words",elementTag:"categorize-the-words",cognitiveOp:"classification",mechanic:"static",engine:"text",ctor:ae,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"sequential-categorize-the-words",label:"Sequential Categorize The Words",elementTag:"sequential-categorize-the-words",cognitiveOp:"classification",mechanic:"sequential",engine:"text",ctor:se,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"text-transformation",label:"Text Transformation",elementTag:"text-transformation",cognitiveOp:"transformation",mechanic:"static",engine:"text",ctor:le,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"sequential-text-transformation",label:"Sequential Text Transformation",elementTag:"sequential-text-transformation",cognitiveOp:"transformation",mechanic:"sequential",engine:"text",ctor:ce,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"fill-blanks",label:"Fill Blanks",elementTag:"fill-blanks",cognitiveOp:"cuedrecall",mechanic:"static",engine:"text",ctor:de,capabilities:{isSequential:!1,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"sequential-fill-blanks",label:"Sequential Fill Blanks",elementTag:"sequential-fill-blanks",cognitiveOp:"cuedrecall",mechanic:"sequential",engine:"text",ctor:ue,capabilities:{isSequential:!0,implementsProgress:!0,usesAssets:!1,hasParser:!1,hasValidator:!0,hasGrader:!0}}),k({id:"rank-order",label:"Rank Order",elementTag:"rank-order",cognitiveOp:"seriation",mechanic:"static",engine:"direct",ctor:pe,capabilities:{isSequential:!1,implementsProgress:!1,usesAssets:!0,hasParser:!0,hasValidator:!0,hasGrader:!0}}))};xa();var gi=`<header part='header'>
3684
3728
  <div class="prompt-container">
3729
+ <button class="close-btn btn" title="Close Fullscreen" part="close-part" style="display: none;">
3730
+ <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
3731
+ <path d="M18 6 6 18" />
3732
+ <path d="m6 6 12 12" />
3733
+ </svg>
3734
+ </button>
3685
3735
  <button class="prompt-btn btn" title="See Prompt Data" part="see-prompt">
3686
3736
  <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
3687
3737
  <path d="M12 3c4.97 0 9 1.79 9 4s-4.03 4-9 4-9-1.79-9-4 4.03-4 9-4Z"/>
@@ -3742,13 +3792,6 @@ slot {
3742
3792
  <div class="radio-nav" part="radio-nav"></div>
3743
3793
  <div class="action-buttons">
3744
3794
  <button class="check-btn" type="button" part="check">Check</button>
3745
-
3746
- <button class="see-answers-btn btn" title="See answers" part="see-answers">
3747
- <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
3748
- <path d="M2 12s3.5-6 10-6 10 6 10 6-3.5 6-10 6-10-6-10-6Z"/>
3749
- <circle cx="12" cy="12" r="3"/>
3750
- </svg>
3751
- </button>
3752
3795
  <button class="retry-btn btn" title="Retry" part="retry">
3753
3796
  <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
3754
3797
  <path d="M17 2v4h-4"/>
@@ -3916,13 +3959,15 @@ footer {
3916
3959
  position: relative;
3917
3960
  display: flex;
3918
3961
  flex-direction: column;
3919
- justify-content: center;
3962
+ justify-content: flex-start;
3920
3963
  align-items: center;
3921
- /* padding: clamp(0.3rem, 0.8cqh, 0.6rem);*/
3964
+ padding: clamp(0.35rem, 1cqh, 0.75rem) clamp(0.5rem, 1.5cqw, 1rem);
3922
3965
  gap: clamp(0.25rem, 0.8cqh, 0.5rem);
3923
3966
  flex-shrink: 0;
3924
- height: clamp(20px, 9cqh, 62px);
3925
- min-height: clamp(50px, 9cqh, 62px);
3967
+ height: auto;
3968
+ min-height: clamp(76px, 12cqh, 120px);
3969
+ box-sizing: border-box;
3970
+ overflow: visible;
3926
3971
  }
3927
3972
 
3928
3973
  .progress-container {
@@ -3932,6 +3977,7 @@ footer {
3932
3977
  justify-content: space-between;
3933
3978
  gap: clamp(0.25rem, 1cqw, 0.6rem);
3934
3979
  width: 100%;
3980
+ min-width: 0;
3935
3981
  }
3936
3982
 
3937
3983
  .progress-bar {
@@ -4051,6 +4097,14 @@ footer {
4051
4097
  align-items: center;
4052
4098
  justify-content: center;
4053
4099
  flex-wrap: wrap;
4100
+ width: 100%;
4101
+ min-width: 0;
4102
+ }
4103
+
4104
+ .prompt-btn,
4105
+ .retry-btn,
4106
+ .scores-btn {
4107
+ color: rgb(var(--edu-ink));
4054
4108
  }
4055
4109
 
4056
4110
  .check-btn {
@@ -4111,6 +4165,8 @@ footer {
4111
4165
  gap: 0.5rem;
4112
4166
  align-items: center;
4113
4167
  justify-content: center;
4168
+ width: 100%;
4169
+ min-width: 0;
4114
4170
  }
4115
4171
 
4116
4172
  .radio-nav[data-active="true"] {
@@ -4173,6 +4229,10 @@ footer {
4173
4229
 
4174
4230
  & .timer { }
4175
4231
 
4232
+ & footer {
4233
+ color: rgb(var(--edu-inverted-ink));
4234
+ }
4235
+
4176
4236
  & .check-btn {
4177
4237
  background: transparent;
4178
4238
  color: rgb(var(--edu-ink));
@@ -4206,7 +4266,8 @@ footer {
4206
4266
  :host([variant="minimal"]) {
4207
4267
  & .wrap {
4208
4268
  border: 1px solid rgb(var(--edu-border));
4209
- border-radius: 6px;
4269
+ border-radius: 10px;
4270
+ background: rgb(var(--edu-card));
4210
4271
  }
4211
4272
 
4212
4273
  & .timer {
@@ -4214,10 +4275,12 @@ footer {
4214
4275
  }
4215
4276
 
4216
4277
  & .check-btn {
4217
- border-radius: 4px;
4278
+ border-radius: 10px;
4279
+ box-shadow: none;
4218
4280
  }
4219
4281
 
4220
4282
  & footer {
4283
+ color: rgb(var(--edu-inverted-ink));
4221
4284
  border-top: 1px solid rgb(var(--edu-border));
4222
4285
  }
4223
4286
 
@@ -4234,7 +4297,8 @@ footer {
4234
4297
  }
4235
4298
 
4236
4299
  & .radio-nav label {
4237
- border-radius: 4px;
4300
+ border-radius: 999px;
4301
+ background: transparent;
4238
4302
  }
4239
4303
  }
4240
4304
 
@@ -4256,6 +4320,7 @@ footer {
4256
4320
  }
4257
4321
 
4258
4322
  & footer {
4323
+ color: rgb(var(--edu-inverted-ink));
4259
4324
  border-top: 1px solid rgb(var(--edu-border) / 0.5);
4260
4325
  padding: 1.25rem;
4261
4326
  }
@@ -4291,7 +4356,7 @@ footer {
4291
4356
 
4292
4357
  :host([variant="playful"]) {
4293
4358
  & .wrap {
4294
- color: rgb(var(--edu-first-accent));
4359
+ color: rgb(var(--edu-ink));
4295
4360
  border-radius: 14px;
4296
4361
  border: 2px dashed rgb(var(--edu-border));
4297
4362
  }
@@ -4302,10 +4367,13 @@ footer {
4302
4367
  }
4303
4368
 
4304
4369
  & .check-btn {
4370
+ background: linear-gradient(135deg, rgb(var(--edu-first-accent));
4371
+ color: rgb(var(--edu-inverted-ink));
4305
4372
  border-radius: 12px;
4306
4373
  font-weight: 700;
4307
4374
  text-transform: uppercase;
4308
4375
  letter-spacing: 0.5px;
4376
+ box-shadow: 0 8px 18px rgb(var(--edu-shadow-color) / 0.16);
4309
4377
  }
4310
4378
 
4311
4379
  & .check-btn:hover:not(:disabled) {
@@ -4313,6 +4381,7 @@ footer {
4313
4381
  }
4314
4382
 
4315
4383
  & footer {
4384
+ color: rgb(var(--edu-inverted-ink));
4316
4385
  border-top: 2px dashed rgb(var(--edu-border));
4317
4386
  }
4318
4387
 
@@ -4332,7 +4401,9 @@ footer {
4332
4401
  }
4333
4402
 
4334
4403
  & .radio-nav label {
4335
- background: rgb(var(--edu-muted));
4404
+ background: rgb(var(--edu-card));
4405
+ color: rgb(var(--edu-ink));
4406
+ border: 2px solid rgb(var(--edu-border));
4336
4407
  border-radius: 50px;
4337
4408
  font-weight: 700;
4338
4409
  }
@@ -4342,9 +4413,10 @@ footer {
4342
4413
  }
4343
4414
 
4344
4415
  & .radio-nav input:checked + label {
4345
- background: rgb(var(--edu-first-accent));
4416
+ background: linear-gradient(135deg, rgb(var(--edu-first-accent));
4346
4417
  color: rgb(var(--edu-inverted-ink));
4347
- box-shadow: 0 5px 15px rgb(var(--edu-first-accent) / 0.4);
4418
+ border-color: transparent;
4419
+ box-shadow: 0 5px 15px rgb(var(--edu-shadow-color) / 0.18);
4348
4420
  }
4349
4421
  }
4350
4422
 
@@ -4353,13 +4425,14 @@ footer {
4353
4425
  background: rgba(var(--edu-card), 0.7);
4354
4426
  backdrop-filter: blur(10px);
4355
4427
  border: 1px solid rgba(var(--edu-border), 0.35);
4356
- border-radius: 12px;
4428
+ border-radius: 14px;
4429
+ box-shadow: 0 16px 32px rgba(var(--edu-shadow-color), 0.12);
4357
4430
  }
4358
4431
 
4359
4432
  & .check-btn {
4360
- background: rgba(var(--edu-first-accent), 0.9);
4433
+ background: rgba(var(--edu-first-accent), 0.88);
4361
4434
  backdrop-filter: blur(5px);
4362
- border-radius: 10px;
4435
+ border-radius: 999px;
4363
4436
  }
4364
4437
 
4365
4438
  & .check-btn:hover:not(:disabled) {
@@ -4383,6 +4456,7 @@ footer {
4383
4456
  background: rgba(var(--edu-card), 0.5);
4384
4457
  backdrop-filter: blur(5px);
4385
4458
  border: 1px solid rgba(var(--edu-border), 0.35);
4459
+ border-radius: 999px;
4386
4460
  }
4387
4461
 
4388
4462
  & .radio-nav input:checked + label {
@@ -4412,6 +4486,7 @@ footer {
4412
4486
  }
4413
4487
 
4414
4488
  & footer {
4489
+ color: rgb(var(--edu-inverted-ink));
4415
4490
  border-top: 1px solid rgb(var(--edu-border));
4416
4491
  padding: 1rem 1.5rem;
4417
4492
  }
@@ -4465,6 +4540,7 @@ footer {
4465
4540
  }
4466
4541
 
4467
4542
  & footer {
4543
+ color: rgb(var(--edu-inverted-ink));
4468
4544
  border-top: 2px solid rgb(var(--edu-border));
4469
4545
  }
4470
4546
 
@@ -4561,13 +4637,14 @@ footer {
4561
4637
 
4562
4638
  :host([variant="card"]) {
4563
4639
  & .wrap {
4564
- border-radius: 8px;
4565
- box-shadow: 0 4px 12px rgba(var(--edu-shadow-color), 0.1), 0 2px 4px rgba(var(--edu-shadow-color), 0.05);
4640
+ border-radius: 14px;
4641
+ background: rgb(var(--edu-card));
4642
+ box-shadow: 0 10px 24px rgba(var(--edu-shadow-color), 0.12), 0 2px 4px rgba(var(--edu-shadow-color), 0.05);
4566
4643
  }
4567
4644
 
4568
4645
  & .check-btn {
4569
- border-radius: 6px;
4570
- box-shadow: 0 2px 4px rgba(var(--edu-shadow-color), 0.1);
4646
+ border-radius: 999px;
4647
+ box-shadow: 0 6px 14px rgba(var(--edu-shadow-color), 0.12);
4571
4648
  }
4572
4649
 
4573
4650
  & .check-btn:hover:not(:disabled) {
@@ -4579,20 +4656,20 @@ footer {
4579
4656
  }
4580
4657
 
4581
4658
  & .radio-nav label {
4582
- border-radius: 6px;
4583
- box-shadow: 0 2px 4px rgba(var(--edu-shadow-color), 0.1);
4659
+ border-radius: 999px;
4660
+ box-shadow: 0 4px 10px rgba(var(--edu-shadow-color), 0.08);
4584
4661
  }
4585
4662
 
4586
4663
  & .radio-nav input:checked + label {
4587
4664
  box-shadow: 0 4px 8px rgba(var(--edu-first-accent), 0.2);
4588
4665
  }
4589
4666
  }
4590
- `;var he=class extends HTMLElement{constructor(){super();this.soundManager=new H;this.animationsManager=new L;this.timerInterval=null;this.remainingSeconds=0;this.interactionComplete=!1;this.attemptCount=0;this.attemptLimit=null;this.currentScreen="interaction";this.attachShadow({mode:"open"});let t=document.createElement("style");t.textContent=mi,this.shadowRoot.append(t);let r=document.createElement("section");r.className="wrap",r.innerHTML=gi,this.shadowRoot.append(r),L.injectKeyframes(this.shadowRoot),this.$headerEl=r.querySelector("header"),this.$footerEl=r.querySelector("footer"),this.$titleEl=r.querySelector(".title"),this.$promptBtn=r.querySelector(".prompt-btn"),this.$timerEl=r.querySelector(".timer"),this.$checkBtn=r.querySelector(".check-btn"),this.$scoresBtn=r.querySelector(".scores-btn"),this.$seeAnswersBtn=r.querySelector(".see-answers-btn"),this.$retryBtn=r.querySelector(".retry-btn"),this.$radioNav=r.querySelector(".radio-nav"),this.$progressContainer=r.querySelector(".progress-container"),this.$progressBar=r.querySelector(".progress-bar"),this.$progressIcon=r.querySelector(".progress-icon-wrapper"),this.$progressCounter=r.querySelector(".progress-counter"),this.$contentEl=r.querySelector('[part="content"]'),this.animationsManager.isEnabled=!0,this.$interactionScreen=r.querySelector('[data-screen="interaction"]'),this.$errorContent=r.querySelector(".error-content"),this.$attemptsMessage=r.querySelector(".attempts-message"),this.$scoreDisplay=r.querySelector(".score-display"),this.$timerDisplay=r.querySelector(".timer-display"),this.setupShellListeners()}static get observedAttributes(){return["show-header","show-footer"]}connectedCallback(){this.hasAttribute("show-header")||this.setAttribute("show-header","true"),this.hasAttribute("show-footer")||this.setAttribute("show-footer","true"),this.updateVisibility(),this.animationsManager.animate(this.$progressIcon,"heartbeat"),this.animationsManager.animate(this.$promptBtn,"wobble")}disconnectedCallback(){this.stopTimer(),this.removeInteractionListeners()}attributeChangedCallback(t,r,i){r!==i&&this.updateVisibility()}setInteraction(t){if(this.stopTimer(),!t.isValid){this.$errorContent.textContent=t.errors??"Error loading the interaction.",this.switchScreen("error");return}this.soundManager.playSound("start"),this.interaction&&(this.removeInteractionListeners(),this.$interactionScreen.innerHTML=""),this.interaction=t,this.interactionComplete=!1;let r=this.interaction.config;this.reset(),this.switchScreen("interaction");let i=r.variant??"elegant";this.setAttribute("variant",i),this.interaction.onVariantChange(i),this.$titleEl.textContent=r.prompt||"",r.promptData&&r.promptModality?(this.$titleEl.style.cursor="pointer",this.$titleEl.title="Click to view prompt details",this.$promptBtn.addEventListener("click",()=>this.openPromptDialog()),this.$titleEl.addEventListener("click",()=>this.openPromptDialog())):(this.$titleEl.style.cursor="",this.$titleEl.style.textDecoration="",this.$titleEl.title=""),r.timer!==null&&r.timer>30?(this.remainingSeconds=r.timer,this.$timerEl.classList.remove("edu-hidden"),this.updateTimerDisplay(),this.startTimer()):this.$timerEl.classList.add("edu-hidden"),this.attemptLimit=r.attemptLimit,this.attemptCount=0,this.interaction.interactionMechanic==="sequential"?(this.$radioNav.dataset.active="true",this.renderRadioNav()):this.$radioNav.dataset.active="false",this.interaction.implementsProgress?(this.$checkBtn.classList.add("edu-hidden"),this.$progressContainer.classList.remove("edu-hidden"),this.$progressCounter.textContent=`0/${this.interaction.progressTracker.total}`):(this.$progressContainer.classList.add("edu-hidden"),this.$checkBtn.classList.remove("edu-hidden")),this.setupInteractionListeners(),this.$interactionScreen.innerHTML="",this.$interactionScreen.appendChild(t)}removeInteraction(){this.interaction&&(this.removeInteractionListeners(),this.$interactionScreen.innerHTML="",this.interaction=void 0,this.interactionComplete=!1)}setupShellListeners(){this.$checkBtn.addEventListener("click",()=>{this.soundManager.playSound("pop");try{this.interaction.submit()}catch(t){console.error("Submit failed:",t)}}),this.$seeAnswersBtn.addEventListener("click",()=>{this.soundManager.playSound("pop"),this.currentScreen==="solution"?this.switchScreen("interaction"):this.switchScreen("solution")}),this.$scoresBtn.addEventListener("click",()=>{this.soundManager.playSound("pop"),this.currentScreen==="score"?this.switchScreen("interaction"):this.switchScreen("score")}),this.$timerEl.addEventListener("click",()=>{this.soundManager.playSound("pop"),this.$timerDisplay.append(this.$timerEl),this.currentScreen==="time"?(this.switchScreen("interaction"),this.$headerEl.append(this.$timerEl)):this.switchScreen("time")}),this.$retryBtn.addEventListener("click",()=>this.handleRetry()),this.$radioNav.addEventListener("change",t=>{let r=t.target;if(r.type==="radio"){let i=parseInt(r.id.replace("step-",""),10);this.interaction&&this.interaction.setSteps(i),this.dispatchEvent(new CustomEvent("navigation-change",{detail:{step:i},bubbles:!0,composed:!0}))}})}setupInteractionListeners(){this.interaction.addEventListener("interaction:ready",t=>{console.log("[Shell] Interaction ready:",t.detail.id)}),this.interaction.addEventListener("interaction:progress",t=>{let{current:r,total:i,percentage:o}=t.detail;this.updateProgress(r,i),r===i&&i>0?(this.interactionComplete=!0,this.$checkBtn.classList.remove("edu-hidden")):(this.interactionComplete=!1,this.interaction.implementsProgress&&this.$checkBtn.classList.add("edu-hidden"))}),this.interaction.addEventListener("interaction:complete",t=>{console.log("[Shell] Interaction complete:",t.detail),this.stopTimer(),this.handleCompletion(t.detail.state)}),this.interaction.addEventListener("interaction:graded",t=>{t.detail.result.score===100?(this.soundManager.playSound("success"),this.animationsManager.animate(this.$progressIcon,"spin-pulse")):(this.soundManager.playSound("failure"),this.animationsManager.animate(this.$progressIcon,"shake")),this.handleGraded(t.detail.result)}),this.interaction.addEventListener("interaction:hint-shown",t=>{console.log("[Shell] Hint shown:",t.detail.message)}),this.interaction.addEventListener("interaction:error",t=>{console.error("[Shell] Interaction error:",t.detail),alert(t.detail.message)})}removeInteractionListeners(){}updateProgress(t,r){this.$progressBar.max=r,this.$progressBar.value=t??0,this.$progressCounter.textContent=`${t}/${r}`;let i=r>0?t/r*100:0,a=this.$progressBar.offsetWidth*i/100-12;this.$progressIcon.style.left=`${Math.max(0,a)}px`}handleCompletion(t){this.dispatchEvent(new CustomEvent("shell:interaction-complete",{detail:{state:t},bubbles:!0,composed:!0})),console.log("[Shell] Interaction submitted with state:",t)}handleGraded(t){this.$checkBtn.classList.add("edu-hidden"),this.$seeAnswersBtn.classList.remove("edu-hidden"),this.$scoresBtn.classList.remove("edu-hidden"),this.$retryBtn.classList.remove("edu-hidden"),this.attemptLimit&&this.attemptCount>this.attemptLimit&&this.$retryBtn.classList.add("edu-hidden");let r=t.score;this.$scoreDisplay.innerHTML=`
4667
+ `;var he=class extends HTMLElement{constructor(){super();this.soundManager=new H;this.animationsManager=new L;this.timerInterval=null;this.remainingSeconds=0;this.interactionComplete=!1;this.attemptCount=0;this.attemptLimit=null;this.currentScreen="interaction";this.attachShadow({mode:"open"});let t=document.createElement("style");t.textContent=mi,this.shadowRoot.append(t);let r=document.createElement("section");r.className="wrap",r.innerHTML=gi,this.shadowRoot.append(r),L.injectKeyframes(this.shadowRoot),this.$headerEl=r.querySelector("header"),this.$footerEl=r.querySelector("footer"),this.$titleEl=r.querySelector(".title"),this.$closeBtn=r.querySelector(".close-btn"),this.$promptBtn=r.querySelector(".prompt-btn"),this.$timerEl=r.querySelector(".timer"),this.$checkBtn=r.querySelector(".check-btn"),this.$scoresBtn=r.querySelector(".scores-btn"),this.$retryBtn=r.querySelector(".retry-btn"),this.$radioNav=r.querySelector(".radio-nav"),this.$progressContainer=r.querySelector(".progress-container"),this.$progressBar=r.querySelector(".progress-bar"),this.$progressIcon=r.querySelector(".progress-icon-wrapper"),this.$progressCounter=r.querySelector(".progress-counter"),this.$contentEl=r.querySelector('[part="content"]'),this.animationsManager.isEnabled=!0,this.$interactionScreen=r.querySelector('[data-screen="interaction"]'),this.$errorContent=r.querySelector(".error-content"),this.$attemptsMessage=r.querySelector(".attempts-message"),this.$scoreDisplay=r.querySelector(".score-display"),this.$timerDisplay=r.querySelector(".timer-display"),this.setupShellListeners()}static get observedAttributes(){return["show-header","show-footer"]}connectedCallback(){this.hasAttribute("show-header")||this.setAttribute("show-header","true"),this.hasAttribute("show-footer")||this.setAttribute("show-footer","true"),this.updateVisibility(),this.animationsManager.animate(this.$progressIcon,"heartbeat")}disconnectedCallback(){this.stopTimer(),this.removeInteractionListeners()}attributeChangedCallback(t,r,i){r!==i&&this.updateVisibility()}setInteraction(t){if(this.stopTimer(),!t.isValid){this.$errorContent.textContent=t.errors??"Error loading the interaction.",this.switchScreen("error");return}this.soundManager.playSound("start"),this.interaction&&(this.removeInteractionListeners(),this.$interactionScreen.innerHTML=""),this.interaction=t,this.interactionComplete=!1;let r=this.interaction.config;this.reset(),this.switchScreen("interaction");let i=r.variant??"elegant";this.setAttribute("variant",i),this.interaction.onVariantChange(i),this.$titleEl.textContent=r.prompt||"",r.promptData&&r.promptModality?(this.$titleEl.style.cursor="pointer",this.$titleEl.title="Click to view prompt details",this.$promptBtn.addEventListener("click",()=>this.openPromptDialog()),this.$titleEl.addEventListener("click",()=>this.openPromptDialog())):(this.$titleEl.style.cursor="",this.$titleEl.style.textDecoration="",this.$titleEl.title=""),r.timer!==null&&r.timer>30?(this.remainingSeconds=r.timer,this.$timerEl.classList.remove("edu-hidden"),this.updateTimerDisplay(),this.startTimer()):this.$timerEl.classList.add("edu-hidden"),this.attemptLimit=r.attemptLimit,this.attemptCount=0,this.interaction.interactionMechanic==="sequential"?(this.$radioNav.dataset.active="true",this.renderRadioNav()):this.$radioNav.dataset.active="false",this.interaction.implementsProgress?(this.$checkBtn.classList.add("edu-hidden"),this.$progressContainer.classList.remove("edu-hidden"),this.$progressCounter.textContent=`0/${this.interaction.progressTracker.total}`):(this.$progressContainer.classList.add("edu-hidden"),this.$checkBtn.classList.remove("edu-hidden")),this.setupInteractionListeners(),this.$interactionScreen.innerHTML="",this.$interactionScreen.appendChild(t)}removeInteraction(){this.interaction&&(this.removeInteractionListeners(),this.$interactionScreen.innerHTML="",this.interaction=void 0,this.interactionComplete=!1)}toggleCloseBtn(t){if(this.$closeBtn.style.display==="none"){this.$closeBtn.style.display="block",this.$closeBtn.addEventListener("click",t);return}this.$closeBtn.removeEventListener("click",t),this.$closeBtn.style.display="none"}setupShellListeners(){this.$checkBtn.addEventListener("click",()=>{this.soundManager.playSound("pop");try{this.interaction.submit()}catch(t){console.error("Submit failed:",t)}}),this.$scoresBtn.addEventListener("click",()=>{this.soundManager.playSound("pop"),this.currentScreen==="score"?this.switchScreen("interaction"):this.switchScreen("score")}),this.$timerEl.addEventListener("click",()=>{this.soundManager.playSound("pop"),this.$timerDisplay.append(this.$timerEl),this.currentScreen==="time"?(this.switchScreen("interaction"),this.$headerEl.append(this.$timerEl)):this.switchScreen("time")}),this.$retryBtn.addEventListener("click",()=>this.handleRetry()),this.$radioNav.addEventListener("change",t=>{let r=t.target;if(r.type==="radio"){let i=parseInt(r.id.replace("step-",""),10);this.interaction&&this.interaction.setSteps(i),this.dispatchEvent(new CustomEvent("navigation-change",{detail:{step:i},bubbles:!0,composed:!0}))}})}setupInteractionListeners(){this.interaction.addEventListener("interaction:ready",t=>{console.log("[Shell] Interaction ready:",t.detail.id)}),this.interaction.addEventListener("interaction:progress",t=>{let{current:r,total:i,percentage:o}=t.detail;this.updateProgress(r,i),r===i&&i>0?(this.interactionComplete=!0,this.$checkBtn.classList.remove("edu-hidden")):(this.interactionComplete=!1,this.interaction.implementsProgress&&this.$checkBtn.classList.add("edu-hidden"))}),this.interaction.addEventListener("interaction:complete",t=>{console.log("[Shell] Interaction complete:",t.detail),this.stopTimer(),this.handleCompletion(t.detail.state)}),this.interaction.addEventListener("interaction:graded",t=>{t.detail.result.score===100?(this.soundManager.playSound("success"),this.animationsManager.animate(this.$progressIcon,"spin-pulse")):(this.soundManager.playSound("failure"),this.animationsManager.animate(this.$progressIcon,"shake")),this.handleGraded(t.detail.result)}),this.interaction.addEventListener("interaction:hint-shown",t=>{console.log("[Shell] Hint shown:",t.detail.message)}),this.interaction.addEventListener("interaction:error",t=>{console.error("[Shell] Interaction error:",t.detail),alert(t.detail.message)})}removeInteractionListeners(){}updateProgress(t,r){this.$progressBar.max=r,this.$progressBar.value=t??0,this.$progressCounter.textContent=`${t}/${r}`;let i=r>0?t/r*100:0,a=this.$progressBar.offsetWidth*i/100-12;this.$progressIcon.style.left=`${Math.max(0,a)}px`}handleCompletion(t){this.dispatchEvent(new CustomEvent("shell:interaction-complete",{detail:{state:t},bubbles:!0,composed:!0})),console.log("[Shell] Interaction submitted with state:",t)}handleGraded(t){this.$checkBtn.classList.add("edu-hidden"),this.$scoresBtn.classList.remove("edu-hidden"),this.$retryBtn.classList.remove("edu-hidden"),this.attemptLimit&&this.attemptCount>this.attemptLimit&&this.$retryBtn.classList.add("edu-hidden");let r=t.score;this.$scoreDisplay.innerHTML=`
4591
4668
  <div style="font-size: 4rem; font-weight: 700; color: ${r>=75?"rgb(var(--edu-success))":r>=50?"rgba(139, 195, 74)":r>=25?"rgb(var(--edu-warning))":"rgb(var(--edu-error))"}">${r}%</div>
4592
4669
  <div style="font-size: 1.5rem; margin-top: 1rem; color: rgb(var(--edu-second-ink));">
4593
4670
  ${r===100?"Perfect Score! \u{1F389}":r>=75?"Great Job!":r>=50?"Good Effort!":r>=25?"Keep Trying!":"Try Again!"}
4594
4671
  </div>
4595
- `,this.$progressIcon.classList.remove("score-fail","score-low","score-mid","score-high"),this.$progressBar.classList.remove("score-fail","score-low","score-mid","score-high");let i="";r<=25?i="score-fail":r<=50?i="score-low":r<=75?i="score-mid":i="score-high",this.$progressIcon.classList.add(i),this.$progressBar.classList.add(i)}reset(){this.resetTimer(),this.interaction.implementsProgress||this.$checkBtn.classList.remove("edu-hidden"),this.$seeAnswersBtn.classList.add("edu-hidden"),this.$scoresBtn.classList.add("edu-hidden"),this.$retryBtn.classList.add("edu-hidden"),this.$progressIcon.classList.remove("score-fail","score-low","score-mid","score-high"),this.$progressBar.classList.remove("score-fail","score-low","score-mid","score-high"),this.animationsManager.animate(this.$progressIcon,"heartbeat"),this.$progressBar.value=0,this.updateProgress(0,this.interaction.progressTracker.total),this.interaction.interactionMechanic==="sequential"&&this.renderRadioNav()}handleRetry(){if(this.$retryBtn.classList.add("edu-hidden"),this.soundManager.playSound("pop"),this.attemptCount++,this.attemptLimit&&this.attemptLimit>0){let t=this.attemptLimit-this.attemptCount+1;this.$attemptsMessage.textContent=`${t} attempt${t!==1?"s":""} remaining`,this.switchScreen("attempts"),setTimeout(()=>{this.switchScreen("interaction"),this.reset(),this.resumeTimer(),this.interaction?.reset(),this.soundManager.playSound("flip")},2e3)}else this.switchScreen("interaction"),this.interaction?.reset()}openPromptDialog(){let t=this.interaction?.config;if(!t)return;this.soundManager.playSound("pop");let r=document.querySelector("edu-dialog#prompt-dialog");r||(r=document.createElement("edu-dialog"),r.id="prompt-dialog",document.body.appendChild(r)),r.title=t.construct||this.interaction?.config.promptModality||"Prompt";let i=document.createElement("edu-media");i.setAttribute("type",t.promptModality),i.setAttribute("data",t.promptData),t.promptDataSpec&&i.setAttribute("spec",t.promptDataSpec),r.innerHTML="",r.appendChild(i),r.open()}switchScreen(t){this.shadowRoot.querySelectorAll(".screen").forEach(r=>{let i=r.getAttribute("data-screen");r.style.display=i===t?"block":"none"}),this.currentScreen=t,console.log(`[Shell] Switched to screen: ${t}`)}startTimer(){this.timerInterval=window.setInterval(()=>{this.remainingSeconds--,this.updateTimerDisplay(),this.remainingSeconds<=0&&(this.stopTimer(),this.handleTimerComplete())},1e3)}stopTimer(){this.timerInterval!==null&&(clearInterval(this.timerInterval),this.timerInterval=null)}getFormattedTime(t){let r=Math.floor(t/60),i=t%60;return`${r}:${i.toString().padStart(2,"0")}`}updateTimerDisplay(){this.$timerEl.textContent=this.getFormattedTime(this.remainingSeconds),this.remainingSeconds===30&&(this.soundManager.playSound("low-time"),this.animationsManager.animate(this.$timerEl,"shake")),delete this.$timerEl.dataset.warning,delete this.$timerEl.dataset.danger,this.remainingSeconds<=10?this.$timerEl.dataset.danger="true":this.remainingSeconds<=30&&(this.$timerEl.dataset.warning="true")}handleTimerComplete(){console.log("[Shell] Timer complete");try{this.interaction.submit()}catch(t){console.error("Auto-submit on timer failed:",t)}this.dispatchEvent(new CustomEvent("shell:timer-complete",{bubbles:!0,composed:!0}))}pauseTimer(){this.stopTimer()}resumeTimer(){this.remainingSeconds>0&&this.timerInterval===null&&this.startTimer()}resetTimer(){this.stopTimer(),this.remainingSeconds=this.interaction.config.timer,this.updateTimerDisplay()}updateVisibility(){let t=this.getAttribute("show-header")!=="false",r=this.getAttribute("show-footer")!=="false";this.$headerEl.style.display=t?"":"none",this.$footerEl.style.display=r?"":"none"}renderRadioNav(){let t=this.interaction&&"slidesCount"in this.interaction?this.interaction.slidesCount:1;this.$radioNav.innerHTML="";for(let r=1;r<=t;r++){let i=document.createElement("input");i.type="radio",i.name="step-nav",i.id=`step-${r}`,r===1&&(i.checked=!0);let o=document.createElement("label");o.htmlFor=`step-${r}`,o.textContent=String(r),this.$radioNav.appendChild(i),this.$radioNav.appendChild(o)}}getContentArea(){return this.$contentEl}};customElements.get("edu-window")||customElements.define("edu-window",he);et();W();export{Ie as AdjacencyTable,we as AssetValidationError,x as BaseInteraction,ae as CategorizeTheWords,Ae as ClassificationMatrix,Qe as EduTable,Je as EduText,de as FillBlanks,he as InteractionsBaseShell,re as ListRecall,$e as LookupTable,te as MCQ,ne as MarkTheWords,_e as NaryChoiceTable,Ee as OpenClassification,pe as RankOrder,se as SequentialCategorizeTheWords,Ce as SequentialClassification,ue as SequentialFillBlanks,oe as SequentialMarkTheWords,ce as SequentialTextTransformation,ke as SimultaneousAssociation,le as TextTransformation,ll as adjacencyTableDataParser,pl as adjacencyTableDataValidator,Vr as adjacencyTableGrader,sl as basicTableDataParser,ul as basicTableDataValidator,Or as classificationTableGrader,Ta as clearInteractionRegistry,He as cognikitThemePresets,Te as compareValues,xi as configureCognikit,bi as createInteraction,tt as defaultCognikitThemeVariables,We as detectCellKind,W as ensureCognikitTheme,Fr as getAdjacencyCellGrading,Ke as getAllUniqueValues,Se as getAllValues,Pe as getBlanksGradingState,Ur as getClassificationCellGrading,qe as getClassificationGradingState,wi as getCognikitConfig,yi as getCognikitThemePresets,ha as getDNDGradingState,De as getHighlightGradingState,fi as getInteraction,$a as getInteractionRegistry,jr as getLookupCellGrading,Yr as getNaryCellGrading,wt as getTransformationGradingState,Aa as listInteractions,cl as lookupTableDataParser,hl as lookupTableDataValidator,Gr as lookupTableGrader,Nr as naryTableGrader,da as parseTextEngineSequential,Zo as parseYamlAssets,zr as recognitionGrader,Hs as recognitionParser,Gs as recognitionValidator,xa as registerBuiltInInteractions,k as registerInteraction,Ci as resetCognikitTheme,$t as resolveCognikitTheme,yt as seriationGrader,va as seriationParser,ba as seriationValidator,Ei as setCognikitTheme,oi as textEngineBaseDataValidator,ri as textEngineBaseGrammarParser,ai as textEngineBlanksDataValidator,Re as textEngineBlanksGrader,ii as textEngineBlanksGrammarParser,si as textEngineClassificationDataValidator,Be as textEngineClassificationGrader,ni as textEngineClassificationGrammarParser,pa as textEngineDNDGrader,ua as textEngineDataValidator,Me as textEngineHighlightGrader,Le as textEngineTransformationGrader,Sa as unregisterInteraction,Xo as validateAndNormalizeAssets};
4672
+ `,this.$progressIcon.classList.remove("score-fail","score-low","score-mid","score-high"),this.$progressBar.classList.remove("score-fail","score-low","score-mid","score-high");let i="";r<=25?i="score-fail":r<=50?i="score-low":r<=75?i="score-mid":i="score-high",this.$progressIcon.classList.add(i),this.$progressBar.classList.add(i)}reset(){this.resetTimer(),this.interaction.implementsProgress||this.$checkBtn.classList.remove("edu-hidden"),this.$scoresBtn.classList.add("edu-hidden"),this.$retryBtn.classList.add("edu-hidden"),this.$progressIcon.classList.remove("score-fail","score-low","score-mid","score-high"),this.$progressBar.classList.remove("score-fail","score-low","score-mid","score-high"),this.animationsManager.animate(this.$progressIcon,"heartbeat"),this.$progressBar.value=0,this.updateProgress(0,this.interaction.progressTracker.total),this.interaction.interactionMechanic==="sequential"&&this.renderRadioNav()}handleRetry(){if(this.$retryBtn.classList.add("edu-hidden"),this.soundManager.playSound("pop"),this.attemptCount++,this.attemptLimit&&this.attemptLimit>0){let t=this.attemptLimit-this.attemptCount+1;this.$attemptsMessage.textContent=`${t} attempt${t!==1?"s":""} remaining`,this.switchScreen("attempts"),setTimeout(()=>{this.switchScreen("interaction"),this.reset(),this.resumeTimer(),this.interaction?.reset(),this.soundManager.playSound("flip")},2e3)}else this.switchScreen("interaction"),this.interaction?.reset()}openPromptDialog(){let t=this.interaction?.config;if(!t)return;this.soundManager.playSound("pop");let r=document.querySelector("edu-dialog#prompt-dialog");r||(r=document.createElement("edu-dialog"),r.id="prompt-dialog",document.body.appendChild(r)),r.title=t.construct||this.interaction?.config.promptModality||"Prompt";let i=document.createElement("edu-media");i.setAttribute("type",t.promptModality),i.setAttribute("data",t.promptData),t.promptDataSpec&&i.setAttribute("spec",t.promptDataSpec),r.innerHTML="",r.appendChild(i),r.open()}switchScreen(t){this.shadowRoot.querySelectorAll(".screen").forEach(r=>{let i=r.getAttribute("data-screen");r.style.display=i===t?"block":"none"}),this.currentScreen=t,console.log(`[Shell] Switched to screen: ${t}`)}startTimer(){this.timerInterval=window.setInterval(()=>{this.remainingSeconds--,this.updateTimerDisplay(),this.remainingSeconds<=0&&(this.stopTimer(),this.handleTimerComplete())},1e3)}stopTimer(){this.timerInterval!==null&&(clearInterval(this.timerInterval),this.timerInterval=null)}getFormattedTime(t){let r=Math.floor(t/60),i=t%60;return`${r}:${i.toString().padStart(2,"0")}`}updateTimerDisplay(){this.$timerEl.textContent=this.getFormattedTime(this.remainingSeconds),this.remainingSeconds===30&&(this.soundManager.playSound("low-time"),this.animationsManager.animate(this.$timerEl,"shake")),delete this.$timerEl.dataset.warning,delete this.$timerEl.dataset.danger,this.remainingSeconds<=10?this.$timerEl.dataset.danger="true":this.remainingSeconds<=30&&(this.$timerEl.dataset.warning="true")}handleTimerComplete(){console.log("[Shell] Timer complete");try{this.interaction.submit()}catch(t){console.error("Auto-submit on timer failed:",t)}this.dispatchEvent(new CustomEvent("shell:timer-complete",{bubbles:!0,composed:!0}))}pauseTimer(){this.stopTimer()}resumeTimer(){this.remainingSeconds>0&&this.timerInterval===null&&this.startTimer()}resetTimer(){this.stopTimer(),this.remainingSeconds=this.interaction.config.timer,this.updateTimerDisplay()}updateVisibility(){let t=this.getAttribute("show-header")!=="false",r=this.getAttribute("show-footer")!=="false";this.$headerEl.style.display=t?"":"none",this.$footerEl.style.display=r?"":"none"}renderRadioNav(){let t=this.interaction&&"slidesCount"in this.interaction?this.interaction.slidesCount:1;this.$radioNav.innerHTML="";for(let r=1;r<=t;r++){let i=document.createElement("input");i.type="radio",i.name="step-nav",i.id=`step-${r}`,r===1&&(i.checked=!0);let o=document.createElement("label");o.htmlFor=`step-${r}`,o.textContent=String(r),this.$radioNav.appendChild(i),this.$radioNav.appendChild(o)}}getContentArea(){return this.$contentEl}};customElements.get("edu-window")||customElements.define("edu-window",he);et();W();export{Ie as AdjacencyTable,we as AssetValidationError,x as BaseInteraction,ae as CategorizeTheWords,Ae as ClassificationMatrix,Qe as EduTable,Je as EduText,de as FillBlanks,he as InteractionsBaseShell,re as ListRecall,$e as LookupTable,te as MCQ,ne as MarkTheWords,_e as NaryChoiceTable,Ee as OpenClassification,pe as RankOrder,se as SequentialCategorizeTheWords,Ce as SequentialClassification,ue as SequentialFillBlanks,oe as SequentialMarkTheWords,ce as SequentialTextTransformation,ke as SimultaneousAssociation,le as TextTransformation,ll as adjacencyTableDataParser,pl as adjacencyTableDataValidator,Vr as adjacencyTableGrader,sl as basicTableDataParser,ul as basicTableDataValidator,Or as classificationTableGrader,Ta as clearInteractionRegistry,He as cognikitThemePresets,Te as compareValues,xi as configureCognikit,bi as createInteraction,tt as defaultCognikitThemeVariables,We as detectCellKind,W as ensureCognikitTheme,Fr as getAdjacencyCellGrading,Ke as getAllUniqueValues,Se as getAllValues,Pe as getBlanksGradingState,Ur as getClassificationCellGrading,qe as getClassificationGradingState,wi as getCognikitConfig,yi as getCognikitThemePresets,ha as getDNDGradingState,De as getHighlightGradingState,fi as getInteraction,$a as getInteractionRegistry,jr as getLookupCellGrading,Yr as getNaryCellGrading,wt as getTransformationGradingState,Aa as listInteractions,cl as lookupTableDataParser,hl as lookupTableDataValidator,Gr as lookupTableGrader,Nr as naryTableGrader,da as parseTextEngineSequential,Zo as parseYamlAssets,zr as recognitionGrader,Hs as recognitionParser,Gs as recognitionValidator,xa as registerBuiltInInteractions,k as registerInteraction,Ci as resetCognikitTheme,$t as resolveCognikitTheme,yt as seriationGrader,va as seriationParser,ba as seriationValidator,Ei as setCognikitTheme,oi as textEngineBaseDataValidator,ri as textEngineBaseGrammarParser,ai as textEngineBlanksDataValidator,Re as textEngineBlanksGrader,ii as textEngineBlanksGrammarParser,si as textEngineClassificationDataValidator,Be as textEngineClassificationGrader,ni as textEngineClassificationGrammarParser,pa as textEngineDNDGrader,ua as textEngineDataValidator,Me as textEngineHighlightGrader,Le as textEngineTransformationGrader,Sa as unregisterInteraction,Xo as validateAndNormalizeAssets};
4596
4673
  /*! Bundled license information:
4597
4674
 
4598
4675
  js-yaml/dist/js-yaml.mjs: