@ugfoundation/swaralipi-js 0.2.1 → 0.3.1

package/dist/viewer/index.cjs

@@ -11,6 +11,30 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+
+// src/spec/taals.ts
+var TAALS;
+var init_taals = __esm({
+  "src/spec/taals.ts"() {
+    TAALS = {
+      dadra: { id: "dadra", numBeats: 6, bhaags: [3, 3], sam: 0, khaali: [3] },
+      kehrwa: { id: "kehrwa", numBeats: 8, bhaags: [4, 4], sam: 0, khaali: [4] },
+      rupak: { id: "rupak", numBeats: 7, bhaags: [3, 2, 2], sam: 0, khaali: [0] },
+      jhaptaal: { id: "jhaptaal", numBeats: 10, bhaags: [2, 3, 2, 3], sam: 0, khaali: [5] },
+      ektaal: { id: "ektaal", numBeats: 12, bhaags: [2, 2, 2, 2, 2, 2], sam: 0, khaali: [2, 6] },
+      adachautaal: { id: "adachautaal", numBeats: 14, sam: 0 },
+      choutaal: { id: "choutaal", numBeats: 12, bhaags: [2, 2, 2, 2, 2, 2], sam: 0, khaali: [2, 6] },
+      // চৌতাল
+      shashthi: { id: "shashthi", numBeats: 6, bhaags: [2, 4], sam: 0 },
+      // ষষ্ঠী
+      teora: { id: "teora", numBeats: 7, bhaags: [3, 2, 2], sam: 0 },
+      // টেওরা
+      teentaal: { id: "teentaal", numBeats: 16, bhaags: [4, 4, 4, 4], sam: 0, khaali: [8] },
+      aratheka: { id: "aratheka", numBeats: 16, bhaags: [4, 4, 4, 4], sam: 0, khaali: [8] }
+      // আড়াঠেকা
+    };
+  }
+});
 var octaveSchema, svaraLetterSchema, svaraSchema, microtoneSchema, barSchema, bracketSchema, noteSchema, rowSchema, partSchema, taalSchema, metaSchema, swaralipiSchema;
 var init_schema = __esm({
   "src/spec/schema.ts"() {
@@ -123,30 +147,6 @@ var init_schema = __esm({
   }
 });
 
-// src/spec/taals.ts
-var TAALS;
-var init_taals = __esm({
-  "src/spec/taals.ts"() {
-    TAALS = {
-      dadra: { id: "dadra", numBeats: 6, bhaags: [3, 3], sam: 0, khaali: [3] },
-      kehrwa: { id: "kehrwa", numBeats: 8, bhaags: [4, 4], sam: 0, khaali: [4] },
-      rupak: { id: "rupak", numBeats: 7, bhaags: [3, 2, 2], sam: 0, khaali: [0] },
-      jhaptaal: { id: "jhaptaal", numBeats: 10, bhaags: [2, 3, 2, 3], sam: 0, khaali: [5] },
-      ektaal: { id: "ektaal", numBeats: 12, bhaags: [2, 2, 2, 2, 2, 2], sam: 0, khaali: [2, 6] },
-      adachautaal: { id: "adachautaal", numBeats: 14, sam: 0 },
-      choutaal: { id: "choutaal", numBeats: 12, bhaags: [2, 2, 2, 2, 2, 2], sam: 0, khaali: [2, 6] },
-      // চৌতাল
-      shashthi: { id: "shashthi", numBeats: 6, bhaags: [2, 4], sam: 0 },
-      // ষষ্ঠী
-      teora: { id: "teora", numBeats: 7, bhaags: [3, 2, 2], sam: 0 },
-      // টেওরা
-      teentaal: { id: "teentaal", numBeats: 16, bhaags: [4, 4, 4, 4], sam: 0, khaali: [8] },
-      aratheka: { id: "aratheka", numBeats: 16, bhaags: [4, 4, 4, 4], sam: 0, khaali: [8] }
-      // আড়াঠেকা
-    };
-  }
-});
-
 // src/spec/index.ts
 var spec_exports = {};
 __export(spec_exports, {
@@ -179,7 +179,7 @@ var init_spec = __esm({
     init_schema();
     init_schema();
     init_taals();
-    SPEC_VERSION = "0.2.1";
+    SPEC_VERSION = "0.3.1";
   }
 });
 
@@ -221,9 +221,9 @@ var MARKS = {
   en: { hyphen: "-", melisma: "\xB7", cut: ":" }
 };
 var LABELS = {
-  bn: { title: "\u09A8\u09BE\u09AE", taal: "\u09A4\u09BE\u09B2", raag: "\u09B0\u09BE\u0997", avartan: "\u0986\u09AC\u09B0\u09CD\u09A4\u09A8", notationBy: "\u09B8\u09CD\u09AC\u09B0\u09B2\u09BF\u09AA\u09BF" },
-  hi: { title: "\u0928\u093E\u092E", taal: "\u0924\u093E\u0932", raag: "\u0930\u093E\u0917", avartan: "\u0906\u0935\u0930\u094D\u0924\u0928", notationBy: "\u0938\u094D\u0935\u0930\u0932\u093F\u092A\u093F" },
-  en: { title: "Song", taal: "Taal", raag: "Raag", avartan: "Avartan", notationBy: "Notation" }
+  bn: { title: "\u09A8\u09BE\u09AE", taal: "\u09A4\u09BE\u09B2", raag: "\u09B0\u09BE\u0997", avartan: "\u0986\u09AC\u09B0\u09CD\u09A4\u09A8", notationBy: "\u09B8\u09CD\u09AC\u09B0\u09B2\u09BF\u09AA\u09BF\u0995\u09BE\u09B0" },
+  hi: { title: "\u0928\u093E\u092E", taal: "\u0924\u093E\u0932", raag: "\u0930\u093E\u0917", avartan: "\u0906\u0935\u0930\u094D\u0924\u0928", notationBy: "\u0938\u094D\u0935\u0930\u0932\u093F\u092A\u093F\u0915\u093E\u0930" },
+  en: { title: "Song", taal: "Taal", raag: "Raag", avartan: "Avartan", notationBy: "Notator" }
 };
 function composeCluster(letter, opts) {
   const classes = [];
@@ -506,21 +506,24 @@ function renderRow(row, partIdx, rowIdx, ctx) {
   return `<div class="sw-row">${label}<div class="sw-grid">${above.join("")}${notation.join("")}${below.join("")}${lyric.join("")}</div></div>`;
 }
 function renderHeader(meta, ctx) {
-  const L = LABELS[ctx.lang];
+  return renderMetaHeader(meta, ctx.lang, ctx.tr);
+}
+function renderMetaHeader(meta, lang, tr = (s) => s) {
+  const L = LABELS[lang];
   const rows = [];
   const add = (label, value) => rows.push(
     `<div class="sw-meta-row"><span class="sw-meta-label">${escapeHtml(label)}</span><span class="sw-meta-value">${escapeHtml(value)}</span></div>`
   );
-  add(L.title, ctx.tr(meta.title));
+  add(L.title, tr(meta.title));
   const taal = meta.taalName ?? meta.taal?.id;
-  if (taal !== void 0) add(L.taal, ctx.tr(taal));
-  if (meta.raag !== void 0) add(L.raag, ctx.tr(meta.raag));
-  if (meta.avartan !== void 0) add(L.avartan, localizeDigits(String(meta.avartan), ctx.lang));
-  if (meta.notationBy !== void 0) add(L.notationBy, ctx.tr(meta.notationBy));
+  if (taal !== void 0) add(L.taal, tr(taal));
+  if (meta.raag !== void 0) add(L.raag, tr(meta.raag));
+  if (meta.avartan !== void 0) add(L.avartan, localizeDigits(String(meta.avartan), lang));
+  if (meta.notationBy !== void 0) add(L.notationBy, tr(meta.notationBy));
   return `<header class="sw-header">${rows.join("")}</header>`;
 }
 function renderToHtml(doc, opts = {}) {
-  const lang = opts.lang ?? "bn";
+  const lang = opts.lang === "hi" || opts.lang === "en" ? opts.lang : "bn";
   const tr = lang !== "bn" && opts.transliterate ? opts.transliterate : (s) => s;
   const ctx = { lang, marks: MARKS[lang], tr };
   const out = [`<div class="sw-sheet" lang="${lang}">`];
@@ -538,9 +541,9 @@ function renderToHtml(doc, opts = {}) {
 
 // src/viewer/styles.ts
 var NOTATION_FONT_URLS = {
-  Swarabitan: "https://cdn.daserve.in/webfonts/swarabitan/Swarabitan.ttf",
-  ome_bhatkhande_hindi: "https://cdn.daserve.in/webfonts/ome-bhatkhande/OmeBhatkhandeHindi.ttf",
-  ome_bhatkhande_english: "https://cdn.daserve.in/webfonts/ome-bhatkhande/OmeBhatkhandeEnglish.ttf"
+  Swarabitan: "https://webfonts-4qq.pages.dev/swarabitan/Swarabitan.ttf",
+  ome_bhatkhande_hindi: "https://webfonts-4qq.pages.dev/ome-bhatkhande/OmeBhatkhandeHindi.ttf",
+  ome_bhatkhande_english: "https://webfonts-4qq.pages.dev/ome-bhatkhande/OmeBhatkhandeEnglish.ttf"
 };
 NOTATION_FONT_URLS.Swarabitan;
 var FONT_FACES = Object.entries(NOTATION_FONT_URLS).map(
@@ -690,6 +693,9 @@ ${FONT_FACES}
 
 /* ---- player sync (P2.3) ---- */
 .sw-hl { background: var(--sw-hl, rgba(255, 196, 64, 0.45)); border-radius: 0.15em; }
+/* Staff notes are SVG <g> \u2014 background doesn't paint there, so recolour the
+   glyph fill/stroke instead (abcjs draws note heads/stems as filled paths). */
+.sw-staff .sw-hl, .sw-staff .sw-hl * { fill: var(--sw-hl-note, #d68400); stroke: var(--sw-hl-note, #d68400); }
 
 /* ---- element error box ---- */
 .sw-error {
@@ -705,27 +711,500 @@ ${FONT_FACES}
 var SWARALIPI_PRINT_CSS = `
 @page { margin: 16mm; }
 @media print {
-  .sw-sheet { -webkit-print-color-adjust: exact; print-color-adjust: exact; color: #000; }
+  .sw-sheet, .sw-staff { -webkit-print-color-adjust: exact; print-color-adjust: exact; color: #000; }
   .sw-row { overflow: visible !important; break-inside: avoid; page-break-inside: avoid; }
   .sw-part { break-inside: auto; }
   .sw-part-name, .sw-header { break-after: avoid-page; page-break-after: avoid; }
   .sw-hl { background: none !important; }
+  /* Keep each engraved staff system whole across a page break (the abcjs line
+     is a <div> wrapping the <svg>, so the break rule must sit on the div). */
+  .sw-staff-lines > div { break-inside: avoid; page-break-inside: avoid; }
+  .sw-staff-meta { break-after: avoid-page; page-break-after: avoid; }
 }
 `;
+var SWARALIPI_STAFF_CSS = `
+.sw-staff { color: currentColor; }
+.sw-staff-meta { display: flex; gap: 1.25em; align-items: baseline; margin: 0 0 .5em; font-size: .95em; opacity: .85; }
+.sw-staff-instrument { font-weight: 600; }
+.sw-staff-drums { opacity: .75; }
+.sw-staff-tempo { font-variant-numeric: tabular-nums; }
+/* abcjs (oneSvgPerLine) wraps the music into one <div><svg> per system; stack
+   them as short, swaralipi-style lines. abcjs sets a fixed pixel height +
+   overflow:hidden on each wrapper div \u2014 neutralise it so the viewBox'd SVG can
+   scale to the container (and to the print page) instead of being clipped. */
+.sw-staff-lines > div { margin: 0 0 .35em; height: auto !important; overflow: visible !important; }
+/* Fill up to the engraved (staffwidth) size \u2014 shrink to fit a narrow container,
+   but never stretch past natural width (abcToSvg pins per-SVG max-width in px),
+   else a short last system balloons. */
+.sw-staff-lines svg { display: block; width: 100%; height: auto; }
+.sw-staff-missing { padding: 1em; border: 1px dashed currentColor; border-radius: 6px; opacity: .8; font-size: .9em; }
+.sw-staff-title { font-size: 1.15em; font-weight: 700; }
+.sw-staff-subtitle { opacity: .8; font-size: .95em; margin-top: .15em; }
+`;
+
+// src/player/pitch.ts
+var OCTAVE_OFFSET = {
+  "ati-mandra": -2,
+  mandra: -1,
+  madhyam: 0,
+  taar: 1,
+  "ati-taar": 2
+};
+var SHUDDHA = {
+  s: 0,
+  r: 2,
+  g: 4,
+  m: 5,
+  p: 7,
+  d: 9,
+  n: 11
+};
+var SHARP_NAMES = ["C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B"];
+var PITCH_CLASS = {
+  c: 0,
+  "c#": 1,
+  db: 1,
+  d: 2,
+  "d#": 3,
+  eb: 3,
+  e: 4,
+  "e#": 5,
+  fb: 4,
+  f: 5,
+  "f#": 6,
+  gb: 6,
+  g: 7,
+  "g#": 8,
+  ab: 8,
+  a: 9,
+  "a#": 10,
+  bb: 10,
+  b: 11,
+  "b#": 0,
+  cb: 11
+};
+function parseTonic(tonic) {
+  if (!tonic) return 0;
+  const key = tonic.trim().toLowerCase().replace(/s/g, "#");
+  return PITCH_CLASS[key] ?? 0;
+}
+function svaraSemitone(note) {
+  if (note.svara === void 0) return null;
+  const [, letter] = note.svara;
+  let semi = SHUDDHA[letter];
+  if (note.komal === true || note.microtone !== void 0) semi -= 1;
+  if (note.tivra === true) semi += 1;
+  return semi;
+}
+function svaraToMidi(note, tonicPc, baseOctave = 4) {
+  const semi = svaraSemitone(note);
+  if (semi === null || note.svara === void 0) return null;
+  const [octave] = note.svara;
+  return (baseOctave + 1 + OCTAVE_OFFSET[octave]) * 12 + tonicPc + semi;
+}
+function kanToMidi(svara, tonicPc, baseOctave = 4) {
+  if (svara === void 0) return null;
+  const [octave, letter] = svara;
+  return (baseOctave + 1 + OCTAVE_OFFSET[octave]) * 12 + tonicPc + SHUDDHA[letter];
+}
+function midiToSampleName(midi) {
+  const pc = (midi % 12 + 12) % 12;
+  const octave = Math.floor(midi / 12) - 1;
+  return `${SHARP_NAMES[pc]}${octave}`;
+}
+function sampleFileName(midi) {
+  return midiToSampleName(midi).toLowerCase().replace("#", "s");
+}
+
+// src/player/schedule.ts
+var isSilent = (n) => n.svara === void 0 && n.rest !== true && n.sustain !== true;
+function buildSchedule(doc, opts = {}) {
+  const tonicPc = parseTonic(opts.tonic ?? doc.meta.tonic);
+  const baseOctave = opts.baseOctave ?? 4;
+  const events = [];
+  let cursor = 0;
+  let lastPitched = -1;
+  doc.parts.forEach((part, p) => {
+    part.rows.forEach((row, r) => {
+      row.notes.forEach((note, i) => {
+        if (note.bar !== void 0 || isSilent(note)) return;
+        const path = `${p}.${r}.${i}`;
+        const dur = note.durationMatra ?? 1;
+        if (note.svara !== void 0) {
+          events.push({
+            beat: cursor,
+            durationBeats: dur,
+            midi: svaraToMidi(note, tonicPc, baseOctave),
+            kan: kanToMidi(note.kan, tonicPc, baseOctave),
+            path,
+            kind: note.sustain === true ? "sustain" : "note"
+          });
+          lastPitched = events.length - 1;
+        } else if (note.sustain === true) {
+          if (lastPitched >= 0) events[lastPitched].durationBeats += dur;
+          events.push({ beat: cursor, durationBeats: dur, midi: null, kan: null, path, kind: "sustain" });
+        } else {
+          events.push({ beat: cursor, durationBeats: dur, midi: null, kan: null, path, kind: "rest" });
+        }
+        cursor += dur;
+      });
+    });
+  });
+  return { events, totalBeats: cursor };
+}
+
+// src/viewer/staff.ts
+init_taals();
+
+// src/player/instruments.ts
+init_taals();
+function keyMap(keys) {
+  const m = {};
+  for (const k of keys) m[k] = `${k.replace("#", "s")}.mp3`;
+  return m;
+}
+var PIANO_KEYS = [
+  "A0",
+  "C1",
+  "D#1",
+  "F#1",
+  "A1",
+  "C2",
+  "D#2",
+  "F#2",
+  "A2",
+  "C3",
+  "D#3",
+  "F#3",
+  "A3",
+  "C4",
+  "D#4",
+  "F#4",
+  "A4",
+  "C5",
+  "D#5",
+  "F#5",
+  "A5",
+  "C6",
+  "D#6",
+  "F#6",
+  "A6",
+  "C7",
+  "D#7",
+  "F#7",
+  "A7",
+  "C8"
+];
+var HARMONIUM_KEYS = [
+  "C2",
+  "C#2",
+  "D2",
+  "D#2",
+  "E2",
+  "F2",
+  "F#2",
+  "G2",
+  "G#2",
+  "A2",
+  "A#2",
+  "C3",
+  "C#3",
+  "D3",
+  "D#3",
+  "E3",
+  "F3",
+  "F#3",
+  "G3",
+  "G#3",
+  "A3",
+  "A#3",
+  "C4",
+  "C#4",
+  "D4",
+  "D#4",
+  "E4",
+  "F4",
+  "F#4",
+  "G4",
+  "G#4",
+  "A4",
+  "A#4",
+  "C5",
+  "C#5",
+  "D5"
+];
+var VIOLIN_KEYS = ["A3", "C4", "E4", "G4", "A4", "C5", "E5", "G5", "A5", "C6", "E6", "G6", "A6", "C7"];
+var FLUTE_KEYS = ["C4", "E4", "A4", "C5", "E5", "A5", "C6", "E6", "A6", "C7"];
+({
+  piano: { urls: keyMap(PIANO_KEYS)},
+  santoor: { urls: santoorUrls()},
+  harmonium: { urls: keyMap(HARMONIUM_KEYS)},
+  violin: { urls: keyMap(VIOLIN_KEYS)},
+  flute: { urls: keyMap(FLUTE_KEYS)}
+});
+new Set(
+  Object.keys(TAALS)
+);
+Array.from({ length: 17 }, (_, i) => 60 + i * 15);
+function santoorUrls() {
+  const urls = {};
+  const add = (midi) => {
+    const stem = sampleFileName(midi);
+    const name = stem.replace("s", "#").replace(/^(.)/, (c) => c.toUpperCase());
+    urls[name] = `${stem}.mp3`;
+  };
+  for (let midi = 60; midi <= 95; midi++) add(midi);
+  add(96);
+  return urls;
+}
+function drumPattern(taal) {
+  const n = taal.numBeats;
+  const sam = taal.sam ?? 0;
+  const khaali = new Set(taal.khaali ?? []);
+  const bhaags = taal.bhaags ?? [n];
+  const pattern = new Array(n).fill("hihat");
+  let pos = 0;
+  for (const len of bhaags) {
+    pattern[pos] = khaali.has(pos) ? "hihat" : "snare";
+    pos += len;
+  }
+  pattern[sam] = "kick";
+  return pattern;
+}
+
+// src/viewer/staff.ts
+var ABC_SHARP = ["C", "^C", "D", "^D", "E", "F", "^F", "G", "^G", "A", "^A", "B"];
+function midiToAbc(midi) {
+  const pc = (midi % 12 + 12) % 12;
+  const octave = Math.floor(midi / 12) - 1;
+  const token = ABC_SHARP[pc];
+  const acc = token[0] === "^" ? "^" : "";
+  const letter = acc ? token[1] : token[0];
+  return octave >= 5 ? acc + letter.toLowerCase() + "'".repeat(octave - 5) : acc + letter + ",".repeat(4 - octave);
+}
+function abcDuration(beats) {
+  if (Math.abs(beats - 1) < 1e-6) return "";
+  if (Math.abs(beats - Math.round(beats)) < 1e-6) return String(Math.round(beats));
+  const inv = 1 / beats;
+  if (Math.abs(inv - Math.round(inv)) < 1e-6) return `/${Math.round(inv)}`;
+  const sixteenths = Math.max(1, Math.round(beats * 4));
+  return `${sixteenths}/4`;
+}
+function abcNote(ev) {
+  const grace = ev.kan !== null ? `{${midiToAbc(ev.kan)}}` : "";
+  return `${grace}${midiToAbc(ev.midi)}${abcDuration(ev.durationBeats)}`;
+}
+function eventPaths(schedule) {
+  const paths = [];
+  for (const ev of schedule.events) {
+    if (ev.midi !== null || ev.kind === "rest") paths.push(ev.path);
+  }
+  return paths;
+}
+function abcText(s) {
+  return s.replace(/[\r\n]+/g, " ").trim();
+}
+function buildAbc(schedule, lyricOf, opts) {
+  const beatsPerBar = opts.beatsPerBar > 0 ? opts.beatsPerBar : 4;
+  const tokens = [];
+  const words = [];
+  let barPos = 0;
+  const EPS2 = 1e-6;
+  const advance = (dur) => {
+    barPos += dur;
+    while (barPos >= beatsPerBar - EPS2) {
+      tokens.push("|");
+      words.push("|");
+      barPos -= beatsPerBar;
+    }
+  };
+  for (const ev of schedule.events) {
+    if (ev.midi === null) {
+      if (ev.kind === "rest") {
+        tokens.push(`z${abcDuration(ev.durationBeats)}`);
+        words.push("*");
+        advance(ev.durationBeats);
+      }
+      continue;
+    }
+    tokens.push(abcNote(ev));
+    const lyr = lyricOf(ev);
+    words.push(lyr ? abcText(lyr).replace(/\s+/g, "~") : "*");
+    advance(ev.durationBeats);
+  }
+  if (tokens.length && tokens[tokens.length - 1] !== "|") tokens.push("|]");
+  else if (tokens.length) tokens[tokens.length - 1] = "|]";
+  const meter = ratioMeter(beatsPerBar);
+  const head = ["X:1", `M:${meter}`, "L:1/4", `Q:1/4=${Math.round(opts.bpm)}`];
+  if (opts.drums) head.push(...percMapLines(opts.drums));
+  head.push("K:C treble");
+  const melodyBody = tokens.length ? tokens.join(" ") : "z |]";
+  const lines = [...head];
+  if (opts.drums) {
+    lines.push("V:1", melodyBody);
+    if (opts.lyrics && words.some((w) => w !== "*" && w !== "|")) lines.push(`w: ${words.join(" ")}`);
+    lines.push("V:2 clef=perc stem=up", buildDrumVoice(schedule.totalBeats, beatsPerBar, opts.drums));
+  } else {
+    lines.push(melodyBody);
+    if (opts.lyrics && words.some((w) => w !== "*" && w !== "|")) lines.push(`w: ${words.join(" ")}`);
+  }
+  return lines.join("\n");
+}
+function ratioMeter(beats) {
+  return `${Math.max(1, Math.round(beats))}/4`;
+}
+var DRUM_ABC = {
+  kick: { note: "F,", gm: "bass-drum-1" },
+  snare: { note: "C", gm: "acoustic-snare" },
+  hihat: { note: "g", gm: "closed-hi-hat" },
+  tom1: { note: "E", gm: "high-tom" },
+  tom2: { note: "A,", gm: "low-mid-tom" },
+  tom3: { note: "D,", gm: "low-floor-tom" }
+};
+function percMapLines(voices) {
+  const seen = /* @__PURE__ */ new Set();
+  const lines = [];
+  for (const v of voices) {
+    if (seen.has(v)) continue;
+    seen.add(v);
+    const { note, gm } = DRUM_ABC[v];
+    lines.push(`%%percmap ${note} ${gm}`);
+  }
+  return lines;
+}
+function buildDrumVoice(totalBeats, beatsPerBar, pattern) {
+  const n = Math.max(1, Math.ceil(totalBeats));
+  const tokens = [];
+  for (let beat = 0; beat < n; beat++) {
+    tokens.push(DRUM_ABC[pattern[beat % pattern.length]].note);
+    if ((beat + 1) % beatsPerBar === 0) tokens.push("|");
+  }
+  if (tokens.length === 0 || tokens[tokens.length - 1] !== "|") tokens.push("|]");
+  else tokens[tokens.length - 1] = "|]";
+  return tokens.join(" ");
+}
+function lyricLookup(doc) {
+  return (ev) => {
+    const [p, r, i] = ev.path.split(".").map(Number);
+    return doc.parts[p]?.rows[r]?.notes[i]?.lyric;
+  };
+}
+function resolveDrumTaal(doc) {
+  const id = doc.meta.taal?.id;
+  return id !== void 0 && id in TAALS ? TAALS[id] : { numBeats: 4, sam: 0 };
+}
+function docToAbc(doc, opts = {}) {
+  const schedule = buildSchedule(doc, { tonic: opts.tonic, baseOctave: opts.baseOctave });
+  const bpm = opts.bpm ?? doc.meta.bpm ?? 90;
+  const beatsPerBar = opts.beatsPerBar ?? doc.meta.taal?.numBeats ?? 4;
+  const drums = opts.drums ? drumPattern(resolveDrumTaal(doc)) : void 0;
+  return buildAbc(schedule, lyricLookup(doc), { bpm, lyrics: opts.lyrics !== false, beatsPerBar, drums });
+}
+async function abcToSvg(abc, opts = {}, notePaths) {
+  if (typeof document === "undefined") {
+    throw new Error("abcToSvg requires a DOM; render staff notation in the browser or print iframe");
+  }
+  let ABCJS;
+  try {
+    const mod = await import('abcjs');
+    ABCJS = mod.default ?? mod;
+  } catch {
+    return `<div class="sw-staff-missing">Staff notation needs the optional <code>abcjs</code> package.</div>`;
+  }
+  const host = document.createElement("div");
+  host.style.cssText = "position:fixed; left:-10000px; top:0; width:720px; visibility:hidden;";
+  const mount = document.body ?? document.documentElement;
+  mount.appendChild(host);
+  try {
+    ABCJS.renderAbc(host, abc, {
+      add_classes: true,
+      staffwidth: opts.staffwidth ?? 680,
+      scale: opts.scale ?? 1,
+      // Reflow into short lines. staffwidth is the width budget;
+      // preferredMeasuresPerLine keeps systems swaralipi-short.
+      // (Not `responsive: resize` — its absolute-positioned aspect-ratio wrapper
+      // overlaps the header and mis-sizes on the print page.)
+      wrap: { minSpacing: 1.8, maxSpacing: 2.7, preferredMeasuresPerLine: opts.measuresPerLine ?? 4 },
+      // CRUCIAL: put each wrapped system in its OWN <svg> (default is all systems
+      // stacked in one tall SVG, which is atomic and can't page-break — that was
+      // the near-blank-first-page / mid-staff-cutoff print bug). One SVG per line
+      // lets `break-inside: avoid` keep each staff whole while pages fill.
+      oneSvgPerLine: true
+    });
+    for (const svg of host.querySelectorAll("svg")) {
+      const w = parseFloat(svg.getAttribute("width") ?? "");
+      const h = parseFloat(svg.getAttribute("height") ?? "");
+      if (w > 0 && h > 0) {
+        if (!svg.getAttribute("viewBox")) svg.setAttribute("viewBox", `0 0 ${w} ${h}`);
+        svg.setAttribute("preserveAspectRatio", "xMinYMin meet");
+        svg.removeAttribute("width");
+        svg.removeAttribute("height");
+        svg.setAttribute("style", `max-width:${w}px`);
+      }
+    }
+    if (notePaths) {
+      const melody = host.querySelectorAll(".abcjs-v0.abcjs-note, .abcjs-v0.abcjs-rest");
+      let i = 0;
+      for (const el of melody) {
+        const path = notePaths[i++];
+        if (path !== void 0) el.setAttribute("data-note", path);
+      }
+    }
+    return host.innerHTML;
+  } finally {
+    host.remove();
+  }
+}
+async function renderStaffHtml(doc, opts = {}) {
+  const bpm = opts.bpm ?? doc.meta.bpm ?? 90;
+  const abc = docToAbc(doc, { ...opts, bpm });
+  const schedule = buildSchedule(doc, { tonic: opts.tonic, baseOctave: opts.baseOctave });
+  const engraved = await abcToSvg(abc, opts, eventPaths(schedule));
+  const lines = engraved.includes("sw-staff-missing") ? engraved : `<div class="sw-staff-lines">${engraved}</div>`;
+  const header = opts.showHeader === false ? "" : renderMetaHeader(doc.meta, opts.headerLang ?? "en", opts.transliterate);
+  const metaParts = [];
+  if (opts.instrument) metaParts.push(`<span class="sw-staff-instrument">${escapeAttr(opts.instrument)}</span>`);
+  if (opts.drums) metaParts.push(`<span class="sw-staff-drums">+ drums</span>`);
+  const meta = metaParts.length ? `<div class="sw-staff-meta">${metaParts.join("")}</div>` : "";
+  return `<div class="sw-staff">${header}${meta}${lines}</div>`;
+}
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
 
 // src/viewer/print.ts
+var DEFAULT_WATERMARK = "www.gitabitan.io";
+var DEFAULT_NOTATOR = "gitabitan.io Team";
 function escapeHtml2(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
-function renderPrintDocument(doc, opts = {}) {
-  const lang = opts.lang ?? "bn";
-  const tr = lang !== "bn" && opts.transliterate ? opts.transliterate : (s) => s;
-  const title = opts.title ?? tr(doc.meta.title);
-  const body = renderToHtml(doc, {
-    lang,
-    showHeader: opts.showHeader,
-    transliterate: opts.transliterate
-  });
+function watermarkCss(text) {
+  if (!text) return "";
+  return `
+.sw-watermark {
+  position: fixed; inset: 0; z-index: 0; pointer-events: none;
+  display: flex; align-items: center; justify-content: center;
+  overflow: hidden;
+  -webkit-print-color-adjust: exact; print-color-adjust: exact;
+}
+.sw-watermark span {
+  font-size: 11vw; font-weight: 700; letter-spacing: .08em;
+  color: rgba(0,0,0,0.07); transform: rotate(-35deg); white-space: nowrap;
+}
+body > .sw-sheet, body > .sw-footer { position: relative; z-index: 1; }
+`;
+}
+function chrome(text, notator) {
+  const top = text ? `<div class="sw-watermark" aria-hidden="true"><span>${escapeHtml2(text)}</span></div>` : "";
+  const bottom = notator ? `<footer class="sw-footer">${escapeHtml2(notator)}</footer>` : "";
+  return { top, bottom };
+}
+function resolveNotator(doc, opts) {
+  return doc.meta.notationBy ?? opts.notator ?? DEFAULT_NOTATOR;
+}
+function pageHtml(lang, title, bodyHtml, opts, doc) {
+  const watermark = opts.watermark ?? DEFAULT_WATERMARK;
+  const { top, bottom } = chrome(watermark, resolveNotator(doc, opts));
   return `<!doctype html>
 <html lang="${escapeHtml2(lang)}">
 <head>
@@ -734,20 +1213,42 @@ function renderPrintDocument(doc, opts = {}) {
 <title>${escapeHtml2(title)}</title>
 <style>
 ${SWARALIPI_CSS}
+${SWARALIPI_STAFF_CSS}
 ${SWARALIPI_PRINT_CSS}
+${watermarkCss(watermark)}
 html, body { margin: 0; }
 body { color: #111; background: #fff; padding: 16px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
 .sw-sheet { max-width: 100%; }
+.sw-footer { margin-top: 12px; padding-top: 6px; border-top: 1px solid #ddd; font-size: 12px; color: #555; text-align: right; }
 </style>
 </head>
-<body>${body}</body>
+<body>${top}${bodyHtml}${bottom}</body>
 </html>`;
 }
+function renderPrintDocument(doc, opts = {}) {
+  const lang = opts.lang === "staff" ? "bn" : opts.lang ?? "bn";
+  const tr = lang !== "bn" && opts.transliterate ? opts.transliterate : (s) => s;
+  const title = opts.title ?? tr(doc.meta.title);
+  const body = renderToHtml(doc, { lang, showHeader: opts.showHeader, transliterate: opts.transliterate });
+  return pageHtml(lang, title, body, opts, doc);
+}
+async function renderStaffPrintDocument(doc, opts = {}) {
+  if (opts.lang !== "staff") return renderPrintDocument(doc, opts);
+  const title = opts.title ?? doc.meta.title;
+  const staff = await renderStaffHtml(doc, opts);
+  return pageHtml("en", title, staff, opts, doc);
+}
 function printSwaralipi(doc, opts = {}) {
   if (typeof document === "undefined") {
     throw new Error("printSwaralipi requires a DOM; use renderPrintDocument() for server-side PDF");
   }
-  const html = renderPrintDocument(doc, opts);
+  if (opts.lang === "staff") {
+    void renderStaffPrintDocument(doc, opts).then(printHtmlInIframe);
+  } else {
+    printHtmlInIframe(renderPrintDocument(doc, opts));
+  }
+}
+function printHtmlInIframe(html) {
   const iframe = document.createElement("iframe");
   iframe.setAttribute("aria-hidden", "true");
   iframe.style.cssText = "position:fixed; left:-10000px; top:0; width:800px; height:600px; border:0;";
@@ -789,7 +1290,7 @@ var TARGET = {
   en: "iast"
 };
 async function loadLyricTransliterator(lang) {
-  if (lang === "bn") return void 0;
+  if (lang === "bn" || lang === "staff") return void 0;
   const mod = await import('@indic-transliteration/sanscript');
   const sanscript = mod.default ?? mod;
   const target = TARGET[lang];
@@ -797,7 +1298,7 @@ async function loadLyricTransliterator(lang) {
 }
 
 // src/viewer/element.ts
-var LANGS = /* @__PURE__ */ new Set(["bn", "hi", "en"]);
+var LANGS = /* @__PURE__ */ new Set(["bn", "hi", "en", "staff"]);
 function ensureNotationFonts() {
   if (typeof FontFace === "undefined" || typeof document === "undefined") return;
   const present = /* @__PURE__ */ new Set();
@@ -817,6 +1318,8 @@ function createElementClass() {
     #abort;
     #translit;
     #translitLang;
+    #renderSeq = 0;
+    #staffOptions = {};
     validate = false;
     constructor() {
       super();
@@ -824,7 +1327,7 @@ function createElementClass() {
       if (typeof CSSStyleSheet !== "undefined" && "replaceSync" in CSSStyleSheet.prototype && "adoptedStyleSheets" in this.#root) {
         if (!sharedSheet) {
           sharedSheet = new CSSStyleSheet();
-          sharedSheet.replaceSync(SWARALIPI_CSS);
+          sharedSheet.replaceSync(SWARALIPI_CSS + SWARALIPI_STAFF_CSS);
         }
         this.#root.adoptedStyleSheets = [...this.#root.adoptedStyleSheets, sharedSheet];
         this.#adopted = true;
@@ -843,6 +1346,13 @@ function createElementClass() {
       }
       this.#render();
     }
+    get staffOptions() {
+      return this.#staffOptions;
+    }
+    set staffOptions(value) {
+      this.#staffOptions = value;
+      if (this.#lang === "staff") this.#render();
+    }
     get #lang() {
       const attr = this.getAttribute("lang");
       return attr !== null && LANGS.has(attr) ? attr : "bn";
@@ -889,14 +1399,22 @@ function createElementClass() {
       }).catch(() => void 0);
     }
     #styleFallback() {
-      return this.#adopted ? "" : `<style>${SWARALIPI_CSS}</style>`;
+      return this.#adopted ? "" : `<style>${SWARALIPI_CSS}${SWARALIPI_STAFF_CSS}</style>`;
     }
     #render() {
+      const seq = ++this.#renderSeq;
       if (this.#doc === void 0) {
         this.#root.innerHTML = this.#styleFallback();
         return;
       }
       const lang = this.#lang;
+      if (lang === "staff") {
+        const doc = this.#doc;
+        void renderStaffHtml(doc, this.staffOptions).then((html2) => {
+          if (seq === this.#renderSeq) this.#root.innerHTML = this.#styleFallback() + html2;
+        }).catch(() => void 0);
+        return;
+      }
       const html = renderToHtml(this.#doc, {
         lang,
         showHeader: !this.hasAttribute("hide-header"),
@@ -927,6 +1445,7 @@ function createElementClass() {
         lang,
         showHeader: !this.hasAttribute("hide-header"),
         transliterate: this.#translitLang === lang ? this.#translit : void 0,
+        ...lang === "staff" ? this.staffOptions : {},
         ...options
       });
     }
@@ -946,19 +1465,30 @@ function defineSwaralipiSheet(tagName = "swaralipi-sheet") {
   return ctor;
 }
 
+exports.DEFAULT_NOTATOR = DEFAULT_NOTATOR;
+exports.DEFAULT_WATERMARK = DEFAULT_WATERMARK;
 exports.DIGITS = DIGITS;
 exports.LABELS = LABELS;
 exports.MARKS = MARKS;
 exports.NOTATION_FONT_URLS = NOTATION_FONT_URLS;
 exports.SWARALIPI_CSS = SWARALIPI_CSS;
 exports.SWARALIPI_PRINT_CSS = SWARALIPI_PRINT_CSS;
+exports.SWARALIPI_STAFF_CSS = SWARALIPI_STAFF_CSS;
+exports.abcDuration = abcDuration;
+exports.abcToSvg = abcToSvg;
+exports.buildAbc = buildAbc;
 exports.composeCluster = composeCluster;
 exports.defineSwaralipiSheet = defineSwaralipiSheet;
+exports.docToAbc = docToAbc;
 exports.groupRowIntoCells = groupRowIntoCells;
 exports.loadLyricTransliterator = loadLyricTransliterator;
 exports.localizeDigits = localizeDigits;
+exports.midiToAbc = midiToAbc;
 exports.printSwaralipi = printSwaralipi;
+exports.renderMetaHeader = renderMetaHeader;
 exports.renderPrintDocument = renderPrintDocument;
+exports.renderStaffHtml = renderStaffHtml;
+exports.renderStaffPrintDocument = renderStaffPrintDocument;
 exports.renderToHtml = renderToHtml;
 exports.resolveArcs = resolveArcs;
 //# sourceMappingURL=index.cjs.map