gethue

library6.0.1jsnpmunverified

Hue is an open-source SQL Query Editor for databases and data warehouses, providing a comprehensive set of building blocks for building SQL interfaces. The current stable version is 6.0.1, with a focus on SQL parsers that power advanced autocomplete and syntax analysis, and a lightweight Web Component called SQL Scratchpad for embedding a shareable SQL editor. It offers both ESM and CJS modules, though the library is primarily designed for browser use. Key differentiators include its rich autocomplete and parsing capabilities for multiple SQL dialects, making it a powerful tool for building custom SQL editors or integrating querying functionality into existing web applications.

productivity database

npm install gethue

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · GETHUE

gethue

productivityjavascriptv6.0.1

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

sql-scratchpad

✓ <script type="text/javascript" src="./node_modules/gethue/lib/components/SqlScratchpadWebComponent.js"></script>

✗ <script src="./node_modules/gethue/index.js"></script>

The sql-scratchpad is a Web Component loaded via a dedicated script file. Do not import from the main entry point.

SqlParser

✓ const { SqlParser } = require('gethue');

✗ import { SqlParser } from 'gethue';

The parsers are currently only available as CommonJS modules, not ESM. Use require() for now. This may change in future versions.

HueAutocomplete

✓ const { HueAutocomplete } = require('gethue');

✗ <script src="./node_modules/gethue/lib/components/HueAutocomplete.js"></script>

HueAutocomplete is a React component, not a Web Component. Use require() for Node/Webpack; do not try to load it as a standalone script.

Embeds the SQL Scratchpad Web Component into an HTML page, connecting to a Hue demo instance.

<!DOCTYPE html> <html> <head> <title>SQL Scratchpad</title> <script type="text/javascript" src="./node_modules/gethue/lib/components/SqlScratchpadWebComponent.js"></script> </head> <body> <div style="position: absolute; height: 100%; width: 100%"> <sql-scratchpad api-url="https://demo.gethue.com" username="demo" password="demo" dialect="mysql" /> </div> </body> </html>

Debug

Known issues

breakingThe library's main entry point changed in v6. Import paths for Web Components have moved from /dist/ to /lib/components/. Existing imports from older versions will break.

fix

Update script source to './node_modules/gethue/lib/components/SqlScratchpadWebComponent.js' instead of './node_modules/gethue/dist/...'

affects: <6.0.0

gotchaThe parsers (SqlParser, HueAutocomplete) are CommonJS modules only. Attempting ESM import will result in undefined exports.

fix

Use require() consistently, or configure a bundler to handle CJS interop.

affects: >=6.0.0

deprecatedThe earlier 'hue' package namespace is deprecated. The package was renamed to 'gethue' in v4. Using 'require('hue')' will fail.

fix

Use 'gethue' instead of 'hue' in package.json dependencies and require/import statements.

affects: <4.0.0

gotchaThe sql-scratchpad Web Component requires the 'api-url', 'username', 'password', and 'dialect' attributes to be present. Missing attributes cause silent rendering failures.

fix

Ensure all required attributes are set, even if some are empty strings.

affects: >=6.0.0

Errors

Common errors & fixes

Cannot find module 'gethue'

The package is not installed or the import path is incorrect.

fix

Run `npm install gethue` and ensure the script src points to the correct file under node_modules/gethue/lib/components/.

SqlParser is not a constructor

Using ESM import syntax on a CommonJS-only export.

fix

Change `import { SqlParser } from 'gethue'` to `const { SqlParser } = require('gethue');`

Uncaught TypeError: Failed to resolve module specifier 'gethue'

Attempting to import 'gethue' directly in a browser without a bundler.

fix

Use the specific Web Component script tag as shown in the quickstart, or bundle the library with Webpack/Rollup.

Upgrade

Version history

6.0.1latest on npm

Audit

Dependencies

reactoptionalHue's internal UI components are built with React, but the library exposes standalone Web Components that do not require React at runtime.

react-domoptionalSimilarly needed only when using React-based components; Web Components like sql-scratchpad do not require it.

Agent activity

47 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/cloudera/hue ↗

packagegethue ↗

homepagehttp://gethue.com ↗