chore: app kit pack (#40)

MarioCadenas · web-flow · commit 906175268a46 · 2025-11-28T07:04:50.000-08:00
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,6 @@
 dist
 build
+tmp
 node_modules
 .env
 
@@ -8,6 +9,4 @@ coverage
 *.tsbuildinfo
 docs
 
-routeTree.gen.ts
-
 .turbo
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -67,13 +67,3 @@ will run all the builds and then start the app project. In order to make this wo
 ```
 DATABRICKS_HOST=
 ```
-
-## Adding new packages
-
-To add a new sdk package, run the following command
-
-```
-pnpm create-package
-```
-
-It will prompt for a name and the type of package (backend or frontend).
diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-# apps-sdk
+# App Kit
 
 ## Contributing
 
diff --git a/apps/dev-playground/client/src/components/ui/chart.tsx b/apps/dev-playground/client/src/components/ui/chart.tsx
@@ -109,7 +109,7 @@ const ChartTooltipContent = React.forwardRef<
       indicator?: "line" | "dot" | "dashed";
       nameKey?: string;
       labelKey?: string;
-    }
+    } & { payload?: any[]; label?: string }
 >(
   (
     {
@@ -261,7 +261,8 @@ const ChartLegend = RechartsPrimitive.Legend;
 const ChartLegendContent = React.forwardRef<
   HTMLDivElement,
   React.ComponentProps<"div"> &
-    Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+    Pick<RechartsPrimitive.LegendProps, "verticalAlign"> & {
+      payload?: RechartsPrimitive.LegendPayload[];
       hideIcon?: boolean;
       nameKey?: string;
     }
diff --git a/apps/dev-playground/client/src/routes/__root.tsx b/apps/dev-playground/client/src/routes/__root.tsx
@@ -28,7 +28,7 @@ function RootComponent() {
                 className="no-underline text-inherit hover:opacity-80 transition-opacity"
               >
                 <h4 className="text-xl font-semibold tracking-tight">
-                  Apps SDK
+                  App Kit Playground
                 </h4>
               </Link>
               <div className="flex gap-3">
diff --git a/apps/dev-playground/client/src/routes/analytics.route.tsx b/apps/dev-playground/client/src/routes/analytics.route.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck
 import { useAnalyticsQuery } from "@databricks/app-kit-ui/react";
 import { createFileRoute, retainSearchParams } from "@tanstack/react-router";
 import { useMemo, useState } from "react";
diff --git a/apps/dev-playground/client/src/routes/data-visualization.route.tsx b/apps/dev-playground/client/src/routes/data-visualization.route.tsx
@@ -81,7 +81,7 @@ function DataVisualizationRoute() {
       <div className="max-w-[1200px] mx-auto px-6 py-12">
         <Header
           title="Data Visualization"
-          description="Explore powerful and customizable chart components from the Apps SDK."
+          description="Explore powerful and customizable chart components from the App Kit."
           tooltip="Showcase of BarChart, AreaChart, LineChart, PieChart, and RadarChart components"
         />
 
diff --git a/apps/dev-playground/client/src/routes/index.tsx b/apps/dev-playground/client/src/routes/index.tsx
@@ -21,10 +21,10 @@ function IndexRoute() {
       <div className="max-w-6xl mx-auto px-6 py-20">
         <div className="text-center mb-16">
           <h1 className="text-5xl font-bold text-gray-900 mb-4">
-            Apps SDK Playground
+            App Kit Playground
           </h1>
           <p className="text-xl text-gray-600 max-w-2xl mx-auto">
-            Explore the capabilities of the Apps SDK with interactive examples
+            Explore the capabilities of the App Kit with interactive examples
             and demos
           </p>
         </div>
@@ -107,7 +107,7 @@ function IndexRoute() {
 
         <div className="text-center pt-12 border-t border-gray-200">
           <p className="text-sm text-gray-500">
-            built by databricks using apps sdk
+            built by databricks using app-kit
           </p>
         </div>
       </div>
diff --git a/apps/dev-playground/config/appKitTypes.d.ts b/apps/dev-playground/config/appKitTypes.d.ts
@@ -1,5 +1,5 @@
 // Auto-generated by AppKit - DO NOT EDIT
-// Generated at: 2025-11-27T16:48:55.599Z
+// Generated at: 2025-11-28T12:10:49.910Z
 
 import "@databricks/app-kit-ui/react";
 
diff --git a/apps/dev-playground/package.json b/apps/dev-playground/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "sdk-playground",
+  "name": "app-kit",
   "version": "1.0.0",
   "main": "build/index.js",
   "scripts": {
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
     "check": "biome check .",
     "check:licenses": "tsx tools/check-licenses.ts",
     "build:notice": "tsx tools/build-notice.ts > NOTICE.md",
+    "deploy:playground": "pnpm pack:sdk && tsx tools/playground/deploy-playground.ts",
     "clean:full": "rm -rf node_modules dist coverage && pnpm -r clean:full",
     "clean": "pnpm -r clean",
     "dev": "pnpm build && NODE_ENV=development turbo watch build:watch dev",
@@ -19,7 +20,7 @@
     "format": "biome format --write .",
     "lint:fix": "biome lint --write .",
     "lint": "biome lint .",
-    "pack:sdk": "pnpm build && pnpm --filter=@databricks/app-kit --filter=@databricks/app-kit-ui pack",
+    "pack:sdk": "pnpm build && pnpm -r dist",
     "prepare": "husky",
     "publish:dry": "pnpm publish --dry-run",
     "release:dry": "pnpm run build:sdk && pnpm run pack && pnpm run publish:dry",
@@ -48,6 +49,7 @@
     "jsdom": "^27.0.0",
     "lint-staged": "^15.5.1",
     "plop": "^4.0.4",
+    "publint": "^0.3.15",
     "tsdown": "^0.15.7",
     "tsx": "^4.20.6",
     "turbo": "^2.6.1",
diff --git a/packages/app-kit-ui/package.json b/packages/app-kit-ui/package.json
@@ -22,9 +22,10 @@
   "scripts": {
     "build:package": "tsdown --config tsdown.config.ts",
     "build:watch": "tsdown --config tsdown.config.ts --watch",
+    "dist": "tsx ../../tools/dist.ts && npm pack ./tmp --pack-destination ./tmp",
     "typecheck": "tsc --noEmit",
-    "clean": "rm -rf dist",
-    "clean:full": "rm -rf dist node_modules"
+    "clean": "rm -rf dist tmp",
+    "clean:full": "rm -rf dist node_modules tmp"
   },
   "dependencies": {
     "@radix-ui/react-checkbox": "^1.3.3",
diff --git a/packages/app-kit-ui/tsdown.config.ts b/packages/app-kit-ui/tsdown.config.ts
@@ -2,6 +2,7 @@ import { defineConfig } from "tsdown";
 
 export default defineConfig([
   {
+    publint: true,
     name: "@databricks/app-kit-ui",
     entry: ["src/js/index.ts", "src/react/index.ts"],
     outDir: "dist",
diff --git a/packages/app-kit/package.json b/packages/app-kit/package.json
@@ -21,9 +21,9 @@
     "build:package": "tsdown --config tsdown.config.ts",
     "build:watch": "tsdown --config tsdown.config.ts --watch",
     "typecheck": "tsc --noEmit",
-    "pack": "cd tmp && npm pack",
-    "clean": "rm -rf dist",
-    "clean:full": "rm -rf dist node_modules"
+    "dist": "tsx ../../tools/dist.ts && npm pack ./tmp --pack-destination ./tmp",
+    "clean": "rm -rf dist tmp",
+    "clean:full": "rm -rf dist node_modules tmp"
   },
   "dependencies": {
     "@databricks/sdk-experimental": "^0.14.2",
diff --git a/packages/app-kit/src/server/dev-mode.ts b/packages/app-kit/src/server/dev-mode.ts
@@ -11,6 +11,7 @@ import { mergeConfigDedup } from "../utils";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
+const MAX_ASSET_FETCH_TIMEOUT = 30_000;
 
 interface DevFileReader {
   registerTunnelGetter(
@@ -87,7 +88,7 @@ export class DevModeManager {
         const timeout = setTimeout(() => {
           pendingFetches.delete(requestId);
           reject(new Error("Asset fetch timeout"));
-        }, 15_000);
+        }, MAX_ASSET_FETCH_TIMEOUT);
 
         pendingFetches.set(requestId, { resolve, reject, timeout });
 
diff --git a/packages/app-kit/src/server/index.ts b/packages/app-kit/src/server/index.ts
@@ -26,6 +26,7 @@ export class ServerPlugin extends Plugin {
   public envVars = ["DATABRICKS_APP_PORT", "FLASK_RUN_HOST"];
   public static DEFAULT_CONFIG = {
     autoStart: true,
+    staticPath: path.resolve(process.cwd(), "client", "dist"),
     host: process.env.FLASK_RUN_HOST || "0.0.0.0",
     port: Number(process.env.DATABRICKS_APP_PORT) || 8000,
     watch: process.env.NODE_ENV === "development",
diff --git a/packages/app-kit/tsdown.config.ts b/packages/app-kit/tsdown.config.ts
@@ -2,6 +2,7 @@ import { defineConfig } from "tsdown";
 
 export default defineConfig([
   {
+    publint: true,
     name: "@databricks/app-kit",
     entry: "src/index.ts",
     outDir: "dist",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/tools/dist.ts b/tools/dist.ts
@@ -0,0 +1,21 @@
+import fs from "node:fs";
+import path from "node:path";
+
+const __dirname = path.dirname(new URL(import.meta.url).pathname);
+
+fs.mkdirSync("tmp", { recursive: true });
+
+const pkg = JSON.parse(fs.readFileSync("package.json", "utf-8"));
+
+delete pkg.dependencies.shared;
+
+pkg.exports = pkg.publishConfig.exports;
+delete pkg.publishConfig.exports;
+
+fs.writeFileSync("tmp/package.json", JSON.stringify(pkg, null, 2));
+
+fs.cpSync("dist", "tmp/dist", { recursive: true });
+
+fs.copyFileSync(path.join(__dirname, "../llms.txt"), "tmp/llms.txt");
+fs.copyFileSync(path.join(__dirname, "../README.md"), "tmp/README.md");
+fs.copyFileSync(path.join(__dirname, "../LICENSE"), "tmp/LICENSE");
diff --git a/tools/playground/deploy-playground.ts b/tools/playground/deploy-playground.ts
diff --git a/tools/playground/prepared-files/client-tsconfig.json b/tools/playground/prepared-files/client-tsconfig.json
diff --git a/tools/playground/prepared-files/client-viteconfig.ts b/tools/playground/prepared-files/client-viteconfig.ts
diff --git a/tools/playground/prepared-files/root-tsconfig.json b/tools/playground/prepared-files/root-tsconfig.json

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-# apps-sdk`
	`1`	`+# App Kit`
`2`	`2`
`3`	`3`	`## Contributing`
`4`	`4`
Original file line number	Diff line number	Diff line change
`@@ -109,7 +109,7 @@ const ChartTooltipContent = React.forwardRef<`
`109`	`109`	`indicator?: "line" \| "dot" \| "dashed";`
`110`	`110`	`nameKey?: string;`
`111`	`111`	`labelKey?: string;`
`112`		`- }`
	`112`	`+ } & { payload?: any[]; label?: string }`
`113`	`113`	`>(`
`114`	`114`	`(`
`115`	`115`	`{`
`@@ -261,7 +261,8 @@ const ChartLegend = RechartsPrimitive.Legend;`
`261`	`261`	`const ChartLegendContent = React.forwardRef<`
`262`	`262`	`HTMLDivElement,`
`263`	`263`	`React.ComponentProps<"div"> &`
`264`		`- Pick<RechartsPrimitive.LegendProps, "payload" \| "verticalAlign"> & {`
	`264`	`+ Pick<RechartsPrimitive.LegendProps, "verticalAlign"> & {`
	`265`	`+ payload?: RechartsPrimitive.LegendPayload[];`
`265`	`266`	`hideIcon?: boolean;`
`266`	`267`	`nameKey?: string;`
`267`	`268`	`}`
Original file line number	Diff line number	Diff line change
`@@ -28,7 +28,7 @@ function RootComponent() {`
`28`	`28`	`className="no-underline text-inherit hover:opacity-80 transition-opacity"`
`29`	`29`	`>`
`30`	`30`	`<h4 className="text-xl font-semibold tracking-tight">`
`31`		`- Apps SDK`
	`31`	`+ App Kit Playground`
`32`	`32`	`</h4>`
`33`	`33`	`</Link>`
`34`	`34`	`<div className="flex gap-3">`
Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,4 @@`
	`1`	`+// @ts-nocheck`
`1`	`2`	`import { useAnalyticsQuery } from "@databricks/app-kit-ui/react";`
`2`	`3`	`import { createFileRoute, retainSearchParams } from "@tanstack/react-router";`
`3`	`4`	`import { useMemo, useState } from "react";`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`{`
`2`		`- "name": "sdk-playground",`
	`2`	`+ "name": "app-kit",`
`3`	`3`	`"version": "1.0.0",`
`4`	`4`	`"main": "build/index.js",`
`5`	`5`	`"scripts": {`