Something went wrong. Try again.
Monorepo for Tangled forked from tangled.org/core
Something went wrong. Try again.
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253<script lang="ts"> import GitBranch from "$icon/git-branch"; import Github from "$icon/github";
interface Props { value: "github" | "url"; onSelect: (v: "github" | "url") => void; }
let { value, onSelect }: Props = $props();
const methods = [ { value: "github", icon: Github, title: "GitHub", description: "Import a GitHub repository to your Tangled account." }, { value: "url", icon: GitBranch, title: "Git URL", description: "Import any Git repository from an URL to your Tangled account." } ] as const;</script>
<div class="grid gap-xs rounded-md border border-border-default bg-background-subtle p-xs sm:grid-cols-2"> {#each methods as method (method.value)} {@const Icon = method.icon} {@const selected = value === method.value} <button type="button" data-value={method.value} aria-pressed={selected} onclick={() => onSelect(method.value)} class="cursor-pointer rounded-md border border-border-default p-md text-left transition-colors {selected ? 'bg-background-default shadow-xs' : 'bg-background-subtle hover:bg-background-inset'}" > <span class="flex items-center gap-xs typography-paragraph-regular font-medium"> <Icon class="size-4" aria-hidden="true" /> {method.title} </span> <span class="mt-xs block typography-paragraph-small text-foreground-muted"> {method.description} </span> </button> {/each}</div>