mirror of
https://github.com/kunkunsh/kunkun.git
synced 2025-04-11 17:29:44 +00:00
6bd7d71df6
* chore: bump @kksh/svelte5 to 0.1.16 and update dependencies * chore: bump create-kunkun package version to 0.1.46 * chore: update pnpm lock
91 lines
2.4 KiB
Svelte
91 lines
2.4 KiB
Svelte
<script lang="ts">
|
|
import { notification, ui } from "@kksh/api/ui/custom"
|
|
import { Button, Command, Separator, ThemeWrapper, updateTheme } from "@kksh/svelte5"
|
|
import ThemeCustomizer from "$lib/components/ThemeCustomizer.svelte"
|
|
import {
|
|
Calculator,
|
|
Calendar,
|
|
CreditCard,
|
|
Settings,
|
|
SettingsIcon,
|
|
Smile,
|
|
User
|
|
} from "lucide-svelte"
|
|
import { ModeWatcher } from "mode-watcher"
|
|
import { onMount } from "svelte"
|
|
|
|
onMount(() => {
|
|
ui.registerDragRegion()
|
|
ui.getTheme().then((theme) => {
|
|
updateTheme(theme)
|
|
})
|
|
notification.sendNotification("Hello from template-ext-svelte")
|
|
})
|
|
|
|
let highlighted = ""
|
|
$: {
|
|
console.log("highlighted:", highlighted)
|
|
}
|
|
|
|
let searchTerm = ""
|
|
$: {
|
|
console.log("search term:", searchTerm)
|
|
}
|
|
</script>
|
|
|
|
<ModeWatcher />
|
|
|
|
<ThemeWrapper>
|
|
<Command.Root class="h-screen rounded-lg border shadow-md" bind:value={highlighted}>
|
|
<Command.Input placeholder="Type a command or search..." autofocus bind:value={searchTerm} />
|
|
<div class="grow">
|
|
<Command.List>
|
|
<Command.Empty>No results found.</Command.Empty>
|
|
<Command.Group heading="Suggestions">
|
|
<Command.Item>
|
|
<Calendar class="mr-2 h-4 w-4" />
|
|
<span>Calendar</span>
|
|
</Command.Item>
|
|
<Command.Item>
|
|
<Smile class="mr-2 h-4 w-4" />
|
|
<span>Search Emoji</span>
|
|
</Command.Item>
|
|
<Command.Item>
|
|
<Calculator class="mr-2 h-4 w-4" />
|
|
<span>Calculator</span>
|
|
</Command.Item>
|
|
</Command.Group>
|
|
<Command.Separator />
|
|
<Command.Group heading="Settings">
|
|
<Command.Item>
|
|
<User class="mr-2 h-4 w-4" />
|
|
<span>Profile</span>
|
|
<Command.Shortcut>⌘P</Command.Shortcut>
|
|
</Command.Item>
|
|
<Command.Item value="billllling">
|
|
<CreditCard class="mr-2 h-4 w-4" />
|
|
<span>Billing</span>
|
|
<Command.Shortcut>⌘B</Command.Shortcut>
|
|
</Command.Item>
|
|
<Command.Item>
|
|
<Settings class="mr-2 h-4 w-4" />
|
|
<span>Settings</span>
|
|
<Command.Shortcut>⌘S</Command.Shortcut>
|
|
</Command.Item>
|
|
</Command.Group>
|
|
</Command.List>
|
|
</div>
|
|
<div class="flex items-center justify-between">
|
|
<SettingsIcon class="ml-2 h-4 w-4" />
|
|
<div class="flex items-center space-x-2">
|
|
<Button variant="ghost" size="sm">
|
|
Open Application
|
|
<kbd class="ml-1">↵</kbd>
|
|
</Button>
|
|
<Separator orientation="vertical" />
|
|
<ThemeCustomizer />
|
|
</div>
|
|
</div>
|
|
</Command.Root>
|
|
</ThemeWrapper>
|