@sqwig/angular

Angular component for Sqwig — the text box with spellcheck built in.

Spellcheck runs entirely in the browser (WASM engine + dictionary served as static files). Text stays in the page, and the component makes no calls to Sqwig servers. See @sqwig/core for the full feature list.

Install

npm install @sqwig/core @sqwig/angular

Requires Angular 15 or newer (standalone components).

Usage

import { Component, ViewChild } from "@angular/core";
import { SqwigEditorComponent } from "@sqwig/angular";
import { createSpellChecker } from "@sqwig/core";

@Component({
  selector: "app-editor",
  standalone: true,
  imports: [SqwigEditorComponent],
  template: `
    <sqwig-editor [options]="options" (change)="save($event)"></sqwig-editor>
  `,
})
export class EditorComponent {
  // Create the options object once, as a class field — it is read once, at
  // mount, and a fresh object per change-detection cycle would recreate the
  // spell checker (and its Worker) for no reason.
  readonly options = {
    spell: createSpellChecker({ assetBaseUrl: "/sqwig/" }),
    license: "free", // accepts the Sqwig Free License — sqwig.com/free-license
    placeholder: "Say something…",
    trustIndicator: { wordCount: true },
  };

  @ViewChild(SqwigEditorComponent) sqwig?: SqwigEditorComponent;
  // this.sqwig?.editor is the full core Editor

  save(html: string) {
    // ...
  }
}

<sqwig-editor> is a thin, uncontrolled wrapper: the single [options] object is passed to the core editor untouched (read once, at mount), (change) / (selectionChange) / (spellState) forward the core events, and the component's public editor field is the full core Editor (getHTML, setHTML, exec, focus, …). There is no ngModel — initialHTML seeds the document, (change) reports serialized HTML, and editor.setHTML() replaces content programmatically. The editor mounts outside the Angular zone, so its keystroke handling never triggers app-wide change detection; output emissions re-enter the zone.

Serve the spell assets (spell_wasm_bg.wasm, spell.worker.js, dict/ from @sqwig/core/dist) at the assetBaseUrl path — with the Angular CLI, copy them into public/sqwig/.

Try the paid features free for 30 days

Word export, PDF export, a custom dictionary and no badge, for 30 days. Give us an email address and the key comes back by email: Start a 30-day trial

A trial is for evaluation, not commercial production. On day 31 the key expires, the paid features lock and the editor keeps working; pass license: "free" to return to the clean badge.

Documentation

Guides, API reference, theming (incl. dark mode): Read the documentation

Security

Found a vulnerability? Email [email protected]. Policy: Security FAQ

License

Commercial software. LICENSE.txt in this package and the Terms of Service are the governing documents — the summary below is for orientation and does not replace them.

The license option (inside [options]) is required, and all three states run the full core editor:

• omitted — the full editor, a "Powered by Sqwig · unlicensed" badge, one console note
• "free" — the Free tier: one application, clean badge. Covers development, evaluation and non-commercial production; a commercial application in production requires a paid plan. Setting it accepts the Sqwig Free License
• a signed key — your tier's entitlements; the badge is removed on paid tiers

Keys are verified offline — no license server, no phone-home, no usage metering, no per-developer fees. Verification is fail-open: an invalid, malformed or expired key degrades to the Free tier with the badge and a console note. Licensing does not break the editor and the runtime does not throw over it; paid plans additionally enable the features we designate as paid.

Nuances that affect what a license covers — term-bound keys, hostname matching, free development hosts, and packaged app shells (Electron, Capacitor, browser extensions run on the Free tier) — are set out in CHANGELOG.md and in the license notes. Pricing: Plans and pricing

No warranty; provided "as is" to the extent permitted by law. Spellcheck is an automated aid, and Sqwig's sanitisation is not a substitute for re-sanitising server-side. This wrapper bundles no third-party code of its own; @sqwig/core carries the third-party notices.