style: auto-format codebase with Prettier

Applied formatting to 1487+ files using pnpm format:write
  - TypeScript/JavaScript files
  - Svelte components
  - Astro pages
  - JSON configs
  - Markdown docs

  13 files still need manual review (Astro JSX comments)
This commit is contained in:
Wuesteon 2025-11-27 18:33:16 +01:00
parent 0241f5554c
commit d36b321d9d
3952 changed files with 661498 additions and 739751 deletions

View file

@ -23,7 +23,7 @@
description,
disabled = false,
indeterminate = false,
class: className = ''
class: className = '',
}: Props = $props();
let inputElement: HTMLInputElement | null = $state(null);
@ -53,11 +53,23 @@
/>
<div class="checkbox-box">
{#if indeterminate}
<svg class="checkbox-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
<svg
class="checkbox-icon"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="3"
>
<line x1="5" y1="12" x2="19" y2="12" />
</svg>
{:else if checked}
<svg class="checkbox-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
<svg
class="checkbox-icon"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="3"
>
<polyline points="20 6 9 17 4 12" />
</svg>
{/if}

View file

@ -67,14 +67,14 @@
metadata,
actions,
badge,
class: className = ''
class: className = '',
}: Props = $props();
const variantClasses: Record<CardVariant, string> = {
default: 'bg-menu border border-theme',
elevated: 'bg-menu border border-theme shadow-md',
outlined: 'bg-transparent border-2 border-theme',
ghost: 'bg-transparent border-transparent hover:bg-menu-hover'
ghost: 'bg-transparent border-transparent hover:bg-menu-hover',
};
const isClickable = $derived(interactive || !!onclick);
@ -84,7 +84,7 @@
class="data-card rounded-xl p-4 transition-colors {variantClasses[variant]} {isClickable
? 'cursor-pointer hover:bg-menu-hover'
: ''} {className}"
onclick={onclick}
{onclick}
onkeydown={(e) => {
if (isClickable && onclick && (e.key === 'Enter' || e.key === ' ')) {
e.preventDefault();
@ -139,7 +139,10 @@
{#if actions}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<!-- svelte-ignore a11y_click_events_have_key_events -->
<div class="data-card__actions flex-shrink-0 flex items-center gap-1" onclick={(e) => e.stopPropagation()}>
<div
class="data-card__actions flex-shrink-0 flex items-center gap-1"
onclick={(e) => e.stopPropagation()}
>
{@render actions()}
</div>
{/if}

View file

@ -30,7 +30,7 @@
autocomplete,
class: className = '',
id = `input-${Math.random().toString(36).slice(2, 9)}`,
name
name,
}: Props = $props();
function handleInput(e: Event) {
@ -70,7 +70,7 @@
? 'border-red-500 focus:ring-red-500/50'
: 'border-theme'}"
/>
{#if error}
<p class="text-sm text-red-500">{error}</p>
{/if}

View file

@ -59,7 +59,7 @@
expanded = $bindable(false),
collapsible = true,
compact = false,
class: className = ''
class: className = '',
}: Props = $props();
// Group shortcuts by category
@ -116,7 +116,12 @@
stroke="currentColor"
viewBox="0 0 24 24"
>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M19 9l-7 7-7-7"
/>
</svg>
{/if}
</button>
@ -162,14 +167,9 @@
<button
type="button"
class="w-full flex items-center justify-center p-2 hover:bg-menu-hover rounded-lg transition-colors group relative"
title={title}
{title}
>
<svg
class="w-5 h-5 text-theme-secondary"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<svg class="w-5 h-5 text-theme-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"

View file

@ -60,14 +60,14 @@
loading = false,
disabled = false,
align = 'end',
class: className = ''
class: className = '',
}: Props = $props();
const alignClasses: Record<string, string> = {
start: 'justify-start',
center: 'justify-center',
end: 'justify-end',
between: 'justify-between'
between: 'justify-between',
};
</script>
@ -78,7 +78,7 @@
</Button>
{/if}
{#if confirmLabel && onConfirm}
<Button variant={confirmVariant} onclick={onConfirm} {loading} disabled={disabled}>
<Button variant={confirmVariant} onclick={onConfirm} {loading} {disabled}>
{confirmLabel}
</Button>
{/if}

View file

@ -69,22 +69,22 @@
breadcrumb,
actions,
tabs,
class: className = ''
class: className = '',
}: Props = $props();
const sizeClasses: Record<HeaderSize, { container: string; title: string }> = {
sm: {
container: 'py-3',
title: 'text-lg'
title: 'text-lg',
},
md: {
container: 'py-4',
title: 'text-xl'
title: 'text-xl',
},
lg: {
container: 'py-6',
title: 'text-2xl'
}
title: 'text-2xl',
},
};
</script>

View file

@ -34,7 +34,7 @@
disabled = false,
required = false,
class: className = '',
id = `select-${Math.random().toString(36).slice(2, 9)}`
id = `select-${Math.random().toString(36).slice(2, 9)}`,
}: Props = $props();
function handleChange(e: Event) {

View file

@ -44,7 +44,7 @@
required = false,
autoResize = false,
class: className = '',
id = `textarea-${Math.random().toString(36).slice(2, 9)}`
id = `textarea-${Math.random().toString(36).slice(2, 9)}`,
}: Props = $props();
let textareaElement: HTMLTextAreaElement | null = $state(null);
@ -90,7 +90,9 @@
{required}
oninput={handleInput}
onchange={handleChange}
class="textarea-input {error || isOverLimit ? 'textarea-input--error' : ''} {autoResize ? 'textarea-input--auto-resize' : ''}"
class="textarea-input {error || isOverLimit ? 'textarea-input--error' : ''} {autoResize
? 'textarea-input--auto-resize'
: ''}"
></textarea>
<div class="textarea-footer">

View file

@ -16,7 +16,7 @@
const sizeClasses = {
sm: { track: 'h-6 w-10', thumb: 'h-4 w-4 top-1 left-1', translate: 'translate-x-4' },
md: { track: 'h-8 w-14', thumb: 'h-6 w-6 top-1 left-1', translate: 'translate-x-6' }
md: { track: 'h-8 w-14', thumb: 'h-6 w-6 top-1 left-1', translate: 'translate-x-6' },
};
</script>
@ -31,7 +31,8 @@
{disabled}
>
<span
class="absolute {sizeClasses[size].thumb} rounded-full bg-white shadow-md transition-transform {isOn
class="absolute {sizeClasses[size]
.thumb} rounded-full bg-white shadow-md transition-transform {isOn
? sizeClasses[size].translate
: 'translate-x-0'}"
></span>

View file

@ -63,18 +63,20 @@
onSecondaryAction,
variant = 'default',
icon,
class: className = ''
class: className = '',
}: Props = $props();
const variantClasses: Record<EmptyStateVariant, string> = {
default: 'py-12 px-6',
compact: 'py-6 px-4',
centered: 'py-16 px-8'
centered: 'py-16 px-8',
};
</script>
<div
class="empty-state flex flex-col items-center justify-center text-center {variantClasses[variant]} {className}"
class="empty-state flex flex-col items-center justify-center text-center {variantClasses[
variant
]} {className}"
>
<!-- Icon -->
{#if icon}

View file

@ -30,7 +30,7 @@
height = '20px',
borderRadius = '4px',
circle = false,
class: className = ''
class: className = '',
}: Props = $props();
const computedRadius = $derived(circle ? '50%' : borderRadius);

View file

@ -31,15 +31,12 @@
lineHeight = '16px',
gap = '8px',
lastLineWidth = '70%',
class: className = ''
class: className = '',
}: Props = $props();
</script>
<div class="skeleton-text {className}" style="display: flex; flex-direction: column; gap: {gap};">
{#each Array(lines) as _, i}
<SkeletonBox
width={i === lines - 1 ? lastLineWidth : '100%'}
height={lineHeight}
/>
<SkeletonBox width={i === lines - 1 ? lastLineWidth : '100%'} height={lineHeight} />
{/each}
</div>

View file

@ -93,9 +93,7 @@
}
// Calculate progress percentage for styling
const progressPercent = $derived(
audioDuration > 0 ? (currentTime / audioDuration) * 100 : 0
);
const progressPercent = $derived(audioDuration > 0 ? (currentTime / audioDuration) * 100 : 0);
</script>
<div class="rounded-2xl border border-theme bg-content p-4">
@ -133,7 +131,12 @@
{@render skipBackIcon()}
{:else}
<svg class="h-6 w-6 text-theme" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12.066 11.2a1 1 0 000 1.6l5.334 4A1 1 0 0019 16V8a1 1 0 00-1.6-.8l-5.333 4zM4.066 11.2a1 1 0 000 1.6l5.334 4A1 1 0 0011 16V8a1 1 0 00-1.6-.8l-5.334 4z" />
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12.066 11.2a1 1 0 000 1.6l5.334 4A1 1 0 0019 16V8a1 1 0 00-1.6-.8l-5.333 4zM4.066 11.2a1 1 0 000 1.6l5.334 4A1 1 0 0011 16V8a1 1 0 00-1.6-.8l-5.334 4z"
/>
</svg>
{/if}
</button>
@ -148,7 +151,8 @@
>
{#if isLoading}
<svg class="h-6 w-6 animate-spin" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"
></circle>
<path
class="opacity-75"
fill="currentColor"
@ -163,14 +167,12 @@
<path d="M6 4h4v16H6V4zm8 0h4v16h-4V4z" />
</svg>
{/if}
{:else if playIcon}
{@render playIcon()}
{:else}
{#if playIcon}
{@render playIcon()}
{:else}
<svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24">
<path d="M8 5v14l11-7z" />
</svg>
{/if}
<svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24">
<path d="M8 5v14l11-7z" />
</svg>
{/if}
</button>
@ -186,7 +188,12 @@
{@render skipForwardIcon()}
{:else}
<svg class="h-6 w-6 text-theme" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11.933 12.8a1 1 0 000-1.6L6.6 7.2A1 1 0 005 8v8a1 1 0 001.6.8l5.333-4zM19.933 12.8a1 1 0 000-1.6l-5.333-4A1 1 0 0013 8v8a1 1 0 001.6.8l5.333-4z" />
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M11.933 12.8a1 1 0 000-1.6L6.6 7.2A1 1 0 005 8v8a1 1 0 001.6.8l5.333-4zM19.933 12.8a1 1 0 000-1.6l-5.333-4A1 1 0 0013 8v8a1 1 0 001.6.8l5.333-4z"
/>
</svg>
{/if}
</button>

View file

@ -28,13 +28,7 @@
onClick?: () => void;
}
let {
tag,
removable = false,
clickable = false,
onRemove,
onClick
}: Props = $props();
let { tag, removable = false, clickable = false, onRemove, onClick }: Props = $props();
// Get tag color from either style.color (new format) or color (old format)
const tagColor = $derived(tag.style?.color || tag.color || '#3b82f6');
@ -84,7 +78,12 @@
aria-label="Remove tag"
>
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
</button>
{/if}