Palta Note

palta-note-test provides a Lit web component for Hindustani classical music compositions in Bhatkhande notation, with expanded and shorthand rendering.

Install and use

npm install --save-exact [email protected]

Import the component in browser code, then provide notation as text:

import 'palta-note-test'

const element = document.createElement('palta-note')
element.textContent = '(Dha Tin)x2 Na Dha'
document.body.append(element)

<palta-note shorthand times="3"> (Dha Tin)x2 Na Dha </palta-note>

• shorthand is a boolean attribute/property. Setting it selects compact rendering; removing it selects full rendering. The labeled switch remains usable after either change.
• renderMode="full" and renderMode="shorthand" remain supported. An explicit mode is preserved when the shorthand alias is left at its default. A changed shorthand value selects the corresponding mode.
• taal accepts teental, rupak, jhaptaal, or ektaal to group expanded notation into vibhags. vibhags supplies space-separated markers.
• times repeats the whole composition in full mode and adds a repeat marker in shorthand mode.
• Light-DOM text changes are not automatically observed. After changing textContent, call requestUpdate() or replace the element.

Use textContent for application-owned notation. On a parse error the component shows the source text and expandable error details. Applications may retain their own plain-text fallback for loading and runtime failures.

Browser, modules, and fonts

The package entry registers custom elements and must be loaded in the browser. SSR applications should dynamically import it after mount through their framework's client-only boundary. Keep a plain-text fallback available while it loads. The parser alone can be imported in Node or the browser:

import {parse, parseShorthand} from 'palta-note-test/compositionParser.js'

The default export remains {PaltaNote, parse, parseVibhags}. Both index.js and palta-note.js are supported entry points. Runtime modules and TypeScript declarations use explicit ESM file extensions. A self-contained ESM browser bundle is available at palta-note-test/dist/palta-note.bundled.js.

Parsing does not log notation or modify built-in prototypes. Creating a component does not install styles in the document head or request remote fonts. System sans-serif fallbacks work offline. To opt in to the hosted Handlee and Mooli fonts, call this once in browser code:

import palta from 'palta-note-test'
palta.PaltaNote.loadFontFaces()

This explicit call installs Google-hosted font faces and is idempotent per document. Applications may instead supply their own font faces. Customize text color, accent color, and size with --palta-text-color, --palta-accent-color, and --palta-text-size.

Develop and verify

npm ci
npm run build
npm run lint
npm test
npm run test:package

npm test builds and runs the Mocha browser tests with both development and production Lit exports. Tests default to Chromium, Firefox, and WebKit; install those browsers with npx playwright install. To use local Chrome only:

BROWSERS=chromium PLAYWRIGHT_USE_SYSTEM_CHROME=true npm test
PLAYWRIGHT_USE_SYSTEM_CHROME=true npm run test:package

npm run serve serves the development page at /dev/. npm run docs rebuilds the documentation site. Relative source imports use .js extensions and the compiler uses NodeNext. Dependency declaration checking is skipped in the test build because the testing library has extensionless declarations; the isolated package consumer test checks declarations with strict NodeNext and no skip.

Prepare and publish a release

Update the version in package.json and package-lock.json, and describe changes in CHANGELOG.md. Run the checks above, then pack the candidate:

npm pack
PLAYWRIGHT_USE_SYSTEM_CHROME=true npm run test:package -- ./palta-note-test-0.1.8.tgz

The prepack hook regenerates the grammar, compiles the source, rebuilds the minified browser bundle, and generates the custom-elements manifest. The package allowlist includes runtime modules, declarations, maps, bundle, and manifest; it excludes tests, development tooling, and the generated documentation site. test:package installs the tarball into an isolated consumer, checks native ESM and strict TypeScript imports, and tests both module entries and the bundle in a browser for rendering, shorthand, offline interaction, fallback, and side effects.

Once the candidate is approved and npm publishing is authenticated, publish the same verified tarball:

npm publish ./palta-note-test-0.1.8.tgz
PLAYWRIGHT_USE_SYSTEM_CHROME=true npm run test:package -- [email protected]

Consumers replacing local patches should verify the registry artifact before exact-pinning the repaired version and removing their patch configuration.