pixi-solid 0.0.10 → 0.0.12

package/dist/index.js

@@ -1,9 +1,35 @@
-import { PixiApplication, usePixiApp } from "./pixi-application.js";
-import { PixiCanvas } from "./pixi-canvas.js";
-import { PIXI_EVENT_NAMES } from "./pixi-events.js";
-import { AnimatedSprite, BitmapText, Container, Graphics, HTMLText, MeshPlane, MeshRope, MeshSimple, NineSliceSprite, ParticleContainer, PerspectiveMesh, RenderContainer, RenderLayer, Sprite, Text, TilingSprite } from "./pixi-components.js";
-import { PixiStage } from "./pixi-stage.js";
-import { useResize } from "./use-resize.js";
-import { useTick, useTicker } from "./use-ticker.js";
-
-export { AnimatedSprite, BitmapText, Container, Graphics, HTMLText, MeshPlane, MeshRope, MeshSimple, NineSliceSprite, PIXI_EVENT_NAMES, ParticleContainer, PerspectiveMesh, PixiApplication, PixiCanvas, PixiStage, RenderContainer, RenderLayer, Sprite, Text, TilingSprite, usePixiApp, useResize, useTick, useTicker };
+import { PixiApplication as r, usePixiApp as t } from "./pixi-application.js";
+import { PixiCanvas as o } from "./pixi-canvas.js";
+import { AnimatedSprite as x, BitmapText as a, Container as s, Graphics as m, HTMLText as S, MeshPlane as P, MeshRope as T, MeshSimple as c, NineSliceSprite as f, ParticleContainer as E, PerspectiveMesh as M, RenderContainer as l, RenderLayer as A, Sprite as N, Text as _, TilingSprite as h } from "./pixi-components.js";
+import { PIXI_EVENT_NAMES as R, PIXI_SOLID_EVENT_HANDLER_NAMES as u } from "./pixi-events.js";
+import { PixiStage as L } from "./pixi-stage.js";
+import { useResize as g } from "./use-resize.js";
+import { useTick as v, useTicker as D } from "./use-ticker.js";
+export {
+  x as AnimatedSprite,
+  a as BitmapText,
+  s as Container,
+  m as Graphics,
+  S as HTMLText,
+  P as MeshPlane,
+  T as MeshRope,
+  c as MeshSimple,
+  f as NineSliceSprite,
+  R as PIXI_EVENT_NAMES,
+  u as PIXI_SOLID_EVENT_HANDLER_NAMES,
+  E as ParticleContainer,
+  M as PerspectiveMesh,
+  r as PixiApplication,
+  o as PixiCanvas,
+  L as PixiStage,
+  l as RenderContainer,
+  A as RenderLayer,
+  N as Sprite,
+  _ as Text,
+  h as TilingSprite,
+  t as usePixiApp,
+  g as useResize,
+  v as useTick,
+  D as useTicker
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/pixi-application.js

@@ -1,70 +1,44 @@
-import { createComponent } from "solid-js/web";
-import { Application } from "pixi.js";
-import { Show, createContext, createEffect, createResource, onCleanup, splitProps, useContext } from "solid-js";
-
-//#region src/pixi-application.tsx
-var PixiAppContext = createContext();
-/**
-* A custom SolidJS hook to access the root PIXI.Application instance.
-* This hook must be called from a component that is a descendant of `PixiApplication`.
-*
-* @returns The PIXI.Application instance provided by the `PixiApplication` component.
-* @throws Will throw an error if used outside of a `PixiApplication` context provider.
-*/
-const usePixiApp = () => {
-	const app = useContext(PixiAppContext);
-	if (!app) throw new Error("usePixiApp must be used within a PixiApplication");
-	return app;
+import { createComponent as i } from "solid-js/web";
+import { Application as c } from "pixi.js";
+import { createContext as a, useContext as s, splitProps as p, createResource as u, createEffect as l, onCleanup as d, Show as f } from "solid-js";
+const n = a(), w = () => {
+  const t = s(n);
+  if (!t)
+    throw new Error("usePixiApp must be used within a PixiApplication");
+  return t;
+}, A = (t) => {
+  const [h, o] = p(t, ["ref", "children"]), [r] = u(async () => {
+    const e = new c();
+    return await e.init({
+      autoDensity: !0,
+      resolution: Math.min(window.devicePixelRatio, 2),
+      sharedTicker: !0,
+      ...o
+    }), e;
+  });
+  return l(() => {
+    const e = r();
+    e && (t.ref && t.ref(e), e.ticker.autoStart = !1, e.ticker.start(), d(() => {
+      e.destroy(!0, {
+        children: !0
+      });
+    }));
+  }), i(f, {
+    get when() {
+      return r();
+    },
+    children: (e) => i(n.Provider, {
+      get value() {
+        return e();
+      },
+      get children() {
+        return t.children;
+      }
+    })
+  });
 };
-/**
-* A SolidJS component that creates and manages a PIXI.Application instance.
-* It provides the application instance through context to be used by child components
-* and custom hooks like `usePixiApp`, `useTick`, and `useTicker`.
-*
-* This component should only be used once in your application.
-*
-* @param props The properties to configure the Pixi.js Application.
-*
-*/
-const PixiApplication = (props) => {
-	const [_solidProps, initialisationProps] = splitProps(props, ["ref", "children"]);
-	const [appResource] = createResource(async () => {
-		const app = new Application();
-		await app.init({
-			autoDensity: true,
-			resolution: Math.min(window.devicePixelRatio, 2),
-			sharedTicker: true,
-			...initialisationProps
-		});
-		return app;
-	});
-	createEffect(() => {
-		const app = appResource();
-		if (app) {
-			if (props.ref) props.ref(app);
-			app.ticker.autoStart = false;
-			app.ticker.start();
-			globalThis.__PIXI_DEVTOOLS__ = { app };
-			onCleanup(() => {
-				app.destroy(true, { children: true });
-			});
-		}
-	});
-	return createComponent(Show, {
-		get when() {
-			return appResource();
-		},
-		children: (app) => createComponent(PixiAppContext.Provider, {
-			get value() {
-				return app();
-			},
-			get children() {
-				return props.children;
-			}
-		})
-	});
+export {
+  A as PixiApplication,
+  w as usePixiApp
 };
-
-//#endregion
-export { PixiApplication, usePixiApp };
-//# sourceMappingURL=pixi-application.js.map
+//# sourceMappingURL=pixi-application.js.map

package/dist/pixi-application.js.map

@@ -1 +1 @@
-{"version":3,"file":"pixi-application.js","names":["ApplicationOptions","Application","JSX","Ref","createContext","createEffect","createResource","onCleanup","Show","splitProps","useContext","PixiAppContext","usePixiApp","app","Error","PixiApplicationProps","Partial","Omit","ref","children","Element","PixiApplication","props","_solidProps","initialisationProps","appResource","init","autoDensity","resolution","Math","min","window","devicePixelRatio","sharedTicker","arg","ticker","autoStart","start","globalThis","__PIXI_DEVTOOLS__","destroy","_$createComponent","when","Provider","value"],"sources":["../src/pixi-application.tsx"],"sourcesContent":["import type { ApplicationOptions } from \"pixi.js\";\nimport { Application } from \"pixi.js\";\nimport type { JSX, Ref } from \"solid-js\";\nimport { createContext, createEffect, createResource, onCleanup, Show, splitProps, useContext } from \"solid-js\";\n\nconst PixiAppContext = createContext<Application>();\n\n/**\n * A custom SolidJS hook to access the root PIXI.Application instance.\n * This hook must be called from a component that is a descendant of `PixiApplication`.\n *\n * @returns The PIXI.Application instance provided by the `PixiApplication` component.\n * @throws Will throw an error if used outside of a `PixiApplication` context provider.\n */\nexport const usePixiApp = () => {\n  const app = useContext(PixiAppContext);\n  if (!app) {\n    throw new Error(\"usePixiApp must be used within a PixiApplication\");\n  }\n  return app;\n};\n\n/**\n * Props for the `PixiApplication` component. It extends the PIXI.ApplicationOptions\n * to allow passing configuration directly to the Pixi.js Application constructor,\n * but omits properties that are handled by the component itself.\n */\nexport type PixiApplicationProps = Partial<Omit<ApplicationOptions, \"children\" | \"resizeTo\" | \"view\">> & {\n  ref?: Ref<Application>;\n  children?: JSX.Element;\n};\n\n/**\n * A SolidJS component that creates and manages a PIXI.Application instance.\n * It provides the application instance through context to be used by child components\n * and custom hooks like `usePixiApp`, `useTick`, and `useTicker`.\n *\n * This component should only be used once in your application.\n *\n * @param props The properties to configure the Pixi.js Application.\n *\n */\nexport const PixiApplication = (props: PixiApplicationProps) => {\n  const [_solidProps, initialisationProps] = splitProps(props, [\"ref\", \"children\"]);\n\n  // TODO: Reinitialise the pixi app if any of the initialisationProps change that we can't set at runtime\n\n  const [appResource] = createResource(async () => {\n    const app = new Application();\n    await app.init({\n      autoDensity: true,\n      resolution: Math.min(window.devicePixelRatio, 2),\n      sharedTicker: true,\n      ...initialisationProps,\n    });\n\n    return app;\n  });\n\n  createEffect(() => {\n    const app = appResource();\n    if (app) {\n      if (props.ref) {\n        // Solid converts the ref prop to a callback function\n        (props.ref as unknown as (arg: any) => void)(app);\n      }\n\n      // TODO: Go through the other props that can be set at runtime and apply them here\n      // e.g. backgroundColor => app.renderer.backgroundColor, etc.\n\n      app.ticker.autoStart = false;\n      app.ticker.start();\n\n      // @ts-expect-error\n      globalThis.__PIXI_DEVTOOLS__ = {\n        app,\n      };\n\n      onCleanup(() => {\n        app.destroy(true, { children: true });\n      });\n    }\n  });\n\n  return (\n    <Show when={appResource()}>\n      {(app) => <PixiAppContext.Provider value={app()}>{props.children}</PixiAppContext.Provider>}\n    </Show>\n  );\n};\n"],"mappings":";;;;;AAKA,IAAMW,iBAAiBP,eAA4B;;;;;;;;AASnD,MAAaQ,mBAAmB;CAC9B,MAAMC,MAAMH,WAAWC,eAAe;AACtC,KAAI,CAACE,IACH,OAAM,IAAIC,MAAM,mDAAmD;AAErE,QAAOD;;;;;;;;;;;;AAuBT,MAAaQ,mBAAmBC,UAAgC;CAC9D,MAAM,CAACC,aAAaC,uBAAuBf,WAAWa,OAAO,CAAC,OAAO,WAAW,CAAC;CAIjF,MAAM,CAACG,eAAenB,eAAe,YAAY;EAC/C,MAAMO,MAAM,IAAIZ,aAAa;AAC7B,QAAMY,IAAIa,KAAK;GACbC,aAAa;GACbC,YAAYC,KAAKC,IAAIC,OAAOC,kBAAkB,EAAE;GAChDC,cAAc;GACd,GAAGT;GACJ,CAAC;AAEF,SAAOX;GACP;AAEFR,oBAAmB;EACjB,MAAMQ,MAAMY,aAAa;AACzB,MAAIZ,KAAK;AACP,OAAIS,MAAMJ,IAEPI,OAAMJ,IAAsCL,IAAI;AAMnDA,OAAIsB,OAAOC,YAAY;AACvBvB,OAAIsB,OAAOE,OAAO;AAGlBC,cAAWC,oBAAoB,EAC7B1B,KACD;AAEDN,mBAAgB;AACdM,QAAI2B,QAAQ,MAAM,EAAErB,UAAU,MAAM,CAAC;KACrC;;GAEJ;AAEF,QAAAsB,gBACGjC,MAAI;EAAA,IAACkC,OAAI;AAAA,UAAEjB,aAAa;;EAAAN,WACrBN,QAAG4B,gBAAM9B,eAAegC,UAAQ;GAAA,IAACC,QAAK;AAAA,WAAE/B,KAAK;;GAAA,IAAAM,WAAA;AAAA,WAAGG,MAAMH;;GAAQ,CAAA;EAA2B,CAAA"}
+{"version":3,"file":"pixi-application.js","sources":["../src/pixi-application.tsx"],"sourcesContent":["import type { ApplicationOptions } from \"pixi.js\";\nimport { Application } from \"pixi.js\";\nimport type { JSX, Ref } from \"solid-js\";\nimport { createContext, createEffect, createResource, onCleanup, Show, splitProps, useContext } from \"solid-js\";\n\nconst PixiAppContext = createContext<Application>();\n\n/**\n * A custom SolidJS hook to access the root PIXI.Application instance.\n * This hook must be called from a component that is a descendant of `PixiApplication`.\n *\n * @returns The PIXI.Application instance provided by the `PixiApplication` component.\n * @throws Will throw an error if used outside of a `PixiApplication` context provider.\n */\nexport const usePixiApp = () => {\n  const app = useContext(PixiAppContext);\n  if (!app) {\n    throw new Error(\"usePixiApp must be used within a PixiApplication\");\n  }\n  return app;\n};\n\n/**\n * Props for the `PixiApplication` component. It extends the PIXI.ApplicationOptions\n * to allow passing configuration directly to the Pixi.js Application constructor,\n * but omits properties that are handled by the component itself.\n */\nexport type PixiApplicationProps = Partial<Omit<ApplicationOptions, \"children\" | \"resizeTo\">> & {\n  ref?: Ref<Application>;\n  children?: JSX.Element;\n};\n\n/**\n * A SolidJS component that creates and manages a PIXI.Application instance.\n * It provides the application instance through context to be used by child components\n * and custom hooks like `usePixiApp`, `useTick`, and `useTicker`.\n *\n * This component should only be used once in your application.\n *\n * @param props The properties to configure the Pixi.js Application.\n *\n */\nexport const PixiApplication = (props: PixiApplicationProps) => {\n  const [_solidProps, initialisationProps] = splitProps(props, [\"ref\", \"children\"]);\n\n  // TODO: Split props into initialisation props and runtime props\n\n  const [appResource] = createResource(async () => {\n    const app = new Application();\n    await app.init({\n      autoDensity: true,\n      resolution: Math.min(window.devicePixelRatio, 2),\n      sharedTicker: true,\n      ...initialisationProps,\n    });\n\n    return app;\n  });\n\n  createEffect(() => {\n    const app = appResource();\n    if (app) {\n      if (props.ref) {\n        // Solid converts the ref prop to a callback function\n        (props.ref as unknown as (arg: any) => void)(app);\n      }\n\n      // TODO: Go through the other props that can be set at runtime and apply them here\n      // e.g. backgroundColor => app.renderer.backgroundColor, etc.\n\n      app.ticker.autoStart = false;\n      app.ticker.start();\n\n      onCleanup(() => {\n        app.destroy(true, { children: true });\n      });\n    }\n  });\n\n  return (\n    <Show when={appResource()}>\n      {(app) => <PixiAppContext.Provider value={app()}>{props.children}</PixiAppContext.Provider>}\n    </Show>\n  );\n};\n"],"names":["PixiAppContext","createContext","usePixiApp","app","useContext","Error","PixiApplication","props","_solidProps","initialisationProps","splitProps","appResource","createResource","Application","init","autoDensity","resolution","Math","min","window","devicePixelRatio","sharedTicker","createEffect","ref","ticker","autoStart","start","onCleanup","destroy","children","_$createComponent","Show","when","Provider","value"],"mappings":";;;AAKA,MAAMA,IAAiBC,EAAAA,GASVC,IAAaA,MAAM;AAC9B,QAAMC,IAAMC,EAAWJ,CAAc;AACrC,MAAI,CAACG;AACH,UAAM,IAAIE,MAAM,kDAAkD;AAEpE,SAAOF;AACT,GAsBaG,IAAkBA,CAACC,MAAgC;AAC9D,QAAM,CAACC,GAAaC,CAAmB,IAAIC,EAAWH,GAAO,CAAC,OAAO,UAAU,CAAC,GAI1E,CAACI,CAAW,IAAIC,EAAe,YAAY;AAC/C,UAAMT,IAAM,IAAIU,EAAAA;AAChB,iBAAMV,EAAIW,KAAK;AAAA,MACbC,aAAa;AAAA,MACbC,YAAYC,KAAKC,IAAIC,OAAOC,kBAAkB,CAAC;AAAA,MAC/CC,cAAc;AAAA,MACd,GAAGZ;AAAAA,IAAAA,CACJ,GAEMN;AAAAA,EACT,CAAC;AAEDmB,SAAAA,EAAa,MAAM;AACjB,UAAMnB,IAAMQ,EAAAA;AACZ,IAAIR,MACEI,EAAMgB,OAEPhB,EAAMgB,IAAsCpB,CAAG,GAMlDA,EAAIqB,OAAOC,YAAY,IACvBtB,EAAIqB,OAAOE,MAAAA,GAEXC,EAAU,MAAM;AACdxB,MAAAA,EAAIyB,QAAQ,IAAM;AAAA,QAAEC,UAAU;AAAA,MAAA,CAAM;AAAA,IACtC,CAAC;AAAA,EAEL,CAAC,GAEDC,EACGC,GAAI;AAAA,IAAA,IAACC,OAAI;AAAA,aAAErB,EAAAA;AAAAA,IAAa;AAAA,IAAAkB,UACrB1B,CAAAA,MAAG2B,EAAM9B,EAAeiC,UAAQ;AAAA,MAAA,IAACC,QAAK;AAAA,eAAE/B,EAAAA;AAAAA,MAAK;AAAA,MAAA,IAAA0B,WAAA;AAAA,eAAGtB,EAAMsB;AAAAA,MAAQ;AAAA,IAAA,CAAA;AAAA,EAAA,CAA2B;AAGjG;"}

package/dist/pixi-canvas.js

@@ -1,64 +1,35 @@
-import { usePixiApp } from "./pixi-application.js";
-import { className, effect, insert, style, template, use } from "solid-js/web";
-import { createRenderEffect, onCleanup, onMount } from "solid-js";
-
-//#region src/pixi-canvas.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div>`);
-/**
-* PixiCanvas
-*
-* A small wrapper that mounts the PIXI application's canvas element into the DOM
-* and automatically resizes it.
-*
-* - Requires a surrounding `PixiApplication` component.
-* - Requires a `PixiStage` component as a child.
-*
-* Props:
-* @param props.children - JSX content to render inside the canvas wrapper. Use `PixiStage` as the only child.
-*/
-const PixiCanvas = (props) => {
-	let canvasWrapElement;
-	const pixiApp = usePixiApp();
-	pixiApp.canvas.style.display = "block";
-	createRenderEffect(() => {
-		if (props.children === void 0) throw new Error("PixiCanvas requires the `PixiStage` component to render.");
-	});
-	let previousResizeTo;
-	let resizeObserver;
-	onMount(() => {
-		if (!canvasWrapElement) return;
-		previousResizeTo = pixiApp.resizeTo;
-		pixiApp.resizeTo = canvasWrapElement;
-		pixiApp.queueResize();
-		resizeObserver = new ResizeObserver(() => {
-			pixiApp.queueResize();
-		});
-		resizeObserver.observe(canvasWrapElement);
-	});
-	onCleanup(() => {
-		if (!canvasWrapElement) return;
-		pixiApp.resizeTo = previousResizeTo;
-		resizeObserver?.disconnect();
-		resizeObserver = void 0;
-	});
-	return (() => {
-		var _el$ = _tmpl$();
-		var _ref$ = canvasWrapElement;
-		typeof _ref$ === "function" ? use(_ref$, _el$) : canvasWrapElement = _el$;
-		insert(_el$, () => pixiApp.canvas);
-		effect((_p$) => {
-			var _v$ = { ...typeof props.style === "object" ? props.style : {} }, _v$2 = props.className;
-			_p$.e = style(_el$, _v$, _p$.e);
-			_v$2 !== _p$.t && className(_el$, _p$.t = _v$2);
-			return _p$;
-		}, {
-			e: void 0,
-			t: void 0
-		});
-		return _el$;
-	})();
+import { template as l, insert as u, effect as f, style as m, className as d, use as p } from "solid-js/web";
+import { createRenderEffect as z, onMount as y, onCleanup as x } from "solid-js";
+import { usePixiApp as b } from "./pixi-application.js";
+var R = /* @__PURE__ */ l("<div>");
+const q = (o) => {
+  let r;
+  const e = b();
+  e.canvas.style.display = "block", z(() => {
+    if (o.children === void 0)
+      throw new Error("PixiCanvas requires the `PixiStage` component to render.");
+  });
+  let n, s;
+  return y(() => {
+    r && (n = e.resizeTo, e.resizeTo = r, e.queueResize(), s = new ResizeObserver(() => {
+      e.queueResize();
+    }), s.observe(r));
+  }), x(() => {
+    r && (e.resizeTo = n, s?.disconnect(), s = void 0);
+  }), (() => {
+    var t = R(), a = r;
+    return typeof a == "function" ? p(a, t) : r = t, u(t, () => e.canvas), f((i) => {
+      var c = {
+        ...typeof o.style == "object" ? o.style : {}
+      }, v = o.className;
+      return i.e = m(t, c, i.e), v !== i.t && d(t, i.t = v), i;
+    }, {
+      e: void 0,
+      t: void 0
+    }), t;
+  })();
 };
-
-//#endregion
-export { PixiCanvas };
-//# sourceMappingURL=pixi-canvas.js.map
+export {
+  q as PixiCanvas
+};
+//# sourceMappingURL=pixi-canvas.js.map

package/dist/pixi-canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"pixi-canvas.js","names":["JSX","createRenderEffect","onCleanup","onMount","usePixiApp","PixiCanvas","props","children","Element","style","CSSProperties","className","canvasWrapElement","HTMLDivElement","pixiApp","canvas","display","undefined","Error","previousResizeTo","resizeTo","resizeObserver","ResizeObserver","queueResize","observe","disconnect","_el$","_tmpl$","_ref$","_$use","_$insert","_$effect","_p$","_v$","_v$2","e","_$style","t","_$className"],"sources":["../src/pixi-canvas.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { createRenderEffect, onCleanup, onMount } from \"solid-js\";\nimport { usePixiApp } from \"./pixi-application\";\n\n/**\n * PixiCanvas\n *\n * A small wrapper that mounts the PIXI application's canvas element into the DOM\n * and automatically resizes it.\n *\n * - Requires a surrounding `PixiApplication` component.\n * - Requires a `PixiStage` component as a child.\n *\n * Props:\n * @param props.children - JSX content to render inside the canvas wrapper. Use `PixiStage` as the only child.\n */\n\nexport const PixiCanvas = (props: {\n  children: JSX.Element;\n  style?: JSX.CSSProperties | undefined;\n  className?: string;\n}): JSX.Element => {\n  let canvasWrapElement: HTMLDivElement | undefined;\n\n  const pixiApp = usePixiApp();\n  pixiApp.canvas.style.display = \"block\";\n\n  createRenderEffect(() => {\n    if (props.children === undefined) {\n      throw new Error(\"PixiCanvas requires the `PixiStage` component to render.\");\n    }\n  });\n\n  let previousResizeTo: typeof pixiApp.resizeTo;\n  let resizeObserver: ResizeObserver | undefined;\n\n  onMount(() => {\n    if (!canvasWrapElement) return;\n    previousResizeTo = pixiApp.resizeTo;\n    pixiApp.resizeTo = canvasWrapElement;\n    pixiApp.queueResize();\n    resizeObserver = new ResizeObserver(() => {\n      pixiApp.queueResize();\n    });\n    resizeObserver.observe(canvasWrapElement);\n  });\n\n  onCleanup(() => {\n    if (!canvasWrapElement) return;\n    pixiApp.resizeTo = previousResizeTo;\n    resizeObserver?.disconnect();\n    resizeObserver = undefined;\n  });\n\n  return (\n    <div\n      ref={canvasWrapElement}\n      style={{\n        ...(typeof props.style === \"object\" ? props.style : {}),\n      }}\n      class={props.className}\n    >\n      {pixiApp.canvas}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,MAAaK,cAAcC,UAIR;CACjB,IAAIM;CAEJ,MAAME,UAAUV,YAAY;AAC5BU,SAAQC,OAAON,MAAMO,UAAU;AAE/Bf,0BAAyB;AACvB,MAAIK,MAAMC,aAAaU,OACrB,OAAM,IAAIC,MAAM,2DAA2D;GAE7E;CAEF,IAAIC;CACJ,IAAIE;AAEJlB,eAAc;AACZ,MAAI,CAACS,kBAAmB;AACxBO,qBAAmBL,QAAQM;AAC3BN,UAAQM,WAAWR;AACnBE,UAAQS,aAAa;AACrBF,mBAAiB,IAAIC,qBAAqB;AACxCR,WAAQS,aAAa;IACrB;AACFF,iBAAeG,QAAQZ,kBAAkB;GACzC;AAEFV,iBAAgB;AACd,MAAI,CAACU,kBAAmB;AACxBE,UAAQM,WAAWD;AACnBE,kBAAgBI,YAAY;AAC5BJ,mBAAiBJ;GACjB;AAEF,eAAA;EAAA,IAAAS,OAAAC,QAAA;EAAA,IAAAC,QAEShB;AAAiB,SAAAgB,UAAA,aAAAC,IAAAD,OAAAF,KAAA,GAAjBd,oBAAiBc;AAAAI,SAAAJ,YAMrBZ,QAAQC,OAAM;AAAAgB,UAAAC,QAAA;GAAA,IAAAC,MALR,EACL,GAAI,OAAO3B,MAAMG,UAAU,WAAWH,MAAMG,QAAQ,EAAE,EACvD,EAAAyB,OACM5B,MAAMK;AAASqB,OAAAG,IAAAC,MAAAV,MAAAO,KAAAD,IAAAG,EAAA;AAAAD,YAAAF,IAAAK,KAAAC,UAAAZ,MAAAM,IAAAK,IAAAH,KAAA;AAAA,UAAAF;KAAA;GAAAG,GAAAlB;GAAAoB,GAAApB;GAAA,CAAA;AAAA,SAAAS;KAAA"}
+{"version":3,"file":"pixi-canvas.js","sources":["../src/pixi-canvas.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { createRenderEffect, onCleanup, onMount } from \"solid-js\";\nimport { usePixiApp } from \"./pixi-application\";\n\n/**\n * PixiCanvas\n *\n * A small wrapper that mounts the PIXI application's canvas element into the DOM\n * and automatically resizes it.\n *\n * - Requires a surrounding `PixiApplication` component.\n * - Requires a `PixiStage` component as a child.\n *\n * Props:\n * @param props.children - JSX content to render inside the canvas wrapper. Use `PixiStage` as the only child.\n */\n\nexport const PixiCanvas = (props: {\n  children: JSX.Element;\n  style?: JSX.CSSProperties | undefined;\n  className?: string;\n}): JSX.Element => {\n  let canvasWrapElement: HTMLDivElement | undefined;\n\n  const pixiApp = usePixiApp();\n  pixiApp.canvas.style.display = \"block\";\n\n  createRenderEffect(() => {\n    if (props.children === undefined) {\n      throw new Error(\"PixiCanvas requires the `PixiStage` component to render.\");\n    }\n  });\n\n  let previousResizeTo: typeof pixiApp.resizeTo;\n  let resizeObserver: ResizeObserver | undefined;\n\n  onMount(() => {\n    if (!canvasWrapElement) return;\n    previousResizeTo = pixiApp.resizeTo;\n    pixiApp.resizeTo = canvasWrapElement;\n    pixiApp.queueResize();\n    resizeObserver = new ResizeObserver(() => {\n      pixiApp.queueResize();\n    });\n    resizeObserver.observe(canvasWrapElement);\n  });\n\n  onCleanup(() => {\n    if (!canvasWrapElement) return;\n    pixiApp.resizeTo = previousResizeTo;\n    resizeObserver?.disconnect();\n    resizeObserver = undefined;\n  });\n\n  return (\n    <div\n      ref={canvasWrapElement}\n      style={{\n        ...(typeof props.style === \"object\" ? props.style : {}),\n      }}\n      class={props.className}\n    >\n      {pixiApp.canvas}\n    </div>\n  );\n};\n"],"names":["PixiCanvas","props","canvasWrapElement","pixiApp","usePixiApp","canvas","style","display","createRenderEffect","children","undefined","Error","previousResizeTo","resizeObserver","onMount","resizeTo","queueResize","ResizeObserver","observe","onCleanup","disconnect","_el$","_tmpl$","_ref$","_$use","_$insert","_$effect","_p$","_v$","_v$2","className","e","_$style","t","_$className"],"mappings":";;;;AAiBO,MAAMA,IAAaA,CAACC,MAIR;AACjB,MAAIC;AAEJ,QAAMC,IAAUC,EAAAA;AAChBD,EAAAA,EAAQE,OAAOC,MAAMC,UAAU,SAE/BC,EAAmB,MAAM;AACvB,QAAIP,EAAMQ,aAAaC;AACrB,YAAM,IAAIC,MAAM,0DAA0D;AAAA,EAE9E,CAAC;AAED,MAAIC,GACAC;AAEJC,SAAAA,EAAQ,MAAM;AACZ,IAAKZ,MACLU,IAAmBT,EAAQY,UAC3BZ,EAAQY,WAAWb,GACnBC,EAAQa,YAAAA,GACRH,IAAiB,IAAII,eAAe,MAAM;AACxCd,MAAAA,EAAQa,YAAAA;AAAAA,IACV,CAAC,GACDH,EAAeK,QAAQhB,CAAiB;AAAA,EAC1C,CAAC,GAEDiB,EAAU,MAAM;AACd,IAAKjB,MACLC,EAAQY,WAAWH,GACnBC,GAAgBO,WAAAA,GAChBP,IAAiBH;AAAAA,EACnB,CAAC,IAED,MAAA;AAAA,QAAAW,IAAAC,EAAAA,GAAAC,IAESrB;AAAiB,kBAAAqB,KAAA,aAAAC,EAAAD,GAAAF,CAAA,IAAjBnB,IAAiBmB,GAAAI,EAAAJ,GAAA,MAMrBlB,EAAQE,MAAM,GAAAqB,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IALR;AAAA,QACL,GAAI,OAAO3B,EAAMK,SAAU,WAAWL,EAAMK,QAAQ,CAAA;AAAA,MAAC,GACtDuB,IACM5B,EAAM6B;AAASH,aAAAA,EAAAI,IAAAC,EAAAX,GAAAO,GAAAD,EAAAI,CAAA,GAAAF,MAAAF,EAAAM,KAAAC,EAAAb,GAAAM,EAAAM,IAAAJ,CAAA,GAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAI,GAAArB;AAAAA,MAAAuB,GAAAvB;AAAAA,IAAAA,CAAA,GAAAW;AAAAA,EAAA,GAAA;AAK5B;"}

package/dist/pixi-components.js

@@ -1,118 +1,49 @@
-import { PIXI_EVENT_HANDLER_NAMES } from "./pixi-events.js";
-import { insert, setProp } from "./renderer.js";
-import { AnimatedSprite, BitmapText, Container, Graphics, HTMLText, MeshPlane, MeshRope, MeshSimple, NineSliceSprite, ParticleContainer, PerspectiveMesh, RenderContainer, RenderLayer, Sprite, Text, TilingSprite } from "pixi.js";
-import { createRenderEffect, splitProps } from "solid-js";
-
-//#region src/pixi-components.tsx
-const SOLID_PROP_KEYS = [
-	"ref",
-	"as",
-	"children"
-];
-/**
-* Apply's the props to a Pixi instance with subsriptions to maintain reactivity.
-*
-* @param instance The Pixi instance we want to apply props to.
-* @param props The props object.
-*/
-const applyProps = (instance, props) => {
-	for (const key in props) {
-		if (key === "as") continue;
-		if (key === "ref") createRenderEffect(() => {
-			props[key](instance);
-		});
-		else if (key === "children") {
-			if (!("addChild" in instance)) throw new Error(`Cannot set children on non-container instance.`);
-			createRenderEffect(() => {
-				insert(instance, () => props.children);
-			});
-		} else createRenderEffect(() => {
-			setProp(instance, key, props[key]);
-		});
-	}
+import { RenderContainer as l, RenderLayer as S, AnimatedSprite as h, BitmapText as m, Container as P, Graphics as d, HTMLText as M, MeshPlane as T, MeshRope as $, MeshSimple as f, NineSliceSprite as C, ParticleContainer as R, PerspectiveMesh as x, Sprite as L, Text as u, TilingSprite as E } from "pixi.js";
+import { splitProps as N, createRenderEffect as s, on as _ } from "solid-js";
+import { PIXI_SOLID_EVENT_HANDLER_NAMES as y } from "./pixi-events.js";
+import { insert as A, setProp as c } from "./renderer.js";
+const H = ["ref", "as", "children"], p = (i, n, r) => {
+  for (const t in n)
+    if (t !== "as")
+      if (t === "ref")
+        s(() => {
+          n[t](i);
+        });
+      else if (t === "children") {
+        if (!("addChild" in i))
+          throw new Error("Cannot set children on non-container instance.");
+        s(() => {
+          A(i, () => n.children);
+        });
+      } else r ? s(_(() => n[t], () => {
+        c(i, t, n[t]);
+      }, {
+        defer: r
+      })) : s(() => {
+        c(i, t, n[t]);
+      });
+}, o = (i) => (n) => {
+  const [r, t] = N(n, [...H, ...y]), a = n.as || new i(t);
+  return p(a, t, !0), p(a, r), a;
+}, e = (i) => (n) => o(i)(n), B = e(h), D = e(m), G = o(P), O = e(d), k = e(M), K = e(T), V = e($), X = e(f), Y = e(C), b = e(R), j = e(x), q = o(l), z = o(S), F = e(L), J = e(u), Q = e(E);
+export {
+  B as AnimatedSprite,
+  D as BitmapText,
+  G as Container,
+  O as Graphics,
+  k as HTMLText,
+  K as MeshPlane,
+  V as MeshRope,
+  X as MeshSimple,
+  Y as NineSliceSprite,
+  b as ParticleContainer,
+  j as PerspectiveMesh,
+  q as RenderContainer,
+  z as RenderLayer,
+  H as SOLID_PROP_KEYS,
+  F as Sprite,
+  J as Text,
+  Q as TilingSprite,
+  p as applyProps
 };
-var createContainerComponent = (PixiClass) => {
-	return (props) => {
-		const [runtimeProps, initialisationProps] = splitProps(props, [...SOLID_PROP_KEYS, ...PIXI_EVENT_HANDLER_NAMES]);
-		const instance = props.as || new PixiClass(initialisationProps);
-		applyProps(instance, initialisationProps);
-		applyProps(instance, runtimeProps);
-		return instance;
-	};
-};
-var createLeafComponent = (PixiClass) => {
-	return (props) => {
-		return createContainerComponent(PixiClass)(props);
-	};
-};
-/**
-* A SolidJS component that renders a `PIXI.AnimatedSprite`.
-*/
-const AnimatedSprite$1 = createLeafComponent(AnimatedSprite);
-/**
-* A SolidJS component that renders a `PIXI.BitmapText`.
-*/
-const BitmapText$1 = createLeafComponent(BitmapText);
-/**
-* A SolidJS component that renders a `PIXI.Container`.
-*/
-const Container$1 = createContainerComponent(Container);
-/**
-* A SolidJS component that renders a `PIXI.Graphics`.
-* Use a ref to access the underlying graphics instance and draw with it.
-*/
-const Graphics$1 = createLeafComponent(Graphics);
-/**
-* A SolidJS component that renders a `PIXI.HTMLText`.
-*/
-const HTMLText$1 = createLeafComponent(HTMLText);
-/**
-* A SolidJS component that renders a `PIXI.MeshPlane`.
-*/
-const MeshPlane$1 = createLeafComponent(MeshPlane);
-/**
-* A SolidJS component that renders a `PIXI.MeshRope`.
-*/
-const MeshRope$1 = createLeafComponent(MeshRope);
-/**
-* A SolidJS component that renders a `PIXI.MeshSimple`.
-*/
-const MeshSimple$1 = createLeafComponent(MeshSimple);
-/**
-* A SolidJS component that renders a `PIXI.NineSliceSprite`.
-*/
-const NineSliceSprite$1 = createLeafComponent(NineSliceSprite);
-/**
-* A SolidJS component that renders a `PIXI.ParticleContainer`.
-*
-* Particles should be added and removed from this component imperatively. Please see the docs for a reference example.
-*/
-const ParticleContainer$1 = createLeafComponent(ParticleContainer);
-/**
-* A SolidJS component that renders a `PIXI.PerspectiveMesh`.
-*/
-const PerspectiveMesh$1 = createLeafComponent(PerspectiveMesh);
-/**
-* A SolidJS component that renders a `PIXI.RenderContainer`.
-*/
-const RenderContainer$1 = createContainerComponent(RenderContainer);
-/**
-* A SolidJS component that renders a `PIXI.RenderLayer`.
-*/
-const RenderLayer$1 = createContainerComponent(RenderLayer);
-/**
-* A SolidJS component that renders a `PIXI.Sprite`.
-*/
-const Sprite$1 = createLeafComponent(Sprite);
-/**
-* A SolidJS component that renders a `PIXI.Text`.
-*/
-const Text$1 = createLeafComponent(Text);
-/**
-* A SolidJS component that renders a `PIXI.TilingSprite`.
-*/
-const TilingSprite$1 = createLeafComponent(TilingSprite);
-
-//#endregion
-export { AnimatedSprite$1 as AnimatedSprite, BitmapText$1 as BitmapText, Container$1 as Container, Graphics$1 as Graphics, HTMLText$1 as HTMLText, MeshPlane$1 as MeshPlane, MeshRope$1 as MeshRope, MeshSimple$1 as MeshSimple, NineSliceSprite$1 as NineSliceSprite, ParticleContainer$1 as ParticleContainer, PerspectiveMesh$1 as PerspectiveMesh, RenderContainer$1 as RenderContainer, RenderLayer$1 as RenderLayer, Sprite$1 as Sprite, Text$1 as Text, TilingSprite$1 as TilingSprite, applyProps };
-//# sourceMappingURL=pixi-components.js.map
+//# sourceMappingURL=pixi-components.js.map

package/dist/pixi-components.js.map

@@ -1 +1 @@
-{"version":3,"file":"pixi-components.js","names":["Pixi","AnimatedSprite","PixiAnimatedSprite","BitmapText","PixiBitmapText","Container","PixiContainer","Graphics","PixiGraphics","HTMLText","PixiHTMLText","MeshPlane","PixiMeshPlane","MeshRope","PixiMeshRope","MeshSimple","PixiMeshSimple","NineSliceSprite","PixiNineSliceSprite","ParticleContainer","PixiParticleContainer","PerspectiveMesh","PixiPerspectiveMesh","RenderContainer","PixiRenderContainer","RenderLayer","PixiRenderLayer","Sprite","PixiSprite","Text","PixiText","TilingSprite","PixiTilingSprite","JSX","Ref","createRenderEffect","splitProps","PixiEventHandlerMap","PIXI_EVENT_HANDLER_NAMES","insert","setProp","ContainerProps","ref","Component","as","children","Element","LeafProps","Omit","SOLID_PROP_KEYS","const","applyProps","InstanceType","instance","props","OptionsType","key","arg","Error","createContainerComponent","PixiClass","runtimeProps","initialisationProps","createLeafComponent","AnimatedSpriteOptions","ConstructorParameters","ContainerOptions","GraphicsOptions","HTMLTextOptions","MeshPlaneOptions","MeshRopeOptions","SimpleMeshOptions","NineSliceSpriteOptions","ParticleContainerOptions","PerspectivePlaneOptions","RenderContainerOptions","RenderLayerOptions","SpriteOptions","CanvasTextOptions","TilingSpriteOptions"],"sources":["../src/pixi-components.tsx"],"sourcesContent":["import type * as Pixi from \"pixi.js\";\nimport {\n  AnimatedSprite as PixiAnimatedSprite,\n  BitmapText as PixiBitmapText,\n  Container as PixiContainer,\n  Graphics as PixiGraphics,\n  HTMLText as PixiHTMLText,\n  MeshPlane as PixiMeshPlane,\n  MeshRope as PixiMeshRope,\n  MeshSimple as PixiMeshSimple,\n  NineSliceSprite as PixiNineSliceSprite,\n  ParticleContainer as PixiParticleContainer,\n  PerspectiveMesh as PixiPerspectiveMesh,\n  RenderContainer as PixiRenderContainer,\n  RenderLayer as PixiRenderLayer,\n  Sprite as PixiSprite,\n  Text as PixiText,\n  TilingSprite as PixiTilingSprite,\n} from \"pixi.js\";\nimport type { JSX, Ref } from \"solid-js\";\nimport { createRenderEffect, splitProps } from \"solid-js\";\nimport type { PixiEventHandlerMap } from \"./pixi-events\";\n\nimport { PIXI_EVENT_HANDLER_NAMES } from \"./pixi-events\";\nimport { insert, setProp } from \"./renderer\";\n\n/**\n * Prop definition for components that CAN have children\n */\nexport type ContainerProps<Component> = PixiEventHandlerMap & {\n  ref?: Ref<Component>;\n  as?: Component;\n  children?: JSX.Element;\n};\n\n/**\n * Prop definition for components that CANNOT have children\n */\nexport type LeafProps<Component> = Omit<ContainerProps<Component>, \"children\">;\n\n// Keys that are specific to Solid components and not Pixi props\nexport const SOLID_PROP_KEYS = [\"ref\", \"as\", \"children\"] as const;\n\n/**\n * Apply's the props to a Pixi instance with subsriptions to maintain reactivity.\n *\n * @param instance The Pixi instance we want to apply props to.\n * @param props The props object.\n */\nexport const applyProps = <InstanceType extends PixiContainer, OptionsType extends ContainerProps<InstanceType>>(\n  instance: InstanceType,\n  props: OptionsType\n) => {\n  for (const key in props) {\n    if (key === \"as\") continue;\n\n    if (key === \"ref\") {\n      createRenderEffect(() => {\n        // Solid converts the ref prop to a callback function\n        (props[key] as unknown as (arg: any) => void)(instance);\n      });\n    } else if (key === \"children\") {\n      if (!(\"addChild\" in instance)) {\n        throw new Error(`Cannot set children on non-container instance.`);\n      }\n      createRenderEffect(() => {\n        insert(instance, () => props.children);\n      });\n    } else {\n      createRenderEffect(() => {\n        setProp(instance, key, props[key as keyof typeof props]);\n      });\n    }\n  }\n};\n\nconst createContainerComponent = <InstanceType extends PixiContainer, OptionsType extends object>(\n  PixiClass: new (props: OptionsType) => InstanceType\n) => {\n  return (props: Omit<OptionsType, \"children\"> & ContainerProps<InstanceType>): JSX.Element => {\n    const [runtimeProps, initialisationProps] = splitProps(props, [...SOLID_PROP_KEYS, ...PIXI_EVENT_HANDLER_NAMES]);\n\n    const instance = props.as || new PixiClass(initialisationProps as any);\n\n    applyProps(instance, initialisationProps);\n    applyProps(instance, runtimeProps);\n\n    return instance as unknown as JSX.Element;\n  };\n};\n\nconst createLeafComponent = <InstanceType extends PixiContainer, OptionsType extends object>(\n  PixiClass: new (props: OptionsType) => InstanceType\n) => {\n  return (props: Omit<OptionsType, \"children\"> & LeafProps<InstanceType>): JSX.Element => {\n    return createContainerComponent<PixiContainer, OptionsType>(PixiClass)(props as any);\n  };\n};\n\n/**\n * A SolidJS component that renders a `PIXI.AnimatedSprite`.\n */\nexport const AnimatedSprite = createLeafComponent<PixiAnimatedSprite, Pixi.AnimatedSpriteOptions>(PixiAnimatedSprite);\n/**\n * A SolidJS component that renders a `PIXI.BitmapText`.\n */\nexport const BitmapText = createLeafComponent<PixiBitmapText, ConstructorParameters<typeof PixiBitmapText>>(\n  PixiBitmapText\n);\n/**\n * A SolidJS component that renders a `PIXI.Container`.\n */\nexport const Container = createContainerComponent<PixiContainer, Pixi.ContainerOptions>(PixiContainer);\n/**\n * A SolidJS component that renders a `PIXI.Graphics`.\n * Use a ref to access the underlying graphics instance and draw with it.\n */\nexport const Graphics = createLeafComponent<PixiGraphics, Pixi.GraphicsOptions>(PixiGraphics);\n/**\n * A SolidJS component that renders a `PIXI.HTMLText`.\n */\nexport const HTMLText = createLeafComponent<PixiHTMLText, Pixi.HTMLTextOptions>(PixiHTMLText);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshPlane`.\n */\nexport const MeshPlane = createLeafComponent<PixiMeshPlane, Pixi.MeshPlaneOptions>(PixiMeshPlane);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshRope`.\n */\nexport const MeshRope = createLeafComponent<PixiMeshRope, Pixi.MeshRopeOptions>(PixiMeshRope);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshSimple`.\n */\nexport const MeshSimple = createLeafComponent<PixiMeshSimple, Pixi.SimpleMeshOptions>(PixiMeshSimple);\n\n/**\n * A SolidJS component that renders a `PIXI.NineSliceSprite`.\n */\nexport const NineSliceSprite = createLeafComponent<PixiNineSliceSprite, Pixi.NineSliceSpriteOptions>(\n  PixiNineSliceSprite\n);\n\n/**\n * A SolidJS component that renders a `PIXI.ParticleContainer`.\n *\n * Particles should be added and removed from this component imperatively. Please see the docs for a reference example.\n */\nexport const ParticleContainer = createLeafComponent<PixiParticleContainer, Pixi.ParticleContainerOptions>(\n  PixiParticleContainer\n);\n\n/**\n * A SolidJS component that renders a `PIXI.PerspectiveMesh`.\n */\nexport const PerspectiveMesh = createLeafComponent<PixiPerspectiveMesh, Pixi.PerspectivePlaneOptions>(\n  PixiPerspectiveMesh\n);\n\n/**\n * A SolidJS component that renders a `PIXI.RenderContainer`.\n */\nexport const RenderContainer = createContainerComponent<PixiRenderContainer, Pixi.RenderContainerOptions>(\n  PixiRenderContainer\n);\n\n/**\n * A SolidJS component that renders a `PIXI.RenderLayer`.\n */\nexport const RenderLayer = createContainerComponent<PixiRenderLayer, Pixi.RenderLayerOptions>(PixiRenderLayer);\n\n/**\n * A SolidJS component that renders a `PIXI.Sprite`.\n */\nexport const Sprite = createLeafComponent<PixiSprite, Pixi.SpriteOptions>(PixiSprite);\n/**\n * A SolidJS component that renders a `PIXI.Text`.\n */\nexport const Text = createLeafComponent<PixiText, Pixi.CanvasTextOptions>(PixiText);\n\n/**\n * A SolidJS component that renders a `PIXI.TilingSprite`.\n */\nexport const TilingSprite = createLeafComponent<PixiTilingSprite, Pixi.TilingSpriteOptions>(PixiTilingSprite);\n\n// export const MeshGeometry = createLeafComponent<PixiMeshGeometry, Pixi.MeshGeometryOptions>(PixiMeshGeometry);\n// export const NineSliceGeometry = createLeafComponent<PixiNineSliceGeometry, Pixi.NineSliceGeometryOptions>(\n//   PixiNineSliceGeometry\n// );\n\n// export const Particle = createLeafComponent<PixiParticle, Pixi.ParticleOptions>(PixiParticle);\n// export const PerspectivePlaneGeometry = createLeafComponent<\n//   PixiPerspectivePlaneGeometry,\n//   Pixi.PerspectivePlaneGeometryOptions\n// >(PixiPerspectivePlaneGeometry);\n// export const PlaneGeometry = createLeafComponent<PixiPlaneGeometry, Pixi.PlaneGeometryOptions>(PixiPlaneGeometry);\n// export const RopeGeometry = createLeafComponent<PixiRopeGeometry, Pixi.RopeGeometryOptions>(PixiRopeGeometry);\n\n// TODO: Don't need a component for the Culler. It needs to interact with the stage directly.\n// export const Culler = createLeafComponent<PixiCuller, Pixi.Culler>(PixiCuller);\n"],"mappings":";;;;;;AAyCA,MAAaiD,kBAAkB;CAAC;CAAO;CAAM;CAAW;;;;;;;AAQxD,MAAaE,cACXE,UACAC,UACG;AACH,MAAK,MAAME,OAAOF,OAAO;AACvB,MAAIE,QAAQ,KAAM;AAElB,MAAIA,QAAQ,MACVrB,0BAAyB;AAEtBmB,SAAME,KAAuCH,SAAS;IACvD;WACOG,QAAQ,YAAY;AAC7B,OAAI,EAAE,cAAcH,UAClB,OAAM,IAAIK,MAAM,iDAAiD;AAEnEvB,4BAAyB;AACvBI,WAAOc,gBAAgBC,MAAMT,SAAS;KACtC;QAEFV,0BAAyB;AACvBK,WAAQa,UAAUG,KAAKF,MAAME,KAA2B;IACxD;;;AAKR,IAAMG,4BACJC,cACG;AACH,SAAQN,UAAqF;EAC3F,MAAM,CAACO,cAAcC,uBAAuB1B,WAAWkB,OAAO,CAAC,GAAGL,iBAAiB,GAAGX,yBAAyB,CAAC;EAEhH,MAAMe,WAAWC,MAAMV,MAAM,IAAIgB,UAAUE,oBAA2B;AAEtEX,aAAWE,UAAUS,oBAAoB;AACzCX,aAAWE,UAAUQ,aAAa;AAElC,SAAOR;;;AAIX,IAAMU,uBACJH,cACG;AACH,SAAQN,UAAgF;AACtF,SAAOK,yBAAqDC,UAAU,CAACN,MAAa;;;;;;AAOxF,MAAarD,mBAAiB8D,oBAAoE7D,eAAmB;;;;AAIrH,MAAaC,eAAa4D,oBACxB3D,WACD;;;;AAID,MAAaC,cAAYsD,yBAA+DrD,UAAc;;;;;AAKtG,MAAaC,aAAWwD,oBAAwDvD,SAAa;;;;AAI7F,MAAaC,aAAWsD,oBAAwDrD,SAAa;;;;AAK7F,MAAaC,cAAYoD,oBAA0DnD,UAAc;;;;AAKjG,MAAaC,aAAWkD,oBAAwDjD,SAAa;;;;AAK7F,MAAaC,eAAagD,oBAA4D/C,WAAe;;;;AAKrG,MAAaC,oBAAkB8C,oBAC7B7C,gBACD;;;;;;AAOD,MAAaC,sBAAoB4C,oBAC/B3C,kBACD;;;;AAKD,MAAaC,oBAAkB0C,oBAC7BzC,gBACD;;;;AAKD,MAAaC,oBAAkBoC,yBAC7BnC,gBACD;;;;AAKD,MAAaC,gBAAckC,yBAAmEjC,YAAgB;;;;AAK9G,MAAaC,WAASoC,oBAAoDnC,OAAW;;;;AAIrF,MAAaC,SAAOkC,oBAAsDjC,KAAS;;;;AAKnF,MAAaC,iBAAegC,oBAAgE/B,aAAiB"}
+{"version":3,"file":"pixi-components.js","sources":["../src/pixi-components.tsx"],"sourcesContent":["import type * as Pixi from \"pixi.js\";\nimport {\n  AnimatedSprite as PixiAnimatedSprite,\n  BitmapText as PixiBitmapText,\n  Container as PixiContainer,\n  Graphics as PixiGraphics,\n  HTMLText as PixiHTMLText,\n  MeshPlane as PixiMeshPlane,\n  MeshRope as PixiMeshRope,\n  MeshSimple as PixiMeshSimple,\n  NineSliceSprite as PixiNineSliceSprite,\n  ParticleContainer as PixiParticleContainer,\n  PerspectiveMesh as PixiPerspectiveMesh,\n  RenderContainer as PixiRenderContainer,\n  RenderLayer as PixiRenderLayer,\n  Sprite as PixiSprite,\n  Text as PixiText,\n  TilingSprite as PixiTilingSprite,\n} from \"pixi.js\";\nimport type { JSX, Ref } from \"solid-js\";\nimport { createRenderEffect, on, splitProps } from \"solid-js\";\nimport type { PixiEventHandlerMap } from \"./pixi-events\";\n\nimport { PIXI_SOLID_EVENT_HANDLER_NAMES } from \"./pixi-events\";\nimport { insert, setProp } from \"./renderer\";\n\n/**\n * Prop definition for components that CAN have children\n */\nexport type ContainerProps<Component> = PixiEventHandlerMap & {\n  ref?: Ref<Component>;\n  as?: Component;\n  children?: JSX.Element;\n};\n\n/**\n * Prop definition for components that CANNOT have children\n */\nexport type LeafProps<Component> = Omit<ContainerProps<Component>, \"children\">;\n\n// Keys that are specific to Solid components and not Pixi props\nexport const SOLID_PROP_KEYS = [\"ref\", \"as\", \"children\"] as const;\n\n/**\n * Apply's the props to a Pixi instance with subsriptions to maintain reactivity.\n *\n * @param instance The Pixi instance we want to apply props to.\n * @param props The props object.\n * @param defer Defers the createRenderEffect so the props aren't set on the first run.\n * This is useful because setting initialisation props can have unintended side effects.\n * Notibly in AnimatedSprite, if we set the textures roperty after instantiation it will stop the instance from playing.\n */\nexport const applyProps = <InstanceType extends PixiContainer, OptionsType extends ContainerProps<InstanceType>>(\n  instance: InstanceType,\n  props: OptionsType,\n  defer?: boolean\n) => {\n  for (const key in props) {\n    if (key === \"as\") continue;\n\n    if (key === \"ref\") {\n      createRenderEffect(() => {\n        // Solid converts the ref prop to a callback function\n        (props[key] as unknown as (arg: any) => void)(instance);\n      });\n    } else if (key === \"children\") {\n      if (!(\"addChild\" in instance)) {\n        throw new Error(`Cannot set children on non-container instance.`);\n      }\n      createRenderEffect(() => {\n        insert(instance, () => props.children);\n      });\n    } else if (defer) {\n      createRenderEffect(\n        on(\n          () => props[key as keyof typeof props],\n          () => {\n            setProp(instance, key, props[key as keyof typeof props]);\n          },\n          { defer }\n        )\n      );\n    } else {\n      createRenderEffect(() => {\n        setProp(instance, key, props[key as keyof typeof props]);\n      });\n    }\n  }\n};\n\nconst createContainerComponent = <InstanceType extends PixiContainer, OptionsType extends object>(\n  PixiClass: new (props: OptionsType) => InstanceType\n) => {\n  return (props: Omit<OptionsType, \"children\"> & ContainerProps<InstanceType>): JSX.Element => {\n    const [runtimeProps, initialisationProps] = splitProps(props, [\n      ...SOLID_PROP_KEYS,\n      ...PIXI_SOLID_EVENT_HANDLER_NAMES,\n    ]);\n\n    const instance = props.as || new PixiClass(initialisationProps as any);\n\n    applyProps(instance, initialisationProps, true);\n    applyProps(instance, runtimeProps);\n\n    return instance as unknown as JSX.Element;\n  };\n};\n\nconst createLeafComponent = <InstanceType extends PixiContainer, OptionsType extends object>(\n  PixiClass: new (props: OptionsType) => InstanceType\n) => {\n  return (props: Omit<OptionsType, \"children\"> & LeafProps<InstanceType>): JSX.Element => {\n    return createContainerComponent<PixiContainer, OptionsType>(PixiClass)(props as any);\n  };\n};\n\n/**\n * A SolidJS component that renders a `PIXI.AnimatedSprite`.\n */\nexport const AnimatedSprite = createLeafComponent<PixiAnimatedSprite, Pixi.AnimatedSpriteOptions>(PixiAnimatedSprite);\n/**\n * A SolidJS component that renders a `PIXI.BitmapText`.\n */\nexport const BitmapText = createLeafComponent<PixiBitmapText, ConstructorParameters<typeof PixiBitmapText>>(\n  PixiBitmapText\n);\n/**\n * A SolidJS component that renders a `PIXI.Container`.\n */\nexport const Container = createContainerComponent<PixiContainer, Pixi.ContainerOptions>(PixiContainer);\n/**\n * A SolidJS component that renders a `PIXI.Graphics`.\n * Use a ref to access the underlying graphics instance and draw with it.\n */\nexport const Graphics = createLeafComponent<PixiGraphics, Pixi.GraphicsOptions>(PixiGraphics);\n/**\n * A SolidJS component that renders a `PIXI.HTMLText`.\n */\nexport const HTMLText = createLeafComponent<PixiHTMLText, Pixi.HTMLTextOptions>(PixiHTMLText);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshPlane`.\n */\nexport const MeshPlane = createLeafComponent<PixiMeshPlane, Pixi.MeshPlaneOptions>(PixiMeshPlane);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshRope`.\n */\nexport const MeshRope = createLeafComponent<PixiMeshRope, Pixi.MeshRopeOptions>(PixiMeshRope);\n\n/**\n * A SolidJS component that renders a `PIXI.MeshSimple`.\n */\nexport const MeshSimple = createLeafComponent<PixiMeshSimple, Pixi.SimpleMeshOptions>(PixiMeshSimple);\n\n/**\n * A SolidJS component that renders a `PIXI.NineSliceSprite`.\n */\nexport const NineSliceSprite = createLeafComponent<PixiNineSliceSprite, Pixi.NineSliceSpriteOptions>(\n  PixiNineSliceSprite\n);\n\n/**\n * A SolidJS component that renders a `PIXI.ParticleContainer`.\n *\n * Particles should be added and removed from this component imperatively. Please see the docs for a reference example.\n */\nexport const ParticleContainer = createLeafComponent<PixiParticleContainer, Pixi.ParticleContainerOptions>(\n  PixiParticleContainer\n);\n\n/**\n * A SolidJS component that renders a `PIXI.PerspectiveMesh`.\n */\nexport const PerspectiveMesh = createLeafComponent<PixiPerspectiveMesh, Pixi.PerspectivePlaneOptions>(\n  PixiPerspectiveMesh\n);\n\n/**\n * A SolidJS component that renders a `PIXI.RenderContainer`.\n */\nexport const RenderContainer = createContainerComponent<PixiRenderContainer, Pixi.RenderContainerOptions>(\n  PixiRenderContainer\n);\n\n/**\n * A SolidJS component that renders a `PIXI.RenderLayer`.\n */\nexport const RenderLayer = createContainerComponent<PixiRenderLayer, Pixi.RenderLayerOptions>(PixiRenderLayer);\n\n/**\n * A SolidJS component that renders a `PIXI.Sprite`.\n */\nexport const Sprite = createLeafComponent<PixiSprite, Pixi.SpriteOptions>(PixiSprite);\n/**\n * A SolidJS component that renders a `PIXI.Text`.\n */\nexport const Text = createLeafComponent<PixiText, Pixi.CanvasTextOptions>(PixiText);\n\n/**\n * A SolidJS component that renders a `PIXI.TilingSprite`.\n */\nexport const TilingSprite = createLeafComponent<PixiTilingSprite, Pixi.TilingSpriteOptions>(PixiTilingSprite);\n\n// export const MeshGeometry = createLeafComponent<PixiMeshGeometry, Pixi.MeshGeometryOptions>(PixiMeshGeometry);\n\n// export const NineSliceGeometry = createLeafComponent<PixiNineSliceGeometry, Pixi.NineSliceGeometryOptions>(\n//   PixiNineSliceGeometry\n// );\n\n// export const Particle = createLeafComponent<PixiParticle, Pixi.ParticleOptions>(PixiParticle);\n\n// export const PerspectivePlaneGeometry = createLeafComponent<\n//   PixiPerspectivePlaneGeometry,\n//   Pixi.PerspectivePlaneGeometryOptions\n// >(PixiPerspectivePlaneGeometry);\n\n// export const PlaneGeometry = createLeafComponent<PixiPlaneGeometry, Pixi.PlaneGeometryOptions>(PixiPlaneGeometry);\n\n// export const RopeGeometry = createLeafComponent<PixiRopeGeometry, Pixi.RopeGeometryOptions>(PixiRopeGeometry);\n\n// TODO: Do we need a component for the Culler. It needs to interact with the stage directly.\n// export const Culler = createLeafComponent<PixiCuller, Pixi.Culler>(PixiCuller);\n"],"names":["SOLID_PROP_KEYS","applyProps","instance","props","defer","key","createRenderEffect","Error","insert","children","on","setProp","createContainerComponent","PixiClass","runtimeProps","initialisationProps","splitProps","PIXI_SOLID_EVENT_HANDLER_NAMES","as","createLeafComponent","AnimatedSprite","PixiAnimatedSprite","BitmapText","PixiBitmapText","Container","PixiContainer","Graphics","PixiGraphics","HTMLText","PixiHTMLText","MeshPlane","PixiMeshPlane","MeshRope","PixiMeshRope","MeshSimple","PixiMeshSimple","NineSliceSprite","PixiNineSliceSprite","ParticleContainer","PixiParticleContainer","PerspectiveMesh","PixiPerspectiveMesh","RenderContainer","PixiRenderContainer","RenderLayer","PixiRenderLayer","Sprite","PixiSprite","Text","PixiText","TilingSprite","PixiTilingSprite"],"mappings":";;;;AAyCO,MAAMA,IAAkB,CAAC,OAAO,MAAM,UAAU,GAW1CC,IAAa,CACxBC,GACAC,GACAC,MACG;AACH,aAAWC,KAAOF;AAChB,QAAIE,MAAQ;AAEZ,UAAIA,MAAQ;AACVC,QAAAA,EAAmB,MAAM;AAEtBH,UAAAA,EAAME,CAAG,EAAoCH,CAAQ;AAAA,QACxD,CAAC;AAAA,eACQG,MAAQ,YAAY;AAC7B,YAAI,EAAE,cAAcH;AAClB,gBAAM,IAAIK,MAAM,gDAAgD;AAElED,QAAAA,EAAmB,MAAM;AACvBE,UAAAA,EAAON,GAAU,MAAMC,EAAMM,QAAQ;AAAA,QACvC,CAAC;AAAA,MACH,OAAWL,IACTE,EACEI,EACE,MAAMP,EAAME,CAAyB,GACrC,MAAM;AACJM,QAAAA,EAAQT,GAAUG,GAAKF,EAAME,CAAyB,CAAC;AAAA,MACzD,GACA;AAAA,QAAED,OAAAA;AAAAA,MAAAA,CACJ,CACF,IAEAE,EAAmB,MAAM;AACvBK,QAAAA,EAAQT,GAAUG,GAAKF,EAAME,CAAyB,CAAC;AAAA,MACzD,CAAC;AAGP,GAEMO,IAA2B,CAC/BC,MAEO,CAACV,MAAqF;AAC3F,QAAM,CAACW,GAAcC,CAAmB,IAAIC,EAAWb,GAAO,CAC5D,GAAGH,GACH,GAAGiB,CAA8B,CAClC,GAEKf,IAAWC,EAAMe,MAAM,IAAIL,EAAUE,CAA0B;AAErEd,SAAAA,EAAWC,GAAUa,GAAqB,EAAI,GAC9Cd,EAAWC,GAAUY,CAAY,GAE1BZ;AACT,GAGIiB,IAAsB,CAC1BN,MAEO,CAACV,MACCS,EAAqDC,CAAS,EAAEV,CAAY,GAO1EiB,IAAiBD,EAAoEE,CAAkB,GAIvGC,IAAaH,EACxBI,CACF,GAIaC,IAAYZ,EAA+Da,CAAa,GAKxFC,IAAWP,EAAwDQ,CAAY,GAI/EC,IAAWT,EAAwDU,CAAY,GAK/EC,IAAYX,EAA0DY,CAAa,GAKnFC,IAAWb,EAAwDc,CAAY,GAK/EC,IAAaf,EAA4DgB,CAAc,GAKvFC,IAAkBjB,EAC7BkB,CACF,GAOaC,IAAoBnB,EAC/BoB,CACF,GAKaC,IAAkBrB,EAC7BsB,CACF,GAKaC,IAAkB9B,EAC7B+B,CACF,GAKaC,IAAchC,EAAmEiC,CAAe,GAKhGC,IAAS3B,EAAoD4B,CAAU,GAIvEC,IAAO7B,EAAsD8B,CAAQ,GAKrEC,IAAe/B,EAAgEgC,CAAgB;"}