@batoanng/utils

Reach for small, typed utilities like slug conversion, delays, previous-value tracking, and error normalisation without rewriting them in each project.

• ✅ Typed utility functions (e.g. sleep, slugify, short ID generator)
• ⚙️ Server + client safe helpers
• 🪝 React hooks like usePrevious and useIsomorphicLayoutEffect
• 🧪 Unit tested with Jest

• ✅ Typed utility functions (e.g. sleep, slugify, short ID generator)
• ⚙️ Server + client-safe helpers
• 🪝 React hooks like usePrevious and useIsomorphicLayoutEffect
• 🧪 Unit tested with Jest
• 📦 Lightweight and tree-shakable

---

Bring the package into your project with the published npm entrypoint.

npm install @batoanng/utils

npm install @batoanng/utils

---

The package is tree-shakable, so consumers can import narrow helpers without paying for the full surface area.

import { sleep, toSlug, usePrevious } from '@batoanng/utils';

await sleep(250);
const previousValue = usePrevious(value);
const slug = toSlug('Design System Docs');

import { sleep, generateShortId } from '@batoanng/utils';

import { usePrevious } from '@batoanng/utils';

---

• . -> types: ./dist/index.d.ts, import: ./dist/index.js, require: ./dist/index.cjs, default: ./dist/index.js

• main: ./dist/index.cjs
• module: ./dist/index.js
• types: ./dist/index.d.ts

• eslint.config.mjs
• jest.config.cjs
• package.json
• src/
• tsconfig.json

• @batoanng/eslint-config
• @batoanng/jest-config
• @batoanng/tsconfig
• @batoanng/types

• @batoanng/types
• @batoanng/eslint-config
• @batoanng/jest-config
• @batoanng/tsconfig

• Replace published workspace:* development dependency ranges with npm semver ranges.

This package uses the shared flat ESLint setup via eslint.config.mjs:

import base from '@batoanng/eslint-config/base';
import test from '@batoanng/eslint-config/test';

export default [...base, ...test];

A collection of general-purpose utility functions and React hooks used across multiple packages and applications.

---

• ✅ Typed utility functions (e.g. sleep, slugify, short ID generator)
• ⚙️ Server + client-safe helpers
• 🪝 React hooks like usePrevious and useIsomorphicLayoutEffect
• 🧪 Unit tested with Jest
• 📦 Lightweight and tree-shakable

---

npm install @batoanng/utils

---

import { sleep, generateShortId } from '@batoanng/utils';

import { usePrevious } from '@batoanng/utils';

---

src/
├── generateShortId.ts              # Short random string generator
├── getNormalisedError.ts           # Transforms mixed errors to unified format
├── SearchSpecBuilder.ts            # Siebel-like query builder for filters
├── sleep.ts                        # Delay function using Promise
├── toSlug.ts                       # Converts string to URL-friendly slug
├── useIsomorphicLayoutEffect.tsx  # SSR-safe useLayoutEffect
├── usePrevious.tsx                # React hook to get previous value

---

This package uses the shared flat ESLint setup via eslint.config.mjs:

import base from '@batoanng/eslint-config/base';
import test from '@batoanng/eslint-config/test';

export default [...base, ...test];