@hi-ashleyj/llama 0.12.5 → 0.13.0

package/README.md

@@ -33,3 +33,276 @@ To get started:
 </style>
 ```
 
+## Asset Handling
+Let's prepare some asset handling. I recommend doing this in it's own component. The following pattern preloads assets with the page:  
+
+```diff
+/// +page.svelte
+
+    import { SensibleDefaultStyles, Game } from "@hi-ashleyj/llama";
++   import Assets from "./Assets.svelte";
+
+    ...
+
+    <Game>
+
++       <Assets />
+
+    </Game>
+```
+```html
+/// Assets.svelte
+
+<script lang="ts">
+
+    import { AssetPool, ImageAsset, AudioBufferedAsset, AudioMediaAsset } from "@hi-ashleyj/llama/resources";
+
+    // ... use standard Vite imports here 
+
+</script>
+
+<AssetPool>
+
+    <ImageAsset url={...} />
+    ...
+
+</AssetPool>
+
+```
+
+## Layer Setup
+A Llama game is made of multiple 2D Layers. I highly recommend creating a folder for all layers, then having an additional folder per layer.  
+We'll create an additional layers.ts file in order to glob import the layer components, as Vite only supports globbing in TS files.  
+
+```diff
+  /src/routes
++ ├── layers
++ │   ├── background
++ │   ├── ui
++ │   └── layers.ts
+  ├── +page.svelte
+  └── Assets.svelte
+```
+
+```ts
+// layers/layers.ts
+import type { SvelteComponent } from "svelte";
+
+const imports = import.meta.glob<{default: SvelteComponent}>("./**/_Layer.svelte", {eager: true});
+export const layers: SvelteComponent[] = Object.keys(imports).map((it) => imports[it].default);
+```
+
+```diff
+/// +page.svelte
+
+    import Assets from "./Assets.svelte";
++   import { layers } from "./layers/layers.js";
+
+    ...
+
+    <Game>
+
++       {#each layers as layer}
++           <svelte:component this={layer}>
++       {/each}
+
+    </Game>
+```
+
+## Layers and Scenes
+Let's get started with actually creating some Layers now.  
+You'll probably find it faster to also setup Scenes now as well.  
+Let's start by making a file to store potential scenes in.  
+
+```diff
+  /src/lib
++ └── constants.ts
+```
+
+```ts
+/// src/lib/constants.ts
+
+export const SCENES = {
+    // examples
+    MENU: "default", // Scene "default" will be shown on load.
+    GAME: "game"
+    ...
+} as const;
+```
+
+And now, let's create a layer, and add the scene switcher to it.
+
+```diff
+  /src/routes
+  ├── layers
+  │   ├── background
++ │   │   └── _Layer.svelte
+  │   └── ...
+  └── ...
+```
+
+```html
+/// layers/background/_Layer.svelte
+
+<script lang="ts">
+
+    import { Layer } from "@hi-ashleyj/llama";
+    import { SceneSwitcher } from "@hi-ashleyj/llama/scenes";
+    import { SCENES } from "$lib/constants.js";
+
+    // ... import individual scene components here
+
+</script>
+
+<Layer name="background" zIndex={0}>
+    <SceneSwitcher scenes={{
+        ...
+    }}/>
+</Layer>
+
+```
+And that's all we need to create a layer. We should also probably setup a scene.  
+Here's an example for how to add the Menu and Game scenes we hinted earlier:
+
+```diff
+  /src/routes
+  ├── layers
+  │   ├── background
+  │   │   ├── _Layer.svelte
++ │   │   ├── Game.svelte
++ │   │   └── Menu.svelte
+  │   └── ...
+  └── ...
+```
+
+```diff
+/// layers/background/_Layer.svelte
+
+    import { SCENES } from "$lib/constants.js";
+
+    // ... import individual scene components here
++   import Menu from "./Menu.svelte"
++   import Game from "./Game.svelte"
+
+    ...
+
+    <SceneSwitcher scenes={{
++       [ SCENES.MENU ]: Menu,
++       [ SCENES.GAME ]: Game
+    }}/>
+
+```
+
+Note that both Menu and Game are empty, as an empty .svelte file is still a valid Svelte component.
+
+## Scene Transition / Changing Scene
+One thing left to do before scenes can be changed is to consume the SceneTransition component somewhere.  
+I like to do this in a layer above all others. Here's a basic fade animation as the scene changes.
+
+```diff
+  /src/routes
+  ├── layers
++ │   ├── transition
++ │   │   └── _Layer.svelte
+  │   └── ...
+  └── ...
+```
+
+```html
+/// layers/transition/_Layer.svelte
+
+<script lang="ts">
+
+    import { Layer } from "@hi-ashleyj/llama";
+    import { SceneSwitcher } from "@hi-ashleyj/llama/scenes";
+    import { Node, Area, Opacity } from "@hi-ashleyj/llama/primitives";
+    import { Rectangle } from "@hi-ashleyj/llama/drawables";
+
+</script>
+
+<Layer name="transition" zIndex={99}>
+    <SceneTransition let:normalized duration={800}>
+        <Node x={0} y={0}>
+            <Area w={0} h={0}>
+                <Opacity opacity={normalized}>
+                    <Rectangle fill="black" />
+                </Opacity>
+            </Area>
+        </Node>
+    </SceneTransition>
+</Layer>
+```
+
+Note that due to the glob-based importing, this should be sucked into the project automagically.
+
+## Primitives (@hi-ashleyj/llama/primitives)
+These are the basic building blocks for displaying anything.  
+Thing of these as points, and bounding boxes.  
+
+## Empty
+Component that literally does nothing. Use for wrapping multiple similar items together.
+
+### Node
+Base entry point. Wrapper around a single item in the game (think GameObject in unity or Empty in Blender).
+
+```ts
+type Props = {
+    x: number;
+    y: number;
+}
+```
+
+### Area
+Use within a `Node`. Specifies a bounding box for a drawable.  
+Position of the parent is considered the top-left corner of the area.  
+If `center` is true, it will consider parent position to be the center of the area.
+```ts
+type Props = {
+    w: number;
+    h: number;
+    center: boolean = false;
+    x?: number; // Optional offset
+    y?: number; // Optional offset
+}
+```
+
+### Translate
+Use within a `Node`. Offsets the position of the node for all children.
+```ts
+type Props = {
+    x: number;
+    y: number;
+}
+```
+
+### Inset
+Use within an `Area`. Works similar to CSS `inset` prop. Use to move the bounding box of an `Area` towards the middle (use negative to extend).  
+```ts
+type Props = {
+    top: number = 0;
+    left: number = 0;
+    right: number = 0;
+    bottom: number = 0;
+}
+```
+
+### Opacity
+Adjusts the opacity for all drawn children. This is set absolutely, so nesting 0.5 with another 0.5 does not make a 0.25 opaque child.  
+If opacity is 0 or less, drawing of children (including other opacity nodes) is skipped.  
+Opacity will be clamped to 1.
+```ts
+type Props = {
+    opacity: number; // Between 0 and 1.
+}
+```
+
+### Rotate
+Rotates the element by some number of degrees.  
+Rotates around the top left corner of the element, unless `centered` is specified.
+```ts
+type Props = {
+    centered: boolean = false;
+    degrees: number;
+}
+```
+

package/dist/drawables/index.d.ts

@@ -6,3 +6,4 @@ export { default as Text } from "./Text.svelte";
 export { default as MultiLineText } from "./MultiLineText.svelte";
 export { default as RoundedRectangle } from "./RoundedRectangle.svelte";
 export { default as Tiled } from "./Tiled.svelte";
+export { setupDrawable, type DrawableContext, type DrawFunction, type DrawableObject } from "../drawable.js";

package/dist/drawables/index.js

@@ -6,3 +6,4 @@ export { default as Text } from "./Text.svelte";
 export { default as MultiLineText } from "./MultiLineText.svelte";
 export { default as RoundedRectangle } from "./RoundedRectangle.svelte";
 export { default as Tiled } from "./Tiled.svelte";
+export { setupDrawable } from "../drawable.js";

package/dist/index.d.ts

@@ -1,35 +1,24 @@
 export { default as Game } from "./Game.svelte";
 export { default as Layer } from "./Layer.svelte";
-export { default as GameObject } from "./GameObject.svelte";
 export { getGame, getLayer, getTriggerLayerRender } from "./core-contexts.js";
 export type { GameContext, LayerContext, LayerDrawable } from "./core-contexts.js";
 export { default as MouseClickable } from "./controllers/MouseClickable.svelte";
 export { default as MouseEventArea } from "./controllers/MouseEventArea.svelte";
 export { MOUSE_ACTION } from "./controllers/mouse.js";
 export { KEYBOARD_ACTION } from "./controllers/keyboard.js";
-export { setupDrawable, type DrawableContext, type DrawFunction, type DrawableObject } from "./drawable.js";
 export * as Drawables from "./drawables/index.js";
-export { resolve as resolveImage } from "./resources/images.js";
-export { useTileSet, getTile, type TileSet } from "./resources/tileset.js";
-export { resolveBuffer as resolveAudioBuffer } from "./resources/audio.js";
-export { default as AssetPool } from "./resources/AssetPool.svelte";
-export { default as AudioBufferedAsset } from "./resources/AudioBufferedAsset.svelte";
-export { default as AudioMediaAsset } from "./resources/AudioMediaAsset.svelte";
-export { default as ImageAsset } from "./resources/ImageAsset.svelte";
+export * as Resource from "./resources.js";
+export * as Primitives from "./primitives.js";
 export { default as SensibleDefaultStyles } from "./extras/SensibleDefaultStyles.svelte";
-export { default as Empty } from "./extras/Empty.svelte";
 export { default as LayerPortal } from "./extras/LayerPortal.svelte";
-export { changeScene } from "./extras/scenes.js";
-export { default as SceneSwitcher } from "./extras/SceneSwitcher.svelte";
-export { default as SceneTransition } from "./extras/SceneTransition.svelte";
-export { default as Rotate } from "./extras/Rotate.svelte";
 export { default as Tweened } from "./extras/Tweened.svelte";
 export { default as DefaultFontFace } from "./extras/DefaultFontFace.svelte";
 export { default as FullScreenEventHandler } from "./extras/FullScreenEventHandler.svelte";
-export { getAudioContext, getConnector as getAudioConnector } from "./audio/context.js";
+export { getAudioContext, getConnector as getAudioConnector, type AudioSvelteContext as LlamaAudioContext } from "./audio/context.js";
 export { default as AudioListenerPosition } from "./audio/AudioListenerPosition.svelte";
 export { default as BufferedAudioSource } from "./audio/BufferedAudioSource.svelte";
 export { default as MediaAudioSource } from "./audio/MediaAudioSource.svelte";
 export { default as AudioGain } from "./audio/AudioGain.svelte";
 export { default as AudioPanner } from "./audio/AudioPanner.svelte";
 export { default as AudioCompressor } from "./audio/AudioCompressor.svelte";
+export * as Scenes from "./scenes.js";

package/dist/index.js

@@ -1,7 +1,6 @@
 // CORE
 export { default as Game } from "./Game.svelte";
 export { default as Layer } from "./Layer.svelte";
-export { default as GameObject } from "./GameObject.svelte";
 export { getGame, getLayer, getTriggerLayerRender } from "./core-contexts.js";
 // CONTROLLERS
 export { default as MouseClickable } from "./controllers/MouseClickable.svelte";
@@ -9,24 +8,14 @@ export { default as MouseEventArea } from "./controllers/MouseEventArea.svelte";
 export { MOUSE_ACTION } from "./controllers/mouse.js";
 export { KEYBOARD_ACTION } from "./controllers/keyboard.js";
 // DRAWABLES
-export { setupDrawable } from "./drawable.js";
 export * as Drawables from "./drawables/index.js";
 // RESOURCES
-export { resolve as resolveImage } from "./resources/images.js";
-export { useTileSet, getTile } from "./resources/tileset.js";
-export { resolveBuffer as resolveAudioBuffer } from "./resources/audio.js";
-export { default as AssetPool } from "./resources/AssetPool.svelte";
-export { default as AudioBufferedAsset } from "./resources/AudioBufferedAsset.svelte";
-export { default as AudioMediaAsset } from "./resources/AudioMediaAsset.svelte";
-export { default as ImageAsset } from "./resources/ImageAsset.svelte";
+export * as Resource from "./resources.js";
+// PRIMITIVES
+export * as Primitives from "./primitives.js";
 // EXTRAS
 export { default as SensibleDefaultStyles } from "./extras/SensibleDefaultStyles.svelte";
-export { default as Empty } from "./extras/Empty.svelte";
 export { default as LayerPortal } from "./extras/LayerPortal.svelte";
-export { changeScene } from "./extras/scenes.js";
-export { default as SceneSwitcher } from "./extras/SceneSwitcher.svelte";
-export { default as SceneTransition } from "./extras/SceneTransition.svelte";
-export { default as Rotate } from "./extras/Rotate.svelte";
 export { default as Tweened } from "./extras/Tweened.svelte";
 export { default as DefaultFontFace } from "./extras/DefaultFontFace.svelte";
 export { default as FullScreenEventHandler } from "./extras/FullScreenEventHandler.svelte";
@@ -38,3 +27,4 @@ export { default as MediaAudioSource } from "./audio/MediaAudioSource.svelte";
 export { default as AudioGain } from "./audio/AudioGain.svelte";
 export { default as AudioPanner } from "./audio/AudioPanner.svelte";
 export { default as AudioCompressor } from "./audio/AudioCompressor.svelte";
+export * as Scenes from "./scenes.js";

package/dist/primitives/Area.svelte

@@ -0,0 +1,25 @@
+<script>import { setupDrawable } from "../drawable.js";
+import { onMount } from "svelte";
+export let x = 0;
+export let y = 0;
+export let w;
+export let h;
+export let center = false;
+const targets = /* @__PURE__ */ new Set();
+const draw = function({ width, height, ctx }, offset) {
+  targets.forEach((f) => f.draw({ width, height, ctx }, { x: offset.x + x - (center ? w / 2 : 0), y: offset.y + y - (center ? h / 2 : 0), w, h }));
+};
+let register = setupDrawable({
+  assign: (ctx) => {
+    targets.add(ctx);
+    return () => {
+      targets.delete(ctx);
+    };
+  }
+});
+onMount(() => {
+  return register({ draw });
+});
+</script>
+
+<slot/>

package/dist/primitives/Area.svelte.d.ts

@@ -0,0 +1,25 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        x?: number | undefined;
+        y?: number | undefined;
+        w: number;
+        h: number;
+        /**
+             * TRUE = ALIGN CENTER
+             * FALSE (default) = ALIGN TOP LEFT
+             */ center?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AreaProps = typeof __propDef.props;
+export type AreaEvents = typeof __propDef.events;
+export type AreaSlots = typeof __propDef.slots;
+export default class Area extends SvelteComponent<AreaProps, AreaEvents, AreaSlots> {
+}
+export {};

package/dist/primitives/Inset.svelte

@@ -0,0 +1,29 @@
+<script>import { setupDrawable } from "../drawable.js";
+import { onMount } from "svelte";
+export let left = 0;
+export let right = 0;
+export let top = 0;
+export let bottom = 0;
+const targets = /* @__PURE__ */ new Set();
+const draw = function({ width, height, ctx }, o) {
+  targets.forEach((f) => f.draw({ width, height, ctx }, {
+    x: o.x + left,
+    y: o.y + top,
+    w: o.x - left - right,
+    h: o.y - top - bottom
+  }));
+};
+let register = setupDrawable({
+  assign: (ctx) => {
+    targets.add(ctx);
+    return () => {
+      targets.delete(ctx);
+    };
+  }
+});
+onMount(() => {
+  return register({ draw });
+});
+</script>
+
+<slot/>

package/dist/primitives/Inset.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        left?: number | undefined;
+        right?: number | undefined;
+        top?: number | undefined;
+        bottom?: number | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type InsetProps = typeof __propDef.props;
+export type InsetEvents = typeof __propDef.events;
+export type InsetSlots = typeof __propDef.slots;
+export default class Inset extends SvelteComponent<InsetProps, InsetEvents, InsetSlots> {
+}
+export {};

package/dist/primitives/Node.svelte

@@ -0,0 +1,22 @@
+<script>import { setupDrawable } from "../drawable.js";
+import { onMount } from "svelte";
+export let x;
+export let y;
+const targets = /* @__PURE__ */ new Set();
+const draw = function({ width, height, ctx }) {
+  targets.forEach((f) => f.draw({ width, height, ctx }, { x, y }));
+};
+let register = setupDrawable({
+  assign: (ctx) => {
+    targets.add(ctx);
+    return () => {
+      targets.delete(ctx);
+    };
+  }
+});
+onMount(() => {
+  return register({ draw });
+});
+</script>
+
+<slot/>

package/dist/primitives/Node.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        x: number;
+        y: number;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type NodeProps = typeof __propDef.props;
+export type NodeEvents = typeof __propDef.events;
+export type NodeSlots = typeof __propDef.slots;
+export default class Node extends SvelteComponent<NodeProps, NodeEvents, NodeSlots> {
+}
+export {};

package/dist/primitives/Opacity.svelte

@@ -0,0 +1,25 @@
+<script>import { setupDrawable } from "../drawable.js";
+import { onMount } from "svelte";
+export let opacity;
+const targets = /* @__PURE__ */ new Set();
+const draw = function({ width, height, ctx }, offset) {
+  if (opacity <= 0)
+    return;
+  ctx.globalAlpha = Math.min(opacity, 1);
+  targets.forEach((f) => f.draw({ width, height, ctx }, offset));
+  ctx.globalAlpha = 1;
+};
+let register = setupDrawable({
+  assign: (ctx) => {
+    targets.add(ctx);
+    return () => {
+      targets.delete(ctx);
+    };
+  }
+});
+onMount(() => {
+  return register({ draw });
+});
+</script>
+
+<slot/>

package/dist/primitives/Opacity.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        opacity: number;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type OpacityProps = typeof __propDef.props;
+export type OpacityEvents = typeof __propDef.events;
+export type OpacitySlots = typeof __propDef.slots;
+export default class Opacity extends SvelteComponent<OpacityProps, OpacityEvents, OpacitySlots> {
+}
+export {};

package/dist/{extras → primitives}/Rotate.svelte

@@ -1,7 +1,7 @@
-<script>import { setupDrawable } from "../drawable";
+<script>import { setupDrawable } from "../drawable.js";
 import { onMount } from "svelte";
 export let centered = false;
-export let degrees = 0;
+export let degrees;
 const targets = /* @__PURE__ */ new Set();
 const draw = function({ width, height, ctx }, { x, y, w, h }) {
   ctx.translate(x, y);

package/dist/{extras → primitives}/Rotate.svelte.d.ts

@@ -5,7 +5,7 @@ declare const __propDef: {
              * FALSE = ANCHOR TOP LEFT
              * TRUE = ANCHOR CENTER
              */ centered?: boolean | undefined;
-        degrees?: number | undefined;
+        degrees: number;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/primitives/Translate.svelte

@@ -0,0 +1,22 @@
+<script>import { setupDrawable } from "../drawable.js";
+import { onMount } from "svelte";
+export let x;
+export let y;
+const targets = /* @__PURE__ */ new Set();
+const draw = function({ width, height, ctx }, offset) {
+  targets.forEach((f) => f.draw({ width, height, ctx }, { x: offset.x + x, y: offset.y + y }));
+};
+let register = setupDrawable({
+  assign: (ctx) => {
+    targets.add(ctx);
+    return () => {
+      targets.delete(ctx);
+    };
+  }
+});
+onMount(() => {
+  return register({ draw });
+});
+</script>
+
+<slot/>

package/dist/primitives/Translate.svelte.d.ts

@@ -0,0 +1,19 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        x: number;
+        y: number;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type TranslateProps = typeof __propDef.props;
+export type TranslateEvents = typeof __propDef.events;
+export type TranslateSlots = typeof __propDef.slots;
+export default class Translate extends SvelteComponent<TranslateProps, TranslateEvents, TranslateSlots> {
+}
+export {};

package/dist/primitives.d.ts

@@ -0,0 +1,7 @@
+export { default as Empty } from "./primitives/Empty.svelte";
+export { default as Node } from "./primitives/Node.svelte";
+export { default as Area } from "./primitives/Area.svelte";
+export { default as Translate } from "./primitives/Translate.svelte";
+export { default as Inset } from "./primitives/Inset.svelte";
+export { default as Opacity } from "./primitives/Opacity.svelte";
+export { default as Rotate } from "./primitives/Rotate.svelte";

package/dist/primitives.js

@@ -0,0 +1,8 @@
+// BASE
+export { default as Empty } from "./primitives/Empty.svelte";
+export { default as Node } from "./primitives/Node.svelte";
+export { default as Area } from "./primitives/Area.svelte";
+export { default as Translate } from "./primitives/Translate.svelte";
+export { default as Inset } from "./primitives/Inset.svelte";
+export { default as Opacity } from "./primitives/Opacity.svelte";
+export { default as Rotate } from "./primitives/Rotate.svelte";

package/dist/resources.d.ts

@@ -0,0 +1,7 @@
+export { resolve as resolveImage } from "./resources/images.js";
+export { useTileSet, getTile, type TileSet } from "./resources/tileset.js";
+export { resolveBuffer as resolveAudioBuffer } from "./resources/audio.js";
+export { default as AssetPool } from "./resources/AssetPool.svelte";
+export { default as AudioBufferedAsset } from "./resources/AudioBufferedAsset.svelte";
+export { default as AudioMediaAsset } from "./resources/AudioMediaAsset.svelte";
+export { default as ImageAsset } from "./resources/ImageAsset.svelte";

package/dist/resources.js

@@ -0,0 +1,8 @@
+// RESOURCES
+export { resolve as resolveImage } from "./resources/images.js";
+export { useTileSet, getTile } from "./resources/tileset.js";
+export { resolveBuffer as resolveAudioBuffer } from "./resources/audio.js";
+export { default as AssetPool } from "./resources/AssetPool.svelte";
+export { default as AudioBufferedAsset } from "./resources/AudioBufferedAsset.svelte";
+export { default as AudioMediaAsset } from "./resources/AudioMediaAsset.svelte";
+export { default as ImageAsset } from "./resources/ImageAsset.svelte";

package/dist/scenes.d.ts

@@ -0,0 +1,3 @@
+export { changeScene } from "./scenes/scenes.js";
+export { default as SceneSwitcher } from "./scenes/SceneSwitcher.svelte";
+export { default as SceneTransition } from "./scenes/SceneTransition.svelte";

package/dist/scenes.js

@@ -0,0 +1,3 @@
+export { changeScene } from "./scenes/scenes.js";
+export { default as SceneSwitcher } from "./scenes/SceneSwitcher.svelte";
+export { default as SceneTransition } from "./scenes/SceneTransition.svelte";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hi-ashleyj/llama",
   "description": "A (Very Incomplete) 2D Canvas Game Engine powered by Svelte",
-  "version": "0.12.5",
+  "version": "0.13.0",
   "type": "module",
   "scripts": {
     "dev": "vite dev",
@@ -45,6 +45,18 @@
     "./drawables": {
       "types": "./dist/drawables/index.d.ts",
       "svelte": "./dist/drawables/index.js"
+    },
+    "./primitives": {
+      "types": "./dist/primitives/index.d.ts",
+      "svelte": "./dist/primitives/index.js"
+    },
+    "./scenes": {
+      "types": "./dist/scenes.d.ts",
+      "svelte": "./dist/scenes.js"
+    },
+    "./resources": {
+      "types": "./dist/resources.d.ts",
+      "svelte": "./dist/resources.js"
     }
   },
   "types": "./dist/index.d.ts"

package/dist/GameObject.svelte

@@ -1,38 +0,0 @@
-<script>import { setupDrawable } from "./drawable.js";
-import { onMount } from "svelte";
-export let x = 0;
-export let y = 0;
-export let w = 0;
-export let h = 0;
-export let centered = false;
-export let opacity = 1;
-$:
-  ax = centered ? x - w / 2 : x;
-$:
-  ay = centered ? y - h / 2 : y;
-const targets = /* @__PURE__ */ new Set();
-const draw = function({ width, height, ctx }) {
-  if (opacity <= 0)
-    return;
-  if (opacity < 1) {
-    ctx.globalAlpha = opacity;
-  }
-  targets.forEach((f) => f.draw({ width, height, ctx }, { x: ax, y: ay, w, h }));
-  if (opacity < 1) {
-    ctx.globalAlpha = 1;
-  }
-};
-let register = setupDrawable({
-  assign: (ctx) => {
-    targets.add(ctx);
-    return () => {
-      targets.delete(ctx);
-    };
-  }
-});
-onMount(() => {
-  return register({ draw });
-});
-</script>
-
-<slot/>

package/dist/GameObject.svelte.d.ts

@@ -1,26 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        x?: number | undefined;
-        y?: number | undefined;
-        w?: number | undefined;
-        h?: number | undefined;
-        /**
-             * FALSE = ANCHOR TOP LEFT
-             * TRUE = ANCHOR CENTER
-             */ centered?: boolean | undefined;
-        opacity?: number | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type GameObjectProps = typeof __propDef.props;
-export type GameObjectEvents = typeof __propDef.events;
-export type GameObjectSlots = typeof __propDef.slots;
-export default class GameObject extends SvelteComponent<GameObjectProps, GameObjectEvents, GameObjectSlots> {
-}
-export {};