A small, useful utility collection for JavaScript/ESM projects — includes string helpers, DOM utilities, a simple localStorage-based caching system, and an event bridge between iframes and parent windows.
npm install @apsonex/js-utilsimport {
JsCache,
str,
bodyScrollEnable,
bodyScrollDisable,
isIframe,
loadScript,
loadStyle,
Events,
} from '@apsonex/js-utils';Powerful string helper chainable class.
str("hello world").kebabCase().toString(); // "hello-world"
str("some/some.txt").afterLast("/").toString(); // "some.txt"
str("html content").minifyHtml(); // removes whitespace, commentsChainable methods:
after,afterLast,before,beforeLastkebabCase,camelCase,snakeCase,screamCase,snakeCase,slug,plural,singularreplaceFirst,replaceLast,replaceArraylimit,words,start,finishcontains,containsAll,is,startsWith,endsWithtitle,minifyHtml,explode
Simple localStorage cache with TTL (time to live) support.
const cache = new JsCache().init({ prefix: 'my_app:' });
cache.put('user', { name: 'John' }, '10m');
cache.remember('settings', '1hr', () => fetchSettings());Supports TTL formats:
60s,10m,1hr,1d,1mo,1yr, or numeric seconds
Methods:
put(key, value, ttl)remember(key, ttl, fallback)get(key)has(key)forget(key)
Lightweight, useful browser DOM helpers.
bodyScrollDisable(); // disables body scroll
bodyScrollEnable(); // enables it back
isIframe(); // true if running inside iframeDynamically load external scripts or stylesheets.
await loadScript('https://example.com/script.js', {
type: 'module',
onLoad: () => console.log('loaded'),
onError: (err) => console.error(err),
});
await loadStyle('https://example.com/style.css', {
media: 'all',
});They support:
- Auto-skip if already loaded
onLoad,onErrorcallbacks- Custom attributes like
crossorigin,media,title
Two-way communication between parent window and iframe using CustomEvent.
- Dispatch events across iframe and parent
- Auto-generated
.dispatch()and.listen()methods - Works with or without iframe
- IDE autocompletion friendly
const triggers = {
editorReady: '',
toggleSidebar: '',
darkModeEnabled: '',
};
const events = new Events()
.iframe({ iframe: document.getElementById('my-iframe') })
.triggers(triggers)
.init();
events.editorReady.dispatch({ status: 'ready' });
events.darkModeEnabled.listen((data) => {
console.log('Dark mode changed:', data);
});const events = new Events()
.triggers({
saveComplete: '',
errorOccurred: '',
})
.init();
events.saveComplete.dispatch({ id: 123 });
events.errorOccurred.listen((err) => {
console.error(err);
});/** @typedef {ReturnType<Events['init']>} EventMap */
/** @type {EventMap} */
const events = new Events().triggers(triggers).init();npm run buildOutputs ES module and UMD builds in /dist.
MIT License © Apsonex Inc.