diff --git a/packages/kilo-docs/components/CopyLine.tsx b/packages/kilo-docs/components/CopyLine.tsx new file mode 100644 index 0000000000..39f9cf548e --- /dev/null +++ b/packages/kilo-docs/components/CopyLine.tsx @@ -0,0 +1,99 @@ +import * as React from "react" +import { Codicon } from "./Codicon" + +interface CopyLineProps { + text: string +} + +export function CopyLine({ text }: CopyLineProps) { + const timeout = React.useRef(null) + const [copied, setCopied] = React.useState(false) + + React.useEffect(() => { + return () => { + if (timeout.current) { + clearTimeout(timeout.current) + } + } + }, []) + + const copy = async () => { + try { + await navigator.clipboard.writeText(text) + setCopied(true) + if (timeout.current) { + clearTimeout(timeout.current) + } + timeout.current = setTimeout(() => setCopied(false), 2000) + } catch (err) { + console.error("Failed to copy line:", err) + } + } + + return ( +
+ +
+        {text}
+      
+ +
+ ) +} diff --git a/packages/kilo-docs/components/index.js b/packages/kilo-docs/components/index.js index 95694ac103..26fed7dc32 100644 --- a/packages/kilo-docs/components/index.js +++ b/packages/kilo-docs/components/index.js @@ -2,6 +2,7 @@ export * from "./Callout" export * from "./CodeBlock" export * from "./Codicon" export * from "./CopyPageButton" +export * from "./CopyLine" export * from "./Heading" export * from "./Icon" export * from "./Image" diff --git a/packages/kilo-docs/markdoc/partials/install-jetbrains.md b/packages/kilo-docs/markdoc/partials/install-jetbrains.md index 9c47fd7ba1..564946254c 100644 --- a/packages/kilo-docs/markdoc/partials/install-jetbrains.md +++ b/packages/kilo-docs/markdoc/partials/install-jetbrains.md @@ -48,9 +48,7 @@ To install the EAP build and receive updates: 3. Click the gear icon and choose **Manage Plugin Repositories** 4. Add this repository URL: -```text -https://plugins.jetbrains.com/plugins/list?channel=eap&pluginId=28350 -``` +{% copyLine text="https://plugins.jetbrains.com/plugins/list?channel=eap&pluginId=28350" /%} 5. Return to the **Marketplace** tab 6. Search for **Kilo Code** diff --git a/packages/kilo-docs/markdoc/tags/copy-line.markdoc.ts b/packages/kilo-docs/markdoc/tags/copy-line.markdoc.ts new file mode 100644 index 0000000000..51ef53e931 --- /dev/null +++ b/packages/kilo-docs/markdoc/tags/copy-line.markdoc.ts @@ -0,0 +1,13 @@ +import { CopyLine } from "../../components" + +export const copyLine = { + render: CopyLine, + selfClosing: true, + attributes: { + text: { + type: String, + required: true, + description: "The exact one-line text to display and copy", + }, + }, +} diff --git a/packages/kilo-docs/markdoc/tags/index.ts b/packages/kilo-docs/markdoc/tags/index.ts index 30d74d45ae..7e2a84d4f1 100644 --- a/packages/kilo-docs/markdoc/tags/index.ts +++ b/packages/kilo-docs/markdoc/tags/index.ts @@ -1,6 +1,7 @@ /* Use this file to export your markdoc tags */ export * from "./callout.markdoc" export * from "./codicon.markdoc" +export * from "./copy-line.markdoc" export * from "./tabs.markdoc" export * from "./icon.markdoc" export * from "./image.markdoc"