form 1 topics added

This commit is contained in:
2026-07-05 11:12:45 -04:00
parent a614532810
commit a23fa53772
58 changed files with 7089 additions and 475 deletions

View File

@@ -1,7 +1,7 @@
import { cn } from "@/lib/utils";
import { type HTMLAttributes } from "react";
type BadgeVariant = "default" | "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5" | "unit-6";
type BadgeVariant = "default" | "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5" | "unit-6" | "unit-7" | "unit-8";
interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
variant?: BadgeVariant;
@@ -15,6 +15,8 @@ const variantStyles: Record<BadgeVariant, string> = {
"unit-4": "border border-unit-4/20 bg-unit-4-light text-unit-4-dark",
"unit-5": "border border-unit-5/20 bg-unit-5-light text-unit-5-dark",
"unit-6": "border border-unit-6/20 bg-unit-6-light text-unit-6-dark",
"unit-7": "border border-unit-7/20 bg-unit-7-light text-unit-7-dark",
"unit-8": "border border-unit-8/20 bg-unit-8-light text-unit-8-dark",
};
export function Badge({ variant = "default", className, children, ...props }: BadgeProps) {

View File

@@ -1,7 +1,7 @@
import { cn } from "@/lib/utils";
import { type ButtonHTMLAttributes } from "react";
type ButtonVariant = "primary" | "secondary" | "ghost" | "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5";
type ButtonVariant = "primary" | "secondary" | "ghost" | "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5" | "unit-6" | "unit-7" | "unit-8";
type ButtonSize = "sm" | "md" | "lg";
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
@@ -18,6 +18,9 @@ const variantStyles: Record<ButtonVariant, string> = {
"unit-3": "bg-unit-3 text-white shadow-[var(--shadow-sm)] hover:bg-unit-3-dark hover:shadow-[var(--shadow-lg)]",
"unit-4": "bg-unit-4 text-white shadow-[var(--shadow-sm)] hover:bg-unit-4-dark hover:shadow-[var(--shadow-lg)]",
"unit-5": "bg-unit-5 text-white shadow-[var(--shadow-sm)] hover:bg-unit-5-dark hover:shadow-[var(--shadow-lg)]",
"unit-6": "bg-unit-6 text-white shadow-[var(--shadow-sm)] hover:bg-unit-6-dark hover:shadow-[var(--shadow-lg)]",
"unit-7": "bg-unit-7 text-white shadow-[var(--shadow-sm)] hover:bg-unit-7-dark hover:shadow-[var(--shadow-lg)]",
"unit-8": "bg-unit-8 text-white shadow-[var(--shadow-sm)] hover:bg-unit-8-dark hover:shadow-[var(--shadow-lg)]",
};
const sizeStyles: Record<ButtonSize, string> = {

View File

@@ -2,7 +2,7 @@ import { cn } from "@/lib/utils";
import { type HTMLAttributes } from "react";
interface CardProps extends HTMLAttributes<HTMLDivElement> {
accent?: "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5" | "unit-6";
accent?: "unit-1" | "unit-2" | "unit-3" | "unit-4" | "unit-5" | "unit-6" | "unit-7" | "unit-8";
hover?: boolean;
}
@@ -13,6 +13,8 @@ const accentStyles = {
"unit-4": "border-l-4 border-l-unit-4",
"unit-5": "border-l-4 border-l-unit-5",
"unit-6": "border-l-4 border-l-unit-6",
"unit-7": "border-l-4 border-l-unit-7",
"unit-8": "border-l-4 border-l-unit-8",
};
export function Card({

View File

@@ -0,0 +1,29 @@
"use client";
import { useSyncExternalStore, type ReactNode } from "react";
const emptySubscribe = () => () => {};
/**
* Renders its children only after hydration on the client. Use this to wrap UI
* whose initial render is non-deterministic (e.g. seeded with Math.random()),
* which would otherwise cause a server/client hydration mismatch. The
* `fallback` is shown during SSR and the first (hydrating) client render.
*
* Uses useSyncExternalStore rather than a mount effect so there is no
* setState-in-effect and the server/client snapshots stay explicit.
*/
export function ClientOnly({
children,
fallback = null,
}: {
children: ReactNode;
fallback?: ReactNode;
}) {
const isServer = useSyncExternalStore(
emptySubscribe,
() => false,
() => true,
);
return <>{isServer ? fallback : children}</>;
}