@decidables/accumulable-elements 0.3.7 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@decidables/accumulable-elements",
3
- "version": "0.3.7",
3
+ "version": "0.4.0",
4
4
  "description": "accumulable-elements: Web Components for visualizing the Diffusion Decision Model",
5
5
  "keywords": [
6
6
  "web component",
@@ -46,6 +46,7 @@
46
46
  "lib"
47
47
  ],
48
48
  "scripts": {
49
+ "clean": "gulp clean",
49
50
  "lint": "gulp lint",
50
51
  "test": "gulp test -X \"$@\"",
51
52
  "build": "gulp build"
@@ -54,13 +55,13 @@
54
55
  "gulp": "^5.0.1"
55
56
  },
56
57
  "dependencies": {
57
- "@decidables/accumulable-math": "^0.2.5",
58
- "@decidables/decidables-elements": "^0.5.6",
59
- "@lit-labs/motion": "^1.0.9",
58
+ "@decidables/accumulable-math": "^0.2.6",
59
+ "@decidables/decidables-elements": "^0.6.0",
60
+ "@lit-labs/motion": "^1.1.0",
60
61
  "@observablehq/plot": "^0.6.17",
61
62
  "bayes.js": "https://github.com/akrawitz/bayes.js.git#commit=c7b091b75f85a86b6a3965a983b31e23d9ef456f",
62
63
  "d3": "^7.9.0",
63
- "lit": "^3.3.1"
64
+ "lit": "^3.3.2"
64
65
  },
65
- "gitHead": "8c39b095d6cc3cf6a5f49457048bebf53e7158c1"
66
+ "gitHead": "72981c711111354170ece1e403d497073da7be96"
66
67
  }
@@ -304,6 +304,7 @@ export default class AccumulableResponse extends AccumulableElement {
304
304
 
305
305
  width: 6rem;
306
306
  height: 3.5rem;
307
+
307
308
  padding: 0.375rem 0.75rem;
308
309
  margin: 0.25rem;
309
310
 
@@ -332,6 +333,7 @@ export default class AccumulableResponse extends AccumulableElement {
332
333
 
333
334
  .feedback .outcome {
334
335
  font-weight: 600;
336
+
335
337
  line-height: 1.15;
336
338
  }
337
339
 
@@ -246,6 +246,7 @@ export default class AccumulableTable extends AccumulableElement {
246
246
  /* Labels */
247
247
  .payoff {
248
248
  font-weight: 600;
249
+
249
250
  line-height: 0.75rem;
250
251
  }
251
252
 
@@ -410,8 +410,9 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
410
410
  }
411
411
 
412
412
  .path.highlight .curve {
413
- filter: url("#shadow-2");
414
413
  opacity: 1;
414
+
415
+ filter: url("#shadow-2");
415
416
  }
416
417
 
417
418
  .path.correct .curve {
@@ -487,8 +488,9 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
487
488
 
488
489
  .boundary.interactive,
489
490
  .t0z.interactive {
490
- filter: url("#shadow-2");
491
491
  outline: none;
492
+
493
+ filter: url("#shadow-2");
492
494
  }
493
495
 
494
496
  .boundary.interactive:hover,
@@ -508,8 +510,8 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
508
510
  transform: translateY(0);
509
511
  }
510
512
 
511
- :host(.keyboard) .boundary.interactive:focus,
512
- :host(.keyboard) .t0z.interactive:focus {
513
+ .boundary.interactive:focus-visible,
514
+ .t0z.interactive:focus-visible {
513
515
  filter: url("#shadow-8");
514
516
 
515
517
  /* HACK: This gets Safari to correctly apply the filter! */
@@ -528,15 +530,15 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
528
530
 
529
531
  fill: none;
530
532
  stroke: var(---color-element-emphasis);
531
- stroke-dasharray: 8 4;
532
533
  stroke-width: 2;
534
+ stroke-dasharray: 8 4;
533
535
  }
534
536
 
535
537
  .drift.interactive {
536
538
  cursor: ns-resize;
539
+ outline: none;
537
540
 
538
541
  filter: url("#shadow-2");
539
- outline: none;
540
542
 
541
543
  /* HACK: This gets Safari to correctly apply the filter! */
542
544
  fill: #000000;
@@ -557,7 +559,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
557
559
  fill: #00ff00;
558
560
  }
559
561
 
560
- :host(.keyboard) .drift.interactive:focus {
562
+ .drift.interactive:focus-visible {
561
563
  filter: url("#shadow-8");
562
564
 
563
565
  /* HACK: This gets Safari to correctly apply the filter! */
@@ -571,14 +573,14 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
571
573
  /* Make larger targets for touch users */
572
574
  .interactive .touch {
573
575
  stroke: #000000;
574
- stroke-dasharray: none;
575
576
  stroke-opacity: 0;
577
+ stroke-dasharray: none;
576
578
  }
577
579
 
578
580
  @media (pointer: coarse) {
579
581
  .interactive .touch {
580
- stroke-linecap: round;
581
582
  stroke-width: 12;
583
+ stroke-linecap: round;
582
584
  }
583
585
  }
584
586
 
@@ -603,6 +605,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
603
605
 
604
606
  .measure.a .label {
605
607
  dominant-baseline: auto;
608
+
606
609
  text-anchor: end;
607
610
  }
608
611
 
@@ -614,6 +617,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
614
617
  /* Hack to avoid Safari weirdness */
615
618
  .measure.z .label tspan {
616
619
  dominant-baseline: hanging;
620
+
617
621
  text-anchor: start;
618
622
  }
619
623
 
@@ -623,6 +627,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
623
627
 
624
628
  .measure.v .label {
625
629
  dominant-baseline: auto;
630
+
626
631
  text-anchor: start;
627
632
  }
628
633
 
@@ -632,6 +637,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
632
637
 
633
638
  .measure.t0 .label {
634
639
  dominant-baseline: auto;
640
+
635
641
  text-anchor: middle;
636
642
  }
637
643
 
@@ -108,6 +108,7 @@ export default class DDMParameters extends AccumulableElement {
108
108
 
109
109
  decidables-slider {
110
110
  line-height: 1;
111
+
111
112
  text-align: center;
112
113
  }
113
114
 
@@ -86,11 +86,13 @@ export default class DDMEquation extends AccumulableElement {
86
86
 
87
87
  .addend {
88
88
  position: relative;
89
+
89
90
  display: inline-block;
90
91
  }
91
92
 
92
93
  .comparison {
93
94
  position: relative;
95
+
94
96
  display: inline-block;
95
97
 
96
98
  font-size: 125%;