chore: add prettier, eslint, fix some components

This commit is contained in:
2026-08-27 20:34:16 +05:00
parent 0acfa3aeb9
commit bc5a5d13c4
14 changed files with 1204 additions and 73 deletions
+8
View File
@@ -0,0 +1,8 @@
node_modules
build
.svelte-kit
dist
pnpm-lock.yaml
static
*.log
.DS_Store
+23
View File
@@ -0,0 +1,23 @@
{
"useTabs": true,
"singleQuote": false,
"trailingComma": "all",
"printWidth": 80,
"proseWrap": "always",
"endOfLine": "lf",
"plugins": ["prettier-plugin-svelte"],
"overrides": [
{
"files": "*.md",
"options": {
"useTabs": false
}
},
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
]
}
+91
View File
@@ -0,0 +1,91 @@
import js from "@eslint/js";
import prettier from "eslint-config-prettier";
import svelte from "eslint-plugin-svelte";
import globals from "globals";
import svelteParser from "svelte-eslint-parser";
import tseslint from "typescript-eslint";
// Новый код редизайна: к нему применяем полные recommended-наборы уже сейчас.
// Когда старый дизайн удалим (C19), этот scoped-блок убирается и recommended
// включается на весь код (см. план-redesign §10, шаг 6).
const newCode = ["**/src/lib/components/kit/**", "**/src/routes/preview/**"];
export default tseslint.config(
{
ignores: [
"**/node_modules/**",
"**/build/**",
"**/.svelte-kit/**",
"**/dist/**",
"**/static/**",
],
},
// Минимально на весь код: парсинг TS/Svelte + запрет инлайн-тип-импортов.
{
files: ["**/*.ts", "**/*.svelte.ts", "**/*.svelte.js", "**/*.svelte"],
languageOptions: {
globals: {
...globals.browser,
...globals.node,
},
parserOptions: {
projectService: {
allowDefaultProject: [
"vitest.config.ts",
"eslint.config.js",
"svelte.config.js",
],
},
extraFileExtensions: [".svelte"],
},
},
plugins: {
"@typescript-eslint": tseslint.plugin,
},
rules: {
// Инлайн-тип-импорты (import('x').Y) запрещены — только
// `import type { Y } from 'x'` наверху файла.
"@typescript-eslint/consistent-type-imports": [
"error",
{ prefer: "type-imports", fixStyle: "separate-type-imports" },
],
},
},
{
files: ["**/*.ts", "**/*.svelte.ts", "**/*.svelte.js"],
languageOptions: {
parser: tseslint.parser,
},
},
{
files: ["**/*.svelte"],
languageOptions: {
parser: svelteParser,
parserOptions: {
parser: tseslint.parser,
},
},
},
// Полные recommended-наборы — только на новый код.
...[
...(Array.isArray(js.configs.recommended)
? js.configs.recommended
: [js.configs.recommended]),
...tseslint.configs.recommended,
...svelte.configs["flat/recommended"],
].map((cfg) => ({
...cfg,
files: newCode,
})),
// В Svelte 5 пропсы деструктурируются через `let` (конвенция документации и
// наш AGENTS.md), поэтому prefer-const на них — ложноположительный.
{
files: ["**/*.svelte"],
rules: {
"prefer-const": "off",
},
},
// prettier — последним, чтобы гасить форматирующие правила из recommended.
prettier,
);
+12 -1
View File
@@ -10,15 +10,26 @@
"prepare": "svelte-kit sync || echo ''",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"test": "vitest run"
"test": "vitest run",
"format": "prettier --write .",
"lint": "eslint ."
},
"devDependencies": {
"@eslint/js": "^10.0.1",
"@sveltejs/adapter-static": "^3.0.10",
"@sveltejs/kit": "^2.63.0",
"@sveltejs/vite-plugin-svelte": "^7.1.2",
"eslint": "^10.9.0",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-svelte": "^3.23.0",
"globals": "^17.11.0",
"prettier": "^3.9.6",
"prettier-plugin-svelte": "^4.1.1",
"svelte": "^5.56.1",
"svelte-check": "^4.6.0",
"svelte-eslint-parser": "^1.8.1",
"typescript": "^6.0.3",
"typescript-eslint": "^8.67.0",
"vite": "^8.0.16",
"vitest": "^4.1.11"
},
+969 -20
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import BlueprintGrid from './BlueprintGrid.svelte';
import BlueprintGrid from "./BlueprintGrid.svelte";
let { children } = $props();
</script>
@@ -6,8 +6,16 @@
inset: 0;
pointer-events: none;
background-image:
linear-gradient(to right, color-mix(in srgb, var(--line) 45%, transparent) 1px, transparent 1px),
linear-gradient(to bottom, color-mix(in srgb, var(--line) 45%, transparent) 1px, transparent 1px);
linear-gradient(
to right,
color-mix(in srgb, var(--line) 45%, transparent) 1px,
transparent 1px
),
linear-gradient(
to bottom,
color-mix(in srgb, var(--line) 45%, transparent) 1px,
transparent 1px
);
background-size: 32px 32px;
opacity: 0.55;
}
+32 -28
View File
@@ -1,40 +1,44 @@
<script lang="ts">
import type { Snippet } from "svelte";
interface Props {
children?: import('svelte').Snippet;
size?: 'sm' | 'large';
children?: Snippet;
size?: "sm" | "large";
}
let { children, size = 'large' }: Props = $props();
let { children, size = "large" }: Props = $props();
</script>
<div class="checker-canvas checker-canvas--{size}">
{#if children}
{@render children()}
{/if}
{#if children}
{@render children()}
{/if}
</div>
<style>
.checker-canvas {
position: relative;
display: grid;
place-items: center;
overflow: hidden;
background-color: #0b0f14;
background-image: linear-gradient(45deg, #1a2129 25%, transparent 25%),
linear-gradient(-45deg, #1a2129 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #1a2129 75%),
linear-gradient(-45deg, transparent 75%, #1a2129 75%);
background-size: 20px 20px;
background-position:
0 0,
0 10px,
10px -10px,
-10px 0;
}
.checker-canvas {
position: relative;
display: grid;
place-items: center;
overflow: hidden;
background-color: #0b0f14;
background-image:
linear-gradient(45deg, #1a2129 25%, transparent 25%),
linear-gradient(-45deg, #1a2129 25%, transparent 25%),
linear-gradient(45deg, transparent 75%, #1a2129 75%),
linear-gradient(-45deg, transparent 75%, #1a2129 75%);
background-size: 20px 20px;
background-position:
0 0,
0 10px,
10px -10px,
-10px 0;
}
.checker-canvas--sm {
min-height: 180px;
}
.checker-canvas--sm {
min-height: 180px;
}
.checker-canvas--large {
min-height: 360px;
}
.checker-canvas--large {
min-height: 360px;
}
</style>
+4 -2
View File
@@ -1,13 +1,15 @@
<script lang="ts">
import type { Snippet } from "svelte";
interface Props {
accent?: boolean;
children?: import('svelte').Snippet;
children?: Snippet;
}
let { accent = false, children }: Props = $props();
</script>
<span class="mono-label" class:accent={accent}>
<span class="mono-label" class:accent>
{#if children}
{@render children()}
{/if}
+2 -2
View File
@@ -1,6 +1,6 @@
<script lang="ts">
import StatusDot from './StatusDot.svelte';
import MonoLabel from './MonoLabel.svelte';
import StatusDot from "./StatusDot.svelte";
import MonoLabel from "./MonoLabel.svelte";
interface Props {
label: string;
+9 -9
View File
@@ -1,17 +1,17 @@
@import '@fontsource/ibm-plex-sans/400.css';
@import '@fontsource/ibm-plex-sans/500.css';
@import '@fontsource/ibm-plex-sans/600.css';
@import '@fontsource/ibm-plex-sans/700.css';
@import '@fontsource/ibm-plex-mono/400.css';
@import '@fontsource/ibm-plex-mono/500.css';
@import "@fontsource/ibm-plex-sans/400.css";
@import "@fontsource/ibm-plex-sans/500.css";
@import "@fontsource/ibm-plex-sans/600.css";
@import "@fontsource/ibm-plex-sans/700.css";
@import "@fontsource/ibm-plex-mono/400.css";
@import "@fontsource/ibm-plex-mono/500.css";
/* Новый дизайн: токены (§2 плана redesign).
Файл грузится только layout'ом новой ветки (preview/+layout), поэтому
глобально не конфликтует со старым app.css. */
:root {
--font-sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
--font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;
--font-sans: "IBM Plex Sans", system-ui, -apple-system, sans-serif;
--font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;
--background: #eef1f4;
--panel: #f8fafb;
@@ -28,7 +28,7 @@
--radius: 4px;
}
[data-theme='dark'] {
[data-theme="dark"] {
--background: #11171d;
--panel: #182129;
--foreground: #e8eef2;