nextworks 0.1.0-alpha.4 → 0.1.0-alpha.5

package/README.md

@@ -30,7 +30,7 @@ npx nextworks --help
 Example commands:
 
 ```bash
-npx nextworks add blocks
+npx nextworks add blocks --sections --templates
 npx nextworks add auth-core
 npx nextworks add forms
 npx nextworks add data

package/dist/kits/auth-core/components/ui/button.tsx

@@ -5,24 +5,27 @@ import { cva, type VariantProps } from "class-variance-authority";
 import { cn } from "@/lib/utils";
 
 const buttonVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  "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",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        default:
+          "bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
         destructive:
-          "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+          "bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 shadow-xs",
         outline:
-          "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+          "bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs",
+        secondary:
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs",
+        ghost:
+          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
       },
       size: {
-        default: "h-10 px-4 py-2",
-        sm: "h-9 rounded-md px-3",
-        lg: "h-11 rounded-md px-8",
-        icon: "h-10 w-10",
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
       },
     },
     defaultVariants: {
@@ -32,24 +35,88 @@ const buttonVariants = cva(
   },
 );
 
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
-  asChild?: boolean;
-}
+type ButtonProps = React.ComponentProps<"button"> &
+  VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+    /** When true, bypasses tokenized buttonVariants so callers fully control classes */
+    unstyled?: boolean;
+    /** Opt-in: force inline CSS var styles for color/bg/border/ring */
+    forceInlineVars?: boolean;
+  };
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant, size, asChild = false, ...props }, ref) => {
+  (
+    {
+      className,
+      variant,
+      size,
+      asChild = false,
+      unstyled = false,
+      forceInlineVars = false,
+      ...props
+    },
+    ref,
+  ) => {
     const Comp = asChild ? Slot : "button";
+
+    // Use caller-provided style; only inject inline var-driven colors when explicitly requested
+    const incomingStyle =
+      (props.style as React.CSSProperties | undefined) ?? undefined;
+    const finalStyle =
+      forceInlineVars && !unstyled
+        ? {
+            ...incomingStyle,
+            color: "var(--btn-fg)",
+            backgroundColor: "var(--btn-bg)",
+            borderColor: "var(--btn-border)",
+            "--tw-ring-color": "var(--btn-ring)",
+          }
+        : incomingStyle;
+
+    // Only enable CSS variable hooks when explicitly requested via inline vars
+    // or when the caller sets any [--btn-*] classes in className.
+    const wantsVarHooks =
+      !unstyled &&
+      (forceInlineVars ||
+        (typeof className === "string" && className.includes("[--btn-")));
+
     return (
       <Comp
-        className={cn(buttonVariants({ variant, size, className }))}
         ref={ref}
+        data-slot="button"
+        className={
+          unstyled
+            ? cn(
+                "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap disabled:pointer-events-none disabled:opacity-50",
+                className,
+              )
+            : cn(
+                buttonVariants({ variant, size }),
+                wantsVarHooks && [
+                  // Color var hooks (apply only when CSS vars are provided)
+                  "text-[var(--btn-fg)]",
+                  "bg-[var(--btn-bg)]",
+                  "hover:bg-[var(--btn-hover-bg)]",
+                  "hover:text-[var(--btn-hover-fg)]",
+                  // explicit dark variants to compete with dark: utilities from variants like outline
+                  "dark:bg-[var(--btn-bg)]",
+                  "dark:hover:bg-[var(--btn-hover-bg)]",
+                  "dark:hover:text-[var(--btn-hover-fg)]",
+                  // Focus ring and border hooks
+                  "focus-visible:ring-[var(--btn-ring)]",
+                  "border-[var(--btn-border)]",
+                  "dark:border-[var(--btn-border)]",
+                ],
+                className,
+              )
+        }
+        style={finalStyle}
         {...props}
       />
     );
   },
 );
+
 Button.displayName = "Button";
 
 export { Button, buttonVariants };

package/dist/kits/auth-core/components/ui/input.tsx

@@ -2,8 +2,7 @@ import * as React from "react";
 
 import { cn } from "@/lib/utils";
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
+export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
   ({ className, type, ...props }, ref) => {
@@ -11,7 +10,10 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
       <input
         type={type}
         className={cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          // Base structural + token fallbacks
+          "border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/30 dark:aria-invalid:focus-visible:ring-destructive/40 flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
+          // CSS variable hooks (preset-first). When vars are unset, these are ignored and tokens above apply.
+          "focus-visible:ring-offset-background border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-[var(--input-focus-ring,var(--ring))] focus-visible:ring-offset-2",
           className,
         )}
         ref={ref}

package/dist/kits/auth-core/components/ui/label.tsx

@@ -1,18 +1,24 @@
-"use client";
-
 import * as React from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
+import { cva, type VariantProps } from "class-variance-authority";
 
 import { cn } from "@/lib/utils";
 
+const labelVariants = cva(
+  "text-sm leading-none font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+);
+
 const Label = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
+    VariantProps<typeof labelVariants>
 >(({ className, ...props }, ref) => (
   <LabelPrimitive.Root
     ref={ref}
     className={cn(
-      "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+      labelVariants(),
+      // Optional color override via var; falls back to inherited color when unset
+      "text-[var(--label-fg)]",
       className,
     )}
     {...props}

package/dist/kits/forms/.nextworks/docs/FORMS_QUICKSTART.md

@@ -30,6 +30,7 @@ How to try it locally
    http://localhost:3000/examples/forms/basic
 
 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.
+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.
 
 Tip: If you change the Prisma schema, run:
 npx prisma generate

package/dist/kits/forms/.nextworks/docs/FORMS_README.md

@@ -21,6 +21,7 @@ What the kit includes
 Notes
 
 - The forms primitives are UI-only and do not require Prisma or NextAuth.
+- 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`.
 - The wizard example assumes a basic app/api/wizard/route.ts endpoint; adjust it as needed for your project.
 - Keep this kit folder in sync with cli_manifests/forms_manifest.json.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nextworks",
-  "version": "0.1.0-alpha.4",
+  "version": "0.1.0-alpha.5",
   "description": "Nextworks CLI - Feature kits installer for Next.js apps",
   "main": "dist/index.js",
   "bin": {