@wizzard-packages/react 0.1.0 → 0.1.1
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/LICENSE +1 -1
- package/README.md +72 -0
- package/package.json +14 -4
package/LICENSE
CHANGED
package/README.md
ADDED
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
# @wizzard-packages/react
|
|
2
|
+
|
|
3
|
+

|
|
4
|
+

|
|
5
|
+

|
|
6
|
+
|
|
7
|
+
React bindings for Wizzard Stepper: provider, hooks, and typed factory built on top of @wizzard-packages/core.
|
|
8
|
+
|
|
9
|
+
## Install
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @wizzard-packages/react
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
Optional add-ons:
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
pnpm add @wizzard-packages/persistence @wizzard-packages/middleware
|
|
19
|
+
pnpm add @wizzard-packages/adapter-zod zod
|
|
20
|
+
pnpm add @wizzard-packages/adapter-yup yup
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
## Quickstart
|
|
24
|
+
|
|
25
|
+
```tsx
|
|
26
|
+
import { createWizardFactory } from '@wizzard-packages/react';
|
|
27
|
+
|
|
28
|
+
type Data = { name: string };
|
|
29
|
+
|
|
30
|
+
type StepId = 'name' | 'review';
|
|
31
|
+
|
|
32
|
+
const {
|
|
33
|
+
WizardProvider,
|
|
34
|
+
createStep,
|
|
35
|
+
useWizardActions,
|
|
36
|
+
useWizardState,
|
|
37
|
+
} = createWizardFactory<Data, StepId>();
|
|
38
|
+
|
|
39
|
+
const steps = [
|
|
40
|
+
createStep({ id: 'name', label: 'Name', component: NameStep }),
|
|
41
|
+
createStep({ id: 'review', label: 'Review', component: ReviewStep }),
|
|
42
|
+
];
|
|
43
|
+
|
|
44
|
+
export function App() {
|
|
45
|
+
return (
|
|
46
|
+
<WizardProvider config={{ steps }} initialData={{ name: '' }}>
|
|
47
|
+
<WizardUI />
|
|
48
|
+
</WizardProvider>
|
|
49
|
+
);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
function WizardUI() {
|
|
53
|
+
const { goToNextStep } = useWizardActions();
|
|
54
|
+
const { currentStepId } = useWizardState();
|
|
55
|
+
|
|
56
|
+
return (
|
|
57
|
+
<button onClick={goToNextStep}>Next ({currentStepId})</button>
|
|
58
|
+
);
|
|
59
|
+
}
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
## How it fits
|
|
63
|
+
|
|
64
|
+
- Core engine: @wizzard-packages/core
|
|
65
|
+
- Optional persistence: @wizzard-packages/persistence
|
|
66
|
+
- Optional middleware: @wizzard-packages/middleware
|
|
67
|
+
- Optional validation: @wizzard-packages/adapter-zod or @wizzard-packages/adapter-yup
|
|
68
|
+
|
|
69
|
+
## Links
|
|
70
|
+
|
|
71
|
+
- Repo: https://github.com/ZizzX/wizzard-packages
|
|
72
|
+
- Docs UI: https://zizzx.github.io/wizzard-packages/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wizzard-packages/react",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "React components and hooks for Wizzard Stepper.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -17,14 +17,24 @@
|
|
|
17
17
|
"publishConfig": {
|
|
18
18
|
"access": "public"
|
|
19
19
|
},
|
|
20
|
+
"keywords": [
|
|
21
|
+
"wizard",
|
|
22
|
+
"stepper",
|
|
23
|
+
"react",
|
|
24
|
+
"form",
|
|
25
|
+
"multi-step",
|
|
26
|
+
"headless",
|
|
27
|
+
"workflow"
|
|
28
|
+
],
|
|
29
|
+
"license": "MIT",
|
|
20
30
|
"peerDependencies": {
|
|
21
31
|
"react": ">=18.0.0",
|
|
22
32
|
"react-dom": ">=18.0.0"
|
|
23
33
|
},
|
|
24
34
|
"dependencies": {
|
|
25
|
-
"@wizzard-packages/core": "0.1.
|
|
26
|
-
"@wizzard-packages/middleware": "0.1.
|
|
27
|
-
"@wizzard-packages/persistence": "0.1.
|
|
35
|
+
"@wizzard-packages/core": "0.1.1",
|
|
36
|
+
"@wizzard-packages/middleware": "0.1.1",
|
|
37
|
+
"@wizzard-packages/persistence": "0.1.1"
|
|
28
38
|
},
|
|
29
39
|
"devDependencies": {
|
|
30
40
|
"react": "^19.2.0",
|