nextworks 0.1.0-alpha.1 → 0.1.0-alpha.10
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 +61 -2
- package/dist/cli_manifests/auth_manifest.json +7 -1
- package/dist/cli_manifests/blocks_manifest.json +7 -6
- package/dist/cli_manifests/data_manifest.json +4 -2
- package/dist/cli_manifests/forms_manifest.json +6 -3
- package/dist/commands/blocks.d.ts +1 -0
- package/dist/commands/blocks.d.ts.map +1 -1
- package/dist/commands/blocks.js +77 -10
- package/dist/commands/blocks.js.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/kits/auth-core/{README.md → .nextworks/docs/AUTH_CORE_README.md} +11 -0
- package/dist/kits/auth-core/.nextworks/docs/AUTH_QUICKSTART.md +244 -0
- package/dist/kits/auth-core/LICENSE +21 -0
- package/dist/kits/auth-core/app/(protected)/admin/posts/page.tsx +29 -0
- package/dist/kits/auth-core/app/(protected)/admin/users/page.tsx +29 -0
- package/dist/kits/auth-core/app/api/users/[id]/route.ts +127 -0
- package/dist/kits/auth-core/components/ui/button.tsx +84 -17
- package/dist/kits/auth-core/components/ui/input.tsx +5 -3
- package/dist/kits/auth-core/components/ui/label.tsx +10 -4
- package/dist/kits/auth-core/lib/prisma.ts +10 -0
- package/dist/kits/blocks/.nextworks/docs/BLOCKS_QUICKSTART.md +193 -0
- package/dist/kits/blocks/{README.md → .nextworks/docs/BLOCKS_README.md} +12 -0
- package/dist/kits/blocks/.nextworks/docs/THEME_GUIDE.md +223 -0
- package/dist/kits/blocks/LICENSE +21 -0
- package/dist/kits/data/.nextworks/docs/DATA_QUICKSTART.md +112 -0
- package/dist/kits/data/{README.md → .nextworks/docs/DATA_README.md} +13 -0
- package/dist/kits/data/LICENSE +21 -0
- package/dist/kits/data/lib/prisma.ts +10 -0
- package/dist/kits/forms/.nextworks/docs/FORMS_QUICKSTART.md +85 -0
- package/dist/kits/forms/{README.md → .nextworks/docs/FORMS_README.md} +12 -0
- package/dist/kits/forms/LICENSE +21 -0
- package/package.json +4 -1
- package/dist/.gitkeep +0 -0
- package/dist/kits/blocks/components/ui/button_bck.tsx +0 -93
- package/dist/kits/blocks/lib/themes_old.ts +0 -37
- package/dist/kits/blocks/notes/THEMING_CONVERSION_SUMMARY.md +0 -14
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
# Forms Quickstart — Example page
|
|
2
|
+
|
|
3
|
+
This short doc points to the minimal example that demonstrates how to use the Forms primitives with Select, Checkbox and Switch components. It also documents the ApiResult pattern for mapping server field errors into react-hook-form and points to the per-field async validation helper used in the signup form.
|
|
4
|
+
|
|
5
|
+
> To add these examples and primitives to your own app via the CLI, the recommended alpha setup is to install Blocks with sections and templates first, then Forms:
|
|
6
|
+
>
|
|
7
|
+
> ```bash
|
|
8
|
+
> npx nextworks add blocks --sections --templates
|
|
9
|
+
> npx nextworks add forms
|
|
10
|
+
> ```
|
|
11
|
+
>
|
|
12
|
+
> The CLI will copy the Forms primitives and example pages into your `components/ui/form/*`, `components/hooks/`, `lib/validation/*`, and `app/examples/forms/*` directories.
|
|
13
|
+
|
|
14
|
+
Where to find the example
|
|
15
|
+
|
|
16
|
+
- Example page: /examples/forms/basic
|
|
17
|
+
- Full path in repo: app/examples/forms/basic/page.tsx
|
|
18
|
+
|
|
19
|
+
What the example shows
|
|
20
|
+
|
|
21
|
+
- react-hook-form + zodResolver integration using the project's Form primitives
|
|
22
|
+
- Usage of Select, Checkbox and Switch UI components with FormField (which uses RHF Controller under the hood)
|
|
23
|
+
- A minimal submit handler (client-side) you can copy/replace with your API call
|
|
24
|
+
|
|
25
|
+
How to try it locally
|
|
26
|
+
|
|
27
|
+
1. Start the dev server:
|
|
28
|
+
npm run dev
|
|
29
|
+
2. Open your browser and visit:
|
|
30
|
+
http://localhost:3000/examples/forms/basic
|
|
31
|
+
|
|
32
|
+
Note: Some examples that hit the server (such as the wizard/server-action flows) assume you have a Prisma schema and database configured in your app, often via Auth Core/Data. If you haven’t set that up yet, expect those examples to need additional setup.
|
|
33
|
+
The Forms kit does **not** include a Prisma schema; you must define your own `prisma/schema.prisma` and run Prisma migrations if you want the server-action and wizard examples to use a real database.
|
|
34
|
+
|
|
35
|
+
Tip: If you change the Prisma schema, run:
|
|
36
|
+
npx prisma generate
|
|
37
|
+
npx prisma migrate dev
|
|
38
|
+
|
|
39
|
+
Copy/paste tips for your app
|
|
40
|
+
|
|
41
|
+
- Import Form primitives and controls from:
|
|
42
|
+
- components/ui/form/\* (Form, FormField, FormItem, FormLabel, FormControl, FormMessage)
|
|
43
|
+
- components/ui/select.tsx, components/ui/checkbox.tsx, components/ui/switch.tsx
|
|
44
|
+
- The example shows how to forward checkbox/switch changes to RHF by using f.onChange(e.target.checked) and setting checked={!!f.value}.
|
|
45
|
+
|
|
46
|
+
If you want the example to submit to your API, replace the onSubmit handler's console/alert with a fetch() call or server action.
|
|
47
|
+
|
|
48
|
+
---
|
|
49
|
+
|
|
50
|
+
Kit manifest & files (for packaging)
|
|
51
|
+
|
|
52
|
+
If you plan to package a Forms kit (CLI or manual copy), here are the primary files used by the examples and primitives. This manifest is for documentation and packaging reference.
|
|
53
|
+
|
|
54
|
+
Files
|
|
55
|
+
|
|
56
|
+
- components/ui/form/form.tsx
|
|
57
|
+
- components/ui/form/form-field.tsx
|
|
58
|
+
- components/ui/form/form-item.tsx
|
|
59
|
+
- components/ui/form/form-control.tsx
|
|
60
|
+
- components/ui/form/form-description.tsx
|
|
61
|
+
- components/ui/form/form-label.tsx
|
|
62
|
+
- components/ui/form/form-message.tsx
|
|
63
|
+
- components/ui/select.tsx
|
|
64
|
+
- components/ui/checkbox.tsx
|
|
65
|
+
- components/ui/switch.tsx
|
|
66
|
+
- components/hooks/useCheckUnique.ts
|
|
67
|
+
- lib/validation/forms.ts
|
|
68
|
+
- lib/validation/wizard.ts
|
|
69
|
+
- lib/forms/map-errors.ts
|
|
70
|
+
- app/examples/forms/basic/page.tsx
|
|
71
|
+
- app/examples/forms/server-action/page.tsx
|
|
72
|
+
- app/examples/forms/server-action/form-client.tsx
|
|
73
|
+
- app/examples/forms/wizard/wizard-client.tsx
|
|
74
|
+
- app/examples/forms/wizard/page.tsx
|
|
75
|
+
|
|
76
|
+
API routes (used by examples)
|
|
77
|
+
|
|
78
|
+
- app/api/wizard/route.ts
|
|
79
|
+
|
|
80
|
+
Notes
|
|
81
|
+
|
|
82
|
+
- The Forms primitives are UI-only and do not require Prisma or NextAuth to function. The server-action example and the mapping helper demonstrate how to validate server-side and map errors back to react-hook-form.
|
|
83
|
+
- If you are packaging the kit, consider copying only components/ui/form/\* and the select/checkbox/switch files, plus the example pages if you want to keep the demo pages.
|
|
84
|
+
|
|
85
|
+
If you want, I can create docs/FORMS_MANIFEST.json in the repo with the above manifest for the CLI packaging step.
|
|
@@ -21,9 +21,21 @@ What the kit includes
|
|
|
21
21
|
Notes
|
|
22
22
|
|
|
23
23
|
- The forms primitives are UI-only and do not require Prisma or NextAuth.
|
|
24
|
+
- The Forms kit does **not** ship a Prisma schema; if you use the server-action or wizard examples against a real database, you must add a `prisma/schema.prisma` in your app and run `npx prisma generate` and `npx prisma migrate dev`.
|
|
24
25
|
- The wizard example assumes a basic app/api/wizard/route.ts endpoint; adjust it as needed for your project.
|
|
25
26
|
- Keep this kit folder in sync with cli_manifests/forms_manifest.json.
|
|
26
27
|
|
|
28
|
+
> **Alpha note**
|
|
29
|
+
>
|
|
30
|
+
> In this early alpha, Forms is tested on top of a **Blocks** install that includes sections and templates. For the smoothest experience, install Blocks first:
|
|
31
|
+
>
|
|
32
|
+
> ```bash
|
|
33
|
+
> npx nextworks add blocks --sections --templates
|
|
34
|
+
> npx nextworks add forms
|
|
35
|
+
> ```
|
|
36
|
+
>
|
|
37
|
+
> Using Forms without Blocks may work but can require manual tweaks (for example around shared UI primitives).
|
|
38
|
+
|
|
27
39
|
Post-install steps (recommended)
|
|
28
40
|
|
|
29
41
|
1. Install dependencies (the CLI will merge `package-deps.json` into your `package.json`):
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Jakob Bro Liebe Hansen
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in
|
|
13
|
+
all copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/package.json
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "nextworks",
|
|
3
|
-
"version": "0.1.0-alpha.
|
|
3
|
+
"version": "0.1.0-alpha.10",
|
|
4
4
|
"description": "Nextworks CLI - Feature kits installer for Next.js apps",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"bin": {
|
|
7
7
|
"nextworks": "dist/index.js"
|
|
8
8
|
},
|
|
9
|
+
"repository": "github:jblh/nextworks-cli",
|
|
10
|
+
"bugs": "https://github.com/jblh/nextworks-cli/issues",
|
|
11
|
+
"homepage": "https://github.com/jblh/nextworks-cli#readme",
|
|
9
12
|
"scripts": {
|
|
10
13
|
"build": "tsc",
|
|
11
14
|
"postbuild": "node ./scripts/copy-assets.js",
|
package/dist/.gitkeep
DELETED
|
File without changes
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { Slot } from "@radix-ui/react-slot";
|
|
3
|
-
import { cva, type VariantProps } from "class-variance-authority";
|
|
4
|
-
|
|
5
|
-
import { cn } from "@/lib/utils";
|
|
6
|
-
|
|
7
|
-
const buttonVariants = cva(
|
|
8
|
-
"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
9
|
-
{
|
|
10
|
-
variants: {
|
|
11
|
-
variant: {
|
|
12
|
-
default:
|
|
13
|
-
"bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
|
|
14
|
-
destructive:
|
|
15
|
-
"bg-destructive hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white shadow-xs",
|
|
16
|
-
outline:
|
|
17
|
-
"bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs",
|
|
18
|
-
secondary:
|
|
19
|
-
"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs",
|
|
20
|
-
ghost:
|
|
21
|
-
"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
22
|
-
link: "text-primary underline-offset-4 hover:underline",
|
|
23
|
-
},
|
|
24
|
-
size: {
|
|
25
|
-
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
26
|
-
sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
|
|
27
|
-
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
28
|
-
icon: "size-9",
|
|
29
|
-
},
|
|
30
|
-
},
|
|
31
|
-
defaultVariants: {
|
|
32
|
-
variant: "default",
|
|
33
|
-
size: "default",
|
|
34
|
-
},
|
|
35
|
-
},
|
|
36
|
-
);
|
|
37
|
-
|
|
38
|
-
function Button({
|
|
39
|
-
className,
|
|
40
|
-
variant,
|
|
41
|
-
size,
|
|
42
|
-
asChild = false,
|
|
43
|
-
unstyled = false,
|
|
44
|
-
...props
|
|
45
|
-
}: React.ComponentProps<"button"> &
|
|
46
|
-
VariantProps<typeof buttonVariants> & {
|
|
47
|
-
asChild?: boolean;
|
|
48
|
-
/** When true, bypasses tokenized buttonVariants so callers fully control classes */
|
|
49
|
-
unstyled?: boolean;
|
|
50
|
-
}) {
|
|
51
|
-
const Comp = asChild ? Slot : "button";
|
|
52
|
-
|
|
53
|
-
return (
|
|
54
|
-
<Comp
|
|
55
|
-
data-slot="button"
|
|
56
|
-
className={
|
|
57
|
-
unstyled
|
|
58
|
-
? cn(
|
|
59
|
-
"inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap disabled:pointer-events-none disabled:opacity-50",
|
|
60
|
-
className,
|
|
61
|
-
)
|
|
62
|
-
: cn(
|
|
63
|
-
buttonVariants({ variant, size }),
|
|
64
|
-
// Color var hooks (ignored when vars are unset; tokens from variants apply)
|
|
65
|
-
"text-[var(--btn-fg)]",
|
|
66
|
-
"bg-[var(--btn-bg)]",
|
|
67
|
-
"hover:bg-[var(--btn-hover-bg)]",
|
|
68
|
-
"hover:text-[var(--btn-hover-fg)]",
|
|
69
|
-
// explicit dark variants to compete with dark: utilities from variants like outline
|
|
70
|
-
"dark:bg-[var(--btn-bg)]",
|
|
71
|
-
"dark:hover:bg-[var(--btn-hover-bg)]",
|
|
72
|
-
"dark:hover:text-[var(--btn-hover-fg)]",
|
|
73
|
-
// Focus ring and border hooks
|
|
74
|
-
"focus-visible:ring-[var(--btn-ring)]",
|
|
75
|
-
"border-[var(--btn-border)]",
|
|
76
|
-
"dark:border-[var(--btn-border)]",
|
|
77
|
-
className,
|
|
78
|
-
)
|
|
79
|
-
}
|
|
80
|
-
style={{
|
|
81
|
-
...(props.style as React.CSSProperties),
|
|
82
|
-
color: "var(--btn-fg)",
|
|
83
|
-
backgroundColor: "var(--btn-bg)",
|
|
84
|
-
borderColor: "var(--btn-border)",
|
|
85
|
-
// @ts-expect-error custom CSS var for Tailwind ring color
|
|
86
|
-
"--tw-ring-color": "var(--btn-ring)",
|
|
87
|
-
}}
|
|
88
|
-
{...props}
|
|
89
|
-
/>
|
|
90
|
-
);
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
export { Button, buttonVariants };
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
// TypeScript cli/kits/blocks/lib/themes.ts
|
|
2
|
-
|
|
3
|
-
export type Theme = {
|
|
4
|
-
name: string;
|
|
5
|
-
colors: {
|
|
6
|
-
primary: string;
|
|
7
|
-
background: string;
|
|
8
|
-
surface: string;
|
|
9
|
-
text: string;
|
|
10
|
-
muted: string;
|
|
11
|
-
};
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
export const themes: Theme[] = [
|
|
15
|
-
{
|
|
16
|
-
name: "light",
|
|
17
|
-
colors: {
|
|
18
|
-
primary: "#7c3aed",
|
|
19
|
-
background: "#ffffff",
|
|
20
|
-
surface: "#f8fafc",
|
|
21
|
-
text: "#0f172a",
|
|
22
|
-
muted: "#64748b",
|
|
23
|
-
},
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
name: "dark",
|
|
27
|
-
colors: {
|
|
28
|
-
primary: "#8b5cf6",
|
|
29
|
-
background: "#0b1220",
|
|
30
|
-
surface: "#071026",
|
|
31
|
-
text: "#e6eef8",
|
|
32
|
-
muted: "#93c5fd",
|
|
33
|
-
},
|
|
34
|
-
},
|
|
35
|
-
];
|
|
36
|
-
|
|
37
|
-
export const defaultTheme = themes[0];
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
# Theming Conversion Summary
|
|
2
|
-
|
|
3
|
-
This document summarizes the changes made when converting the components to the new theming system.
|
|
4
|
-
|
|
5
|
-
Key changes
|
|
6
|
-
|
|
7
|
-
- All hardcoded tailwind classes for colors were replaced with semantic theme tokens defined in lib/themes.ts.
|
|
8
|
-
- Components now read theme values via CSS variables injected by the EnhancedThemeProvider.
|
|
9
|
-
- PresetThemeVars components in each template set CSS variables for each preset theme.
|
|
10
|
-
|
|
11
|
-
Recommended follow-ups
|
|
12
|
-
|
|
13
|
-
- Review components for any remaining hardcoded colors and replace them with theme tokens.
|
|
14
|
-
- Add more theme presets into lib/themes.ts and update the PresetThemeVars where necessary.
|