@kbve/droid 0.0.1 → 0.0.3

package/src/lib/mod/module/bento/mod-bento.worker.ts

@@ -0,0 +1,128 @@
+import { expose } from 'comlink';
+import type { BaseModAPI, VirtualNode } from '../../../types/modules';
+import {
+	BentoTileSchema,
+	type BentoTile,
+	BENTO_BADGE_CLASS_MAP,
+	BENTO_ANIMATION_CLASS_MAP,
+	BENTO_VARIANT_CLASS_MAP,
+} from '../../../types/bento';
+
+let emitToMain: ((msg: any) => void) | undefined;
+
+function createVNodeFromTile(tile: BentoTile): VirtualNode {
+	const variant = tile.variant ?? 'default';
+	const animationClass = tile.animation
+		? BENTO_ANIMATION_CLASS_MAP[tile.animation]
+		: '';
+	const variantBase = BENTO_VARIANT_CLASS_MAP[variant]?.base ?? '';
+	const variantHover = BENTO_VARIANT_CLASS_MAP[variant]?.hover ?? '';
+
+	const rootClasses = [
+		'bento-item',
+		'col-span-1',
+		'row-span-1',
+		tile.span ?? 'md:col-span-2 md:row-span-1',
+		'bg-gradient-to-br',
+		tile.primaryColor ? `from-${tile.primaryColor}` : '',
+		tile.secondaryColor ? `to-${tile.secondaryColor}` : '',
+		'rounded-2xl overflow-hidden shadow-2xl',
+		variantBase,
+		variantHover ? `hover:${variantHover}` : '',
+		animationClass,
+		tile.className ?? '',
+	]
+		.filter(Boolean)
+		.join(' ');
+
+	const datasetAttrs = tile.dataset
+		? Object.fromEntries(
+				Object.entries(tile.dataset).map(([k, v]) => [`data-${k}`, v]),
+			)
+		: {};
+
+	const wrapper: VirtualNode = {
+		tag: tile.href ? 'a' : 'div',
+		class: rootClasses,
+		attrs: {
+			...(tile.href
+				? { href: tile.href, target: tile.target ?? '_self' }
+				: {}),
+			...(tile.onclick ? { onclick: tile.onclick } : {}),
+			...(tile.ariaLabel ? { 'aria-label': tile.ariaLabel } : {}),
+			...(tile.role ? { role: tile.role } : {}),
+			...datasetAttrs,
+		},
+		children: [
+			tile.badge && {
+				tag: 'span',
+				class: `absolute top-2 right-2 px-2 py-1 text-xs rounded z-10 ${BENTO_BADGE_CLASS_MAP[tile.badgeType ?? 'default']}`,
+				children: [tile.badge],
+			},
+			{
+				tag: 'div',
+				class: 'p-4 flex flex-col justify-between h-full',
+				children: [
+					{
+						tag: 'div',
+						class: 'flex items-center gap-3',
+						children: [
+							tile.icon && {
+								tag: 'div',
+								class: 'text-2xl bg-white/20 rounded-full p-2 text-white',
+								children: [tile.icon],
+							},
+							{
+								tag: 'h3',
+								class: 'text-white text-lg font-bold',
+								children: [tile.title],
+							},
+						].filter(Boolean) as VirtualNode[],
+					},
+					tile.subtitle && {
+						tag: 'p',
+						class: 'text-sm text-white/80 mt-2',
+						children: [tile.subtitle],
+					},
+					tile.description && {
+						tag: 'p',
+						class: 'text-xs text-white/60 mt-1',
+						children: [tile.description],
+					},
+				].filter(Boolean) as VirtualNode[],
+			},
+		].filter(Boolean) as VirtualNode[],
+	};
+
+	return wrapper;
+}
+
+const api: BaseModAPI = {
+	async getMeta() {
+		return {
+			name: 'bento',
+			version: '0.1.0',
+		};
+	},
+
+	async init(context) {
+		emitToMain = context?.emitFromWorker;
+	},
+
+	async run(data: unknown) {
+		if (!emitToMain) {
+			console.warn('[mod-bento] emitFromWorker not defined');
+			return;
+		}
+
+		try {
+			const tile = BentoTileSchema.parse(data);
+			const vnode = createVNodeFromTile(tile);
+			emitToMain({ type: 'injectVNode', vnode });
+		} catch (err) {
+			console.error('[mod-bento] Invalid BentoTile data:', err);
+		}
+	},
+};
+
+expose(api);

package/src/lib/mod/module/supabase/mod-supabase.spec.ts

@@ -0,0 +1,30 @@
+import { describe, it, expect, beforeAll } from 'vitest';
+import { droid } from '../../../droid';
+import type { Remote } from 'comlink';
+import type { ModHandle, SupabaseModAPI  } from '../../../types/modules';
+
+console.log('[spec] Starting mod-supabase test file...');
+
+
+let mod: Remote<SupabaseModAPI>;
+let meta: { name: string; version: string };
+describe('mod-supabase', () => {
+	it('should have meta info', async () => {
+		await droid();
+		if (!window.kbve?.mod) {
+			throw new Error('Mod manager not available');
+		}
+
+		console.log('[test] Loading Supabase mod...');
+		const modURL = new URL('./mod-supabase.worker.ts', import.meta.url);
+        console.log('Resolved worker URL:', modURL.href);
+
+		const handle = await window.kbve.mod.load(modURL.href);
+		const mod: Remote<SupabaseModAPI> = handle.instance;
+		const meta = handle.meta;
+
+		console.log('[test] Supabase mod loaded:', meta);
+		expect(meta.name).toBe('supabase');
+		expect(meta.version).toBeDefined();
+	}, 30_000);
+});

package/src/lib/mod/module/supabase/mod-supabase.worker.ts

@@ -0,0 +1,59 @@
+import { expose } from 'comlink';
+import type { SupabaseClient } from '@supabase/supabase-js';
+
+let supabase: SupabaseClient | null = null;
+let initialized = false;
+
+const state = {
+	ctx: null as any,
+	url: '',
+	key: '',
+};
+
+const mod = {
+	getMeta: () => ({
+		name: 'supabase',
+		version: '1.0.0',
+		description: 'Supabase mod for async DB access',
+		author: 'kbve',
+	}),
+
+	init(ctx: any) {
+		state.ctx = ctx;
+	},
+
+	async loadSupabaseClient() {
+		try {
+			const supabaseModule = await import('https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm');
+			console.log('[mod-supabase] Supabase module loaded');
+			return supabaseModule.createClient;
+		} catch (err) {
+			console.error('[mod-supabase] Failed to load Supabase:', err);
+			throw err;
+		}
+	},
+
+	async configure(url: string, key: string) {
+		if (!initialized) {
+			const createClient = await this.loadSupabaseClient();
+			supabase = createClient(url, key);
+			state.url = url;
+			state.key = key;
+			initialized = true;
+		}
+	},
+
+	async queryTestTable() {
+		if (!supabase) throw new Error('Supabase not configured. Call `configure()` first.');
+		const { data, error } = await supabase.from('test').select('*');
+		return { data, error };
+	},
+
+	async insertTest(payload: Record<string, any>) {
+		if (!supabase) throw new Error('Supabase not configured. Call `configure()` first.');
+		const { data, error } = await supabase.from('test').insert(payload).select();
+		return { data, error };
+	}
+};
+
+expose(mod);

package/src/lib/types/bento.ts

@@ -0,0 +1,80 @@
+import { z } from 'zod';
+
+// Enums
+export const BENTO_VARIANTS = ['default', 'minimal', 'image-heavy'] as const;
+export const BENTO_ANIMATIONS = ['fade-in', 'slide-up', 'none'] as const;
+export const BENTO_TARGETS = ['_self', '_blank', '_parent', '_top'] as const;
+export const BENTO_ROLES = ['button', 'link', 'region', 'article'] as const;
+export const BENTO_BADGE_TYPES = ['default', 'success', 'warning', 'error'] as const;
+
+// Regex validators
+const tailwindColorRegex = /^[a-z]+-(100|200|300|400|500|600|700|800|900)$/;
+const spanRegex = /^(?:(?:[a-z]+:)?(col|row)-span-\d+\s*)+$/;
+const ulidRegex = /^01[0-9A-HJKMNP-TV-Z]{24}$/;
+
+// Schema
+export const BentoTileSchema = z.object({
+  id: z.string().regex(ulidRegex, 'Invalid ULID format').optional(),
+
+  title: z.string().min(1, 'Title is required'),
+  subtitle: z.string().optional(),
+  description: z.string().optional(),
+  span: z.string().regex(spanRegex, 'Invalid span format (e.g., col-span-2, row-span-1)').optional(),
+
+  primaryColor: z.string().regex(tailwindColorRegex, 'Invalid Tailwind color format (e.g., blue-500)'),
+  secondaryColor: z.string().regex(tailwindColorRegex, 'Invalid Tailwind color format (e.g., blue-500)'),
+
+  icon: z.string().optional(),
+  backgroundImage: z.string().url().optional(),
+
+  onclick: z.string().optional(),
+  href: z.string().url().optional(),
+  target: z.enum(BENTO_TARGETS).optional(),
+
+  ariaLabel: z.string().optional(),
+  role: z.enum(BENTO_ROLES).optional(),
+
+  variant: z.enum(BENTO_VARIANTS).optional(),
+  animation: z.enum(BENTO_ANIMATIONS).optional(),
+
+  badge: z.string().optional(),
+  badgeType: z.enum(BENTO_BADGE_TYPES).optional(),
+
+  priority: z.number().int().min(0).optional(),
+  tooltip: z.string().optional(),
+  disabled: z.boolean().optional(),
+
+  meta: z.record(z.any()).optional(),
+  dataset: z.record(z.string()).optional(),
+  className: z.string().optional(),
+}).refine(
+  (data) => !data.href || (data.href && data.target),
+  { message: 'target is required when href is provided', path: ['target'] }
+).refine(
+  (data) => !data.badgeType || (data.badge && data.badge.length > 0),
+  { message: 'badge must be provided if badgeType is set', path: ['badge'] }
+);
+
+// Types
+export type BentoTile = z.infer<typeof BentoTileSchema>;
+export type BentoVariantClass = { base: string; hover?: string };
+
+// Mappings
+export const BENTO_VARIANT_CLASS_MAP: Record<(typeof BENTO_VARIANTS)[number], BentoVariantClass> = {
+  default: { base: 'p-4 flex flex-col justify-between' },
+  minimal: { base: 'p-2 bg-opacity-30 backdrop-blur-sm', hover: 'bg-opacity-50' },
+  'image-heavy': { base: 'p-0 overflow-hidden', hover: 'scale-105' },
+};
+
+export const BENTO_ANIMATION_CLASS_MAP: Record<(typeof BENTO_ANIMATIONS)[number], string> = {
+  'fade-in': 'animate-fade-in',
+  'slide-up': 'animate-slide-up',
+  none: '',
+};
+
+export const BENTO_BADGE_CLASS_MAP: Record<(typeof BENTO_BADGE_TYPES)[number], string> = {
+  default: 'bg-white/30 text-white',
+  success: 'bg-green-500/80 text-white',
+  warning: 'bg-yellow-500/80 text-black',
+  error: 'bg-red-500/80 text-white',
+};

package/src/lib/types/discord.ts

@@ -0,0 +1,40 @@
+import { z } from 'zod';
+
+export const DiscordServerSchema = z.object({
+	server_id: z.string(),
+	owner_id: z.string(),
+	lang: z.number(),
+	status: z.number(),
+	invite: z.string(),
+	name: z.string(),
+	summary: z.string(),
+	description: z.string().nullable().optional(),
+	website: z.string().nullable().optional(),
+	logo: z.string().nullable().optional(),
+	banner: z.string().nullable().optional(),
+	video: z.string().nullable().optional(),
+	categories: z.number(),
+	updated_at: z.string(),
+});
+
+export type DiscordServer = z.infer<typeof DiscordServerSchema>;
+
+export const DiscordTagSchema = z.object({
+	tag_id: z.string(),
+	name: z.string(),
+	status: z.number(),
+});
+
+export type DiscordTag = z.infer<typeof DiscordTagSchema>;
+
+export const ProfileSchema = z.object({
+	profile_id: z.string(),
+	user_id: z.string(),
+	username: z.string(),
+	avatar: z.string().url().optional(),
+	bio: z.string().optional(),
+	joined_at: z.string(),
+	status: z.number(),
+});
+
+export type Profile = z.infer<typeof ProfileSchema>;

package/src/lib/types/event-types.ts

@@ -0,0 +1,35 @@
+import { z } from 'zod';
+import { PanelIdSchema } from './panel-types';
+
+export const ModMetaSchema = z.object({
+	name: z.string(),
+	version: z.string().optional(),
+});
+
+export const DroidModReadySchema = z.object({
+	meta: ModMetaSchema.optional(),
+	timestamp: z.number(),
+});
+
+export const PanelEventSchema = z.object({
+	id: PanelIdSchema,
+	payload: z.any().optional(),
+});
+
+export const DroidReadySchema = z.object({
+	timestamp: z.number(),
+});
+
+export const DroidEventSchemas = {
+	'droid-ready': DroidReadySchema, 
+	'droid-mod-ready': DroidModReadySchema,
+	'panel-open': PanelEventSchema,
+	'panel-close': PanelEventSchema,
+};
+
+export type DroidEventMap = {
+	[K in keyof typeof DroidEventSchemas]: z.infer<(typeof DroidEventSchemas)[K]>;
+};
+
+export type EventKey = keyof DroidEventMap;
+export type EventHandler<K extends EventKey> = (payload: DroidEventMap[K]) => void;

package/src/lib/types/jedi.ts

@@ -0,0 +1,66 @@
+
+export type FieldMap = Record<string, string>;
+export type StreamRequest = { stream: string; id: string };
+
+export enum PayloadFormat {
+    PAYLOAD_UNKNOWN = 0,
+    JSON = 1,
+    FLEX = 2,
+    PROTOBUF = 3,
+    FLATBUFFER = 4,
+}
+
+export interface JediEnvelopeFlex {
+    version: number;
+    kind: number;
+    format: number;
+    payload: Uint8Array;
+    metadata?: Uint8Array;
+}
+
+export enum MessageKind {
+    // Verbs (Bits 0–7)
+    UNKNOWN         = 0,
+    ADD             = 1 << 0,
+    READ            = 1 << 1,
+    GET             = 1 << 2,
+    SET             = 1 << 3,
+    DEL             = 1 << 4,
+    STREAM          = 1 << 5,
+    GROUP           = 1 << 6,
+    LIST            = 1 << 7,
+
+    // Intent (Bits 8–15)
+    ACTION          = 1 << 8,
+    MESSAGE         = 1 << 9,
+    INFO            = 1 << 10,
+    DEBUG           = 1 << 11,
+    ERROR           = 1 << 12,
+    AUTH            = 1 << 13,
+    HEARTBEAT       = 1 << 14,
+
+    // Targets (Bits 16–23)
+    CONFIG_UPDATE   = 1 << 15,
+    REDIS           = 1 << 16,
+    SUPABASE        = 1 << 17,
+    FILESYSTEM      = 1 << 18,
+    WEBSOCKET       = 1 << 19,
+    HTTP_API        = 1 << 20,
+    LOCAL_CACHE     = 1 << 21,
+    AI              = 1 << 22,
+}
+
+export const MultiMessageKind = {
+    RGET:     MessageKind.REDIS | MessageKind.GET,
+    RSET:     MessageKind.REDIS | MessageKind.SET,
+    RDEL:     MessageKind.REDIS | MessageKind.DEL,
+    XADD:     MessageKind.REDIS | MessageKind.STREAM | MessageKind.ADD,
+    XREAD:    MessageKind.REDIS | MessageKind.STREAM | MessageKind.READ,
+    WATCH:    MessageKind.REDIS | MessageKind.HEARTBEAT | MessageKind.READ | MessageKind.INFO,
+    UNWATCH:  MessageKind.REDIS | MessageKind.HEARTBEAT | MessageKind.DEL | MessageKind.INFO,
+    PUBLISH:  MessageKind.REDIS | MessageKind.MESSAGE | MessageKind.ACTION,
+    SUBSCRIBE: MessageKind.REDIS | MessageKind.MESSAGE | MessageKind.READ,
+} as const;
+
+export type MultiMessageKindKey = keyof typeof MultiMessageKind;
+

package/src/lib/types/modules.ts

@@ -0,0 +1,46 @@
+import type { Remote } from 'comlink';
+
+export interface BaseModAPI {
+	getMeta(): Promise<ModMeta>;
+	init?(ctx: any): void | Promise<void>;
+	[key: string]: any;
+}
+
+export interface ModMeta {
+	name: string;
+	version: string;
+	description?: string;
+	author?: string;
+}
+
+export interface ModHandle {
+	id: string;
+	worker: Worker;
+	instance: Remote<BaseModAPI>;
+	meta: ModMeta;
+	url: string;
+}
+
+export interface ModManager {
+	registry: Record<string, ModHandle>;
+	load: (url: string) => Promise<ModHandle>;
+	unload: (id: string) => void;
+	list: () => ModMeta[];
+	reload: (id: string) => Promise<ModHandle>;
+}
+
+export interface SupabaseModAPI extends BaseModAPI {
+	configure(url: string, key: string): Promise<void>;
+	queryTestTable(): Promise<{ data: any; error: any }>;
+	insertTest(payload: Record<string, any>): Promise<{ data: any; error: any }>;
+}
+
+export type VirtualNode = {
+	tag: string;
+	id?: string;
+	key?: string;
+	class?: string;
+	attrs?: Record<string, any>;
+	style?: Partial<CSSStyleDeclaration>;
+	children?: (string | VirtualNode)[];
+};

package/src/lib/types/panel-types.ts

@@ -0,0 +1,18 @@
+import { z } from 'zod';
+
+export const PanelIdSchema = z.enum(['top', 'right', 'bottom', 'left']);
+export type PanelId = z.infer<typeof PanelIdSchema>;
+
+export const CanvasOptionsSchema = z.object({
+	width: z.number(),
+	height: z.number(),
+	mode: z.enum(['static', 'animated', 'dynamic']).optional(),
+});
+
+export const PanelPayloadSchema = z.object({
+	rawHtml: z.string().optional(),
+	needsCanvas: z.boolean().optional(),
+	canvasOptions: CanvasOptionsSchema.optional(),
+});
+
+export type PanelPayload = z.infer<typeof PanelPayloadSchema>;

package/src/lib/types/supabase-esm.d.ts

@@ -0,0 +1,4 @@
+declare module 'https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm' {
+	import * as supabase from '@supabase/supabase-js';
+	export = supabase;
+}

package/src/lib/workers/canvas-worker.ts

@@ -0,0 +1,107 @@
+import { expose } from 'comlink';
+
+export interface CanvasWorkerAPI {
+	bindCanvas(panelId: string, canvas: OffscreenCanvas, mode?: CanvasDrawMode): Promise<void>;
+	unbindCanvas(panelId: string): Promise<void>;
+}
+
+interface CanvasBinding {
+	ctx: OffscreenCanvasRenderingContext2D;
+	canvas: OffscreenCanvas;
+	panelId: string;
+	mode?: CanvasDrawMode;
+	animationFrame?: number;
+}
+
+export type CanvasDrawMode = 'static' | 'animated' | 'dynamic';
+
+const CanvasManager = {
+	bindings: new Map<string, CanvasBinding>(),
+
+	async bindCanvas(panelId: string, canvas: OffscreenCanvas, mode: CanvasDrawMode = 'animated') {
+		const ctx = canvas.getContext('2d');
+
+		if (!ctx) {
+			console.error(`[CanvasWorker] Failed to get 2D context for panel ${panelId}`);
+			return;
+		}
+
+		console.log(`[CanvasWorker] Successfully bound canvas for panel ${panelId} with mode ${mode}`);
+
+		this.bindings.set(panelId, { ctx, canvas, panelId, mode });
+
+		this.startAnimation(panelId);
+	},
+
+	startAnimation(panelId: string) {
+		const binding = this.bindings.get(panelId);
+		if (!binding) return;
+
+		switch (binding.mode) {
+			case 'static':
+				this.drawStatic(binding);
+				break;
+			case 'animated':
+				this.drawAnimated(binding);
+				break;
+			case 'dynamic':
+				this.drawDynamic(binding);
+				break;
+			default:
+				console.warn(`[CanvasWorker] Unknown draw mode for panel ${panelId}`);
+		}
+	},
+
+	drawStatic(binding: CanvasBinding) {
+		binding.ctx.fillStyle = 'gray';
+		binding.ctx.fillRect(0, 0, binding.canvas.width, binding.canvas.height);
+	},
+
+	drawAnimated(binding: CanvasBinding) {
+		let hue = 0;
+
+		const drawFrame = () => {
+			hue = (hue + 1) % 360;
+			binding.ctx.fillStyle = `hsl(${hue}, 100%, 50%)`;
+			binding.ctx.fillRect(0, 0, binding.canvas.width, binding.canvas.height);
+
+			binding.animationFrame = requestAnimationFrame(drawFrame);
+		};
+
+		drawFrame();
+	},
+
+	drawDynamic(binding: CanvasBinding) {
+		let time = 0;
+
+		const drawFrame = () => {
+			time += 0.05;
+			binding.ctx.clearRect(0, 0, binding.canvas.width, binding.canvas.height);
+			binding.ctx.beginPath();
+			binding.ctx.arc(
+				binding.canvas.width / 2 + Math.sin(time) * 50,
+				binding.canvas.height / 2 + Math.cos(time) * 50,
+				30,
+				0,
+				Math.PI * 2
+			);
+			binding.ctx.fillStyle = 'orange';
+			binding.ctx.fill();
+	
+			binding.animationFrame = requestAnimationFrame(drawFrame);
+		};
+
+		drawFrame();
+	},
+
+	async unbindCanvas(panelId: string) {
+		const binding = this.bindings.get(panelId);
+		if (binding?.animationFrame) {
+			cancelAnimationFrame(binding.animationFrame);
+		}
+		this.bindings.delete(panelId);
+		console.log(`[CanvasWorker] Unbound canvas for panel ${panelId}`);
+	},
+};
+
+expose(CanvasManager);