From ecd443540e87ddaaae122b5a0d6c1ddcaac1813c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Mon, 2 Feb 2026 23:57:52 +0000
Subject: [PATCH 01/13] Initial plan
From b002ac5888ef783b38f347b0dd558bee5e0de980 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 3 Feb 2026 00:00:58 +0000
Subject: [PATCH 02/13] Add usage instructions and experimental warning to HTTP
typekits documentation
Co-authored-by: markcowl <1054056+markcowl@users.noreply.github.com>
---
.../libraries/http/reference/typekits.mdx | 28 ++++++++++++++++++-
1 file changed, 27 insertions(+), 1 deletion(-)
diff --git a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
index dbb44a734a6..5d5e15f811b 100644
--- a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
+++ b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
@@ -2,7 +2,33 @@
title: "[API] Typekits"
---
-import { Badge } from '@astrojs/starlight/components';
+import { Badge, Aside } from '@astrojs/starlight/components';
+
+
+
+## Usage
+
+To use HTTP typekits in your TypeSpec emitter or tool, you need to import the experimental typekit module:
+
+```ts
+import "@typespec/http/experimental/typekit";
+import { $ } from "@typespec/compiler/typekit";
+```
+
+The first import registers the HTTP-specific typekit extensions. This import only needs to exist once in your compilation as only its side effects are important.
+
+### Example
+
+```ts
+import { getHttpOperation } from "@typespec/http";
+import { $ } from "@typespec/compiler/typekit";
+import "@typespec/http/experimental/typekit";
+
+const [httpOperation] = getHttpOperation(program, operation);
+const responses = $(program).httpOperation.flattenResponses(httpOperation);
+```
## model
From f6c5749be8fa772b74e0c6e6336f4f5a1519cad4 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 24 Feb 2026 02:11:21 +0000
Subject: [PATCH 03/13] Merge latest main to fix website build issues
Co-authored-by: markcowl <1054056+markcowl@users.noreply.github.com>
---
.../libraries/http/reference/typekits.mdx | 28 +------------------
1 file changed, 1 insertion(+), 27 deletions(-)
diff --git a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
index 5d5e15f811b..dbb44a734a6 100644
--- a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
+++ b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
@@ -2,33 +2,7 @@
title: "[API] Typekits"
---
-import { Badge, Aside } from '@astrojs/starlight/components';
-
-
-
-## Usage
-
-To use HTTP typekits in your TypeSpec emitter or tool, you need to import the experimental typekit module:
-
-```ts
-import "@typespec/http/experimental/typekit";
-import { $ } from "@typespec/compiler/typekit";
-```
-
-The first import registers the HTTP-specific typekit extensions. This import only needs to exist once in your compilation as only its side effects are important.
-
-### Example
-
-```ts
-import { getHttpOperation } from "@typespec/http";
-import { $ } from "@typespec/compiler/typekit";
-import "@typespec/http/experimental/typekit";
-
-const [httpOperation] = getHttpOperation(program, operation);
-const responses = $(program).httpOperation.flattenResponses(httpOperation);
-```
+import { Badge } from '@astrojs/starlight/components';
## model
From aa2b62320948f95c9967a6a9834de52252a1aeee Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 24 Feb 2026 02:11:59 +0000
Subject: [PATCH 04/13] Revert "Merge latest main to fix website build issues"
This reverts commit f6c5749be8fa772b74e0c6e6336f4f5a1519cad4.
---
.../libraries/http/reference/typekits.mdx | 28 ++++++++++++++++++-
1 file changed, 27 insertions(+), 1 deletion(-)
diff --git a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
index dbb44a734a6..5d5e15f811b 100644
--- a/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
+++ b/website/src/content/docs/docs/libraries/http/reference/typekits.mdx
@@ -2,7 +2,33 @@
title: "[API] Typekits"
---
-import { Badge } from '@astrojs/starlight/components';
+import { Badge, Aside } from '@astrojs/starlight/components';
+
+
+
+## Usage
+
+To use HTTP typekits in your TypeSpec emitter or tool, you need to import the experimental typekit module:
+
+```ts
+import "@typespec/http/experimental/typekit";
+import { $ } from "@typespec/compiler/typekit";
+```
+
+The first import registers the HTTP-specific typekit extensions. This import only needs to exist once in your compilation as only its side effects are important.
+
+### Example
+
+```ts
+import { getHttpOperation } from "@typespec/http";
+import { $ } from "@typespec/compiler/typekit";
+import "@typespec/http/experimental/typekit";
+
+const [httpOperation] = getHttpOperation(program, operation);
+const responses = $(program).httpOperation.flattenResponses(httpOperation);
+```
## model
From 7b6e19e72d5468b45b4d6c37f71e682dcde3978c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 3 Mar 2026 03:45:17 +0000
Subject: [PATCH 05/13] Add experimental warning and usage docs to
auto-generated typekit documentation
Co-authored-by: markcowl <1054056+markcowl@users.noreply.github.com>
---
.../src/ref-doc/components/typekits-file.tsx | 50 ++++++++++++++++++-
packages/tspd/src/ref-doc/typekit-docs.ts | 21 ++++++--
.../libraries/http/reference/typekits.mdx | 4 +-
.../standard-library/reference/typekits.mdx | 26 +++++++++-
4 files changed, 93 insertions(+), 8 deletions(-)
diff --git a/packages/tspd/src/ref-doc/components/typekits-file.tsx b/packages/tspd/src/ref-doc/components/typekits-file.tsx
index c63e8a81e1d..2b95abb8da7 100644
--- a/packages/tspd/src/ref-doc/components/typekits-file.tsx
+++ b/packages/tspd/src/ref-doc/components/typekits-file.tsx
@@ -12,16 +12,62 @@ import { format as prettierFormat } from "prettier";
import { TypekitCollection } from "../typekit-docs.js";
import { TypekitSection } from "./typekit-section.js";
-export function createTypekitDocs(typekit: TypekitCollection) {
+export function createTypekitDocs(typekit: TypekitCollection, packageName?: string) {
+ const isHttpPackage = packageName === "@typespec/http";
+ const experimentalImport = isHttpPackage
+ ? `import "@typespec/http/experimental/typekit";`
+ : `import "@typespec/compiler/typekit";`;
+
+ const usageExample = isHttpPackage
+ ? `\`\`\`ts
+import { getHttpOperation } from "@typespec/http";
+import { $ } from "@typespec/compiler/typekit";
+import "@typespec/http/experimental/typekit";
+
+const [httpOperation] = getHttpOperation(program, operation);
+const responses = $(program).httpOperation.flattenResponses(httpOperation);
+\`\`\``
+ : `\`\`\`ts
+import { $ } from "@typespec/compiler/typekit";
+
+// Use typekits in your code
+const arrayType = $(program).array.create(stringType);
+\`\`\``;
+
const jsxContent = (