Skip to content
Salsa

Editor Support (SalsaFX IDE)

SalsaFX IDE brings the SalsaFX component language directly into your editor. While writing HTML, Astro, Vue, Svelte, or JSX templates, it offers custom element suggestions, the attributes they accept, and the values those attributes allow — making an HMI gauge, fader, push-button, pill, or tab as discoverable as a native tag.

SalsaFX IntelliSense preview in editor suggesting size values on fx-pill

Key Capabilities

Section titled “Key Capabilities”

Component Autocomplete

Type <fx- and the editor immediately lists all available HMI, SCADA, and Pro custom elements with built-in descriptions.

Attribute Discovery

Discover valid properties, events, and slots directly in your template without toggling back and forth to documentation.

Allowed Value IntelliSense

Prompts enum values like variant=“primary | warning | danger”, size=“small | medium | large”, and shape=“round | rect”.

Zero Overhead

Powered by the standard HTML Custom Data specification. Zero persistent background daemons, zero telemetry, and instant startup.

Cursor

Section titled “Cursor”

Cursor provides first-class support for the SalsaFX IDE extension via its marketplace and the Open VSX Registry.

Installation

Section titled “Installation”
Open on Open VSX
  1. Open Extensions in Cursor (Ctrl + Shift + X on Windows/Linux or Cmd + Shift + X on macOS).
  2. Search for SalsaFX IDE (publisher: kingmaker-sas).
  3. Click Install.

Command Line Installation

Section titled “Command Line Installation”

Alternatively, install it via the Cursor CLI:

Terminal window
cursor --install-extension kingmaker-sas.salsafx-ide

VS Code

Section titled “VS Code”

The extension is published on the official Visual Studio Marketplace and supports VS Code, VS Code Insiders, and VSCodium.

Installation

Section titled “Installation”
Visual Studio MarketplaceOpen in VS Code
  1. In VS Code, open the Extensions view (Ctrl + Shift + X / Cmd + Shift + X).
  2. Type SalsaFX IDE.
  3. Select the extension by kingmaker-sas and click Install.

Command Line Installation

Section titled “Command Line Installation”
Terminal window
code --install-extension kingmaker-sas.salsafx-ide

Supported File Types

Section titled “Supported File Types”

SalsaFX custom elements are standard Web Components. IntelliSense is available across all template syntaxes inheriting HTML language contributions:

  • HTML (.html, .htm)
  • Astro (.astro)
  • Svelte (.svelte)
  • Vue (.vue)
  • PHP, Blade, ERB, and custom server-side templates.

No workspace configuration (.vscode/settings.json) is required.