Skip to content

A lightweight yet powerful library that provides various useful tools in React environments.

License

Notifications You must be signed in to change notification settings

toss/react-simplikit-mobile

 
 

Repository files navigation

react-simplikit

react-simplikit · MIT License codecov Discord Badge

English | 한국어

A collection of lightweight, zero-dependency React utilities for building robust applications.

Packages

Package Description Version
react-simplikit Universal hooks - pure state/logic hooks (platform-independent) npm
@react-simplikit/mobile Mobile web utilities (viewport, keyboard, scroll) npm

Note: react-simplikit is now maintained as a Universal Hook Library providing only pure state/logic hooks that work across web and mobile (React Native). Browser/platform-dependent hooks are deprecated. See packages/core/README.md for details.

Features

  • Zero dependencies - Extremely lightweight
  • 100% TypeScript - Full type safety
  • 100% Test coverage - Reliable and stable
  • SSR-safe - Works with Next.js and other SSR frameworks
  • Tree-shakeable - Only bundle what you use

Installation

# Core utilities
npm install react-simplikit

# Mobile web utilities
npm install @react-simplikit/mobile

Quick Start

react-simplikit

import { useState, useEffect } from 'react';
import { useDebounce } from 'react-simplikit';

function SearchInput() {
  const [query, setQuery] = useState('');
  const debouncedQuery = useDebounce(query, 300);

  useEffect(() => {
    if (debouncedQuery) {
      searchAPI(debouncedQuery);
    }
  }, [debouncedQuery]);

  return <input value={query} onChange={(e) => setQuery(e.target.value)} />;
}

@react-simplikit/mobile

import { useAvoidKeyboard, useBodyScrollLock } from '@react-simplikit/mobile';

function ChatInput() {
  const { ref, style } = useAvoidKeyboard();

  return (
    <div ref={ref} style={style}>
      <input type="text" placeholder="Type a message..." />
    </div>
  );
}

function Modal({ isOpen }) {
  useBodyScrollLock(isOpen);
  // ...
}

Documentation

Visit react-simplikit.slash.page for full documentation.

Repository Structure

packages/
├── core/    # react-simplikit (hooks, components, utils)
└── mobile/  # @react-simplikit/mobile (mobile web utilities)

Contributing

We welcome contributions from everyone! Please check our contribution guide.

CONTRIBUTING

License

MIT © Viva Republica, Inc. See LICENSE for details.

About

A lightweight yet powerful library that provides various useful tools in React environments.

Resources

License

Contributing

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 96.6%
  • CSS 1.6%
  • Other 1.8%