@gibme/web-ui

A browser-side TypeScript library that bundles jQuery and lazy-loads a curated set of common UI libraries (Bootstrap 5, Chart.js, DataTables, Google Charts/Fonts/Maps, hls.js, Moment, Numeral, Smoothie, FontAwesome, pdfMake, JSZip, and more) from CDN, exposing them as jQuery static methods or $.fn prototype extensions.

Note: This package is blocking as it waits for all the dependent modules to load from CDN. It is highly recommended that you use jQuery's ready event before attempting to use these methods.

Documentation

https://gibme-npm.github.io/web-ui/

Requirements

• Node.js >= 22 (for build/tooling)
• A modern browser (the bundled output targets the standard browser runtime)

Installation

yarn add @gibme/web-ui

or

npm install @gibme/web-ui

A pre-built browser bundle (WebUI global) is also produced via yarn build:webpack and shipped in dist/.

Example

import '@gibme/web-ui';

$(() => {
    $('some_data_table').dt();

    $('some_canvas').qrCode('https://github.com');
});

Bundled Packages

Package	Accessed Via	Loaded From
jQuery	$	Bundled
Bootstrap		CDN
Bootstrap Modals	$.modal() $.statusModal()	CDN
Chart.js	$().chartJS()	CDN
cross-fetch wrapper	$.fetch()	CDN
DataTables.net-BootStrap5	$().dt()	CDN
FontAwesome Free	Font Awesome Docs $.createAwesomeIcon() $.createAwesomeButton()	CDN
Google Charts	$.loadGoogleCharts()	CDN
Google Fonts	$.loadGoogleFonts()	CDN
Google Maps	$.loadGoogleMaps()	CDN
hls.js	$.hls() $.createHLSMedia()	CDN
Moment.js	$.moment() $.momentUtc()	CDN
Numeral.js	$.numeral()	CDN
Smoothie Charts	$().smoothieChart() $.timeSeries()	CDN
QR Codes	$().qrCode()	CDN
Overlays	$().overlay()	CDN
LocalStorage	$.localStorage()	CDN
Timer	$.timer()	CDN
WebSocketClient	$.websocket()	CDN
Nano ID	$.nanoid()	Bundled
@simplewebauthn/browser	$.webauthn()	CDN
Advanced Crypto	$.crypto	CDN

CDN URLs are pinned at compile time to the exact dependency versions listed in package.json, so the dist code and the CDN scripts always agree on the version.

License

MIT