feat: added global components

.vscode/settings.json

@@ -15,5 +15,8 @@
 	"workbench.colorTheme": "Material Theme High Contrast",
 	"workbench.colorCustomizations": {
 		"[Material Theme Palenight High Contrast]": {}
+	},
+	"svelte.plugin.svelte.compilerWarnings": {
+		"missing-declaration": "ignore"
 	}
 }

package.json

@@ -7,8 +7,8 @@
 		"build": "vite build",
 		"preview": "vite preview",
 		"test": "npm run test:integration && npm run test:unit",
-		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --compiler-warnings 'missing-declaration:ignore'",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch --compiler-warnings 'missing-declaration:ignore'",
 		"lint": "prettier --check . && eslint .",
 		"format": "prettier --write .",
 		"test:integration": "playwright test",

src/_modules/components/index.ts

@@ -1,7 +1,10 @@
-import Document from './Document.svelte';
+import _ from 'lodash';
+
+import Doc from './Document.svelte';
 import DocumentContent from './DocumentContent.svelte';
 import Collection from './Collection.svelte';
 import Relation from './Relation.svelte';
 import LogBanner from './LogBanner.svelte';
 
-export { Document, DocumentContent, Collection, Relation, LogBanner };
+_.assign(globalThis, { Doc });
+export { Doc, DocumentContent, Collection, Relation, LogBanner };

src/app.d.ts

@@ -1,3 +1,5 @@
+import { Doc as DocComponent } from '$modules/components';
+
 // See https://kit.svelte.dev/docs/types#app
 // for information about these interfaces
 declare global {
@@ -8,6 +10,8 @@ declare global {
 		// interface PageState {}
 		// interface Platform {}
 	}
+
+	const Doc: typeof DocComponent;
 }
 
 export {};

src/routes/(database)/organizations/dyne/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts" context="module">
 	import { db } from '$modules';
-	import { Document } from '$modules/components';
 	import logo from './logo.jpeg';
 
 	export const props = db.create('organizations', {
@@ -13,7 +12,7 @@
 <p>Mo bellissima dyne</p>
 <img src="./logo.jpeg" alt="dyne logo" />
 
-<Document collection="organizations" name="freelance" let:doc>
+<Doc collection="organizations" name="freelance" let:doc>
 	<pre>{JSON.stringify(doc, null, 2)}</pre>
-</Document>
+</Doc>
 <img src={logo} alt="dyne logo" />

src/routes/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { Collection, Document, Relation } from '$modules/components';
+	import { Collection, Relation } from '$modules/components';
 	import DocumentContent from '$modules/components/DocumentContent.svelte';
 	import { db } from '$modules/index';
 	import { href } from '$modules/utils';
@@ -17,10 +17,10 @@
 	<div>
 		<a href={href('/cv')} class="button">CV</a>
 
-		<Document collection="organizations" name="dyne" let:doc>
+		<Doc collection="organizations" name="dyne" let:doc>
 			<pre>{JSON.stringify(doc)}</pre>
 			<img alt="ciao" src={doc.props?.logo} />
-		</Document>
+		</Doc>
 
 		<hr />
 

src/routes/cv/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
 	import Collection from '$modules/components/Collection.svelte';
-	import Document from '$modules/components/Document.svelte';
 	import Relation from '$modules/components/Relation.svelte';
 	import { href } from '$modules/utils';
 	import { formatDate } from 'date-fns/format';
@@ -15,13 +14,13 @@
 			{#if document.props?.current}
 				<div class="rounded-xl border border-stone-300 p-4">
 					<p>{document.props.roles.join(', ')}</p>
-					<Document
+					<Doc
 						collection={document.props.employer.collection}
 						name={document.props.employer.document}
 						let:doc
 					>
 						<p>{doc.props?.name}</p>
-					</Document>
+					</Doc>
 					<p>
 						<span>
 							{formatDate(document.props.date_start, 'MM / yyyy')}
@@ -30,7 +29,7 @@
 						<span> oggi </span>
 					</p>
 				</div>
-				<!-- <pre>{JSON.stringify(document, null, 2)}</pre> -->
+				<Doc collection="education" name="triennio-isia-urbino"></Doc>
 			{/if}
 		{/each}
 
@@ -39,13 +38,9 @@
 			{#if document.props?.date_end}
 				<div class="rounded-xl border border-stone-300 p-4">
 					<p>{document.props.roles.join(', ')}</p>
-					<Document
-						collection={document.props.employer.collection}
-						name={document.props.employer.document}
-						let:doc
-					>
+					<Doc collection="organizations" name={document.props.employer.document} let:doc>
 						<p>{doc.props?.name}</p>
-					</Document>
+					</Doc>
 					<p>
 						<span>
 							{formatDate(document.props.date_start, 'MM / yyyy')}