jspsych-tangram 0.0.10 → 0.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/construct/index.browser.js +3881 -4521
  2. package/dist/construct/index.browser.js.map +1 -1
  3. package/dist/construct/index.browser.min.js +13 -13
  4. package/dist/construct/index.browser.min.js.map +1 -1
  5. package/dist/construct/index.cjs +21 -9
  6. package/dist/construct/index.cjs.map +1 -1
  7. package/dist/construct/index.js +21 -9
  8. package/dist/construct/index.js.map +1 -1
  9. package/dist/index.cjs +23 -12
  10. package/dist/index.cjs.map +1 -1
  11. package/dist/index.js +23 -12
  12. package/dist/index.js.map +1 -1
  13. package/dist/nback/index.browser.js +3897 -4517
  14. package/dist/nback/index.browser.js.map +1 -1
  15. package/dist/nback/index.browser.min.js +12 -12
  16. package/dist/nback/index.browser.min.js.map +1 -1
  17. package/dist/nback/index.cjs +39 -7
  18. package/dist/nback/index.cjs.map +1 -1
  19. package/dist/nback/index.js +39 -7
  20. package/dist/nback/index.js.map +1 -1
  21. package/dist/prep/index.browser.js +3883 -4521
  22. package/dist/prep/index.browser.js.map +1 -1
  23. package/dist/prep/index.browser.min.js +13 -13
  24. package/dist/prep/index.browser.min.js.map +1 -1
  25. package/dist/prep/index.cjs +24 -10
  26. package/dist/prep/index.cjs.map +1 -1
  27. package/dist/prep/index.js +24 -10
  28. package/dist/prep/index.js.map +1 -1
  29. package/package.json +1 -1
  30. package/src/core/components/board/GameBoard.tsx +102 -89
  31. package/src/plugins/tangram-nback/NBackApp.tsx +2 -3
  32. package/tangram-construct.min.js +13 -13
  33. package/tangram-nback.min.js +12 -12
  34. package/tangram-prep.min.js +13 -13
package/dist/index.cjs CHANGED
@@ -14,8 +14,9 @@ const CONFIG = {
14
14
  completion: { fill: "#ccfff2", stroke: "#13da57" },
15
15
  silhouetteMask: "#374151",
16
16
  anchors: { invalid: "#7dd3fc", valid: "#475569" },
17
- piece: { draggingFill: "#8e7cc3ff", validFill: "#8e7cc3ff", invalidFill: "#ef4444", allGreenStroke: "#86efac"},
18
- blueprint: { fill: "#374151", badgeFill: "#000000", labelFill: "#ffffff" },
17
+ piece: { draggingFill: "#8e7cc3ff", validFill: "#8e7cc3ff", invalidFill: "#ef4444", invalidStroke: "#dc2626", selectedStroke: "#674ea7", allGreenStroke: "#86efac", borderStroke: "#674ea7" },
18
+ ui: { light: "#60a5fa", dark: "#1d4ed8" },
19
+ blueprint: { fill: "#374151", selectedStroke: "#111827", badgeFill: "#000000", labelFill: "#ffffff" },
19
20
  tangramDecomposition: { stroke: "#fef2cc" }
20
21
  },
21
22
  opacity: {
@@ -26,7 +27,7 @@ const CONFIG = {
26
27
  piece: { invalid: 0.35, dragging: 0.75, locked: 1, normal: 1 }
27
28
  },
28
29
  size: {
29
- stroke: { bandPx: 5, allGreenStrokePx: 10, tangramDecompositionPx: 1 },
30
+ stroke: { bandPx: 5, pieceSelectedPx: 3, allGreenStrokePx: 10, pieceBorderPx: 2, tangramDecompositionPx: 1 },
30
31
  anchorRadiusPx: { valid: 1, invalid: 1 },
31
32
  badgeFontPx: 16,
32
33
  centerBadge: { fractionOfOuterR: 0.15, minPx: 20, marginPx: 4 }
@@ -46,7 +47,9 @@ const CONFIG = {
46
47
  },
47
48
  game: {
48
49
  snapRadiusPx: 15,
49
- showBorders: false}
50
+ showBorders: false,
51
+ hideTouchingBorders: true
52
+ }
50
53
  };
51
54
 
52
55
  function isComposite(bp) {
@@ -3272,19 +3275,28 @@ function GameBoard(props) {
3272
3275
  const headerStyle = {
3273
3276
  display: "flex",
3274
3277
  flexDirection: "row",
3275
- justifyContent: "space-between",
3278
+ justifyContent: "center",
3276
3279
  alignItems: "center",
3277
3280
  padding: "20px",
3278
3281
  background: "#f5f5f5",
3279
3282
  flex: "0 0 auto"
3280
3283
  };
3284
+ const headerContentStyle = {
3285
+ position: "relative",
3286
+ width: `${svgDimensions.width}px`,
3287
+ maxWidth: "100%",
3288
+ display: "flex",
3289
+ justifyContent: "center",
3290
+ alignItems: "center"
3291
+ };
3281
3292
  const instructionsStyle = {
3282
- flexGrow: 1,
3283
3293
  fontSize: "20px",
3284
3294
  lineHeight: 1.5,
3285
- marginRight: "20px"
3295
+ textAlign: "center"
3286
3296
  };
3287
3297
  const timerStyle = {
3298
+ position: "absolute",
3299
+ right: 0,
3288
3300
  fontSize: "24px",
3289
3301
  fontWeight: "bold",
3290
3302
  fontFamily: "monospace",
@@ -3299,14 +3311,14 @@ function GameBoard(props) {
3299
3311
  justifyContent: "center",
3300
3312
  overflow: "hidden"
3301
3313
  };
3302
- return /* @__PURE__ */ React.createElement("div", { className: "tangram-trial-container", style: containerStyle }, (instructions || timeLimitMs > 0) && /* @__PURE__ */ React.createElement("div", { className: "tangram-header", style: headerStyle }, instructions && /* @__PURE__ */ React.createElement(
3314
+ return /* @__PURE__ */ React.createElement("div", { className: "tangram-trial-container", style: containerStyle }, (instructions || timeLimitMs > 0) && /* @__PURE__ */ React.createElement("div", { className: "tangram-header", style: headerStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-header-content", style: headerContentStyle }, instructions && /* @__PURE__ */ React.createElement(
3303
3315
  "div",
3304
3316
  {
3305
3317
  className: "tangram-instructions",
3306
3318
  style: instructionsStyle,
3307
3319
  dangerouslySetInnerHTML: { __html: instructions }
3308
3320
  }
3309
- ), timeLimitMs > 0 && /* @__PURE__ */ React.createElement("div", { className: "tangram-timer", style: timerStyle }, formatTime(timeRemaining))), /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard-wrapper", style: gameboardWrapperStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard", style: getGameboardStyle() }, /* @__PURE__ */ React.createElement(
3321
+ ), timeLimitMs > 0 && /* @__PURE__ */ React.createElement("div", { className: "tangram-timer", style: timerStyle }, formatTime(timeRemaining)))), /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard-wrapper", style: gameboardWrapperStyle }, /* @__PURE__ */ React.createElement("div", { className: "tangram-gameboard", style: getGameboardStyle() }, /* @__PURE__ */ React.createElement(
3310
3322
  BoardView,
3311
3323
  {
3312
3324
  controller,
@@ -4087,9 +4099,8 @@ function NBackView({ params }) {
4087
4099
  display: "flex",
4088
4100
  flexDirection: "column",
4089
4101
  alignItems: "center",
4090
- justifyContent: "flex-start",
4091
- minHeight: "100vh",
4092
- padding: "40px 20px",
4102
+ justifyContent: "center",
4103
+ padding: "20px",
4093
4104
  background: "#f5f5f5"
4094
4105
  } }, instructions && /* @__PURE__ */ React.createElement(
4095
4106
  "div",