open-index/open-npm huggingface dataset:
npm package: @nath-green/hooks
Description: Hooks library
Author: nath-green
Latest version: 0.0.3

# hooks

Collection of hooks

- [useFocus](##useFocus)
- [useFocusOnMount](##useFocusOnMount)

## useFocus

Returns `ref` and `setFocus()` to be used on an element which will receive event based focus.

```js
import { useFocus } from '@nath-green/hooks';

const { ref, setFocus } = useFocus();

<button onClick={() => setFocus()}>Focus heading</button>
<h1 ref={ref} tabIndex="-1">Focus on me</h1>
```

### Use case

When a modal has opened and the focus should be set to the close button.

## useFocusOnMount

Returns a `ref` to be used on an element which will receive focus on mount.

```js
import { useFocusOnMount } from '@nath-green/hooks';

const focusRef = useFocusOnMount();

<button ref={focusRef}>Focused</button>
```

### Use case

When a modal has opened and the focus should be set to the close button.
npm package: @nath-green/ui
Description: UI library
Author: nath-green
Latest version: 0.6.3

# @nath-green/ui

A library of accessibility-focused style-agnostic React UI components.

Built for use with [Tailwind](https://tailwindcss.com/) - bring your own classes and styles!

Components:

- Button
- Spinner
- Pill
- Input

[Read documentation and view examples](https://nath-green.vercel.app/packages/ui)
npm package: @nath-green/utils
Description: Collection of utils
Author: nath-green
Latest version: 0.0.2

# utils

Collection of utils

- [formatUrlWithProtocol](#user-content-formaturlwithprotocol)
- [isEmptyObject](#user-content-isemptyobject)

## formatUrlWithProtocol

Returns formatted `url`

```js
import { formatUrlWithProtocol } from "@nath-green/utils";

const formattedUrl = formatUrlWithProtocol({
  url: "www.test.co.uk",
  secure: true,
});

// returns https://www.test.co.uk
```

### Parameters

An object of values

| Param  | Type    | Default | Description            |
| ------ | ------- | ------- | ---------------------- |
| url    | String  |         | URL to be formatted    |
| secure | Boolean | `false` | To prefix with `https` |

---

## isEmptyObject

Returns a `boolean`

```js
import { isEmptyObject } from "@nath-green/utils";

const models = {};

const noModels = isEmptyObject(models);

// returns true
```

```js
import { isEmptyObject } from "@nath-green/utils";

const models = { latest: "Mustang", fastest: "Polo" };

const hasModels = !isEmptyObject(models);

// returns true
```

### Parameters

A single parameter

| Param | Type   | Default | Description         |
| ----- | ------ | ------- | ------------------- |
| obj   | Object |         | Object to be tested |