Skip to content

Commit 89a22f0

Browse files
author
Griko Nibras
committed
chore(docs): update readme
Signed-off-by: Griko Nibras <[email protected]>
1 parent 2877d15 commit 89a22f0

File tree

3 files changed

+47
-0
lines changed

3 files changed

+47
-0
lines changed

README.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ Toggle custom hook and component wrapper for React 🔦
1616
- [Example usage](#example-usage)
1717
- [Toggle hook - `useToggle()`](#toggle-hook---usetoggle)
1818
- [Toggle wrapper - `<ToggleWrap />`](#toggle-wrapper---togglewrap-)
19+
- [`<ClientOnly />`](#clientonly-)
1920
- [API](#api)
2021
- [Toggle hook](#toggle-hook)
2122
- [Toggle wrapper](#toggle-wrapper)
@@ -82,6 +83,22 @@ function App() {
8283
}
8384
```
8485

86+
### `<ClientOnly />`
87+
88+
Same as `<ToggleWrap enableOnMount initialState={false} />`, usually used on client-side only components.
89+
90+
```jsx
91+
import { ClientOnly } from "@kodingdotninja/use-toggle";
92+
93+
function App() {
94+
return (
95+
<ClientOnly>
96+
<div>...</div>
97+
</ClientOnly>
98+
);
99+
}
100+
```
101+
85102
## API
86103

87104
### Toggle hook

src/client-only.tsx

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import * as React from "react";
2+
3+
import { ToggleWrap } from "./toggle-wrap";
4+
5+
export interface ClientOnlyProps {
6+
children: React.ReactNode;
7+
}
8+
9+
/**
10+
* Same as `<ToggleWrap enableOnMount />`, usually used on client-side only components.Same as `<ToggleWrap enableOnMount initialState={false} />`, usually used on client-side only components.
11+
*
12+
* ---
13+
*
14+
* @example
15+
*
16+
* ```jsx
17+
* <ClientOnly>
18+
* <div>...</div>
19+
* </ClientOnly>
20+
* ```
21+
*/
22+
export function ClientOnly({ children }: ClientOnlyProps) {
23+
return (
24+
<ToggleWrap enableOnMount initialState={false}>
25+
{() => children}
26+
{/* */}
27+
</ToggleWrap>
28+
);
29+
}

src/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
1+
export * from "./client-only";
12
export * from "./toggle-wrap";
23
export * from "./use-toggle";

0 commit comments

Comments
 (0)