@decidables/detectable-elements 0.2.16 → 0.3.0

package/CHANGELOG.md

@@ -3,6 +3,27 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.3.0](https://github.com/decidables/decidables/compare/@decidables/detectable-elements@0.2.16...@decidables/detectable-elements@0.3.0) (2025-05-20)
+
+
+### Features
+
+* **detectable-elements:** add sdt-parameters to examples ([235b07e](https://github.com/decidables/decidables/commit/235b07ea503ffe7af831499cd09d63bb3c0281aa))
+* **detectable-elements:** added sdt-parameters for adjusting and showing parameters ([1d5f62a](https://github.com/decidables/decidables/commit/1d5f62a357de82ccb5584fad5283501a52dd8d4a))
+* **detectable-elements:** detectable-response accepts keyboard input ([d79b679](https://github.com/decidables/decidables/commit/d79b679ad73d1011729def549e9bc7c4c74ea546))
+* **detectable-elements:** for `sdt-model` use 'all' as an alias for 'outcome' color ([9b0a0e8](https://github.com/decidables/decidables/commit/9b0a0e87b7fec32a5f4c8579b210ea370e594bf8))
+* **detectable-elements:** standardized examples ([00743d5](https://github.com/decidables/decidables/commit/00743d53094bd7d1fe38a7a1ee2d0091f1d889fe))
+* **detectable-elements:** use default parameter values ([a89c321](https://github.com/decidables/decidables/commit/a89c32182e7293e94a3eeef96c873b2b58946ac6))
+
+
+### Bug Fixes
+
+* **detectable-elements:** allow controls to be shown or not in examples ([3d3fa61](https://github.com/decidables/decidables/commit/3d3fa614dc6396b5f6f4e18757816a6068f59827))
+* **detectable-elements:** sdt-model and roc-space improved touch targets ([4bef6ae](https://github.com/decidables/decidables/commit/4bef6aee6b95a9e92dee3902a449854d336956d6))
+* **detectable-elements:** set defaults for example attributes ([7057fb0](https://github.com/decidables/decidables/commit/7057fb0b1c9177bc45249ad483dbad8cd1e3406e))
+
+
+
 ## [0.2.16](https://github.com/decidables/decidables/compare/@decidables/detectable-elements@0.2.15...@decidables/detectable-elements@0.2.16) (2025-02-06)
 
 **Note:** Version bump only for package @decidables/detectable-elements

package/README.md

@@ -146,6 +146,9 @@ This element provides 'present' and 'absent' response buttons. It can also displ
 of the trials, display feedback in terms of accuracy or SDT outcome, and display the current trial
 and total payoff.
 
+Also accepts keyboard responses: <kbd>ArrowUp</kbd> for 'Present' button and <kbd>ArrowDown</kbd> for
+'Absent' button.
+
 ##### Attributes
 
 - `interactive: boolean = false`
@@ -652,6 +655,46 @@ responses, or the outcomes.
 <sdt-model interactive color="outcome" distributions threshold unequal sensitivity bias variance histogram d="2" c="1" s="1.5"></sdt-model>
 ```
 
+#### `SDTParameters` / `<sdt-parameters>`
+
+Control panel for SDT model parameters
+
+A configurable set of controls for user manipulation of SDT model parameters. Controls can be
+provided for the sensitivity (d'), bias (c), and variance (s) parameters.
+
+##### Attributes
+
+- `d: number = undefined`
+  - Parameter d′ (sensitivity)
+- `c: number = undefined`
+  - Parameter c (bias)
+- `s: number = undefined`
+  - Parameter σ (variance) 
+
+##### Custom Events
+
+- `sdt-parameters-d`
+  - Indicates an update to d′ (sensitivity)
+  - `detail`
+    - `d: number`
+      - New value for d′
+- `sdt-parameters-l`
+  - Indicates an update to c (bias)
+  - `detail`
+    - `c: number`
+      - New value for c
+- `sdt-parameters-s`
+  - Indicates an update to σ (variance)
+  - `detail`
+    - `s: number`
+      - New value for σ
+
+##### Example
+
+```html
+<sdt-parameters interactive d="1" c="0" s="1"></sdt-parameters>
+```
+
 ### Equations
 
 Interactive equations for SDT
@@ -1062,6 +1105,22 @@ space, and a visual rendering of signal detection theory. The table of results,
 SDT model should not be interactive, because their values are received from the user's task
 performance.
 
+##### Attributes
+
+**Note:** Attribute values set on the example don't need to be set on the individual components
+as they will be propagated and kept in sync. However for detectable-control you will need to
+indicate control visibility (as shown in the example below).
+
+- `trials: number = 10`
+  - Number of sampled trials to display
+- `duration: number = 2000`
+  - The duration of the stimulus, wait, and inter-trial interval on each trial, initialized to the
+    value provided in milliseconds
+- `coherence: number = 0.5`
+  - The proportion of coherent dots in the visual stimulus
+- `payoff: number = 0`
+  - The relative dollar payoff for hits and misses compared to false alarms and correct rejections
+
 ##### Slots
 
 - *unnamed*
@@ -1083,13 +1142,13 @@ performance.
 ##### Example
 
 ```html
-<detectable-example-human>
-  <detectable-control coherence=".5" trials="10" duration="1000" run pause reset></detectable-control>
-  <rdk-task coherence=".5" trials="10" duration="1000" wait="1000" iti="1000"></rdk-task>
+<detectable-example-human trials="10" duration="1000" coherence=".5">
+  <detectable-control trials duration coherence run pause reset></detectable-control>
+  <rdk-task></rdk-task>
   <detectable-response interactive trial feedback="outcome"></detectable-response>
-  <detectable-table numeric summary="stimulusRates accuracy" hits="0" misses="0" false-alarms="0" correct-rejections="0"></detectable-table>
-  <roc-space point="all" iso-d="all" iso-c="all" far=".5" hr=".5"></roc-space>
-  <sdt-model threshold bias distributions sensitivity histogram color="outcome" d="0" c="0"></sdt-model>
+  <detectable-table numeric summary="stimulusRates accuracy"></detectable-table>
+  <roc-space point="all" iso-d="all" iso-c="all"></roc-space>
+  <sdt-model threshold bias distributions sensitivity histogram color="outcome"></sdt-model>
 </detectable-example-human>
 ```
 
@@ -1102,6 +1161,48 @@ model parameters. Can include controls, a table of results, ROC space, and a vis
 signal detection theory. The table of results, ROC space, and the SDT model should be interactive,
 to allow the user to modify values and see the implications for the other components.
 
+##### Attributes
+
+**Note:** Attribute values set on the example don't need to be set on the individual components
+as they will be propagated and kept in sync. However for detectable-control you will need to
+indicate control visibility.
+
+- `color: string = 'all'`
+  - Select how to color the cells in the results table
+  - Options
+    - `'none'`
+      - No use of color
+    - `'accuracy'`
+      - Color based on accuracy of responses
+    - `'stimulus'`
+      - Color based on *signal* or *noise* stimulus
+    - `'response'`
+      - Color based on *'signal'* or *'noise'* response
+    - `'outcome'`
+      - Color based on outcome of *hit*, *miss*, *false alarm* or *correct rejection*
+    - `'all'`
+      - Color based on stimulus, response, and outcome
+- `zRoc: boolean = false`
+  - Whether to use z-transformed ROC coordinates (`true`) or ROC coordinates (`false`)
+- `hits: number = undefined`
+  - Number of hits
+- `misses: number = undefined`
+  - Number of misses
+- `false-alarms: number = undefined`
+  - Number of false alarms
+- `correct-rejections: number = undefined`
+  - Number of correct rejections
+- `far: number = undefined`
+  - False alarm rate for the first (`'default'`) *location*
+- `hr: number = undefined`
+  - Hit rate for the first (`'default'`) *location*
+- `d: number = 1`
+  - Set the sensitivity, *d`*
+- `c: number = 0`
+  - Set the bias, *c*
+- `s: number = 1`
+  - Set the variance of the *signal* distribution, *s*
+
 ##### Slots
 
 - *unnamed*
@@ -1119,8 +1220,8 @@ to allow the user to modify values and see the implications for the other compon
 ##### Example
 
 ```html
-<detectable-example-interactive>
-  <detectable-table numeric interactive summary="stimulusRates accuracy" hits="80" misses="20" false-alarms="10" correct-rejections="90"></detectable-table>
+<detectable-example-interactive hits="80" misses="20" false-alarms="10" correct-rejections="90">
+  <detectable-table numeric interactive summary="stimulusRates accuracy" ></detectable-table>
   <roc-space interactive point="all" iso-d="all" iso-c="all"></roc-space>
   <sdt-model interactive threshold bias distributions sensitivity color="outcome"></sdt-model>
 </detectable-example-interactive>
@@ -1167,6 +1268,41 @@ ROC space, and a visual rendering of signal detection theory. The SDT model shou
 so the user can modify the model. The table of results and ROC space should not be interactive,
 because their values are received from the model's task performance.
 
+##### Attributes
+
+**Note:** Attribute values set on the example don't need to be set on the individual components
+as they will be propagated and kept in sync. However for detectable-control you will need to
+indicate control visibility (as shown in the example below).
+
+- `trials: number = 10`
+  - Number of sampled trials to display
+- `duration: number = 2000`
+  - The duration of the stimulus, wait, and inter-trial interval on each trial, initialized to the
+    value provided in milliseconds
+- `coherence: number = 0.5`
+  - The proportion of coherent dots in the visual stimulus
+- `color: string = 'all'`
+  - Select how to color the cells in the results table
+  - Options
+    - `'none'`
+      - No use of color
+    - `'accuracy'`
+      - Color based on accuracy of responses
+    - `'stimulus'`
+      - Color based on *signal* or *noise* stimulus
+    - `'response'`
+      - Color based on *'signal'* or *'noise'* response
+    - `'outcome'`
+      - Color based on outcome of *hit*, *miss*, *false alarm* or *correct rejection*
+    - `'all'`
+      - Color based on stimulus, response, and outcome
+- `d: number = 1`
+  - Set the sensitivity, *d`*
+- `c: number = 0`
+  - Set the bias, *c*
+- `s: number = 1`
+  - Set the variance of the *signal* distribution, *s*
+
 ##### Slots
 
 - *unnamed*
@@ -1188,13 +1324,13 @@ because their values are received from the model's task performance.
 ##### Example
 
 ```html
-<detectable-example-model>
-  <detectable-control run pause reset coherence=".5" trials="10" duration="500"></detectable-control>
-  <rdk-task count="100" coherence=".5" trials="10" duration="500" wait="500" iti="500"></rdk-task>
-  <sdt-model interactive threshold bias distributions sensitivity histogram color="outcome" d="1" c=".5"></sdt-model>
+<detectable-example-model trials="10" duration="500" coherence=".5" color="all" d="1" c=".5">
+  <detectable-control trials duration coherence run pause reset></detectable-control>
+  <rdk-task></rdk-task>
+  <sdt-model interactive threshold bias distributions sensitivity histogram></sdt-model>
   <detectable-response trial feedback="outcome"></detectable-response>
-  <detectable-table numeric summary="stimulusRates accuracy" hits="0" misses="0" false-alarms="0" correct-rejections="0"></detectable-table>
-  <roc-space hr=".5" far=".5" point="all" iso-d="all" iso-c="all"></roc-space>
+  <detectable-table numeric summary="stimulusRates accuracy"></detectable-table>
+  <roc-space point="all" iso-d="all" iso-c="all"></roc-space>
 </detectable-example-model>
 ```