@pepperhorn/chordl-react 0.3.0

package/dist/index.d.ts

@@ -0,0 +1,610 @@
+import { autoFingering } from '@pepperhorn/chordl-core';
+import { autoSelectVoicing } from '@pepperhorn/chordl-voicings';
+import { BLACK_KEY_HEIGHT_COMPACT } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_HEIGHT_EXACT } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_OFFSETS } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_OFFSETS_EXACT } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_RY } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_WIDTH } from '@pepperhorn/chordl-core';
+import { BLACK_KEY_WIDTH_EXACT } from '@pepperhorn/chordl-core';
+import { BRAVURA_GLYPHS } from '@pepperhorn/chordl-core';
+import { calculateLayout } from '@pepperhorn/chordl-core';
+import { CHORD_SHEET_SCHEMA_VERSION } from '@pepperhorn/chordl-core';
+import { ChordData } from '@pepperhorn/chordl-core';
+import { ChordDescriptor } from '@pepperhorn/chordl-voicings';
+import { ChordLogEntry } from '@pepperhorn/chordl-core';
+import { chordRef } from '@pepperhorn/chordl-core';
+import { ChordRequest } from '@pepperhorn/chordl-core';
+import { ChordResult } from '@pepperhorn/chordl-core';
+import { ChordSheetData } from '@pepperhorn/chordl-core';
+import { ColorTheme } from '@pepperhorn/chordl-core';
+import { computeKeyboard } from '@pepperhorn/chordl-core';
+import { computeStaffLayout } from '@pepperhorn/chordl-core';
+import { computeSvgDimensions } from '@pepperhorn/chordl-core';
+import { CSSProperties } from 'react';
+import { decodeChordSheet } from '@pepperhorn/chordl-core';
+import { DEFAULT_BLACK_FILL } from '@pepperhorn/chordl-core';
+import { DEFAULT_STROKE } from '@pepperhorn/chordl-core';
+import { DEFAULT_STROKE_WIDTH } from '@pepperhorn/chordl-core';
+import { DEFAULT_WHITE_FILL } from '@pepperhorn/chordl-core';
+import { DisplayDefaults } from '@pepperhorn/chordl-core';
+import { DisplayMode } from '@pepperhorn/chordl-core';
+import { downloadMidi } from '@pepperhorn/chordl-core';
+import { ENABLE_CHORD_LOGGING } from '@pepperhorn/chordl-core';
+import { encodeChordSheet } from '@pepperhorn/chordl-core';
+import { findTemplate } from '@pepperhorn/chordl-core';
+import { findVoicing } from '@pepperhorn/chordl-voicings';
+import { FLAT_TO_SHARP } from '@pepperhorn/chordl-core';
+import { FORM_TEMPLATES } from '@pepperhorn/chordl-core';
+import { Format } from '@pepperhorn/chordl-core';
+import { FormTemplate } from '@pepperhorn/chordl-core';
+import { generateLockedHands } from '@pepperhorn/chordl-voicings';
+import { generateMidiFile } from '@pepperhorn/chordl-core';
+import { getAlternativeVoicings } from '@pepperhorn/chordl-voicings';
+import { getDefaultGlyphs } from '@pepperhorn/chordl-core';
+import { getTheme } from '@pepperhorn/chordl-core';
+import { Hand } from '@pepperhorn/chordl-voicings';
+import { HandBracket } from '@pepperhorn/chordl-core';
+import { inferStyle } from '@pepperhorn/chordl-voicings';
+import { isProgressionRequest } from '@pepperhorn/chordl-core';
+import { JSX } from 'react/jsx-runtime';
+import { KeyDescriptor } from '@pepperhorn/chordl-core';
+import { LayoutOptions } from '@pepperhorn/chordl-core';
+import { LayoutResult } from '@pepperhorn/chordl-core';
+import { LOG_SCHEMA_VERSION } from '@pepperhorn/chordl-core';
+import { logChordRequest } from '@pepperhorn/chordl-core';
+import { LogConfig } from '@pepperhorn/chordl-core';
+import { mapHighlights } from '@pepperhorn/chordl-core';
+import { mapToVoicingQuality } from '@pepperhorn/chordl-voicings';
+import { MAX_EXAMPLES } from '@pepperhorn/chordl-core';
+import { normalizeNote } from '@pepperhorn/chordl-core';
+import { NoteName } from '@pepperhorn/chordl-core';
+import { NoteNameMode } from '@pepperhorn/chordl-core';
+import { parseChordDescription } from '@pepperhorn/chordl-core';
+import { ParsedChordRequest } from '@pepperhorn/chordl-core';
+import { ParsedProgressionRequest } from '@pepperhorn/chordl-core';
+import { parseProgressionRequest } from '@pepperhorn/chordl-core';
+import { PETALUMA_GLYPHS } from '@pepperhorn/chordl-core';
+import { processChordRequest } from '@pepperhorn/chordl-core';
+import { ProgressionChord } from '@pepperhorn/chordl-core';
+import { ProgressionExample } from '@pepperhorn/chordl-core';
+import { ProgressionRequest } from '@pepperhorn/chordl-core';
+import { ProgressionResult } from '@pepperhorn/chordl-core';
+import { Provider } from 'react';
+import { queryVoicings } from '@pepperhorn/chordl-voicings';
+import { ReactNode } from 'react';
+import { RealizedNote } from '@pepperhorn/chordl-voicings';
+import { realizeVoicing } from '@pepperhorn/chordl-voicings';
+import { realizeVoicingFull } from '@pepperhorn/chordl-voicings';
+import { resolveChord } from '@pepperhorn/chordl-core';
+import { ResolvedChord } from '@pepperhorn/chordl-core';
+import { resolveDefaults } from '@pepperhorn/chordl-core';
+import { resolveProgression } from '@pepperhorn/chordl-core';
+import { resolveProgressionRequest } from '@pepperhorn/chordl-core';
+import { resolveTheme } from '@pepperhorn/chordl-core';
+import { SectionData } from '@pepperhorn/chordl-core';
+import { selectByRange } from '@pepperhorn/chordl-voicings';
+import { setDefaultGlyphs } from '@pepperhorn/chordl-core';
+import { solvePolychord } from '@pepperhorn/chordl-voicings';
+import { solveSlashChord } from '@pepperhorn/chordl-voicings';
+import { StaffGlyphSet } from '@pepperhorn/chordl-core';
+import { StaffLayoutOptions } from '@pepperhorn/chordl-core';
+import { StaffLayoutResult } from '@pepperhorn/chordl-core';
+import { StaffNote } from '@pepperhorn/chordl-core';
+import { SYSTEM_DEFAULTS } from '@pepperhorn/chordl-core';
+import { TextSize } from '@pepperhorn/chordl-core';
+import { tokenizeProgression } from '@pepperhorn/chordl-core';
+import { validateVersion } from '@pepperhorn/chordl-core';
+import { VOICING_LIBRARY } from '@pepperhorn/chordl-voicings';
+import { VoicingEntry } from '@pepperhorn/chordl-voicings';
+import { VoicingEra } from '@pepperhorn/chordl-voicings';
+import { voicingPitchClasses } from '@pepperhorn/chordl-voicings';
+import { VoicingQuality } from '@pepperhorn/chordl-voicings';
+import { VoicingQuery } from '@pepperhorn/chordl-voicings';
+import { VoicingStyle } from '@pepperhorn/chordl-voicings';
+import { WHITE_KEY_HEIGHT_COMPACT } from '@pepperhorn/chordl-core';
+import { WHITE_KEY_HEIGHT_EXACT } from '@pepperhorn/chordl-core';
+import { WHITE_KEY_RY } from '@pepperhorn/chordl-core';
+import { WHITE_KEY_WIDTH } from '@pepperhorn/chordl-core';
+import { WHITE_KEY_WIDTH_EXACT } from '@pepperhorn/chordl-core';
+import { WHITE_NOTE_ORDER } from '@pepperhorn/chordl-core';
+import { WHITE_NOTES_WITH_SHARPS } from '@pepperhorn/chordl-core';
+import { WhiteNote } from '@pepperhorn/chordl-core';
+
+/** Arpeggiation tempo (quarter note = BPM). Each note triggers on a 16th-note grid. */
+export declare const ARPEGGIO_BPM = 120;
+
+/** Compute the ms delay between arpeggiated notes from BPM (16th-note subdivision). */
+export declare function arpeggioDelayMs(bpm?: number): number;
+
+export { autoFingering }
+
+export { autoSelectVoicing }
+
+export { BLACK_KEY_HEIGHT_COMPACT }
+
+export { BLACK_KEY_HEIGHT_EXACT }
+
+export { BLACK_KEY_OFFSETS }
+
+export { BLACK_KEY_OFFSETS_EXACT }
+
+export { BLACK_KEY_RY }
+
+export { BLACK_KEY_WIDTH }
+
+export { BLACK_KEY_WIDTH_EXACT }
+
+export { BRAVURA_GLYPHS }
+
+export { calculateLayout }
+
+export { CHORD_SHEET_SCHEMA_VERSION }
+
+export { ChordData }
+
+export { ChordDescriptor }
+
+export declare function ChordGroup({ chords, label, format, theme, highlightColor, showPlayback, scale, display, showNoteNames, noteNameMode, noteNameSize, showFingering, fingeringSize, onVariation, renderVariationExtras, }: ChordGroupProps): JSX.Element;
+
+export declare interface ChordGroupProps {
+    chords: ProgressionChord[];
+    label?: string;
+    format?: Format;
+    theme?: ColorTheme | string;
+    highlightColor?: string;
+    showPlayback?: boolean;
+    scale?: number;
+    display?: DisplayMode;
+    showNoteNames?: boolean;
+    noteNameMode?: NoteNameMode;
+    noteNameSize?: TextSize;
+    showFingering?: boolean;
+    fingeringSize?: TextSize;
+    onVariation?: OnVariation;
+    renderVariationExtras?: RenderVariationExtras;
+}
+
+export { ChordLogEntry }
+
+export declare interface ChordProps {
+    chord: string;
+    format?: Format;
+    theme?: ColorTheme | string;
+    highlightColor?: string;
+    padding?: number;
+    /** Display scale factor (0.5 = 50%, 1 = 100%). Controls maxWidth of the SVG. */
+    scale?: number;
+    /** Display mode: keyboard (default), staff notation, or both side-by-side. */
+    display?: DisplayMode;
+    /** UI chrome theme: "light" (default) or "dark". */
+    uiTheme?: UIThemeMode;
+    /** Show the inline play/copy/download controls. Default true. Set false for static export. */
+    showPlayback?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    /** Called after each render with a snapshot of the rendered variation. */
+    onVariation?: OnVariation;
+    /** Render extra UI as a sibling to the SVG (e.g. rating buttons). */
+    renderVariationExtras?: RenderVariationExtras;
+    /** Voicing identifier reported in VariationContext; defaults to "default". */
+    voicingId?: string;
+    /** Position in a progression; defaults to 0. */
+    chordIndex?: number;
+}
+
+export { chordRef }
+
+export { ChordRequest }
+
+export { ChordResult }
+
+export declare function ChordSheet({ data, printMode, uiTheme, className, style, onVariation, renderVariationExtras }: ChordSheetProps): JSX.Element;
+
+export { ChordSheetData }
+
+export declare interface ChordSheetProps {
+    data: ChordSheetData;
+    /** Hide chord reference IDs (for print / PDF). */
+    printMode?: boolean;
+    /** UI chrome theme: "light" (default) or "dark". */
+    uiTheme?: UIThemeMode;
+    className?: string;
+    style?: CSSProperties;
+    /** Called after each chord renders with a snapshot of the rendered variation. */
+    onVariation?: OnVariation;
+    /** Render extra UI as a sibling to each chord's SVG (e.g. rating buttons). */
+    renderVariationExtras?: RenderVariationExtras;
+}
+
+export { ColorTheme }
+
+export { computeKeyboard }
+
+export { computeStaffLayout }
+
+export { computeSvgDimensions }
+
+export declare const DARK_THEME: UIThemeTokens;
+
+export { decodeChordSheet }
+
+export { DEFAULT_BLACK_FILL }
+
+export { DEFAULT_STROKE }
+
+export { DEFAULT_STROKE_WIDTH }
+
+/** Default UI theme mode. Change this to switch the library default. */
+export declare const DEFAULT_UI_THEME: UIThemeMode;
+
+export { DEFAULT_WHITE_FILL }
+
+export { DisplayDefaults }
+
+export { DisplayMode }
+
+export { downloadMidi }
+
+export declare function downloadPng(svgElement: SVGSVGElement, filename: string, pixelRatio?: number): void;
+
+export declare function downloadSvg(svgElement: SVGSVGElement, filename: string): void;
+
+export { ENABLE_CHORD_LOGGING }
+
+export { encodeChordSheet }
+
+export { findTemplate }
+
+export { findVoicing }
+
+export { FLAT_TO_SHARP }
+
+export { FORM_TEMPLATES }
+
+export { Format }
+
+export { FormTemplate }
+
+export { generateLockedHands }
+
+export { generateMidiFile }
+
+export { getAlternativeVoicings }
+
+export { getDefaultGlyphs }
+
+export { getTheme }
+
+export declare function getUIThemeTokens(mode: UIThemeMode): UIThemeTokens;
+
+export declare type GroupMode = "by-progression" | "by-chord";
+
+export { Hand }
+
+export { HandBracket }
+
+export { inferStyle }
+
+export { isProgressionRequest }
+
+export declare interface KeyboardProps {
+    format?: Format;
+    size?: number;
+    startFrom?: WhiteNote;
+    highlightKeys?: NoteName[];
+    /** All notes for playback (e.g. LH bass + RH chord). Falls back to highlightKeys. */
+    allNotes?: NoteName[];
+    /** Left-hand bass notes (for MIDI export with separate clefs). */
+    lhNotes?: NoteName[];
+    /** Right-hand playback octave (default 4). */
+    rhOctave?: number;
+    /** Left-hand bass playback octave (default 3). */
+    lhOctave?: number;
+    theme?: ColorTheme | string;
+    highlightColor?: string;
+    showPlayback?: boolean;
+    chordLabel?: string;
+    /** Show chord/scale name as a heading above the keyboard. */
+    showHeading?: boolean;
+    /** Bracket annotations below the keyboard (e.g. L.H. / R.H.) */
+    handBrackets?: HandBracket[];
+    /** Display scale factor (0.5 = 50%, 1 = 100%). Controls maxWidth of the SVG. */
+    scale?: number;
+    /** Show note names (capital letters) below highlighted keys. */
+    showNoteNames?: boolean;
+    /** Display-friendly note names aligned with highlightKeys (e.g. "Bb" instead of "A#").
+     *  When omitted, names are derived from highlightKeys (sharp-normalized). */
+    displayNoteNames?: string[];
+    /** Text size for note name labels (default "base"). */
+    noteNameSize?: TextSize;
+    /** Note name display mode: "pitch-class" (default, e.g. "C") or "midi" (e.g. "C4"). */
+    noteNameMode?: NoteNameMode;
+    /** Base MIDI octave for the keyboard's first octave (default 4). Used when noteNameMode="midi". */
+    midiBaseOctave?: number;
+    /** Fingering values to display below keys (and below note names if present).
+     *  Array aligned with highlightKeys — numbers 1–5, extra symbols (0, -, x), or "?" for invalid. */
+    fingering?: (number | string)[];
+    /** Text size for fingering numbers (default "base"). */
+    fingeringSize?: TextSize;
+    /** Jazz roman numeral degree labels aligned with highlightKeys (e.g. ["I","III","#V","bVII"]). */
+    degreeLabels?: string[];
+    /** UI chrome theme: "light" (default) or "dark". */
+    uiTheme?: UIThemeMode;
+    /** Crop half a white key on the left edge (black-key context padding). */
+    clipLeft?: boolean;
+    /** Crop half a white key on the right edge (black-key context padding). */
+    clipRight?: boolean;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export { KeyDescriptor }
+
+export { LayoutOptions }
+
+export { LayoutResult }
+
+export declare const LIGHT_THEME: UIThemeTokens;
+
+export { LOG_SCHEMA_VERSION }
+
+export { logChordRequest }
+
+export { LogConfig }
+
+export { mapHighlights }
+
+export { mapToVoicingQuality }
+
+export { MAX_EXAMPLES }
+
+export { normalizeNote }
+
+export { NoteName }
+
+export declare type OnVariation = (ctx: VariationContext) => void;
+
+export { parseChordDescription }
+
+export { ParsedChordRequest }
+
+export { ParsedProgressionRequest }
+
+export { parseProgressionRequest }
+
+export { PETALUMA_GLYPHS }
+
+export declare function PianoChord(props: ChordProps | KeyboardProps): JSX.Element;
+
+export declare type PianoChordProps = ChordProps | KeyboardProps;
+
+export declare function PianoKeyboard({ format, size, startFrom, highlightKeys, allNotes, lhNotes, rhOctave, lhOctave, theme, highlightColor, showPlayback, chordLabel, showHeading, handBrackets, scale, showNoteNames, displayNoteNames, noteNameSize, noteNameMode, midiBaseOctave, fingering, fingeringSize, degreeLabels, clipLeft, clipRight, uiTheme, className, style, }: KeyboardProps): JSX.Element;
+
+/**
+ * Play notes one at a time from bottom to top (arpeggiated).
+ */
+export declare function playArpeggiated(notes: string[], octave?: number, delayMs?: number, duration?: number): Promise<void>;
+
+/**
+ * Play all notes simultaneously (block chord).
+ */
+export declare function playBlock(notes: string[], octave?: number, duration?: number): Promise<void>;
+
+export { processChordRequest }
+
+export { ProgressionChord }
+
+export { ProgressionExample }
+
+export { ProgressionRequest }
+
+export { ProgressionResult }
+
+export declare function ProgressionView({ result, format, theme, highlightColor, showPlayback, defaultGroupMode, uiTheme, onVariation, renderVariationExtras, }: ProgressionViewProps): JSX.Element;
+
+export declare interface ProgressionViewProps {
+    result: ProgressionResult;
+    format?: Format;
+    theme?: ColorTheme | string;
+    highlightColor?: string;
+    showPlayback?: boolean;
+    defaultGroupMode?: GroupMode;
+    /** UI chrome theme: "light" (default) or "dark". */
+    uiTheme?: UIThemeMode;
+    onVariation?: OnVariation;
+    renderVariationExtras?: RenderVariationExtras;
+}
+
+export { queryVoicings }
+
+export { RealizedNote }
+
+export { realizeVoicing }
+
+export { realizeVoicingFull }
+
+export declare type RenderVariationExtras = (ctx: VariationContext) => ReactNode;
+
+export { resolveChord }
+
+export { ResolvedChord }
+
+export { resolveDefaults }
+
+export { resolveProgression }
+
+export { resolveProgressionRequest }
+
+export { resolveTheme }
+
+export declare function resolveUITheme(uiTheme?: UIThemeMode): UIThemeContext;
+
+export { SectionData }
+
+export { selectByRange }
+
+export { setDefaultGlyphs }
+
+/** Default: show note names below highlighted keys. */
+export declare const SHOW_NOTE_NAMES = false;
+
+export { solvePolychord }
+
+export { solveSlashChord }
+
+export { StaffGlyphSet }
+
+export { StaffLayoutOptions }
+
+export { StaffLayoutResult }
+
+export declare function StaffNotation({ notes, lhNotes, rhOctave, lhOctave, octaveQualifiedNotes, chordLabel, scale, showPlayback, glyphs, className, style, }: StaffNotationProps): JSX.Element;
+
+export declare interface StaffNotationProps {
+    notes: string[];
+    lhNotes?: string[];
+    rhOctave?: number;
+    lhOctave?: number;
+    /** Pre-resolved octave-qualified notes (e.g. "C:4", "G#:5").
+     *  When provided, bypasses internal octave assignment for exact matching. */
+    octaveQualifiedNotes?: string[];
+    chordLabel?: string;
+    scale?: number;
+    showPlayback?: boolean;
+    glyphs?: StaffGlyphSet;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export { StaffNote }
+
+export { SYSTEM_DEFAULTS }
+
+export { TextSize }
+
+export { tokenizeProgression }
+
+declare interface UIThemeContext {
+    mode: UIThemeMode;
+    tokens: UIThemeTokens;
+}
+
+export declare type UIThemeMode = "light" | "dark";
+
+export declare const UIThemeProvider: Provider<UIThemeContext>;
+
+export declare interface UIThemeTokens {
+    /** Primary text color */
+    text: string;
+    /** Muted text (labels, secondary info) */
+    textMuted: string;
+    /** Subtle text (voicing style, hints) */
+    textSubtle: string;
+    /** Border color for inputs and buttons */
+    border: string;
+    /** Button background (inactive) */
+    btnBg: string;
+    /** Button background (active/selected) */
+    btnBgActive: string;
+    /** Button text (inactive) */
+    btnText: string;
+    /** Button text (active/selected) */
+    btnTextActive: string;
+    /** Input/select background */
+    inputBg: string;
+    /** Input/select text */
+    inputText: string;
+    /** SVG icon fill for playback controls */
+    iconFill: string;
+    /** Playback button background */
+    playbackBg: string;
+    /** Playback button active/playing state */
+    playbackActive: string;
+    /** Glass tray behind playback buttons */
+    playbackTrayBg: string;
+    /** Glass tray border */
+    playbackTrayBorder: string;
+    /** Individual button border for glass edge */
+    playbackBtnBorder: string;
+    /** Bracket annotation color (L.H./R.H.) */
+    bracketColor: string;
+    /** Unhighlighted white key fill */
+    whiteFill: string;
+    /** Unhighlighted black key fill */
+    blackFill: string;
+    /** Key outline stroke */
+    keyStroke: string;
+}
+
+export declare function useUITheme(): UIThemeContext;
+
+export { validateVersion }
+
+/**
+ * Description of a single rendered (chord, voicing) cell.
+ * Surfaced via `renderVariationExtras` and `onVariation` so consumers
+ * can attach per-variation overlays (rating UI, telemetry, etc.).
+ */
+export declare interface VariationContext {
+    /** Chord symbol as rendered, e.g. "Cmaj7#5" */
+    chordSymbol: string;
+    /** Position in a progression; 0 for a single-chord render */
+    chordIndex: number;
+    /** Voicing identifier, e.g. "closed" / "drop2" / "open" / "default" */
+    voicingId: string;
+    /** Notes used in this variation (note-name strings as rendered) */
+    notes: string[];
+    /** Inline SVG markup of the rendered variation */
+    svgString: string;
+}
+
+export { VOICING_LIBRARY }
+
+export { VoicingEntry }
+
+export { VoicingEra }
+
+export { voicingPitchClasses }
+
+export { VoicingQuality }
+
+export { VoicingQuery }
+
+export { VoicingStyle }
+
+export declare function VoicingVariantToggle({ chord, format, theme, highlightColor, scale, display, uiTheme, onExportStatus, onVariation, renderVariationExtras, chordIndex, }: VoicingVariantToggleProps): JSX.Element;
+
+declare interface VoicingVariantToggleProps {
+    chord: string;
+    format?: "compact" | "exact";
+    theme?: string;
+    highlightColor?: string;
+    scale?: number;
+    display?: DisplayMode;
+    uiTheme?: UIThemeMode;
+    /** Called when zip export starts/finishes — drives the header animation */
+    onExportStatus?: (status: "idle" | "preparing") => void;
+    onVariation?: OnVariation;
+    renderVariationExtras?: RenderVariationExtras;
+    /** Position in progression, forwarded to PianoChord. Default 0. */
+    chordIndex?: number;
+}
+
+export { WHITE_KEY_HEIGHT_COMPACT }
+
+export { WHITE_KEY_HEIGHT_EXACT }
+
+export { WHITE_KEY_RY }
+
+export { WHITE_KEY_WIDTH }
+
+export { WHITE_KEY_WIDTH_EXACT }
+
+export { WHITE_NOTE_ORDER }
+
+export { WHITE_NOTES_WITH_SHARPS }
+
+export { WhiteNote }
+
+export { }

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "@pepperhorn/chordl-react",
+  "version": "0.3.0",
+  "description": "React component library for SVG piano chord diagrams",
+  "type": "module",
+  "main": "./dist/chordl.cjs",
+  "module": "./dist/chordl.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/chordl.js",
+      "require": "./dist/chordl.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "dependencies": {
+    "jszip": "^3.10.1",
+    "smplr": "^0.18.1",
+    "tonal": "^6.3.0",
+    "@pepperhorn/chordl-core": "0.3.0",
+    "@pepperhorn/chordl-voicings": "0.3.0"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.1.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.3.0",
+    "jsdom": "^25.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "typescript": "^5.7.0",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.3.0",
+    "vitest": "^4.1.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "scripts": {
+    "dev": "vite --host 0.0.0.0",
+    "build": "tsc && vite build",
+    "build:site": "vite build --config vite.site.config.ts",
+    "lint": "tsc --noEmit",
+    "test": "vitest",
+    "test:run": "vitest run"
+  }
+}