An npm package for Sinhala phonetic input — drop-in React components with real-time Unicode conversion and word prediction.
Built for developers building Sinhala-language products — from simple text fields to full editors.
As you type phonetically, each keystroke is converted to Sinhala Unicode instantly — no submit, no button, no delay.
A built-in dictionary of ~350 common Sinhala words powers prefix-based suggestions. Select one to replace the current word.
Default styles work out of the box. Override any element with className props, or pass unstyled for full control.
Use convertText() and SinhalaPredictor anywhere — Node.js, Deno, Svelte, Vue. No React required for the core.
Tree-shakeable ESM and CommonJS builds. Full TypeScript declarations. Works with Vite, Next.js, Webpack, and Rollup.
Bring your own word list using new SinhalaPredictor(myWords) or extend the built-in one with predictor.addWords().
Common phonetic patterns — the same scheme used by Sinhala Google Input Tools.
Type any Sinhala phonetics in the left pane and watch the Unicode appear live in the right pane. Click a suggestion chip to accept a word prediction.
The <SinhalaTypewriter> component handles everything — conversion, state, and the suggestion dropdown.
import { SinhalaTypewriter } from '@dnsam/sinhala-phonetics'; export default function App() { return ( <SinhalaTypewriter onChange={(text) => console.log(text)} placeholder='Type "ayubowan"…' maxSuggestions={5} /> ); }
import { useState } from 'react'; import { SinhalaTypewriter } from '@dnsam/sinhala-phonetics'; export default function Editor() { const [text, setText] = useState(''); return ( <> <SinhalaTypewriter value={text} onChange={setText} onSuggestionSelect={(word) => console.log('picked:', word)} rows={6} /> <p>Characters: {text.length}</p> </> ); }
// Full control — your CSS, no Tailwind required import { SinhalaTypewriter } from '@dnsam/sinhala-phonetics'; <SinhalaTypewriter unstyled onChange={setText} inputClassName="my-textarea" suggestionsClassName="my-dropdown" suggestionItemClassName="my-item" /> // Or build completely custom UI with the hooks: import { useSinhalaConverter, useWordPrediction } from '@dnsam/sinhala-phonetics'; const { sinhalaValue, currentWordSinhala, handlePhoneticChange, replaceCurrentWord } = useSinhalaConverter(); const suggestions = useWordPrediction(currentWordSinhala, { maxSuggestions: 8 });
// Works in Node, Deno, browser — no React needed import { convertText, SinhalaPredictor } from '@dnsam/sinhala-phonetics'; convertText('ayubowan'); // → 'ආයුබෝවන්' convertText('mama'); // → 'මම' convertText('kohomada'); // → 'කොහොමද' // Custom dictionary const predictor = new SinhalaPredictor(['ගෙදර', 'ගෙල', 'ගෙනාවා']); predictor.addWords(['අම්මා', 'තාත්තා']); predictor.predict('ගෙ', 3); // → [{ word: 'ගෙදර' }, { word: 'ගෙල' }, { word: 'ගෙනාවා' }]
Full TypeScript types ship with the package — your editor will autocomplete every prop.
All-in-one input with live Sinhala conversion and word prediction dropdown. Accepts controlled or uncontrolled usage.
Textarea with live phonetic conversion only — no suggestion dropdown. Use when you manage predictions yourself.
Manages all phonetic ↔ Sinhala conversion state. Returns everything you need to build a fully custom input.
Framework-agnostic functions. Use in any JavaScript/TypeScript environment.
Three steps and you have a fully working Sinhala input in your React app.
npm install @dnsam/sinhala-phonetics
// tailwind.config.js content: [ './node_modules/@dnsam/ sinhala-phonetics/dist/**/*.js' ]
import { SinhalaTypewriter }
from '@dnsam/sinhala-phonetics';
<SinhalaTypewriter
onChange={setText}
/>