Skip to main content

Welcome to Zayne Labs Toolkit

Zayne Labs Toolkit is a powerful collection of utility functions, types, and composables designed to accelerate development across various JavaScript/TypeScript projects. Built with modularity and type-safety in mind, it provides everything you need to build modern web applications efficiently.

Why Zayne Labs Toolkit?

Fully Type-Safe

Built with TypeScript from the ground up with advanced type utilities and zero runtime overhead for type helpers.

Modular Design

Import only what you need. Tree-shakeable exports ensure your bundle stays lean.

Framework Agnostic Core

Core utilities work everywhere. React-specific hooks available with dedicated package.

Battle-Tested

Thoroughly tested utilities used in production applications.

Three Powerful Packages

Core Utilities

Essential utilities like copyToClipboard, debounce, throttle, and state management helpers.

React Hooks

React-specific hooks including useToggle, useDisclosure, useClickOutside, and Zustand integrations.

Type Helpers

Advanced TypeScript utilities like Prettify, DeepPrettify, type guards, and assertion helpers.

Key Features

  • Zero Runtime Overhead: Type utilities have no runtime cost
  • Tree-Shakeable: Only bundle what you use
  • Full TypeScript Support: Comprehensive type definitions and utilities
  • React Integration: Hooks for common patterns and Zustand store helpers
  • Modern Build: ESM-first with optimal bundling
  • Thoroughly Tested: Comprehensive test coverage with Vitest

Quick Example

Get started in seconds with minimal setup:
import { copyToClipboard, debounce } from "@zayne-labs/toolkit-core";
import { useToggle, useDisclosure } from "@zayne-labs/toolkit-react";
import type { Prettify } from "@zayne-labs/toolkit-type-helpers";

// Use powerful utilities immediately
const handleCopy = async () => {
  await copyToClipboard("Hello, world!", {
    onSuccess: () => console.log("Copied!"),
  });
};

function MyComponent() {
  const [isOpen, toggleOpen] = useToggle();
  const modal = useDisclosure({ hasScrollControl: true });
  
  return (
    <button onClick={() => toggleOpen()}>
      {isOpen ? "Close" : "Open"}
    </button>
  );
}

What’s Next?

Installation

Install the toolkit and get your environment set up.

Quick Start

Build your first app with step-by-step guidance.

Core Utilities

Explore the full range of core utilities available.

React Hooks

Discover powerful React hooks and utilities.
Zayne Labs Toolkit requires Node.js 18.x or higher. Make sure your environment meets this requirement.

Community and Support

Join our growing community and get help when you need it:
Support for Vue, Svelte, and Solid is coming soon! Stay tuned for updates.

Build docs developers (and LLMs) love