@umah-creative/browser-native-react

A React hooks wrapper for the @umah-creative/browser-native core library. Provides idiomatic, composable hooks for browser-native APIs like Clipboard, Notifications, Geolocation, and more.

Installation

pnpm add @umah-creative/browser-native-react

Usage

import React from 'react';
import { useClipboard, useNotification, useGeolocation } from '@umah-creative/browser-native-react';

function App() {
  const { copy } = useClipboard();
  const { notify } = useNotification();
  const { position, getCurrentPosition } = useGeolocation();

  return (
    <div>
      <button onClick={() => copy('Hello World!')}>Copy to Clipboard</button>
      <button onClick={() => notify('Hi there!', { body: 'This is a notification.' })}>Notify</button>
      <button onClick={getCurrentPosition}>Get Location</button>

      {position && (
        <p>
          Lat: {position.coords.latitude}, Lon: {position.coords.longitude}
        </p>
      )}
    </div>
  );
}

Features

• Idiomatic React hooks: Fully composable hooks for all core APIs.
• TypeScript-first: Hooks are fully typed for excellent DX.
• Tree-shakeable: Only imports what you use.
• Framework-specific wrapper: React-friendly interface built on top of the core library.

Documentation

Generate API documentation:

pnpm build:docs

The documentation is auto-generated from the core + React packages.

Contributing

1. Fork the repository
2. Run pnpm install
3. Make your changes in packages/react
4. Run pnpm build and pnpm test
5. Submit a pull request

License

MIT © Umah Creative