[core]: linting and formatting precommit hook

.config/cz-config.js

@@ -7,23 +7,23 @@ module.exports = {
 		{ value: 'docs', name: 'docs: Changes to the documentation' },
 		{
 			value: 'style',
-			name: 'style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)',
+			name: 'style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)'
 		},
 		{
 			value: 'refactor',
-			name: 'refactor: A code change that neither fixes a bug nor adds a feature',
+			name: 'refactor: A code change that neither fixes a bug nor adds a feature'
 		},
 		{
 			value: 'perf',
-			name: 'perf: A code change that improves performance',
+			name: 'perf: A code change that improves performance'
 		},
 		{ value: 'test', name: 'test: Adding missing tests' },
 		{
 			value: 'chore',
-			name: 'chore: Changes to the build process or auxiliary tools and libraries such as documentation generation',
+			name: 'chore: Changes to the build process or auxiliary tools and libraries such as documentation generation'
 		},
 		{ value: 'revert', name: 'revert: Revert to a commit' },
-		{ value: 'WIP', name: 'WIP: Work in progress' },
+		{ value: 'WIP', name: 'WIP: Work in progress' }
 	],
 	scopes: [
 		{

.github/workflows/deploy-docs.yml

@@ -46,8 +46,8 @@ jobs:
     environment:
       name: github-pages
       url: ${{ steps.deployment.outputs.page_url }}
-    
+
     steps:
       - name: Deploy
         id: deployment
-        uses: actions/deploy-pages@v1
+        uses: actions/deploy-pages@v1

.lintstagedrc

@@ -1 +0,0 @@
-

.prettierrc

@@ -1,6 +1,6 @@
 {
-  "useTabs": true,
-  "singleQuote": true,
-  "trailingComma": "none",
-  "printWidth": 100
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100
 }

.svelte-kit/tsconfig.json

@@ -2,18 +2,11 @@
 	"compilerOptions": {
 		"baseUrl": "..",
 		"paths": {},
-		"rootDirs": [
-			"..",
-			"./types"
-		],
+		"rootDirs": ["..", "./types"],
 		"importsNotUsedAsValues": "error",
 		"isolatedModules": true,
 		"preserveValueImports": true,
-		"lib": [
-			"esnext",
-			"DOM",
-			"DOM.Iterable"
-		],
+		"lib": ["esnext", "DOM", "DOM.Iterable"],
 		"moduleResolution": "node",
 		"module": "esnext",
 		"target": "esnext"
@@ -27,8 +20,5 @@
 		"../src/**/*.ts",
 		"../src/**/*.svelte"
 	],
-	"exclude": [
-		"../node_modules/**",
-		"./[!ambient.d.ts]**"
-	]
-}
+	"exclude": ["../node_modules/**", "./[!ambient.d.ts]**"]
+}

apps/docs/package.json

@@ -1,26 +1,26 @@
 {
-  "name": "svelteui-docs",
-  "version": "0.13.0",
-  "private": true,
-  "scripts": {
-    "dev": "vite dev",
-    "build": "vite build",
-    "preview": "vite preview",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
-  },
-  "type": "module",
-  "dependencies": {
-    "radix-icons-svelte": "1.2.1"
-  },
-  "devDependencies": {
-    "@sveltejs/adapter-static": "2.0.2",
-    "@sveltejs/kit": "1.16.3",
-    "mdsvex": "0.10.6",
-    "svelte": "3.59.1",
-    "svelte-check": "3.3.2",
-    "tslib": "2.5.0",
-    "typescript": "5.0.4",
-    "vite": "4.3.5"
-  }
+	"name": "svelteui-docs",
+	"version": "0.13.0",
+	"private": true,
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build",
+		"preview": "vite preview",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
+	},
+	"type": "module",
+	"dependencies": {
+		"radix-icons-svelte": "1.2.1"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-static": "2.0.2",
+		"@sveltejs/kit": "1.16.3",
+		"mdsvex": "0.10.6",
+		"svelte": "3.59.1",
+		"svelte-check": "3.3.2",
+		"tslib": "2.5.0",
+		"typescript": "5.0.4",
+		"vite": "4.3.5"
+	}
 }

apps/docs/src/lib/components/BottomNav.svelte

@@ -3,10 +3,10 @@
 	import { Group, Divider, Stack } from '@svelteuidev/core';
 	import { useViewportSize } from '@svelteuidev/composables';
 
-  type DataType = {
-    prev: String,
-    next: String
-  }
+	type DataType = {
+		prev: string;
+		next: string;
+	};
 
 	export let slug: DataType,
 		title: DataType,

apps/docs/src/lib/components/Heading.svelte

@@ -1,11 +1,15 @@
 <script lang="ts">
-	// @ts-ignore
 	import { colorScheme, Stack, Box, Title, Text, Group, Center, Tooltip } from '@svelteuidev/core';
 	import { clipboard } from '@svelteuidev/composables';
 	import { GithubLogo, Pencil1, Cube } from 'radix-icons-svelte';
 	import { screenW } from '$lib/components';
 
-  export let title: String, description = false, docs = false, importCode = false, source = false, packageGroup = false
+	export let title: string,
+		description = false,
+		docs = false,
+		importCode = '',
+		source = false,
+		packageGroup = false;
 	const links = {
 		github: 'https://github.com/svelteuidev/svelteui/blob/main/packages/',
 		docs: 'https://github.com/svelteuidev/svelteui/blob/main/apps/docs/src/routes/',
@@ -31,9 +35,9 @@
 
 <Stack
 	override={{
-		backgroundColor: $colorScheme === 'light' ? "$blue100" : "$dark800",
+		backgroundColor: $colorScheme === 'light' ? '$blue100' : '$dark800',
 		padding: '$8',
-    	borderRadius: "0.5rem"
+		borderRadius: '0.5rem'
 	}}
 >
 	<Stack override={{ mb: 20, h1: { mb: 0, mt: 0 }, '@md': { mt: 0 } }} spacing="xs">
@@ -55,7 +59,7 @@
 				color={copied ? 'green' : 'gray'}
 			>
 				<Box css={importStyles}>
-					<code use:clipboard={importCode} on:useclipboard={onCopy}>
+					<code use:clipboard={importCode} on:copy={onCopy}>
 						{importCode}
 					</code>
 				</Box>
@@ -98,7 +102,7 @@
 </Stack>
 
 <style>
-  h1 {
-    font-size: 2em !important
-  }
+	h1 {
+		font-size: 2em !important;
+	}
 </style>

apps/docs/src/lib/components/MinorHeading.svelte

@@ -1,15 +1,15 @@
 <script lang="ts">
 	export let title = 'Title';
-	export let date: String;
+	export let date: string;
 	import { colorScheme, Stack, Text, Group, Center } from '@svelteuidev/core';
 	import { Calendar } from 'radix-icons-svelte';
 </script>
 
 <Stack
 	override={{
-		backgroundColor: $colorScheme === 'light' ? "$blue100" : "$dark800",
+		backgroundColor: $colorScheme === 'light' ? '$blue100' : '$dark800',
 		padding: '$8',
-    	borderRadius: "0.5rem"
+		borderRadius: '0.5rem'
 	}}
 >
 	<Stack override={{ h1: { mb: 0 } }} spacing="xs">

apps/docs/src/lib/components/PageTransition.svelte

@@ -1,7 +1,6 @@
-<script>
-  // @ts-nocheck
-	import { fly } from "svelte/transition";
-	export let refresh;
+<script lang="ts">
+	import { fly } from 'svelte/transition';
+	export let refresh: string;
 </script>
 
 {#key refresh}

apps/docs/src/lib/components/SearchItem.svelte

@@ -10,9 +10,9 @@
 	}
 
 	type SearchType = {
-		title: String;
-		link: String;
-		section?: String;
+		title: string;
+		link: string;
+		section?: string;
 	};
 	export let search: SearchType;
 </script>
@@ -24,7 +24,7 @@
 		goto(search.link.toString());
 	}}
 >
-	<Paper override={{ root: { bc: "red !important" }}}>
+	<Paper override={{ root: { bc: 'red !important' } }}>
 		<Group position="apart">
 			<div>
 				<p class="searchItemTitle">{search.title}</p>