mirror of
https://github.com/kunkunsh/kunkun.git
synced 2025-04-03 22:26:43 +00:00
UI updates/fixes (#244)
* fix: change icon in manifest * refactor(ui): move BorderBeam component to ui package and update imports * feat(ui): add new animation components and keyframes utility * chore(deps): remove svelte-motion and related dependencies * chore(deps): add svelte-motion and related dependencies * fix(ui): eslint * fix: extension store demo image display * fix(ui): go to settings item in dropdown menu * format
This commit is contained in:
Huakun
GitHub
parent
234f245a9c
commit
b4afcaac6c
@ -2,9 +2,8 @@
|
||||
import { appState } from "@/stores"
|
||||
import { cn } from "@/utils"
|
||||
import { Button } from "@kksh/svelte5"
|
||||
import { Constants, Layouts, TauriLink } from "@kksh/ui"
|
||||
import { BorderBeam, Constants, Layouts, TauriLink } from "@kksh/ui"
|
||||
import { goto } from "$app/navigation"
|
||||
import BorderBeam from "$lib/components/animations/BorderBeam.svelte"
|
||||
import { ArrowLeftIcon, LoaderCircleIcon } from "lucide-svelte"
|
||||
import Dance from "../dance/dance.svelte"
|
||||
|
||||
|
||||
@ -36,7 +36,13 @@
|
||||
import { platform } from "@tauri-apps/plugin-os"
|
||||
import { exit } from "@tauri-apps/plugin-process"
|
||||
import { goto } from "$app/navigation"
|
||||
import { ArrowBigUpIcon, CircleXIcon, EllipsisVerticalIcon, RefreshCcwIcon } from "lucide-svelte"
|
||||
import {
|
||||
ArrowBigUpIcon,
|
||||
CircleXIcon,
|
||||
EllipsisVerticalIcon,
|
||||
RefreshCcwIcon,
|
||||
SettingsIcon
|
||||
} from "lucide-svelte"
|
||||
import { onMount } from "svelte"
|
||||
import { Inspect } from "svelte-inspect-value"
|
||||
|
||||
@ -178,8 +184,8 @@
|
||||
<span class="flex items-center">⌃+<ArrowBigUpIcon class="h-4 w-4" />+R </span>
|
||||
</DropdownMenu.Shortcut>
|
||||
</DropdownMenu.Item>
|
||||
<DropdownMenu.Item onclick={() => location.reload()}>
|
||||
<RefreshCcwIcon class="mr-2 h-4 w-4 text-green-500" />
|
||||
<DropdownMenu.Item onclick={() => goto(i18n.resolveRoute("/app/settings"))}>
|
||||
<SettingsIcon class="mr-2 h-4 w-4 text-green-500" />
|
||||
{m.home_command_input_dropdown_open_preference()}
|
||||
<DropdownMenu.Shortcut>
|
||||
{#if platform() === "macos"}
|
||||
|
||||
@ -78,7 +78,9 @@
|
||||
})
|
||||
|
||||
const demoImages = $derived(
|
||||
extPublish.demo_images.map((src) => supabaseAPI.translateExtensionFilePathToUrl(src))
|
||||
extPublish.demo_images.map((src) =>
|
||||
src.startsWith("http") ? src : supabaseAPI.translateExtensionFilePathToUrl(src)
|
||||
)
|
||||
)
|
||||
|
||||
async function onInstallSelected() {
|
||||
|
||||
@ -9,7 +9,7 @@ import {
|
||||
ShellPermissionScopedSchema
|
||||
} from "../permissions"
|
||||
import { CmdType } from "./extension"
|
||||
import { Icon } from "./icon"
|
||||
import { BaseIcon as Icon } from "./icon"
|
||||
|
||||
export enum OSPlatformEnum {
|
||||
linux = "linux",
|
||||
|
||||
34
packages/svelte-animation/.gitignore
vendored
Normal file
34
packages/svelte-animation/.gitignore
vendored
Normal file
@ -0,0 +1,34 @@
|
||||
# dependencies (bun install)
|
||||
node_modules
|
||||
|
||||
# output
|
||||
out
|
||||
dist
|
||||
*.tgz
|
||||
|
||||
# code coverage
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# logs
|
||||
logs
|
||||
_.log
|
||||
report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json
|
||||
|
||||
# dotenv environment variable files
|
||||
.env
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env.local
|
||||
|
||||
# caches
|
||||
.eslintcache
|
||||
.cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# IntelliJ based IDEs
|
||||
.idea
|
||||
|
||||
# Finder (MacOS) folder config
|
||||
.DS_Store
|
||||
0
packages/svelte-animation/README.md
Normal file
0
packages/svelte-animation/README.md
Normal file
1
packages/svelte-animation/index.ts
Normal file
1
packages/svelte-animation/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export * as keyframes from "./src/keyframes"
|
||||
12
packages/svelte-animation/package.json
Normal file
12
packages/svelte-animation/package.json
Normal file
@ -0,0 +1,12 @@
|
||||
{
|
||||
"name": "@kksh/svelte-animation",
|
||||
"module": "index.ts",
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"devDependencies": {
|
||||
"@types/bun": "latest"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"typescript": "^5"
|
||||
}
|
||||
}
|
||||
63
packages/svelte-animation/src/keyframes.ts
Normal file
63
packages/svelte-animation/src/keyframes.ts
Normal file
@ -0,0 +1,63 @@
|
||||
import type { Config } from "tailwindcss"
|
||||
|
||||
export const shinePulse: NonNullable<NonNullable<Config["theme"]>["extend"]>["keyframes"] = {
|
||||
"border-beam": {
|
||||
"100%": {
|
||||
"offset-distance": "100%"
|
||||
}
|
||||
},
|
||||
"text-gradient": {
|
||||
to: {
|
||||
backgroundPosition: "200% center"
|
||||
}
|
||||
},
|
||||
meteor: {
|
||||
"0%": { transform: "rotate(215deg) translateX(0)", opacity: "1" },
|
||||
"70%": { opacity: "1" },
|
||||
"100%": {
|
||||
transform: "rotate(215deg) translateX(-500px)",
|
||||
opacity: "0"
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
"0%": { transform: "translateY(-50%)" },
|
||||
"100%": { transform: "translateY(0)" }
|
||||
},
|
||||
"aurora-border": {
|
||||
"0%, 100%": { borderRadius: "37% 29% 27% 27% / 28% 25% 41% 37%" },
|
||||
"25%": { borderRadius: "47% 29% 39% 49% / 61% 19% 66% 26%" },
|
||||
"50%": { borderRadius: "57% 23% 47% 72% / 63% 17% 66% 33%" },
|
||||
"75%": { borderRadius: "28% 49% 29% 100% / 93% 20% 64% 25%" }
|
||||
},
|
||||
"aurora-1": {
|
||||
"0%, 100%": { top: "0", right: "0" },
|
||||
"50%": { top: "50%", right: "25%" },
|
||||
"75%": { top: "25%", right: "50%" }
|
||||
},
|
||||
"aurora-2": {
|
||||
"0%, 100%": { top: "0", left: "0" },
|
||||
"60%": { top: "75%", left: "25%" },
|
||||
"85%": { top: "50%", left: "50%" }
|
||||
},
|
||||
"aurora-3": {
|
||||
"0%, 100%": { bottom: "0", left: "0" },
|
||||
"40%": { bottom: "50%", left: "25%" },
|
||||
"65%": { bottom: "25%", left: "50%" }
|
||||
},
|
||||
"aurora-4": {
|
||||
"0%, 100%": { bottom: "0", right: "0" },
|
||||
"50%": { bottom: "25%", right: "40%" },
|
||||
"90%": { bottom: "50%", right: "25%" }
|
||||
},
|
||||
"shine-pulse": {
|
||||
"0%": {
|
||||
"background-position": "0% 0%"
|
||||
},
|
||||
"50%": {
|
||||
"background-position": "100% 100%"
|
||||
},
|
||||
to: {
|
||||
"background-position": "0% 0%"
|
||||
}
|
||||
}
|
||||
}
|
||||
6
packages/svelte-animation/src/utils.ts
Normal file
6
packages/svelte-animation/src/utils.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import { clsx, type ClassValue } from "clsx"
|
||||
import { twMerge } from "tailwind-merge"
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
}
|
||||
27
packages/svelte-animation/tsconfig.json
Normal file
27
packages/svelte-animation/tsconfig.json
Normal file
@ -0,0 +1,27 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
// Enable latest features
|
||||
"lib": ["ESNext", "DOM"],
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
"moduleDetection": "force",
|
||||
"jsx": "react-jsx",
|
||||
"allowJs": true,
|
||||
|
||||
// Bundler mode
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"noEmit": true,
|
||||
|
||||
// Best practices
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
|
||||
// Some stricter flags (disabled by default)
|
||||
"noUnusedLocals": false,
|
||||
"noUnusedParameters": false,
|
||||
"noPropertyAccessFromIndexSignature": false
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,3 @@
|
||||
|
||||
## Permission Table
|
||||
|
||||
<table>
|
||||
@ -7,7 +6,6 @@
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
|
||||
|
||||
@ -28,6 +28,10 @@
|
||||
"./extension": {
|
||||
"types": "./src/components/extension/index.ts",
|
||||
"svelte": "./src/components/extension/index.ts"
|
||||
},
|
||||
"./animation": {
|
||||
"types": "./src/components/animation/index.ts",
|
||||
"svelte": "./src/components/animation/index.ts"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
@ -83,6 +87,7 @@
|
||||
"shiki-magic-move": "^0.5.2",
|
||||
"svelte-inspect-value": "^0.3.0",
|
||||
"svelte-markdown": "^0.4.1",
|
||||
"svelte-motion": "^0.12.2",
|
||||
"valibot": "1.0.0-beta.12"
|
||||
}
|
||||
}
|
||||
|
||||
24
packages/ui/src/components/animation/AuroraText.svelte
Normal file
24
packages/ui/src/components/animation/AuroraText.svelte
Normal file
@ -0,0 +1,24 @@
|
||||
<script lang="ts">
|
||||
import type { Snippet } from "svelte"
|
||||
import { cn } from "../../utils"
|
||||
|
||||
let { class: className, children }: { class?: string; children: Snippet } = $props()
|
||||
</script>
|
||||
|
||||
<span class={cn("relative inline-flex overflow-hidden", className)}>
|
||||
{@render children()}
|
||||
<span class="pointer-events-none absolute inset-0 mix-blend-lighten dark:mix-blend-darken">
|
||||
<span
|
||||
class="pointer-events-none absolute -top-1/2 h-[30vw] w-[30vw] animate-[aurora-border_6s_ease-in-out_infinite,aurora-1_12s_ease-in-out_infinite_alternate] bg-[hsl(var(--color-1))] mix-blend-overlay blur-[1rem]"
|
||||
></span>
|
||||
<span
|
||||
class="pointer-events-none absolute right-0 top-0 h-[30vw] w-[30vw] animate-[aurora-border_6s_ease-in-out_infinite,aurora-2_12s_ease-in-out_infinite_alternate] bg-[hsl(var(--color-2))] mix-blend-overlay blur-[1rem]"
|
||||
></span>
|
||||
<span
|
||||
class="pointer-events-none absolute bottom-0 left-0 h-[30vw] w-[30vw] animate-[aurora-border_6s_ease-in-out_infinite,aurora-3_12s_ease-in-out_infinite_alternate] bg-[hsl(var(--color-3))] mix-blend-overlay blur-[1rem]"
|
||||
></span>
|
||||
<span
|
||||
class="pointer-events-none absolute -bottom-1/2 right-0 h-[30vw] w-[30vw] animate-[aurora-border_6s_ease-in-out_infinite,aurora-4_12s_ease-in-out_infinite_alternate] bg-[hsl(var(--color-4))] mix-blend-overlay blur-[1rem]"
|
||||
></span>
|
||||
</span>
|
||||
</span>
|
||||
@ -1,5 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { cn } from "$lib/utils"
|
||||
import { cn } from "../../utils"
|
||||
|
||||
let {
|
||||
class: className,
|
||||
72
packages/ui/src/components/animation/MagicCard.svelte
Normal file
72
packages/ui/src/components/animation/MagicCard.svelte
Normal file
@ -0,0 +1,72 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte"
|
||||
import { Motion, useMotionTemplate, useMotionValue } from "svelte-motion"
|
||||
import { cn } from "../../utils"
|
||||
|
||||
export let gradientSize: number = 200
|
||||
export let gradientColor: string = "#262626"
|
||||
export let gradientOpacity: number = 0.8
|
||||
let className: string = ""
|
||||
export { className as class }
|
||||
|
||||
let gradSize = useMotionValue(gradientSize)
|
||||
let gradColor = useMotionValue(gradientColor)
|
||||
let mouseX = useMotionValue(-gradientSize)
|
||||
let mouseY = useMotionValue(-gradientSize)
|
||||
|
||||
function handleMouseMove(e: MouseEvent) {
|
||||
const rect = (e.currentTarget as HTMLDivElement).getBoundingClientRect()
|
||||
mouseX.set(e.clientX - rect.left)
|
||||
mouseY.set(e.clientY - rect.top)
|
||||
}
|
||||
|
||||
function handleMouseLeave() {
|
||||
mouseX.set(-gradientSize)
|
||||
mouseY.set(-gradientSize)
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
mouseX.set(-gradientSize)
|
||||
mouseY.set(-gradientSize)
|
||||
})
|
||||
let bg = useMotionTemplate`radial-gradient(${gradSize}px circle at ${mouseX}px ${mouseY}px, ${gradColor}, transparent 100%)`
|
||||
</script>
|
||||
|
||||
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
||||
<!-- I have added py-4 in below code, you can customize the component as per needs -->
|
||||
<div
|
||||
on:mousemove={handleMouseMove}
|
||||
on:mouseleave={handleMouseLeave}
|
||||
class={cn(
|
||||
"group relative flex size-full justify-center overflow-hidden rounded-xl border bg-neutral-100 py-4 text-black dark:bg-neutral-900 dark:text-white",
|
||||
className
|
||||
)}
|
||||
>
|
||||
<div class="relative z-10">
|
||||
<!-- Default -->
|
||||
<slot>
|
||||
<div class="flex h-full items-center justify-center text-center">
|
||||
<p class="text-2xl">Magic Card</p>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
<Motion
|
||||
style={{
|
||||
background: bg,
|
||||
opacity: gradientOpacity
|
||||
}}
|
||||
let:motion
|
||||
>
|
||||
<div
|
||||
use:motion
|
||||
class="pointer-events-none absolute -inset-px rounded-xl opacity-0 transition-opacity duration-300 group-hover:opacity-100"
|
||||
></div>
|
||||
</Motion>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.size-full {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
34
packages/ui/src/components/animation/RetroGrid.svelte
Normal file
34
packages/ui/src/components/animation/RetroGrid.svelte
Normal file
@ -0,0 +1,34 @@
|
||||
<script lang="ts">
|
||||
import { cn } from "../../utils"
|
||||
|
||||
let { class: className }: { class?: string } = $props()
|
||||
</script>
|
||||
|
||||
<div
|
||||
class={cn(
|
||||
"pointer-events-none absolute h-full w-full overflow-hidden opacity-50 [perspective:200px]",
|
||||
className
|
||||
)}
|
||||
>
|
||||
<!-- Grid -->
|
||||
<div class="absolute inset-0 [transform:rotateX(35deg)]">
|
||||
<div
|
||||
class={cn(
|
||||
"animate-grid",
|
||||
|
||||
"[background-repeat:repeat] [background-size:60px_60px] [height:300vh] [inset:0%_0px] [margin-left:-50%] [transform-origin:100%_0_0] [width:600vw]",
|
||||
|
||||
// Light Styles
|
||||
"[background-image:linear-gradient(to_right,rgba(0,0,0,0.3)_1px,transparent_0),linear-gradient(to_bottom,rgba(0,0,0,0.3)_1px,transparent_0)]",
|
||||
|
||||
// Dark styles
|
||||
"dark:[background-image:linear-gradient(to_right,rgba(255,255,255,0.2)_1px,transparent_0),linear-gradient(to_bottom,rgba(255,255,255,0.2)_1px,transparent_0)]"
|
||||
)}
|
||||
></div>
|
||||
</div>
|
||||
|
||||
<!-- Background Gradient -->
|
||||
<div
|
||||
class="absolute inset-0 bg-gradient-to-t from-white to-transparent to-90% dark:from-black"
|
||||
></div>
|
||||
</div>
|
||||
39
packages/ui/src/components/animation/ShineBorder.svelte
Normal file
39
packages/ui/src/components/animation/ShineBorder.svelte
Normal file
@ -0,0 +1,39 @@
|
||||
<script lang="ts">
|
||||
import { cn } from "../../utils"
|
||||
|
||||
type TColorProp = string | string[]
|
||||
|
||||
export let borderRadius: number = 8
|
||||
export let borderWidth: number = 1
|
||||
export let duration: number = 14
|
||||
export let color: TColorProp = ["#4FF9FF"]
|
||||
let className: string = ""
|
||||
export { className as class }
|
||||
</script>
|
||||
|
||||
<div
|
||||
style="
|
||||
--border-radius: {borderRadius}px;
|
||||
"
|
||||
class={cn(
|
||||
"relative grid min-h-[60px] w-fit min-w-[300px] place-items-center rounded-[var(--border-radius)] bg-white p-3 text-black dark:bg-black dark:text-white",
|
||||
className
|
||||
)}
|
||||
>
|
||||
<div
|
||||
style="
|
||||
--border-width: {borderWidth}px;
|
||||
--border-radius: {borderRadius}px;
|
||||
--shine-pulse-duration: {duration}s;
|
||||
--mask-linear-gradient: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
|
||||
--background-radial-gradient: radial-gradient(transparent, transparent, {Array.isArray(
|
||||
color
|
||||
)
|
||||
? color.join(',')
|
||||
: color}, transparent, transparent);
|
||||
"
|
||||
class="before:bg-shine-size before:absolute before:inset-0 before:aspect-square before:size-full before:rounded-[var(--border-radius)] before:p-[var(--border-width)] before:will-change-[background-position] before:content-[''] before:![-webkit-mask-composite:xor] before:[background-image:var(--background-radial-gradient)] before:[background-size:300%_300%] before:![mask-composite:exclude] before:[mask:var(--mask-linear-gradient)] motion-safe:before:animate-[shine-pulse_var(--shine-pulse-duration)_infinite_linear]"
|
||||
></div>
|
||||
<!-- This is Default Slot -->
|
||||
<slot>Default</slot>
|
||||
</div>
|
||||
35
packages/ui/src/components/animation/WordRotate.svelte
Normal file
35
packages/ui/src/components/animation/WordRotate.svelte
Normal file
@ -0,0 +1,35 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte"
|
||||
import { fly } from "svelte/transition"
|
||||
import { cn } from "../../utils"
|
||||
|
||||
export let words: string[] = ["Hello", "Svelte", "Coders"]
|
||||
export let duration: number = 2100
|
||||
|
||||
let className: string = ""
|
||||
export { className as class }
|
||||
|
||||
let index = 0
|
||||
let chnageIndex = () => {
|
||||
index = (index + 1) % words.length
|
||||
}
|
||||
onMount(() => {
|
||||
let interval = setInterval(chnageIndex, duration)
|
||||
return () => clearInterval(interval)
|
||||
})
|
||||
// I tried with Svelte Motion but there was a slight delay in the animation
|
||||
// so I used the built-in svelte transition
|
||||
</script>
|
||||
|
||||
<div class="overflow-hidden py-2">
|
||||
{#key index}
|
||||
<!-- Change In, Out Animation for Rotate Effects -->
|
||||
<h1
|
||||
in:fly={{ y: -50, delay: 200 }}
|
||||
out:fly={{ y: 40, duration: 200 }}
|
||||
class={cn(className, "text-center")}
|
||||
>
|
||||
{words[index]}
|
||||
</h1>
|
||||
{/key}
|
||||
</div>
|
||||
7
packages/ui/src/components/animation/index.ts
Normal file
7
packages/ui/src/components/animation/index.ts
Normal file
@ -0,0 +1,7 @@
|
||||
export { default as GridAnimation } from "./grid-animation.svelte"
|
||||
export { default as BorderBeam } from "./BorderBeam.svelte"
|
||||
export { default as Meteors } from "./meteros.svelte"
|
||||
export { default as RetroGrid } from "./RetroGrid.svelte"
|
||||
export { default as AuroraText } from "./AuroraText.svelte"
|
||||
export { default as WordRotate } from "./WordRotate.svelte"
|
||||
export { default as MagicCard } from "./MagicCard.svelte"
|
||||
41
packages/ui/src/components/animation/meteros.svelte
Normal file
41
packages/ui/src/components/animation/meteros.svelte
Normal file
@ -0,0 +1,41 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte"
|
||||
import { cn } from "../../utils"
|
||||
|
||||
export let number = 10
|
||||
let meteorStyles: {
|
||||
top: number
|
||||
left: string
|
||||
animationDelay: string
|
||||
animationDuration: string
|
||||
}[] = []
|
||||
let changeMeteors = (num: number) => {
|
||||
meteorStyles = []
|
||||
const styles = [...new Array(num)].map(() => ({
|
||||
top: -20,
|
||||
left: Math.floor(Math.random() * 700) + "px",
|
||||
animationDelay: Math.random() * 1 + 0.2 + "s",
|
||||
animationDuration: Math.floor(Math.random() * 8 + 2.9) + "s"
|
||||
}))
|
||||
meteorStyles = styles
|
||||
}
|
||||
onMount(() => {
|
||||
changeMeteors(number)
|
||||
})
|
||||
// $: changeMeteors(number);
|
||||
</script>
|
||||
|
||||
{#each meteorStyles as style, idx}
|
||||
<span
|
||||
id="meteor-{idx + 1}"
|
||||
class={cn(
|
||||
"animate-meteor pointer-events-none absolute left-1/2 top-1/2 size-[2.4px] rotate-[215deg] rounded-full bg-slate-500 shadow-[0_0_0_1px_#ffffff10]"
|
||||
)}
|
||||
style="top: {style.top}px; left: {style.left}; animation-delay: {style.animationDelay}; animation-duration: {style.animationDuration};"
|
||||
>
|
||||
<!-- Meteor Tail -->
|
||||
<div
|
||||
class="pointer-events-none absolute top-1/2 -z-10 h-px w-[50px] -translate-y-1/2 bg-gradient-to-r from-slate-500 via-blue-600/30 to-transparent"
|
||||
></div>
|
||||
</span>
|
||||
{/each}
|
||||
@ -9,6 +9,10 @@ export * as Main from "./components/main/index"
|
||||
export * as Extension from "./components/extension/index"
|
||||
export { default as GridAnimation } from "./components/animation/grid-animation.svelte"
|
||||
export { default as ViewTransition } from "./components/transition/view-transition.svelte"
|
||||
export { default as BorderBeam } from "./components/animation/BorderBeam.svelte"
|
||||
export { default as Meteors } from "./components/animation/meteros.svelte"
|
||||
export { default as RetroGrid } from "./components/animation/RetroGrid.svelte"
|
||||
export { default as AuroraText } from "./components/animation/AuroraText.svelte"
|
||||
export * as Constants from "./constants"
|
||||
export * as Form from "./components/ui/form"
|
||||
export { default as ModeToggle } from "./components/theme/mode-toggle.svelte"
|
||||
|
||||
72
pnpm-lock.yaml
generated
72
pnpm-lock.yaml
generated
@ -335,7 +335,7 @@ importers:
|
||||
version: 8.25.0(eslint@9.21.0(jiti@2.4.0))(typescript@5.6.3)
|
||||
autoprefixer:
|
||||
specifier: ^10.4.20
|
||||
version: 10.4.20(postcss@8.4.49)
|
||||
version: 10.4.20(postcss@8.5.3)
|
||||
bits-ui:
|
||||
specifier: 1.0.0-next.86
|
||||
version: 1.0.0-next.86(svelte@5.20.5)
|
||||
@ -791,6 +791,16 @@ importers:
|
||||
specifier: latest
|
||||
version: 1.2.4
|
||||
|
||||
packages/svelte-animation:
|
||||
dependencies:
|
||||
typescript:
|
||||
specifier: ^5
|
||||
version: 5.7.3
|
||||
devDependencies:
|
||||
'@types/bun':
|
||||
specifier: latest
|
||||
version: 1.2.4
|
||||
|
||||
packages/tauri-plugins/jarvis:
|
||||
dependencies:
|
||||
typescript:
|
||||
@ -1246,6 +1256,9 @@ importers:
|
||||
svelte-markdown:
|
||||
specifier: ^0.4.1
|
||||
version: 0.4.1(svelte@5.20.5)
|
||||
svelte-motion:
|
||||
specifier: ^0.12.2
|
||||
version: 0.12.2(svelte@5.20.5)
|
||||
valibot:
|
||||
specifier: 1.0.0-beta.12
|
||||
version: 1.0.0-beta.12(typescript@5.7.3)
|
||||
@ -7835,6 +7848,9 @@ packages:
|
||||
fraction.js@4.3.7:
|
||||
resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
|
||||
|
||||
framesync@6.1.2:
|
||||
resolution: {integrity: sha512-jBTqhX6KaQVDyus8muwZbBeGGP0XgujBRbQ7gM7BRdS3CadCZIHiawyzYLnafYcvZIh5j8WE7cxZKFn7dXhu9g==}
|
||||
|
||||
fresh@0.5.2:
|
||||
resolution: {integrity: sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==}
|
||||
engines: {node: '>= 0.6'}
|
||||
@ -8121,6 +8137,9 @@ packages:
|
||||
resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
|
||||
hasBin: true
|
||||
|
||||
hey-listen@1.0.8:
|
||||
resolution: {integrity: sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==}
|
||||
|
||||
highlight.js@11.11.1:
|
||||
resolution: {integrity: sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==}
|
||||
engines: {node: '>=12.0.0'}
|
||||
@ -9660,6 +9679,9 @@ packages:
|
||||
resolution: {integrity: sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==}
|
||||
engines: {node: '>=4'}
|
||||
|
||||
popmotion@11.0.5:
|
||||
resolution: {integrity: sha512-la8gPM1WYeFznb/JqF4GiTkRRPZsfaj2+kCxqQgr2MJylMmIKUwBfWW8Wa5fml/8gmtlD5yI01MP1QCZPWmppA==}
|
||||
|
||||
portfinder@1.0.32:
|
||||
resolution: {integrity: sha512-on2ZJVVDXRADWE6jnQaX0ioEylzgBpQk8r55NE4wjXW1ZxO+BgDlY6DXwj20i0V8eB4SenDQ00WEaxfiIQPcxg==}
|
||||
engines: {node: '>= 0.12.0'}
|
||||
@ -10829,6 +10851,9 @@ packages:
|
||||
style-to-object@1.0.8:
|
||||
resolution: {integrity: sha512-xT47I/Eo0rwJmaXC4oilDGDWLohVhR6o/xAQcPQN8q6QBuZVL8qMYL85kLmST5cPjAorwvqIA4qXTRQoYHaL6g==}
|
||||
|
||||
style-value-types@5.1.2:
|
||||
resolution: {integrity: sha512-Vs9fNreYF9j6W2VvuDTP7kepALi7sk0xtk2Tu8Yxi9UoajJdEVpNpCov0HsLTqXvNGKX+Uv09pkozVITi1jf3Q==}
|
||||
|
||||
styled-jsx@5.1.1:
|
||||
resolution: {integrity: sha512-pW7uC1l4mBZ8ugbiZrcIsiIvVx1UmTfw7UkC3Um2tmfUq9Bhk8IiyEIPl6F8agHgjzku6j0xQEZbfA5uSgSaCw==}
|
||||
engines: {node: '>= 12.0.0'}
|
||||
@ -10928,6 +10953,11 @@ packages:
|
||||
peerDependencies:
|
||||
svelte: ^4.0.0
|
||||
|
||||
svelte-motion@0.12.2:
|
||||
resolution: {integrity: sha512-7RrdRz9iVP55B9HT/C0hYW3pyrKlF61kAby/AkDtOAP0uHFQDrfd0qQetDC81cEsK9b40jt+jfcqSAXcA7LPEw==}
|
||||
peerDependencies:
|
||||
svelte: '>=3.35.0 || ^4.0.0 || ^5.0.0 || ^5.0.0-next.0'
|
||||
|
||||
svelte-persisted-store@0.12.0:
|
||||
resolution: {integrity: sha512-BdBQr2SGSJ+rDWH8/aEV5GthBJDapVP0GP3fuUCA7TjYG5ctcB+O9Mj9ZC0+Jo1oJMfZUd1y9H68NFRR5MyIJA==}
|
||||
engines: {node: '>=0.14'}
|
||||
@ -18489,6 +18519,16 @@ snapshots:
|
||||
postcss: 8.5.1
|
||||
postcss-value-parser: 4.2.0
|
||||
|
||||
autoprefixer@10.4.20(postcss@8.5.3):
|
||||
dependencies:
|
||||
browserslist: 4.24.2
|
||||
caniuse-lite: 1.0.30001676
|
||||
fraction.js: 4.3.7
|
||||
normalize-range: 0.1.2
|
||||
picocolors: 1.1.1
|
||||
postcss: 8.5.3
|
||||
postcss-value-parser: 4.2.0
|
||||
|
||||
available-typed-arrays@1.0.7:
|
||||
dependencies:
|
||||
possible-typed-array-names: 1.0.0
|
||||
@ -20458,6 +20498,10 @@ snapshots:
|
||||
|
||||
fraction.js@4.3.7: {}
|
||||
|
||||
framesync@6.1.2:
|
||||
dependencies:
|
||||
tslib: 2.4.0
|
||||
|
||||
fresh@0.5.2: {}
|
||||
|
||||
fs-extra@10.1.0:
|
||||
@ -20777,6 +20821,8 @@ snapshots:
|
||||
|
||||
he@1.2.0: {}
|
||||
|
||||
hey-listen@1.0.8: {}
|
||||
|
||||
highlight.js@11.11.1: {}
|
||||
|
||||
hookable@5.5.3: {}
|
||||
@ -22432,6 +22478,13 @@ snapshots:
|
||||
|
||||
pluralize@8.0.0: {}
|
||||
|
||||
popmotion@11.0.5:
|
||||
dependencies:
|
||||
framesync: 6.1.2
|
||||
hey-listen: 1.0.8
|
||||
style-value-types: 5.1.2
|
||||
tslib: 2.4.0
|
||||
|
||||
portfinder@1.0.32:
|
||||
dependencies:
|
||||
async: 2.6.4
|
||||
@ -23653,6 +23706,11 @@ snapshots:
|
||||
dependencies:
|
||||
inline-style-parser: 0.2.4
|
||||
|
||||
style-value-types@5.1.2:
|
||||
dependencies:
|
||||
hey-listen: 1.0.8
|
||||
tslib: 2.4.0
|
||||
|
||||
styled-jsx@5.1.1(react@18.3.1):
|
||||
dependencies:
|
||||
client-only: 0.0.1
|
||||
@ -23769,6 +23827,15 @@ snapshots:
|
||||
marked: 5.1.2
|
||||
svelte: 5.20.5
|
||||
|
||||
svelte-motion@0.12.2(svelte@5.20.5):
|
||||
dependencies:
|
||||
'@types/react': 18.3.12
|
||||
framesync: 6.1.2
|
||||
popmotion: 11.0.5
|
||||
style-value-types: 5.1.2
|
||||
svelte: 5.20.5
|
||||
tslib: 2.8.1
|
||||
|
||||
svelte-persisted-store@0.12.0(svelte@5.16.6):
|
||||
dependencies:
|
||||
svelte: 5.16.6
|
||||
@ -24374,8 +24441,7 @@ snapshots:
|
||||
minimist: 1.2.8
|
||||
strip-bom: 3.0.0
|
||||
|
||||
tslib@2.4.0:
|
||||
optional: true
|
||||
tslib@2.4.0: {}
|
||||
|
||||
tslib@2.8.1: {}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user