Revamp entire build process

.npmignore

@@ -0,0 +1,34 @@
+.DS_Store
+.env
+.env.*
+.eslintignore
+.eslintrc.cjs
+.github
+.gitignore
+.idea
+.npmrc
+.prettierignore
+.prettierrc
+.svelte-kit
+bin
+build
+coverage
+dist
+docs-src
+node_modules
+orbitale-svelte-admin-*.tgz
+package
+static
+svelte.config.js
+typedoc.json
+vite.config.js.timestamp-*
+vite.config.ts
+vite.config.ts.timestamp-*
+vite.lib.config.ts
+vite.webcomponents.config.ts
+yarn-error.log
+yarn.lock
+dist/app/
+src/testApp/*
+src/app.html
+src/app.d.ts

package.json

@@ -6,14 +6,14 @@
 	"author": "Alex \"Pierstoval\" Rock <[email protected]>",
 	"license": "LGPL-3.0-or-later",
 	"scripts": {
-		"dev": "vite dev",
-		"build": "vite build",
-		"build:library": "vite -c vite.lib.config.ts build",
-		"build:webcomponents": "vite -c ./vite.webcomponents.config.ts build",
+		"dev": "vite -c vite.config.ts dev",
+		"build": "yarn build:app && yarn build:lib && yarn build:themes && yarn build:webcomponents && yarn typedoc",
+		"build:app": "vite -c vite.config.ts build",
+		"build:lib": "vite -c vite.lib.config.ts build",
+		"build:themes": "vite -c vite.themes.config.ts build",
+		"build:webcomponents": "vite -c vite.webcomponents.config.ts build",
 		"create:field": "node bin/create_field.cjs",
-		"preview": "vite preview",
-		"package": "svelte-kit sync && svelte-package && publint",
-		"prepublishOnly": "yarn run package",
+		"preview": "vite -c vite.app.config.ts preview",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"lint": "prettier --plugin=prettier-plugin-svelte . --check . && eslint src",
@@ -22,20 +22,15 @@
 		"typedoc": "typedoc --options typedoc.json --readme none"
 	},
 	"exports": {
-		".": {
-			"types": "./dist/index.d.ts",
-			"svelte": "./dist/index.js"
-		},
-		"./dist/": "./dist/index.js",
-		"./themes/carbon": {
-			"types": "./dist/themes/carbon/index.d.ts",
-			"svelte": "./dist/themes/carbon/index.js"
-		}
+		".": "./build/lib/index.js",
+		"./themes": "./build/themes/index.js"
 	},
 	"files": [
-		"dist",
-		"!dist/**/*.test.*",
-		"!dist/**/*.spec.*"
+		"build/lib",
+		"build/themes",
+		"build/webcomponents",
+		"src/lib",
+		"src/themes"
 	],
 	"peerDependencies": {
 		"carbon-components-svelte": "^0.80.0",
@@ -48,24 +43,24 @@
 		"luxon": "^3.4.4",
 		"svelte": "^4.2.17",
 		"svelte-i18n": "^4.0.0",
-		"typedoc": "^0.25.13"
+		"typedoc": "^0.26.3"
 	},
 	"devDependencies": {
 		"@faker-js/faker": "^8.4.1",
 		"@sveltejs/adapter-auto": "^3.2.1",
 		"@sveltejs/adapter-static": "^3.0.0",
 		"@sveltejs/kit": "^2.5.10",
 		"@sveltejs/package": "^2.3.1",
-		"@sveltejs/vite-plugin-svelte": "^3.1.0",
+		"@sveltejs/vite-plugin-svelte": "^3.1.1",
 		"@testing-library/jest-dom": "^6.4.5",
 		"@testing-library/svelte": "^5.1.0",
 		"@types/node": "^20.12.12",
-		"@types/uuid": "^9.0.8",
+		"@types/uuid": "^10.0.0",
 		"@typescript-eslint/eslint-plugin": "^7.10.0",
 		"@typescript-eslint/parser": "^7.10.0",
 		"@vitest/coverage-v8": "^1.6.0",
 		"axios": "^1.7.2",
-		"eslint": "^8.57.0",
+		"eslint": "^9.6.0",
 		"eslint-config-prettier": "^9.1.0",
 		"eslint-plugin-svelte": "^2.39.0",
 		"intl-messageformat": "^10.5.14",
@@ -81,8 +76,7 @@
 		"vite": "^5.2.11",
 		"vitest": "^1.6.0"
 	},
-	"main": "./dist/index.js",
-	"svelte": "./dist/index.js",
-	"types": "./dist/index.d.ts",
+	"main": "./build/lib/index.js",
+	"types": "./build/lib/index.d.ts",
 	"type": "module"
 }

src/lib/Config.ts

@@ -1,5 +1,5 @@
 import type { ThemeConfig } from '$lib';
-import { carbon } from '$lib/themes';
+import { carbon } from '../themes';
 
 /** */
 export type AdminConfig = {

src/testApp/Dashboard.ts

@@ -5,7 +5,7 @@ import Menu from 'carbon-icons-svelte/lib/Menu.svelte';
 import Switcher from 'carbon-icons-svelte/lib/Switcher.svelte';
 
 import { DashboardDefinition, CallbackAction, UrlAction, Submenu } from '$lib';
-import { carbon } from '$lib/themes';
+import { carbon } from '../themes';
 
 import fr from './translations/fr';
 import { bookCrud } from './BookCrud';

src/lib/themes/carbon/Crud/CrudForm.svelte → src/themes/carbon/Crud/CrudForm.svelte

@@ -12,7 +12,7 @@
 	import type { CommonFieldOptions, FieldInterface } from '$lib/Fields';
 	import type { SubmitButtonType, ThemeConfig } from '$lib/types';
 	import { getSubmittedFormData, sanitizeFormData, type SubmittedData } from '$lib/Crud/Form';
-	import { carbon } from '$lib/themes';
+	import { carbon } from '$themes';
 
 	export let submitButtonType: SubmitButtonType = 'primary';
 	export let method: 'get' | 'post' = 'post';

src/lib/themes/carbon/Crud/CrudViewField.svelte → src/themes/carbon/Crud/CrudViewField.svelte

@@ -7,7 +7,7 @@
 	import type { CrudOperation } from '$lib/Crud/Operations';
 	import type { ThemeConfig } from '$lib/types';
 
-	import DefaultField from '$lib/themes/carbon/ViewFieldsComponents/DefaultField.svelte';
+	import DefaultField from '$themes/carbon/ViewFieldsComponents/DefaultField.svelte';
 
 	export let operation: CrudOperation;
 	export let field: FieldInterface<CommonFieldOptions>;

src/lib/themes/carbon/Dashboard/Dashboard.svelte → src/themes/carbon/Dashboard/Dashboard.svelte

@@ -14,7 +14,7 @@
 
 	import InlineNotification from 'carbon-components-svelte/src/Notification/InlineNotification.svelte';
 
-	import AdminLayout from '$lib/themes/carbon/Layout/AdminLayout.svelte';
+	import AdminLayout from '$themes/carbon/Layout/AdminLayout.svelte';
 	import type { DashboardDefinition } from '$lib/Dashboard';
 	import type { CrudOperation } from '$lib/Crud/Operations';
 	import type { CrudDefinition } from '$lib/Crud';

src/lib/themes/carbon/DataTable/DataTable.svelte → src/themes/carbon/DataTable/DataTable.svelte

@@ -6,8 +6,8 @@
 	import InlineNotification from 'carbon-components-svelte/src/Notification/InlineNotification.svelte';
 	import Loading from 'carbon-components-svelte/src/Loading/Loading.svelte';
 
-	import DataTableToolbar from '$lib/themes/carbon/DataTable/Toolbar/DataTableToolbar.svelte';
-	import ItemActions from '$lib/themes/carbon/DataTable/actions/ItemActions.svelte';
+	import DataTableToolbar from '$themes/carbon/DataTable/Toolbar/DataTableToolbar.svelte';
+	import ItemActions from '$themes/carbon/DataTable/actions/ItemActions.svelte';
 	import type { Headers, Row, Rows } from '$lib/DataTable';
 	import type { Action } from '$lib/Actions';
 	import type { FilterInterface, FilterOptions } from '$lib/Filter';

src/lib/themes/carbon/DataTable/Toolbar/DataTableToolbar.svelte → src/themes/carbon/DataTable/Toolbar/DataTableToolbar.svelte

@@ -11,8 +11,8 @@
 	import FilterReset from 'carbon-icons-svelte/lib/FilterReset.svelte';
 
 	import type { Action } from '$lib/Actions';
-	import ActionComponent from '$lib/themes/carbon/DataTable/Toolbar/ToolbarAction.svelte';
-	import FilterComponent from '$lib/themes/carbon/DataTable/Toolbar/ToolbarFilter.svelte';
+	import ActionComponent from '$themes/carbon/DataTable/Toolbar/ToolbarAction.svelte';
+	import FilterComponent from '$themes/carbon/DataTable/Toolbar/ToolbarFilter.svelte';
 	import type { Filter, FilterOptions } from '$lib/Filter';
 	import type { ThemeConfig } from '$lib/types';
 	import { getSubmittedFormData } from '$lib/Crud/Form';

src/lib/themes/carbon/DataTable/actions/ItemActions.svelte → src/themes/carbon/DataTable/actions/ItemActions.svelte

@@ -3,7 +3,7 @@
 	import Row from 'carbon-components-svelte/src/Grid/Row.svelte';
 	import Column from 'carbon-components-svelte/src/Grid/Column.svelte';
 
-	import SingleAction from '$lib/themes/carbon/DataTable/actions/SingleAction.svelte';
+	import SingleAction from '$themes/carbon/DataTable/actions/SingleAction.svelte';
 	import type { Action } from '$lib/Actions';
 
 	export let actions: Action[] = [];

src/lib/themes/carbon/FilterComponents/BooleanFilter.svelte → src/themes/carbon/FilterComponents/BooleanFilter.svelte

@@ -5,7 +5,7 @@
 	import Close from 'carbon-icons-svelte/lib/Close.svelte';
 	import CheckboxIndeterminate from 'carbon-icons-svelte/lib/CheckboxIndeterminate.svelte';
 	import type { TextFilter } from '$lib/Filter';
-	import FilterContainer from '$lib/themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
+	import FilterContainer from '$themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
 
 	export let filter: TextFilter;
 	let value: boolean | null = null;

src/lib/themes/carbon/FilterComponents/DateFilter.svelte → src/themes/carbon/FilterComponents/DateFilter.svelte

@@ -4,7 +4,7 @@
 	import DatePicker from 'carbon-components-svelte/src/DatePicker/DatePicker.svelte';
 
 	import type { DateFilter } from '$lib/Filter';
-	import FilterContainer from '$lib/themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
+	import FilterContainer from '$themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
 
 	export let filter: DateFilter;
 

src/lib/themes/carbon/FilterComponents/NumericFilter.svelte → src/themes/carbon/FilterComponents/NumericFilter.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import TextInput from 'carbon-components-svelte/src/TextInput/TextInput.svelte';
 	import type { NumericFilter } from '$lib/Filter';
-	import FilterContainer from '$lib/themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
+	import FilterContainer from '$themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
 
 	export let filter: NumericFilter;
 	export let value: string;

src/lib/themes/carbon/FilterComponents/TextFilter.svelte → src/themes/carbon/FilterComponents/TextFilter.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import TextInput from 'carbon-components-svelte/src/TextInput/TextInput.svelte';
 	import type { TextFilter } from '$lib/Filter';
-	import FilterContainer from '$lib/themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
+	import FilterContainer from '$themes/carbon/FilterComponents/Internal/FilterContainer.svelte';
 
 	export let filter: TextFilter;
 	export let value: string;

src/lib/themes/carbon/FormFieldsComponents/ArrayField.svelte → src/themes/carbon/FormFieldsComponents/ArrayField.svelte

@@ -4,7 +4,7 @@
 	import Row from 'carbon-components-svelte/src/Grid/Row.svelte';
 	import { _ } from 'svelte-i18n';
 
-	import CrudFormField from '$lib/themes/carbon/Crud/CrudFormField.svelte';
+	import CrudFormField from '$themes/carbon/Crud/CrudFormField.svelte';
 	import { ArrayField } from '$lib/Fields/Array';
 	import type { CrudOperation } from '$lib/Crud/Operations';
 	import type { FieldInterface } from '$lib/Fields';

src/lib/themes/carbon/Menu/TopMenu.svelte → src/themes/carbon/Menu/TopMenu.svelte

@@ -2,8 +2,8 @@
 	import Header from 'carbon-components-svelte/src/UIShell/Header.svelte';
 	import SkipToContent from 'carbon-components-svelte/src/UIShell/SkipToContent.svelte';
 
-	import TopLeftMenu from '$lib/themes/carbon/Menu/TopLeftMenu.svelte';
-	import TopRightMenu from '$lib/themes/carbon/Menu/TopRightMenu.svelte';
+	import TopLeftMenu from '$themes/carbon/Menu/TopLeftMenu.svelte';
+	import TopRightMenu from '$themes/carbon/Menu/TopRightMenu.svelte';
 	import type { MenuLink } from '$lib/Menu';
 	import { type AdminConfig, defaultAdminConfig } from '$lib/Config';
 	import type { Writable } from 'svelte/store';

src/lib/themes/carbon/ViewFieldsComponents/ArrayField.svelte → src/themes/carbon/ViewFieldsComponents/ArrayField.svelte

@@ -4,7 +4,7 @@
 	import type { FieldInterface } from '$lib/Fields';
 	import type { FieldOptions } from '$lib/Fields';
 	import type { ThemeConfig } from '$lib/types';
-	import CrudViewField from '$lib/themes/carbon/Crud/CrudViewField.svelte';
+	import CrudViewField from '$themes/carbon/Crud/CrudViewField.svelte';
 
 	export let field: ArrayField<FieldInterface<FieldOptions>>;
 	export let value: Array<unknown> | undefined;

src/lib/themes/carbon/ViewFieldsComponents/DateField.test.ts → src/themes/carbon/ViewFieldsComponents/DateField.test.ts

@@ -14,7 +14,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual('<!--<DateField>-->');
+            expect(element.innerHTML).toStrictEqual('');
         });
 
         it('can be instantiated with Date object', async () => {
@@ -25,7 +25,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual(`2024-01-01<!--<DateField>-->`);
+            expect(element.innerHTML).toStrictEqual(`2024-01-01`);
         });
 
         it('can be instantiated with string value', async () => {
@@ -36,7 +36,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual('2024-05-26<!--<DateField>-->');
+            expect(element.innerHTML).toStrictEqual('2024-05-26');
         });
     },
     testOptions,

src/lib/themes/carbon/ViewFieldsComponents/DefaultField.test.ts → src/themes/carbon/ViewFieldsComponents/DefaultField.test.ts

@@ -14,7 +14,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual('<!--<DefaultField>-->');
+            expect(element.innerHTML).toStrictEqual('');
         });
 
         it('can be instantiated empty string', async () => {
@@ -24,7 +24,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual('<!--<DefaultField>-->');
+            expect(element.innerHTML).toStrictEqual('');
         });
 
         it('can be instantiated specific value', async () => {
@@ -34,7 +34,7 @@ describe(
 
             const element = rendered.container;
             expect(element).toBeDefined();
-            expect(element.innerHTML).toStrictEqual('Some value<!--<DefaultField>-->');
+            expect(element.innerHTML).toStrictEqual('Some value');
         });
     },
     testOptions,

svelte.config.js

@@ -12,13 +12,9 @@ const config = {
 		// If your environment is not supported or you settled on a specific environment, switch out the adapter.
 		// See https://kit.svelte.dev/docs/adapters for more information about adapters.
 		adapter: adapter({
+			pages: 'build/app/',
 			fallback: 'index.html'
 		})
-	},
-
-	customElement: true,
-	compilerOptions: {
-		customElement: true
 	}
 };
 

typedoc.json

@@ -1,6 +1,6 @@
 {
-	"entryPoints": ["src/lib/*.ts", "src/lib/**/*.ts"],
-	"out": "build/apidocs",
+	"entryPoints": ["src/lib/*.ts", "src/lib/**/*.ts", "src/themes/*.ts", "src/themes/**/*.ts"],
+	"out": "build/app/apidocs",
 	"exclude": ["**/*+(index|.spec|.e2e).ts"],
 	"disableGit": true,
 	"disableSources": true,

vite.config.ts

@@ -2,9 +2,19 @@ import { sveltekit } from '@sveltejs/kit/vite';
 import { defineConfig } from 'vite';
 import { configDefaults } from 'vitest/config';
 import { svelteTesting } from '@testing-library/svelte/vite'
+import {resolve} from "path";
 
 export default defineConfig({
-	plugins: [sveltekit(), svelteTesting()],
+	plugins: [
+		sveltekit(),
+		svelteTesting()
+	],
+	resolve: {
+		alias: {
+			'$lib': resolve(__dirname, 'src/lib'),
+			'$themes': resolve(__dirname, 'src/themes'),
+		}
+	},
 	test: {
 		include: ['src/**/*.{test,spec}.ts'],
 		exclude: [...configDefaults.exclude, '**/build/**', '**/.svelte-kit/**', '**/dist/**'],