@decidables/accumulable-elements 0.3.8 → 0.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decidables/accumulable-elements",
-  "version": "0.3.8",
+  "version": "0.4.0",
   "description": "accumulable-elements: Web Components for visualizing the Diffusion Decision Model",
   "keywords": [
     "web component",
@@ -46,6 +46,7 @@
     "lib"
   ],
   "scripts": {
+    "clean": "gulp clean",
     "lint": "gulp lint",
     "test": "gulp test -X \"$@\"",
     "build": "gulp build"
@@ -54,13 +55,13 @@
     "gulp": "^5.0.1"
   },
   "dependencies": {
-    "@decidables/accumulable-math": "^0.2.5",
-    "@decidables/decidables-elements": "^0.5.7",
+    "@decidables/accumulable-math": "^0.2.6",
+    "@decidables/decidables-elements": "^0.6.0",
     "@lit-labs/motion": "^1.1.0",
     "@observablehq/plot": "^0.6.17",
     "bayes.js": "https://github.com/akrawitz/bayes.js.git#commit=c7b091b75f85a86b6a3965a983b31e23d9ef456f",
     "d3": "^7.9.0",
     "lit": "^3.3.2"
   },
-  "gitHead": "6fcd31a19c082ec41bde7d351bcb52161c5b654b"
+  "gitHead": "72981c711111354170ece1e403d497073da7be96"
 }

package/src/components/accumulable-response.js

@@ -304,6 +304,7 @@ export default class AccumulableResponse extends AccumulableElement {
 
           width: 6rem;
           height: 3.5rem;
+
           padding: 0.375rem 0.75rem;
           margin: 0.25rem;
 
@@ -332,6 +333,7 @@ export default class AccumulableResponse extends AccumulableElement {
 
         .feedback .outcome {
           font-weight: 600;
+
           line-height: 1.15;
         }
 

package/src/components/accumulable-table.js

@@ -246,6 +246,7 @@ export default class AccumulableTable extends AccumulableElement {
         /* Labels */
         .payoff {
           font-weight: 600;
+
           line-height: 0.75rem;
         }
 

package/src/components/ddm-model.js

@@ -410,8 +410,9 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
         }
 
         .path.highlight .curve {
-          filter: url("#shadow-2");
           opacity: 1;
+
+          filter: url("#shadow-2");
         }
 
         .path.correct .curve {
@@ -487,8 +488,9 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
 
         .boundary.interactive,
         .t0z.interactive {
-          filter: url("#shadow-2");
           outline: none;
+
+          filter: url("#shadow-2");
         }
 
         .boundary.interactive:hover,
@@ -508,8 +510,8 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
           transform: translateY(0);
         }
 
-        :host(.keyboard) .boundary.interactive:focus,
-        :host(.keyboard) .t0z.interactive:focus {
+        .boundary.interactive:focus-visible,
+        .t0z.interactive:focus-visible {
           filter: url("#shadow-8");
 
           /* HACK: This gets Safari to correctly apply the filter! */
@@ -528,15 +530,15 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
 
           fill: none;
           stroke: var(---color-element-emphasis);
-          stroke-dasharray: 8 4;
           stroke-width: 2;
+          stroke-dasharray: 8 4;
         }
 
         .drift.interactive {
           cursor: ns-resize;
+          outline: none;
 
           filter: url("#shadow-2");
-          outline: none;
 
           /* HACK: This gets Safari to correctly apply the filter! */
           fill: #000000;
@@ -557,7 +559,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
           fill: #00ff00;
         }
 
-        :host(.keyboard) .drift.interactive:focus {
+        .drift.interactive:focus-visible {
           filter: url("#shadow-8");
 
           /* HACK: This gets Safari to correctly apply the filter! */
@@ -571,14 +573,14 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
         /* Make larger targets for touch users */
         .interactive .touch {
           stroke: #000000;
-          stroke-dasharray: none;
           stroke-opacity: 0;
+          stroke-dasharray: none;
         }
 
         @media (pointer: coarse) {
           .interactive .touch {
-            stroke-linecap: round;
             stroke-width: 12;
+            stroke-linecap: round;
           }
         }
 
@@ -603,6 +605,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
 
         .measure.a .label {
           dominant-baseline: auto;
+
           text-anchor: end;
         }
 
@@ -614,6 +617,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
         /* Hack to avoid Safari weirdness */
         .measure.z .label tspan {
           dominant-baseline: hanging;
+
           text-anchor: start;
         }
 
@@ -623,6 +627,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
 
         .measure.v .label {
           dominant-baseline: auto;
+
           text-anchor: start;
         }
 
@@ -632,6 +637,7 @@ export default class DDMModel extends DecidablesMixinResizeable(AccumulableEleme
 
         .measure.t0 .label {
           dominant-baseline: auto;
+
           text-anchor: middle;
         }
 

package/src/components/ddm-parameters.js

@@ -108,6 +108,7 @@ export default class DDMParameters extends AccumulableElement {
 
         decidables-slider {
           line-height: 1;
+
           text-align: center;
         }
 

package/src/equations/ddm-equation.js

@@ -86,11 +86,13 @@ export default class DDMEquation extends AccumulableElement {
 
         .addend {
           position: relative;
+
           display: inline-block;
         }
 
         .comparison {
           position: relative;
+
           display: inline-block;
 
           font-size: 125%;