@pim.sk/utils v1.1.2

Basic JavaScript utility collection for browser-based applications.

Package	@pim.sk/utils
Version	1.1.2
Type	ES Modules (ESM)
License	MIT
Peer dep.	Vue 3 (optional — only for slots-el)
Repository	github.com/matopim/utils

Import individual modules on demand — no bundler required. Every module is a standalone .mjs file resolved via import map.

// individual import:
import { sleep, to }  from '@pim.sk/utils/wait.mjs'
import sortAssoc      from '@pim.sk/utils/sortAssoc.mjs'
import { isNull, isUndefined } from '@pim.sk/utils/is.mjs'

// side-effect only (extends String.prototype):
import '@pim.sk/utils/string-extend.js'

Installation

npm

npm install @pim.sk/utils

After install, import individual modules — no bundler configuration required:

import { sleep, to } from '@pim.sk/utils/wait'
import sortAssoc     from '@pim.sk/utils/sortAssoc'
import { accentMap } from '@pim.sk/utils/strings'

npmjs.com — @pim.sk/utils · github.com/matopim/utils

Setup via CDN — importmap

No install or bundler needed. Add an importmap to your HTML <head> that points @pim.sk/utils/ to the jsDelivr CDN, then import any module by name.

1 — importmap in <head>

<script type="importmap">
{
  "imports": {
    "@pim.sk/utils/": "https://cdn.jsdelivr.net/npm/@pim.sk/utils@1.1.2/src/"
  }
}
</script>

Pin the version (@1.1.2) in production to avoid breaking changes on updates.
Use @latest only during development.
jsDelivr — @pim.sk/utils

2 — import modules in <script type="module">

<script type="module">
  import { sleep, to } from '@pim.sk/utils/wait.mjs'
  import sortAssoc     from '@pim.sk/utils/sortAssoc.mjs'
  import { accentMap } from '@pim.sk/utils/strings.mjs'

  await sleep(500)
  console.log('ready')
</script>

Minified builds (production)

<script type="importmap">
{
  "imports": {
    "@pim.sk/utils/": "https://cdn.jsdelivr.net/npm/@pim.sk/utils@1.1.2/src/"
  }
}
</script>

<script type="module">
  import { sleep } from '@pim.sk/utils/wait.min.mjs'
</script>

Module overview

Async & Network

Module	Description
get	Thin fetch wrapper with `async/await` and `Promise.all` support. Configurable method (GET/POST), output type (`json`, `text`, `object`) and data payload.
wait	`sleep(ms)` — pauses async execution. `to(fn\|selector)` — polls until a condition, CSS selector or variable becomes available. Supports progress callback, timeout and non-await usage via `.then()` or callback argument.

Data & Type

Module	Description
parse	Recursively converts string values in objects and arrays to their native JS types (number, boolean, null…). Safe number detection preserves phone numbers, postal codes and leading-zero codes as strings.
is	Type-checking predicates: `isString`, `isNumber`, `isBoolean`, `isNull`, `isUndefined`, `isNil`, `isArray`, `isObject`, `isJson`, `isDate`, `isDOM`, `isFunction`, `isClass`…
recursiveCompare	Deep diff of two objects or arrays. Returns an array of change records `{ k, f, t }` — path, from-value, to-value. Useful for form change detection and generating patch objects.
boolean	Converts loose truthy string values (`"1"`, `"yes"`, `"true"`, `"on"`) to a native boolean.

Collections

Module	Description
sortAssoc	Sorts an array of objects by one or more fields. Supports `String`, `Number`, `Date` and `Boolean` comparison, `asc`/`desc` direction, case-sensitivity and multi-field (array of conditions) sorting.
array-extend	Side-effect import that extends `Array.prototype` with convenience methods: `.sum`, `.avg`, `.min`, `.max`, `.unique`, `.pluck`, `.sortBy` and more.
fulltext-filter	Client-side full-text search over an array of objects. Returns filtered results ranked by match score. Configurable fields and minimum score threshold.

Strings & Numbers

Module	Description
strings	String utilities: `accentMap` (diacritics → ASCII), `emptyMap` (slugify), `compareMatch` (% word overlap), `telColapse`/`telExpand` (phone formatting), `basename`, `dirname`, `extname`, `cleanPath`, `strip_tags`, `shortString`, `random`.
numbers	Number helpers: `cislo` (locale-aware string→number), `formatBytes`, `cenaNa5Centov` (price rounding), `ratio` (percentage of total).

DOM & Browser

Module	Description
dom	`toDOM(html)` — converts an HTML string to a live DOM Node. Lightweight alternative to `innerHTML` for creating single elements programmatically.
filter-menu	Live search/filter for navigation `<li>` lists. Reads text from `<a>` tags (including `<small>`), normalizes diacritics and supports nested menus. Zero-JS auto-init via `data-filter-menu` attribute or manual call.
copy-code	Adds a hover clipboard button to any element with `data-copy-code`. Button is `position:fixed` — never shifts layout. Supports child selector (`data-copy-code="code"`), custom button class (`data-copy-code-class`), `<textarea>`/`<input>` value copy and manual `copyCode(root)` for dynamic elements.
position	Reads element layout: viewport coordinates (`top`, `left`), page coordinates (`topp`, `leftp`), dimensions (`w`, `h`) and computed padding values. Includes Shadow DOM traversal.
inViewport	Detects when elements enter or leave the viewport on scroll. Configurable threshold, `once` mode and `onViewport`/`onLeave` callbacks. Clean `destroy()` method removes the scroll listener.
inViewportAnim	Builds on `inViewport` — triggers Animate.css animations when elements scroll into view. Supports `once`, per-element `data-ivpa-*` attribute overrides and animation lifecycle callbacks.

Storage

Module	Description
jsonStorage	Wrapper over `localStorage` that serialises/deserialises JSON automatically. `setItem` supports merge mode to update individual keys without overwriting the full object.
jsonStorageSes	Identical API to `jsonStorage` but backed by `sessionStorage` — data is cleared automatically when the browser tab is closed.

Utilities

Module	Description
line	Defines a global `__LINE__` getter that returns the current source file name and line number at the point of call. Useful for lightweight debug logging without a full stack trace.
debounce	Delays execution of a function until a specified quiet period has passed since the last call. Standard debounce pattern for input handlers, resize events and search-as-you-type.
class-url	Parses and manipulates the current page URL — path segments, query parameters and hash. Reactive to browser navigation.
date-time	Date formatting and manipulation helpers with Slovak locale defaults — format, diff, relative labels and SQL-compatible output.

Vue 3

Module	Description
slots-el	Converts Vue 3 slot VNodes (`this.$slots.default()`) to a plain HTML string (`.html`) or an array of live DOM Nodes (`.node`). For use inside child component `setup()` when slot content needs to be inspected or forwarded outside Vue's render pipeline.

Utils (@pim.sk/utils)