Skip to main content

​
Object Utilities

​
pickKeys

Create a new object with only the specified keys from the original object. 
import { pickKeys } from '@zayne-labs/toolkit-core';

const user = {
  id: 1,
  name: 'John Doe',
  email: '[email protected]',
  password: 'secret',
  role: 'admin'
};

const publicUser = pickKeys(user, ['id', 'name', 'email']);
// Result: { id: 1, name: 'John Doe', email: '[email protected]' }
Type Signature: 
const pickKeys: <
  TObject extends UnknownObjectWithAnyValue,
  const TPickArray extends Array<keyof TObject>,
  TPickedKeys extends ExtractUnion<TPickArray> = ExtractUnion<TPickArray>
>(
  initialObject: TObject,
  keysToPick: TPickArray
) => Prettify<Pick<TObject, TPickedKeys>>
TypeScript automatically infers the exact shape of the returned object based on the keys you pick.

​
Alternative Implementations

The package also exports alternative implementations optimized for different use cases:
  • pickKeysWithReduce - Uses Array.reduce for functional programming style
  • pickKeysWithFilter - Uses Array.filter and Object.entries

​
omitKeys

Create a new object excluding the specified keys from the original object. 
import { omitKeys } from '@zayne-labs/toolkit-core';

const user = {
  id: 1,
  name: 'John Doe',
  email: '[email protected]',
  password: 'secret',
  token: 'abc123'
};

const safeUser = omitKeys(user, ['password', 'token']);
// Result: { id: 1, name: 'John Doe', email: '[email protected]' }
Type Signature: 
const omitKeys: <
  TObject extends UnknownObject,
  const TOmitArray extends Array<keyof TObject>,
  TOmittedKeys extends ExtractUnion<TOmitArray> = ExtractUnion<TOmitArray>
>(
  initialObject: TObject,
  keysToOmit: TOmitArray
) => Prettify<Omit<TObject, TOmittedKeys>>

​
Alternative Implementations

  • omitKeysWithReduce - Uses Array.reduce
  • omitKeysWithFilter - Uses Array.filter and Object.entries
  • omitKeysWithDelete - Uses shallow copy and Reflect.deleteProperty

​
JSON Utilities

​
parseJSON

Safely parse JSON strings with fallback support and proper type inference. 
import { parseJSON } from '@zayne-labs/toolkit-core';

// Basic usage
const data = parseJSON<{ name: string }>('{"name": "John"}');
// Result: { name: 'John' }

// With fallback value
const settings = parseJSON<UserSettings>(
  localStorage.getItem('settings'),
  { theme: 'dark', notifications: true }
);

// Handles invalid JSON gracefully
const invalid = parseJSON('not valid json');
// Result: null (logs error to console)
Type Signature: 
type ParseJSON = {
  <TResult>(value: string): TResult;
  <TResult>(value: string | null | undefined): TResult | null;
  <TResult>(value: string | null | undefined, fallbackValue: TResult): TResult;
}
If parsing fails, parseJSON will log the error to the console and return the fallback value (or null if no fallback is provided).

​
Helper Functions

​
toArray

Convert a value or array to an array. 
import { toArray } from '@zayne-labs/toolkit-core';

toArray('hello');        // ['hello']
toArray(['a', 'b']);     // ['a', 'b']
toArray(42);             // [42]
Type Signature: 
const toArray: <TValue>(
  value: TValue | TValue[]
) => TValue[]

​
dataAttr

Convert a boolean condition to a data attribute value for React/HTML. 
import { dataAttr } from '@zayne-labs/toolkit-core';

const isActive = true;

<div data-active={dataAttr(isActive)}>
  Content
</div>
// Renders: <div data-active="true">Content</div>

<div data-disabled={dataAttr(false)}>
  Content
</div>
// Renders: <div>Content</div> (attribute not present)
Type Signature: 
const dataAttr: (
  condition: unknown
) => boolean
Returns "true" (string) when the condition is truthy, or undefined when falsy. This is useful for conditional data attributes in React.

​
tw

Template literal tag for Tailwind CSS classes that preserves formatting. 
import { tw } from '@zayne-labs/toolkit-core';

const className = tw`
  flex items-center justify-between
  px-4 py-2
  bg-blue-500 text-white
  rounded-lg shadow-md
`;
// Result: "flex items-center justify-between px-4 py-2 bg-blue-500 text-white rounded-lg shadow-md"
Type Signature: 
const tw: (
  strings: TemplateStringsArray,
  ...values: Array<'Not-Allowed'>
) => string
The tw function does not accept template interpolations to maintain type safety with Tailwind classes.

​
css

Template literal tag for CSS strings with interpolation support. 
import { css } from '@zayne-labs/toolkit-core';

const color = '#3b82f6';
const padding = 16;

const styles = css`
  background-color: ${color};
  padding: ${padding}px;
  border-radius: 8px;
`;
Type Signature: 
const css: (
  strings: TemplateStringsArray,
  ...values: Array<number | string | undefined>
) => string

​
createSearchParams

Create URLSearchParams from various input formats. 
import { createSearchParams } from '@zayne-labs/toolkit-core';

// From string
const params1 = createSearchParams('?foo=bar&baz=qux');

// From object
const params2 = createSearchParams({ foo: 'bar', baz: 'qux' });

// From key-value pairs
const params3 = createSearchParams([['foo', 'bar'], ['baz', 'qux']]);

// With array values
const params4 = createSearchParams({ tags: ['react', 'typescript'] });
// Result: tags=react&tags=typescript
Type Signature: 
type URLSearchParamsInit =
  | string
  | [string, string][]
  | Record<string, string | string[]>
  | URLSearchParams;

const createSearchParams: (
  paramsInit?: URLSearchParamsInit
) => URLSearchParams

​
formatUrl

Format URL information from string or object. 
import { formatUrl } from '@zayne-labs/toolkit-core';

// From string
const result1 = formatUrl('/dashboard?tab=overview');

// From object
const result2 = formatUrl({
  pathname: '/dashboard',
  search: { tab: 'overview', page: '1' },
  hash: '#section-1'
});

console.log(result2.urlString); // Full URL string
console.log(result2.urlObject.pathname); // '/dashboard'
console.log(result2.urlObject.search); // URLSearchParams instance
Type Signature: 
type PartialURLInfo = {
  hash?: string;
  pathname?: string;
  search?: URLSearchParamsInit;
  searchString?: string;
  state?: unknown;
};

const formatUrl: (
  newURL: string | PartialURLInfo
) => {
  urlObject: URLInfoObject;
  urlString: string;
}

​
pushState / replaceState

Update browser history and URL without page reload. 
import { pushState, replaceState } from '@zayne-labs/toolkit-core';

// Push new state
pushState('/dashboard', { state: { userId: 123 } });

// Replace current state
replaceState({ 
  pathname: '/profile', 
  search: { tab: 'settings' } 
});

// With search params as object
pushState({
  pathname: '/search',
  search: { q: 'typescript', filter: 'recent' }
});
Type Signature: 
const pushState: (
  url: string | PartialURLInfo,
  options?: { state?: unknown }
) => void

const replaceState: (
  url: string | PartialURLInfo,
  options?: { state?: unknown }
) => void

​
hardNavigate

Perform a hard navigation (full page load). 
import { hardNavigate } from '@zayne-labs/toolkit-core';

// Navigate to new page
hardNavigate('/login');

// Replace current page
hardNavigate('/home', 'replace');

// With full URL object
hardNavigate({
  pathname: '/checkout',
  search: { step: '2' }
});
Type Signature: 
const hardNavigate: (
  url: string | Partial<PartialURLInfo> | URL,
  type?: 'assign' | 'replace'
) => void
hardNavigate performs a full page reload. Use pushState or replaceState for SPA navigation.

​
Best Practices

  • Use pickKeys or omitKeys instead of manual object destructuring for better type safety
  • The alternative implementations (pickKeysWithReduce, etc.) are provided for optimization - benchmark your specific use case
  • parseJSON is safe to use in hot paths as it handles errors gracefully

Build docs developers (and LLMs) love

Get started for freeTalk to us