hudini 0.18.0 → 0.19.0

package/dist/scene/index.d.ts

@@ -1,2 +1,3 @@
 export * from './scene-with-hudini';
+export * from './with-hudini';
 //# sourceMappingURL=index.d.ts.map

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

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

package/dist/scene/index.js

@@ -1,2 +1,3 @@
 export * from './scene-with-hudini';
+export * from './with-hudini';
 //# sourceMappingURL=index.js.map

package/dist/scene/index.js.map

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

package/dist/scene/scene-with-hudini.d.ts

@@ -1,8 +1,31 @@
 import { BaseThemeConfig, SceneWithPhaserWind } from 'phaser-wind';
 import { HudiniPlugin } from '../plugin/plugin';
+/**
+ * @deprecated Use {@link withHudini} instead.
+ *
+ * Forces single inheritance, which conflicts with any user-defined `BaseScene`
+ * or other libraries that ship their own scene base class. It also relies on a
+ * non-null assertion (`hudini!`) that lies to TypeScript about when the plugin
+ * is available — touching `this.hudini` before the plugin mounts throws at
+ * runtime.
+ *
+ * Prefer the `withHudini(scene)` accessor:
+ *
+ * ```ts
+ * import { withHudini } from 'hudini';
+ * import type { ThemeType } from './theme';
+ *
+ * class MyScene extends Phaser.Scene {
+ *   create() {
+ *     const hudini = withHudini<ThemeType>(this);
+ *   }
+ * }
+ * ```
+ *
+ * Kept exported to avoid breaking existing consumers.
+ */
 export declare abstract class SceneWithHudini<T extends BaseThemeConfig = BaseThemeConfig> extends SceneWithPhaserWind<T> {
     /**
-     *
      * @param config The scene key or scene specific configuration settings.
      */
     constructor(config?: string | Phaser.Types.Scenes.SettingsConfig);

package/dist/scene/scene-with-hudini.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scene-with-hudini.d.ts","sourceRoot":"","sources":["../../src/scene/scene-with-hudini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,8BAAsB,eAAe,CACnC,CAAC,SAAS,eAAe,GAAG,eAAe,CAC3C,SAAQ,mBAAmB,CAAC,CAAC,CAAC;IAC9B;;;OAGG;gBACS,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc;IAIzD,MAAM,EAAG,YAAY,CAAC,CAAC,CAAC,CAAC;CACjC"}
+{"version":3,"file":"scene-with-hudini.d.ts","sourceRoot":"","sources":["../../src/scene/scene-with-hudini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,8BAAsB,eAAe,CACnC,CAAC,SAAS,eAAe,GAAG,eAAe,CAC3C,SAAQ,mBAAmB,CAAC,CAAC,CAAC;IAC9B;;OAEG;gBACS,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc;IAIzD,MAAM,EAAG,YAAY,CAAC,CAAC,CAAC,CAAC;CACjC"}

package/dist/scene/scene-with-hudini.js

@@ -1,7 +1,30 @@
 import { SceneWithPhaserWind } from 'phaser-wind';
+/**
+ * @deprecated Use {@link withHudini} instead.
+ *
+ * Forces single inheritance, which conflicts with any user-defined `BaseScene`
+ * or other libraries that ship their own scene base class. It also relies on a
+ * non-null assertion (`hudini!`) that lies to TypeScript about when the plugin
+ * is available — touching `this.hudini` before the plugin mounts throws at
+ * runtime.
+ *
+ * Prefer the `withHudini(scene)` accessor:
+ *
+ * ```ts
+ * import { withHudini } from 'hudini';
+ * import type { ThemeType } from './theme';
+ *
+ * class MyScene extends Phaser.Scene {
+ *   create() {
+ *     const hudini = withHudini<ThemeType>(this);
+ *   }
+ * }
+ * ```
+ *
+ * Kept exported to avoid breaking existing consumers.
+ */
 export class SceneWithHudini extends SceneWithPhaserWind {
     /**
-     *
      * @param config The scene key or scene specific configuration settings.
      */
     constructor(config) {

package/dist/scene/scene-with-hudini.js.map

@@ -1 +1 @@
-{"version":3,"file":"scene-with-hudini.js","sourceRoot":"","sources":["../../src/scene/scene-with-hudini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAInE,MAAM,OAAgB,eAEpB,SAAQ,mBAAsB;IAC9B;;;OAGG;IACH,YAAY,MAAoD;QAC9D,KAAK,CAAC,MAAM,CAAC,CAAC;IAChB,CAAC;IAEM,MAAM,CAAmB;CACjC"}
+{"version":3,"file":"scene-with-hudini.js","sourceRoot":"","sources":["../../src/scene/scene-with-hudini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAInE;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,OAAgB,eAEpB,SAAQ,mBAAsB;IAC9B;;OAEG;IACH,YAAY,MAAoD;QAC9D,KAAK,CAAC,MAAM,CAAC,CAAC;IAChB,CAAC;IAEM,MAAM,CAAmB;CACjC"}

package/dist/scene/with-hudini.d.ts

@@ -0,0 +1,35 @@
+import type { Scene } from 'phaser';
+import type { BaseThemeConfig } from 'phaser-wind';
+import { HudiniPlugin } from '../plugin/plugin';
+/**
+ * Accessor for the Hudini plugin from within a Phaser scene.
+ *
+ * Preferred over {@link SceneWithHudini} (inheritance) and over module
+ * augmentation of `Phaser.Scene`, because it:
+ * - Composes with any existing base scene (no forced inheritance).
+ * - Keeps the theme type explicit at the call site (no silent `any`).
+ * - Doesn't rely on non-null assertions that lie about lifecycle.
+ *
+ * Call it inside `create()` / `update()` (after the plugin has been installed).
+ *
+ * @typeParam T - The theme config type. Pass your `ThemeType` to get
+ *   type-narrowed access to your custom tokens (through `hudini.pw`).
+ * @param scene - The Phaser scene instance.
+ * @returns The Hudini plugin instance bound to the given theme type.
+ *
+ * @example
+ * ```ts
+ * import { withHudini } from 'hudini';
+ * import type { ThemeType } from './theme';
+ *
+ * class MyScene extends Phaser.Scene {
+ *   create() {
+ *     const hudini = withHudini<ThemeType>(this);
+ *     const pw = hudini.pw;
+ *     this.cameras.main.setBackgroundColor(pw.color.rgb('background'));
+ *   }
+ * }
+ * ```
+ */
+export declare const withHudini: <T extends BaseThemeConfig = BaseThemeConfig>(scene: Scene) => HudiniPlugin<T>;
+//# sourceMappingURL=with-hudini.d.ts.map

package/dist/scene/with-hudini.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"with-hudini.d.ts","sourceRoot":"","sources":["../../src/scene/with-hudini.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAc,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,eAAe,GAAG,eAAe,EACpE,OAAO,KAAK,KACX,YAAY,CAAC,CAAC,CAC4C,CAAC"}

package/dist/scene/with-hudini.js

@@ -0,0 +1,33 @@
+import { HUDINI_KEY } from '../plugin/plugin';
+/**
+ * Accessor for the Hudini plugin from within a Phaser scene.
+ *
+ * Preferred over {@link SceneWithHudini} (inheritance) and over module
+ * augmentation of `Phaser.Scene`, because it:
+ * - Composes with any existing base scene (no forced inheritance).
+ * - Keeps the theme type explicit at the call site (no silent `any`).
+ * - Doesn't rely on non-null assertions that lie about lifecycle.
+ *
+ * Call it inside `create()` / `update()` (after the plugin has been installed).
+ *
+ * @typeParam T - The theme config type. Pass your `ThemeType` to get
+ *   type-narrowed access to your custom tokens (through `hudini.pw`).
+ * @param scene - The Phaser scene instance.
+ * @returns The Hudini plugin instance bound to the given theme type.
+ *
+ * @example
+ * ```ts
+ * import { withHudini } from 'hudini';
+ * import type { ThemeType } from './theme';
+ *
+ * class MyScene extends Phaser.Scene {
+ *   create() {
+ *     const hudini = withHudini<ThemeType>(this);
+ *     const pw = hudini.pw;
+ *     this.cameras.main.setBackgroundColor(pw.color.rgb('background'));
+ *   }
+ * }
+ * ```
+ */
+export const withHudini = (scene) => scene.plugins.get(HUDINI_KEY);
+//# sourceMappingURL=with-hudini.js.map

package/dist/scene/with-hudini.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"with-hudini.js","sourceRoot":"","sources":["../../src/scene/with-hudini.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAgB,MAAM,kBAAkB,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CACxB,KAAY,EACK,EAAE,CACnB,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAA+B,CAAC"}

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

@@ -2,7 +2,7 @@ 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 color - The base color (can be a Phaser Wind token like "blue-500", a color name like "red", 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.
@@ -10,6 +10,7 @@ import { type ColorKey } from 'phaser-wind';
  * @returns The adjusted color as a number
  *
  * @remarks
+ * - If only a color name is provided without a shade (e.g., "red"), it automatically adds "-500" as the default shade
  * - 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
@@ -17,6 +18,10 @@ import { type ColorKey } from 'phaser-wind';
  *
  * @example
  * ```typescript
+ * // Using color name only - defaults to -500
+ * const defaultRed = getColorVariant('red', 0, 0);
+ * // Returns red-500 color value
+ *
  * // Using color token - lighter variant
  * const lightBlue = getColorVariant('blue-500', -400, 0);
  * // Returns blue-100 color value

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

@@ -1 +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"}
+{"version":3,"file":"color-variants.d.ts","sourceRoot":"","sources":["../../src/utils/color-variants.ts"],"names":[],"mappings":"AACA,OAAO,EAAkB,KAAK,QAAQ,EAAiB,MAAM,aAAa,CAAC;AAE3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,eAAO,MAAM,eAAe,GAC1B,OAAO,QAAQ,GAAG,MAAM,EACxB,WAAW,MAAM,EACjB,WAAW,MAAM,KAChB,MAsCF,CAAC"}

package/dist/utils/color-variants.js

@@ -1,9 +1,9 @@
 import Phaser from 'phaser';
-import { Color } from 'phaser-wind';
+import { Color, palette } 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 color - The base color (can be a Phaser Wind token like "blue-500", a color name like "red", 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.
@@ -11,6 +11,7 @@ import { Color } from 'phaser-wind';
  * @returns The adjusted color as a number
  *
  * @remarks
+ * - If only a color name is provided without a shade (e.g., "red"), it automatically adds "-500" as the default shade
  * - 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
@@ -18,6 +19,10 @@ import { Color } from 'phaser-wind';
  *
  * @example
  * ```typescript
+ * // Using color name only - defaults to -500
+ * const defaultRed = getColorVariant('red', 0, 0);
+ * // Returns red-500 color value
+ *
  * // Using color token - lighter variant
  * const lightBlue = getColorVariant('blue-500', -400, 0);
  * // Returns blue-100 color value
@@ -36,10 +41,18 @@ import { Color } from 'phaser-wind';
  * ```
  */
 export const getColorVariant = (color, tokenDiff, colorDiff) => {
-    const colorRgb = Color.rgb(color);
-    if (Color.isValidColorToken(color)) {
+    // If only the color name is provided (without shade), validate and add -500 as default
+    let normalizedColor = color;
+    if (typeof color === 'string' && !color.includes('-') && !Color.isValidColorToken(color)) {
+        // Check if the color exists in the palette
+        if (color in palette && color !== 'black' && color !== 'white') {
+            normalizedColor = `${color}-500`;
+        }
+    }
+    const colorRgb = Color.rgb(normalizedColor);
+    if (Color.isValidColorToken(normalizedColor)) {
         // Token-based calculation
-        const parts = color.split('-');
+        const parts = normalizedColor.split('-');
         const colorShade = parseInt(parts[1].toString(), 10);
         const shadeMin = 100;
         const shadeMax = 900;

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

@@ -1 +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"}
+{"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,EAAE,OAAO,EAAgC,MAAM,aAAa,CAAC;AAE3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,KAAwB,EACxB,SAAiB,EACjB,SAAiB,EACT,EAAE;IACV,uFAAuF;IACvF,IAAI,eAAe,GAAG,KAAK,CAAC;IAC5B,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,CAAC;QACzF,2CAA2C;QAC3C,IAAI,KAAK,IAAI,OAAO,IAAI,KAAK,KAAK,OAAO,IAAI,KAAK,KAAK,OAAO,EAAE,CAAC;YAC/D,eAAe,GAAG,GAAG,KAAK,MAAM,CAAC;QACnC,CAAC;IACH,CAAC;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,eAA2B,CAAC,CAAC;IAExD,IAAI,KAAK,CAAC,iBAAiB,CAAC,eAAyB,CAAC,EAAE,CAAC;QACvD,0BAA0B;QAC1B,MAAM,KAAK,GAAqB,eAAe,CAAC,KAAK,CAAC,GAAG,CAAqB,CAAC;QAC/E,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/package.json

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