axokit-react 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -19
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
A tiny headless React UI primitive for handling asynchronous button states.
|
|
4
4
|
|
|
5
|
-
Package name:
|
|
5
|
+
Package name: `axokit-react` (install with `npm install axokit-react`).
|
|
6
6
|
|
|
7
7
|
## Features
|
|
8
8
|
|
|
@@ -15,7 +15,7 @@ Package name: `@axokit/react` (install with `npm install @axokit/react`).
|
|
|
15
15
|
## Installation
|
|
16
16
|
|
|
17
17
|
```bash
|
|
18
|
-
npm install
|
|
18
|
+
npm install axokit-react
|
|
19
19
|
# also install peer dependencies
|
|
20
20
|
npm install react react-dom
|
|
21
21
|
```
|
|
@@ -23,7 +23,7 @@ npm install react react-dom
|
|
|
23
23
|
## Usage (component)
|
|
24
24
|
|
|
25
25
|
```tsx
|
|
26
|
-
import { AsyncButton } from '
|
|
26
|
+
import { AsyncButton } from 'axokit-react';
|
|
27
27
|
|
|
28
28
|
function SaveButton() {
|
|
29
29
|
const save = () => fetch('/api/save', { method: 'POST' });
|
|
@@ -46,7 +46,7 @@ function SaveButton() {
|
|
|
46
46
|
## Usage (hook)
|
|
47
47
|
|
|
48
48
|
```tsx
|
|
49
|
-
import { useAsyncAction } from '
|
|
49
|
+
import { useAsyncAction } from 'axokit-react';
|
|
50
50
|
|
|
51
51
|
function HookExample() {
|
|
52
52
|
const save = () => fetch('/api/save', { method: 'POST' });
|
|
@@ -99,23 +99,9 @@ Use `data-state` to adjust styles via CSS/Tailwind.
|
|
|
99
99
|
.btn[data-state="error"] { background-color: theme(colors.red.600); }
|
|
100
100
|
```
|
|
101
101
|
|
|
102
|
+
|
|
102
103
|
## License
|
|
103
104
|
|
|
104
105
|
MIT
|
|
105
106
|
|
|
106
|
-
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
|
|
107
|
-
|
|
108
|
-
## Learn More
|
|
109
|
-
|
|
110
|
-
To learn more about Next.js, take a look at the following resources:
|
|
111
|
-
|
|
112
|
-
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
|
113
|
-
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
|
114
|
-
|
|
115
|
-
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
|
|
116
|
-
|
|
117
|
-
## Deploy on Vercel
|
|
118
|
-
|
|
119
|
-
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
|
120
|
-
|
|
121
107
|
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
|