stefiosif/loft
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style(frontend): format codebase with prettier

Browse Source
This commit is contained in:
stefiosif
2026-06-01 21:00:23 +03:00
parent c1bceae5e4
commit 41ea8b598a
20 changed files with 747 additions and 373 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/.prettierrc
View File

@@ -1,16 +1,17 @@
{ {
"useTabs": true, "useTabs": false,
"singleQuote": true, "tabWidth": 4,
"trailingComma": "none", "singleQuote": true,
"printWidth": 100, "trailingComma": "none",
"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"], "printWidth": 100,
"overrides": [ "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
{ "overrides": [
"files": "*.svelte", {
"options": { "files": "*.svelte",
"parser": "svelte" "options": {
} "parser": "svelte"
} }
], }
"tailwindStylesheet": "./src/routes/layout.css" ],
"tailwindStylesheet": "./src/routes/layout.css"
} }

60
frontend/eslint.config.js
View File

@@ -11,34 +11,34 @@ import svelteConfig from './svelte.config.js';
const gitignorePath = path.resolve(import.meta.dirname, '.gitignore'); const gitignorePath = path.resolve(import.meta.dirname, '.gitignore');
export default defineConfig( export default defineConfig(
includeIgnoreFile(gitignorePath), includeIgnoreFile(gitignorePath),
js.configs.recommended, js.configs.recommended,
ts.configs.recommended, ts.configs.recommended,
svelte.configs.recommended, svelte.configs.recommended,
prettier, prettier,
svelte.configs.prettier, svelte.configs.prettier,
{ {
languageOptions: { globals: { ...globals.browser, ...globals.node } }, languageOptions: { globals: { ...globals.browser, ...globals.node } },
rules: { rules: {
// typescript-eslint strongly recommend that you do not use the no-undef lint rule on TypeScript projects. // typescript-eslint strongly recommend that you do not use the no-undef lint rule on TypeScript projects.
// see: https://typescript-eslint.io/troubleshooting/faqs/eslint/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors // see: https://typescript-eslint.io/troubleshooting/faqs/eslint/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors
'no-undef': 'off' 'no-undef': 'off'
} }
}, },
{ {
files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'], files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],
languageOptions: { languageOptions: {
parserOptions: { parserOptions: {
projectService: true, projectService: true,
extraFileExtensions: ['.svelte'], extraFileExtensions: ['.svelte'],
parser: ts.parser, parser: ts.parser,
svelteConfig svelteConfig
} }
} }
}, },
{ {
// Override or add rule settings here, such as: // Override or add rule settings here, such as:
// 'svelte/button-has-type': 'error' // 'svelte/button-has-type': 'error'
rules: {} rules: {}
} }
); );

96
frontend/package.json
View File

@@ -1,50 +1,50 @@
{ {
"name": "frontend", "name": "frontend",
"private": true, "private": true,
"version": "0.0.1", "version": "0.0.1",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite dev", "dev": "vite dev",
"build": "vite build", "build": "vite build",
"preview": "vite preview", "preview": "vite preview",
"prepare": "svelte-kit sync || echo ''", "prepare": "svelte-kit sync || echo ''",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"lint": "prettier --check . && eslint .", "lint": "prettier --check . && eslint .",
"format": "prettier --write .", "format": "prettier --write .",
"test:e2e": "playwright test", "test:e2e": "playwright test",
"test": "npm run test:unit -- --run && npm run test:e2e", "test": "npm run test:unit -- --run && npm run test:e2e",
"test:unit": "vitest" "test:unit": "vitest"
}, },
"devDependencies": { "devDependencies": {
"@eslint/compat": "^2.0.3", "@eslint/compat": "^2.0.3",
"@eslint/js": "^10.0.1", "@eslint/js": "^10.0.1",
"@fontsource/fira-mono": "^5.2.7", "@fontsource/fira-mono": "^5.2.7",
"@neoconfetti/svelte": "^2.2.2", "@neoconfetti/svelte": "^2.2.2",
"@playwright/test": "^1.58.2", "@playwright/test": "^1.58.2",
"@sveltejs/adapter-auto": "^7.0.0", "@sveltejs/adapter-auto": "^7.0.0",
"@sveltejs/kit": "^2.50.2", "@sveltejs/kit": "^2.50.2",
"@sveltejs/vite-plugin-svelte": "^6.2.4", "@sveltejs/vite-plugin-svelte": "^6.2.4",
"@tailwindcss/forms": "^0.5.11", "@tailwindcss/forms": "^0.5.11",
"@tailwindcss/typography": "^0.5.19", "@tailwindcss/typography": "^0.5.19",
"@tailwindcss/vite": "^4.1.18", "@tailwindcss/vite": "^4.1.18",
"@types/node": "^24", "@types/node": "^24",
"@vitest/browser-playwright": "^4.1.0", "@vitest/browser-playwright": "^4.1.0",
"eslint": "^10.0.3", "eslint": "^10.0.3",
"eslint-config-prettier": "^10.1.8", "eslint-config-prettier": "^10.1.8",
"eslint-plugin-svelte": "^3.15.2", "eslint-plugin-svelte": "^3.15.2",
"globals": "^17.4.0", "globals": "^17.4.0",
"playwright": "^1.58.2", "playwright": "^1.58.2",
"prettier": "^3.8.1", "prettier": "^3.8.1",
"prettier-plugin-svelte": "^3.4.1", "prettier-plugin-svelte": "^3.4.1",
"prettier-plugin-tailwindcss": "^0.7.2", "prettier-plugin-tailwindcss": "^0.7.2",
"svelte": "^5.54.0", "svelte": "^5.54.0",
"svelte-check": "^4.4.2", "svelte-check": "^4.4.2",
"tailwindcss": "^4.1.18", "tailwindcss": "^4.1.18",
"typescript": "^5.9.3", "typescript": "^5.9.3",
"typescript-eslint": "^8.57.0", "typescript-eslint": "^8.57.0",
"vite": "^7.3.1", "vite": "^7.3.1",
"vitest": "^4.1.0", "vitest": "^4.1.0",
"vitest-browser-svelte": "^2.0.2" "vitest-browser-svelte": "^2.0.2"
} }
} }

2
frontend/pnpm-workspace.yaml
View File

@@ -1,2 +1,2 @@
onlyBuiltDependencies: onlyBuiltDependencies:
- esbuild - esbuild

14
frontend/src/app.d.ts vendored
View File

@@ -1,13 +1,13 @@
// See https://svelte.dev/docs/kit/types#app.d.ts // See https://svelte.dev/docs/kit/types#app.d.ts
// for information about these interfaces // for information about these interfaces
declare global { declare global {
namespace App { namespace App {
// interface Error {} // interface Error {}
// interface Locals {} // interface Locals {}
// interface PageData {} // interface PageData {}
// interface PageState {} // interface PageState {}
// interface Platform {} // interface Platform {}
} }
} }
export {}; export {};

25
frontend/src/app.html
View File

@@ -1,14 +1,17 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.svg" /> <link rel="icon" href="%sveltekit.assets%/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap" rel="stylesheet" /> <link
<meta name="text-scale" content="scale" /> href="https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap"
%sveltekit.head% rel="stylesheet"
</head> />
<body data-sveltekit-preload-data="hover"> <meta name="text-scale" content="scale" />
<div style="display: contents">%sveltekit.body%</div> %sveltekit.head%
</body> </head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html> </html>

15
frontend/src/lib/api.ts
View File

@@ -1,10 +1,10 @@
import type { FileRecord } from "$lib/types"; import type { FileRecord } from '$lib/types';
export async function loadFiles(): Promise<FileRecord[]> { export async function loadFiles(): Promise<FileRecord[]> {
const res = await fetch('/api/files', { const res = await fetch('/api/files', {
credentials: 'include' credentials: 'include'
}); });
if (res.status === 401) { if (res.status === 401) {
window.location.href = '/auth'; window.location.href = '/auth';
return []; return [];
@@ -14,10 +14,9 @@ export async function loadFiles(): Promise<FileRecord[]> {
throw new Error(`Failed to load files: ${res.status}`); throw new Error(`Failed to load files: ${res.status}`);
} }
return await res.json() return await res.json();
} }
export async function uploadFile(file: File): Promise<FileRecord> { export async function uploadFile(file: File): Promise<FileRecord> {
const formData = new FormData(); const formData = new FormData();
formData.append('file', file); formData.append('file', file);
@@ -28,10 +27,10 @@ export async function uploadFile(file: File): Promise<FileRecord> {
}); });
if (!res.ok) { if (!res.ok) {
throw new Error(`Upload failed: ${res.status}`) throw new Error(`Upload failed: ${res.status}`);
} }
return await res.json() return await res.json();
} }
export async function downloadFile(fileId: number): Promise<Blob> { export async function downloadFile(fileId: number): Promise<Blob> {
@@ -39,10 +38,10 @@ export async function downloadFile(fileId: number): Promise<Blob> {
credentials: 'include' credentials: 'include'
}); });
if (!res.ok) { if (!res.ok) {
throw new Error(`Download failed: ${res.status}`) throw new Error(`Download failed: ${res.status}`);
} }
return await res.blob() return await res.blob();
} }
export async function deleteFile(fileId: number): Promise<void> { export async function deleteFile(fileId: number): Promise<void> {

41
frontend/src/lib/components/FilePreview.svelte
View File

@@ -1,33 +1,50 @@
<script lang="ts"> <script lang="ts">
import type { FileRecord } from "$lib/types"; import type { FileRecord } from '$lib/types';
import { fade } from "svelte/transition"; import { fade } from 'svelte/transition';
let { file, onclose }: { file: FileRecord; onclose: () => void } = $props(); let { file, onclose }: { file: FileRecord; onclose: () => void } = $props();
</script> </script>
<svelte:window onkeydown={(e) => { if (e.key === 'Escape') onclose(); }} /> <svelte:window
onkeydown={(e) => {
if (e.key === 'Escape') onclose();
}}
/>
<!-- svelte-ignore a11y_click_events_have_key_events --> <!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_no_static_element_interactions --> <!-- svelte-ignore a11y_no_static_element_interactions -->
<div <div
class="fixed inset-0 bg-black/60 flex items-center justify-center z-50" class="fixed inset-0 z-50 flex items-center justify-center bg-black/60"
onclick={onclose} onclick={onclose}
transition:fade={{ duration: 150 }} transition:fade={{ duration: 150 }}
> >
<div <div
class="bg-[#0f1117] border border-sky-200/20 rounded-sm w-2/3 h-2/3 flex flex-col p-6" class="flex h-2/3 w-2/3 flex-col rounded-sm border border-sky-200/20 bg-[#0f1117] p-6"
onclick={(e) => e.stopPropagation()} onclick={(e) => e.stopPropagation()}
> >
<div class="flex items-center justify-between mb-4"> <div class="mb-4 flex items-center justify-between">
<span class="text-white text-sm font-medium">{file.name}</span> <span class="text-sm font-medium text-white">{file.name}</span>
<button class="text-white/40 hover:text-white transition-colors cursor-pointer" onclick={onclose} aria-label="Close"> <button
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> class="cursor-pointer text-white/40 transition-colors hover:text-white"
<line x1="18" y1="6" x2="6" y2="18"/> onclick={onclose}
<line x1="6" y1="6" x2="18" y2="18"/> aria-label="Close"
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<line x1="18" y1="6" x2="6" y2="18" />
<line x1="6" y1="6" x2="18" y2="18" />
</svg> </svg>
</button> </button>
</div> </div>
<div class="flex-1 flex items-center justify-center text-white/20 text-sm"> <div class="flex flex-1 items-center justify-center text-sm text-white/20">
preview coming soon preview coming soon
</div> </div>
</div> </div>

150
frontend/src/lib/components/FileRow.svelte
View File

@@ -8,7 +8,7 @@
onselect, onselect,
onpreview, onpreview,
ondownload, ondownload,
ondelete, ondelete
}: { }: {
file: FileRecord; file: FileRecord;
selected: boolean; selected: boolean;
@@ -28,59 +28,135 @@
if (e.key === 'Enter') { if (e.key === 'Enter') {
onpreview(); onpreview();
} else if (e.key === ' ') { } else if (e.key === ' ') {
e.preventDefault(); onselect(); e.preventDefault();
onselect();
} }
} }}
}
onclick={onselect} onclick={onselect}
ondblclick={onpreview} ondblclick={onpreview}
class="flex items-stretch border-l hover:bg-white/2 transition-all {selected ? 'border-sky-400/50 bg-white/2 ring-1 ring-inset ring-sky-400/50' : 'border-sky-200/20 border-l-transparent hover:border-l-sky-400/50'}" class="flex items-stretch border-l transition-all hover:bg-white/2 {selected
? 'border-sky-400/50 bg-white/2 ring-1 ring-sky-400/50 ring-inset'
: 'border-sky-200/20 border-l-transparent hover:border-l-sky-400/50'}"
> >
<span class="font-medium text-white text-sm flex-1 truncate py-2 pl-6">{formatName(file.name)}</span> <span class="flex-1 truncate py-2 pl-6 text-sm font-medium text-white"
<span class="text-sm text-white/40 w-40 py-2">{formatSize(file.size)}</span> >{formatName(file.name)}</span
<span class="text-sm text-white/40 w-48 py-2">{new Date(file.uploadedAt).toLocaleString()}</span> >
<div class="w-px bg-sky-200/20 self-stretch"></div> <span class="w-40 py-2 text-sm text-white/40">{formatSize(file.size)}</span>
<div class="flex items-center gap-4 w-32 justify-center relative"> <span class="w-48 py-2 text-sm text-white/40">{new Date(file.uploadedAt).toLocaleString()}</span
>
<div class="w-px self-stretch bg-sky-200/20"></div>
<div class="relative flex w-32 items-center justify-center gap-4">
<!-- Download --> <!-- Download -->
<button class="text-white/40 hover:text-emerald-400 hover:scale-110 transition-all cursor-pointer" title="Download" onclick={ondownload}> <button
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> class="cursor-pointer text-white/40 transition-all hover:scale-110 hover:text-emerald-400"
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/> title="Download"
<polyline points="7 10 12 15 17 10"/> onclick={ondownload}
<line x1="12" y1="15" x2="12" y2="3"/> >
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg> </svg>
</button> </button>
<!-- TODO: Copy --> <!-- TODO: Copy -->
<button class="text-white/40 hover:text-blue-400 hover:scale-110 transition-all cursor-pointer" title="Copy link"> <button
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> class="cursor-pointer text-white/40 transition-all hover:scale-110 hover:text-blue-400"
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/> title="Copy link"
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/> >
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" />
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" />
</svg> </svg>
</button> </button>
<!-- Delete --> <!-- Delete -->
<div class="relative"> <div class="relative">
<button class="text-white/40 hover:text-red-400 hover:scale-110 transition-all cursor-pointer" title="Delete" onclick={() => confirming = true}> <button
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> class="cursor-pointer text-white/40 transition-all hover:scale-110 hover:text-red-400"
<polyline points="3 6 5 6 21 6"/> title="Delete"
<path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/> onclick={() => (confirming = true)}
<path d="M10 11v6"/> >
<path d="M14 11v6"/> <svg
<path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/> xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<polyline points="3 6 5 6 21 6" />
<path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" />
<path d="M10 11v6" />
<path d="M14 11v6" />
<path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2" />
</svg> </svg>
</button> </button>
{#if confirming} {#if confirming}
<div class="absolute left-6 top-1/2 -translate-y-1/2 flex items-center z-10"> <div class="absolute top-1/2 left-6 z-10 flex -translate-y-1/2 items-center">
<div class="w-0 h-0 border-t-4 border-b-4 border-r-4 border-t-transparent border-b-transparent border-r-sky-200/20"></div> <div
<div class="bg-[#0f1117] border border-sky-200/20 rounded px-3 py-2 flex items-center gap-2 whitespace-nowrap"> class="h-0 w-0 border-t-4 border-r-4 border-b-4 border-t-transparent border-r-sky-200/20 border-b-transparent"
<span class="text-white/40 text-xs">Confirm action</span> ></div>
<button class="text-white/60 hover:text-white transition-colors cursor-pointer" title="Confirm" onclick={() => { ondelete(); confirming = false; }}> <div
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"> class="flex items-center gap-2 rounded border border-sky-200/20 bg-[#0f1117] px-3 py-2 whitespace-nowrap"
<polyline points="20 6 9 17 4 12"/> >
<span class="text-xs text-white/40">Confirm action</span>
<button
class="cursor-pointer text-white/60 transition-colors hover:text-white"
title="Confirm"
onclick={() => {
ondelete();
confirming = false;
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
>
<polyline points="20 6 9 17 4 12" />
</svg> </svg>
</button> </button>
<button class="text-white/60 hover:text-white transition-colors cursor-pointer" title="Cancel" onclick={() => confirming = false}> <button
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"> class="cursor-pointer text-white/60 transition-colors hover:text-white"
<line x1="18" y1="6" x2="6" y2="18"/> title="Cancel"
<line x1="6" y1="6" x2="18" y2="18"/> onclick={() => (confirming = false)}
>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-4 w-4"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
>
<line x1="18" y1="6" x2="6" y2="18" />
<line x1="6" y1="6" x2="18" y2="18" />
</svg> </svg>
</button> </button>
</div> </div>

12
frontend/src/lib/format.ts
View File

@@ -1,13 +1,13 @@
export function formatName(name: string): string { export function formatName(name: string): string {
if (name.length > 65) { if (name.length > 65) {
name = name.slice(0, 65).concat("..."); name = name.slice(0, 65).concat('...');
} }
return name; return name;
} }
export function formatSize(bytes: number): string { export function formatSize(bytes: number): string {
if (bytes < 1000) return bytes + 'B'; if (bytes < 1000) return bytes + 'B';
if (bytes < 1000 * 1000) return (bytes / 1000).toFixed(1) + 'KB'; if (bytes < 1000 * 1000) return (bytes / 1000).toFixed(1) + 'KB';
if (bytes < 1000 * 1000 * 1000) return (bytes / 1000 / 1000).toFixed(1) + 'MB'; if (bytes < 1000 * 1000 * 1000) return (bytes / 1000 / 1000).toFixed(1) + 'MB';
return (bytes / 1000 / 1000 / 1000).toFixed(1) + 'GB'; return (bytes / 1000 / 1000 / 1000).toFixed(1) + 'GB';
} }

2
frontend/src/lib/types.ts
View File

@@ -3,4 +3,4 @@ export type FileRecord = {
name: string; name: string;
size: number; size: number;
uploadedAt: string; uploadedAt: string;
}; };

63
frontend/src/routes/+layout.svelte
View File

@@ -1,45 +1,44 @@
<script lang="ts"> <script lang="ts">
import './layout.css'; import './layout.css';
let { children } = $props(); let { children } = $props();
</script> </script>
<div class="app"> <div class="app">
<main>{@render children()}</main> <main>{@render children()}</main>
<footer> <footer></footer>
</footer>
</div> </div>
<style> <style>
.app { .app {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 100vh; min-height: 100vh;
} }
main { main {
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 1rem; padding: 1rem;
width: 100%; width: 100%;
max-width: 64rem; max-width: 64rem;
margin: 0 auto; margin: 0 auto;
box-sizing: border-box; box-sizing: border-box;
} }
footer { footer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 12px; padding: 12px;
} }
@media (min-width: 480px) { @media (min-width: 480px) {
footer { footer {
padding: 12px 0; padding: 12px 0;
} }
} }
</style> </style>

93
frontend/src/routes/+page.svelte
View File

@@ -1,26 +1,26 @@
<script lang="ts"> <script lang="ts">
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
import { flip } from 'svelte/animate' import { flip } from 'svelte/animate';
import type { FileRecord } from '$lib/types'; import type { FileRecord } from '$lib/types';
import { deleteFile, downloadFile, loadFiles, logout, uploadFile } from '$lib/api'; import { deleteFile, downloadFile, loadFiles, logout, uploadFile } from '$lib/api';
import FileRow from '$lib/components/FileRow.svelte'; import FileRow from '$lib/components/FileRow.svelte';
import FilePreview from '$lib/components/FilePreview.svelte'; import FilePreview from '$lib/components/FilePreview.svelte';
let fileRecords = $state<FileRecord[]>([]); let fileRecords = $state<FileRecord[]>([]);
let selectedFileId = $state<number | null>(null); let selectedFileId = $state<number | null>(null);
let previewFile = $state<FileRecord | null>(null); let previewFile = $state<FileRecord | null>(null);
let search = $state(''); let search = $state('');
let loading = $state(true); let loading = $state(true);
async function refresh() { async function refresh() {
fileRecords = await loadFiles(); fileRecords = await loadFiles();
loading = false; loading = false;
} }
let filteredFileRecords = $derived(fileRecords.filter(f => let filteredFileRecords = $derived(
f.name.toLowerCase().includes(search.toLowerCase()) fileRecords.filter((f) => f.name.toLowerCase().includes(search.toLowerCase()))
)); );
let fileInput: HTMLInputElement; let fileInput: HTMLInputElement;
@@ -28,12 +28,12 @@
const input = event.target as HTMLInputElement; const input = event.target as HTMLInputElement;
const file = input.files?.[0]; const file = input.files?.[0];
if (!file) return; if (!file) return;
await uploadFile(file) await uploadFile(file);
input.value = ''; input.value = '';
await refresh() await refresh();
} }
async function handleDownload(fileId: number, fileName: string) { async function handleDownload(fileId: number, fileName: string) {
const blob = await downloadFile(fileId); const blob = await downloadFile(fileId);
const url = URL.createObjectURL(blob); const url = URL.createObjectURL(blob);
@@ -48,42 +48,55 @@
await deleteFile(fileId); await deleteFile(fileId);
await refresh(); await refresh();
} }
async function handleLogout() { async function handleLogout() {
await logout(); await logout();
window.location.href = '/auth'; window.location.href = '/auth';
} }
onMount(refresh) onMount(refresh);
</script> </script>
<div class="w-full px-4 py-8"> <div class="w-full px-4 py-8">
<div class="relative mb-6 flex items-center justify-center"> <div class="relative mb-6 flex items-center justify-center">
<h1 class="text-4xl text-white" style="font-family: 'Caveat', cursive;">loft</h1> <h1 class="text-4xl text-white" style="font-family: 'Caveat', cursive;">loft</h1>
<button <button
onclick={handleLogout} onclick={handleLogout}
class="fixed top-4 right-4 flex items-center gap-1.5 px-2 py-1 border border-sky-200/20 text-white/60 hover:border-sky-200/40 text-sm transition-colors rounded-sm cursor-pointer"> class="fixed top-4 right-4 flex cursor-pointer items-center gap-1.5 rounded-sm border border-sky-200/20 px-2 py-1 text-sm text-white/60 transition-colors hover:border-sky-200/40"
<svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> >
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/> <svg
<polyline points="16 17 21 12 16 7"/> xmlns="http://www.w3.org/2000/svg"
<line x1="21" y1="12" x2="9" y2="12"/> class="h-3.5 w-3.5"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" />
<polyline points="16 17 21 12 16 7" />
<line x1="21" y1="12" x2="9" y2="12" />
</svg> </svg>
Sign out Sign out
</button> </button>
</div> </div>
<div class="flex justify-center mb-4"> <div class="mb-4 flex justify-center">
<input <input
type="text" type="text"
placeholder="Search files..." placeholder="Search files..."
bind:value={search} bind:value={search}
class="w-96 px-4 py-1.5 rounded-xl bg-white/5 border border-sky-200/20 transition-colors hover:border-sky-200/40 text-white placeholder-white/30 text-sm focus:outline-none focus:ring-1 focus:ring-white/10" class="w-96 rounded-xl border border-sky-200/20 bg-white/5 px-4 py-1.5 text-sm text-white placeholder-white/30 transition-colors hover:border-sky-200/40 focus:ring-1 focus:ring-white/10 focus:outline-none"
/> />
</div> </div>
<input type="file" bind:this={fileInput} onchange={handleUpload} class="hidden" /> <input type="file" bind:this={fileInput} onchange={handleUpload} class="hidden" />
<div class="mb-1"> <div class="mb-1">
<button class="px-2 py-1 border border-sky-200/20 text-white/60 hover:border-sky-200/40 text-sm transition-colors rounded-sm cursor-pointer" onclick={() => fileInput.click()}> <button
class="cursor-pointer rounded-sm border border-sky-200/20 px-2 py-1 text-sm text-white/60 transition-colors hover:border-sky-200/40"
onclick={() => fileInput.click()}
>
Import Import
</button> </button>
</div> </div>
@@ -91,23 +104,23 @@
<div class="rounded-sm border border-sky-200/20"> <div class="rounded-sm border border-sky-200/20">
<!-- Header row --> <!-- Header row -->
<div class="flex items-stretch border-b border-sky-200/20 bg-white/5"> <div class="flex items-stretch border-b border-sky-200/20 bg-white/5">
<span class="font-medium text-white/40 text-sm flex-1 py-2 pl-6">Name</span> <span class="flex-1 py-2 pl-6 text-sm font-medium text-white/40">Name</span>
<span class="text-sm text-white/40 w-40 py-2">Size</span> <span class="w-40 py-2 text-sm text-white/40">Size</span>
<span class="text-sm text-white/40 w-48 py-2">Uploaded at</span> <span class="w-48 py-2 text-sm text-white/40">Uploaded at</span>
<div class="w-px bg-sky-200/20 self-stretch"></div> <div class="w-px self-stretch bg-sky-200/20"></div>
<span class="text-sm text-white/40 w-32 text-center py-2">Actions</span> <span class="w-32 py-2 text-center text-sm text-white/40">Actions</span>
</div> </div>
{#each filteredFileRecords as fileRecord (fileRecord.id)} {#each filteredFileRecords as fileRecord (fileRecord.id)}
<div transition:fade={{ duration: 200 }} animate:flip={{ duration: 200 }}> <div transition:fade={{ duration: 200 }} animate:flip={{ duration: 200 }}>
<FileRow <FileRow
file={fileRecord} file={fileRecord}
selected={selectedFileId === fileRecord.id} selected={selectedFileId === fileRecord.id}
onselect={() => selectedFileId = fileRecord.id} onselect={() => (selectedFileId = fileRecord.id)}
onpreview={() => previewFile = fileRecord} onpreview={() => (previewFile = fileRecord)}
ondownload={() => handleDownload(fileRecord.id, fileRecord.name)} ondownload={() => handleDownload(fileRecord.id, fileRecord.name)}
ondelete={() => handleDelete(fileRecord.id)} ondelete={() => handleDelete(fileRecord.id)}
/> />
</div> </div>
{:else} {:else}
{#if !loading}<p class="py-2 px-4 text-white/30 text-sm">No files yet.</p>{/if} {#if !loading}<p class="py-2 px-4 text-white/30 text-sm">No files yet.</p>{/if}
@@ -116,5 +129,5 @@
</div> </div>
{#if previewFile} {#if previewFile}
<FilePreview file={previewFile} onclose={() => previewFile = null} /> <FilePreview file={previewFile} onclose={() => (previewFile = null)} />
{/if} {/if}

36
frontend/src/routes/auth/+page.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { submit } from "$lib/api"; import { submit } from '$lib/api';
let activeTab = $state<'login' | 'register'>('login'); let activeTab = $state<'login' | 'register'>('login');
let username = $state(''); let username = $state('');
@@ -16,20 +16,25 @@
} }
</script> </script>
<div class="flex-1 flex items-center justify-center -mt-16"> <div class="-mt-16 flex flex-1 items-center justify-center">
<div class="w-full max-w-xs"> <div class="w-full max-w-xs">
<h1 class="text-4xl text-white mb-8" style="font-family: 'Caveat', cursive;">loft</h1> <h1 class="mb-8 text-4xl text-white" style="font-family: 'Caveat', cursive;">loft</h1>
<div class="flex mb-6 border-b border-sky-200/20"> <div class="mb-6 flex border-b border-sky-200/20">
<button <button
onclick={() => activeTab = 'login'} onclick={() => (activeTab = 'login')}
class="flex-1 py-2 text-sm transition-colors cursor-pointer {activeTab === 'login' ? 'text-white border-b border-white -mb-px' : 'text-white/40 hover:text-white/60'}" class="flex-1 cursor-pointer py-2 text-sm transition-colors {activeTab === 'login'
? '-mb-px border-b border-white text-white'
: 'text-white/40 hover:text-white/60'}"
> >
Login Login
</button> </button>
<button <button
onclick={() => activeTab = 'register'} onclick={() => (activeTab = 'register')}
class="flex-1 py-2 text-sm transition-colors cursor-pointer {activeTab === 'register' ? 'text-white border-b border-white -mb-px' : 'text-white/40 hover:text-white/60'}" class="flex-1 cursor-pointer py-2 text-sm transition-colors {activeTab ===
'register'
? '-mb-px border-b border-white text-white'
: 'text-white/40 hover:text-white/60'}"
> >
Register Register
</button> </button>
@@ -37,29 +42,30 @@
<div class="flex flex-col gap-3"> <div class="flex flex-col gap-3">
<div class="flex flex-col gap-1"> <div class="flex flex-col gap-1">
<label for="username" class="text-white/30 text-xs">Username</label> <label for="username" class="text-xs text-white/30">Username</label>
<input <input
id="username" id="username"
bind:value={username} bind:value={username}
type="text" type="text"
autocomplete="username" autocomplete="username"
class="px-4 py-2 rounded-sm bg-[#0f1117]! border border-sky-200/15 transition-colors hover:bg-black/20 hover:border-sky-200/30 text-white/80 text-sm focus:outline-none focus:border-sky-200/40" class="rounded-sm border border-sky-200/15 bg-[#0f1117]! px-4 py-2 text-sm text-white/80 transition-colors hover:border-sky-200/30 hover:bg-black/20 focus:border-sky-200/40 focus:outline-none"
/> />
</div> </div>
<div class="flex flex-col gap-1"> <div class="flex flex-col gap-1">
<label for="password" class="text-white/30 text-xs">Password</label> <label for="password" class="text-xs text-white/30">Password</label>
<input <input
id="password" id="password"
bind:value={password} bind:value={password}
type="password" type="password"
autocomplete="current-password" autocomplete="current-password"
class="px-4 py-2 rounded-sm bg-[#0f1117]! border border-sky-200/15 transition-colors hover:bg-black/20 hover:border-sky-200/30 text-white/80 text-sm focus:outline-none focus:border-sky-200/40" class="rounded-sm border border-sky-200/15 bg-[#0f1117]! px-4 py-2 text-sm text-white/80 transition-colors hover:border-sky-200/30 hover:bg-black/20 focus:border-sky-200/40 focus:outline-none"
/> />
</div> </div>
{#if error}<p class="text-red-400/60 text-xs">{error}</p>{/if} {#if error}<p class="text-xs text-red-400/60">{error}</p>{/if}
<button <button
onclick={handleSubmit} onclick={handleSubmit}
class="mt-1 px-4 py-2 border border-sky-200/15 text-white/40 hover:border-sky-200/30 hover:text-white/60 text-sm transition-colors rounded-sm cursor-pointer"> class="mt-1 cursor-pointer rounded-sm border border-sky-200/15 px-4 py-2 text-sm text-white/40 transition-colors hover:border-sky-200/30 hover:text-white/60"
>
{activeTab === 'login' ? 'Login' : 'Register'} {activeTab === 'login' ? 'Login' : 'Register'}
</button> </button>
</div> </div>

110
frontend/src/routes/layout.css
View File

@@ -4,110 +4,110 @@
@import '@fontsource/fira-mono'; @import '@fontsource/fira-mono';
:root { :root {
--font-body: --font-body:
Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
'Open Sans', 'Helvetica Neue', sans-serif; 'Open Sans', 'Helvetica Neue', sans-serif;
--font-mono: 'Fira Mono', monospace; --font-mono: 'Fira Mono', monospace;
--color-text: rgba(255, 255, 255, 0.87); --color-text: rgba(255, 255, 255, 0.87);
--column-width: 42rem; --column-width: 42rem;
--column-margin-top: 4rem; --column-margin-top: 4rem;
font-family: var(--font-body); font-family: var(--font-body);
color: var(--color-text); color: var(--color-text);
} }
body { body {
min-height: 100vh; min-height: 100vh;
margin: 0; margin: 0;
background-color: #0f1117; background-color: #0f1117;
} }
h1, h1,
h2, h2,
p { p {
font-weight: 400; font-weight: 400;
} }
p { p {
line-height: 1.5; line-height: 1.5;
} }
a { a {
color: var(--color-theme-1); color: var(--color-theme-1);
text-decoration: none; text-decoration: none;
} }
a:hover { a:hover {
text-decoration: underline; text-decoration: underline;
} }
h1 { h1 {
font-size: 2rem; font-size: 2rem;
text-align: center; text-align: center;
} }
h2 { h2 {
font-size: 1rem; font-size: 1rem;
} }
pre { pre {
font-size: 16px; font-size: 16px;
font-family: var(--font-mono); font-family: var(--font-mono);
background-color: rgba(255, 255, 255, 0.45); background-color: rgba(255, 255, 255, 0.45);
border-radius: 3px; border-radius: 3px;
box-shadow: 2px 2px 6px rgb(255 255 255 / 25%); box-shadow: 2px 2px 6px rgb(255 255 255 / 25%);
padding: 0.5em; padding: 0.5em;
overflow-x: auto; overflow-x: auto;
color: var(--color-text); color: var(--color-text);
} }
.text-column { .text-column {
display: flex; display: flex;
max-width: 48rem; max-width: 48rem;
flex: 0.6; flex: 0.6;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
margin: 0 auto; margin: 0 auto;
} }
input, input,
button { button {
font-size: inherit; font-size: inherit;
font-family: inherit; font-family: inherit;
} }
input:-webkit-autofill, input:-webkit-autofill,
input:-webkit-autofill:hover, input:-webkit-autofill:hover,
input:-webkit-autofill:focus, input:-webkit-autofill:focus,
input:-webkit-autofill:active { input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 1000px #0f1117 inset !important; -webkit-box-shadow: 0 0 0 1000px #0f1117 inset !important;
-webkit-text-fill-color: #ffffffcc !important; -webkit-text-fill-color: #ffffffcc !important;
font-size: 16px !important; font-size: 16px !important;
} }
input:-moz-autofill { input:-moz-autofill {
background-color: #0f1117 !important; background-color: #0f1117 !important;
color: #ffffffcc !important; color: #ffffffcc !important;
filter: none !important; filter: none !important;
} }
button:focus:not(:focus-visible) { button:focus:not(:focus-visible) {
outline: none; outline: none;
} }
@media (min-width: 720px) { @media (min-width: 720px) {
h1 { h1 {
font-size: 2.4rem; font-size: 2.4rem;
} }
} }
.visually-hidden { .visually-hidden {
border: 0; border: 0;
clip: rect(0 0 0 0); clip: rect(0 0 0 0);
height: auto; height: auto;
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
padding: 0; padding: 0;
position: absolute; position: absolute;
width: 1px; width: 1px;
white-space: nowrap; white-space: nowrap;
} }

12
frontend/svelte.config.js
View File

@@ -2,12 +2,12 @@ import adapter from '@sveltejs/adapter-auto';
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
const config = { const config = {
kit: { kit: {
// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list. // adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
// If your environment is not supported, or you settled on a specific environment, switch out the adapter. // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
// See https://svelte.dev/docs/kit/adapters for more information about adapters. // See https://svelte.dev/docs/kit/adapters for more information about adapters.
adapter: adapter() adapter: adapter()
} }
}; };
export default config; export default config;

36
frontend/tsconfig.json
View File

@@ -1,20 +1,20 @@
{ {
"extends": "./.svelte-kit/tsconfig.json", "extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": { "compilerOptions": {
"rewriteRelativeImportExtensions": true, "rewriteRelativeImportExtensions": true,
"allowJs": true, "allowJs": true,
"checkJs": true, "checkJs": true,
"esModuleInterop": true, "esModuleInterop": true,
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
"resolveJsonModule": true, "resolveJsonModule": true,
"skipLibCheck": true, "skipLibCheck": true,
"sourceMap": true, "sourceMap": true,
"strict": true, "strict": true,
"moduleResolution": "bundler" "moduleResolution": "bundler"
} }
// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias // Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files // except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
// //
// To make changes to top-level options such as include and exclude, we recommend extending // To make changes to top-level options such as include and exclude, we recommend extending
// the generated config; see https://svelte.dev/docs/kit/configuration#typescript // the generated config; see https://svelte.dev/docs/kit/configuration#typescript
} }

64
frontend/vite.config.ts
View File

@@ -4,38 +4,38 @@ import tailwindcss from '@tailwindcss/vite';
import { sveltekit } from '@sveltejs/kit/vite'; import { sveltekit } from '@sveltejs/kit/vite';
export default defineConfig({ export default defineConfig({
plugins: [tailwindcss(), sveltekit()], plugins: [tailwindcss(), sveltekit()],
server: { server: {
proxy: { proxy: {
'/api': 'http://localhost:3000' '/api': 'http://localhost:3000'
} }
}, },
test: { test: {
expect: { requireAssertions: true }, expect: { requireAssertions: true },
projects: [ projects: [
{ {
extends: './vite.config.ts', extends: './vite.config.ts',
test: { test: {
name: 'client', name: 'client',
browser: { browser: {
enabled: true, enabled: true,
provider: playwright(), provider: playwright(),
instances: [{ browser: 'chromium', headless: true }] instances: [{ browser: 'chromium', headless: true }]
}, },
include: ['src/**/*.svelte.{test,spec}.{js,ts}'], include: ['src/**/*.svelte.{test,spec}.{js,ts}'],
exclude: ['src/lib/server/**'] exclude: ['src/lib/server/**']
} }
}, },
{ {
extends: './vite.config.ts', extends: './vite.config.ts',
test: { test: {
name: 'server', name: 'server',
environment: 'node', environment: 'node',
include: ['src/**/*.{test,spec}.{js,ts}'], include: ['src/**/*.{test,spec}.{js,ts}'],
exclude: ['src/**/*.svelte.{test,spec}.{js,ts}'] exclude: ['src/**/*.svelte.{test,spec}.{js,ts}']
} }
} }
] ]
} }
}); });

7
package.json Normal file
View File

@@ -0,0 +1,7 @@
{
"devDependencies": {
"prettier": "^3.8.3",
"prettier-plugin-svelte": "^4.1.0",
"prettier-plugin-tailwindcss": "^0.8.0"
}
}

253
pnpm-lock.yaml generated Normal file
View File

@@ -0,0 +1,253 @@
lockfileVersion: '9.0'
settings:
autoInstallPeers: true
excludeLinksFromLockfile: false
importers:
.:
devDependencies:
prettier:
specifier: ^3.8.3
version: 3.8.3
prettier-plugin-svelte:
specifier: ^4.1.0
version: 4.1.0(prettier@3.8.3)(svelte@5.56.0)
prettier-plugin-tailwindcss:
specifier: ^0.8.0
version: 0.8.0(prettier-plugin-svelte@4.1.0(prettier@3.8.3)(svelte@5.56.0))(prettier@3.8.3)
packages:
'@jridgewell/gen-mapping@0.3.13':
resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
'@jridgewell/remapping@2.3.5':
resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
'@jridgewell/resolve-uri@3.1.2':
resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
engines: {node: '>=6.0.0'}
'@jridgewell/sourcemap-codec@1.5.5':
resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
'@jridgewell/trace-mapping@0.3.31':
resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
'@sveltejs/acorn-typescript@1.0.10':
resolution: {integrity: sha512-4WfKk68eTih+MiJD4fSbxN7E8kVBmTMPWHUPYjvl2N0rMs53YLTT8/YjKU5Dtnz5LqDjl7LEw4U7lXR2W3J5WA==}
peerDependencies:
acorn: ^8.9.0
'@types/estree@1.0.9':
resolution: {integrity: sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==}
'@types/trusted-types@2.0.7':
resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
acorn@8.16.0:
resolution: {integrity: sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==}
engines: {node: '>=0.4.0'}
hasBin: true
aria-query@5.3.1:
resolution: {integrity: sha512-Z/ZeOgVl7bcSYZ/u/rh0fOpvEpq//LZmdbkXyc7syVzjPAhfOa9ebsdTSjEBDU4vs5nC98Kfduj1uFo0qyET3g==}
engines: {node: '>= 0.4'}
axobject-query@4.1.0:
resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==}
engines: {node: '>= 0.4'}
clsx@2.1.1:
resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
engines: {node: '>=6'}
devalue@5.8.1:
resolution: {integrity: sha512-4CXDYRBGqN+57wVJkuXBYmpAVUSg3L6JAQa/DFqm238G73E1wuyc/JhGQJzN7vUf/CMphYau2zXbfWzDR5aTEw==}
esm-env@1.2.2:
resolution: {integrity: sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==}
esrap@2.2.9:
resolution: {integrity: sha512-4KijP+NxCWthMCUC3qHbE6n4vCjqgJS1uAYKhuT/GWfFTf1Qyive2TgOjep+gzbSzRfnNyaN/UU9YmdOt8Eg0A==}
peerDependencies:
'@typescript-eslint/types': ^8.2.0
peerDependenciesMeta:
'@typescript-eslint/types':
optional: true
is-reference@3.0.3:
resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==}
locate-character@3.0.0:
resolution: {integrity: sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==}
magic-string@0.30.21:
resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
prettier-plugin-svelte@4.1.0:
resolution: {integrity: sha512-YZkhA2Q9oOerFFG9tq+2f98WYT7Z2JgrybJrAyrB78jpsH9i/DdgplXemehuFPgsldetFNCcR/yCcYlDjPy94Q==}
engines: {node: '>=20'}
peerDependencies:
prettier: ^3.0.0
svelte: ^5.0.0
prettier-plugin-tailwindcss@0.8.0:
resolution: {integrity: sha512-V8ITGH87yuBDF6JpEZTOVlUz/saAwqb8f3HRgUj8Lh+tGCcrmorhsLpYqzygwFwK0PE2Ib6Mv3M7T/uE2tZV1g==}
engines: {node: '>=20.19'}
peerDependencies:
'@ianvs/prettier-plugin-sort-imports': '*'
'@prettier/plugin-hermes': '*'
'@prettier/plugin-oxc': '*'
'@prettier/plugin-pug': '*'
'@shopify/prettier-plugin-liquid': '*'
'@trivago/prettier-plugin-sort-imports': '*'
'@zackad/prettier-plugin-twig': '*'
prettier: ^3.0
prettier-plugin-astro: '*'
prettier-plugin-css-order: '*'
prettier-plugin-jsdoc: '*'
prettier-plugin-marko: '*'
prettier-plugin-multiline-arrays: '*'
prettier-plugin-organize-attributes: '*'
prettier-plugin-organize-imports: '*'
prettier-plugin-sort-imports: '*'
prettier-plugin-svelte: '*'
peerDependenciesMeta:
'@ianvs/prettier-plugin-sort-imports':
optional: true
'@prettier/plugin-hermes':
optional: true
'@prettier/plugin-oxc':
optional: true
'@prettier/plugin-pug':
optional: true
'@shopify/prettier-plugin-liquid':
optional: true
'@trivago/prettier-plugin-sort-imports':
optional: true
'@zackad/prettier-plugin-twig':
optional: true
prettier-plugin-astro:
optional: true
prettier-plugin-css-order:
optional: true
prettier-plugin-jsdoc:
optional: true
prettier-plugin-marko:
optional: true
prettier-plugin-multiline-arrays:
optional: true
prettier-plugin-organize-attributes:
optional: true
prettier-plugin-organize-imports:
optional: true
prettier-plugin-sort-imports:
optional: true
prettier-plugin-svelte:
optional: true
prettier@3.8.3:
resolution: {integrity: sha512-7igPTM53cGHMW8xWuVTydi2KO233VFiTNyF5hLJqpilHfmn8C8gPf+PS7dUT64YcXFbiMGZxS9pCSxL/Dxm/Jw==}
engines: {node: '>=14'}
hasBin: true
svelte@5.56.0:
resolution: {integrity: sha512-kTXr26t1bchFp28ROrb957LtbujpBmBDibmqMGziVpUs7awBi96TGgX6SovrA8BNoEUDVRK2Fb9FkeYlGspoVg==}
engines: {node: '>=18'}
zimmerframe@1.1.4:
resolution: {integrity: sha512-B58NGBEoc8Y9MWWCQGl/gq9xBCe4IiKM0a2x7GZdQKOW5Exr8S1W24J6OgM1njK8xCRGvAJIL/MxXHf6SkmQKQ==}
snapshots:
'@jridgewell/gen-mapping@0.3.13':
dependencies:
'@jridgewell/sourcemap-codec': 1.5.5
'@jridgewell/trace-mapping': 0.3.31
'@jridgewell/remapping@2.3.5':
dependencies:
'@jridgewell/gen-mapping': 0.3.13
'@jridgewell/trace-mapping': 0.3.31
'@jridgewell/resolve-uri@3.1.2': {}
'@jridgewell/sourcemap-codec@1.5.5': {}
'@jridgewell/trace-mapping@0.3.31':
dependencies:
'@jridgewell/resolve-uri': 3.1.2
'@jridgewell/sourcemap-codec': 1.5.5
'@sveltejs/acorn-typescript@1.0.10(acorn@8.16.0)':
dependencies:
acorn: 8.16.0
'@types/estree@1.0.9': {}
'@types/trusted-types@2.0.7': {}
acorn@8.16.0: {}
aria-query@5.3.1: {}
axobject-query@4.1.0: {}
clsx@2.1.1: {}
devalue@5.8.1: {}
esm-env@1.2.2: {}
esrap@2.2.9:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.5
is-reference@3.0.3:
dependencies:
'@types/estree': 1.0.9
locate-character@3.0.0: {}
magic-string@0.30.21:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.5
prettier-plugin-svelte@4.1.0(prettier@3.8.3)(svelte@5.56.0):
dependencies:
prettier: 3.8.3
svelte: 5.56.0
prettier-plugin-tailwindcss@0.8.0(prettier-plugin-svelte@4.1.0(prettier@3.8.3)(svelte@5.56.0))(prettier@3.8.3):
dependencies:
prettier: 3.8.3
optionalDependencies:
prettier-plugin-svelte: 4.1.0(prettier@3.8.3)(svelte@5.56.0)
prettier@3.8.3: {}
svelte@5.56.0:
dependencies:
'@jridgewell/remapping': 2.3.5
'@jridgewell/sourcemap-codec': 1.5.5
'@sveltejs/acorn-typescript': 1.0.10(acorn@8.16.0)
'@types/estree': 1.0.9
'@types/trusted-types': 2.0.7
acorn: 8.16.0
aria-query: 5.3.1
axobject-query: 4.1.0
clsx: 2.1.1
devalue: 5.8.1
esm-env: 1.2.2
esrap: 2.2.9
is-reference: 3.0.3
locate-character: 3.0.0
magic-string: 0.30.21
zimmerframe: 1.1.4
transitivePeerDependencies:
- '@typescript-eslint/types'
zimmerframe@1.1.4: {}