CodeTabs

<script lang="ts">
	import CodeTabs from '@tcpsystems/ui/foundation/CodeTabs';
	const items = [
		{ id: 'pnpm', label: 'pnpm', code: 'pnpm add @tcpsystems/ui', lang: 'bash' },
		{ id: 'npm', label: 'npm', code: 'npm install @tcpsystems/ui', lang: 'bash' },
		{ id: 'yarn', label: 'yarn', code: 'yarn add @tcpsystems/ui', lang: 'bash' }
	];
</script>

<CodeTabs {items} label="Install command" />

<script lang="ts">
	import CodeTabs from '@tcpsystems/ui/foundation/CodeTabs';
	const items = [
		{ id: 'curl', label: 'curl', lang: 'bash', code: 'curl https://search.tcp.systems/v1/search \\\n  -H "Authorization: Bearer $TCP_KEY" \\\n  -d \'{"query":"svelte 5 runes"}\'' },
		{ id: 'ts', label: 'TypeScript', lang: 'ts', code: "const res = await fetch('https://search.tcp.systems/v1/search', {\n  method: 'POST',\n  headers: { Authorization: `Bearer ${key}` },\n  body: JSON.stringify({ query: 'svelte 5 runes' })\n});" },
		{ id: 'go', label: 'Go', lang: 'go', code: 'req, _ := http.NewRequest("POST", url, body)\nreq.Header.Set("Authorization", "Bearer "+key)\nres, err := http.DefaultClient.Do(req)' }
	];
</script>

<CodeTabs {items} label="Search request" />

<script lang="ts">
	import CodeTabs from '@tcpsystems/ui/foundation/CodeTabs';
	const items = [
		{ id: 'toml', label: 'studio.toml', lang: 'toml', code: '[server]\nlisten = ":8080"\nlog_level = "info"' },
		{ id: 'json', label: 'studio.json', lang: 'json', code: '{\n  "server": {\n    "listen": ":8080",\n    "log_level": "info"\n  }\n}' }
	];
</script>

<CodeTabs {items} label="Config formats" />

<script lang="ts">
	import CodeTabs from '@tcpsystems/ui/foundation/CodeTabs';
	const items = [{ id: 'sh', label: 'Shell', lang: 'bash', code: 'tcp login\ntcp whoami' }];
</script>

<CodeTabs {items} label="Sign in" />