hudini 0.17.2 → 0.18.0

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export * from './components';
 export * from './exports-phaser-wind';
+export * from './loaders';
 export * from './plugin';
 export * from './scene';
 export * from './utils';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/index.js

@@ -1,5 +1,6 @@
 export * from './components';
 export * from './exports-phaser-wind';
+export * from './loaders';
 export * from './plugin';
 export * from './scene';
 export * from './utils';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/loaders/index.d.ts

@@ -0,0 +1,2 @@
+export * from './load-fonts';
+//# sourceMappingURL=index.d.ts.map

package/dist/loaders/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/loaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/loaders/index.js

@@ -0,0 +1,2 @@
+export * from './load-fonts';
+//# sourceMappingURL=index.js.map

package/dist/loaders/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/loaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/loaders/load-fonts.d.ts

@@ -0,0 +1,8 @@
+type LoadFontsOptions = {
+    fontAwesomeUrl?: string;
+    baseFont?: string;
+    baseFontFamily?: string;
+};
+export declare const loadFonts: (options?: LoadFontsOptions) => Promise<void>;
+export {};
+//# sourceMappingURL=load-fonts.d.ts.map

package/dist/loaders/load-fonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"load-fonts.d.ts","sourceRoot":"","sources":["../../src/loaders/load-fonts.ts"],"names":[],"mappings":"AAEA,KAAK,gBAAgB,GAAG;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAiCF,eAAO,MAAM,SAAS,GAAU,UAAU,gBAAgB,KAAG,OAAO,CAAC,IAAI,CAexE,CAAC"}

package/dist/loaders/load-fonts.js

@@ -0,0 +1,41 @@
+import { loadFont as loadFontAwesomeForPhaser } from 'font-awesome-for-phaser';
+const loadStylesheet = (url) => {
+    return new Promise((resolve, reject) => {
+        const existingLink = document.querySelector(`link[href="${url}"]`);
+        if (existingLink) {
+            resolve();
+            return;
+        }
+        const link = document.createElement('link');
+        link.rel = 'stylesheet';
+        link.href = url;
+        link.onload = () => {
+            resolve();
+        };
+        link.onerror = () => {
+            reject(new Error(`Failed to load stylesheet: ${url}`));
+        };
+        document.head.appendChild(link);
+    });
+};
+const ensureBaseFontReady = async (fontFamily) => {
+    const loads = [
+        document.fonts.load(`400 16px "${fontFamily}"`, 'A'),
+        document.fonts.load(`700 16px "${fontFamily}"`, 'B'),
+    ];
+    await Promise.all(loads);
+    await document['fonts'].ready;
+};
+export const loadFonts = async (options) => {
+    const { fontAwesomeUrl, baseFont = 'https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap', baseFontFamily = 'Bebas Neue', } = options ?? {};
+    try {
+        await loadFontAwesomeForPhaser(fontAwesomeUrl);
+        await loadStylesheet(baseFont);
+        await ensureBaseFontReady(baseFontFamily);
+        await document.fonts.ready;
+    }
+    catch (error) {
+        throw new Error(`Failed to load fonts: ${error instanceof Error ? error.message : String(error)}`);
+    }
+};
+//# sourceMappingURL=load-fonts.js.map

package/dist/loaders/load-fonts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"load-fonts.js","sourceRoot":"","sources":["../../src/loaders/load-fonts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAQ/E,MAAM,cAAc,GAAG,CAAC,GAAW,EAAiB,EAAE;IACpD,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAQ,EAAE;QAC3C,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;QACnE,IAAI,YAAY,EAAE,CAAC;YACjB,OAAO,EAAE,CAAC;YACV,OAAO;QACT,CAAC;QAED,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC5C,IAAI,CAAC,GAAG,GAAG,YAAY,CAAC;QACxB,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC;QAChB,IAAI,CAAC,MAAM,GAAG,GAAS,EAAE;YACvB,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC;QACF,IAAI,CAAC,OAAO,GAAG,GAAS,EAAE;YACxB,MAAM,CAAC,IAAI,KAAK,CAAC,8BAA8B,GAAG,EAAE,CAAC,CAAC,CAAC;QACzD,CAAC,CAAC;QACF,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,KAAK,EAAE,UAAkB,EAAiB,EAAE;IACtE,MAAM,KAAK,GAAG;QACZ,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,UAAU,GAAG,EAAE,GAAG,CAAC;QACpD,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,UAAU,GAAG,EAAE,GAAG,CAAC;KACrD,CAAC;IACF,MAAM,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IACzB,MAAO,QAA2D,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC;AACpF,CAAC,CAAC;AAGF,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,EAAE,OAA0B,EAAiB,EAAE;IAC3E,MAAM,EACJ,cAAc,EACd,QAAQ,GAAG,kEAAkE,EAC7E,cAAc,GAAG,YAAY,GAC9B,GAAG,OAAO,IAAI,EAAE,CAAC;IAElB,IAAI,CAAC;QACH,MAAM,wBAAwB,CAAC,cAAc,CAAC,CAAC;QAC/C,MAAM,cAAc,CAAC,QAAQ,CAAC,CAAC;QAC/B,MAAM,mBAAmB,CAAC,cAAc,CAAC,CAAC;QAC1C,MAAM,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;IAC7B,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,MAAM,IAAI,KAAK,CAAC,yBAAyB,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrG,CAAC;AACH,CAAC,CAAC"}

package/dist/test-setup.js

@@ -29,8 +29,14 @@ vi.mock('phaser', () => {
             return this;
         }
     }
-    const GameObjects = { Container };
-    return { GameObjects, Scene, default: { GameObjects, Scene } };
+    class Text {
+        // Mock Text class for Phaser.GameObjects.Text
+        // eslint-disable-next-line no-unused-vars
+        constructor(..._args) { }
+    }
+    const GameObjects = { Container, Text };
+    const Phaser = { GameObjects, Scene };
+    return { GameObjects, Scene, Phaser, default: Phaser };
 });
 // Mock phaser-wind globally (after Phaser mock)
 vi.mock('phaser-wind', () => {

package/dist/test-setup.js.map

@@ -1 +1 @@
-{"version":3,"file":"test-setup.js","sourceRoot":"","sources":["../src/test-setup.ts"],"names":[],"mappings":"AAAA,kCAAkC;AAClC,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,+DAA+D;AAC/D,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE;IACrB,MAAM,KAAK;KAAI;IAIf,MAAM,SAAS;QACN,IAAI,GAAc,EAAE,CAAC;QACrB,CAAC,CAAS;QACV,CAAC,CAAS;QACV,KAAK,GAAG,CAAC,CAAC;QACV,MAAM,GAAG,CAAC,CAAC;QAElB,YAAY,MAAa,EAAE,CAAS,EAAE,CAAS;YAC7C,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;YACX,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACb,CAAC;QAED,GAAG,CAAC,KAAoC;YACtC,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;gBACzB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC;YAC3B,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACxB,CAAC;YACD,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,CAAC,KAAa,EAAE,MAAc;YACnC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;YACrB,OAAO,IAAI,CAAC;QACd,CAAC;KACF;IAED,MAAM,WAAW,GAAG,EAAE,SAAS,EAAW,CAAC;IAC3C,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC;AACjE,CAAC,CAAC,CAAC;AAEH,gDAAgD;AAChD,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,GAAG,EAAE;IAC1B,OAAO;QACL,KAAK,EAAE;YACL,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,KAAK,EAAE,CAAC;YAC7C,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,KAAK,EAAE,CAAC;SAC9C;QACD,iBAAiB,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAqF,EAAE,EAAE;YACjH,IAAI,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ;gBAAE,OAAO,KAAK,CAAC,YAAY,CAAC;YACtE,IAAI,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ;gBAAE,OAAO,KAAK,CAAC,KAAK,CAAC;YACxD,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,EAAE,EAAE,CAAC;YACnC,OAAO,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACnC,CAAC,CAAC;QACF,kBAAkB,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAwF,EAAE,EAAE;YACrH,IAAI,OAAO,KAAK,CAAC,aAAa,KAAK,QAAQ;gBAAE,OAAO,KAAK,CAAC,aAAa,CAAC;YACxE,IAAI,OAAO,KAAK,CAAC,MAAM,KAAK,QAAQ;gBAAE,OAAO,KAAK,CAAC,MAAM,CAAC;YAC1D,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,EAAE,EAAE,CAAC;YACnC,OAAO,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,CAAC;QACF,gBAAgB,EAAE,MAAM,gBAAgB;SAAI;QAC5C,mBAAmB,EAAE,MAAM,mBAAmB;SAAI;KACnD,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"test-setup.js","sourceRoot":"","sources":["../src/test-setup.ts"],"names":[],"mappings":"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"}

package/dist/utils/color-variants.d.ts

@@ -0,0 +1,38 @@
+import { type ColorKey } from 'phaser-wind';
+/**
+ * Calculates a color variant by adjusting brightness.
+ *
+ * @param color - The base color (can be a Phaser Wind token like "blue-500" or a CSS color like "#3B82F6")
+ * @param tokenDiff - Amount to adjust the shade for color tokens. Positive values make it darker, negative lighter.
+ *                    For example: -400 for lighter (blue-500 → blue-100), +400 for darker (blue-500 → blue-900)
+ * @param colorDiff - Amount to lighten/darken CSS colors. Positive values lighten, negative values darken.
+ *                    Range: 0-100. For example: 90 to lighten, -90 to darken
+ * @returns The adjusted color as a number
+ *
+ * @remarks
+ * - If a color token is provided (e.g., "blue-500"), it uses the token system to calculate variants
+ *   by adjusting the shade value with tokenDiff (clamped between 100-900)
+ * - If a CSS color is provided (hex or rgb), it uses Phaser's lighten/darken methods
+ *   with colorDiff (positive = lighten, negative = darken)
+ *
+ * @example
+ * ```typescript
+ * // Using color token - lighter variant
+ * const lightBlue = getColorVariant('blue-500', -400, 0);
+ * // Returns blue-100 color value
+ *
+ * // Using color token - darker variant
+ * const darkBlue = getColorVariant('blue-500', 400, 0);
+ * // Returns blue-900 color value
+ *
+ * // Using CSS color - lighter
+ * const lightCss = getColorVariant('#3B82F6', 0, 90);
+ * // Returns lightened color
+ *
+ * // Using CSS color - darker
+ * const darkCss = getColorVariant('#3B82F6', 0, -90);
+ * // Returns darkened color
+ * ```
+ */
+export declare const getColorVariant: (color: ColorKey | string, tokenDiff: number, colorDiff: number) => number;
+//# sourceMappingURL=color-variants.d.ts.map

package/dist/utils/color-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-variants.d.ts","sourceRoot":"","sources":["../../src/utils/color-variants.ts"],"names":[],"mappings":"AACA,OAAO,EAAS,KAAK,QAAQ,EAAiB,MAAM,aAAa,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,eAAe,GAC1B,OAAO,QAAQ,GAAG,MAAM,EACxB,WAAW,MAAM,EACjB,WAAW,MAAM,KAChB,MA6BF,CAAC"}

package/dist/utils/color-variants.js

@@ -0,0 +1,59 @@
+import Phaser from 'phaser';
+import { Color } from 'phaser-wind';
+/**
+ * Calculates a color variant by adjusting brightness.
+ *
+ * @param color - The base color (can be a Phaser Wind token like "blue-500" or a CSS color like "#3B82F6")
+ * @param tokenDiff - Amount to adjust the shade for color tokens. Positive values make it darker, negative lighter.
+ *                    For example: -400 for lighter (blue-500 → blue-100), +400 for darker (blue-500 → blue-900)
+ * @param colorDiff - Amount to lighten/darken CSS colors. Positive values lighten, negative values darken.
+ *                    Range: 0-100. For example: 90 to lighten, -90 to darken
+ * @returns The adjusted color as a number
+ *
+ * @remarks
+ * - If a color token is provided (e.g., "blue-500"), it uses the token system to calculate variants
+ *   by adjusting the shade value with tokenDiff (clamped between 100-900)
+ * - If a CSS color is provided (hex or rgb), it uses Phaser's lighten/darken methods
+ *   with colorDiff (positive = lighten, negative = darken)
+ *
+ * @example
+ * ```typescript
+ * // Using color token - lighter variant
+ * const lightBlue = getColorVariant('blue-500', -400, 0);
+ * // Returns blue-100 color value
+ *
+ * // Using color token - darker variant
+ * const darkBlue = getColorVariant('blue-500', 400, 0);
+ * // Returns blue-900 color value
+ *
+ * // Using CSS color - lighter
+ * const lightCss = getColorVariant('#3B82F6', 0, 90);
+ * // Returns lightened color
+ *
+ * // Using CSS color - darker
+ * const darkCss = getColorVariant('#3B82F6', 0, -90);
+ * // Returns darkened color
+ * ```
+ */
+export const getColorVariant = (color, tokenDiff, colorDiff) => {
+    const colorRgb = Color.rgb(color);
+    if (Color.isValidColorToken(color)) {
+        // Token-based calculation
+        const parts = color.split('-');
+        const colorShade = parseInt(parts[1].toString(), 10);
+        const shadeMin = 100;
+        const shadeMax = 900;
+        const newShade = Math.max(Math.min(colorShade + tokenDiff, shadeMax), shadeMin).toString();
+        return Color.hex(`${parts[0]}-${newShade}`);
+    }
+    // CSS color calculation
+    const baseColor = Phaser.Display.Color.ValueToColor(colorRgb);
+    if (colorDiff === 0) {
+        return baseColor.color;
+    }
+    if (colorDiff > 0) {
+        return baseColor.clone().lighten(colorDiff).color;
+    }
+    return baseColor.clone().darken(Math.abs(colorDiff)).color;
+};
+//# sourceMappingURL=color-variants.js.map

package/dist/utils/color-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-variants.js","sourceRoot":"","sources":["../../src/utils/color-variants.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAgC,MAAM,aAAa,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,KAAwB,EACxB,SAAiB,EACjB,SAAiB,EACT,EAAE;IACV,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,KAAiB,CAAC,CAAC;IAE9C,IAAI,KAAK,CAAC,iBAAiB,CAAC,KAAe,CAAC,EAAE,CAAC;QAC7C,0BAA0B;QAC1B,MAAM,KAAK,GAAqB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAqB,CAAC;QACrE,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,GAAG,CAAC;QACrB,MAAM,QAAQ,GAAG,GAAG,CAAC;QACrB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACvB,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,SAAS,EAAE,QAAQ,CAAC,EAC1C,QAAQ,CACT,CAAC,QAAQ,EAAc,CAAC;QAEzB,OAAO,KAAK,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,QAAQ,EAAE,CAAC,CAAC;IAC9C,CAAC;IAED,wBAAwB;IACxB,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IAE9D,IAAI,SAAS,KAAK,CAAC,EAAE,CAAC;QACpB,OAAO,SAAS,CAAC,KAAK,CAAC;IACzB,CAAC;IAED,IAAI,SAAS,GAAG,CAAC,EAAE,CAAC;QAClB,OAAO,SAAS,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC;IACpD,CAAC;IAED,OAAO,SAAS,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC;AAC7D,CAAC,CAAC"}

package/dist/utils/index.d.ts

@@ -1,3 +1,4 @@
+export * from './color-variants';
 export * from './get-hudini';
 export * from './get-pw-from-scene';
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}

package/dist/utils/index.js

@@ -1,3 +1,4 @@
+export * from './color-variants';
 export * from './get-hudini';
 export * from './get-pw-from-scene';
 //# sourceMappingURL=index.js.map

package/dist/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hudini",
-  "version": "0.17.2",
+  "version": "0.18.0",
   "description": "🎩 Magical Phaser UI components - Reusable HUD elements for game development. Is magic, like a wizard",
   "type": "module",
   "main": "./dist/index.js",
@@ -62,8 +62,8 @@
     "vitest": "^3.2.4"
   },
   "dependencies": {
-    "phaser-wind": "0.8.0",
-    "font-awesome-for-phaser": "0.9.0"
+    "phaser-wind": "0.9.0",
+    "font-awesome-for-phaser": "0.10.0"
   },
   "peerDependencies": {
     "phaser": "*"