@hi-ashleyj/llama 0.5.0 → 0.7.0

package/components/Game.svelte

@@ -3,6 +3,7 @@ import { onMount } from "svelte";
 import { setupGame } from "../setup";
 import { Timing } from "./motions";
 import { Controller } from "./controller";
+import { Mouse } from "./mouse";
 export let width = 1920;
 export let height = 1080;
 export let background = "#000000";
@@ -33,6 +34,7 @@ const assign = function (ctx) {
 };
 const timing = new Timing();
 const controller = new Controller();
+const mouse = new Mouse();
 const frameEvents = new Set();
 const frameBeforeEvents = new Set();
 const frameAfterEvents = new Set();
@@ -42,10 +44,15 @@ export const context = {
     height: heightStore,
     background: backgroundStore,
     assign,
-    createTimer: timing.create.bind(timing),
+    createTimer: timing.createTimer.bind(timing),
+    createBurst: timing.createBurst.bind(timing),
     onKeyboardEvent: controller.on.bind(controller),
     isKeyboardPressed: controller.isPressed.bind(controller),
     getKeyboardStore: controller.getStore.bind(controller),
+    onMouseEvent: mouse.on.bind(mouse),
+    isMousePressed: mouse.isPressed.bind(mouse),
+    getMousePosition: mouse.getPosition.bind(mouse),
+    getMouseStore: mouse.getStore.bind(mouse),
     onFrame: (callback) => {
         frameEvents.add(callback);
         return () => frameEvents.delete(callback);
@@ -81,13 +88,21 @@ const loop = function (time) {
 onMount(() => {
     requestAnimationFrame(loop);
     controller.start();
+    mouse.start();
 });
+let wiw = 0;
+let wih = 0;
+$: {
+    mouse.changeWindowDimensions(wiw, wih);
+}
 </script>
 
 <div class="game" style:background-color={background}>
     <slot />
 </div>
 
+<svelte:window bind:innerHeight={wih} bind:innerWidth={wiw}></svelte:window>
+
 <style>
     .game {
         position: relative;

package/components/Game.svelte.d.ts

@@ -14,9 +14,9 @@ declare const __propDef: {
         default: {};
     };
 };
-export declare type GameProps = typeof __propDef.props;
-export declare type GameEvents = typeof __propDef.events;
-export declare type GameSlots = typeof __propDef.slots;
+export type GameProps = typeof __propDef.props;
+export type GameEvents = typeof __propDef.events;
+export type GameSlots = typeof __propDef.slots;
 export default class Game extends SvelteComponentTyped<GameProps, GameEvents, GameSlots> {
     get context(): GameContext;
 }

package/components/GameObject.svelte.d.ts

@@ -18,9 +18,9 @@ declare const __propDef: {
         default: {};
     };
 };
-export declare type GameObjectProps = typeof __propDef.props;
-export declare type GameObjectEvents = typeof __propDef.events;
-export declare type GameObjectSlots = typeof __propDef.slots;
+export type GameObjectProps = typeof __propDef.props;
+export type GameObjectEvents = typeof __propDef.events;
+export type GameObjectSlots = typeof __propDef.slots;
 export default class GameObject extends SvelteComponentTyped<GameObjectProps, GameObjectEvents, GameObjectSlots> {
 }
 export {};

package/components/Layer.svelte.d.ts

@@ -10,9 +10,9 @@ declare const __propDef: {
         default: {};
     };
 };
-export declare type LayerProps = typeof __propDef.props;
-export declare type LayerEvents = typeof __propDef.events;
-export declare type LayerSlots = typeof __propDef.slots;
+export type LayerProps = typeof __propDef.props;
+export type LayerEvents = typeof __propDef.events;
+export type LayerSlots = typeof __propDef.slots;
 export default class Layer extends SvelteComponentTyped<LayerProps, LayerEvents, LayerSlots> {
 }
 export {};

package/components/drawables/Arc.svelte.d.ts

@@ -11,9 +11,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type ArcProps = typeof __propDef.props;
-export declare type ArcEvents = typeof __propDef.events;
-export declare type ArcSlots = typeof __propDef.slots;
+export type ArcProps = typeof __propDef.props;
+export type ArcEvents = typeof __propDef.events;
+export type ArcSlots = typeof __propDef.slots;
 export default class Arc extends SvelteComponentTyped<ArcProps, ArcEvents, ArcSlots> {
 }
 export {};

package/components/drawables/Circle.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type CircleProps = typeof __propDef.props;
-export declare type CircleEvents = typeof __propDef.events;
-export declare type CircleSlots = typeof __propDef.slots;
+export type CircleProps = typeof __propDef.props;
+export type CircleEvents = typeof __propDef.events;
+export type CircleSlots = typeof __propDef.slots;
 export default class Circle extends SvelteComponentTyped<CircleProps, CircleEvents, CircleSlots> {
 }
 export {};

package/components/drawables/DisplayImage.svelte.d.ts

@@ -14,9 +14,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type DisplayImageProps = typeof __propDef.props;
-export declare type DisplayImageEvents = typeof __propDef.events;
-export declare type DisplayImageSlots = typeof __propDef.slots;
+export type DisplayImageProps = typeof __propDef.props;
+export type DisplayImageEvents = typeof __propDef.events;
+export type DisplayImageSlots = typeof __propDef.slots;
 export default class DisplayImage extends SvelteComponentTyped<DisplayImageProps, DisplayImageEvents, DisplayImageSlots> {
 }
 export {};

package/components/drawables/MultiLineText.svelte.d.ts

@@ -16,9 +16,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type MultiLineTextProps = typeof __propDef.props;
-export declare type MultiLineTextEvents = typeof __propDef.events;
-export declare type MultiLineTextSlots = typeof __propDef.slots;
+export type MultiLineTextProps = typeof __propDef.props;
+export type MultiLineTextEvents = typeof __propDef.events;
+export type MultiLineTextSlots = typeof __propDef.slots;
 export default class MultiLineText extends SvelteComponentTyped<MultiLineTextProps, MultiLineTextEvents, MultiLineTextSlots> {
 }
 export {};

package/components/drawables/Rectangle.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type RectangleProps = typeof __propDef.props;
-export declare type RectangleEvents = typeof __propDef.events;
-export declare type RectangleSlots = typeof __propDef.slots;
+export type RectangleProps = typeof __propDef.props;
+export type RectangleEvents = typeof __propDef.events;
+export type RectangleSlots = typeof __propDef.slots;
 export default class Rectangle extends SvelteComponentTyped<RectangleProps, RectangleEvents, RectangleSlots> {
 }
 export {};

package/components/drawables/Text.svelte.d.ts

@@ -15,9 +15,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type TextProps = typeof __propDef.props;
-export declare type TextEvents = typeof __propDef.events;
-export declare type TextSlots = typeof __propDef.slots;
+export type TextProps = typeof __propDef.props;
+export type TextEvents = typeof __propDef.events;
+export type TextSlots = typeof __propDef.slots;
 export default class Text extends SvelteComponentTyped<TextProps, TextEvents, TextSlots> {
 }
 export {};

package/components/motions.d.ts

@@ -6,13 +6,14 @@ export declare class Timing {
         duration: number;
         repeats: number;
         store: Writable<number | null>;
+        burst?: boolean;
     }>;
     /**
      * Used to create a store whose value changes based on the total delta time.
      * Duration is in MS
      * Use 0 for repeats for infinite
      */
-    create({ duration, repeats }: {
+    createTimer({ duration, repeats }: {
         duration: number;
         repeats: number;
     }): {
@@ -21,5 +22,19 @@ export declare class Timing {
         update(this: void, updater: import("svelte/store").Updater<number>): void;
         subscribe(this: void, run: import("svelte/store").Subscriber<number>, invalidate?: ((value?: number | undefined) => void) | undefined): import("svelte/store").Unsubscriber;
     };
+    /**
+     * Used to create a store whose value adjusts based on bursts.
+     * Duration is in MS
+     */
+    createBurst({ duration, initialTrigger }: {
+        duration: number;
+        initialTrigger?: boolean;
+    }): {
+        stop: () => boolean;
+        trigger: () => void;
+        set(this: void, value: number): void;
+        update(this: void, updater: import("svelte/store").Updater<number>): void;
+        subscribe(this: void, run: import("svelte/store").Subscriber<number>, invalidate?: ((value?: number | undefined) => void) | undefined): import("svelte/store").Unsubscriber;
+    };
     update(delta: number): void;
 }

package/components/motions.js

@@ -9,7 +9,7 @@ export class Timing {
      * Duration is in MS
      * Use 0 for repeats for infinite
      */
-    create({ duration, repeats }) {
+    createTimer({ duration, repeats }) {
         let store = { ...writable(0), stop: () => this.targets.delete(out) };
         let out = {
             current: 0,
@@ -20,9 +20,27 @@ export class Timing {
         this.targets.add(out);
         return store;
     }
+    /**
+     * Used to create a store whose value adjusts based on bursts.
+     * Duration is in MS
+     */
+    createBurst({ duration, initialTrigger }) {
+        let store = { ...writable(initialTrigger ? 0 : 1), stop: () => this.targets.delete(out), trigger: () => { store.set(0); out.current = 0; } };
+        let out = {
+            current: initialTrigger ? 0 : -1,
+            duration,
+            repeats: 1,
+            store,
+            burst: true
+        };
+        this.targets.add(out);
+        return store;
+    }
     update(delta) {
         this.targets.forEach((t, ignored, set) => {
             if (t.current < 0) {
+                if (t.burst)
+                    return; // do not destroy stores for bursts
                 t.store.set(null);
                 set.delete(t);
                 return;

package/components/mouse/MouseClickable.svelte

@@ -0,0 +1,50 @@
+<script>import { setupDrawable, getGame } from "../../setup";
+import { onMount, createEventDispatcher } from "svelte";
+import { MOUSE_ACTION } from "../mouse";
+let tx = 0;
+let ty = 0;
+let tw = 0;
+let th = 0;
+let dispatch = createEventDispatcher();
+let context = getGame();
+const draw = function (_info, { x, y, w, h }) {
+    tx = x;
+    ty = y;
+    tw = w;
+    th = h;
+};
+let register = setupDrawable({});
+onMount(() => {
+    let event = context.onMouseEvent(null, MOUSE_ACTION.DOWN, ({ key }) => {
+        let x = context.getMousePosition("mouse_x");
+        if (x < tx || x > tx + tw)
+            return;
+        let y = context.getMousePosition("mouse_y");
+        if (y < ty || y > ty + th)
+            return;
+        console.log(key);
+        dispatch("click");
+        switch (key) {
+            case ("mouse_left"): {
+                dispatch("left");
+                dispatch("leftorright");
+                return;
+            }
+            case ("mouse_right"): {
+                dispatch("right");
+                dispatch("leftorright");
+                return;
+            }
+            case ("mouse_middle"): {
+                dispatch("middle");
+            }
+        }
+        dispatch("other");
+    });
+    let deregister = register({ draw });
+    return () => {
+        event();
+        deregister();
+    };
+});
+</script>

package/components/mouse/MouseClickable.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
+        click: CustomEvent<any>;
+        left: CustomEvent<any>;
+        leftorright: CustomEvent<any>;
+        right: CustomEvent<any>;
+        middle: CustomEvent<any>;
+        other: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type MouseClickableProps = typeof __propDef.props;
+export type MouseClickableEvents = typeof __propDef.events;
+export type MouseClickableSlots = typeof __propDef.slots;
+export default class MouseClickable extends SvelteComponentTyped<MouseClickableProps, MouseClickableEvents, MouseClickableSlots> {
+}
+export {};

package/components/mouse/MouseEventArea.svelte

@@ -0,0 +1,55 @@
+<script>import { setupDrawable, getGame } from "../../setup";
+import { onMount, createEventDispatcher } from "svelte";
+import { MOUSE_ACTION } from "../mouse";
+let tx = 0;
+let ty = 0;
+let tw = 0;
+let th = 0;
+let dispatch = createEventDispatcher();
+let context = getGame();
+let mouseX = context.getMouseStore("mouse_x");
+let mouseY = context.getMouseStore("mouse_y");
+export let hover = false;
+const draw = function (_info, { x, y, w, h }) {
+    tx = x;
+    ty = y;
+    tw = w;
+    th = h;
+    if ($mouseX < tx || $mouseX > tx + tw)
+        return hover = false;
+    if ($mouseY < ty || $mouseY > ty + th)
+        return hover = false;
+    hover = true;
+};
+let register = setupDrawable({});
+onMount(() => {
+    let event = context.onMouseEvent(null, MOUSE_ACTION.DOWN, ({ key }) => {
+        if ($mouseX < tx || $mouseX > tx + tw)
+            return;
+        if ($mouseY < ty || $mouseY > ty + th)
+            return;
+        dispatch("click");
+        switch (key) {
+            case ("mouse_left"): {
+                dispatch("left");
+                dispatch("leftorright");
+                return;
+            }
+            case ("mouse_right"): {
+                dispatch("right");
+                dispatch("leftorright");
+                return;
+            }
+            case ("mouse_middle"): {
+                dispatch("middle");
+            }
+        }
+        dispatch("other");
+    });
+    let deregister = register({ draw });
+    return () => {
+        event();
+        deregister();
+    };
+});
+</script>

package/components/mouse/MouseEventArea.svelte.d.ts

@@ -0,0 +1,23 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        hover?: boolean | undefined;
+    };
+    events: {
+        click: CustomEvent<any>;
+        left: CustomEvent<any>;
+        leftorright: CustomEvent<any>;
+        right: CustomEvent<any>;
+        middle: CustomEvent<any>;
+        other: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type MouseEventAreaProps = typeof __propDef.props;
+export type MouseEventAreaEvents = typeof __propDef.events;
+export type MouseEventAreaSlots = typeof __propDef.slots;
+export default class MouseEventArea extends SvelteComponentTyped<MouseEventAreaProps, MouseEventAreaEvents, MouseEventAreaSlots> {
+}
+export {};

package/components/mouse/MouseLeftClick.svelte

@@ -0,0 +1,33 @@
+<script>import { setupDrawable, getGame } from "../../setup";
+import { onMount, createEventDispatcher } from "svelte";
+import { MOUSE_ACTION } from "../mouse";
+let tx = 0;
+let ty = 0;
+let tw = 0;
+let th = 0;
+let dispatch = createEventDispatcher();
+let context = getGame();
+const draw = function (_info, { x, y, w, h }) {
+    tx = x;
+    ty = y;
+    tw = w;
+    th = h;
+};
+let register = setupDrawable({});
+onMount(() => {
+    let event = context.onMouseEvent("mouse_left", MOUSE_ACTION.DOWN, () => {
+        let x = context.getMousePosition("mouse_x");
+        if (x < tx || x > tx + tw)
+            return;
+        let y = context.getMousePosition("mouse_y");
+        if (y < ty || y > ty + th)
+            return;
+        dispatch("click");
+    });
+    let deregister = register({ draw });
+    return () => {
+        event();
+        deregister();
+    };
+});
+</script>

package/components/mouse/MouseLeftClick.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
+        click: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type MouseLeftClickProps = typeof __propDef.props;
+export type MouseLeftClickEvents = typeof __propDef.events;
+export type MouseLeftClickSlots = typeof __propDef.slots;
+export default class MouseLeftClick extends SvelteComponentTyped<MouseLeftClickProps, MouseLeftClickEvents, MouseLeftClickSlots> {
+}
+export {};

package/components/mouse.d.ts

@@ -0,0 +1,33 @@
+import type { Writable } from "svelte/store";
+export declare enum MOUSE_ACTION {
+    DOWN = "down",
+    UP = "up",
+    MOVE = "move"
+}
+type MouseEventBoolean = "mouse_left" | "mouse_middle" | "mouse_right";
+type MouseEventNumber = "mouse_x" | "mouse_y";
+export declare class Mouse {
+    constructor();
+    events: Set<{
+        key: string | null;
+        action: MOUSE_ACTION;
+        call: (e: {
+            key: string | null;
+            action: MOUSE_ACTION;
+        }) => any | void;
+    }>;
+    mouseState: Map<MouseEventBoolean | MouseEventNumber, boolean | number>;
+    mouseStores: Map<MouseEventBoolean | MouseEventNumber, Writable<boolean | number>>;
+    innerWidth: number;
+    innerHeight: number;
+    start(): void;
+    on(key: MouseEventBoolean | MouseEventNumber | null, action: MOUSE_ACTION, callback: (e: {
+        key: string | null;
+        action: MOUSE_ACTION;
+    }) => any | void): () => any;
+    getStore<T extends (MouseEventBoolean | MouseEventNumber)>(key: T): Writable<T extends MouseEventNumber ? number : boolean>;
+    isPressed(key: MouseEventBoolean): boolean;
+    getPosition(key: MouseEventNumber): number;
+    changeWindowDimensions(width: number, height: number): void;
+}
+export {};

package/components/mouse.js

@@ -0,0 +1,143 @@
+import { writable } from "svelte/store";
+export var MOUSE_ACTION;
+(function (MOUSE_ACTION) {
+    MOUSE_ACTION["DOWN"] = "down";
+    MOUSE_ACTION["UP"] = "up";
+    // CLICK = "click",
+    MOUSE_ACTION["MOVE"] = "move";
+})(MOUSE_ACTION || (MOUSE_ACTION = {}));
+export class Mouse {
+    constructor() {
+        this.events = new Set();
+        this.mouseState = new Map();
+        this.mouseStores = new Map();
+    }
+    events;
+    mouseState;
+    mouseStores;
+    innerWidth = 0;
+    innerHeight = 0;
+    start() {
+        window.addEventListener("pointerdown", (e) => {
+            e.preventDefault();
+            let eKeyLowCase;
+            switch (e.button) {
+                case (0): {
+                    eKeyLowCase = "mouse_left";
+                    break;
+                }
+                case (2): {
+                    eKeyLowCase = "mouse_right";
+                    break;
+                }
+                case (1): {
+                    eKeyLowCase = "mouse_middle";
+                    break;
+                }
+                default: return;
+            }
+            this.mouseState.set(eKeyLowCase, true);
+            this.events.forEach(({ key, action, call }) => {
+                if ((key === eKeyLowCase || key === null) && action === MOUSE_ACTION.DOWN)
+                    call({ key: eKeyLowCase, action });
+            });
+            if (this.mouseStores.has(eKeyLowCase)) {
+                this.mouseStores.get(eKeyLowCase)?.set(true);
+            }
+        });
+        window.addEventListener("pointerup", (e) => {
+            e.preventDefault();
+            let eKeyLowCase;
+            switch (e.button) {
+                case (0): {
+                    eKeyLowCase = "mouse_left";
+                    break;
+                }
+                case (1): {
+                    eKeyLowCase = "mouse_right";
+                    break;
+                }
+                case (2): {
+                    eKeyLowCase = "mouse_middle";
+                    break;
+                }
+                default: return;
+            }
+            this.mouseState.set(eKeyLowCase, false);
+            this.events.forEach(({ key, action, call }) => {
+                if ((key === eKeyLowCase || key === null) && action === MOUSE_ACTION.UP)
+                    call({ key: eKeyLowCase, action });
+            });
+            if (this.mouseStores.has(eKeyLowCase)) {
+                this.mouseStores.get(eKeyLowCase)?.set(false);
+            }
+        });
+        window.addEventListener("pointermove", (e) => {
+            let rawX = e.offsetX;
+            let rawY = e.offsetY;
+            let adjustedX;
+            let adjustedY;
+            if (this.innerWidth / this.innerHeight > 16 / 9) {
+                // TODO: De Hard-code this
+                const scaleFactor = 1080 / this.innerHeight;
+                const realCanvasSize = 1920 / scaleFactor;
+                adjustedY = rawY * scaleFactor;
+                adjustedX = (rawX - ((this.innerWidth - realCanvasSize) / 2)) * scaleFactor;
+            }
+            else {
+                // TODO: De Hard-code this
+                const scaleFactor = 1920 / this.innerWidth;
+                const realCanvasSize = 1080 / scaleFactor;
+                adjustedX = rawX * scaleFactor;
+                adjustedY = (rawY - ((this.innerHeight - realCanvasSize) / 2)) * scaleFactor;
+            }
+            this.mouseState.set("mouse_x", adjustedX);
+            this.mouseState.set("mouse_y", adjustedY);
+            this.events.forEach(({ key, action, call }) => {
+                if ((key === "mouse_x" || key === null) && action === MOUSE_ACTION.MOVE)
+                    call({ key: "mouse_x", action });
+                if ((key === "mouse_y" || key === null) && action === MOUSE_ACTION.MOVE)
+                    call({ key: "mouse_y", action });
+            });
+            if (this.mouseStores.has("mouse_x")) {
+                this.mouseStores.get("mouse_x")?.set(adjustedX);
+            }
+            if (this.mouseStores.has("mouse_y")) {
+                this.mouseStores.get("mouse_y")?.set(adjustedY);
+            }
+        });
+        window.addEventListener("contextmenu", (e) => {
+            e.preventDefault();
+        });
+    }
+    on(key, action, callback) {
+        let obj = { key, action, call: callback };
+        this.events.add(obj);
+        return () => {
+            this.events.delete(obj);
+        };
+    }
+    getStore(key) {
+        if (this.mouseStores.has(key)) {
+            return this.mouseStores.get(key);
+        }
+        if (key === "mouse_x" || key === "mouse_y") {
+            let wr = writable(this.mouseState.get(key) ?? 0);
+            this.mouseStores.set(key, wr);
+            return wr;
+        }
+        let wr = writable(this.mouseState.get(key) ?? false);
+        this.mouseStores.set(key, wr);
+        return wr;
+    }
+    isPressed(key) {
+        return this.mouseState.get(key) ?? false;
+    }
+    getPosition(key) {
+        return this.mouseState.get(key) ?? 0;
+    }
+    changeWindowDimensions(width, height) {
+        this.innerHeight = height;
+        this.innerWidth = width;
+    }
+}

package/index.d.ts

@@ -1,6 +1,12 @@
 export { default as Game } from "./components/Game.svelte";
 export { default as Layer } from "./components/Layer.svelte";
 export { default as GameObject } from "./components/GameObject.svelte";
+export { default as MouseLeftClick } from "./components/mouse/MouseLeftClick.svelte";
+export { default as MouseClickable } from "./components/mouse/MouseClickable.svelte";
+export { default as MouseEventArea } from "./components/mouse/MouseEventArea.svelte";
 export * as drawables from "./components/drawables/index";
 export { setupDrawable, getGame } from "./setup";
 export { resolve as resolveImage } from "./components/resources/images";
+export { CONTROLLER_ACTION } from "./components/controller";
+export { MOUSE_ACTION } from "./components/mouse";
+export type { GameContext, DrawableContext, DrawableFunction, LayerContext } from "./types/index";

package/index.js

@@ -1,6 +1,11 @@
 export { default as Game } from "./components/Game.svelte";
 export { default as Layer } from "./components/Layer.svelte";
 export { default as GameObject } from "./components/GameObject.svelte";
+export { default as MouseLeftClick } from "./components/mouse/MouseLeftClick.svelte";
+export { default as MouseClickable } from "./components/mouse/MouseClickable.svelte";
+export { default as MouseEventArea } from "./components/mouse/MouseEventArea.svelte";
 export * as drawables from "./components/drawables/index";
 export { setupDrawable, getGame } from "./setup";
 export { resolve as resolveImage } from "./components/resources/images";
+export { CONTROLLER_ACTION } from "./components/controller";
+export { MOUSE_ACTION } from "./components/mouse";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hi-ashleyj/llama",
   "description": "A (Very Incomplete) 2D Canvas Game Engine powered by Svelte",
-  "version": "0.5.0",
+  "version": "0.7.0",
   "type": "module",
   "repository": {
     "type": "git",
@@ -14,14 +14,15 @@
   },
   "homepage": "https://github.com/hi-ashleyj/llama-game-engine#readme",
   "devDependencies": {
-    "@sveltejs/adapter-static": "next",
-    "@sveltejs/kit": "next",
-    "@sveltejs/package": "*",
+    "@sveltejs/adapter-static": "latest",
+    "@sveltejs/kit": "latest",
+    "@sveltejs/package": "latest",
+    "sass": "^1.58.0",
     "svelte": "^3.44.0",
     "svelte-preprocess": "^4.10.7",
     "svelte2tsx": "^0.5.12",
     "typescript": "^4.7.4",
-    "vite": "^3.0.0"
+    "vite": "^4.0.0"
   },
   "exports": {
     "./package.json": "./package.json",
@@ -37,6 +38,10 @@
     "./components/drawables/Text.svelte": "./components/drawables/Text.svelte",
     "./components/drawables": "./components/drawables/index.js",
     "./components/motions": "./components/motions.js",
+    "./components/mouse/MouseClickable.svelte": "./components/mouse/MouseClickable.svelte",
+    "./components/mouse/MouseEventArea.svelte": "./components/mouse/MouseEventArea.svelte",
+    "./components/mouse/MouseLeftClick.svelte": "./components/mouse/MouseLeftClick.svelte",
+    "./components/mouse": "./components/mouse.js",
     "./components/resources/images": "./components/resources/images.js",
     "./drawables": "./drawables.js",
     ".": "./index.js",

package/setup.js

@@ -2,6 +2,7 @@ import { getContext, setContext } from 'svelte';
 const GAME = Symbol();
 const LAYER = Symbol();
 const DRAWABLE = Symbol();
+const BOX = Symbol();
 export const setupGame = function (context) {
     if (getContext(GAME)) {
         throw new Error("Cannot Mount Game inside a Game");

package/types/contexts.d.ts

@@ -1,16 +1,22 @@
 import { Writable } from 'svelte/store';
 import { Timing } from "../components/motions";
 import { Controller } from "../components/controller";
+import { Mouse } from "../components/mouse";
 
 export type GameContext = { 
     assign: (context: { draw: Function }) => () => any,
     width: Writable<number>, 
     height: Writable<number>, 
     background: Writable<string>,
-    createTimer: Timing["create"],
+    createTimer: Timing["createTimer"],
+    createBurst: Timing["createBurst"],
     onKeyboardEvent: Controller["on"],
     isKeyboardPressed: Controller["isPressed"],
     getKeyboardStore: Controller["getStore"],
+    onMouseEvent: Mouse["on"],
+    isMousePressed: Mouse["isPressed"],
+    getMousePosition: Mouse["getPosition"],
+    getMouseStore: Mouse["getStore"],
     onFrame: (callback: Function) => () => any,
     onBeforeFrame: (callback: Function) => () => any,
     onAfterFrame: (callback: Function) => () => any,