move tsx kit -> uikit

CLAUDE.md

@@ -57,7 +57,7 @@ go -C go test ./...
   scaffolding. Apps import as `@kjol/*`. (Concrete permission constants stay app-side.)
 
 **Frontend import aliases** (resolved by the bundler and mirrored in each app's tsconfig
-`paths`): `@ui/*` → `web/kit`, `@kjol/*` → `web/`, `@appgen/*` → the app's generated dir
+`paths`): `@ui/*` → `web/uikit`, `@kjol/*` → `web/`, `@appgen/*` → the app's generated dir
 (e.g. the FA `faIcons` registry — app-owned, gitignored, regenerated each build). The kit's
 own imports of sibling components stay relative (`./Buttons.tsx`).
 

go/bundler/alias.go

@@ -19,7 +19,7 @@ import (
 func aliasRoots() map[string]string {
 	abs := func(p string) string { a, _ := filepath.Abs(p); return a }
 	return map[string]string{
-		"@ui":     abs(kitSrcDir()),
+		"@ui":     abs(uikitDir()),
 		"@kjol":   abs(webRoot()),
 		"@appgen": abs(genTSDir),
 	}

go/bundler/config.go

@@ -57,10 +57,10 @@ func webRoot() string {
 	return frontendDir
 }
 
-// kitSrcDir is where the shared Solid component kit lives (@ui/* root).
+// uikitDir is where the shared Solid component kit lives (@ui/* root).
-func kitSrcDir() string {
+func uikitDir() string {
 	if webDir != "" {
-		return filepath.Join(webDir, "kit")
+		return filepath.Join(webDir, "uikit")
 	}
 	return filepath.Join(frontendDir, "src", "ui")
 }

go/bundler/crosstree_test.go

@@ -9,7 +9,7 @@ import (
 
 // TestCrossTreeJSBundle proves the bundler resolves the shared kit across the
 // app/kjol tree boundary: a temp app entry imports @ui/Buttons, which pulls the
-// real kjol web/kit (Buttons -> ./Icons -> @appgen/faIcons stub) and the solid
+// real kjol web/uikit (Buttons -> ./Icons -> @appgen/faIcons stub) and the solid
 // runtime from web/runtime. If the alias plugin, merged vendor manifest, and
 // multi-dir NodePaths all work, esbuild produces a non-empty bundle.
 func TestCrossTreeJSBundle(t *testing.T) {
@@ -17,7 +17,7 @@ func TestCrossTreeJSBundle(t *testing.T) {
 	if err != nil {
 		t.Fatal(err)
 	}
-	if _, err := os.Stat(filepath.Join(webAbs, "kit", "Buttons.tsx")); err != nil {
+	if _, err := os.Stat(filepath.Join(webAbs, "uikit", "Buttons.tsx")); err != nil {
 		t.Skipf("kjol web kit not present (%v)", err)
 	}
 
@@ -62,7 +62,7 @@ func TestCrossTreeCSS(t *testing.T) {
 	if err != nil {
 		t.Fatal(err)
 	}
-	if _, err := os.Stat(filepath.Join(webAbs, "kit")); err != nil {
+	if _, err := os.Stat(filepath.Join(webAbs, "uikit")); err != nil {
 		t.Skipf("kjol web kit not present (%v)", err)
 	}
 

go/bundler/css.go

@@ -73,7 +73,7 @@ func compileCSSBundle(label string, twSources []string, outName string) (bundleS
 	// dir) plus the shared kit tree scanned directly, so kit component classes are
 	// present even though the kit lives outside the app frontend.
 	candidates := scanSources(cssDir, twSources)
-	kitCands := scanSources(kitSrcDir(), []string{"**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"})
+	kitCands := scanSources(uikitDir(), []string{"**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"})
 	candidates = dedupStrings(append(candidates, kitCands...))
 
 	// Prepend the shared @theme scaffold (kjol web/styles/theme.css) ahead of the

go/bundler/faicons.go

@@ -48,7 +48,7 @@ func generateFAIcons() error {
 
 	// Scan both the app pages and the shared kit so every icon either tree
 	// references ends up in this app's registry.
-	names, custom, err := scanIconNames([]string{filepath.Join(frontendDir, "src"), kitSrcDir()})
+	names, custom, err := scanIconNames([]string{filepath.Join(frontendDir, "src"), uikitDir()})
 	if err != nil {
 		return fmt.Errorf("scanning icon names: %w", err)
 	}

web/auth/ProtectedRoute.ts

@@ -3,7 +3,7 @@ import html from "solid-js/html";
 import { useAuth } from "./AuthContext.ts";
 import { getToken } from "./useAuthFetch.js";
 import { hasPermission } from "./permissions.ts";
-import { Loader } from "../kit/General.tsx";
+import { Loader } from "../uikit/General.tsx";
 
 interface ProtectedRouteProps {
     permissions?: string[];

web/uikit/AutoTable.tsx

@@ -4183,31 +4183,32 @@ function PaginationButton(props: JSX.ButtonHTMLAttributes<HTMLButtonElement>) {
 
 interface TdProps {
     class?: string;
+    style?: string;
     children: any;
 }
 
 export function TdLeft(props: TdProps) {
-    return <td class={"text-left " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-left " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export function TdRight(props: TdProps) {
-    return <td class={"text-right " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-right " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export function TdCenter(props: TdProps) {
-    return <td class={"text-center " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-center " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export function TdUniformLeft(props: TdProps) {
-    return <td class={"text-left " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-left " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export function TdUniformRight(props: TdProps) {
-    return <td class={"text-right " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-right " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export function TdUniformCenter(props: TdProps) {
-    return <td class={"text-center " + (props.class || "")}>{props.children}</td>;
+    return <td class={"text-center " + (props.class || "")} style={props.style}>{props.children}</td>;
 }
 
 export default AutoTable;

web/uikit/General.tsx

@@ -60,9 +60,9 @@ export function PageLink(props: PageLinkProps) {
     );
 }
 
-export function Loader() {
+export function Loader(props: { class?: string; style?: string }) {
     return (
-        <div class="flex items-center justify-center p-8">
+        <div class={"flex items-center justify-center p-8 " + (props.class || "")} style={props.style}>
             <div class="h-8 w-8 border-4 border-sky-700 border-t-transparent rounded-full animate-spin"></div>
         </div>
     );