feat: migrate dashboard to svelte 5 (#577)

* chore: migration to SvelteKit 2 * stage 1: migrate to svelte 5 and fix rerendering issues * stage 2: fix more $: reactivity across dashboard * fix merge conflicts * chore: migrate code in main to svelte 5 * chore: update preventDefault * chore: simplify tsconfig and remove unused mobileMenuRef in MobileMenu.svelte * chore: enforce .ts across dashboard * rename from classroomio-com to website * stage-3: Replace carbon icon svelte with lucide icon * update lock file * chore: finish icon replacement * fix: settings and setup page multiple rerender * stage 3: More icon and rerendering fixes * feat: checkpoint * feat: update editor * [not working] connect everything with ui build * storybook + ui + dashboard all working independently * add bg-black to +page.svelte * feat: add editor to storybook * chore: animate lucid icons (#590) * v1 animations * feat: change some course navigation icons & animate org navigation icons * chore: change settings icon * chore: use css instead of js for hover * rename animations --------- Co-authored-by: tunny17 <[email protected]> * chore: update path to node_modules types in api tsconfig * fix: update import path for DropdownMenu component * fix: add rollupOptions to build configuration in vite.config.ts * fix: remove rollupOptions from build configuration and add @floating-ui/dom dependency * install --------- Co-authored-by: tunny17 <[email protected]>
2025-11-01 16:18:29 +01:00
parent 0fb66a3782
commit f5a4156c8b
159 changed files with 15225 additions and 3722 deletions
@@ -0,0 +1,56 @@
+import { Node, mergeAttributes, type CommandProps, type NodeViewProps } from '@tiptap/core';
+import type { Component } from 'svelte';
+import { SvelteNodeViewRenderer } from 'svelte-tiptap';
+
+export interface IFramePlaceholderOptions {
+	HTMLAttributes: Record<string, object>;
+}
+
+declare module '@tiptap/core' {
+	interface Commands<ReturnType> {
+		iframePlaceholder: {
+			/**
+			 * Inserts a IFrame placeholder
+			 */
+			insertIFramePlaceholder: () => ReturnType;
+		};
+	}
+}
+
+export const IFramePlaceholder = (content: Component<NodeViewProps>) =>
+	Node.create<IFramePlaceholderOptions>({
+		name: 'iframe-placeholder',
+		addOptions() {
+			return {
+				HTMLAttributes: {},
+				onDrop: () => {},
+				onDropRejected: () => {},
+				onEmbed: () => {}
+			};
+		},
+		parseHTML() {
+			return [{ tag: `div[data-type="${this.name}"]` }];
+		},
+
+		renderHTML({ HTMLAttributes }) {
+			return ['div', mergeAttributes(HTMLAttributes)];
+		},
+		group: 'block',
+		draggable: true,
+		atom: true,
+		content: 'inline*',
+		isolating: true,
+
+		addNodeView() {
+			return SvelteNodeViewRenderer(content);
+		},
+		addCommands() {
+			return {
+				insertIFramePlaceholder: () => (props: CommandProps) => {
+					return props.commands.insertContent({
+						type: 'iframe-placeholder'
+					});
+				}
+			};
+		}
+	});