@flopay/ui 0.4.0 → 0.5.0

package/README.md

@@ -75,6 +75,58 @@ The primitives render the shared component classes, so they work in plain-CSS
 apps (which import `components.css`) and in Tailwind apps (where you can extend
 them via `className` + `cn()`).
 
+### 4. Annotation layer
+
+Hand-drawn marker notes and arrows drawn over a UI, for guided demos and
+product tours. Opt-in, because the arrow geometry is a few KB most pages don't
+need:
+
+```css
+/* app/globals.css */
+@import "@flopay/ui/styles/annotations.css";
+```
+
+```tsx
+import { type Annotation, AnnotationStage } from "@flopay/ui/annotations";
+
+const notes: readonly Annotation[] = [
+  {
+    id: "email",
+    text: "Pop your email in — we'll send your receipt here",
+    arrow: "squiggle-right",
+    pos: { top: "60%", left: "-56px" },   // the note, within the stage
+    posArrow: { left: "18px" },            // nudge the arrow alone
+    tilt: -5,                              // note + arrow, hand-placed feel
+  },
+];
+
+<AnnotationStage annotations={notes}>
+  <YourCheckoutForm />
+</AnnotationStage>;
+```
+
+`AnnotationStage` renders both treatments and picks one: floating notes when
+there's room in the margins, and a plain readable list below the content when
+there isn't. The floating layer is `aria-hidden`, so the list is what assistive
+tech announces — annotations are never lost to a screen reader.
+
+**22 arrow variants** — six calm directional ones (`down-right`, `up-left`,
+`right`, …) plus an expressive set (`loop-right`, `squiggle-left`,
+`s-curve-down`, `zigzag-right`, `hook-left`, `curl-down`, …). Each is a filled
+outline with a tapered width profile and a solid head, generated by
+`scripts/gen-arrow-paths.py` rather than hand-authored — edit the control
+points there and re-run, don't touch `arrow-paths.ts`.
+
+One curve covers many directions: `rotate` re-aims it, `flipH` / `flipV`
+mirror it, and `arrowScale` lengthens its reach — all on the arrow only,
+leaving the note's text upright. Those are visual transforms, so a re-aimed
+arrow overhangs its layout box and its `pos` usually wants re-checking.
+
+Colour and face come from `--annotation-ink` (brand blue) and
+`--annotation-font` (a handwriting stack); override either per app. The
+floating/list switch is a `@media (min-width: 1120px)` rule sized for a ~720px
+content box — apps in a constrained layout should re-declare that one block.
+
 ## Design tokens
 
 `styles/tokens.css` defines surfaces, borders, text, accent, **brand

package/dist/annotations/index.cjs

@@ -0,0 +1,223 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/annotations/index.ts
+var annotations_exports = {};
+__export(annotations_exports, {
+  ARROWS: () => ARROWS,
+  AnnotationLayer: () => AnnotationLayer,
+  AnnotationList: () => AnnotationList,
+  AnnotationStage: () => AnnotationStage
+});
+module.exports = __toCommonJS(annotations_exports);
+
+// src/cn.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/annotations/arrow-paths.ts
+var ARROWS = {
+  "down-right": {
+    box: "0 0 120 84",
+    shaft: "M7.2 10Q12 9.2 14.4 9Q16.8 8.8 19.2 8.7Q21.6 8.5 23.9 8.5Q26.2 8.5 28.5 8.7Q30.8 8.8 33.1 9Q35.3 9.2 37.5 9.5Q39.7 9.9 41.9 10.3Q44.1 10.7 46.2 11.2Q48.3 11.7 50.3 12.3Q52.4 12.9 54.4 13.7Q56.4 14.4 58.3 15.2Q60.3 16 62.1 16.9Q64 17.8 65.8 18.8Q67.7 19.8 69.4 20.9Q71.2 22 72.8 23.2Q74.5 24.4 76.1 25.8Q77.7 27.1 79.2 28.6Q80.7 30.1 82.2 31.7Q83.6 33.3 84.9 35Q86.2 36.8 87.4 38.6Q88.6 40.5 89.7 42.5Q90.8 44.5 91.7 46.6Q92.7 48.7 93.4 51Q94.2 53.3 94.8 55.7Q95.4 58.1 95.9 60.6Q96.4 63.1 97 63Q97.6 62.9 97.1 60.3Q96.7 57.8 96 55.4Q95.4 52.9 94.6 50.6Q93.9 48.3 93 46.1Q92.2 43.8 91.2 41.7Q90.2 39.6 89.1 37.6Q88 35.6 86.8 33.7Q85.6 31.8 84.3 30Q82.9 28.2 81.5 26.5Q80 24.8 78.5 23.2Q76.9 21.7 75.2 20.2Q73.6 18.8 71.8 17.5Q70 16.1 68.1 14.9Q66.2 13.7 64.3 12.7Q62.3 11.6 60.2 10.7Q58.2 9.8 56 9Q53.9 8.2 51.7 7.6Q49.5 7 47.2 6.5Q45 6 42.7 5.7Q40.4 5.3 38 5.2Q35.7 5 33.3 4.9Q31 4.8 28.6 4.9Q26.2 5 23.8 5.2Q21.3 5.4 18.9 5.7Q16.5 6 14.1 6.5Q11.6 6.9 9.2 7.5L6.8 8Z",
+    head: "M97.5 66.5Q91.2 60 84.9 47.2Q95.3 52.3 102.8 44.4Q101.1 58.5 97.5 66.5Z"
+  },
+  "down-left": {
+    box: "0 0 120 84",
+    shaft: "M113.2 8Q108.4 6.9 105.9 6.4Q103.5 6 101.1 5.7Q98.7 5.4 96.2 5.2Q93.8 5 91.4 5Q89.1 4.9 86.7 5Q84.3 5.1 82 5.3Q79.6 5.6 77.4 5.9Q75.1 6.3 72.8 6.8Q70.6 7.3 68.4 8Q66.2 8.6 64.1 9.4Q62 10.2 59.9 11.1Q57.9 12 55.9 13.1Q54 14.1 52.1 15.3Q50.2 16.4 48.4 17.7Q46.6 19 44.9 20.4Q43.3 21.9 41.7 23.4Q40.1 24.9 38.6 26.6Q37.1 28.2 35.8 30Q34.4 31.8 33.1 33.6Q31.9 35.5 30.8 37.5Q29.7 39.5 28.7 41.7Q27.7 43.8 26.9 46Q26 48.2 25.3 50.6Q24.5 52.9 23.9 55.3Q23.3 57.8 22.8 60.3Q22.4 62.9 23 63Q23.6 63.1 24.1 60.6Q24.6 58.1 25.3 55.7Q25.9 53.3 26.7 51Q27.4 48.8 28.4 46.6Q29.3 44.5 30.4 42.5Q31.5 40.5 32.7 38.7Q33.8 36.8 35.1 35Q36.4 33.3 37.8 31.7Q39.2 30 40.7 28.5Q42.2 27 43.7 25.6Q45.3 24.3 47 23Q48.6 21.7 50.4 20.6Q52.1 19.4 54 18.4Q55.8 17.4 57.7 16.5Q59.6 15.6 61.5 14.8Q63.5 13.9 65.5 13.3Q67.5 12.6 69.6 12Q71.6 11.4 73.8 10.9Q75.9 10.4 78.1 10Q80.2 9.6 82.4 9.4Q84.7 9.1 86.9 8.9Q89.2 8.7 91.5 8.6Q93.8 8.5 96.1 8.5Q98.4 8.6 100.8 8.7Q103.2 8.8 105.6 9Q108 9.3 110.4 9.6L112.8 10Z",
+    head: "M22.5 66.5Q18.4 58.4 16.3 44.2Q24.7 52.3 34.1 47Q28.2 59.9 22.5 66.5Z"
+  },
+  "up-right": {
+    box: "0 0 120 84",
+    shaft: "M6.8 76Q11.7 77.1 14.1 77.5Q16.5 77.9 18.9 78.2Q21.4 78.5 23.8 78.6Q26.2 78.8 28.6 78.8Q30.9 78.9 33.3 78.8Q35.7 78.7 38 78.4Q40.3 78.2 42.6 77.9Q44.9 77.5 47.1 77Q49.4 76.5 51.6 75.9Q53.8 75.3 55.9 74.6Q58 73.8 60.1 73Q62.1 72.1 64.1 71.1Q66.1 70.1 68 68.9Q69.9 67.8 71.8 66.5Q73.6 65.2 75.3 63.8Q77 62.4 78.6 60.9Q80.2 59.4 81.7 57.7Q83.2 56 84.5 54.2Q85.9 52.4 87.1 50.5Q88.3 48.6 89.4 46.6Q90.5 44.6 91.5 42.4Q92.4 40.3 93.3 38Q94.1 35.8 94.8 33.5Q95.5 31.1 96.1 28.7Q96.7 26.2 97.2 23.7Q97.6 21.1 97 21Q96.4 20.9 95.9 23.4Q95.4 25.9 94.7 28.3Q94.1 30.7 93.3 32.9Q92.5 35.2 91.5 37.3Q90.5 39.4 89.4 41.4Q88.3 43.4 87.1 45.2Q85.9 47.1 84.6 48.8Q83.3 50.5 81.9 52.1Q80.5 53.7 79 55.2Q77.6 56.7 76 58.1Q74.4 59.4 72.8 60.7Q71.1 62 69.4 63.2Q67.7 64.3 65.9 65.4Q64.1 66.4 62.3 67.4Q60.4 68.3 58.5 69.2Q56.5 70 54.5 70.8Q52.5 71.5 50.5 72.1Q48.4 72.7 46.3 73.3Q44.2 73.8 42 74.2Q39.8 74.6 37.6 74.9Q35.4 75.2 33.1 75.4Q30.8 75.5 28.5 75.6Q26.2 75.7 23.9 75.6Q21.5 75.6 19.2 75.5Q16.8 75.3 14.4 75Q12 74.8 9.6 74.4L7.2 74Z",
+    head: "M97.5 17.5Q101.6 25.6 103.7 39.8Q95.3 31.7 85.9 37Q91.8 24.1 97.5 17.5Z"
+  },
+  "up-left": {
+    box: "0 0 120 84",
+    shaft: "M112.8 74Q108 74.8 105.6 75.1Q103.2 75.3 100.8 75.4Q98.5 75.6 96.1 75.6Q93.8 75.6 91.5 75.5Q89.2 75.4 86.9 75.2Q84.7 75 82.4 74.6Q80.2 74.3 78.1 73.9Q75.9 73.4 73.8 72.9Q71.7 72.4 69.7 71.7Q67.6 71.1 65.6 70.4Q63.6 69.6 61.7 68.8Q59.8 68 57.9 67Q56.1 66.1 54.3 65.1Q52.5 64.1 50.7 62.9Q49 61.8 47.3 60.6Q45.7 59.3 44.1 58Q42.5 56.7 41 55.2Q39.5 53.7 38 52.1Q36.6 50.6 35.3 48.8Q34 47.1 32.8 45.3Q31.5 43.4 30.4 41.5Q29.3 39.5 28.4 37.4Q27.4 35.2 26.6 33Q25.8 30.7 25.2 28.3Q24.6 25.9 24.1 23.4Q23.6 20.9 23 21Q22.4 21.1 22.8 23.7Q23.3 26.2 23.9 28.7Q24.6 31.1 25.3 33.4Q26.1 35.7 26.9 38Q27.7 40.2 28.7 42.4Q29.6 44.5 30.7 46.5Q31.8 48.5 33 50.5Q34.2 52.4 35.5 54.2Q36.9 56 38.3 57.7Q39.8 59.4 41.3 61Q42.9 62.5 44.6 64Q46.3 65.4 48.1 66.7Q49.9 68.1 51.8 69.2Q53.7 70.4 55.7 71.4Q57.7 72.5 59.8 73.3Q61.8 74.2 64 75Q66.1 75.7 68.3 76.3Q70.5 76.9 72.8 77.4Q75 77.8 77.3 78.2Q79.6 78.5 82 78.7Q84.3 78.9 86.7 78.9Q89.1 79 91.4 78.9Q93.8 78.9 96.2 78.7Q98.6 78.5 101.1 78.2Q103.5 77.9 105.9 77.5Q108.3 77 110.8 76.5L113.2 76Z",
+    head: "M22.5 17.5Q28.8 24 35.1 36.8Q24.7 31.7 17.2 39.6Q18.9 25.5 22.5 17.5Z"
+  },
+  right: {
+    box: "0 0 120 52",
+    shaft: "M5.3 12.9Q9.5 12 11.6 11.6Q13.7 11.2 15.9 11Q18 10.7 20.2 10.5Q22.4 10.3 24.5 10.3Q26.7 10.2 28.9 10.2Q31.1 10.1 33.3 10.2Q35.5 10.3 37.7 10.4Q39.9 10.6 42.1 10.8Q44.3 11 46.5 11.3Q48.7 11.6 50.9 11.9Q53.1 12.3 55.3 12.7Q57.5 13.2 59.7 13.7Q61.9 14.2 64.1 14.8Q66.3 15.4 68.5 16Q70.7 16.7 72.8 17.5Q75 18.2 77.1 19.1Q79.2 19.9 81.4 20.8Q83.5 21.8 85.5 22.8Q87.6 23.8 89.6 24.9Q91.7 26.1 93.6 27.3Q95.6 28.5 97.6 29.8Q99.5 31.1 101.4 32.5Q103.3 33.9 105 35.4Q106.8 36.9 108.5 38.5Q110.2 40.1 111.9 41.8Q113.5 43.4 114 43Q114.5 42.6 112.8 40.9Q111.1 39.2 109.4 37.5Q107.7 35.9 105.9 34.4Q104.1 32.8 102.3 31.3Q100.4 29.8 98.5 28.4Q96.7 27 94.7 25.6Q92.8 24.3 90.8 23Q88.8 21.7 86.7 20.5Q84.7 19.4 82.6 18.2Q80.5 17.1 78.4 16.1Q76.3 15.1 74.1 14.2Q71.9 13.2 69.7 12.4Q67.5 11.5 65.3 10.8Q63.1 10.1 60.8 9.4Q58.6 8.8 56.3 8.3Q54 7.7 51.7 7.3Q49.4 6.9 47.1 6.6Q44.8 6.3 42.5 6.1Q40.2 5.9 37.9 5.8Q35.6 5.8 33.3 5.8Q31 5.9 28.7 6Q26.5 6.2 24.2 6.5Q22 6.7 19.8 7.1Q17.5 7.5 15.4 8Q13.2 8.5 11 9.1Q8.9 9.7 6.8 10.4L4.7 11.1Z",
+    head: "M116.4 45.6Q107.6 43.8 95.1 36.7Q106.6 35.1 108.3 24.4Q114.8 37 116.4 45.6Z"
+  },
+  left: {
+    box: "0 0 120 52",
+    shaft: "M115.3 11.1Q111.1 9.7 109 9.1Q106.8 8.5 104.6 8Q102.5 7.6 100.2 7.2Q98 6.9 95.8 6.6Q93.5 6.4 91.3 6.2Q89 6.1 86.7 6.1Q84.4 6.1 82.1 6.2Q79.8 6.3 77.5 6.5Q75.2 6.7 72.9 7Q70.7 7.3 68.4 7.7Q66.1 8.1 63.8 8.6Q61.5 9.1 59.3 9.7Q57 10.3 54.8 11Q52.5 11.7 50.3 12.5Q48.1 13.3 45.9 14.2Q43.7 15.1 41.6 16.1Q39.4 17.1 37.3 18.2Q35.2 19.2 33.2 20.4Q31.1 21.6 29.1 22.8Q27.1 24.1 25.2 25.4Q23.2 26.8 21.3 28.2Q19.5 29.7 17.6 31.2Q15.8 32.7 14 34.3Q12.3 35.8 10.5 37.5Q8.8 39.1 7.2 40.8Q5.5 42.6 6 43Q6.5 43.4 8.1 41.8Q9.8 40.1 11.5 38.5Q13.3 37 15 35.5Q16.8 34 18.7 32.6Q20.6 31.2 22.6 29.9Q24.5 28.7 26.5 27.4Q28.4 26.2 30.5 25.1Q32.5 24 34.5 22.9Q36.6 21.9 38.7 20.9Q40.8 20 42.9 19.1Q45 18.2 47.2 17.4Q49.3 16.6 51.5 15.9Q53.6 15.2 55.8 14.5Q58 13.9 60.2 13.4Q62.4 12.8 64.6 12.4Q66.8 11.9 69 11.5Q71.2 11.2 73.5 10.9Q75.7 10.6 77.9 10.4Q80.1 10.2 82.3 10.1Q84.5 10 86.7 9.9Q88.9 9.9 91.1 9.9Q93.3 10 95.5 10.1Q97.7 10.2 99.8 10.4Q102 10.6 104.1 10.9Q106.3 11.2 108.4 11.6Q110.5 12 112.6 12.5L114.7 12.9Z",
+    head: "M3.6 45.6Q4.8 36.6 11 23.7Q13.4 35.1 24.2 36Q12.1 43.4 3.6 45.6Z"
+  },
+  "loop-right": {
+    box: "0 0 132 70",
+    shaft: "M7 46.6Q13.9 36.3 17.7 32.3Q21.5 28.4 25.5 25.6Q29.5 22.8 33.5 21.1Q37.5 19.5 41.2 18.9Q44.9 18.3 48.2 18.8Q51.5 19.3 54.2 20.6Q56.9 22 58.9 24.3Q60.9 26.6 61.9 29.6Q63 32.5 62.9 34.8Q62.9 37.2 62.1 38.8Q61.4 40.4 60.3 41.5Q59.1 42.6 57.6 43.1Q56.2 43.6 54.6 43.6Q53 43.6 51.5 43Q50 42.4 48.7 41.1Q47.4 39.8 46.5 37.7Q45.6 35.6 45.4 33Q45.3 30.4 46.4 28.4Q47.5 26.4 49.9 24.8Q52.4 23.2 56.1 22.2Q59.9 21.2 64.8 21Q69.7 20.9 75.6 21.6Q81.4 22.3 88 24Q94.5 25.7 101.6 28.4Q108.7 31.2 116.2 34.9Q123.6 38.7 124 38Q124.4 37.3 116.9 33.5Q109.4 29.7 102.2 26.9Q95.1 24.1 88.4 22.2Q81.8 20.4 75.8 19.4Q69.9 18.4 64.7 18.4Q59.6 18.3 55.4 19.2Q51.1 20 48 21.8Q44.8 23.6 43 26.5Q41.2 29.4 41.1 33Q41.1 36.6 42.2 39.5Q43.3 42.5 45.2 44.5Q47.1 46.6 49.6 47.7Q52 48.7 54.5 48.8Q57.1 48.9 59.5 48Q61.9 47.1 63.8 45.2Q65.7 43.4 66.8 40.8Q67.9 38.2 67.9 35Q67.9 31.7 66.4 27.9Q65 24.2 62.3 21.3Q59.6 18.4 56.2 16.8Q52.7 15.1 48.8 14.7Q44.8 14.3 40.6 15.1Q36.4 15.9 32.1 17.9Q27.8 19.8 23.6 22.9Q19.5 26 15.6 30.3Q11.7 34.6 8.3 40L5 45.4Z",
+    head: "M127 39.7Q118.2 40.7 104.5 37.9Q114.8 32.8 113.4 22.2Q123.1 32.1 127 39.7Z"
+  },
+  "squiggle-right": {
+    box: "0 0 132 58",
+    shaft: "M5.9 30.6Q10.6 25.1 13 23.1Q15.4 21.1 17.8 19.8Q20.1 18.6 22.4 18Q24.7 17.5 26.9 17.6Q29.1 17.8 31.1 18.5Q33.1 19.2 35 20.6Q37 21.9 38.8 23.9Q40.5 25.9 42.2 28.7Q44 31.4 46 34Q48.1 36.6 50.4 38.5Q52.7 40.4 55.2 41.5Q57.7 42.7 60.4 43Q63 43.4 65.6 43Q68.2 42.5 70.7 41.3Q73.1 40 75.4 38.1Q77.6 36.2 79.5 33.6Q81.5 31 83.2 28.3Q84.9 25.5 86.7 23.5Q88.6 21.5 90.7 20.2Q92.9 18.9 95.3 18.2Q97.6 17.6 100.2 17.6Q102.8 17.7 105.5 18.4Q108.2 19.2 111 20.7Q113.7 22.2 116.5 24.4Q119.2 26.6 121.8 29.5Q124.4 32.4 125 32Q125.6 31.6 122.9 28.6Q120.2 25.6 117.3 23.3Q114.5 21 111.7 19.4Q108.8 17.8 106 16.8Q103.1 15.8 100.3 15.6Q97.4 15.4 94.7 15.9Q91.9 16.4 89.3 17.7Q86.7 19 84.4 21.2Q82.1 23.3 80.1 26Q78.2 28.8 76.3 30.9Q74.4 33.1 72.5 34.6Q70.6 36 68.7 36.8Q66.7 37.6 64.9 37.9Q63 38.1 61.2 37.8Q59.3 37.5 57.5 36.6Q55.6 35.7 53.8 34.2Q51.9 32.7 50.2 30.6Q48.4 28.4 46.5 25.6Q44.6 22.8 42.4 20.5Q40.1 18.2 37.6 16.7Q35.1 15.2 32.4 14.4Q29.7 13.7 27 13.7Q24.2 13.8 21.5 14.6Q18.8 15.5 16.2 17.1Q13.6 18.7 11.2 21Q8.7 23.3 6.4 26.3L4.1 29.4Z",
+    head: "M127 34.5Q117.7 33.3 105.7 26.9Q119.6 25.2 123.4 12.8Q127.4 25.6 127 34.5Z"
+  },
+  "s-curve-down": {
+    box: "0 0 92 104",
+    shaft: "M19.7 7.3Q28.6 10.2 32.3 11.8Q35.9 13.5 38.8 15.2Q41.7 16.9 43.8 18.7Q45.9 20.4 47.4 22.2Q48.9 23.9 49.7 25.6Q50.6 27.2 50.9 28.8Q51.3 30.4 51.3 32Q51.2 33.5 50.8 35.1Q50.4 36.6 49.6 38.2Q48.8 39.8 47.6 41.3Q46.4 42.9 44.9 44.4Q43.3 45.9 41.4 47.3Q39.6 48.7 37.5 50.3Q35.4 51.9 33.7 53.7Q32 55.4 30.8 57.3Q29.5 59.2 28.7 61.1Q27.9 63.1 27.6 65.1Q27.3 67.2 27.5 69.2Q27.6 71.2 28.2 73.3Q28.8 75.3 29.9 77.2Q31 79.2 32.5 81.1Q34 83.1 35.9 84.9Q37.9 86.8 40.2 88.7Q42.5 90.6 45.3 92.4Q48.1 94.2 51.4 96Q54.6 97.8 55 97Q55.4 96.2 52.2 94.5Q49 92.7 46.3 90.9Q43.6 89.1 41.3 87.3Q39.1 85.4 37.4 83.5Q35.7 81.6 34.4 79.7Q33.2 77.9 32.4 76.1Q31.6 74.2 31.2 72.5Q30.9 70.8 30.9 69.1Q31 67.5 31.4 65.9Q31.8 64.4 32.5 62.9Q33.3 61.4 34.5 60Q35.6 58.6 37.1 57.2Q38.6 55.8 40.5 54.6Q42.4 53.3 44.6 51.7Q46.9 50.2 48.8 48.5Q50.7 46.8 52.2 44.9Q53.7 43 54.8 40.9Q55.9 38.8 56.4 36.5Q57 34.3 57 32Q57 29.7 56.3 27.4Q55.6 25.2 54.3 23Q53 20.9 51 18.9Q49.1 16.9 46.5 15.1Q43.9 13.3 40.7 11.7Q37.5 10.1 33.6 8.7Q29.6 7.2 25 6L20.3 4.7Z",
+    head: "M58.2 98.6Q48.2 101.7 33 100.8Q46.3 92.7 44.2 78.4Q54.4 89.4 58.2 98.6Z"
+  },
+  "hook-left": {
+    box: "0 0 132 80",
+    shaft: "M126.3 13.9Q115.8 11.2 110.5 10.3Q105.2 9.3 99.9 8.6Q94.5 8 89.3 7.7Q84 7.5 78.9 7.6Q73.7 7.6 68.8 8.1Q63.8 8.6 59.1 9.4Q54.3 10.2 49.9 11.4Q45.4 12.6 41.3 14.1Q37.3 15.7 33.6 17.6Q29.9 19.6 26.7 21.9Q23.5 24.2 20.8 27Q18.1 29.7 16 32.9Q14 36 13 38.9Q12 41.7 11.8 44.3Q11.5 47 11.9 49.5Q12.4 52 13.4 54.1Q14.4 56.3 15.9 58.2Q17.5 60 19.4 61.5Q21.3 63 23.6 64.1Q25.8 65.2 28.3 65.9Q30.8 66.6 33.4 66.9Q36.1 67.1 38.9 67Q41.6 66.8 44.5 66.3Q47.3 65.7 50.1 64.7Q52.9 63.7 55.7 62.1Q58.4 60.6 58 60Q57.6 59.4 54.9 60.8Q52.3 62.2 49.6 63.1Q46.8 64 44.1 64.5Q41.5 64.9 38.9 64.9Q36.2 64.8 33.8 64.4Q31.4 63.9 29.2 63.1Q27 62.3 25.1 61.2Q23.2 60.1 21.6 58.8Q20.1 57.4 18.9 55.9Q17.8 54.3 17 52.5Q16.3 50.8 16.1 48.9Q15.8 46.9 16 44.8Q16.3 42.6 17.2 40.3Q18 38 19.8 35.3Q21.6 32.5 24 30.1Q26.4 27.7 29.3 25.6Q32.3 23.4 35.7 21.6Q39.1 19.8 43 18.3Q46.8 16.8 51 15.6Q55.3 14.4 59.8 13.6Q64.4 12.7 69.2 12.2Q74 11.6 79 11.4Q84 11.2 89.1 11.3Q94.3 11.5 99.5 11.9Q104.8 12.4 110 13.1Q115.3 13.9 120.5 15L125.7 16.1Z",
+    head: "M60.8 58.1Q57.9 66.6 49.2 77.7Q49.2 65.8 38.8 61.7Q52.2 57.9 60.8 58.1Z"
+  },
+  "swoop-down-right": {
+    box: "0 0 142 100",
+    shaft: "M6.2 13.1Q12.6 12.2 15.8 12Q19 11.7 22.1 11.6Q25.2 11.5 28.3 11.5Q31.4 11.5 34.5 11.6Q37.5 11.8 40.5 12.1Q43.5 12.3 46.4 12.8Q49.4 13.2 52.2 13.7Q55.1 14.2 57.9 14.9Q60.7 15.5 63.4 16.3Q66.1 17 68.7 17.9Q71.4 18.8 73.9 19.8Q76.5 20.7 78.9 21.8Q81.4 22.9 83.8 24Q86.2 25.2 88.5 26.4Q90.7 27.7 92.9 29Q95.1 30.4 97.2 31.8Q99.3 33.2 101.3 34.8Q103.3 36.3 105.2 37.9Q107.1 39.6 108.8 41.3Q110.6 43 112.2 44.8Q113.8 46.7 115.3 48.6Q116.8 50.5 118.2 52.6Q119.5 54.6 120.7 56.8Q121.8 59 122.8 61.2Q123.7 63.5 124.5 65.8Q125.3 68.2 126 68Q126.7 67.8 125.9 65.4Q125.1 63 124.2 60.6Q123.2 58.3 122.2 56Q121.1 53.8 119.9 51.6Q118.7 49.4 117.3 47.2Q115.9 45.1 114.4 43Q112.9 41 111.2 39Q109.6 37.1 107.7 35.2Q105.9 33.3 104 31.6Q102 29.8 99.9 28.2Q97.8 26.5 95.5 25Q93.3 23.5 90.9 22.1Q88.6 20.7 86.1 19.4Q83.6 18.1 81 17Q78.4 15.9 75.7 14.9Q73 13.9 70.3 13.1Q67.5 12.2 64.6 11.5Q61.8 10.8 58.9 10.3Q55.9 9.7 52.9 9.3Q50 8.8 46.9 8.6Q43.9 8.3 40.8 8.1Q37.7 8 34.6 8Q31.4 8 28.3 8.1Q25.1 8.3 21.9 8.6Q18.7 8.9 15.5 9.3Q12.3 9.7 9 10.3L5.8 10.9Z",
+    head: "M127 71.7Q117.5 66.1 107.5 53.5Q123.2 58.1 132.6 46.3Q131.4 62.1 127 71.7Z"
+  },
+  "zigzag-right": {
+    box: "0 0 132 62",
+    shaft: "M5.3 16.7Q9.4 21.4 11.5 23.8Q13.6 26.2 15.7 28.6Q17.8 30.9 19.8 33.3Q21.9 35.7 24 38.1Q26.1 40.4 28.2 42.8Q30.3 45.2 34 45.1Q37.8 45 39.8 42.6Q41.9 40.1 43.9 37.7Q45.9 35.3 48 32.8Q50 30.4 52 27.9Q54 25.4 55.9 23Q57.9 20.5 58.1 18Q58.2 15.6 60.4 18Q62.6 20.4 64.8 22.8Q67 25.2 69.3 27.6Q71.5 30 73.7 32.4Q75.9 34.8 78.2 37.2Q80.4 39.6 82.6 42Q84.8 44.4 88.1 44.8Q91.4 45.1 94.1 43.2Q96.8 41.3 99.6 39.4Q102.3 37.4 105 35.5Q107.8 33.6 110.5 31.8Q113.3 29.9 116 28.1Q118.8 26.2 121.6 24.4Q124.4 22.5 124 22Q123.6 21.5 120.9 23.3Q118.1 25.2 115.3 27Q112.6 28.9 109.8 30.7Q107 32.5 104.2 34.3Q101.4 36.1 98.6 37.9Q95.8 39.7 93 41.4Q90.1 43.2 88.5 42.9Q86.8 42.7 84.8 40.1Q82.7 37.6 80.6 35.1Q78.5 32.6 76.4 30Q74.4 27.5 72.3 25Q70.2 22.5 68.1 20Q66 17.4 63.9 14.9Q61.8 12.4 57.9 14.9Q54.1 17.4 52.1 19.8Q50 22.3 48 24.7Q46 27.2 44 29.6Q42.1 32.1 40.1 34.6Q38.1 37.1 36.2 39.6Q34.2 42.1 33.8 42.1Q33.4 42.2 31.2 40Q29 37.7 26.8 35.5Q24.5 33.2 22.3 31Q20.1 28.8 17.9 26.5Q15.6 24.3 13.4 22Q11.2 19.8 9 17.6L6.7 15.3Z",
+    head: "M126.5 20.3Q124.7 29 117.8 39.8Q117.3 26.5 105.9 21.9Q118.2 19.2 126.5 20.3Z"
+  },
+  "curl-down": {
+    box: "0 0 104 112",
+    shaft: "M26.2 13.5Q44 13.4 50.8 14.8Q57.6 16.2 62.4 18.6Q67.2 21 70 23.9Q72.8 26.9 73.8 29.9Q74.8 32.9 74.3 35.8Q73.8 38.7 71.8 41.4Q69.7 44.1 66 46.4Q62.3 48.7 57 50.1Q51.8 51.5 47.4 51.5Q43.1 51.5 40 50.3Q36.9 49.1 34.9 47.1Q32.9 45.2 31.9 42.7Q30.9 40.3 30.9 37.6Q31 34.9 32.1 32.4Q33.2 29.8 35.5 27.6Q37.8 25.5 41.5 24.1Q45.1 22.7 49.6 22.5Q54.1 22.3 57.6 23.7Q61.1 25.1 63.7 28.1Q66.4 31 68.2 35.4Q70 39.7 70.9 45.2Q71.7 50.6 71.6 56.8Q71.5 63.1 70.4 69.8Q69.2 76.5 67.2 83.3Q65.1 90.1 62.1 96.9Q59.2 103.6 60 104Q60.8 104.4 63.9 97.7Q67 90.9 69.1 83.9Q71.3 77 72.5 70.1Q73.7 63.3 74 56.9Q74.4 50.5 73.7 44.7Q73 39 71.2 34.1Q69.4 29.3 66.4 25.7Q63.4 22 59.1 20.1Q54.8 18.1 49.5 18.1Q44.3 18.1 39.8 19.6Q35.3 21.2 32.1 23.9Q28.9 26.6 27.2 30.1Q25.5 33.6 25.3 37.4Q25.1 41.2 26.4 44.8Q27.7 48.5 30.6 51.4Q33.4 54.3 37.6 56Q41.9 57.7 47.3 57.8Q52.7 57.9 58.7 56.2Q64.8 54.5 69.4 51.6Q73.9 48.7 76.6 44.8Q79.3 40.9 79.9 36.6Q80.4 32.3 78.8 28.1Q77.1 24 73.5 20.6Q69.8 17.1 64.3 14.7Q58.9 12.3 51.5 11.1Q44.2 9.9 35 10.2L25.8 10.5Z",
+    head: "M58 107.7Q54.8 96 56.4 78.4Q65.3 94 81.7 91.7Q68.7 103.4 58 107.7Z"
+  },
+  "arc-over-right": {
+    box: "0 0 132 74",
+    shaft: "M7 60.3Q9.5 54.4 11 51.7Q12.5 48.9 14.1 46.4Q15.7 43.9 17.5 41.7Q19.3 39.4 21.3 37.4Q23.2 35.4 25.3 33.6Q27.4 31.8 29.6 30.2Q31.7 28.6 34 27.2Q36.3 25.9 38.7 24.7Q41.1 23.6 43.5 22.7Q46 21.7 48.5 21Q51 20.3 53.6 19.8Q56.2 19.3 58.8 19Q61.4 18.7 64 18.6Q66.7 18.5 69.3 18.6Q72 18.7 74.6 19Q77.2 19.3 79.9 19.8Q82.5 20.3 85.1 21Q87.7 21.7 90.2 22.6Q92.8 23.5 95.3 24.6Q97.8 25.8 100.2 27.1Q102.7 28.4 105 29.9Q107.4 31.5 109.6 33.2Q111.9 35 113.9 37Q116 39 118 41.2Q119.9 43.5 121.7 45.9Q123.4 48.4 124 48Q124.6 47.6 122.8 45.1Q121.1 42.6 119.1 40.2Q117.2 37.9 115.1 35.8Q113.1 33.6 110.9 31.7Q108.7 29.7 106.4 27.9Q104.1 26.2 101.7 24.6Q99.2 23.1 96.7 21.8Q94.1 20.5 91.5 19.4Q88.9 18.3 86.1 17.4Q83.4 16.5 80.7 15.9Q77.9 15.3 75.1 14.9Q72.3 14.5 69.5 14.3Q66.7 14.2 63.9 14.2Q61.1 14.3 58.3 14.7Q55.5 15 52.8 15.5Q50 16.1 47.3 16.9Q44.6 17.7 42 18.7Q39.4 19.8 36.9 21.1Q34.4 22.3 32 23.8Q29.5 25.4 27.3 27.1Q25 28.9 22.8 30.9Q20.7 32.8 18.7 35.1Q16.8 37.3 15 39.7Q13.2 42.2 11.6 44.9Q10 47.6 8.7 50.5Q7.3 53.4 6.1 56.5L5 59.7Z",
+    head: "M126 51Q115.7 48.6 103.1 40Q118.7 39.8 124.1 26.5Q127.3 41.2 126 51Z"
+  },
+  "jab-down-right": {
+    box: "0 0 84 74",
+    shaft: "M10.2 11Q12.6 10.7 13.8 10.6Q15 10.6 16.3 10.6Q17.5 10.6 18.7 10.8Q19.9 10.9 21.1 11.1Q22.3 11.3 23.6 11.6Q24.8 11.9 26 12.3Q27.2 12.7 28.4 13.1Q29.6 13.6 30.8 14.1Q32 14.7 33.2 15.3Q34.4 15.9 35.5 16.6Q36.7 17.2 37.9 18Q39.1 18.7 40.2 19.5Q41.4 20.4 42.5 21.2Q43.7 22.1 44.8 23.1Q45.9 24 47.1 25.1Q48.2 26.1 49.3 27.2Q50.4 28.3 51.4 29.5Q52.5 30.7 53.5 31.9Q54.6 33.2 55.6 34.6Q56.6 35.9 57.5 37.4Q58.4 38.8 59.3 40.4Q60.2 41.9 61 43.6Q61.8 45.2 62.5 46.9Q63.2 48.7 63.8 50.5Q64.4 52.3 64.9 54.2Q65.4 56.2 66 56Q66.6 55.8 66.1 53.9Q65.6 52 65.1 50.1Q64.5 48.2 63.8 46.4Q63.2 44.6 62.6 42.9Q61.9 41.1 61.2 39.5Q60.5 37.8 59.7 36.2Q58.9 34.5 58.1 33Q57.2 31.5 56.3 30Q55.4 28.5 54.4 27.1Q53.4 25.7 52.4 24.4Q51.3 23.1 50.2 21.9Q49.1 20.7 48 19.6Q46.8 18.4 45.6 17.4Q44.4 16.4 43.1 15.5Q41.9 14.6 40.6 13.7Q39.3 12.9 37.9 12.2Q36.6 11.5 35.2 10.9Q33.9 10.3 32.5 9.9Q31.1 9.4 29.7 9Q28.4 8.6 27 8.3Q25.6 8.1 24.2 7.9Q22.9 7.7 21.5 7.7Q20.1 7.6 18.8 7.6Q17.5 7.7 16.2 7.8Q14.8 7.9 13.6 8.1Q12.3 8.4 11 8.7L9.8 9Z",
+    head: "M66.7 59.1Q58.8 54.1 50.7 43.2Q64 47.6 72.7 38Q70.9 51.2 66.7 59.1Z"
+  },
+  "loop-left": {
+    box: "0 0 132 70",
+    shaft: "M127 45.4Q120.3 34.6 116.5 30.3Q112.6 26 108.4 22.8Q104.3 19.7 100 17.7Q95.7 15.7 91.5 14.8Q87.2 14 83.2 14.4Q79.2 14.8 75.7 16.4Q72.1 18.1 69.4 21Q66.7 24 65.2 27.8Q63.8 31.7 63.8 35Q63.9 38.3 65 40.9Q66.2 43.5 68.1 45.3Q70.1 47.1 72.5 48Q74.9 48.8 77.5 48.7Q80 48.6 82.4 47.5Q84.7 46.4 86.5 44.3Q88.4 42.3 89.5 39.4Q90.5 36.5 90.5 33Q90.4 29.5 88.6 26.7Q86.9 23.9 83.8 22.1Q80.7 20.4 76.5 19.5Q72.4 18.7 67.2 18.7Q62.1 18.7 56.2 19.6Q50.2 20.5 43.6 22.4Q37 24.2 29.8 26.9Q22.7 29.7 15.1 33.5Q7.6 37.3 8 38Q8.4 38.7 15.8 34.9Q23.3 31.1 30.4 28.4Q37.5 25.6 44 23.9Q50.6 22.1 56.4 21.4Q62.3 20.6 67.2 20.7Q72.1 20.9 76 21.8Q79.8 22.8 82.3 24.4Q84.8 26.1 86 28.2Q87.1 30.3 87 33Q86.8 35.7 85.9 37.9Q84.9 40 83.5 41.3Q82.1 42.6 80.6 43.2Q79 43.8 77.4 43.7Q75.8 43.7 74.4 43.1Q72.9 42.5 71.8 41.4Q70.7 40.3 70.1 38.7Q69.4 37.1 69.4 34.8Q69.3 32.6 70.4 29.7Q71.4 26.8 73.4 24.6Q75.3 22.4 78 21Q80.6 19.6 83.8 19.1Q87.1 18.7 90.8 19.2Q94.5 19.7 98.4 21.3Q102.4 23 106.4 25.7Q110.4 28.4 114.2 32.4Q118.1 36.3 121.5 41.4L125 46.6Z",
+    head: "M5 39.7Q8.7 31.6 18.1 21.3Q17.2 32.8 27 37Q13.6 40.2 5 39.7Z"
+  },
+  "squiggle-left": {
+    box: "0 0 132 58",
+    shaft: "M127.9 29.4Q123.3 23.3 120.9 20.9Q118.4 18.6 115.8 17Q113.2 15.4 110.5 14.6Q107.8 13.8 105 13.7Q102.3 13.7 99.6 14.5Q97 15.3 94.5 16.8Q92.1 18.4 89.9 20.7Q87.7 23 85.8 25.8Q84 28.6 82.2 30.9Q80.4 33.1 78.5 34.6Q76.7 36.2 74.8 37.1Q72.9 38 70.9 38.3Q69 38.7 67.1 38.4Q65.1 38.2 63.1 37.3Q61.2 36.4 59.2 34.9Q57.3 33.4 55.5 31.1Q53.6 28.9 51.7 26.2Q49.8 23.4 47.5 21.2Q45.2 19.1 42.7 17.7Q40.1 16.4 37.3 15.8Q34.6 15.3 31.7 15.5Q28.9 15.7 26 16.7Q23.1 17.7 20.3 19.3Q17.4 20.9 14.6 23.2Q11.8 25.5 9.1 28.6Q6.4 31.6 7 32Q7.6 32.4 10.2 29.6Q12.9 26.7 15.6 24.5Q18.3 22.3 21.1 20.8Q23.8 19.3 26.5 18.5Q29.2 17.8 31.8 17.7Q34.4 17.7 36.7 18.3Q39.1 18.9 41.3 20.2Q43.4 21.5 45.4 23.5Q47.3 25.4 49 28.1Q50.7 30.8 52.7 33.4Q54.7 35.9 56.9 37.8Q59.1 39.7 61.5 40.8Q63.9 42 66.5 42.4Q69 42.8 71.6 42.5Q74.1 42.1 76.6 41Q79 39.9 81.3 38Q83.6 36.2 85.6 33.7Q87.7 31.1 89.4 28.4Q91.2 25.7 93 23.8Q94.9 21.8 96.9 20.4Q98.8 19.1 100.9 18.4Q102.9 17.7 105.1 17.6Q107.3 17.5 109.6 18.1Q111.8 18.6 114.2 19.9Q116.6 21.1 119 23.1Q121.4 25.1 123.7 27.9L126.1 30.6Z",
+    head: "M5 34.5Q4 25.2 7.5 12Q12.4 25.2 25.3 26Q13.8 32.9 5 34.5Z"
+  },
+  "hook-right": {
+    box: "0 0 132 80",
+    shaft: "M6.3 16.1Q16.7 13.9 22 13.1Q27.2 12.3 32.5 11.8Q37.7 11.4 42.8 11.3Q48 11.1 53 11.4Q58 11.6 62.8 12.1Q67.6 12.7 72.2 13.5Q76.7 14.4 80.9 15.6Q85.2 16.8 89 18.3Q92.9 19.9 96.3 21.7Q99.7 23.5 102.6 25.7Q105.5 27.8 107.8 30.3Q110.2 32.7 112 35.4Q113.7 38.1 114.6 40.4Q115.4 42.7 115.7 44.8Q115.9 46.9 115.7 48.8Q115.4 50.7 114.7 52.4Q114 54.2 112.9 55.7Q111.8 57.3 110.3 58.7Q108.7 60 106.9 61.1Q105 62.2 102.8 63.1Q100.6 63.9 98.2 64.3Q95.7 64.8 93.1 64.9Q90.5 64.9 87.8 64.5Q85.2 64 82.4 63.1Q79.7 62.2 77.1 60.8Q74.4 59.4 74 60Q73.6 60.6 76.3 62.1Q79.1 63.7 81.9 64.7Q84.7 65.7 87.5 66.3Q90.4 66.8 93.1 67Q95.9 67.1 98.6 66.9Q101.2 66.6 103.7 66Q106.2 65.3 108.5 64.2Q110.8 63.1 112.7 61.6Q114.7 60.2 116.2 58.3Q117.8 56.5 118.8 54.2Q119.9 52 120.3 49.5Q120.8 47 120.5 44.3Q120.3 41.6 119.3 38.8Q118.3 35.9 116.2 32.7Q114.1 29.5 111.4 26.8Q108.7 24.1 105.4 21.8Q102.2 19.4 98.5 17.5Q94.8 15.6 90.7 14.1Q86.6 12.5 82.1 11.4Q77.7 10.2 72.9 9.4Q68.2 8.6 63.2 8.2Q58.3 7.7 53.1 7.6Q48 7.6 42.7 7.8Q37.5 8.1 32.2 8.7Q26.8 9.3 21.5 10.3Q16.2 11.3 11 12.6L5.7 13.9Z",
+    head: "M71.2 58.1Q80.1 57.4 93.7 60.9Q82.8 65.8 83.3 76.8Q74.4 66.2 71.2 58.1Z"
+  },
+  "swoop-down-left": {
+    box: "0 0 142 100",
+    shaft: "M136.2 10.9Q129.7 9.7 126.5 9.3Q123.3 8.8 120.1 8.5Q116.9 8.2 113.7 8Q110.6 7.9 107.4 7.9Q104.3 7.8 101.2 8Q98.1 8.1 95.1 8.4Q92 8.6 89 9Q86 9.5 83.1 10Q80.2 10.6 77.3 11.3Q74.5 12 71.7 12.9Q68.9 13.8 66.2 14.8Q63.5 15.8 61 16.9Q58.4 18.1 55.9 19.4Q53.4 20.7 51.1 22.1Q48.7 23.5 46.5 25Q44.3 26.6 42.2 28.3Q40.1 29.9 38.1 31.7Q36.2 33.4 34.4 35.3Q32.6 37.2 30.9 39.1Q29.2 41.1 27.7 43.1Q26.2 45.2 24.8 47.3Q23.5 49.4 22.2 51.6Q21 53.8 19.9 56.1Q18.8 58.3 17.9 60.7Q16.9 63 16.1 65.4Q15.3 67.8 16 68Q16.7 68.2 17.5 65.8Q18.2 63.5 19.2 61.2Q20.1 58.9 21.2 56.8Q22.4 54.6 23.7 52.5Q25 50.5 26.5 48.5Q28 46.6 29.7 44.7Q31.3 42.9 33.1 41.2Q34.8 39.4 36.7 37.8Q38.6 36.2 40.6 34.6Q42.6 33.1 44.7 31.7Q46.8 30.3 49 29Q51.2 27.6 53.5 26.4Q55.8 25.2 58.2 24.1Q60.6 22.9 63.1 21.9Q65.6 20.8 68.1 19.9Q70.7 18.9 73.3 18.1Q76 17.3 78.7 16.5Q81.4 15.8 84.2 15.1Q87 14.5 89.8 13.9Q92.7 13.4 95.6 13Q98.5 12.5 101.5 12.2Q104.5 11.9 107.5 11.8Q110.6 11.6 113.7 11.6Q116.8 11.5 119.9 11.6Q123 11.7 126.2 12Q129.4 12.3 132.6 12.7L135.8 13.1Z",
+    head: "M15 71.7Q9.8 61.9 7.9 45.9Q18.8 58.1 33.1 53.1Q23.7 65.8 15 71.7Z"
+  },
+  "zigzag-left": {
+    box: "0 0 132 62",
+    shaft: "M125.3 15.3Q120.8 19.8 118.6 22Q116.3 24.2 114.1 26.5Q111.9 28.7 109.6 31Q107.4 33.2 105.2 35.4Q103 37.7 100.8 40Q98.6 42.2 98.2 42.2Q97.8 42.1 95.8 39.6Q93.8 37.2 91.8 34.7Q89.8 32.2 87.8 29.8Q85.8 27.3 83.8 24.9Q81.8 22.4 79.7 20Q77.7 17.5 74.1 15.1Q70.4 12.6 68.3 15.1Q66.2 17.6 64.1 20.1Q62 22.7 59.9 25.2Q57.8 27.7 55.7 30.2Q53.6 32.7 51.5 35.2Q49.4 37.7 47.3 40.2Q45.2 42.7 43.5 43Q41.8 43.2 39 41.5Q36.2 39.7 33.4 37.9Q30.6 36.1 27.8 34.3Q25 32.5 22.2 30.7Q19.5 28.8 16.7 27Q13.9 25.1 11.1 23.3Q8.4 21.5 8 22Q7.6 22.5 10.4 24.4Q13.2 26.3 15.9 28.1Q18.7 29.9 21.5 31.8Q24.2 33.7 27 35.6Q29.7 37.5 32.4 39.4Q35.2 41.3 37.9 43.2Q40.6 45.1 43.9 44.7Q47.1 44.3 49.3 41.9Q51.5 39.5 53.7 37.1Q55.9 34.7 58.1 32.3Q60.3 29.9 62.5 27.5Q64.7 25 67 22.6Q69.2 20.2 71.4 17.8Q73.6 15.4 73.9 17.8Q74.3 20.3 76.3 22.8Q78.2 25.3 80.2 27.8Q82.2 30.2 84.2 32.7Q86.2 35.2 88.2 37.6Q90.2 40.1 92.2 42.5Q94.2 45 98 45.1Q101.7 45.2 103.8 42.8Q105.9 40.5 108 38.1Q110.1 35.7 112.2 33.4Q114.3 31 116.4 28.6Q118.4 26.2 120.5 23.8Q122.6 21.5 124.7 19.1L126.7 16.7Z",
+    head: "M5.5 20.3Q14.2 18.6 26.8 20.9Q14.7 26.5 14.9 38.7Q7.7 28.4 5.5 20.3Z"
+  },
+  "arc-over-left": {
+    box: "0 0 132 74",
+    shaft: "M127 59.7Q124.7 53.4 123.4 50.5Q122 47.5 120.4 44.8Q118.9 42.2 117.1 39.7Q115.3 37.2 113.3 35Q111.3 32.8 109.2 30.8Q107.1 28.8 104.8 27.1Q102.5 25.3 100.1 23.8Q97.6 22.3 95.1 21Q92.6 19.8 90 18.8Q87.3 17.7 84.7 17Q82 16.2 79.2 15.6Q76.5 15.1 73.7 14.8Q70.9 14.5 68.1 14.4Q65.3 14.3 62.5 14.5Q59.7 14.7 56.9 15Q54.1 15.4 51.4 16.1Q48.6 16.7 45.9 17.5Q43.2 18.4 40.6 19.5Q37.9 20.6 35.4 21.9Q32.8 23.2 30.4 24.7Q27.9 26.2 25.6 28Q23.3 29.7 21.1 31.7Q18.9 33.7 16.9 35.8Q14.8 37.9 12.9 40.2Q10.9 42.6 9.2 45.1Q7.4 47.6 8 48Q8.6 48.4 10.3 45.9Q12.1 43.5 14 41.2Q16 39 18.1 37Q20.1 35 22.4 33.2Q24.6 31.4 27 29.9Q29.3 28.3 31.7 27Q34.2 25.7 36.7 24.5Q39.2 23.4 41.7 22.5Q44.3 21.6 46.9 20.9Q49.5 20.1 52.1 19.6Q54.7 19.1 57.4 18.8Q60 18.5 62.7 18.4Q65.3 18.3 68 18.4Q70.6 18.5 73.2 18.8Q75.8 19.2 78.4 19.7Q81 20.2 83.5 21Q86 21.7 88.5 22.6Q90.9 23.6 93.3 24.7Q95.7 25.9 97.9 27.3Q100.2 28.7 102.4 30.2Q104.6 31.8 106.7 33.6Q108.7 35.4 110.7 37.5Q112.6 39.5 114.4 41.7Q116.2 44 117.8 46.5Q119.5 49 121 51.7Q122.4 54.4 123.7 57.4L125 60.3Z",
+    head: "M6 51Q4 40.7 6.6 25.7Q13.3 39.8 27.6 39.2Q15.6 48.2 6 51Z"
+  },
+  "jab-down-left": {
+    box: "0 0 84 74",
+    shaft: "M74.2 9Q71.7 8.4 70.4 8.2Q69.2 7.9 67.8 7.8Q66.5 7.7 65.2 7.7Q63.9 7.7 62.5 7.7Q61.1 7.8 59.8 8Q58.4 8.2 57 8.5Q55.7 8.8 54.3 9.1Q52.9 9.5 51.6 10Q50.2 10.5 48.8 11.1Q47.5 11.7 46.2 12.4Q44.8 13.1 43.5 13.9Q42.2 14.7 41 15.6Q39.7 16.5 38.5 17.5Q37.2 18.5 36.1 19.6Q34.9 20.7 33.8 21.9Q32.7 23.1 31.6 24.4Q30.5 25.7 29.6 27.1Q28.6 28.5 27.6 29.9Q26.7 31.4 25.9 32.9Q25 34.5 24.2 36.1Q23.5 37.7 22.7 39.4Q22 41.1 21.4 42.9Q20.7 44.6 20.1 46.4Q19.5 48.2 18.9 50.1Q18.3 52 17.9 53.9Q17.4 55.8 18 56Q18.6 56.2 19.2 54.2Q19.7 52.3 20.3 50.5Q20.9 48.7 21.6 47Q22.2 45.2 23.1 43.6Q23.9 42 24.8 40.4Q25.6 38.9 26.6 37.4Q27.5 36 28.5 34.6Q29.5 33.3 30.5 32Q31.5 30.7 32.6 29.5Q33.7 28.3 34.7 27.2Q35.8 26.1 36.9 25Q38 24 39.2 23Q40.3 22.1 41.4 21.2Q42.6 20.3 43.7 19.4Q44.9 18.6 46 17.9Q47.2 17.1 48.4 16.4Q49.6 15.7 50.8 15.1Q51.9 14.5 53.1 14Q54.3 13.5 55.6 13Q56.8 12.5 58 12.2Q59.2 11.8 60.4 11.5Q61.6 11.2 62.9 11Q64.1 10.8 65.3 10.7Q66.5 10.6 67.7 10.6Q69 10.5 70.2 10.6Q71.4 10.7 72.6 10.8L73.8 11Z",
+    head: "M17.3 59.1Q12.4 51.1 10 37.7Q20 47.6 32 42.9Q24.5 53.9 17.3 59.1Z"
+  }
+};
+
+// src/annotations/annotation-layer.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function ScribbleArrow({ variant, offset }) {
+  const arrow = ARROWS[variant];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "svg",
+    {
+      className: "annotation-arrow",
+      viewBox: arrow.box,
+      fill: "currentColor",
+      "aria-hidden": "true",
+      style: offset,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: arrow.shaft }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: arrow.head })
+      ]
+    }
+  );
+}
+function arrowSide(variant) {
+  if (variant === "left" || variant.endsWith("-left")) return "left";
+  if (variant === "right" || variant.endsWith("-right")) return "right";
+  return "center";
+}
+function AnnotationLayer({ annotations, className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: cn("annotation-layer", className), "aria-hidden": "true", ...props, children: annotations.map((note) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      className: "annotation",
+      "data-side": arrowSide(note.arrow),
+      "data-flip": note.arrow.startsWith("up-") ? "" : void 0,
+      style: {
+        ...note.pos,
+        ["--annotation-tilt"]: `${note.tilt ?? 0}deg`,
+        ...note.arrowScale ? { ["--annotation-arrow-scale"]: String(note.arrowScale) } : {},
+        ...note.rotate ? { ["--annotation-arrow-rotate"]: `${note.rotate}deg` } : {},
+        ...note.flipH ? { ["--annotation-arrow-flip-x"]: "-1" } : {},
+        ...note.flipV ? { ["--annotation-arrow-flip-y"]: "-1" } : {}
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "annotation-text", style: note.posText, children: note.text }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ScribbleArrow, { variant: note.arrow, offset: note.posArrow })
+      ]
+    },
+    note.id
+  )) });
+}
+function AnnotationList({ annotations, className, ...props }) {
+  if (annotations.length === 0) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: cn("annotation-list", className), ...props, children: annotations.map((note) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: note.text }, note.id)) });
+}
+function AnnotationStage({
+  annotations,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: cn("annotation-stage", className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "annotation-stage-inner", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AnnotationLayer, { annotations }),
+      children
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AnnotationList, { annotations })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ARROWS,
+  AnnotationLayer,
+  AnnotationList,
+  AnnotationStage
+});
+//# sourceMappingURL=index.cjs.map

package/dist/annotations/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/annotations/index.ts","../../src/cn.ts","../../src/annotations/arrow-paths.ts","../../src/annotations/annotation-layer.tsx"],"sourcesContent":["export type {\n  Annotation,\n  AnnotationLayerProps,\n  AnnotationListProps,\n  AnnotationOffsets,\n  AnnotationStageProps,\n} from './annotation-layer';\nexport { AnnotationLayer, AnnotationList, AnnotationStage } from './annotation-layer';\nexport type { ArrowVariant } from './arrow-paths';\nexport { ARROWS } from './arrow-paths';\n","import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\n/**\n * Merge class names, resolving conflicting Tailwind utilities (last wins).\n * Mirrors the helper used across the FloPay frontends so consumers can extend\n * any primitive's classes safely.\n */\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","/**\n * Arrow outlines for {@link AnnotationLayer} — GENERATED, do not hand-edit.\n *\n * Regenerate with:  python3 scripts/gen-arrow-paths.py\n * then paste the object below and update the union to match. The generator owns\n * the curve control points, width profiles and head geometry; see its docstring\n * for why these are filled outlines rather than strokes.\n *\n * Six calm directional workhorses, then the expressive set — loops, S-bends,\n * zigzags — for notes that want more voice. The `-left`/`-right` twins of the\n * expressive shapes are reflections of one source curve, so editing a source\n * updates its mirror on the next run.\n */\n\nexport type ArrowVariant =\n  | 'down-right'\n  | 'down-left'\n  | 'up-right'\n  | 'up-left'\n  | 'right'\n  | 'left'\n  | 'loop-right'\n  | 'squiggle-right'\n  | 's-curve-down'\n  | 'hook-left'\n  | 'swoop-down-right'\n  | 'zigzag-right'\n  | 'curl-down'\n  | 'arc-over-right'\n  | 'jab-down-right'\n  | 'loop-left'\n  | 'squiggle-left'\n  | 'hook-right'\n  | 'swoop-down-left'\n  | 'zigzag-left'\n  | 'arc-over-left'\n  | 'jab-down-left';\n\nexport const ARROWS: Record<ArrowVariant, { box: string; shaft: string; head: string }> = {\n  'down-right': {\n    box: '0 0 120 84',\n    shaft:\n      'M7.2 10Q12 9.2 14.4 9Q16.8 8.8 19.2 8.7Q21.6 8.5 23.9 8.5Q26.2 8.5 28.5 8.7Q30.8 8.8 33.1 9Q35.3 9.2 37.5 9.5Q39.7 9.9 41.9 10.3Q44.1 10.7 46.2 11.2Q48.3 11.7 50.3 12.3Q52.4 12.9 54.4 13.7Q56.4 14.4 58.3 15.2Q60.3 16 62.1 16.9Q64 17.8 65.8 18.8Q67.7 19.8 69.4 20.9Q71.2 22 72.8 23.2Q74.5 24.4 76.1 25.8Q77.7 27.1 79.2 28.6Q80.7 30.1 82.2 31.7Q83.6 33.3 84.9 35Q86.2 36.8 87.4 38.6Q88.6 40.5 89.7 42.5Q90.8 44.5 91.7 46.6Q92.7 48.7 93.4 51Q94.2 53.3 94.8 55.7Q95.4 58.1 95.9 60.6Q96.4 63.1 97 63Q97.6 62.9 97.1 60.3Q96.7 57.8 96 55.4Q95.4 52.9 94.6 50.6Q93.9 48.3 93 46.1Q92.2 43.8 91.2 41.7Q90.2 39.6 89.1 37.6Q88 35.6 86.8 33.7Q85.6 31.8 84.3 30Q82.9 28.2 81.5 26.5Q80 24.8 78.5 23.2Q76.9 21.7 75.2 20.2Q73.6 18.8 71.8 17.5Q70 16.1 68.1 14.9Q66.2 13.7 64.3 12.7Q62.3 11.6 60.2 10.7Q58.2 9.8 56 9Q53.9 8.2 51.7 7.6Q49.5 7 47.2 6.5Q45 6 42.7 5.7Q40.4 5.3 38 5.2Q35.7 5 33.3 4.9Q31 4.8 28.6 4.9Q26.2 5 23.8 5.2Q21.3 5.4 18.9 5.7Q16.5 6 14.1 6.5Q11.6 6.9 9.2 7.5L6.8 8Z',\n    head: 'M97.5 66.5Q91.2 60 84.9 47.2Q95.3 52.3 102.8 44.4Q101.1 58.5 97.5 66.5Z',\n  },\n  'down-left': {\n    box: '0 0 120 84',\n    shaft:\n      'M113.2 8Q108.4 6.9 105.9 6.4Q103.5 6 101.1 5.7Q98.7 5.4 96.2 5.2Q93.8 5 91.4 5Q89.1 4.9 86.7 5Q84.3 5.1 82 5.3Q79.6 5.6 77.4 5.9Q75.1 6.3 72.8 6.8Q70.6 7.3 68.4 8Q66.2 8.6 64.1 9.4Q62 10.2 59.9 11.1Q57.9 12 55.9 13.1Q54 14.1 52.1 15.3Q50.2 16.4 48.4 17.7Q46.6 19 44.9 20.4Q43.3 21.9 41.7 23.4Q40.1 24.9 38.6 26.6Q37.1 28.2 35.8 30Q34.4 31.8 33.1 33.6Q31.9 35.5 30.8 37.5Q29.7 39.5 28.7 41.7Q27.7 43.8 26.9 46Q26 48.2 25.3 50.6Q24.5 52.9 23.9 55.3Q23.3 57.8 22.8 60.3Q22.4 62.9 23 63Q23.6 63.1 24.1 60.6Q24.6 58.1 25.3 55.7Q25.9 53.3 26.7 51Q27.4 48.8 28.4 46.6Q29.3 44.5 30.4 42.5Q31.5 40.5 32.7 38.7Q33.8 36.8 35.1 35Q36.4 33.3 37.8 31.7Q39.2 30 40.7 28.5Q42.2 27 43.7 25.6Q45.3 24.3 47 23Q48.6 21.7 50.4 20.6Q52.1 19.4 54 18.4Q55.8 17.4 57.7 16.5Q59.6 15.6 61.5 14.8Q63.5 13.9 65.5 13.3Q67.5 12.6 69.6 12Q71.6 11.4 73.8 10.9Q75.9 10.4 78.1 10Q80.2 9.6 82.4 9.4Q84.7 9.1 86.9 8.9Q89.2 8.7 91.5 8.6Q93.8 8.5 96.1 8.5Q98.4 8.6 100.8 8.7Q103.2 8.8 105.6 9Q108 9.3 110.4 9.6L112.8 10Z',\n    head: 'M22.5 66.5Q18.4 58.4 16.3 44.2Q24.7 52.3 34.1 47Q28.2 59.9 22.5 66.5Z',\n  },\n  'up-right': {\n    box: '0 0 120 84',\n    shaft:\n      'M6.8 76Q11.7 77.1 14.1 77.5Q16.5 77.9 18.9 78.2Q21.4 78.5 23.8 78.6Q26.2 78.8 28.6 78.8Q30.9 78.9 33.3 78.8Q35.7 78.7 38 78.4Q40.3 78.2 42.6 77.9Q44.9 77.5 47.1 77Q49.4 76.5 51.6 75.9Q53.8 75.3 55.9 74.6Q58 73.8 60.1 73Q62.1 72.1 64.1 71.1Q66.1 70.1 68 68.9Q69.9 67.8 71.8 66.5Q73.6 65.2 75.3 63.8Q77 62.4 78.6 60.9Q80.2 59.4 81.7 57.7Q83.2 56 84.5 54.2Q85.9 52.4 87.1 50.5Q88.3 48.6 89.4 46.6Q90.5 44.6 91.5 42.4Q92.4 40.3 93.3 38Q94.1 35.8 94.8 33.5Q95.5 31.1 96.1 28.7Q96.7 26.2 97.2 23.7Q97.6 21.1 97 21Q96.4 20.9 95.9 23.4Q95.4 25.9 94.7 28.3Q94.1 30.7 93.3 32.9Q92.5 35.2 91.5 37.3Q90.5 39.4 89.4 41.4Q88.3 43.4 87.1 45.2Q85.9 47.1 84.6 48.8Q83.3 50.5 81.9 52.1Q80.5 53.7 79 55.2Q77.6 56.7 76 58.1Q74.4 59.4 72.8 60.7Q71.1 62 69.4 63.2Q67.7 64.3 65.9 65.4Q64.1 66.4 62.3 67.4Q60.4 68.3 58.5 69.2Q56.5 70 54.5 70.8Q52.5 71.5 50.5 72.1Q48.4 72.7 46.3 73.3Q44.2 73.8 42 74.2Q39.8 74.6 37.6 74.9Q35.4 75.2 33.1 75.4Q30.8 75.5 28.5 75.6Q26.2 75.7 23.9 75.6Q21.5 75.6 19.2 75.5Q16.8 75.3 14.4 75Q12 74.8 9.6 74.4L7.2 74Z',\n    head: 'M97.5 17.5Q101.6 25.6 103.7 39.8Q95.3 31.7 85.9 37Q91.8 24.1 97.5 17.5Z',\n  },\n  'up-left': {\n    box: '0 0 120 84',\n    shaft:\n      'M112.8 74Q108 74.8 105.6 75.1Q103.2 75.3 100.8 75.4Q98.5 75.6 96.1 75.6Q93.8 75.6 91.5 75.5Q89.2 75.4 86.9 75.2Q84.7 75 82.4 74.6Q80.2 74.3 78.1 73.9Q75.9 73.4 73.8 72.9Q71.7 72.4 69.7 71.7Q67.6 71.1 65.6 70.4Q63.6 69.6 61.7 68.8Q59.8 68 57.9 67Q56.1 66.1 54.3 65.1Q52.5 64.1 50.7 62.9Q49 61.8 47.3 60.6Q45.7 59.3 44.1 58Q42.5 56.7 41 55.2Q39.5 53.7 38 52.1Q36.6 50.6 35.3 48.8Q34 47.1 32.8 45.3Q31.5 43.4 30.4 41.5Q29.3 39.5 28.4 37.4Q27.4 35.2 26.6 33Q25.8 30.7 25.2 28.3Q24.6 25.9 24.1 23.4Q23.6 20.9 23 21Q22.4 21.1 22.8 23.7Q23.3 26.2 23.9 28.7Q24.6 31.1 25.3 33.4Q26.1 35.7 26.9 38Q27.7 40.2 28.7 42.4Q29.6 44.5 30.7 46.5Q31.8 48.5 33 50.5Q34.2 52.4 35.5 54.2Q36.9 56 38.3 57.7Q39.8 59.4 41.3 61Q42.9 62.5 44.6 64Q46.3 65.4 48.1 66.7Q49.9 68.1 51.8 69.2Q53.7 70.4 55.7 71.4Q57.7 72.5 59.8 73.3Q61.8 74.2 64 75Q66.1 75.7 68.3 76.3Q70.5 76.9 72.8 77.4Q75 77.8 77.3 78.2Q79.6 78.5 82 78.7Q84.3 78.9 86.7 78.9Q89.1 79 91.4 78.9Q93.8 78.9 96.2 78.7Q98.6 78.5 101.1 78.2Q103.5 77.9 105.9 77.5Q108.3 77 110.8 76.5L113.2 76Z',\n    head: 'M22.5 17.5Q28.8 24 35.1 36.8Q24.7 31.7 17.2 39.6Q18.9 25.5 22.5 17.5Z',\n  },\n  right: {\n    box: '0 0 120 52',\n    shaft:\n      'M5.3 12.9Q9.5 12 11.6 11.6Q13.7 11.2 15.9 11Q18 10.7 20.2 10.5Q22.4 10.3 24.5 10.3Q26.7 10.2 28.9 10.2Q31.1 10.1 33.3 10.2Q35.5 10.3 37.7 10.4Q39.9 10.6 42.1 10.8Q44.3 11 46.5 11.3Q48.7 11.6 50.9 11.9Q53.1 12.3 55.3 12.7Q57.5 13.2 59.7 13.7Q61.9 14.2 64.1 14.8Q66.3 15.4 68.5 16Q70.7 16.7 72.8 17.5Q75 18.2 77.1 19.1Q79.2 19.9 81.4 20.8Q83.5 21.8 85.5 22.8Q87.6 23.8 89.6 24.9Q91.7 26.1 93.6 27.3Q95.6 28.5 97.6 29.8Q99.5 31.1 101.4 32.5Q103.3 33.9 105 35.4Q106.8 36.9 108.5 38.5Q110.2 40.1 111.9 41.8Q113.5 43.4 114 43Q114.5 42.6 112.8 40.9Q111.1 39.2 109.4 37.5Q107.7 35.9 105.9 34.4Q104.1 32.8 102.3 31.3Q100.4 29.8 98.5 28.4Q96.7 27 94.7 25.6Q92.8 24.3 90.8 23Q88.8 21.7 86.7 20.5Q84.7 19.4 82.6 18.2Q80.5 17.1 78.4 16.1Q76.3 15.1 74.1 14.2Q71.9 13.2 69.7 12.4Q67.5 11.5 65.3 10.8Q63.1 10.1 60.8 9.4Q58.6 8.8 56.3 8.3Q54 7.7 51.7 7.3Q49.4 6.9 47.1 6.6Q44.8 6.3 42.5 6.1Q40.2 5.9 37.9 5.8Q35.6 5.8 33.3 5.8Q31 5.9 28.7 6Q26.5 6.2 24.2 6.5Q22 6.7 19.8 7.1Q17.5 7.5 15.4 8Q13.2 8.5 11 9.1Q8.9 9.7 6.8 10.4L4.7 11.1Z',\n    head: 'M116.4 45.6Q107.6 43.8 95.1 36.7Q106.6 35.1 108.3 24.4Q114.8 37 116.4 45.6Z',\n  },\n  left: {\n    box: '0 0 120 52',\n    shaft:\n      'M115.3 11.1Q111.1 9.7 109 9.1Q106.8 8.5 104.6 8Q102.5 7.6 100.2 7.2Q98 6.9 95.8 6.6Q93.5 6.4 91.3 6.2Q89 6.1 86.7 6.1Q84.4 6.1 82.1 6.2Q79.8 6.3 77.5 6.5Q75.2 6.7 72.9 7Q70.7 7.3 68.4 7.7Q66.1 8.1 63.8 8.6Q61.5 9.1 59.3 9.7Q57 10.3 54.8 11Q52.5 11.7 50.3 12.5Q48.1 13.3 45.9 14.2Q43.7 15.1 41.6 16.1Q39.4 17.1 37.3 18.2Q35.2 19.2 33.2 20.4Q31.1 21.6 29.1 22.8Q27.1 24.1 25.2 25.4Q23.2 26.8 21.3 28.2Q19.5 29.7 17.6 31.2Q15.8 32.7 14 34.3Q12.3 35.8 10.5 37.5Q8.8 39.1 7.2 40.8Q5.5 42.6 6 43Q6.5 43.4 8.1 41.8Q9.8 40.1 11.5 38.5Q13.3 37 15 35.5Q16.8 34 18.7 32.6Q20.6 31.2 22.6 29.9Q24.5 28.7 26.5 27.4Q28.4 26.2 30.5 25.1Q32.5 24 34.5 22.9Q36.6 21.9 38.7 20.9Q40.8 20 42.9 19.1Q45 18.2 47.2 17.4Q49.3 16.6 51.5 15.9Q53.6 15.2 55.8 14.5Q58 13.9 60.2 13.4Q62.4 12.8 64.6 12.4Q66.8 11.9 69 11.5Q71.2 11.2 73.5 10.9Q75.7 10.6 77.9 10.4Q80.1 10.2 82.3 10.1Q84.5 10 86.7 9.9Q88.9 9.9 91.1 9.9Q93.3 10 95.5 10.1Q97.7 10.2 99.8 10.4Q102 10.6 104.1 10.9Q106.3 11.2 108.4 11.6Q110.5 12 112.6 12.5L114.7 12.9Z',\n    head: 'M3.6 45.6Q4.8 36.6 11 23.7Q13.4 35.1 24.2 36Q12.1 43.4 3.6 45.6Z',\n  },\n  'loop-right': {\n    box: '0 0 132 70',\n    shaft:\n      'M7 46.6Q13.9 36.3 17.7 32.3Q21.5 28.4 25.5 25.6Q29.5 22.8 33.5 21.1Q37.5 19.5 41.2 18.9Q44.9 18.3 48.2 18.8Q51.5 19.3 54.2 20.6Q56.9 22 58.9 24.3Q60.9 26.6 61.9 29.6Q63 32.5 62.9 34.8Q62.9 37.2 62.1 38.8Q61.4 40.4 60.3 41.5Q59.1 42.6 57.6 43.1Q56.2 43.6 54.6 43.6Q53 43.6 51.5 43Q50 42.4 48.7 41.1Q47.4 39.8 46.5 37.7Q45.6 35.6 45.4 33Q45.3 30.4 46.4 28.4Q47.5 26.4 49.9 24.8Q52.4 23.2 56.1 22.2Q59.9 21.2 64.8 21Q69.7 20.9 75.6 21.6Q81.4 22.3 88 24Q94.5 25.7 101.6 28.4Q108.7 31.2 116.2 34.9Q123.6 38.7 124 38Q124.4 37.3 116.9 33.5Q109.4 29.7 102.2 26.9Q95.1 24.1 88.4 22.2Q81.8 20.4 75.8 19.4Q69.9 18.4 64.7 18.4Q59.6 18.3 55.4 19.2Q51.1 20 48 21.8Q44.8 23.6 43 26.5Q41.2 29.4 41.1 33Q41.1 36.6 42.2 39.5Q43.3 42.5 45.2 44.5Q47.1 46.6 49.6 47.7Q52 48.7 54.5 48.8Q57.1 48.9 59.5 48Q61.9 47.1 63.8 45.2Q65.7 43.4 66.8 40.8Q67.9 38.2 67.9 35Q67.9 31.7 66.4 27.9Q65 24.2 62.3 21.3Q59.6 18.4 56.2 16.8Q52.7 15.1 48.8 14.7Q44.8 14.3 40.6 15.1Q36.4 15.9 32.1 17.9Q27.8 19.8 23.6 22.9Q19.5 26 15.6 30.3Q11.7 34.6 8.3 40L5 45.4Z',\n    head: 'M127 39.7Q118.2 40.7 104.5 37.9Q114.8 32.8 113.4 22.2Q123.1 32.1 127 39.7Z',\n  },\n  'squiggle-right': {\n    box: '0 0 132 58',\n    shaft:\n      'M5.9 30.6Q10.6 25.1 13 23.1Q15.4 21.1 17.8 19.8Q20.1 18.6 22.4 18Q24.7 17.5 26.9 17.6Q29.1 17.8 31.1 18.5Q33.1 19.2 35 20.6Q37 21.9 38.8 23.9Q40.5 25.9 42.2 28.7Q44 31.4 46 34Q48.1 36.6 50.4 38.5Q52.7 40.4 55.2 41.5Q57.7 42.7 60.4 43Q63 43.4 65.6 43Q68.2 42.5 70.7 41.3Q73.1 40 75.4 38.1Q77.6 36.2 79.5 33.6Q81.5 31 83.2 28.3Q84.9 25.5 86.7 23.5Q88.6 21.5 90.7 20.2Q92.9 18.9 95.3 18.2Q97.6 17.6 100.2 17.6Q102.8 17.7 105.5 18.4Q108.2 19.2 111 20.7Q113.7 22.2 116.5 24.4Q119.2 26.6 121.8 29.5Q124.4 32.4 125 32Q125.6 31.6 122.9 28.6Q120.2 25.6 117.3 23.3Q114.5 21 111.7 19.4Q108.8 17.8 106 16.8Q103.1 15.8 100.3 15.6Q97.4 15.4 94.7 15.9Q91.9 16.4 89.3 17.7Q86.7 19 84.4 21.2Q82.1 23.3 80.1 26Q78.2 28.8 76.3 30.9Q74.4 33.1 72.5 34.6Q70.6 36 68.7 36.8Q66.7 37.6 64.9 37.9Q63 38.1 61.2 37.8Q59.3 37.5 57.5 36.6Q55.6 35.7 53.8 34.2Q51.9 32.7 50.2 30.6Q48.4 28.4 46.5 25.6Q44.6 22.8 42.4 20.5Q40.1 18.2 37.6 16.7Q35.1 15.2 32.4 14.4Q29.7 13.7 27 13.7Q24.2 13.8 21.5 14.6Q18.8 15.5 16.2 17.1Q13.6 18.7 11.2 21Q8.7 23.3 6.4 26.3L4.1 29.4Z',\n    head: 'M127 34.5Q117.7 33.3 105.7 26.9Q119.6 25.2 123.4 12.8Q127.4 25.6 127 34.5Z',\n  },\n  's-curve-down': {\n    box: '0 0 92 104',\n    shaft:\n      'M19.7 7.3Q28.6 10.2 32.3 11.8Q35.9 13.5 38.8 15.2Q41.7 16.9 43.8 18.7Q45.9 20.4 47.4 22.2Q48.9 23.9 49.7 25.6Q50.6 27.2 50.9 28.8Q51.3 30.4 51.3 32Q51.2 33.5 50.8 35.1Q50.4 36.6 49.6 38.2Q48.8 39.8 47.6 41.3Q46.4 42.9 44.9 44.4Q43.3 45.9 41.4 47.3Q39.6 48.7 37.5 50.3Q35.4 51.9 33.7 53.7Q32 55.4 30.8 57.3Q29.5 59.2 28.7 61.1Q27.9 63.1 27.6 65.1Q27.3 67.2 27.5 69.2Q27.6 71.2 28.2 73.3Q28.8 75.3 29.9 77.2Q31 79.2 32.5 81.1Q34 83.1 35.9 84.9Q37.9 86.8 40.2 88.7Q42.5 90.6 45.3 92.4Q48.1 94.2 51.4 96Q54.6 97.8 55 97Q55.4 96.2 52.2 94.5Q49 92.7 46.3 90.9Q43.6 89.1 41.3 87.3Q39.1 85.4 37.4 83.5Q35.7 81.6 34.4 79.7Q33.2 77.9 32.4 76.1Q31.6 74.2 31.2 72.5Q30.9 70.8 30.9 69.1Q31 67.5 31.4 65.9Q31.8 64.4 32.5 62.9Q33.3 61.4 34.5 60Q35.6 58.6 37.1 57.2Q38.6 55.8 40.5 54.6Q42.4 53.3 44.6 51.7Q46.9 50.2 48.8 48.5Q50.7 46.8 52.2 44.9Q53.7 43 54.8 40.9Q55.9 38.8 56.4 36.5Q57 34.3 57 32Q57 29.7 56.3 27.4Q55.6 25.2 54.3 23Q53 20.9 51 18.9Q49.1 16.9 46.5 15.1Q43.9 13.3 40.7 11.7Q37.5 10.1 33.6 8.7Q29.6 7.2 25 6L20.3 4.7Z',\n    head: 'M58.2 98.6Q48.2 101.7 33 100.8Q46.3 92.7 44.2 78.4Q54.4 89.4 58.2 98.6Z',\n  },\n  'hook-left': {\n    box: '0 0 132 80',\n    shaft:\n      'M126.3 13.9Q115.8 11.2 110.5 10.3Q105.2 9.3 99.9 8.6Q94.5 8 89.3 7.7Q84 7.5 78.9 7.6Q73.7 7.6 68.8 8.1Q63.8 8.6 59.1 9.4Q54.3 10.2 49.9 11.4Q45.4 12.6 41.3 14.1Q37.3 15.7 33.6 17.6Q29.9 19.6 26.7 21.9Q23.5 24.2 20.8 27Q18.1 29.7 16 32.9Q14 36 13 38.9Q12 41.7 11.8 44.3Q11.5 47 11.9 49.5Q12.4 52 13.4 54.1Q14.4 56.3 15.9 58.2Q17.5 60 19.4 61.5Q21.3 63 23.6 64.1Q25.8 65.2 28.3 65.9Q30.8 66.6 33.4 66.9Q36.1 67.1 38.9 67Q41.6 66.8 44.5 66.3Q47.3 65.7 50.1 64.7Q52.9 63.7 55.7 62.1Q58.4 60.6 58 60Q57.6 59.4 54.9 60.8Q52.3 62.2 49.6 63.1Q46.8 64 44.1 64.5Q41.5 64.9 38.9 64.9Q36.2 64.8 33.8 64.4Q31.4 63.9 29.2 63.1Q27 62.3 25.1 61.2Q23.2 60.1 21.6 58.8Q20.1 57.4 18.9 55.9Q17.8 54.3 17 52.5Q16.3 50.8 16.1 48.9Q15.8 46.9 16 44.8Q16.3 42.6 17.2 40.3Q18 38 19.8 35.3Q21.6 32.5 24 30.1Q26.4 27.7 29.3 25.6Q32.3 23.4 35.7 21.6Q39.1 19.8 43 18.3Q46.8 16.8 51 15.6Q55.3 14.4 59.8 13.6Q64.4 12.7 69.2 12.2Q74 11.6 79 11.4Q84 11.2 89.1 11.3Q94.3 11.5 99.5 11.9Q104.8 12.4 110 13.1Q115.3 13.9 120.5 15L125.7 16.1Z',\n    head: 'M60.8 58.1Q57.9 66.6 49.2 77.7Q49.2 65.8 38.8 61.7Q52.2 57.9 60.8 58.1Z',\n  },\n  'swoop-down-right': {\n    box: '0 0 142 100',\n    shaft:\n      'M6.2 13.1Q12.6 12.2 15.8 12Q19 11.7 22.1 11.6Q25.2 11.5 28.3 11.5Q31.4 11.5 34.5 11.6Q37.5 11.8 40.5 12.1Q43.5 12.3 46.4 12.8Q49.4 13.2 52.2 13.7Q55.1 14.2 57.9 14.9Q60.7 15.5 63.4 16.3Q66.1 17 68.7 17.9Q71.4 18.8 73.9 19.8Q76.5 20.7 78.9 21.8Q81.4 22.9 83.8 24Q86.2 25.2 88.5 26.4Q90.7 27.7 92.9 29Q95.1 30.4 97.2 31.8Q99.3 33.2 101.3 34.8Q103.3 36.3 105.2 37.9Q107.1 39.6 108.8 41.3Q110.6 43 112.2 44.8Q113.8 46.7 115.3 48.6Q116.8 50.5 118.2 52.6Q119.5 54.6 120.7 56.8Q121.8 59 122.8 61.2Q123.7 63.5 124.5 65.8Q125.3 68.2 126 68Q126.7 67.8 125.9 65.4Q125.1 63 124.2 60.6Q123.2 58.3 122.2 56Q121.1 53.8 119.9 51.6Q118.7 49.4 117.3 47.2Q115.9 45.1 114.4 43Q112.9 41 111.2 39Q109.6 37.1 107.7 35.2Q105.9 33.3 104 31.6Q102 29.8 99.9 28.2Q97.8 26.5 95.5 25Q93.3 23.5 90.9 22.1Q88.6 20.7 86.1 19.4Q83.6 18.1 81 17Q78.4 15.9 75.7 14.9Q73 13.9 70.3 13.1Q67.5 12.2 64.6 11.5Q61.8 10.8 58.9 10.3Q55.9 9.7 52.9 9.3Q50 8.8 46.9 8.6Q43.9 8.3 40.8 8.1Q37.7 8 34.6 8Q31.4 8 28.3 8.1Q25.1 8.3 21.9 8.6Q18.7 8.9 15.5 9.3Q12.3 9.7 9 10.3L5.8 10.9Z',\n    head: 'M127 71.7Q117.5 66.1 107.5 53.5Q123.2 58.1 132.6 46.3Q131.4 62.1 127 71.7Z',\n  },\n  'zigzag-right': {\n    box: '0 0 132 62',\n    shaft:\n      'M5.3 16.7Q9.4 21.4 11.5 23.8Q13.6 26.2 15.7 28.6Q17.8 30.9 19.8 33.3Q21.9 35.7 24 38.1Q26.1 40.4 28.2 42.8Q30.3 45.2 34 45.1Q37.8 45 39.8 42.6Q41.9 40.1 43.9 37.7Q45.9 35.3 48 32.8Q50 30.4 52 27.9Q54 25.4 55.9 23Q57.9 20.5 58.1 18Q58.2 15.6 60.4 18Q62.6 20.4 64.8 22.8Q67 25.2 69.3 27.6Q71.5 30 73.7 32.4Q75.9 34.8 78.2 37.2Q80.4 39.6 82.6 42Q84.8 44.4 88.1 44.8Q91.4 45.1 94.1 43.2Q96.8 41.3 99.6 39.4Q102.3 37.4 105 35.5Q107.8 33.6 110.5 31.8Q113.3 29.9 116 28.1Q118.8 26.2 121.6 24.4Q124.4 22.5 124 22Q123.6 21.5 120.9 23.3Q118.1 25.2 115.3 27Q112.6 28.9 109.8 30.7Q107 32.5 104.2 34.3Q101.4 36.1 98.6 37.9Q95.8 39.7 93 41.4Q90.1 43.2 88.5 42.9Q86.8 42.7 84.8 40.1Q82.7 37.6 80.6 35.1Q78.5 32.6 76.4 30Q74.4 27.5 72.3 25Q70.2 22.5 68.1 20Q66 17.4 63.9 14.9Q61.8 12.4 57.9 14.9Q54.1 17.4 52.1 19.8Q50 22.3 48 24.7Q46 27.2 44 29.6Q42.1 32.1 40.1 34.6Q38.1 37.1 36.2 39.6Q34.2 42.1 33.8 42.1Q33.4 42.2 31.2 40Q29 37.7 26.8 35.5Q24.5 33.2 22.3 31Q20.1 28.8 17.9 26.5Q15.6 24.3 13.4 22Q11.2 19.8 9 17.6L6.7 15.3Z',\n    head: 'M126.5 20.3Q124.7 29 117.8 39.8Q117.3 26.5 105.9 21.9Q118.2 19.2 126.5 20.3Z',\n  },\n  'curl-down': {\n    box: '0 0 104 112',\n    shaft:\n      'M26.2 13.5Q44 13.4 50.8 14.8Q57.6 16.2 62.4 18.6Q67.2 21 70 23.9Q72.8 26.9 73.8 29.9Q74.8 32.9 74.3 35.8Q73.8 38.7 71.8 41.4Q69.7 44.1 66 46.4Q62.3 48.7 57 50.1Q51.8 51.5 47.4 51.5Q43.1 51.5 40 50.3Q36.9 49.1 34.9 47.1Q32.9 45.2 31.9 42.7Q30.9 40.3 30.9 37.6Q31 34.9 32.1 32.4Q33.2 29.8 35.5 27.6Q37.8 25.5 41.5 24.1Q45.1 22.7 49.6 22.5Q54.1 22.3 57.6 23.7Q61.1 25.1 63.7 28.1Q66.4 31 68.2 35.4Q70 39.7 70.9 45.2Q71.7 50.6 71.6 56.8Q71.5 63.1 70.4 69.8Q69.2 76.5 67.2 83.3Q65.1 90.1 62.1 96.9Q59.2 103.6 60 104Q60.8 104.4 63.9 97.7Q67 90.9 69.1 83.9Q71.3 77 72.5 70.1Q73.7 63.3 74 56.9Q74.4 50.5 73.7 44.7Q73 39 71.2 34.1Q69.4 29.3 66.4 25.7Q63.4 22 59.1 20.1Q54.8 18.1 49.5 18.1Q44.3 18.1 39.8 19.6Q35.3 21.2 32.1 23.9Q28.9 26.6 27.2 30.1Q25.5 33.6 25.3 37.4Q25.1 41.2 26.4 44.8Q27.7 48.5 30.6 51.4Q33.4 54.3 37.6 56Q41.9 57.7 47.3 57.8Q52.7 57.9 58.7 56.2Q64.8 54.5 69.4 51.6Q73.9 48.7 76.6 44.8Q79.3 40.9 79.9 36.6Q80.4 32.3 78.8 28.1Q77.1 24 73.5 20.6Q69.8 17.1 64.3 14.7Q58.9 12.3 51.5 11.1Q44.2 9.9 35 10.2L25.8 10.5Z',\n    head: 'M58 107.7Q54.8 96 56.4 78.4Q65.3 94 81.7 91.7Q68.7 103.4 58 107.7Z',\n  },\n  'arc-over-right': {\n    box: '0 0 132 74',\n    shaft:\n      'M7 60.3Q9.5 54.4 11 51.7Q12.5 48.9 14.1 46.4Q15.7 43.9 17.5 41.7Q19.3 39.4 21.3 37.4Q23.2 35.4 25.3 33.6Q27.4 31.8 29.6 30.2Q31.7 28.6 34 27.2Q36.3 25.9 38.7 24.7Q41.1 23.6 43.5 22.7Q46 21.7 48.5 21Q51 20.3 53.6 19.8Q56.2 19.3 58.8 19Q61.4 18.7 64 18.6Q66.7 18.5 69.3 18.6Q72 18.7 74.6 19Q77.2 19.3 79.9 19.8Q82.5 20.3 85.1 21Q87.7 21.7 90.2 22.6Q92.8 23.5 95.3 24.6Q97.8 25.8 100.2 27.1Q102.7 28.4 105 29.9Q107.4 31.5 109.6 33.2Q111.9 35 113.9 37Q116 39 118 41.2Q119.9 43.5 121.7 45.9Q123.4 48.4 124 48Q124.6 47.6 122.8 45.1Q121.1 42.6 119.1 40.2Q117.2 37.9 115.1 35.8Q113.1 33.6 110.9 31.7Q108.7 29.7 106.4 27.9Q104.1 26.2 101.7 24.6Q99.2 23.1 96.7 21.8Q94.1 20.5 91.5 19.4Q88.9 18.3 86.1 17.4Q83.4 16.5 80.7 15.9Q77.9 15.3 75.1 14.9Q72.3 14.5 69.5 14.3Q66.7 14.2 63.9 14.2Q61.1 14.3 58.3 14.7Q55.5 15 52.8 15.5Q50 16.1 47.3 16.9Q44.6 17.7 42 18.7Q39.4 19.8 36.9 21.1Q34.4 22.3 32 23.8Q29.5 25.4 27.3 27.1Q25 28.9 22.8 30.9Q20.7 32.8 18.7 35.1Q16.8 37.3 15 39.7Q13.2 42.2 11.6 44.9Q10 47.6 8.7 50.5Q7.3 53.4 6.1 56.5L5 59.7Z',\n    head: 'M126 51Q115.7 48.6 103.1 40Q118.7 39.8 124.1 26.5Q127.3 41.2 126 51Z',\n  },\n  'jab-down-right': {\n    box: '0 0 84 74',\n    shaft:\n      'M10.2 11Q12.6 10.7 13.8 10.6Q15 10.6 16.3 10.6Q17.5 10.6 18.7 10.8Q19.9 10.9 21.1 11.1Q22.3 11.3 23.6 11.6Q24.8 11.9 26 12.3Q27.2 12.7 28.4 13.1Q29.6 13.6 30.8 14.1Q32 14.7 33.2 15.3Q34.4 15.9 35.5 16.6Q36.7 17.2 37.9 18Q39.1 18.7 40.2 19.5Q41.4 20.4 42.5 21.2Q43.7 22.1 44.8 23.1Q45.9 24 47.1 25.1Q48.2 26.1 49.3 27.2Q50.4 28.3 51.4 29.5Q52.5 30.7 53.5 31.9Q54.6 33.2 55.6 34.6Q56.6 35.9 57.5 37.4Q58.4 38.8 59.3 40.4Q60.2 41.9 61 43.6Q61.8 45.2 62.5 46.9Q63.2 48.7 63.8 50.5Q64.4 52.3 64.9 54.2Q65.4 56.2 66 56Q66.6 55.8 66.1 53.9Q65.6 52 65.1 50.1Q64.5 48.2 63.8 46.4Q63.2 44.6 62.6 42.9Q61.9 41.1 61.2 39.5Q60.5 37.8 59.7 36.2Q58.9 34.5 58.1 33Q57.2 31.5 56.3 30Q55.4 28.5 54.4 27.1Q53.4 25.7 52.4 24.4Q51.3 23.1 50.2 21.9Q49.1 20.7 48 19.6Q46.8 18.4 45.6 17.4Q44.4 16.4 43.1 15.5Q41.9 14.6 40.6 13.7Q39.3 12.9 37.9 12.2Q36.6 11.5 35.2 10.9Q33.9 10.3 32.5 9.9Q31.1 9.4 29.7 9Q28.4 8.6 27 8.3Q25.6 8.1 24.2 7.9Q22.9 7.7 21.5 7.7Q20.1 7.6 18.8 7.6Q17.5 7.7 16.2 7.8Q14.8 7.9 13.6 8.1Q12.3 8.4 11 8.7L9.8 9Z',\n    head: 'M66.7 59.1Q58.8 54.1 50.7 43.2Q64 47.6 72.7 38Q70.9 51.2 66.7 59.1Z',\n  },\n  'loop-left': {\n    box: '0 0 132 70',\n    shaft:\n      'M127 45.4Q120.3 34.6 116.5 30.3Q112.6 26 108.4 22.8Q104.3 19.7 100 17.7Q95.7 15.7 91.5 14.8Q87.2 14 83.2 14.4Q79.2 14.8 75.7 16.4Q72.1 18.1 69.4 21Q66.7 24 65.2 27.8Q63.8 31.7 63.8 35Q63.9 38.3 65 40.9Q66.2 43.5 68.1 45.3Q70.1 47.1 72.5 48Q74.9 48.8 77.5 48.7Q80 48.6 82.4 47.5Q84.7 46.4 86.5 44.3Q88.4 42.3 89.5 39.4Q90.5 36.5 90.5 33Q90.4 29.5 88.6 26.7Q86.9 23.9 83.8 22.1Q80.7 20.4 76.5 19.5Q72.4 18.7 67.2 18.7Q62.1 18.7 56.2 19.6Q50.2 20.5 43.6 22.4Q37 24.2 29.8 26.9Q22.7 29.7 15.1 33.5Q7.6 37.3 8 38Q8.4 38.7 15.8 34.9Q23.3 31.1 30.4 28.4Q37.5 25.6 44 23.9Q50.6 22.1 56.4 21.4Q62.3 20.6 67.2 20.7Q72.1 20.9 76 21.8Q79.8 22.8 82.3 24.4Q84.8 26.1 86 28.2Q87.1 30.3 87 33Q86.8 35.7 85.9 37.9Q84.9 40 83.5 41.3Q82.1 42.6 80.6 43.2Q79 43.8 77.4 43.7Q75.8 43.7 74.4 43.1Q72.9 42.5 71.8 41.4Q70.7 40.3 70.1 38.7Q69.4 37.1 69.4 34.8Q69.3 32.6 70.4 29.7Q71.4 26.8 73.4 24.6Q75.3 22.4 78 21Q80.6 19.6 83.8 19.1Q87.1 18.7 90.8 19.2Q94.5 19.7 98.4 21.3Q102.4 23 106.4 25.7Q110.4 28.4 114.2 32.4Q118.1 36.3 121.5 41.4L125 46.6Z',\n    head: 'M5 39.7Q8.7 31.6 18.1 21.3Q17.2 32.8 27 37Q13.6 40.2 5 39.7Z',\n  },\n  'squiggle-left': {\n    box: '0 0 132 58',\n    shaft:\n      'M127.9 29.4Q123.3 23.3 120.9 20.9Q118.4 18.6 115.8 17Q113.2 15.4 110.5 14.6Q107.8 13.8 105 13.7Q102.3 13.7 99.6 14.5Q97 15.3 94.5 16.8Q92.1 18.4 89.9 20.7Q87.7 23 85.8 25.8Q84 28.6 82.2 30.9Q80.4 33.1 78.5 34.6Q76.7 36.2 74.8 37.1Q72.9 38 70.9 38.3Q69 38.7 67.1 38.4Q65.1 38.2 63.1 37.3Q61.2 36.4 59.2 34.9Q57.3 33.4 55.5 31.1Q53.6 28.9 51.7 26.2Q49.8 23.4 47.5 21.2Q45.2 19.1 42.7 17.7Q40.1 16.4 37.3 15.8Q34.6 15.3 31.7 15.5Q28.9 15.7 26 16.7Q23.1 17.7 20.3 19.3Q17.4 20.9 14.6 23.2Q11.8 25.5 9.1 28.6Q6.4 31.6 7 32Q7.6 32.4 10.2 29.6Q12.9 26.7 15.6 24.5Q18.3 22.3 21.1 20.8Q23.8 19.3 26.5 18.5Q29.2 17.8 31.8 17.7Q34.4 17.7 36.7 18.3Q39.1 18.9 41.3 20.2Q43.4 21.5 45.4 23.5Q47.3 25.4 49 28.1Q50.7 30.8 52.7 33.4Q54.7 35.9 56.9 37.8Q59.1 39.7 61.5 40.8Q63.9 42 66.5 42.4Q69 42.8 71.6 42.5Q74.1 42.1 76.6 41Q79 39.9 81.3 38Q83.6 36.2 85.6 33.7Q87.7 31.1 89.4 28.4Q91.2 25.7 93 23.8Q94.9 21.8 96.9 20.4Q98.8 19.1 100.9 18.4Q102.9 17.7 105.1 17.6Q107.3 17.5 109.6 18.1Q111.8 18.6 114.2 19.9Q116.6 21.1 119 23.1Q121.4 25.1 123.7 27.9L126.1 30.6Z',\n    head: 'M5 34.5Q4 25.2 7.5 12Q12.4 25.2 25.3 26Q13.8 32.9 5 34.5Z',\n  },\n  'hook-right': {\n    box: '0 0 132 80',\n    shaft:\n      'M6.3 16.1Q16.7 13.9 22 13.1Q27.2 12.3 32.5 11.8Q37.7 11.4 42.8 11.3Q48 11.1 53 11.4Q58 11.6 62.8 12.1Q67.6 12.7 72.2 13.5Q76.7 14.4 80.9 15.6Q85.2 16.8 89 18.3Q92.9 19.9 96.3 21.7Q99.7 23.5 102.6 25.7Q105.5 27.8 107.8 30.3Q110.2 32.7 112 35.4Q113.7 38.1 114.6 40.4Q115.4 42.7 115.7 44.8Q115.9 46.9 115.7 48.8Q115.4 50.7 114.7 52.4Q114 54.2 112.9 55.7Q111.8 57.3 110.3 58.7Q108.7 60 106.9 61.1Q105 62.2 102.8 63.1Q100.6 63.9 98.2 64.3Q95.7 64.8 93.1 64.9Q90.5 64.9 87.8 64.5Q85.2 64 82.4 63.1Q79.7 62.2 77.1 60.8Q74.4 59.4 74 60Q73.6 60.6 76.3 62.1Q79.1 63.7 81.9 64.7Q84.7 65.7 87.5 66.3Q90.4 66.8 93.1 67Q95.9 67.1 98.6 66.9Q101.2 66.6 103.7 66Q106.2 65.3 108.5 64.2Q110.8 63.1 112.7 61.6Q114.7 60.2 116.2 58.3Q117.8 56.5 118.8 54.2Q119.9 52 120.3 49.5Q120.8 47 120.5 44.3Q120.3 41.6 119.3 38.8Q118.3 35.9 116.2 32.7Q114.1 29.5 111.4 26.8Q108.7 24.1 105.4 21.8Q102.2 19.4 98.5 17.5Q94.8 15.6 90.7 14.1Q86.6 12.5 82.1 11.4Q77.7 10.2 72.9 9.4Q68.2 8.6 63.2 8.2Q58.3 7.7 53.1 7.6Q48 7.6 42.7 7.8Q37.5 8.1 32.2 8.7Q26.8 9.3 21.5 10.3Q16.2 11.3 11 12.6L5.7 13.9Z',\n    head: 'M71.2 58.1Q80.1 57.4 93.7 60.9Q82.8 65.8 83.3 76.8Q74.4 66.2 71.2 58.1Z',\n  },\n  'swoop-down-left': {\n    box: '0 0 142 100',\n    shaft:\n      'M136.2 10.9Q129.7 9.7 126.5 9.3Q123.3 8.8 120.1 8.5Q116.9 8.2 113.7 8Q110.6 7.9 107.4 7.9Q104.3 7.8 101.2 8Q98.1 8.1 95.1 8.4Q92 8.6 89 9Q86 9.5 83.1 10Q80.2 10.6 77.3 11.3Q74.5 12 71.7 12.9Q68.9 13.8 66.2 14.8Q63.5 15.8 61 16.9Q58.4 18.1 55.9 19.4Q53.4 20.7 51.1 22.1Q48.7 23.5 46.5 25Q44.3 26.6 42.2 28.3Q40.1 29.9 38.1 31.7Q36.2 33.4 34.4 35.3Q32.6 37.2 30.9 39.1Q29.2 41.1 27.7 43.1Q26.2 45.2 24.8 47.3Q23.5 49.4 22.2 51.6Q21 53.8 19.9 56.1Q18.8 58.3 17.9 60.7Q16.9 63 16.1 65.4Q15.3 67.8 16 68Q16.7 68.2 17.5 65.8Q18.2 63.5 19.2 61.2Q20.1 58.9 21.2 56.8Q22.4 54.6 23.7 52.5Q25 50.5 26.5 48.5Q28 46.6 29.7 44.7Q31.3 42.9 33.1 41.2Q34.8 39.4 36.7 37.8Q38.6 36.2 40.6 34.6Q42.6 33.1 44.7 31.7Q46.8 30.3 49 29Q51.2 27.6 53.5 26.4Q55.8 25.2 58.2 24.1Q60.6 22.9 63.1 21.9Q65.6 20.8 68.1 19.9Q70.7 18.9 73.3 18.1Q76 17.3 78.7 16.5Q81.4 15.8 84.2 15.1Q87 14.5 89.8 13.9Q92.7 13.4 95.6 13Q98.5 12.5 101.5 12.2Q104.5 11.9 107.5 11.8Q110.6 11.6 113.7 11.6Q116.8 11.5 119.9 11.6Q123 11.7 126.2 12Q129.4 12.3 132.6 12.7L135.8 13.1Z',\n    head: 'M15 71.7Q9.8 61.9 7.9 45.9Q18.8 58.1 33.1 53.1Q23.7 65.8 15 71.7Z',\n  },\n  'zigzag-left': {\n    box: '0 0 132 62',\n    shaft:\n      'M125.3 15.3Q120.8 19.8 118.6 22Q116.3 24.2 114.1 26.5Q111.9 28.7 109.6 31Q107.4 33.2 105.2 35.4Q103 37.7 100.8 40Q98.6 42.2 98.2 42.2Q97.8 42.1 95.8 39.6Q93.8 37.2 91.8 34.7Q89.8 32.2 87.8 29.8Q85.8 27.3 83.8 24.9Q81.8 22.4 79.7 20Q77.7 17.5 74.1 15.1Q70.4 12.6 68.3 15.1Q66.2 17.6 64.1 20.1Q62 22.7 59.9 25.2Q57.8 27.7 55.7 30.2Q53.6 32.7 51.5 35.2Q49.4 37.7 47.3 40.2Q45.2 42.7 43.5 43Q41.8 43.2 39 41.5Q36.2 39.7 33.4 37.9Q30.6 36.1 27.8 34.3Q25 32.5 22.2 30.7Q19.5 28.8 16.7 27Q13.9 25.1 11.1 23.3Q8.4 21.5 8 22Q7.6 22.5 10.4 24.4Q13.2 26.3 15.9 28.1Q18.7 29.9 21.5 31.8Q24.2 33.7 27 35.6Q29.7 37.5 32.4 39.4Q35.2 41.3 37.9 43.2Q40.6 45.1 43.9 44.7Q47.1 44.3 49.3 41.9Q51.5 39.5 53.7 37.1Q55.9 34.7 58.1 32.3Q60.3 29.9 62.5 27.5Q64.7 25 67 22.6Q69.2 20.2 71.4 17.8Q73.6 15.4 73.9 17.8Q74.3 20.3 76.3 22.8Q78.2 25.3 80.2 27.8Q82.2 30.2 84.2 32.7Q86.2 35.2 88.2 37.6Q90.2 40.1 92.2 42.5Q94.2 45 98 45.1Q101.7 45.2 103.8 42.8Q105.9 40.5 108 38.1Q110.1 35.7 112.2 33.4Q114.3 31 116.4 28.6Q118.4 26.2 120.5 23.8Q122.6 21.5 124.7 19.1L126.7 16.7Z',\n    head: 'M5.5 20.3Q14.2 18.6 26.8 20.9Q14.7 26.5 14.9 38.7Q7.7 28.4 5.5 20.3Z',\n  },\n  'arc-over-left': {\n    box: '0 0 132 74',\n    shaft:\n      'M127 59.7Q124.7 53.4 123.4 50.5Q122 47.5 120.4 44.8Q118.9 42.2 117.1 39.7Q115.3 37.2 113.3 35Q111.3 32.8 109.2 30.8Q107.1 28.8 104.8 27.1Q102.5 25.3 100.1 23.8Q97.6 22.3 95.1 21Q92.6 19.8 90 18.8Q87.3 17.7 84.7 17Q82 16.2 79.2 15.6Q76.5 15.1 73.7 14.8Q70.9 14.5 68.1 14.4Q65.3 14.3 62.5 14.5Q59.7 14.7 56.9 15Q54.1 15.4 51.4 16.1Q48.6 16.7 45.9 17.5Q43.2 18.4 40.6 19.5Q37.9 20.6 35.4 21.9Q32.8 23.2 30.4 24.7Q27.9 26.2 25.6 28Q23.3 29.7 21.1 31.7Q18.9 33.7 16.9 35.8Q14.8 37.9 12.9 40.2Q10.9 42.6 9.2 45.1Q7.4 47.6 8 48Q8.6 48.4 10.3 45.9Q12.1 43.5 14 41.2Q16 39 18.1 37Q20.1 35 22.4 33.2Q24.6 31.4 27 29.9Q29.3 28.3 31.7 27Q34.2 25.7 36.7 24.5Q39.2 23.4 41.7 22.5Q44.3 21.6 46.9 20.9Q49.5 20.1 52.1 19.6Q54.7 19.1 57.4 18.8Q60 18.5 62.7 18.4Q65.3 18.3 68 18.4Q70.6 18.5 73.2 18.8Q75.8 19.2 78.4 19.7Q81 20.2 83.5 21Q86 21.7 88.5 22.6Q90.9 23.6 93.3 24.7Q95.7 25.9 97.9 27.3Q100.2 28.7 102.4 30.2Q104.6 31.8 106.7 33.6Q108.7 35.4 110.7 37.5Q112.6 39.5 114.4 41.7Q116.2 44 117.8 46.5Q119.5 49 121 51.7Q122.4 54.4 123.7 57.4L125 60.3Z',\n    head: 'M6 51Q4 40.7 6.6 25.7Q13.3 39.8 27.6 39.2Q15.6 48.2 6 51Z',\n  },\n  'jab-down-left': {\n    box: '0 0 84 74',\n    shaft:\n      'M74.2 9Q71.7 8.4 70.4 8.2Q69.2 7.9 67.8 7.8Q66.5 7.7 65.2 7.7Q63.9 7.7 62.5 7.7Q61.1 7.8 59.8 8Q58.4 8.2 57 8.5Q55.7 8.8 54.3 9.1Q52.9 9.5 51.6 10Q50.2 10.5 48.8 11.1Q47.5 11.7 46.2 12.4Q44.8 13.1 43.5 13.9Q42.2 14.7 41 15.6Q39.7 16.5 38.5 17.5Q37.2 18.5 36.1 19.6Q34.9 20.7 33.8 21.9Q32.7 23.1 31.6 24.4Q30.5 25.7 29.6 27.1Q28.6 28.5 27.6 29.9Q26.7 31.4 25.9 32.9Q25 34.5 24.2 36.1Q23.5 37.7 22.7 39.4Q22 41.1 21.4 42.9Q20.7 44.6 20.1 46.4Q19.5 48.2 18.9 50.1Q18.3 52 17.9 53.9Q17.4 55.8 18 56Q18.6 56.2 19.2 54.2Q19.7 52.3 20.3 50.5Q20.9 48.7 21.6 47Q22.2 45.2 23.1 43.6Q23.9 42 24.8 40.4Q25.6 38.9 26.6 37.4Q27.5 36 28.5 34.6Q29.5 33.3 30.5 32Q31.5 30.7 32.6 29.5Q33.7 28.3 34.7 27.2Q35.8 26.1 36.9 25Q38 24 39.2 23Q40.3 22.1 41.4 21.2Q42.6 20.3 43.7 19.4Q44.9 18.6 46 17.9Q47.2 17.1 48.4 16.4Q49.6 15.7 50.8 15.1Q51.9 14.5 53.1 14Q54.3 13.5 55.6 13Q56.8 12.5 58 12.2Q59.2 11.8 60.4 11.5Q61.6 11.2 62.9 11Q64.1 10.8 65.3 10.7Q66.5 10.6 67.7 10.6Q69 10.5 70.2 10.6Q71.4 10.7 72.6 10.8L73.8 11Z',\n    head: 'M17.3 59.1Q12.4 51.1 10 37.7Q20 47.6 32 42.9Q24.5 53.9 17.3 59.1Z',\n  },\n};\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport { cn } from '../cn';\nimport { ARROWS, type ArrowVariant } from './arrow-paths';\n\n/** CSS edge offsets. Any length or percentage the property accepts. */\nexport interface AnnotationOffsets {\n  top?: string;\n  left?: string;\n  right?: string;\n  bottom?: string;\n}\n\nexport interface Annotation {\n  /** Stable key. Also what a consumer matches on when tuning placement. */\n  id: string;\n  /** The note itself. Kept short — this is marker on a screenshot, not prose. */\n  text: string;\n  arrow: ArrowVariant;\n  /**\n   * Placement of the note within the stage. Percentages resolve against the\n   * stage, so vertical offsets track content of varying height while\n   * horizontal ones usually want pixels.\n   */\n  pos: AnnotationOffsets;\n  /**\n   * Nudge the arrow on its own, from wherever `pos` put the note — so you can\n   * stretch the gap between text and arrow, or push the tip onto its target,\n   * without dragging the copy along too. Added to `pos` rather than replacing\n   * it, and it doesn't move the text.\n   *\n   * Percentages resolve against the note, not the stage, because these are\n   * offsets on the child rather than on the positioned note itself. Setting\n   * both `top` and `bottom` (or `left` and `right`) resolves the usual CSS way\n   * — the first of each pair wins.\n   */\n  posArrow?: AnnotationOffsets;\n  /** The same, for the text. Leaves the arrow where it is. */\n  posText?: AnnotationOffsets;\n  /** Degrees of rotation on the note as a whole, for a placed-by-hand feel. */\n  tilt?: number;\n  /** Multiplier on the arrow's length when one needs to reach further. */\n  arrowScale?: number;\n  /**\n   * Degrees of rotation on the arrow alone, leaving the text upright.\n   *\n   * Re-aims an existing curve instead of drawing a new one: `down-left` at 90°\n   * comes in from the top and points right. Rotation is visual only — the\n   * element's layout box doesn't rotate with it, so a re-aimed arrow will\n   * overhang its box and you'll want to re-check `pos`. Composes on top of\n   * `tilt`, which rotates the note and arrow together.\n   */\n  rotate?: number;\n  /** Mirror the arrow left-to-right. Text is untouched. */\n  flipH?: boolean;\n  /** Mirror the arrow top-to-bottom. Text is untouched. */\n  flipV?: boolean;\n}\n\nfunction ScribbleArrow({ variant, offset }: { variant: ArrowVariant; offset?: AnnotationOffsets }) {\n  const arrow = ARROWS[variant];\n  return (\n    <svg\n      className=\"annotation-arrow\"\n      viewBox={arrow.box}\n      fill=\"currentColor\"\n      aria-hidden=\"true\"\n      style={offset}\n    >\n      <path d={arrow.shaft} />\n      <path d={arrow.head} />\n    </svg>\n  );\n}\n\n/**\n * Which edge of the note the arrow hangs off, derived from the variant name so\n * adding a variant needs no CSS. A note sitting left of its target wants the\n * arrow on its right edge and its text ragged-right, and vice versa; the\n * straight-down variants centre instead.\n */\nfunction arrowSide(variant: ArrowVariant): 'left' | 'right' | 'center' {\n  if (variant === 'left' || variant.endsWith('-left')) return 'left';\n  if (variant === 'right' || variant.endsWith('-right')) return 'right';\n  return 'center';\n}\n\nexport interface AnnotationLayerProps extends HTMLAttributes<HTMLDivElement> {\n  annotations: readonly Annotation[];\n}\n\n/**\n * The floating notes, absolutely positioned over a stage.\n *\n * Hidden until the stage is wide enough to hold notes in its margins — below\n * that they would land on top of the content they point at, and\n * {@link AnnotationList} carries the same copy instead. This layer is\n * `aria-hidden`, so the list is what assistive tech reads.\n */\nexport function AnnotationLayer({ annotations, className, ...props }: AnnotationLayerProps) {\n  return (\n    <div className={cn('annotation-layer', className)} aria-hidden=\"true\" {...props}>\n      {annotations.map((note) => (\n        <div\n          key={note.id}\n          className=\"annotation\"\n          data-side={arrowSide(note.arrow)}\n          // Upward arrows sit above the text they belong to, not below it.\n          data-flip={note.arrow.startsWith('up-') ? '' : undefined}\n          style={{\n            ...note.pos,\n            ['--annotation-tilt' as string]: `${note.tilt ?? 0}deg`,\n            ...(note.arrowScale\n              ? { ['--annotation-arrow-scale' as string]: String(note.arrowScale) }\n              : {}),\n            ...(note.rotate\n              ? { ['--annotation-arrow-rotate' as string]: `${note.rotate}deg` }\n              : {}),\n            ...(note.flipH ? { ['--annotation-arrow-flip-x' as string]: '-1' } : {}),\n            ...(note.flipV ? { ['--annotation-arrow-flip-y' as string]: '-1' } : {}),\n          }}\n        >\n          <span className=\"annotation-text\" style={note.posText}>\n            {note.text}\n          </span>\n          <ScribbleArrow variant={note.arrow} offset={note.posArrow} />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport interface AnnotationListProps extends HTMLAttributes<HTMLUListElement> {\n  annotations: readonly Annotation[];\n}\n\n/**\n * Narrow-viewport fallback, and the accessible copy of the annotations — the\n * floating layer is `aria-hidden`, so this is what gets announced.\n */\nexport function AnnotationList({ annotations, className, ...props }: AnnotationListProps) {\n  if (annotations.length === 0) return null;\n  return (\n    <ul className={cn('annotation-list', className)} {...props}>\n      {annotations.map((note) => (\n        <li key={note.id}>{note.text}</li>\n      ))}\n    </ul>\n  );\n}\n\nexport interface AnnotationStageProps extends HTMLAttributes<HTMLDivElement> {\n  annotations: readonly Annotation[];\n  /** The thing being annotated. */\n  children: ReactNode;\n}\n\n/**\n * Wraps annotated content and hosts both renderings of the notes.\n *\n * Two elements, because they hold different things. The inner one is the\n * positioning context the notes' `pos` values resolve against and hugs the\n * content; the outer one carries the consumer's own padding and the list.\n * Notes deliberately overhang the inner box into the surrounding margins.\n *\n * Because that overhang lands in space an *ancestor* owns, whether a note fits\n * is a viewport question, not a stage-width one — see the media query in\n * annotations.css, and re-declare it if your layout is constrained.\n */\nexport function AnnotationStage({\n  annotations,\n  children,\n  className,\n  ...props\n}: AnnotationStageProps) {\n  return (\n    <div className={cn('annotation-stage', className)} {...props}>\n      <div className=\"annotation-stage-inner\">\n        <AnnotationLayer annotations={annotations} />\n        {children}\n      </div>\n      <AnnotationList annotations={annotations} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/annotations/index.d.cts

@@ -0,0 +1,115 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+/**
+ * Arrow outlines for {@link AnnotationLayer} — GENERATED, do not hand-edit.
+ *
+ * Regenerate with:  python3 scripts/gen-arrow-paths.py
+ * then paste the object below and update the union to match. The generator owns
+ * the curve control points, width profiles and head geometry; see its docstring
+ * for why these are filled outlines rather than strokes.
+ *
+ * Six calm directional workhorses, then the expressive set — loops, S-bends,
+ * zigzags — for notes that want more voice. The `-left`/`-right` twins of the
+ * expressive shapes are reflections of one source curve, so editing a source
+ * updates its mirror on the next run.
+ */
+type ArrowVariant = 'down-right' | 'down-left' | 'up-right' | 'up-left' | 'right' | 'left' | 'loop-right' | 'squiggle-right' | 's-curve-down' | 'hook-left' | 'swoop-down-right' | 'zigzag-right' | 'curl-down' | 'arc-over-right' | 'jab-down-right' | 'loop-left' | 'squiggle-left' | 'hook-right' | 'swoop-down-left' | 'zigzag-left' | 'arc-over-left' | 'jab-down-left';
+declare const ARROWS: Record<ArrowVariant, {
+    box: string;
+    shaft: string;
+    head: string;
+}>;
+
+/** CSS edge offsets. Any length or percentage the property accepts. */
+interface AnnotationOffsets {
+    top?: string;
+    left?: string;
+    right?: string;
+    bottom?: string;
+}
+interface Annotation {
+    /** Stable key. Also what a consumer matches on when tuning placement. */
+    id: string;
+    /** The note itself. Kept short — this is marker on a screenshot, not prose. */
+    text: string;
+    arrow: ArrowVariant;
+    /**
+     * Placement of the note within the stage. Percentages resolve against the
+     * stage, so vertical offsets track content of varying height while
+     * horizontal ones usually want pixels.
+     */
+    pos: AnnotationOffsets;
+    /**
+     * Nudge the arrow on its own, from wherever `pos` put the note — so you can
+     * stretch the gap between text and arrow, or push the tip onto its target,
+     * without dragging the copy along too. Added to `pos` rather than replacing
+     * it, and it doesn't move the text.
+     *
+     * Percentages resolve against the note, not the stage, because these are
+     * offsets on the child rather than on the positioned note itself. Setting
+     * both `top` and `bottom` (or `left` and `right`) resolves the usual CSS way
+     * — the first of each pair wins.
+     */
+    posArrow?: AnnotationOffsets;
+    /** The same, for the text. Leaves the arrow where it is. */
+    posText?: AnnotationOffsets;
+    /** Degrees of rotation on the note as a whole, for a placed-by-hand feel. */
+    tilt?: number;
+    /** Multiplier on the arrow's length when one needs to reach further. */
+    arrowScale?: number;
+    /**
+     * Degrees of rotation on the arrow alone, leaving the text upright.
+     *
+     * Re-aims an existing curve instead of drawing a new one: `down-left` at 90°
+     * comes in from the top and points right. Rotation is visual only — the
+     * element's layout box doesn't rotate with it, so a re-aimed arrow will
+     * overhang its box and you'll want to re-check `pos`. Composes on top of
+     * `tilt`, which rotates the note and arrow together.
+     */
+    rotate?: number;
+    /** Mirror the arrow left-to-right. Text is untouched. */
+    flipH?: boolean;
+    /** Mirror the arrow top-to-bottom. Text is untouched. */
+    flipV?: boolean;
+}
+interface AnnotationLayerProps extends HTMLAttributes<HTMLDivElement> {
+    annotations: readonly Annotation[];
+}
+/**
+ * The floating notes, absolutely positioned over a stage.
+ *
+ * Hidden until the stage is wide enough to hold notes in its margins — below
+ * that they would land on top of the content they point at, and
+ * {@link AnnotationList} carries the same copy instead. This layer is
+ * `aria-hidden`, so the list is what assistive tech reads.
+ */
+declare function AnnotationLayer({ annotations, className, ...props }: AnnotationLayerProps): react.JSX.Element;
+interface AnnotationListProps extends HTMLAttributes<HTMLUListElement> {
+    annotations: readonly Annotation[];
+}
+/**
+ * Narrow-viewport fallback, and the accessible copy of the annotations — the
+ * floating layer is `aria-hidden`, so this is what gets announced.
+ */
+declare function AnnotationList({ annotations, className, ...props }: AnnotationListProps): react.JSX.Element | null;
+interface AnnotationStageProps extends HTMLAttributes<HTMLDivElement> {
+    annotations: readonly Annotation[];
+    /** The thing being annotated. */
+    children: ReactNode;
+}
+/**
+ * Wraps annotated content and hosts both renderings of the notes.
+ *
+ * Two elements, because they hold different things. The inner one is the
+ * positioning context the notes' `pos` values resolve against and hugs the
+ * content; the outer one carries the consumer's own padding and the list.
+ * Notes deliberately overhang the inner box into the surrounding margins.
+ *
+ * Because that overhang lands in space an *ancestor* owns, whether a note fits
+ * is a viewport question, not a stage-width one — see the media query in
+ * annotations.css, and re-declare it if your layout is constrained.
+ */
+declare function AnnotationStage({ annotations, children, className, ...props }: AnnotationStageProps): react.JSX.Element;
+
+export { ARROWS, type Annotation, AnnotationLayer, type AnnotationLayerProps, AnnotationList, type AnnotationListProps, type AnnotationOffsets, AnnotationStage, type AnnotationStageProps, type ArrowVariant };

package/dist/annotations/index.d.ts

@@ -0,0 +1,115 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+/**
+ * Arrow outlines for {@link AnnotationLayer} — GENERATED, do not hand-edit.
+ *
+ * Regenerate with:  python3 scripts/gen-arrow-paths.py
+ * then paste the object below and update the union to match. The generator owns
+ * the curve control points, width profiles and head geometry; see its docstring
+ * for why these are filled outlines rather than strokes.
+ *
+ * Six calm directional workhorses, then the expressive set — loops, S-bends,
+ * zigzags — for notes that want more voice. The `-left`/`-right` twins of the
+ * expressive shapes are reflections of one source curve, so editing a source
+ * updates its mirror on the next run.
+ */
+type ArrowVariant = 'down-right' | 'down-left' | 'up-right' | 'up-left' | 'right' | 'left' | 'loop-right' | 'squiggle-right' | 's-curve-down' | 'hook-left' | 'swoop-down-right' | 'zigzag-right' | 'curl-down' | 'arc-over-right' | 'jab-down-right' | 'loop-left' | 'squiggle-left' | 'hook-right' | 'swoop-down-left' | 'zigzag-left' | 'arc-over-left' | 'jab-down-left';
+declare const ARROWS: Record<ArrowVariant, {
+    box: string;
+    shaft: string;
+    head: string;
+}>;
+
+/** CSS edge offsets. Any length or percentage the property accepts. */
+interface AnnotationOffsets {
+    top?: string;
+    left?: string;
+    right?: string;
+    bottom?: string;
+}
+interface Annotation {
+    /** Stable key. Also what a consumer matches on when tuning placement. */
+    id: string;
+    /** The note itself. Kept short — this is marker on a screenshot, not prose. */
+    text: string;
+    arrow: ArrowVariant;
+    /**
+     * Placement of the note within the stage. Percentages resolve against the
+     * stage, so vertical offsets track content of varying height while
+     * horizontal ones usually want pixels.
+     */
+    pos: AnnotationOffsets;
+    /**
+     * Nudge the arrow on its own, from wherever `pos` put the note — so you can
+     * stretch the gap between text and arrow, or push the tip onto its target,
+     * without dragging the copy along too. Added to `pos` rather than replacing
+     * it, and it doesn't move the text.
+     *
+     * Percentages resolve against the note, not the stage, because these are
+     * offsets on the child rather than on the positioned note itself. Setting
+     * both `top` and `bottom` (or `left` and `right`) resolves the usual CSS way
+     * — the first of each pair wins.
+     */
+    posArrow?: AnnotationOffsets;
+    /** The same, for the text. Leaves the arrow where it is. */
+    posText?: AnnotationOffsets;
+    /** Degrees of rotation on the note as a whole, for a placed-by-hand feel. */
+    tilt?: number;
+    /** Multiplier on the arrow's length when one needs to reach further. */
+    arrowScale?: number;
+    /**
+     * Degrees of rotation on the arrow alone, leaving the text upright.
+     *
+     * Re-aims an existing curve instead of drawing a new one: `down-left` at 90°
+     * comes in from the top and points right. Rotation is visual only — the
+     * element's layout box doesn't rotate with it, so a re-aimed arrow will
+     * overhang its box and you'll want to re-check `pos`. Composes on top of
+     * `tilt`, which rotates the note and arrow together.
+     */
+    rotate?: number;
+    /** Mirror the arrow left-to-right. Text is untouched. */
+    flipH?: boolean;
+    /** Mirror the arrow top-to-bottom. Text is untouched. */
+    flipV?: boolean;
+}
+interface AnnotationLayerProps extends HTMLAttributes<HTMLDivElement> {
+    annotations: readonly Annotation[];
+}
+/**
+ * The floating notes, absolutely positioned over a stage.
+ *
+ * Hidden until the stage is wide enough to hold notes in its margins — below
+ * that they would land on top of the content they point at, and
+ * {@link AnnotationList} carries the same copy instead. This layer is
+ * `aria-hidden`, so the list is what assistive tech reads.
+ */
+declare function AnnotationLayer({ annotations, className, ...props }: AnnotationLayerProps): react.JSX.Element;
+interface AnnotationListProps extends HTMLAttributes<HTMLUListElement> {
+    annotations: readonly Annotation[];
+}
+/**
+ * Narrow-viewport fallback, and the accessible copy of the annotations — the
+ * floating layer is `aria-hidden`, so this is what gets announced.
+ */
+declare function AnnotationList({ annotations, className, ...props }: AnnotationListProps): react.JSX.Element | null;
+interface AnnotationStageProps extends HTMLAttributes<HTMLDivElement> {
+    annotations: readonly Annotation[];
+    /** The thing being annotated. */
+    children: ReactNode;
+}
+/**
+ * Wraps annotated content and hosts both renderings of the notes.
+ *
+ * Two elements, because they hold different things. The inner one is the
+ * positioning context the notes' `pos` values resolve against and hugs the
+ * content; the outer one carries the consumer's own padding and the list.
+ * Notes deliberately overhang the inner box into the surrounding margins.
+ *
+ * Because that overhang lands in space an *ancestor* owns, whether a note fits
+ * is a viewport question, not a stage-width one — see the media query in
+ * annotations.css, and re-declare it if your layout is constrained.
+ */
+declare function AnnotationStage({ annotations, children, className, ...props }: AnnotationStageProps): react.JSX.Element;
+
+export { ARROWS, type Annotation, AnnotationLayer, type AnnotationLayerProps, AnnotationList, type AnnotationListProps, type AnnotationOffsets, AnnotationStage, type AnnotationStageProps, type ArrowVariant };

package/dist/annotations/index.mjs

@@ -0,0 +1,190 @@
+import {
+  cn
+} from "../chunk-XF3CK37X.mjs";
+
+// src/annotations/arrow-paths.ts
+var ARROWS = {
+  "down-right": {
+    box: "0 0 120 84",
+    shaft: "M7.2 10Q12 9.2 14.4 9Q16.8 8.8 19.2 8.7Q21.6 8.5 23.9 8.5Q26.2 8.5 28.5 8.7Q30.8 8.8 33.1 9Q35.3 9.2 37.5 9.5Q39.7 9.9 41.9 10.3Q44.1 10.7 46.2 11.2Q48.3 11.7 50.3 12.3Q52.4 12.9 54.4 13.7Q56.4 14.4 58.3 15.2Q60.3 16 62.1 16.9Q64 17.8 65.8 18.8Q67.7 19.8 69.4 20.9Q71.2 22 72.8 23.2Q74.5 24.4 76.1 25.8Q77.7 27.1 79.2 28.6Q80.7 30.1 82.2 31.7Q83.6 33.3 84.9 35Q86.2 36.8 87.4 38.6Q88.6 40.5 89.7 42.5Q90.8 44.5 91.7 46.6Q92.7 48.7 93.4 51Q94.2 53.3 94.8 55.7Q95.4 58.1 95.9 60.6Q96.4 63.1 97 63Q97.6 62.9 97.1 60.3Q96.7 57.8 96 55.4Q95.4 52.9 94.6 50.6Q93.9 48.3 93 46.1Q92.2 43.8 91.2 41.7Q90.2 39.6 89.1 37.6Q88 35.6 86.8 33.7Q85.6 31.8 84.3 30Q82.9 28.2 81.5 26.5Q80 24.8 78.5 23.2Q76.9 21.7 75.2 20.2Q73.6 18.8 71.8 17.5Q70 16.1 68.1 14.9Q66.2 13.7 64.3 12.7Q62.3 11.6 60.2 10.7Q58.2 9.8 56 9Q53.9 8.2 51.7 7.6Q49.5 7 47.2 6.5Q45 6 42.7 5.7Q40.4 5.3 38 5.2Q35.7 5 33.3 4.9Q31 4.8 28.6 4.9Q26.2 5 23.8 5.2Q21.3 5.4 18.9 5.7Q16.5 6 14.1 6.5Q11.6 6.9 9.2 7.5L6.8 8Z",
+    head: "M97.5 66.5Q91.2 60 84.9 47.2Q95.3 52.3 102.8 44.4Q101.1 58.5 97.5 66.5Z"
+  },
+  "down-left": {
+    box: "0 0 120 84",
+    shaft: "M113.2 8Q108.4 6.9 105.9 6.4Q103.5 6 101.1 5.7Q98.7 5.4 96.2 5.2Q93.8 5 91.4 5Q89.1 4.9 86.7 5Q84.3 5.1 82 5.3Q79.6 5.6 77.4 5.9Q75.1 6.3 72.8 6.8Q70.6 7.3 68.4 8Q66.2 8.6 64.1 9.4Q62 10.2 59.9 11.1Q57.9 12 55.9 13.1Q54 14.1 52.1 15.3Q50.2 16.4 48.4 17.7Q46.6 19 44.9 20.4Q43.3 21.9 41.7 23.4Q40.1 24.9 38.6 26.6Q37.1 28.2 35.8 30Q34.4 31.8 33.1 33.6Q31.9 35.5 30.8 37.5Q29.7 39.5 28.7 41.7Q27.7 43.8 26.9 46Q26 48.2 25.3 50.6Q24.5 52.9 23.9 55.3Q23.3 57.8 22.8 60.3Q22.4 62.9 23 63Q23.6 63.1 24.1 60.6Q24.6 58.1 25.3 55.7Q25.9 53.3 26.7 51Q27.4 48.8 28.4 46.6Q29.3 44.5 30.4 42.5Q31.5 40.5 32.7 38.7Q33.8 36.8 35.1 35Q36.4 33.3 37.8 31.7Q39.2 30 40.7 28.5Q42.2 27 43.7 25.6Q45.3 24.3 47 23Q48.6 21.7 50.4 20.6Q52.1 19.4 54 18.4Q55.8 17.4 57.7 16.5Q59.6 15.6 61.5 14.8Q63.5 13.9 65.5 13.3Q67.5 12.6 69.6 12Q71.6 11.4 73.8 10.9Q75.9 10.4 78.1 10Q80.2 9.6 82.4 9.4Q84.7 9.1 86.9 8.9Q89.2 8.7 91.5 8.6Q93.8 8.5 96.1 8.5Q98.4 8.6 100.8 8.7Q103.2 8.8 105.6 9Q108 9.3 110.4 9.6L112.8 10Z",
+    head: "M22.5 66.5Q18.4 58.4 16.3 44.2Q24.7 52.3 34.1 47Q28.2 59.9 22.5 66.5Z"
+  },
+  "up-right": {
+    box: "0 0 120 84",
+    shaft: "M6.8 76Q11.7 77.1 14.1 77.5Q16.5 77.9 18.9 78.2Q21.4 78.5 23.8 78.6Q26.2 78.8 28.6 78.8Q30.9 78.9 33.3 78.8Q35.7 78.7 38 78.4Q40.3 78.2 42.6 77.9Q44.9 77.5 47.1 77Q49.4 76.5 51.6 75.9Q53.8 75.3 55.9 74.6Q58 73.8 60.1 73Q62.1 72.1 64.1 71.1Q66.1 70.1 68 68.9Q69.9 67.8 71.8 66.5Q73.6 65.2 75.3 63.8Q77 62.4 78.6 60.9Q80.2 59.4 81.7 57.7Q83.2 56 84.5 54.2Q85.9 52.4 87.1 50.5Q88.3 48.6 89.4 46.6Q90.5 44.6 91.5 42.4Q92.4 40.3 93.3 38Q94.1 35.8 94.8 33.5Q95.5 31.1 96.1 28.7Q96.7 26.2 97.2 23.7Q97.6 21.1 97 21Q96.4 20.9 95.9 23.4Q95.4 25.9 94.7 28.3Q94.1 30.7 93.3 32.9Q92.5 35.2 91.5 37.3Q90.5 39.4 89.4 41.4Q88.3 43.4 87.1 45.2Q85.9 47.1 84.6 48.8Q83.3 50.5 81.9 52.1Q80.5 53.7 79 55.2Q77.6 56.7 76 58.1Q74.4 59.4 72.8 60.7Q71.1 62 69.4 63.2Q67.7 64.3 65.9 65.4Q64.1 66.4 62.3 67.4Q60.4 68.3 58.5 69.2Q56.5 70 54.5 70.8Q52.5 71.5 50.5 72.1Q48.4 72.7 46.3 73.3Q44.2 73.8 42 74.2Q39.8 74.6 37.6 74.9Q35.4 75.2 33.1 75.4Q30.8 75.5 28.5 75.6Q26.2 75.7 23.9 75.6Q21.5 75.6 19.2 75.5Q16.8 75.3 14.4 75Q12 74.8 9.6 74.4L7.2 74Z",
+    head: "M97.5 17.5Q101.6 25.6 103.7 39.8Q95.3 31.7 85.9 37Q91.8 24.1 97.5 17.5Z"
+  },
+  "up-left": {
+    box: "0 0 120 84",
+    shaft: "M112.8 74Q108 74.8 105.6 75.1Q103.2 75.3 100.8 75.4Q98.5 75.6 96.1 75.6Q93.8 75.6 91.5 75.5Q89.2 75.4 86.9 75.2Q84.7 75 82.4 74.6Q80.2 74.3 78.1 73.9Q75.9 73.4 73.8 72.9Q71.7 72.4 69.7 71.7Q67.6 71.1 65.6 70.4Q63.6 69.6 61.7 68.8Q59.8 68 57.9 67Q56.1 66.1 54.3 65.1Q52.5 64.1 50.7 62.9Q49 61.8 47.3 60.6Q45.7 59.3 44.1 58Q42.5 56.7 41 55.2Q39.5 53.7 38 52.1Q36.6 50.6 35.3 48.8Q34 47.1 32.8 45.3Q31.5 43.4 30.4 41.5Q29.3 39.5 28.4 37.4Q27.4 35.2 26.6 33Q25.8 30.7 25.2 28.3Q24.6 25.9 24.1 23.4Q23.6 20.9 23 21Q22.4 21.1 22.8 23.7Q23.3 26.2 23.9 28.7Q24.6 31.1 25.3 33.4Q26.1 35.7 26.9 38Q27.7 40.2 28.7 42.4Q29.6 44.5 30.7 46.5Q31.8 48.5 33 50.5Q34.2 52.4 35.5 54.2Q36.9 56 38.3 57.7Q39.8 59.4 41.3 61Q42.9 62.5 44.6 64Q46.3 65.4 48.1 66.7Q49.9 68.1 51.8 69.2Q53.7 70.4 55.7 71.4Q57.7 72.5 59.8 73.3Q61.8 74.2 64 75Q66.1 75.7 68.3 76.3Q70.5 76.9 72.8 77.4Q75 77.8 77.3 78.2Q79.6 78.5 82 78.7Q84.3 78.9 86.7 78.9Q89.1 79 91.4 78.9Q93.8 78.9 96.2 78.7Q98.6 78.5 101.1 78.2Q103.5 77.9 105.9 77.5Q108.3 77 110.8 76.5L113.2 76Z",
+    head: "M22.5 17.5Q28.8 24 35.1 36.8Q24.7 31.7 17.2 39.6Q18.9 25.5 22.5 17.5Z"
+  },
+  right: {
+    box: "0 0 120 52",
+    shaft: "M5.3 12.9Q9.5 12 11.6 11.6Q13.7 11.2 15.9 11Q18 10.7 20.2 10.5Q22.4 10.3 24.5 10.3Q26.7 10.2 28.9 10.2Q31.1 10.1 33.3 10.2Q35.5 10.3 37.7 10.4Q39.9 10.6 42.1 10.8Q44.3 11 46.5 11.3Q48.7 11.6 50.9 11.9Q53.1 12.3 55.3 12.7Q57.5 13.2 59.7 13.7Q61.9 14.2 64.1 14.8Q66.3 15.4 68.5 16Q70.7 16.7 72.8 17.5Q75 18.2 77.1 19.1Q79.2 19.9 81.4 20.8Q83.5 21.8 85.5 22.8Q87.6 23.8 89.6 24.9Q91.7 26.1 93.6 27.3Q95.6 28.5 97.6 29.8Q99.5 31.1 101.4 32.5Q103.3 33.9 105 35.4Q106.8 36.9 108.5 38.5Q110.2 40.1 111.9 41.8Q113.5 43.4 114 43Q114.5 42.6 112.8 40.9Q111.1 39.2 109.4 37.5Q107.7 35.9 105.9 34.4Q104.1 32.8 102.3 31.3Q100.4 29.8 98.5 28.4Q96.7 27 94.7 25.6Q92.8 24.3 90.8 23Q88.8 21.7 86.7 20.5Q84.7 19.4 82.6 18.2Q80.5 17.1 78.4 16.1Q76.3 15.1 74.1 14.2Q71.9 13.2 69.7 12.4Q67.5 11.5 65.3 10.8Q63.1 10.1 60.8 9.4Q58.6 8.8 56.3 8.3Q54 7.7 51.7 7.3Q49.4 6.9 47.1 6.6Q44.8 6.3 42.5 6.1Q40.2 5.9 37.9 5.8Q35.6 5.8 33.3 5.8Q31 5.9 28.7 6Q26.5 6.2 24.2 6.5Q22 6.7 19.8 7.1Q17.5 7.5 15.4 8Q13.2 8.5 11 9.1Q8.9 9.7 6.8 10.4L4.7 11.1Z",
+    head: "M116.4 45.6Q107.6 43.8 95.1 36.7Q106.6 35.1 108.3 24.4Q114.8 37 116.4 45.6Z"
+  },
+  left: {
+    box: "0 0 120 52",
+    shaft: "M115.3 11.1Q111.1 9.7 109 9.1Q106.8 8.5 104.6 8Q102.5 7.6 100.2 7.2Q98 6.9 95.8 6.6Q93.5 6.4 91.3 6.2Q89 6.1 86.7 6.1Q84.4 6.1 82.1 6.2Q79.8 6.3 77.5 6.5Q75.2 6.7 72.9 7Q70.7 7.3 68.4 7.7Q66.1 8.1 63.8 8.6Q61.5 9.1 59.3 9.7Q57 10.3 54.8 11Q52.5 11.7 50.3 12.5Q48.1 13.3 45.9 14.2Q43.7 15.1 41.6 16.1Q39.4 17.1 37.3 18.2Q35.2 19.2 33.2 20.4Q31.1 21.6 29.1 22.8Q27.1 24.1 25.2 25.4Q23.2 26.8 21.3 28.2Q19.5 29.7 17.6 31.2Q15.8 32.7 14 34.3Q12.3 35.8 10.5 37.5Q8.8 39.1 7.2 40.8Q5.5 42.6 6 43Q6.5 43.4 8.1 41.8Q9.8 40.1 11.5 38.5Q13.3 37 15 35.5Q16.8 34 18.7 32.6Q20.6 31.2 22.6 29.9Q24.5 28.7 26.5 27.4Q28.4 26.2 30.5 25.1Q32.5 24 34.5 22.9Q36.6 21.9 38.7 20.9Q40.8 20 42.9 19.1Q45 18.2 47.2 17.4Q49.3 16.6 51.5 15.9Q53.6 15.2 55.8 14.5Q58 13.9 60.2 13.4Q62.4 12.8 64.6 12.4Q66.8 11.9 69 11.5Q71.2 11.2 73.5 10.9Q75.7 10.6 77.9 10.4Q80.1 10.2 82.3 10.1Q84.5 10 86.7 9.9Q88.9 9.9 91.1 9.9Q93.3 10 95.5 10.1Q97.7 10.2 99.8 10.4Q102 10.6 104.1 10.9Q106.3 11.2 108.4 11.6Q110.5 12 112.6 12.5L114.7 12.9Z",
+    head: "M3.6 45.6Q4.8 36.6 11 23.7Q13.4 35.1 24.2 36Q12.1 43.4 3.6 45.6Z"
+  },
+  "loop-right": {
+    box: "0 0 132 70",
+    shaft: "M7 46.6Q13.9 36.3 17.7 32.3Q21.5 28.4 25.5 25.6Q29.5 22.8 33.5 21.1Q37.5 19.5 41.2 18.9Q44.9 18.3 48.2 18.8Q51.5 19.3 54.2 20.6Q56.9 22 58.9 24.3Q60.9 26.6 61.9 29.6Q63 32.5 62.9 34.8Q62.9 37.2 62.1 38.8Q61.4 40.4 60.3 41.5Q59.1 42.6 57.6 43.1Q56.2 43.6 54.6 43.6Q53 43.6 51.5 43Q50 42.4 48.7 41.1Q47.4 39.8 46.5 37.7Q45.6 35.6 45.4 33Q45.3 30.4 46.4 28.4Q47.5 26.4 49.9 24.8Q52.4 23.2 56.1 22.2Q59.9 21.2 64.8 21Q69.7 20.9 75.6 21.6Q81.4 22.3 88 24Q94.5 25.7 101.6 28.4Q108.7 31.2 116.2 34.9Q123.6 38.7 124 38Q124.4 37.3 116.9 33.5Q109.4 29.7 102.2 26.9Q95.1 24.1 88.4 22.2Q81.8 20.4 75.8 19.4Q69.9 18.4 64.7 18.4Q59.6 18.3 55.4 19.2Q51.1 20 48 21.8Q44.8 23.6 43 26.5Q41.2 29.4 41.1 33Q41.1 36.6 42.2 39.5Q43.3 42.5 45.2 44.5Q47.1 46.6 49.6 47.7Q52 48.7 54.5 48.8Q57.1 48.9 59.5 48Q61.9 47.1 63.8 45.2Q65.7 43.4 66.8 40.8Q67.9 38.2 67.9 35Q67.9 31.7 66.4 27.9Q65 24.2 62.3 21.3Q59.6 18.4 56.2 16.8Q52.7 15.1 48.8 14.7Q44.8 14.3 40.6 15.1Q36.4 15.9 32.1 17.9Q27.8 19.8 23.6 22.9Q19.5 26 15.6 30.3Q11.7 34.6 8.3 40L5 45.4Z",
+    head: "M127 39.7Q118.2 40.7 104.5 37.9Q114.8 32.8 113.4 22.2Q123.1 32.1 127 39.7Z"
+  },
+  "squiggle-right": {
+    box: "0 0 132 58",
+    shaft: "M5.9 30.6Q10.6 25.1 13 23.1Q15.4 21.1 17.8 19.8Q20.1 18.6 22.4 18Q24.7 17.5 26.9 17.6Q29.1 17.8 31.1 18.5Q33.1 19.2 35 20.6Q37 21.9 38.8 23.9Q40.5 25.9 42.2 28.7Q44 31.4 46 34Q48.1 36.6 50.4 38.5Q52.7 40.4 55.2 41.5Q57.7 42.7 60.4 43Q63 43.4 65.6 43Q68.2 42.5 70.7 41.3Q73.1 40 75.4 38.1Q77.6 36.2 79.5 33.6Q81.5 31 83.2 28.3Q84.9 25.5 86.7 23.5Q88.6 21.5 90.7 20.2Q92.9 18.9 95.3 18.2Q97.6 17.6 100.2 17.6Q102.8 17.7 105.5 18.4Q108.2 19.2 111 20.7Q113.7 22.2 116.5 24.4Q119.2 26.6 121.8 29.5Q124.4 32.4 125 32Q125.6 31.6 122.9 28.6Q120.2 25.6 117.3 23.3Q114.5 21 111.7 19.4Q108.8 17.8 106 16.8Q103.1 15.8 100.3 15.6Q97.4 15.4 94.7 15.9Q91.9 16.4 89.3 17.7Q86.7 19 84.4 21.2Q82.1 23.3 80.1 26Q78.2 28.8 76.3 30.9Q74.4 33.1 72.5 34.6Q70.6 36 68.7 36.8Q66.7 37.6 64.9 37.9Q63 38.1 61.2 37.8Q59.3 37.5 57.5 36.6Q55.6 35.7 53.8 34.2Q51.9 32.7 50.2 30.6Q48.4 28.4 46.5 25.6Q44.6 22.8 42.4 20.5Q40.1 18.2 37.6 16.7Q35.1 15.2 32.4 14.4Q29.7 13.7 27 13.7Q24.2 13.8 21.5 14.6Q18.8 15.5 16.2 17.1Q13.6 18.7 11.2 21Q8.7 23.3 6.4 26.3L4.1 29.4Z",
+    head: "M127 34.5Q117.7 33.3 105.7 26.9Q119.6 25.2 123.4 12.8Q127.4 25.6 127 34.5Z"
+  },
+  "s-curve-down": {
+    box: "0 0 92 104",
+    shaft: "M19.7 7.3Q28.6 10.2 32.3 11.8Q35.9 13.5 38.8 15.2Q41.7 16.9 43.8 18.7Q45.9 20.4 47.4 22.2Q48.9 23.9 49.7 25.6Q50.6 27.2 50.9 28.8Q51.3 30.4 51.3 32Q51.2 33.5 50.8 35.1Q50.4 36.6 49.6 38.2Q48.8 39.8 47.6 41.3Q46.4 42.9 44.9 44.4Q43.3 45.9 41.4 47.3Q39.6 48.7 37.5 50.3Q35.4 51.9 33.7 53.7Q32 55.4 30.8 57.3Q29.5 59.2 28.7 61.1Q27.9 63.1 27.6 65.1Q27.3 67.2 27.5 69.2Q27.6 71.2 28.2 73.3Q28.8 75.3 29.9 77.2Q31 79.2 32.5 81.1Q34 83.1 35.9 84.9Q37.9 86.8 40.2 88.7Q42.5 90.6 45.3 92.4Q48.1 94.2 51.4 96Q54.6 97.8 55 97Q55.4 96.2 52.2 94.5Q49 92.7 46.3 90.9Q43.6 89.1 41.3 87.3Q39.1 85.4 37.4 83.5Q35.7 81.6 34.4 79.7Q33.2 77.9 32.4 76.1Q31.6 74.2 31.2 72.5Q30.9 70.8 30.9 69.1Q31 67.5 31.4 65.9Q31.8 64.4 32.5 62.9Q33.3 61.4 34.5 60Q35.6 58.6 37.1 57.2Q38.6 55.8 40.5 54.6Q42.4 53.3 44.6 51.7Q46.9 50.2 48.8 48.5Q50.7 46.8 52.2 44.9Q53.7 43 54.8 40.9Q55.9 38.8 56.4 36.5Q57 34.3 57 32Q57 29.7 56.3 27.4Q55.6 25.2 54.3 23Q53 20.9 51 18.9Q49.1 16.9 46.5 15.1Q43.9 13.3 40.7 11.7Q37.5 10.1 33.6 8.7Q29.6 7.2 25 6L20.3 4.7Z",
+    head: "M58.2 98.6Q48.2 101.7 33 100.8Q46.3 92.7 44.2 78.4Q54.4 89.4 58.2 98.6Z"
+  },
+  "hook-left": {
+    box: "0 0 132 80",
+    shaft: "M126.3 13.9Q115.8 11.2 110.5 10.3Q105.2 9.3 99.9 8.6Q94.5 8 89.3 7.7Q84 7.5 78.9 7.6Q73.7 7.6 68.8 8.1Q63.8 8.6 59.1 9.4Q54.3 10.2 49.9 11.4Q45.4 12.6 41.3 14.1Q37.3 15.7 33.6 17.6Q29.9 19.6 26.7 21.9Q23.5 24.2 20.8 27Q18.1 29.7 16 32.9Q14 36 13 38.9Q12 41.7 11.8 44.3Q11.5 47 11.9 49.5Q12.4 52 13.4 54.1Q14.4 56.3 15.9 58.2Q17.5 60 19.4 61.5Q21.3 63 23.6 64.1Q25.8 65.2 28.3 65.9Q30.8 66.6 33.4 66.9Q36.1 67.1 38.9 67Q41.6 66.8 44.5 66.3Q47.3 65.7 50.1 64.7Q52.9 63.7 55.7 62.1Q58.4 60.6 58 60Q57.6 59.4 54.9 60.8Q52.3 62.2 49.6 63.1Q46.8 64 44.1 64.5Q41.5 64.9 38.9 64.9Q36.2 64.8 33.8 64.4Q31.4 63.9 29.2 63.1Q27 62.3 25.1 61.2Q23.2 60.1 21.6 58.8Q20.1 57.4 18.9 55.9Q17.8 54.3 17 52.5Q16.3 50.8 16.1 48.9Q15.8 46.9 16 44.8Q16.3 42.6 17.2 40.3Q18 38 19.8 35.3Q21.6 32.5 24 30.1Q26.4 27.7 29.3 25.6Q32.3 23.4 35.7 21.6Q39.1 19.8 43 18.3Q46.8 16.8 51 15.6Q55.3 14.4 59.8 13.6Q64.4 12.7 69.2 12.2Q74 11.6 79 11.4Q84 11.2 89.1 11.3Q94.3 11.5 99.5 11.9Q104.8 12.4 110 13.1Q115.3 13.9 120.5 15L125.7 16.1Z",
+    head: "M60.8 58.1Q57.9 66.6 49.2 77.7Q49.2 65.8 38.8 61.7Q52.2 57.9 60.8 58.1Z"
+  },
+  "swoop-down-right": {
+    box: "0 0 142 100",
+    shaft: "M6.2 13.1Q12.6 12.2 15.8 12Q19 11.7 22.1 11.6Q25.2 11.5 28.3 11.5Q31.4 11.5 34.5 11.6Q37.5 11.8 40.5 12.1Q43.5 12.3 46.4 12.8Q49.4 13.2 52.2 13.7Q55.1 14.2 57.9 14.9Q60.7 15.5 63.4 16.3Q66.1 17 68.7 17.9Q71.4 18.8 73.9 19.8Q76.5 20.7 78.9 21.8Q81.4 22.9 83.8 24Q86.2 25.2 88.5 26.4Q90.7 27.7 92.9 29Q95.1 30.4 97.2 31.8Q99.3 33.2 101.3 34.8Q103.3 36.3 105.2 37.9Q107.1 39.6 108.8 41.3Q110.6 43 112.2 44.8Q113.8 46.7 115.3 48.6Q116.8 50.5 118.2 52.6Q119.5 54.6 120.7 56.8Q121.8 59 122.8 61.2Q123.7 63.5 124.5 65.8Q125.3 68.2 126 68Q126.7 67.8 125.9 65.4Q125.1 63 124.2 60.6Q123.2 58.3 122.2 56Q121.1 53.8 119.9 51.6Q118.7 49.4 117.3 47.2Q115.9 45.1 114.4 43Q112.9 41 111.2 39Q109.6 37.1 107.7 35.2Q105.9 33.3 104 31.6Q102 29.8 99.9 28.2Q97.8 26.5 95.5 25Q93.3 23.5 90.9 22.1Q88.6 20.7 86.1 19.4Q83.6 18.1 81 17Q78.4 15.9 75.7 14.9Q73 13.9 70.3 13.1Q67.5 12.2 64.6 11.5Q61.8 10.8 58.9 10.3Q55.9 9.7 52.9 9.3Q50 8.8 46.9 8.6Q43.9 8.3 40.8 8.1Q37.7 8 34.6 8Q31.4 8 28.3 8.1Q25.1 8.3 21.9 8.6Q18.7 8.9 15.5 9.3Q12.3 9.7 9 10.3L5.8 10.9Z",
+    head: "M127 71.7Q117.5 66.1 107.5 53.5Q123.2 58.1 132.6 46.3Q131.4 62.1 127 71.7Z"
+  },
+  "zigzag-right": {
+    box: "0 0 132 62",
+    shaft: "M5.3 16.7Q9.4 21.4 11.5 23.8Q13.6 26.2 15.7 28.6Q17.8 30.9 19.8 33.3Q21.9 35.7 24 38.1Q26.1 40.4 28.2 42.8Q30.3 45.2 34 45.1Q37.8 45 39.8 42.6Q41.9 40.1 43.9 37.7Q45.9 35.3 48 32.8Q50 30.4 52 27.9Q54 25.4 55.9 23Q57.9 20.5 58.1 18Q58.2 15.6 60.4 18Q62.6 20.4 64.8 22.8Q67 25.2 69.3 27.6Q71.5 30 73.7 32.4Q75.9 34.8 78.2 37.2Q80.4 39.6 82.6 42Q84.8 44.4 88.1 44.8Q91.4 45.1 94.1 43.2Q96.8 41.3 99.6 39.4Q102.3 37.4 105 35.5Q107.8 33.6 110.5 31.8Q113.3 29.9 116 28.1Q118.8 26.2 121.6 24.4Q124.4 22.5 124 22Q123.6 21.5 120.9 23.3Q118.1 25.2 115.3 27Q112.6 28.9 109.8 30.7Q107 32.5 104.2 34.3Q101.4 36.1 98.6 37.9Q95.8 39.7 93 41.4Q90.1 43.2 88.5 42.9Q86.8 42.7 84.8 40.1Q82.7 37.6 80.6 35.1Q78.5 32.6 76.4 30Q74.4 27.5 72.3 25Q70.2 22.5 68.1 20Q66 17.4 63.9 14.9Q61.8 12.4 57.9 14.9Q54.1 17.4 52.1 19.8Q50 22.3 48 24.7Q46 27.2 44 29.6Q42.1 32.1 40.1 34.6Q38.1 37.1 36.2 39.6Q34.2 42.1 33.8 42.1Q33.4 42.2 31.2 40Q29 37.7 26.8 35.5Q24.5 33.2 22.3 31Q20.1 28.8 17.9 26.5Q15.6 24.3 13.4 22Q11.2 19.8 9 17.6L6.7 15.3Z",
+    head: "M126.5 20.3Q124.7 29 117.8 39.8Q117.3 26.5 105.9 21.9Q118.2 19.2 126.5 20.3Z"
+  },
+  "curl-down": {
+    box: "0 0 104 112",
+    shaft: "M26.2 13.5Q44 13.4 50.8 14.8Q57.6 16.2 62.4 18.6Q67.2 21 70 23.9Q72.8 26.9 73.8 29.9Q74.8 32.9 74.3 35.8Q73.8 38.7 71.8 41.4Q69.7 44.1 66 46.4Q62.3 48.7 57 50.1Q51.8 51.5 47.4 51.5Q43.1 51.5 40 50.3Q36.9 49.1 34.9 47.1Q32.9 45.2 31.9 42.7Q30.9 40.3 30.9 37.6Q31 34.9 32.1 32.4Q33.2 29.8 35.5 27.6Q37.8 25.5 41.5 24.1Q45.1 22.7 49.6 22.5Q54.1 22.3 57.6 23.7Q61.1 25.1 63.7 28.1Q66.4 31 68.2 35.4Q70 39.7 70.9 45.2Q71.7 50.6 71.6 56.8Q71.5 63.1 70.4 69.8Q69.2 76.5 67.2 83.3Q65.1 90.1 62.1 96.9Q59.2 103.6 60 104Q60.8 104.4 63.9 97.7Q67 90.9 69.1 83.9Q71.3 77 72.5 70.1Q73.7 63.3 74 56.9Q74.4 50.5 73.7 44.7Q73 39 71.2 34.1Q69.4 29.3 66.4 25.7Q63.4 22 59.1 20.1Q54.8 18.1 49.5 18.1Q44.3 18.1 39.8 19.6Q35.3 21.2 32.1 23.9Q28.9 26.6 27.2 30.1Q25.5 33.6 25.3 37.4Q25.1 41.2 26.4 44.8Q27.7 48.5 30.6 51.4Q33.4 54.3 37.6 56Q41.9 57.7 47.3 57.8Q52.7 57.9 58.7 56.2Q64.8 54.5 69.4 51.6Q73.9 48.7 76.6 44.8Q79.3 40.9 79.9 36.6Q80.4 32.3 78.8 28.1Q77.1 24 73.5 20.6Q69.8 17.1 64.3 14.7Q58.9 12.3 51.5 11.1Q44.2 9.9 35 10.2L25.8 10.5Z",
+    head: "M58 107.7Q54.8 96 56.4 78.4Q65.3 94 81.7 91.7Q68.7 103.4 58 107.7Z"
+  },
+  "arc-over-right": {
+    box: "0 0 132 74",
+    shaft: "M7 60.3Q9.5 54.4 11 51.7Q12.5 48.9 14.1 46.4Q15.7 43.9 17.5 41.7Q19.3 39.4 21.3 37.4Q23.2 35.4 25.3 33.6Q27.4 31.8 29.6 30.2Q31.7 28.6 34 27.2Q36.3 25.9 38.7 24.7Q41.1 23.6 43.5 22.7Q46 21.7 48.5 21Q51 20.3 53.6 19.8Q56.2 19.3 58.8 19Q61.4 18.7 64 18.6Q66.7 18.5 69.3 18.6Q72 18.7 74.6 19Q77.2 19.3 79.9 19.8Q82.5 20.3 85.1 21Q87.7 21.7 90.2 22.6Q92.8 23.5 95.3 24.6Q97.8 25.8 100.2 27.1Q102.7 28.4 105 29.9Q107.4 31.5 109.6 33.2Q111.9 35 113.9 37Q116 39 118 41.2Q119.9 43.5 121.7 45.9Q123.4 48.4 124 48Q124.6 47.6 122.8 45.1Q121.1 42.6 119.1 40.2Q117.2 37.9 115.1 35.8Q113.1 33.6 110.9 31.7Q108.7 29.7 106.4 27.9Q104.1 26.2 101.7 24.6Q99.2 23.1 96.7 21.8Q94.1 20.5 91.5 19.4Q88.9 18.3 86.1 17.4Q83.4 16.5 80.7 15.9Q77.9 15.3 75.1 14.9Q72.3 14.5 69.5 14.3Q66.7 14.2 63.9 14.2Q61.1 14.3 58.3 14.7Q55.5 15 52.8 15.5Q50 16.1 47.3 16.9Q44.6 17.7 42 18.7Q39.4 19.8 36.9 21.1Q34.4 22.3 32 23.8Q29.5 25.4 27.3 27.1Q25 28.9 22.8 30.9Q20.7 32.8 18.7 35.1Q16.8 37.3 15 39.7Q13.2 42.2 11.6 44.9Q10 47.6 8.7 50.5Q7.3 53.4 6.1 56.5L5 59.7Z",
+    head: "M126 51Q115.7 48.6 103.1 40Q118.7 39.8 124.1 26.5Q127.3 41.2 126 51Z"
+  },
+  "jab-down-right": {
+    box: "0 0 84 74",
+    shaft: "M10.2 11Q12.6 10.7 13.8 10.6Q15 10.6 16.3 10.6Q17.5 10.6 18.7 10.8Q19.9 10.9 21.1 11.1Q22.3 11.3 23.6 11.6Q24.8 11.9 26 12.3Q27.2 12.7 28.4 13.1Q29.6 13.6 30.8 14.1Q32 14.7 33.2 15.3Q34.4 15.9 35.5 16.6Q36.7 17.2 37.9 18Q39.1 18.7 40.2 19.5Q41.4 20.4 42.5 21.2Q43.7 22.1 44.8 23.1Q45.9 24 47.1 25.1Q48.2 26.1 49.3 27.2Q50.4 28.3 51.4 29.5Q52.5 30.7 53.5 31.9Q54.6 33.2 55.6 34.6Q56.6 35.9 57.5 37.4Q58.4 38.8 59.3 40.4Q60.2 41.9 61 43.6Q61.8 45.2 62.5 46.9Q63.2 48.7 63.8 50.5Q64.4 52.3 64.9 54.2Q65.4 56.2 66 56Q66.6 55.8 66.1 53.9Q65.6 52 65.1 50.1Q64.5 48.2 63.8 46.4Q63.2 44.6 62.6 42.9Q61.9 41.1 61.2 39.5Q60.5 37.8 59.7 36.2Q58.9 34.5 58.1 33Q57.2 31.5 56.3 30Q55.4 28.5 54.4 27.1Q53.4 25.7 52.4 24.4Q51.3 23.1 50.2 21.9Q49.1 20.7 48 19.6Q46.8 18.4 45.6 17.4Q44.4 16.4 43.1 15.5Q41.9 14.6 40.6 13.7Q39.3 12.9 37.9 12.2Q36.6 11.5 35.2 10.9Q33.9 10.3 32.5 9.9Q31.1 9.4 29.7 9Q28.4 8.6 27 8.3Q25.6 8.1 24.2 7.9Q22.9 7.7 21.5 7.7Q20.1 7.6 18.8 7.6Q17.5 7.7 16.2 7.8Q14.8 7.9 13.6 8.1Q12.3 8.4 11 8.7L9.8 9Z",
+    head: "M66.7 59.1Q58.8 54.1 50.7 43.2Q64 47.6 72.7 38Q70.9 51.2 66.7 59.1Z"
+  },
+  "loop-left": {
+    box: "0 0 132 70",
+    shaft: "M127 45.4Q120.3 34.6 116.5 30.3Q112.6 26 108.4 22.8Q104.3 19.7 100 17.7Q95.7 15.7 91.5 14.8Q87.2 14 83.2 14.4Q79.2 14.8 75.7 16.4Q72.1 18.1 69.4 21Q66.7 24 65.2 27.8Q63.8 31.7 63.8 35Q63.9 38.3 65 40.9Q66.2 43.5 68.1 45.3Q70.1 47.1 72.5 48Q74.9 48.8 77.5 48.7Q80 48.6 82.4 47.5Q84.7 46.4 86.5 44.3Q88.4 42.3 89.5 39.4Q90.5 36.5 90.5 33Q90.4 29.5 88.6 26.7Q86.9 23.9 83.8 22.1Q80.7 20.4 76.5 19.5Q72.4 18.7 67.2 18.7Q62.1 18.7 56.2 19.6Q50.2 20.5 43.6 22.4Q37 24.2 29.8 26.9Q22.7 29.7 15.1 33.5Q7.6 37.3 8 38Q8.4 38.7 15.8 34.9Q23.3 31.1 30.4 28.4Q37.5 25.6 44 23.9Q50.6 22.1 56.4 21.4Q62.3 20.6 67.2 20.7Q72.1 20.9 76 21.8Q79.8 22.8 82.3 24.4Q84.8 26.1 86 28.2Q87.1 30.3 87 33Q86.8 35.7 85.9 37.9Q84.9 40 83.5 41.3Q82.1 42.6 80.6 43.2Q79 43.8 77.4 43.7Q75.8 43.7 74.4 43.1Q72.9 42.5 71.8 41.4Q70.7 40.3 70.1 38.7Q69.4 37.1 69.4 34.8Q69.3 32.6 70.4 29.7Q71.4 26.8 73.4 24.6Q75.3 22.4 78 21Q80.6 19.6 83.8 19.1Q87.1 18.7 90.8 19.2Q94.5 19.7 98.4 21.3Q102.4 23 106.4 25.7Q110.4 28.4 114.2 32.4Q118.1 36.3 121.5 41.4L125 46.6Z",
+    head: "M5 39.7Q8.7 31.6 18.1 21.3Q17.2 32.8 27 37Q13.6 40.2 5 39.7Z"
+  },
+  "squiggle-left": {
+    box: "0 0 132 58",
+    shaft: "M127.9 29.4Q123.3 23.3 120.9 20.9Q118.4 18.6 115.8 17Q113.2 15.4 110.5 14.6Q107.8 13.8 105 13.7Q102.3 13.7 99.6 14.5Q97 15.3 94.5 16.8Q92.1 18.4 89.9 20.7Q87.7 23 85.8 25.8Q84 28.6 82.2 30.9Q80.4 33.1 78.5 34.6Q76.7 36.2 74.8 37.1Q72.9 38 70.9 38.3Q69 38.7 67.1 38.4Q65.1 38.2 63.1 37.3Q61.2 36.4 59.2 34.9Q57.3 33.4 55.5 31.1Q53.6 28.9 51.7 26.2Q49.8 23.4 47.5 21.2Q45.2 19.1 42.7 17.7Q40.1 16.4 37.3 15.8Q34.6 15.3 31.7 15.5Q28.9 15.7 26 16.7Q23.1 17.7 20.3 19.3Q17.4 20.9 14.6 23.2Q11.8 25.5 9.1 28.6Q6.4 31.6 7 32Q7.6 32.4 10.2 29.6Q12.9 26.7 15.6 24.5Q18.3 22.3 21.1 20.8Q23.8 19.3 26.5 18.5Q29.2 17.8 31.8 17.7Q34.4 17.7 36.7 18.3Q39.1 18.9 41.3 20.2Q43.4 21.5 45.4 23.5Q47.3 25.4 49 28.1Q50.7 30.8 52.7 33.4Q54.7 35.9 56.9 37.8Q59.1 39.7 61.5 40.8Q63.9 42 66.5 42.4Q69 42.8 71.6 42.5Q74.1 42.1 76.6 41Q79 39.9 81.3 38Q83.6 36.2 85.6 33.7Q87.7 31.1 89.4 28.4Q91.2 25.7 93 23.8Q94.9 21.8 96.9 20.4Q98.8 19.1 100.9 18.4Q102.9 17.7 105.1 17.6Q107.3 17.5 109.6 18.1Q111.8 18.6 114.2 19.9Q116.6 21.1 119 23.1Q121.4 25.1 123.7 27.9L126.1 30.6Z",
+    head: "M5 34.5Q4 25.2 7.5 12Q12.4 25.2 25.3 26Q13.8 32.9 5 34.5Z"
+  },
+  "hook-right": {
+    box: "0 0 132 80",
+    shaft: "M6.3 16.1Q16.7 13.9 22 13.1Q27.2 12.3 32.5 11.8Q37.7 11.4 42.8 11.3Q48 11.1 53 11.4Q58 11.6 62.8 12.1Q67.6 12.7 72.2 13.5Q76.7 14.4 80.9 15.6Q85.2 16.8 89 18.3Q92.9 19.9 96.3 21.7Q99.7 23.5 102.6 25.7Q105.5 27.8 107.8 30.3Q110.2 32.7 112 35.4Q113.7 38.1 114.6 40.4Q115.4 42.7 115.7 44.8Q115.9 46.9 115.7 48.8Q115.4 50.7 114.7 52.4Q114 54.2 112.9 55.7Q111.8 57.3 110.3 58.7Q108.7 60 106.9 61.1Q105 62.2 102.8 63.1Q100.6 63.9 98.2 64.3Q95.7 64.8 93.1 64.9Q90.5 64.9 87.8 64.5Q85.2 64 82.4 63.1Q79.7 62.2 77.1 60.8Q74.4 59.4 74 60Q73.6 60.6 76.3 62.1Q79.1 63.7 81.9 64.7Q84.7 65.7 87.5 66.3Q90.4 66.8 93.1 67Q95.9 67.1 98.6 66.9Q101.2 66.6 103.7 66Q106.2 65.3 108.5 64.2Q110.8 63.1 112.7 61.6Q114.7 60.2 116.2 58.3Q117.8 56.5 118.8 54.2Q119.9 52 120.3 49.5Q120.8 47 120.5 44.3Q120.3 41.6 119.3 38.8Q118.3 35.9 116.2 32.7Q114.1 29.5 111.4 26.8Q108.7 24.1 105.4 21.8Q102.2 19.4 98.5 17.5Q94.8 15.6 90.7 14.1Q86.6 12.5 82.1 11.4Q77.7 10.2 72.9 9.4Q68.2 8.6 63.2 8.2Q58.3 7.7 53.1 7.6Q48 7.6 42.7 7.8Q37.5 8.1 32.2 8.7Q26.8 9.3 21.5 10.3Q16.2 11.3 11 12.6L5.7 13.9Z",
+    head: "M71.2 58.1Q80.1 57.4 93.7 60.9Q82.8 65.8 83.3 76.8Q74.4 66.2 71.2 58.1Z"
+  },
+  "swoop-down-left": {
+    box: "0 0 142 100",
+    shaft: "M136.2 10.9Q129.7 9.7 126.5 9.3Q123.3 8.8 120.1 8.5Q116.9 8.2 113.7 8Q110.6 7.9 107.4 7.9Q104.3 7.8 101.2 8Q98.1 8.1 95.1 8.4Q92 8.6 89 9Q86 9.5 83.1 10Q80.2 10.6 77.3 11.3Q74.5 12 71.7 12.9Q68.9 13.8 66.2 14.8Q63.5 15.8 61 16.9Q58.4 18.1 55.9 19.4Q53.4 20.7 51.1 22.1Q48.7 23.5 46.5 25Q44.3 26.6 42.2 28.3Q40.1 29.9 38.1 31.7Q36.2 33.4 34.4 35.3Q32.6 37.2 30.9 39.1Q29.2 41.1 27.7 43.1Q26.2 45.2 24.8 47.3Q23.5 49.4 22.2 51.6Q21 53.8 19.9 56.1Q18.8 58.3 17.9 60.7Q16.9 63 16.1 65.4Q15.3 67.8 16 68Q16.7 68.2 17.5 65.8Q18.2 63.5 19.2 61.2Q20.1 58.9 21.2 56.8Q22.4 54.6 23.7 52.5Q25 50.5 26.5 48.5Q28 46.6 29.7 44.7Q31.3 42.9 33.1 41.2Q34.8 39.4 36.7 37.8Q38.6 36.2 40.6 34.6Q42.6 33.1 44.7 31.7Q46.8 30.3 49 29Q51.2 27.6 53.5 26.4Q55.8 25.2 58.2 24.1Q60.6 22.9 63.1 21.9Q65.6 20.8 68.1 19.9Q70.7 18.9 73.3 18.1Q76 17.3 78.7 16.5Q81.4 15.8 84.2 15.1Q87 14.5 89.8 13.9Q92.7 13.4 95.6 13Q98.5 12.5 101.5 12.2Q104.5 11.9 107.5 11.8Q110.6 11.6 113.7 11.6Q116.8 11.5 119.9 11.6Q123 11.7 126.2 12Q129.4 12.3 132.6 12.7L135.8 13.1Z",
+    head: "M15 71.7Q9.8 61.9 7.9 45.9Q18.8 58.1 33.1 53.1Q23.7 65.8 15 71.7Z"
+  },
+  "zigzag-left": {
+    box: "0 0 132 62",
+    shaft: "M125.3 15.3Q120.8 19.8 118.6 22Q116.3 24.2 114.1 26.5Q111.9 28.7 109.6 31Q107.4 33.2 105.2 35.4Q103 37.7 100.8 40Q98.6 42.2 98.2 42.2Q97.8 42.1 95.8 39.6Q93.8 37.2 91.8 34.7Q89.8 32.2 87.8 29.8Q85.8 27.3 83.8 24.9Q81.8 22.4 79.7 20Q77.7 17.5 74.1 15.1Q70.4 12.6 68.3 15.1Q66.2 17.6 64.1 20.1Q62 22.7 59.9 25.2Q57.8 27.7 55.7 30.2Q53.6 32.7 51.5 35.2Q49.4 37.7 47.3 40.2Q45.2 42.7 43.5 43Q41.8 43.2 39 41.5Q36.2 39.7 33.4 37.9Q30.6 36.1 27.8 34.3Q25 32.5 22.2 30.7Q19.5 28.8 16.7 27Q13.9 25.1 11.1 23.3Q8.4 21.5 8 22Q7.6 22.5 10.4 24.4Q13.2 26.3 15.9 28.1Q18.7 29.9 21.5 31.8Q24.2 33.7 27 35.6Q29.7 37.5 32.4 39.4Q35.2 41.3 37.9 43.2Q40.6 45.1 43.9 44.7Q47.1 44.3 49.3 41.9Q51.5 39.5 53.7 37.1Q55.9 34.7 58.1 32.3Q60.3 29.9 62.5 27.5Q64.7 25 67 22.6Q69.2 20.2 71.4 17.8Q73.6 15.4 73.9 17.8Q74.3 20.3 76.3 22.8Q78.2 25.3 80.2 27.8Q82.2 30.2 84.2 32.7Q86.2 35.2 88.2 37.6Q90.2 40.1 92.2 42.5Q94.2 45 98 45.1Q101.7 45.2 103.8 42.8Q105.9 40.5 108 38.1Q110.1 35.7 112.2 33.4Q114.3 31 116.4 28.6Q118.4 26.2 120.5 23.8Q122.6 21.5 124.7 19.1L126.7 16.7Z",
+    head: "M5.5 20.3Q14.2 18.6 26.8 20.9Q14.7 26.5 14.9 38.7Q7.7 28.4 5.5 20.3Z"
+  },
+  "arc-over-left": {
+    box: "0 0 132 74",
+    shaft: "M127 59.7Q124.7 53.4 123.4 50.5Q122 47.5 120.4 44.8Q118.9 42.2 117.1 39.7Q115.3 37.2 113.3 35Q111.3 32.8 109.2 30.8Q107.1 28.8 104.8 27.1Q102.5 25.3 100.1 23.8Q97.6 22.3 95.1 21Q92.6 19.8 90 18.8Q87.3 17.7 84.7 17Q82 16.2 79.2 15.6Q76.5 15.1 73.7 14.8Q70.9 14.5 68.1 14.4Q65.3 14.3 62.5 14.5Q59.7 14.7 56.9 15Q54.1 15.4 51.4 16.1Q48.6 16.7 45.9 17.5Q43.2 18.4 40.6 19.5Q37.9 20.6 35.4 21.9Q32.8 23.2 30.4 24.7Q27.9 26.2 25.6 28Q23.3 29.7 21.1 31.7Q18.9 33.7 16.9 35.8Q14.8 37.9 12.9 40.2Q10.9 42.6 9.2 45.1Q7.4 47.6 8 48Q8.6 48.4 10.3 45.9Q12.1 43.5 14 41.2Q16 39 18.1 37Q20.1 35 22.4 33.2Q24.6 31.4 27 29.9Q29.3 28.3 31.7 27Q34.2 25.7 36.7 24.5Q39.2 23.4 41.7 22.5Q44.3 21.6 46.9 20.9Q49.5 20.1 52.1 19.6Q54.7 19.1 57.4 18.8Q60 18.5 62.7 18.4Q65.3 18.3 68 18.4Q70.6 18.5 73.2 18.8Q75.8 19.2 78.4 19.7Q81 20.2 83.5 21Q86 21.7 88.5 22.6Q90.9 23.6 93.3 24.7Q95.7 25.9 97.9 27.3Q100.2 28.7 102.4 30.2Q104.6 31.8 106.7 33.6Q108.7 35.4 110.7 37.5Q112.6 39.5 114.4 41.7Q116.2 44 117.8 46.5Q119.5 49 121 51.7Q122.4 54.4 123.7 57.4L125 60.3Z",
+    head: "M6 51Q4 40.7 6.6 25.7Q13.3 39.8 27.6 39.2Q15.6 48.2 6 51Z"
+  },
+  "jab-down-left": {
+    box: "0 0 84 74",
+    shaft: "M74.2 9Q71.7 8.4 70.4 8.2Q69.2 7.9 67.8 7.8Q66.5 7.7 65.2 7.7Q63.9 7.7 62.5 7.7Q61.1 7.8 59.8 8Q58.4 8.2 57 8.5Q55.7 8.8 54.3 9.1Q52.9 9.5 51.6 10Q50.2 10.5 48.8 11.1Q47.5 11.7 46.2 12.4Q44.8 13.1 43.5 13.9Q42.2 14.7 41 15.6Q39.7 16.5 38.5 17.5Q37.2 18.5 36.1 19.6Q34.9 20.7 33.8 21.9Q32.7 23.1 31.6 24.4Q30.5 25.7 29.6 27.1Q28.6 28.5 27.6 29.9Q26.7 31.4 25.9 32.9Q25 34.5 24.2 36.1Q23.5 37.7 22.7 39.4Q22 41.1 21.4 42.9Q20.7 44.6 20.1 46.4Q19.5 48.2 18.9 50.1Q18.3 52 17.9 53.9Q17.4 55.8 18 56Q18.6 56.2 19.2 54.2Q19.7 52.3 20.3 50.5Q20.9 48.7 21.6 47Q22.2 45.2 23.1 43.6Q23.9 42 24.8 40.4Q25.6 38.9 26.6 37.4Q27.5 36 28.5 34.6Q29.5 33.3 30.5 32Q31.5 30.7 32.6 29.5Q33.7 28.3 34.7 27.2Q35.8 26.1 36.9 25Q38 24 39.2 23Q40.3 22.1 41.4 21.2Q42.6 20.3 43.7 19.4Q44.9 18.6 46 17.9Q47.2 17.1 48.4 16.4Q49.6 15.7 50.8 15.1Q51.9 14.5 53.1 14Q54.3 13.5 55.6 13Q56.8 12.5 58 12.2Q59.2 11.8 60.4 11.5Q61.6 11.2 62.9 11Q64.1 10.8 65.3 10.7Q66.5 10.6 67.7 10.6Q69 10.5 70.2 10.6Q71.4 10.7 72.6 10.8L73.8 11Z",
+    head: "M17.3 59.1Q12.4 51.1 10 37.7Q20 47.6 32 42.9Q24.5 53.9 17.3 59.1Z"
+  }
+};
+
+// src/annotations/annotation-layer.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function ScribbleArrow({ variant, offset }) {
+  const arrow = ARROWS[variant];
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      className: "annotation-arrow",
+      viewBox: arrow.box,
+      fill: "currentColor",
+      "aria-hidden": "true",
+      style: offset,
+      children: [
+        /* @__PURE__ */ jsx("path", { d: arrow.shaft }),
+        /* @__PURE__ */ jsx("path", { d: arrow.head })
+      ]
+    }
+  );
+}
+function arrowSide(variant) {
+  if (variant === "left" || variant.endsWith("-left")) return "left";
+  if (variant === "right" || variant.endsWith("-right")) return "right";
+  return "center";
+}
+function AnnotationLayer({ annotations, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("annotation-layer", className), "aria-hidden": "true", ...props, children: annotations.map((note) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "annotation",
+      "data-side": arrowSide(note.arrow),
+      "data-flip": note.arrow.startsWith("up-") ? "" : void 0,
+      style: {
+        ...note.pos,
+        ["--annotation-tilt"]: `${note.tilt ?? 0}deg`,
+        ...note.arrowScale ? { ["--annotation-arrow-scale"]: String(note.arrowScale) } : {},
+        ...note.rotate ? { ["--annotation-arrow-rotate"]: `${note.rotate}deg` } : {},
+        ...note.flipH ? { ["--annotation-arrow-flip-x"]: "-1" } : {},
+        ...note.flipV ? { ["--annotation-arrow-flip-y"]: "-1" } : {}
+      },
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "annotation-text", style: note.posText, children: note.text }),
+        /* @__PURE__ */ jsx(ScribbleArrow, { variant: note.arrow, offset: note.posArrow })
+      ]
+    },
+    note.id
+  )) });
+}
+function AnnotationList({ annotations, className, ...props }) {
+  if (annotations.length === 0) return null;
+  return /* @__PURE__ */ jsx("ul", { className: cn("annotation-list", className), ...props, children: annotations.map((note) => /* @__PURE__ */ jsx("li", { children: note.text }, note.id)) });
+}
+function AnnotationStage({
+  annotations,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("annotation-stage", className), ...props, children: [
+    /* @__PURE__ */ jsxs("div", { className: "annotation-stage-inner", children: [
+      /* @__PURE__ */ jsx(AnnotationLayer, { annotations }),
+      children
+    ] }),
+    /* @__PURE__ */ jsx(AnnotationList, { annotations })
+  ] });
+}
+export {
+  ARROWS,
+  AnnotationLayer,
+  AnnotationList,
+  AnnotationStage
+};
+//# sourceMappingURL=index.mjs.map

package/dist/annotations/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/annotations/arrow-paths.ts","../../src/annotations/annotation-layer.tsx"],"sourcesContent":["/**\n * Arrow outlines for {@link AnnotationLayer} — GENERATED, do not hand-edit.\n *\n * Regenerate with:  python3 scripts/gen-arrow-paths.py\n * then paste the object below and update the union to match. The generator owns\n * the curve control points, width profiles and head geometry; see its docstring\n * for why these are filled outlines rather than strokes.\n *\n * Six calm directional workhorses, then the expressive set — loops, S-bends,\n * zigzags — for notes that want more voice. The `-left`/`-right` twins of the\n * expressive shapes are reflections of one source curve, so editing a source\n * updates its mirror on the next run.\n */\n\nexport type ArrowVariant =\n  | 'down-right'\n  | 'down-left'\n  | 'up-right'\n  | 'up-left'\n  | 'right'\n  | 'left'\n  | 'loop-right'\n  | 'squiggle-right'\n  | 's-curve-down'\n  | 'hook-left'\n  | 'swoop-down-right'\n  | 'zigzag-right'\n  | 'curl-down'\n  | 'arc-over-right'\n  | 'jab-down-right'\n  | 'loop-left'\n  | 'squiggle-left'\n  | 'hook-right'\n  | 'swoop-down-left'\n  | 'zigzag-left'\n  | 'arc-over-left'\n  | 'jab-down-left';\n\nexport const ARROWS: Record<ArrowVariant, { box: string; shaft: string; head: string }> = {\n  'down-right': {\n    box: '0 0 120 84',\n    shaft:\n      'M7.2 10Q12 9.2 14.4 9Q16.8 8.8 19.2 8.7Q21.6 8.5 23.9 8.5Q26.2 8.5 28.5 8.7Q30.8 8.8 33.1 9Q35.3 9.2 37.5 9.5Q39.7 9.9 41.9 10.3Q44.1 10.7 46.2 11.2Q48.3 11.7 50.3 12.3Q52.4 12.9 54.4 13.7Q56.4 14.4 58.3 15.2Q60.3 16 62.1 16.9Q64 17.8 65.8 18.8Q67.7 19.8 69.4 20.9Q71.2 22 72.8 23.2Q74.5 24.4 76.1 25.8Q77.7 27.1 79.2 28.6Q80.7 30.1 82.2 31.7Q83.6 33.3 84.9 35Q86.2 36.8 87.4 38.6Q88.6 40.5 89.7 42.5Q90.8 44.5 91.7 46.6Q92.7 48.7 93.4 51Q94.2 53.3 94.8 55.7Q95.4 58.1 95.9 60.6Q96.4 63.1 97 63Q97.6 62.9 97.1 60.3Q96.7 57.8 96 55.4Q95.4 52.9 94.6 50.6Q93.9 48.3 93 46.1Q92.2 43.8 91.2 41.7Q90.2 39.6 89.1 37.6Q88 35.6 86.8 33.7Q85.6 31.8 84.3 30Q82.9 28.2 81.5 26.5Q80 24.8 78.5 23.2Q76.9 21.7 75.2 20.2Q73.6 18.8 71.8 17.5Q70 16.1 68.1 14.9Q66.2 13.7 64.3 12.7Q62.3 11.6 60.2 10.7Q58.2 9.8 56 9Q53.9 8.2 51.7 7.6Q49.5 7 47.2 6.5Q45 6 42.7 5.7Q40.4 5.3 38 5.2Q35.7 5 33.3 4.9Q31 4.8 28.6 4.9Q26.2 5 23.8 5.2Q21.3 5.4 18.9 5.7Q16.5 6 14.1 6.5Q11.6 6.9 9.2 7.5L6.8 8Z',\n    head: 'M97.5 66.5Q91.2 60 84.9 47.2Q95.3 52.3 102.8 44.4Q101.1 58.5 97.5 66.5Z',\n  },\n  'down-left': {\n    box: '0 0 120 84',\n    shaft:\n      'M113.2 8Q108.4 6.9 105.9 6.4Q103.5 6 101.1 5.7Q98.7 5.4 96.2 5.2Q93.8 5 91.4 5Q89.1 4.9 86.7 5Q84.3 5.1 82 5.3Q79.6 5.6 77.4 5.9Q75.1 6.3 72.8 6.8Q70.6 7.3 68.4 8Q66.2 8.6 64.1 9.4Q62 10.2 59.9 11.1Q57.9 12 55.9 13.1Q54 14.1 52.1 15.3Q50.2 16.4 48.4 17.7Q46.6 19 44.9 20.4Q43.3 21.9 41.7 23.4Q40.1 24.9 38.6 26.6Q37.1 28.2 35.8 30Q34.4 31.8 33.1 33.6Q31.9 35.5 30.8 37.5Q29.7 39.5 28.7 41.7Q27.7 43.8 26.9 46Q26 48.2 25.3 50.6Q24.5 52.9 23.9 55.3Q23.3 57.8 22.8 60.3Q22.4 62.9 23 63Q23.6 63.1 24.1 60.6Q24.6 58.1 25.3 55.7Q25.9 53.3 26.7 51Q27.4 48.8 28.4 46.6Q29.3 44.5 30.4 42.5Q31.5 40.5 32.7 38.7Q33.8 36.8 35.1 35Q36.4 33.3 37.8 31.7Q39.2 30 40.7 28.5Q42.2 27 43.7 25.6Q45.3 24.3 47 23Q48.6 21.7 50.4 20.6Q52.1 19.4 54 18.4Q55.8 17.4 57.7 16.5Q59.6 15.6 61.5 14.8Q63.5 13.9 65.5 13.3Q67.5 12.6 69.6 12Q71.6 11.4 73.8 10.9Q75.9 10.4 78.1 10Q80.2 9.6 82.4 9.4Q84.7 9.1 86.9 8.9Q89.2 8.7 91.5 8.6Q93.8 8.5 96.1 8.5Q98.4 8.6 100.8 8.7Q103.2 8.8 105.6 9Q108 9.3 110.4 9.6L112.8 10Z',\n    head: 'M22.5 66.5Q18.4 58.4 16.3 44.2Q24.7 52.3 34.1 47Q28.2 59.9 22.5 66.5Z',\n  },\n  'up-right': {\n    box: '0 0 120 84',\n    shaft:\n      'M6.8 76Q11.7 77.1 14.1 77.5Q16.5 77.9 18.9 78.2Q21.4 78.5 23.8 78.6Q26.2 78.8 28.6 78.8Q30.9 78.9 33.3 78.8Q35.7 78.7 38 78.4Q40.3 78.2 42.6 77.9Q44.9 77.5 47.1 77Q49.4 76.5 51.6 75.9Q53.8 75.3 55.9 74.6Q58 73.8 60.1 73Q62.1 72.1 64.1 71.1Q66.1 70.1 68 68.9Q69.9 67.8 71.8 66.5Q73.6 65.2 75.3 63.8Q77 62.4 78.6 60.9Q80.2 59.4 81.7 57.7Q83.2 56 84.5 54.2Q85.9 52.4 87.1 50.5Q88.3 48.6 89.4 46.6Q90.5 44.6 91.5 42.4Q92.4 40.3 93.3 38Q94.1 35.8 94.8 33.5Q95.5 31.1 96.1 28.7Q96.7 26.2 97.2 23.7Q97.6 21.1 97 21Q96.4 20.9 95.9 23.4Q95.4 25.9 94.7 28.3Q94.1 30.7 93.3 32.9Q92.5 35.2 91.5 37.3Q90.5 39.4 89.4 41.4Q88.3 43.4 87.1 45.2Q85.9 47.1 84.6 48.8Q83.3 50.5 81.9 52.1Q80.5 53.7 79 55.2Q77.6 56.7 76 58.1Q74.4 59.4 72.8 60.7Q71.1 62 69.4 63.2Q67.7 64.3 65.9 65.4Q64.1 66.4 62.3 67.4Q60.4 68.3 58.5 69.2Q56.5 70 54.5 70.8Q52.5 71.5 50.5 72.1Q48.4 72.7 46.3 73.3Q44.2 73.8 42 74.2Q39.8 74.6 37.6 74.9Q35.4 75.2 33.1 75.4Q30.8 75.5 28.5 75.6Q26.2 75.7 23.9 75.6Q21.5 75.6 19.2 75.5Q16.8 75.3 14.4 75Q12 74.8 9.6 74.4L7.2 74Z',\n    head: 'M97.5 17.5Q101.6 25.6 103.7 39.8Q95.3 31.7 85.9 37Q91.8 24.1 97.5 17.5Z',\n  },\n  'up-left': {\n    box: '0 0 120 84',\n    shaft:\n      'M112.8 74Q108 74.8 105.6 75.1Q103.2 75.3 100.8 75.4Q98.5 75.6 96.1 75.6Q93.8 75.6 91.5 75.5Q89.2 75.4 86.9 75.2Q84.7 75 82.4 74.6Q80.2 74.3 78.1 73.9Q75.9 73.4 73.8 72.9Q71.7 72.4 69.7 71.7Q67.6 71.1 65.6 70.4Q63.6 69.6 61.7 68.8Q59.8 68 57.9 67Q56.1 66.1 54.3 65.1Q52.5 64.1 50.7 62.9Q49 61.8 47.3 60.6Q45.7 59.3 44.1 58Q42.5 56.7 41 55.2Q39.5 53.7 38 52.1Q36.6 50.6 35.3 48.8Q34 47.1 32.8 45.3Q31.5 43.4 30.4 41.5Q29.3 39.5 28.4 37.4Q27.4 35.2 26.6 33Q25.8 30.7 25.2 28.3Q24.6 25.9 24.1 23.4Q23.6 20.9 23 21Q22.4 21.1 22.8 23.7Q23.3 26.2 23.9 28.7Q24.6 31.1 25.3 33.4Q26.1 35.7 26.9 38Q27.7 40.2 28.7 42.4Q29.6 44.5 30.7 46.5Q31.8 48.5 33 50.5Q34.2 52.4 35.5 54.2Q36.9 56 38.3 57.7Q39.8 59.4 41.3 61Q42.9 62.5 44.6 64Q46.3 65.4 48.1 66.7Q49.9 68.1 51.8 69.2Q53.7 70.4 55.7 71.4Q57.7 72.5 59.8 73.3Q61.8 74.2 64 75Q66.1 75.7 68.3 76.3Q70.5 76.9 72.8 77.4Q75 77.8 77.3 78.2Q79.6 78.5 82 78.7Q84.3 78.9 86.7 78.9Q89.1 79 91.4 78.9Q93.8 78.9 96.2 78.7Q98.6 78.5 101.1 78.2Q103.5 77.9 105.9 77.5Q108.3 77 110.8 76.5L113.2 76Z',\n    head: 'M22.5 17.5Q28.8 24 35.1 36.8Q24.7 31.7 17.2 39.6Q18.9 25.5 22.5 17.5Z',\n  },\n  right: {\n    box: '0 0 120 52',\n    shaft:\n      'M5.3 12.9Q9.5 12 11.6 11.6Q13.7 11.2 15.9 11Q18 10.7 20.2 10.5Q22.4 10.3 24.5 10.3Q26.7 10.2 28.9 10.2Q31.1 10.1 33.3 10.2Q35.5 10.3 37.7 10.4Q39.9 10.6 42.1 10.8Q44.3 11 46.5 11.3Q48.7 11.6 50.9 11.9Q53.1 12.3 55.3 12.7Q57.5 13.2 59.7 13.7Q61.9 14.2 64.1 14.8Q66.3 15.4 68.5 16Q70.7 16.7 72.8 17.5Q75 18.2 77.1 19.1Q79.2 19.9 81.4 20.8Q83.5 21.8 85.5 22.8Q87.6 23.8 89.6 24.9Q91.7 26.1 93.6 27.3Q95.6 28.5 97.6 29.8Q99.5 31.1 101.4 32.5Q103.3 33.9 105 35.4Q106.8 36.9 108.5 38.5Q110.2 40.1 111.9 41.8Q113.5 43.4 114 43Q114.5 42.6 112.8 40.9Q111.1 39.2 109.4 37.5Q107.7 35.9 105.9 34.4Q104.1 32.8 102.3 31.3Q100.4 29.8 98.5 28.4Q96.7 27 94.7 25.6Q92.8 24.3 90.8 23Q88.8 21.7 86.7 20.5Q84.7 19.4 82.6 18.2Q80.5 17.1 78.4 16.1Q76.3 15.1 74.1 14.2Q71.9 13.2 69.7 12.4Q67.5 11.5 65.3 10.8Q63.1 10.1 60.8 9.4Q58.6 8.8 56.3 8.3Q54 7.7 51.7 7.3Q49.4 6.9 47.1 6.6Q44.8 6.3 42.5 6.1Q40.2 5.9 37.9 5.8Q35.6 5.8 33.3 5.8Q31 5.9 28.7 6Q26.5 6.2 24.2 6.5Q22 6.7 19.8 7.1Q17.5 7.5 15.4 8Q13.2 8.5 11 9.1Q8.9 9.7 6.8 10.4L4.7 11.1Z',\n    head: 'M116.4 45.6Q107.6 43.8 95.1 36.7Q106.6 35.1 108.3 24.4Q114.8 37 116.4 45.6Z',\n  },\n  left: {\n    box: '0 0 120 52',\n    shaft:\n      'M115.3 11.1Q111.1 9.7 109 9.1Q106.8 8.5 104.6 8Q102.5 7.6 100.2 7.2Q98 6.9 95.8 6.6Q93.5 6.4 91.3 6.2Q89 6.1 86.7 6.1Q84.4 6.1 82.1 6.2Q79.8 6.3 77.5 6.5Q75.2 6.7 72.9 7Q70.7 7.3 68.4 7.7Q66.1 8.1 63.8 8.6Q61.5 9.1 59.3 9.7Q57 10.3 54.8 11Q52.5 11.7 50.3 12.5Q48.1 13.3 45.9 14.2Q43.7 15.1 41.6 16.1Q39.4 17.1 37.3 18.2Q35.2 19.2 33.2 20.4Q31.1 21.6 29.1 22.8Q27.1 24.1 25.2 25.4Q23.2 26.8 21.3 28.2Q19.5 29.7 17.6 31.2Q15.8 32.7 14 34.3Q12.3 35.8 10.5 37.5Q8.8 39.1 7.2 40.8Q5.5 42.6 6 43Q6.5 43.4 8.1 41.8Q9.8 40.1 11.5 38.5Q13.3 37 15 35.5Q16.8 34 18.7 32.6Q20.6 31.2 22.6 29.9Q24.5 28.7 26.5 27.4Q28.4 26.2 30.5 25.1Q32.5 24 34.5 22.9Q36.6 21.9 38.7 20.9Q40.8 20 42.9 19.1Q45 18.2 47.2 17.4Q49.3 16.6 51.5 15.9Q53.6 15.2 55.8 14.5Q58 13.9 60.2 13.4Q62.4 12.8 64.6 12.4Q66.8 11.9 69 11.5Q71.2 11.2 73.5 10.9Q75.7 10.6 77.9 10.4Q80.1 10.2 82.3 10.1Q84.5 10 86.7 9.9Q88.9 9.9 91.1 9.9Q93.3 10 95.5 10.1Q97.7 10.2 99.8 10.4Q102 10.6 104.1 10.9Q106.3 11.2 108.4 11.6Q110.5 12 112.6 12.5L114.7 12.9Z',\n    head: 'M3.6 45.6Q4.8 36.6 11 23.7Q13.4 35.1 24.2 36Q12.1 43.4 3.6 45.6Z',\n  },\n  'loop-right': {\n    box: '0 0 132 70',\n    shaft:\n      'M7 46.6Q13.9 36.3 17.7 32.3Q21.5 28.4 25.5 25.6Q29.5 22.8 33.5 21.1Q37.5 19.5 41.2 18.9Q44.9 18.3 48.2 18.8Q51.5 19.3 54.2 20.6Q56.9 22 58.9 24.3Q60.9 26.6 61.9 29.6Q63 32.5 62.9 34.8Q62.9 37.2 62.1 38.8Q61.4 40.4 60.3 41.5Q59.1 42.6 57.6 43.1Q56.2 43.6 54.6 43.6Q53 43.6 51.5 43Q50 42.4 48.7 41.1Q47.4 39.8 46.5 37.7Q45.6 35.6 45.4 33Q45.3 30.4 46.4 28.4Q47.5 26.4 49.9 24.8Q52.4 23.2 56.1 22.2Q59.9 21.2 64.8 21Q69.7 20.9 75.6 21.6Q81.4 22.3 88 24Q94.5 25.7 101.6 28.4Q108.7 31.2 116.2 34.9Q123.6 38.7 124 38Q124.4 37.3 116.9 33.5Q109.4 29.7 102.2 26.9Q95.1 24.1 88.4 22.2Q81.8 20.4 75.8 19.4Q69.9 18.4 64.7 18.4Q59.6 18.3 55.4 19.2Q51.1 20 48 21.8Q44.8 23.6 43 26.5Q41.2 29.4 41.1 33Q41.1 36.6 42.2 39.5Q43.3 42.5 45.2 44.5Q47.1 46.6 49.6 47.7Q52 48.7 54.5 48.8Q57.1 48.9 59.5 48Q61.9 47.1 63.8 45.2Q65.7 43.4 66.8 40.8Q67.9 38.2 67.9 35Q67.9 31.7 66.4 27.9Q65 24.2 62.3 21.3Q59.6 18.4 56.2 16.8Q52.7 15.1 48.8 14.7Q44.8 14.3 40.6 15.1Q36.4 15.9 32.1 17.9Q27.8 19.8 23.6 22.9Q19.5 26 15.6 30.3Q11.7 34.6 8.3 40L5 45.4Z',\n    head: 'M127 39.7Q118.2 40.7 104.5 37.9Q114.8 32.8 113.4 22.2Q123.1 32.1 127 39.7Z',\n  },\n  'squiggle-right': {\n    box: '0 0 132 58',\n    shaft:\n      'M5.9 30.6Q10.6 25.1 13 23.1Q15.4 21.1 17.8 19.8Q20.1 18.6 22.4 18Q24.7 17.5 26.9 17.6Q29.1 17.8 31.1 18.5Q33.1 19.2 35 20.6Q37 21.9 38.8 23.9Q40.5 25.9 42.2 28.7Q44 31.4 46 34Q48.1 36.6 50.4 38.5Q52.7 40.4 55.2 41.5Q57.7 42.7 60.4 43Q63 43.4 65.6 43Q68.2 42.5 70.7 41.3Q73.1 40 75.4 38.1Q77.6 36.2 79.5 33.6Q81.5 31 83.2 28.3Q84.9 25.5 86.7 23.5Q88.6 21.5 90.7 20.2Q92.9 18.9 95.3 18.2Q97.6 17.6 100.2 17.6Q102.8 17.7 105.5 18.4Q108.2 19.2 111 20.7Q113.7 22.2 116.5 24.4Q119.2 26.6 121.8 29.5Q124.4 32.4 125 32Q125.6 31.6 122.9 28.6Q120.2 25.6 117.3 23.3Q114.5 21 111.7 19.4Q108.8 17.8 106 16.8Q103.1 15.8 100.3 15.6Q97.4 15.4 94.7 15.9Q91.9 16.4 89.3 17.7Q86.7 19 84.4 21.2Q82.1 23.3 80.1 26Q78.2 28.8 76.3 30.9Q74.4 33.1 72.5 34.6Q70.6 36 68.7 36.8Q66.7 37.6 64.9 37.9Q63 38.1 61.2 37.8Q59.3 37.5 57.5 36.6Q55.6 35.7 53.8 34.2Q51.9 32.7 50.2 30.6Q48.4 28.4 46.5 25.6Q44.6 22.8 42.4 20.5Q40.1 18.2 37.6 16.7Q35.1 15.2 32.4 14.4Q29.7 13.7 27 13.7Q24.2 13.8 21.5 14.6Q18.8 15.5 16.2 17.1Q13.6 18.7 11.2 21Q8.7 23.3 6.4 26.3L4.1 29.4Z',\n    head: 'M127 34.5Q117.7 33.3 105.7 26.9Q119.6 25.2 123.4 12.8Q127.4 25.6 127 34.5Z',\n  },\n  's-curve-down': {\n    box: '0 0 92 104',\n    shaft:\n      'M19.7 7.3Q28.6 10.2 32.3 11.8Q35.9 13.5 38.8 15.2Q41.7 16.9 43.8 18.7Q45.9 20.4 47.4 22.2Q48.9 23.9 49.7 25.6Q50.6 27.2 50.9 28.8Q51.3 30.4 51.3 32Q51.2 33.5 50.8 35.1Q50.4 36.6 49.6 38.2Q48.8 39.8 47.6 41.3Q46.4 42.9 44.9 44.4Q43.3 45.9 41.4 47.3Q39.6 48.7 37.5 50.3Q35.4 51.9 33.7 53.7Q32 55.4 30.8 57.3Q29.5 59.2 28.7 61.1Q27.9 63.1 27.6 65.1Q27.3 67.2 27.5 69.2Q27.6 71.2 28.2 73.3Q28.8 75.3 29.9 77.2Q31 79.2 32.5 81.1Q34 83.1 35.9 84.9Q37.9 86.8 40.2 88.7Q42.5 90.6 45.3 92.4Q48.1 94.2 51.4 96Q54.6 97.8 55 97Q55.4 96.2 52.2 94.5Q49 92.7 46.3 90.9Q43.6 89.1 41.3 87.3Q39.1 85.4 37.4 83.5Q35.7 81.6 34.4 79.7Q33.2 77.9 32.4 76.1Q31.6 74.2 31.2 72.5Q30.9 70.8 30.9 69.1Q31 67.5 31.4 65.9Q31.8 64.4 32.5 62.9Q33.3 61.4 34.5 60Q35.6 58.6 37.1 57.2Q38.6 55.8 40.5 54.6Q42.4 53.3 44.6 51.7Q46.9 50.2 48.8 48.5Q50.7 46.8 52.2 44.9Q53.7 43 54.8 40.9Q55.9 38.8 56.4 36.5Q57 34.3 57 32Q57 29.7 56.3 27.4Q55.6 25.2 54.3 23Q53 20.9 51 18.9Q49.1 16.9 46.5 15.1Q43.9 13.3 40.7 11.7Q37.5 10.1 33.6 8.7Q29.6 7.2 25 6L20.3 4.7Z',\n    head: 'M58.2 98.6Q48.2 101.7 33 100.8Q46.3 92.7 44.2 78.4Q54.4 89.4 58.2 98.6Z',\n  },\n  'hook-left': {\n    box: '0 0 132 80',\n    shaft:\n      'M126.3 13.9Q115.8 11.2 110.5 10.3Q105.2 9.3 99.9 8.6Q94.5 8 89.3 7.7Q84 7.5 78.9 7.6Q73.7 7.6 68.8 8.1Q63.8 8.6 59.1 9.4Q54.3 10.2 49.9 11.4Q45.4 12.6 41.3 14.1Q37.3 15.7 33.6 17.6Q29.9 19.6 26.7 21.9Q23.5 24.2 20.8 27Q18.1 29.7 16 32.9Q14 36 13 38.9Q12 41.7 11.8 44.3Q11.5 47 11.9 49.5Q12.4 52 13.4 54.1Q14.4 56.3 15.9 58.2Q17.5 60 19.4 61.5Q21.3 63 23.6 64.1Q25.8 65.2 28.3 65.9Q30.8 66.6 33.4 66.9Q36.1 67.1 38.9 67Q41.6 66.8 44.5 66.3Q47.3 65.7 50.1 64.7Q52.9 63.7 55.7 62.1Q58.4 60.6 58 60Q57.6 59.4 54.9 60.8Q52.3 62.2 49.6 63.1Q46.8 64 44.1 64.5Q41.5 64.9 38.9 64.9Q36.2 64.8 33.8 64.4Q31.4 63.9 29.2 63.1Q27 62.3 25.1 61.2Q23.2 60.1 21.6 58.8Q20.1 57.4 18.9 55.9Q17.8 54.3 17 52.5Q16.3 50.8 16.1 48.9Q15.8 46.9 16 44.8Q16.3 42.6 17.2 40.3Q18 38 19.8 35.3Q21.6 32.5 24 30.1Q26.4 27.7 29.3 25.6Q32.3 23.4 35.7 21.6Q39.1 19.8 43 18.3Q46.8 16.8 51 15.6Q55.3 14.4 59.8 13.6Q64.4 12.7 69.2 12.2Q74 11.6 79 11.4Q84 11.2 89.1 11.3Q94.3 11.5 99.5 11.9Q104.8 12.4 110 13.1Q115.3 13.9 120.5 15L125.7 16.1Z',\n    head: 'M60.8 58.1Q57.9 66.6 49.2 77.7Q49.2 65.8 38.8 61.7Q52.2 57.9 60.8 58.1Z',\n  },\n  'swoop-down-right': {\n    box: '0 0 142 100',\n    shaft:\n      'M6.2 13.1Q12.6 12.2 15.8 12Q19 11.7 22.1 11.6Q25.2 11.5 28.3 11.5Q31.4 11.5 34.5 11.6Q37.5 11.8 40.5 12.1Q43.5 12.3 46.4 12.8Q49.4 13.2 52.2 13.7Q55.1 14.2 57.9 14.9Q60.7 15.5 63.4 16.3Q66.1 17 68.7 17.9Q71.4 18.8 73.9 19.8Q76.5 20.7 78.9 21.8Q81.4 22.9 83.8 24Q86.2 25.2 88.5 26.4Q90.7 27.7 92.9 29Q95.1 30.4 97.2 31.8Q99.3 33.2 101.3 34.8Q103.3 36.3 105.2 37.9Q107.1 39.6 108.8 41.3Q110.6 43 112.2 44.8Q113.8 46.7 115.3 48.6Q116.8 50.5 118.2 52.6Q119.5 54.6 120.7 56.8Q121.8 59 122.8 61.2Q123.7 63.5 124.5 65.8Q125.3 68.2 126 68Q126.7 67.8 125.9 65.4Q125.1 63 124.2 60.6Q123.2 58.3 122.2 56Q121.1 53.8 119.9 51.6Q118.7 49.4 117.3 47.2Q115.9 45.1 114.4 43Q112.9 41 111.2 39Q109.6 37.1 107.7 35.2Q105.9 33.3 104 31.6Q102 29.8 99.9 28.2Q97.8 26.5 95.5 25Q93.3 23.5 90.9 22.1Q88.6 20.7 86.1 19.4Q83.6 18.1 81 17Q78.4 15.9 75.7 14.9Q73 13.9 70.3 13.1Q67.5 12.2 64.6 11.5Q61.8 10.8 58.9 10.3Q55.9 9.7 52.9 9.3Q50 8.8 46.9 8.6Q43.9 8.3 40.8 8.1Q37.7 8 34.6 8Q31.4 8 28.3 8.1Q25.1 8.3 21.9 8.6Q18.7 8.9 15.5 9.3Q12.3 9.7 9 10.3L5.8 10.9Z',\n    head: 'M127 71.7Q117.5 66.1 107.5 53.5Q123.2 58.1 132.6 46.3Q131.4 62.1 127 71.7Z',\n  },\n  'zigzag-right': {\n    box: '0 0 132 62',\n    shaft:\n      'M5.3 16.7Q9.4 21.4 11.5 23.8Q13.6 26.2 15.7 28.6Q17.8 30.9 19.8 33.3Q21.9 35.7 24 38.1Q26.1 40.4 28.2 42.8Q30.3 45.2 34 45.1Q37.8 45 39.8 42.6Q41.9 40.1 43.9 37.7Q45.9 35.3 48 32.8Q50 30.4 52 27.9Q54 25.4 55.9 23Q57.9 20.5 58.1 18Q58.2 15.6 60.4 18Q62.6 20.4 64.8 22.8Q67 25.2 69.3 27.6Q71.5 30 73.7 32.4Q75.9 34.8 78.2 37.2Q80.4 39.6 82.6 42Q84.8 44.4 88.1 44.8Q91.4 45.1 94.1 43.2Q96.8 41.3 99.6 39.4Q102.3 37.4 105 35.5Q107.8 33.6 110.5 31.8Q113.3 29.9 116 28.1Q118.8 26.2 121.6 24.4Q124.4 22.5 124 22Q123.6 21.5 120.9 23.3Q118.1 25.2 115.3 27Q112.6 28.9 109.8 30.7Q107 32.5 104.2 34.3Q101.4 36.1 98.6 37.9Q95.8 39.7 93 41.4Q90.1 43.2 88.5 42.9Q86.8 42.7 84.8 40.1Q82.7 37.6 80.6 35.1Q78.5 32.6 76.4 30Q74.4 27.5 72.3 25Q70.2 22.5 68.1 20Q66 17.4 63.9 14.9Q61.8 12.4 57.9 14.9Q54.1 17.4 52.1 19.8Q50 22.3 48 24.7Q46 27.2 44 29.6Q42.1 32.1 40.1 34.6Q38.1 37.1 36.2 39.6Q34.2 42.1 33.8 42.1Q33.4 42.2 31.2 40Q29 37.7 26.8 35.5Q24.5 33.2 22.3 31Q20.1 28.8 17.9 26.5Q15.6 24.3 13.4 22Q11.2 19.8 9 17.6L6.7 15.3Z',\n    head: 'M126.5 20.3Q124.7 29 117.8 39.8Q117.3 26.5 105.9 21.9Q118.2 19.2 126.5 20.3Z',\n  },\n  'curl-down': {\n    box: '0 0 104 112',\n    shaft:\n      'M26.2 13.5Q44 13.4 50.8 14.8Q57.6 16.2 62.4 18.6Q67.2 21 70 23.9Q72.8 26.9 73.8 29.9Q74.8 32.9 74.3 35.8Q73.8 38.7 71.8 41.4Q69.7 44.1 66 46.4Q62.3 48.7 57 50.1Q51.8 51.5 47.4 51.5Q43.1 51.5 40 50.3Q36.9 49.1 34.9 47.1Q32.9 45.2 31.9 42.7Q30.9 40.3 30.9 37.6Q31 34.9 32.1 32.4Q33.2 29.8 35.5 27.6Q37.8 25.5 41.5 24.1Q45.1 22.7 49.6 22.5Q54.1 22.3 57.6 23.7Q61.1 25.1 63.7 28.1Q66.4 31 68.2 35.4Q70 39.7 70.9 45.2Q71.7 50.6 71.6 56.8Q71.5 63.1 70.4 69.8Q69.2 76.5 67.2 83.3Q65.1 90.1 62.1 96.9Q59.2 103.6 60 104Q60.8 104.4 63.9 97.7Q67 90.9 69.1 83.9Q71.3 77 72.5 70.1Q73.7 63.3 74 56.9Q74.4 50.5 73.7 44.7Q73 39 71.2 34.1Q69.4 29.3 66.4 25.7Q63.4 22 59.1 20.1Q54.8 18.1 49.5 18.1Q44.3 18.1 39.8 19.6Q35.3 21.2 32.1 23.9Q28.9 26.6 27.2 30.1Q25.5 33.6 25.3 37.4Q25.1 41.2 26.4 44.8Q27.7 48.5 30.6 51.4Q33.4 54.3 37.6 56Q41.9 57.7 47.3 57.8Q52.7 57.9 58.7 56.2Q64.8 54.5 69.4 51.6Q73.9 48.7 76.6 44.8Q79.3 40.9 79.9 36.6Q80.4 32.3 78.8 28.1Q77.1 24 73.5 20.6Q69.8 17.1 64.3 14.7Q58.9 12.3 51.5 11.1Q44.2 9.9 35 10.2L25.8 10.5Z',\n    head: 'M58 107.7Q54.8 96 56.4 78.4Q65.3 94 81.7 91.7Q68.7 103.4 58 107.7Z',\n  },\n  'arc-over-right': {\n    box: '0 0 132 74',\n    shaft:\n      'M7 60.3Q9.5 54.4 11 51.7Q12.5 48.9 14.1 46.4Q15.7 43.9 17.5 41.7Q19.3 39.4 21.3 37.4Q23.2 35.4 25.3 33.6Q27.4 31.8 29.6 30.2Q31.7 28.6 34 27.2Q36.3 25.9 38.7 24.7Q41.1 23.6 43.5 22.7Q46 21.7 48.5 21Q51 20.3 53.6 19.8Q56.2 19.3 58.8 19Q61.4 18.7 64 18.6Q66.7 18.5 69.3 18.6Q72 18.7 74.6 19Q77.2 19.3 79.9 19.8Q82.5 20.3 85.1 21Q87.7 21.7 90.2 22.6Q92.8 23.5 95.3 24.6Q97.8 25.8 100.2 27.1Q102.7 28.4 105 29.9Q107.4 31.5 109.6 33.2Q111.9 35 113.9 37Q116 39 118 41.2Q119.9 43.5 121.7 45.9Q123.4 48.4 124 48Q124.6 47.6 122.8 45.1Q121.1 42.6 119.1 40.2Q117.2 37.9 115.1 35.8Q113.1 33.6 110.9 31.7Q108.7 29.7 106.4 27.9Q104.1 26.2 101.7 24.6Q99.2 23.1 96.7 21.8Q94.1 20.5 91.5 19.4Q88.9 18.3 86.1 17.4Q83.4 16.5 80.7 15.9Q77.9 15.3 75.1 14.9Q72.3 14.5 69.5 14.3Q66.7 14.2 63.9 14.2Q61.1 14.3 58.3 14.7Q55.5 15 52.8 15.5Q50 16.1 47.3 16.9Q44.6 17.7 42 18.7Q39.4 19.8 36.9 21.1Q34.4 22.3 32 23.8Q29.5 25.4 27.3 27.1Q25 28.9 22.8 30.9Q20.7 32.8 18.7 35.1Q16.8 37.3 15 39.7Q13.2 42.2 11.6 44.9Q10 47.6 8.7 50.5Q7.3 53.4 6.1 56.5L5 59.7Z',\n    head: 'M126 51Q115.7 48.6 103.1 40Q118.7 39.8 124.1 26.5Q127.3 41.2 126 51Z',\n  },\n  'jab-down-right': {\n    box: '0 0 84 74',\n    shaft:\n      'M10.2 11Q12.6 10.7 13.8 10.6Q15 10.6 16.3 10.6Q17.5 10.6 18.7 10.8Q19.9 10.9 21.1 11.1Q22.3 11.3 23.6 11.6Q24.8 11.9 26 12.3Q27.2 12.7 28.4 13.1Q29.6 13.6 30.8 14.1Q32 14.7 33.2 15.3Q34.4 15.9 35.5 16.6Q36.7 17.2 37.9 18Q39.1 18.7 40.2 19.5Q41.4 20.4 42.5 21.2Q43.7 22.1 44.8 23.1Q45.9 24 47.1 25.1Q48.2 26.1 49.3 27.2Q50.4 28.3 51.4 29.5Q52.5 30.7 53.5 31.9Q54.6 33.2 55.6 34.6Q56.6 35.9 57.5 37.4Q58.4 38.8 59.3 40.4Q60.2 41.9 61 43.6Q61.8 45.2 62.5 46.9Q63.2 48.7 63.8 50.5Q64.4 52.3 64.9 54.2Q65.4 56.2 66 56Q66.6 55.8 66.1 53.9Q65.6 52 65.1 50.1Q64.5 48.2 63.8 46.4Q63.2 44.6 62.6 42.9Q61.9 41.1 61.2 39.5Q60.5 37.8 59.7 36.2Q58.9 34.5 58.1 33Q57.2 31.5 56.3 30Q55.4 28.5 54.4 27.1Q53.4 25.7 52.4 24.4Q51.3 23.1 50.2 21.9Q49.1 20.7 48 19.6Q46.8 18.4 45.6 17.4Q44.4 16.4 43.1 15.5Q41.9 14.6 40.6 13.7Q39.3 12.9 37.9 12.2Q36.6 11.5 35.2 10.9Q33.9 10.3 32.5 9.9Q31.1 9.4 29.7 9Q28.4 8.6 27 8.3Q25.6 8.1 24.2 7.9Q22.9 7.7 21.5 7.7Q20.1 7.6 18.8 7.6Q17.5 7.7 16.2 7.8Q14.8 7.9 13.6 8.1Q12.3 8.4 11 8.7L9.8 9Z',\n    head: 'M66.7 59.1Q58.8 54.1 50.7 43.2Q64 47.6 72.7 38Q70.9 51.2 66.7 59.1Z',\n  },\n  'loop-left': {\n    box: '0 0 132 70',\n    shaft:\n      'M127 45.4Q120.3 34.6 116.5 30.3Q112.6 26 108.4 22.8Q104.3 19.7 100 17.7Q95.7 15.7 91.5 14.8Q87.2 14 83.2 14.4Q79.2 14.8 75.7 16.4Q72.1 18.1 69.4 21Q66.7 24 65.2 27.8Q63.8 31.7 63.8 35Q63.9 38.3 65 40.9Q66.2 43.5 68.1 45.3Q70.1 47.1 72.5 48Q74.9 48.8 77.5 48.7Q80 48.6 82.4 47.5Q84.7 46.4 86.5 44.3Q88.4 42.3 89.5 39.4Q90.5 36.5 90.5 33Q90.4 29.5 88.6 26.7Q86.9 23.9 83.8 22.1Q80.7 20.4 76.5 19.5Q72.4 18.7 67.2 18.7Q62.1 18.7 56.2 19.6Q50.2 20.5 43.6 22.4Q37 24.2 29.8 26.9Q22.7 29.7 15.1 33.5Q7.6 37.3 8 38Q8.4 38.7 15.8 34.9Q23.3 31.1 30.4 28.4Q37.5 25.6 44 23.9Q50.6 22.1 56.4 21.4Q62.3 20.6 67.2 20.7Q72.1 20.9 76 21.8Q79.8 22.8 82.3 24.4Q84.8 26.1 86 28.2Q87.1 30.3 87 33Q86.8 35.7 85.9 37.9Q84.9 40 83.5 41.3Q82.1 42.6 80.6 43.2Q79 43.8 77.4 43.7Q75.8 43.7 74.4 43.1Q72.9 42.5 71.8 41.4Q70.7 40.3 70.1 38.7Q69.4 37.1 69.4 34.8Q69.3 32.6 70.4 29.7Q71.4 26.8 73.4 24.6Q75.3 22.4 78 21Q80.6 19.6 83.8 19.1Q87.1 18.7 90.8 19.2Q94.5 19.7 98.4 21.3Q102.4 23 106.4 25.7Q110.4 28.4 114.2 32.4Q118.1 36.3 121.5 41.4L125 46.6Z',\n    head: 'M5 39.7Q8.7 31.6 18.1 21.3Q17.2 32.8 27 37Q13.6 40.2 5 39.7Z',\n  },\n  'squiggle-left': {\n    box: '0 0 132 58',\n    shaft:\n      'M127.9 29.4Q123.3 23.3 120.9 20.9Q118.4 18.6 115.8 17Q113.2 15.4 110.5 14.6Q107.8 13.8 105 13.7Q102.3 13.7 99.6 14.5Q97 15.3 94.5 16.8Q92.1 18.4 89.9 20.7Q87.7 23 85.8 25.8Q84 28.6 82.2 30.9Q80.4 33.1 78.5 34.6Q76.7 36.2 74.8 37.1Q72.9 38 70.9 38.3Q69 38.7 67.1 38.4Q65.1 38.2 63.1 37.3Q61.2 36.4 59.2 34.9Q57.3 33.4 55.5 31.1Q53.6 28.9 51.7 26.2Q49.8 23.4 47.5 21.2Q45.2 19.1 42.7 17.7Q40.1 16.4 37.3 15.8Q34.6 15.3 31.7 15.5Q28.9 15.7 26 16.7Q23.1 17.7 20.3 19.3Q17.4 20.9 14.6 23.2Q11.8 25.5 9.1 28.6Q6.4 31.6 7 32Q7.6 32.4 10.2 29.6Q12.9 26.7 15.6 24.5Q18.3 22.3 21.1 20.8Q23.8 19.3 26.5 18.5Q29.2 17.8 31.8 17.7Q34.4 17.7 36.7 18.3Q39.1 18.9 41.3 20.2Q43.4 21.5 45.4 23.5Q47.3 25.4 49 28.1Q50.7 30.8 52.7 33.4Q54.7 35.9 56.9 37.8Q59.1 39.7 61.5 40.8Q63.9 42 66.5 42.4Q69 42.8 71.6 42.5Q74.1 42.1 76.6 41Q79 39.9 81.3 38Q83.6 36.2 85.6 33.7Q87.7 31.1 89.4 28.4Q91.2 25.7 93 23.8Q94.9 21.8 96.9 20.4Q98.8 19.1 100.9 18.4Q102.9 17.7 105.1 17.6Q107.3 17.5 109.6 18.1Q111.8 18.6 114.2 19.9Q116.6 21.1 119 23.1Q121.4 25.1 123.7 27.9L126.1 30.6Z',\n    head: 'M5 34.5Q4 25.2 7.5 12Q12.4 25.2 25.3 26Q13.8 32.9 5 34.5Z',\n  },\n  'hook-right': {\n    box: '0 0 132 80',\n    shaft:\n      'M6.3 16.1Q16.7 13.9 22 13.1Q27.2 12.3 32.5 11.8Q37.7 11.4 42.8 11.3Q48 11.1 53 11.4Q58 11.6 62.8 12.1Q67.6 12.7 72.2 13.5Q76.7 14.4 80.9 15.6Q85.2 16.8 89 18.3Q92.9 19.9 96.3 21.7Q99.7 23.5 102.6 25.7Q105.5 27.8 107.8 30.3Q110.2 32.7 112 35.4Q113.7 38.1 114.6 40.4Q115.4 42.7 115.7 44.8Q115.9 46.9 115.7 48.8Q115.4 50.7 114.7 52.4Q114 54.2 112.9 55.7Q111.8 57.3 110.3 58.7Q108.7 60 106.9 61.1Q105 62.2 102.8 63.1Q100.6 63.9 98.2 64.3Q95.7 64.8 93.1 64.9Q90.5 64.9 87.8 64.5Q85.2 64 82.4 63.1Q79.7 62.2 77.1 60.8Q74.4 59.4 74 60Q73.6 60.6 76.3 62.1Q79.1 63.7 81.9 64.7Q84.7 65.7 87.5 66.3Q90.4 66.8 93.1 67Q95.9 67.1 98.6 66.9Q101.2 66.6 103.7 66Q106.2 65.3 108.5 64.2Q110.8 63.1 112.7 61.6Q114.7 60.2 116.2 58.3Q117.8 56.5 118.8 54.2Q119.9 52 120.3 49.5Q120.8 47 120.5 44.3Q120.3 41.6 119.3 38.8Q118.3 35.9 116.2 32.7Q114.1 29.5 111.4 26.8Q108.7 24.1 105.4 21.8Q102.2 19.4 98.5 17.5Q94.8 15.6 90.7 14.1Q86.6 12.5 82.1 11.4Q77.7 10.2 72.9 9.4Q68.2 8.6 63.2 8.2Q58.3 7.7 53.1 7.6Q48 7.6 42.7 7.8Q37.5 8.1 32.2 8.7Q26.8 9.3 21.5 10.3Q16.2 11.3 11 12.6L5.7 13.9Z',\n    head: 'M71.2 58.1Q80.1 57.4 93.7 60.9Q82.8 65.8 83.3 76.8Q74.4 66.2 71.2 58.1Z',\n  },\n  'swoop-down-left': {\n    box: '0 0 142 100',\n    shaft:\n      'M136.2 10.9Q129.7 9.7 126.5 9.3Q123.3 8.8 120.1 8.5Q116.9 8.2 113.7 8Q110.6 7.9 107.4 7.9Q104.3 7.8 101.2 8Q98.1 8.1 95.1 8.4Q92 8.6 89 9Q86 9.5 83.1 10Q80.2 10.6 77.3 11.3Q74.5 12 71.7 12.9Q68.9 13.8 66.2 14.8Q63.5 15.8 61 16.9Q58.4 18.1 55.9 19.4Q53.4 20.7 51.1 22.1Q48.7 23.5 46.5 25Q44.3 26.6 42.2 28.3Q40.1 29.9 38.1 31.7Q36.2 33.4 34.4 35.3Q32.6 37.2 30.9 39.1Q29.2 41.1 27.7 43.1Q26.2 45.2 24.8 47.3Q23.5 49.4 22.2 51.6Q21 53.8 19.9 56.1Q18.8 58.3 17.9 60.7Q16.9 63 16.1 65.4Q15.3 67.8 16 68Q16.7 68.2 17.5 65.8Q18.2 63.5 19.2 61.2Q20.1 58.9 21.2 56.8Q22.4 54.6 23.7 52.5Q25 50.5 26.5 48.5Q28 46.6 29.7 44.7Q31.3 42.9 33.1 41.2Q34.8 39.4 36.7 37.8Q38.6 36.2 40.6 34.6Q42.6 33.1 44.7 31.7Q46.8 30.3 49 29Q51.2 27.6 53.5 26.4Q55.8 25.2 58.2 24.1Q60.6 22.9 63.1 21.9Q65.6 20.8 68.1 19.9Q70.7 18.9 73.3 18.1Q76 17.3 78.7 16.5Q81.4 15.8 84.2 15.1Q87 14.5 89.8 13.9Q92.7 13.4 95.6 13Q98.5 12.5 101.5 12.2Q104.5 11.9 107.5 11.8Q110.6 11.6 113.7 11.6Q116.8 11.5 119.9 11.6Q123 11.7 126.2 12Q129.4 12.3 132.6 12.7L135.8 13.1Z',\n    head: 'M15 71.7Q9.8 61.9 7.9 45.9Q18.8 58.1 33.1 53.1Q23.7 65.8 15 71.7Z',\n  },\n  'zigzag-left': {\n    box: '0 0 132 62',\n    shaft:\n      'M125.3 15.3Q120.8 19.8 118.6 22Q116.3 24.2 114.1 26.5Q111.9 28.7 109.6 31Q107.4 33.2 105.2 35.4Q103 37.7 100.8 40Q98.6 42.2 98.2 42.2Q97.8 42.1 95.8 39.6Q93.8 37.2 91.8 34.7Q89.8 32.2 87.8 29.8Q85.8 27.3 83.8 24.9Q81.8 22.4 79.7 20Q77.7 17.5 74.1 15.1Q70.4 12.6 68.3 15.1Q66.2 17.6 64.1 20.1Q62 22.7 59.9 25.2Q57.8 27.7 55.7 30.2Q53.6 32.7 51.5 35.2Q49.4 37.7 47.3 40.2Q45.2 42.7 43.5 43Q41.8 43.2 39 41.5Q36.2 39.7 33.4 37.9Q30.6 36.1 27.8 34.3Q25 32.5 22.2 30.7Q19.5 28.8 16.7 27Q13.9 25.1 11.1 23.3Q8.4 21.5 8 22Q7.6 22.5 10.4 24.4Q13.2 26.3 15.9 28.1Q18.7 29.9 21.5 31.8Q24.2 33.7 27 35.6Q29.7 37.5 32.4 39.4Q35.2 41.3 37.9 43.2Q40.6 45.1 43.9 44.7Q47.1 44.3 49.3 41.9Q51.5 39.5 53.7 37.1Q55.9 34.7 58.1 32.3Q60.3 29.9 62.5 27.5Q64.7 25 67 22.6Q69.2 20.2 71.4 17.8Q73.6 15.4 73.9 17.8Q74.3 20.3 76.3 22.8Q78.2 25.3 80.2 27.8Q82.2 30.2 84.2 32.7Q86.2 35.2 88.2 37.6Q90.2 40.1 92.2 42.5Q94.2 45 98 45.1Q101.7 45.2 103.8 42.8Q105.9 40.5 108 38.1Q110.1 35.7 112.2 33.4Q114.3 31 116.4 28.6Q118.4 26.2 120.5 23.8Q122.6 21.5 124.7 19.1L126.7 16.7Z',\n    head: 'M5.5 20.3Q14.2 18.6 26.8 20.9Q14.7 26.5 14.9 38.7Q7.7 28.4 5.5 20.3Z',\n  },\n  'arc-over-left': {\n    box: '0 0 132 74',\n    shaft:\n      'M127 59.7Q124.7 53.4 123.4 50.5Q122 47.5 120.4 44.8Q118.9 42.2 117.1 39.7Q115.3 37.2 113.3 35Q111.3 32.8 109.2 30.8Q107.1 28.8 104.8 27.1Q102.5 25.3 100.1 23.8Q97.6 22.3 95.1 21Q92.6 19.8 90 18.8Q87.3 17.7 84.7 17Q82 16.2 79.2 15.6Q76.5 15.1 73.7 14.8Q70.9 14.5 68.1 14.4Q65.3 14.3 62.5 14.5Q59.7 14.7 56.9 15Q54.1 15.4 51.4 16.1Q48.6 16.7 45.9 17.5Q43.2 18.4 40.6 19.5Q37.9 20.6 35.4 21.9Q32.8 23.2 30.4 24.7Q27.9 26.2 25.6 28Q23.3 29.7 21.1 31.7Q18.9 33.7 16.9 35.8Q14.8 37.9 12.9 40.2Q10.9 42.6 9.2 45.1Q7.4 47.6 8 48Q8.6 48.4 10.3 45.9Q12.1 43.5 14 41.2Q16 39 18.1 37Q20.1 35 22.4 33.2Q24.6 31.4 27 29.9Q29.3 28.3 31.7 27Q34.2 25.7 36.7 24.5Q39.2 23.4 41.7 22.5Q44.3 21.6 46.9 20.9Q49.5 20.1 52.1 19.6Q54.7 19.1 57.4 18.8Q60 18.5 62.7 18.4Q65.3 18.3 68 18.4Q70.6 18.5 73.2 18.8Q75.8 19.2 78.4 19.7Q81 20.2 83.5 21Q86 21.7 88.5 22.6Q90.9 23.6 93.3 24.7Q95.7 25.9 97.9 27.3Q100.2 28.7 102.4 30.2Q104.6 31.8 106.7 33.6Q108.7 35.4 110.7 37.5Q112.6 39.5 114.4 41.7Q116.2 44 117.8 46.5Q119.5 49 121 51.7Q122.4 54.4 123.7 57.4L125 60.3Z',\n    head: 'M6 51Q4 40.7 6.6 25.7Q13.3 39.8 27.6 39.2Q15.6 48.2 6 51Z',\n  },\n  'jab-down-left': {\n    box: '0 0 84 74',\n    shaft:\n      'M74.2 9Q71.7 8.4 70.4 8.2Q69.2 7.9 67.8 7.8Q66.5 7.7 65.2 7.7Q63.9 7.7 62.5 7.7Q61.1 7.8 59.8 8Q58.4 8.2 57 8.5Q55.7 8.8 54.3 9.1Q52.9 9.5 51.6 10Q50.2 10.5 48.8 11.1Q47.5 11.7 46.2 12.4Q44.8 13.1 43.5 13.9Q42.2 14.7 41 15.6Q39.7 16.5 38.5 17.5Q37.2 18.5 36.1 19.6Q34.9 20.7 33.8 21.9Q32.7 23.1 31.6 24.4Q30.5 25.7 29.6 27.1Q28.6 28.5 27.6 29.9Q26.7 31.4 25.9 32.9Q25 34.5 24.2 36.1Q23.5 37.7 22.7 39.4Q22 41.1 21.4 42.9Q20.7 44.6 20.1 46.4Q19.5 48.2 18.9 50.1Q18.3 52 17.9 53.9Q17.4 55.8 18 56Q18.6 56.2 19.2 54.2Q19.7 52.3 20.3 50.5Q20.9 48.7 21.6 47Q22.2 45.2 23.1 43.6Q23.9 42 24.8 40.4Q25.6 38.9 26.6 37.4Q27.5 36 28.5 34.6Q29.5 33.3 30.5 32Q31.5 30.7 32.6 29.5Q33.7 28.3 34.7 27.2Q35.8 26.1 36.9 25Q38 24 39.2 23Q40.3 22.1 41.4 21.2Q42.6 20.3 43.7 19.4Q44.9 18.6 46 17.9Q47.2 17.1 48.4 16.4Q49.6 15.7 50.8 15.1Q51.9 14.5 53.1 14Q54.3 13.5 55.6 13Q56.8 12.5 58 12.2Q59.2 11.8 60.4 11.5Q61.6 11.2 62.9 11Q64.1 10.8 65.3 10.7Q66.5 10.6 67.7 10.6Q69 10.5 70.2 10.6Q71.4 10.7 72.6 10.8L73.8 11Z',\n    head: 'M17.3 59.1Q12.4 51.1 10 37.7Q20 47.6 32 42.9Q24.5 53.9 17.3 59.1Z',\n  },\n};\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport { cn } from '../cn';\nimport { ARROWS, type ArrowVariant } from './arrow-paths';\n\n/** CSS edge offsets. Any length or percentage the property accepts. */\nexport interface AnnotationOffsets {\n  top?: string;\n  left?: string;\n  right?: string;\n  bottom?: string;\n}\n\nexport interface Annotation {\n  /** Stable key. Also what a consumer matches on when tuning placement. */\n  id: string;\n  /** The note itself. Kept short — this is marker on a screenshot, not prose. */\n  text: string;\n  arrow: ArrowVariant;\n  /**\n   * Placement of the note within the stage. Percentages resolve against the\n   * stage, so vertical offsets track content of varying height while\n   * horizontal ones usually want pixels.\n   */\n  pos: AnnotationOffsets;\n  /**\n   * Nudge the arrow on its own, from wherever `pos` put the note — so you can\n   * stretch the gap between text and arrow, or push the tip onto its target,\n   * without dragging the copy along too. Added to `pos` rather than replacing\n   * it, and it doesn't move the text.\n   *\n   * Percentages resolve against the note, not the stage, because these are\n   * offsets on the child rather than on the positioned note itself. Setting\n   * both `top` and `bottom` (or `left` and `right`) resolves the usual CSS way\n   * — the first of each pair wins.\n   */\n  posArrow?: AnnotationOffsets;\n  /** The same, for the text. Leaves the arrow where it is. */\n  posText?: AnnotationOffsets;\n  /** Degrees of rotation on the note as a whole, for a placed-by-hand feel. */\n  tilt?: number;\n  /** Multiplier on the arrow's length when one needs to reach further. */\n  arrowScale?: number;\n  /**\n   * Degrees of rotation on the arrow alone, leaving the text upright.\n   *\n   * Re-aims an existing curve instead of drawing a new one: `down-left` at 90°\n   * comes in from the top and points right. Rotation is visual only — the\n   * element's layout box doesn't rotate with it, so a re-aimed arrow will\n   * overhang its box and you'll want to re-check `pos`. Composes on top of\n   * `tilt`, which rotates the note and arrow together.\n   */\n  rotate?: number;\n  /** Mirror the arrow left-to-right. Text is untouched. */\n  flipH?: boolean;\n  /** Mirror the arrow top-to-bottom. Text is untouched. */\n  flipV?: boolean;\n}\n\nfunction ScribbleArrow({ variant, offset }: { variant: ArrowVariant; offset?: AnnotationOffsets }) {\n  const arrow = ARROWS[variant];\n  return (\n    <svg\n      className=\"annotation-arrow\"\n      viewBox={arrow.box}\n      fill=\"currentColor\"\n      aria-hidden=\"true\"\n      style={offset}\n    >\n      <path d={arrow.shaft} />\n      <path d={arrow.head} />\n    </svg>\n  );\n}\n\n/**\n * Which edge of the note the arrow hangs off, derived from the variant name so\n * adding a variant needs no CSS. A note sitting left of its target wants the\n * arrow on its right edge and its text ragged-right, and vice versa; the\n * straight-down variants centre instead.\n */\nfunction arrowSide(variant: ArrowVariant): 'left' | 'right' | 'center' {\n  if (variant === 'left' || variant.endsWith('-left')) return 'left';\n  if (variant === 'right' || variant.endsWith('-right')) return 'right';\n  return 'center';\n}\n\nexport interface AnnotationLayerProps extends HTMLAttributes<HTMLDivElement> {\n  annotations: readonly Annotation[];\n}\n\n/**\n * The floating notes, absolutely positioned over a stage.\n *\n * Hidden until the stage is wide enough to hold notes in its margins — below\n * that they would land on top of the content they point at, and\n * {@link AnnotationList} carries the same copy instead. This layer is\n * `aria-hidden`, so the list is what assistive tech reads.\n */\nexport function AnnotationLayer({ annotations, className, ...props }: AnnotationLayerProps) {\n  return (\n    <div className={cn('annotation-layer', className)} aria-hidden=\"true\" {...props}>\n      {annotations.map((note) => (\n        <div\n          key={note.id}\n          className=\"annotation\"\n          data-side={arrowSide(note.arrow)}\n          // Upward arrows sit above the text they belong to, not below it.\n          data-flip={note.arrow.startsWith('up-') ? '' : undefined}\n          style={{\n            ...note.pos,\n            ['--annotation-tilt' as string]: `${note.tilt ?? 0}deg`,\n            ...(note.arrowScale\n              ? { ['--annotation-arrow-scale' as string]: String(note.arrowScale) }\n              : {}),\n            ...(note.rotate\n              ? { ['--annotation-arrow-rotate' as string]: `${note.rotate}deg` }\n              : {}),\n            ...(note.flipH ? { ['--annotation-arrow-flip-x' as string]: '-1' } : {}),\n            ...(note.flipV ? { ['--annotation-arrow-flip-y' as string]: '-1' } : {}),\n          }}\n        >\n          <span className=\"annotation-text\" style={note.posText}>\n            {note.text}\n          </span>\n          <ScribbleArrow variant={note.arrow} offset={note.posArrow} />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport interface AnnotationListProps extends HTMLAttributes<HTMLUListElement> {\n  annotations: readonly Annotation[];\n}\n\n/**\n * Narrow-viewport fallback, and the accessible copy of the annotations — the\n * floating layer is `aria-hidden`, so this is what gets announced.\n */\nexport function AnnotationList({ annotations, className, ...props }: AnnotationListProps) {\n  if (annotations.length === 0) return null;\n  return (\n    <ul className={cn('annotation-list', className)} {...props}>\n      {annotations.map((note) => (\n        <li key={note.id}>{note.text}</li>\n      ))}\n    </ul>\n  );\n}\n\nexport interface AnnotationStageProps extends HTMLAttributes<HTMLDivElement> {\n  annotations: readonly Annotation[];\n  /** The thing being annotated. */\n  children: ReactNode;\n}\n\n/**\n * Wraps annotated content and hosts both renderings of the notes.\n *\n * Two elements, because they hold different things. The inner one is the\n * positioning context the notes' `pos` values resolve against and hugs the\n * content; the outer one carries the consumer's own padding and the list.\n * Notes deliberately overhang the inner box into the surrounding margins.\n *\n * Because that overhang lands in space an *ancestor* owns, whether a note fits\n * is a viewport question, not a stage-width one — see the media query in\n * annotations.css, and re-declare it if your layout is constrained.\n */\nexport function AnnotationStage({\n  annotations,\n  children,\n  className,\n  ...props\n}: AnnotationStageProps) {\n  return (\n    <div className={cn('annotation-stage', className)} {...props}>\n      <div className=\"annotation-stage-inner\">\n        <AnnotationLayer annotations={annotations} />\n        {children}\n      </div>\n      <AnnotationList annotations={annotations} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AAsCO,IAAM,SAA6E;AAAA,EACxF,cAAc;AAAA,IACZ,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,aAAa;AAAA,IACX,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,YAAY;AAAA,IACV,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,WAAW;AAAA,IACT,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,OAAO;AAAA,IACL,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,MAAM;AAAA,IACJ,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,cAAc;AAAA,IACZ,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,kBAAkB;AAAA,IAChB,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,gBAAgB;AAAA,IACd,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,aAAa;AAAA,IACX,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,oBAAoB;AAAA,IAClB,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,gBAAgB;AAAA,IACd,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,aAAa;AAAA,IACX,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,kBAAkB;AAAA,IAChB,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,kBAAkB;AAAA,IAChB,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,aAAa;AAAA,IACX,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,iBAAiB;AAAA,IACf,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,cAAc;AAAA,IACZ,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,mBAAmB;AAAA,IACjB,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,eAAe;AAAA,IACb,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,iBAAiB;AAAA,IACf,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,iBAAiB;AAAA,IACf,KAAK;AAAA,IACL,OACE;AAAA,IACF,MAAM;AAAA,EACR;AACF;;;AC9GI,SAOE,KAPF;AAHJ,SAAS,cAAc,EAAE,SAAS,OAAO,GAA0D;AACjG,QAAM,QAAQ,OAAO,OAAO;AAC5B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,SAAS,MAAM;AAAA,MACf,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,OAAO;AAAA,MAEP;AAAA,4BAAC,UAAK,GAAG,MAAM,OAAO;AAAA,QACtB,oBAAC,UAAK,GAAG,MAAM,MAAM;AAAA;AAAA;AAAA,EACvB;AAEJ;AAQA,SAAS,UAAU,SAAoD;AACrE,MAAI,YAAY,UAAU,QAAQ,SAAS,OAAO,EAAG,QAAO;AAC5D,MAAI,YAAY,WAAW,QAAQ,SAAS,QAAQ,EAAG,QAAO;AAC9D,SAAO;AACT;AAcO,SAAS,gBAAgB,EAAE,aAAa,WAAW,GAAG,MAAM,GAAyB;AAC1F,SACE,oBAAC,SAAI,WAAW,GAAG,oBAAoB,SAAS,GAAG,eAAY,QAAQ,GAAG,OACvE,sBAAY,IAAI,CAAC,SAChB;AAAA,IAAC;AAAA;AAAA,MAEC,WAAU;AAAA,MACV,aAAW,UAAU,KAAK,KAAK;AAAA,MAE/B,aAAW,KAAK,MAAM,WAAW,KAAK,IAAI,KAAK;AAAA,MAC/C,OAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,CAAC,mBAA6B,GAAG,GAAG,KAAK,QAAQ,CAAC;AAAA,QAClD,GAAI,KAAK,aACL,EAAE,CAAC,0BAAoC,GAAG,OAAO,KAAK,UAAU,EAAE,IAClE,CAAC;AAAA,QACL,GAAI,KAAK,SACL,EAAE,CAAC,2BAAqC,GAAG,GAAG,KAAK,MAAM,MAAM,IAC/D,CAAC;AAAA,QACL,GAAI,KAAK,QAAQ,EAAE,CAAC,2BAAqC,GAAG,KAAK,IAAI,CAAC;AAAA,QACtE,GAAI,KAAK,QAAQ,EAAE,CAAC,2BAAqC,GAAG,KAAK,IAAI,CAAC;AAAA,MACxE;AAAA,MAEA;AAAA,4BAAC,UAAK,WAAU,mBAAkB,OAAO,KAAK,SAC3C,eAAK,MACR;AAAA,QACA,oBAAC,iBAAc,SAAS,KAAK,OAAO,QAAQ,KAAK,UAAU;AAAA;AAAA;AAAA,IArBtD,KAAK;AAAA,EAsBZ,CACD,GACH;AAEJ;AAUO,SAAS,eAAe,EAAE,aAAa,WAAW,GAAG,MAAM,GAAwB;AACxF,MAAI,YAAY,WAAW,EAAG,QAAO;AACrC,SACE,oBAAC,QAAG,WAAW,GAAG,mBAAmB,SAAS,GAAI,GAAG,OAClD,sBAAY,IAAI,CAAC,SAChB,oBAAC,QAAkB,eAAK,QAAf,KAAK,EAAe,CAC9B,GACH;AAEJ;AAoBO,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAyB;AACvB,SACE,qBAAC,SAAI,WAAW,GAAG,oBAAoB,SAAS,GAAI,GAAG,OACrD;AAAA,yBAAC,SAAI,WAAU,0BACb;AAAA,0BAAC,mBAAgB,aAA0B;AAAA,MAC1C;AAAA,OACH;AAAA,IACA,oBAAC,kBAAe,aAA0B;AAAA,KAC5C;AAEJ;","names":[]}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@flopay/ui",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "type": "module",
-  "packageManager": "pnpm@9.15.0",
+  "packageManager": "pnpm@11.17.0",
   "description": "FloPay shared design system — design tokens, a Tailwind v4 preset, and React primitives shared across landing, demo, docs, and dashboard.",
   "license": "UNLICENSED",
   "publishConfig": {
@@ -27,12 +27,18 @@
       "import": "./dist/marketing/index.mjs",
       "require": "./dist/marketing/index.cjs"
     },
+    "./annotations": {
+      "types": "./dist/annotations/index.d.ts",
+      "import": "./dist/annotations/index.mjs",
+      "require": "./dist/annotations/index.cjs"
+    },
     "./styles": "./styles/index.css",
     "./styles/index.css": "./styles/index.css",
     "./styles/tokens.css": "./styles/tokens.css",
     "./styles/reset.css": "./styles/reset.css",
     "./styles/components.css": "./styles/components.css",
     "./styles/preset.css": "./styles/preset.css",
+    "./styles/annotations.css": "./styles/annotations.css",
     "./logo.png": "./assets/logo.png",
     "./package.json": "./package.json"
   },
@@ -68,10 +74,10 @@
     "tailwind-merge": "^3.6.0"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.4.15",
+    "@biomejs/biome": "^2.5.3",
     "@types/react": "^19.2.15",
     "@types/react-dom": "^19.2.3",
-    "next": "^16.2.6",
+    "next": "^16.2.10",
     "react": "^19.2.6",
     "react-dom": "^19.2.6",
     "tsup": "^8.3.0",

package/styles/annotations.css

@@ -0,0 +1,124 @@
+/* @flopay/ui — hand-drawn annotation layer.
+ *
+ * Marker-style notes and arrows drawn over a UI, for guided demos and product
+ * tours. Opt-in, since the arrow geometry is a few KB that most pages don't
+ * need:
+ *
+ *   @import "@flopay/ui/styles/annotations.css";
+ *
+ * Backs the components exported from `@flopay/ui/annotations`, and depends on
+ * tokens.css custom properties. */
+
+:root {
+  /* Brand blue by default, in a handwriting face, so notes read as marker over
+     the UI rather than as part of it. Override either per app. */
+  --annotation-ink: var(--brand);
+  --annotation-font: 'Bradley Hand', 'Segoe Print', 'Chalkboard SE', 'Comic Sans MS', cursive;
+}
+
+.annotation-stage {
+  width: 100%;
+}
+
+/* The positioning context for `pos`. Notes overhang it into the outer stage. */
+.annotation-stage-inner {
+  position: relative;
+}
+
+/* ── Narrow: the notes as a plain list under the content ── */
+.annotation-layer {
+  display: none;
+}
+
+.annotation-list {
+  max-width: 420px;
+  margin: 18px auto 0;
+  padding-top: 14px;
+  border-top: 1px dashed var(--border-hover);
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 7px;
+  font-family: var(--annotation-font);
+  font-size: 16px;
+  line-height: 1.45;
+  color: var(--annotation-ink);
+}
+
+.annotation-list li::before {
+  content: '→ ';
+  opacity: 0.7;
+}
+
+/* ── Wide: notes float around the content ──
+   Notes overhang the stage into the surrounding margins, so what matters is
+   the room *around* the content — which belongs to an ancestor the package
+   doesn't own. A container query on the stage would measure the content box
+   instead and never match. Hence a viewport query.
+   1120px is where a ~720px content box has room for 200px notes either side.
+   An app in a constrained layout (a sidebar, a split view) should re-declare
+   this one block at its own breakpoint; a custom property can't be used in a
+   media condition. */
+@media (min-width: 1120px) {
+  .annotation-layer {
+    display: block;
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    /* Above the content so an arrow tip can cross onto its target rather than
+       stopping at the edge. */
+    z-index: 2;
+  }
+
+  .annotation-list {
+    display: none;
+  }
+
+  .annotation {
+    position: absolute;
+    width: 200px;
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+    transform: rotate(var(--annotation-tilt, 0deg));
+    font-family: var(--annotation-font);
+    font-size: 18px;
+    line-height: 1.3;
+    color: var(--annotation-ink);
+  }
+
+  /* Arrow above the text for upward variants, below it otherwise. */
+  .annotation[data-flip] {
+    flex-direction: column-reverse;
+  }
+
+  /* Text rags toward whatever the arrow points at. */
+  .annotation[data-side='right'] { text-align: right; }
+  .annotation[data-side='left'] { text-align: left; }
+  .annotation[data-side='center'] { text-align: center; }
+
+  /* `position: relative` on both halves is what lets `posText` / `posArrow`
+     nudge one without the other. Offsets shift them off the spot `pos` put
+     them, leaving the flex layout — and therefore each other — undisturbed. */
+  .annotation-text {
+    position: relative;
+  }
+
+  /* `--annotation-arrow-rotate` re-aims the curve and the flips mirror it, so
+     one drawing covers several approach directions without a new curve. Those
+     are visual only — the layout box stays put, which is why a re-aimed arrow
+     overhangs it. Scale sits to the right of rotate so it applies first: you
+     pick the mirrored shape, then aim it. */
+  .annotation-arrow {
+    position: relative;
+    width: calc(160px * var(--annotation-arrow-scale, 1));
+    height: auto;
+    opacity: 0.9;
+    transform: rotate(var(--annotation-arrow-rotate, 0deg))
+      scale(var(--annotation-arrow-flip-x, 1), var(--annotation-arrow-flip-y, 1));
+  }
+
+  .annotation[data-side='right'] .annotation-arrow { align-self: flex-end; }
+  .annotation[data-side='left'] .annotation-arrow { align-self: flex-start; }
+  .annotation[data-side='center'] .annotation-arrow { align-self: center; }
+}