feat: support svelte types

packages/svelte-guides/package.json

@@ -1,6 +1,6 @@
 {
     "name": "svelte-guides",
-    "version": "0.25.5",
+    "version": "0.25.6",
     "description": "A Svelte Guides component that can draw ruler and manage guidelines.",
     "svelte": "./src/index.js",
     "sideEffects": false,

packages/svelte-guides/src/index.d.ts

@@ -1,27 +1,16 @@
-import { GuidesInterface } from "@scena/guides";
+/// <reference types="svelte" />
+import { SvelteComponentTyped } from "svelte";
+import { GuidesInterface, GuidesOptions, GuidesEvents } from "@scena/guides";
 
-
-interface ComponentOptions {
-    target: HTMLElement;
-    anchor?: HTMLElement | null;
-    props?: {};
-    hydrate?: boolean;
-    intro?: boolean;
+export type SvelteGuidesEvents = {
+    [key in keyof GuidesEvents]: CustomEvent<GuidesEvents[key]>;
 }
+export default class GuidesComponent extends SvelteComponentTyped<
+    GuidesOptions,
+    SvelteGuidesEvents
+> { }
 
-interface GuidesComponent extends GuidesInterface {
-    new(options: ComponentOptions): any;
-    // client-side methods
-    $set(props: {}): void;
-    $on(event: string, callback: (event: CustomEvent) => void): void;
-    $destroy(): void;
-    // server-side methods
-    render(props?: {}): {
-        html: string;
-        css: { code: string; map: string | null };
-        head?: string;
-    };
+export default interface GuidesComponent extends GuidesInterface {
 }
 
-export default GuidesComponent;
 export * from "@scena/guides";