hudini 0.17.2 → 0.18.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/dist/components/card/card.d.ts +34 -9
  2. package/dist/components/card/card.d.ts.map +1 -1
  3. package/dist/components/card/card.js +118 -49
  4. package/dist/components/card/card.js.map +1 -1
  5. package/dist/components/card/card.spec.js +28 -1
  6. package/dist/components/card/card.spec.js.map +1 -1
  7. package/dist/components/circular-progress/circular-progress.d.ts +4 -4
  8. package/dist/components/circular-progress/circular-progress.d.ts.map +1 -1
  9. package/dist/components/circular-progress/circular-progress.js +9 -8
  10. package/dist/components/circular-progress/circular-progress.js.map +1 -1
  11. package/dist/components/circular-progress/circular-progress.spec.js +4 -4
  12. package/dist/components/circular-progress/circular-progress.spec.js.map +1 -1
  13. package/dist/components/container-interactive/container-interactive.d.ts +65 -0
  14. package/dist/components/container-interactive/container-interactive.d.ts.map +1 -0
  15. package/dist/components/container-interactive/container-interactive.js +99 -0
  16. package/dist/components/container-interactive/container-interactive.js.map +1 -0
  17. package/dist/components/container-interactive/index.d.ts +2 -0
  18. package/dist/components/container-interactive/index.d.ts.map +1 -0
  19. package/dist/components/container-interactive/index.js +2 -0
  20. package/dist/components/container-interactive/index.js.map +1 -0
  21. package/dist/components/flat-icon-button/flat-icon-button.d.ts +3 -0
  22. package/dist/components/flat-icon-button/flat-icon-button.d.ts.map +1 -1
  23. package/dist/components/flat-icon-button/flat-icon-button.js +111 -20
  24. package/dist/components/flat-icon-button/flat-icon-button.js.map +1 -1
  25. package/dist/components/flat-section-header/flat-section-header.d.ts +143 -0
  26. package/dist/components/flat-section-header/flat-section-header.d.ts.map +1 -0
  27. package/dist/components/flat-section-header/flat-section-header.js +275 -0
  28. package/dist/components/flat-section-header/flat-section-header.js.map +1 -0
  29. package/dist/components/flat-section-header/flat-section-header.spec.d.ts +2 -0
  30. package/dist/components/flat-section-header/flat-section-header.spec.d.ts.map +1 -0
  31. package/dist/components/flat-section-header/flat-section-header.spec.js +255 -0
  32. package/dist/components/flat-section-header/flat-section-header.spec.js.map +1 -0
  33. package/dist/components/flat-section-header/index.d.ts +2 -0
  34. package/dist/components/flat-section-header/index.d.ts.map +1 -0
  35. package/dist/components/flat-section-header/index.js +2 -0
  36. package/dist/components/flat-section-header/index.js.map +1 -0
  37. package/dist/components/flat-text-button/flat-text-button.d.ts +165 -0
  38. package/dist/components/flat-text-button/flat-text-button.d.ts.map +1 -0
  39. package/dist/components/flat-text-button/flat-text-button.js +325 -0
  40. package/dist/components/flat-text-button/flat-text-button.js.map +1 -0
  41. package/dist/components/flat-text-button/flat-text-button.spec.d.ts +2 -0
  42. package/dist/components/flat-text-button/flat-text-button.spec.d.ts.map +1 -0
  43. package/dist/components/flat-text-button/flat-text-button.spec.js +243 -0
  44. package/dist/components/flat-text-button/flat-text-button.spec.js.map +1 -0
  45. package/dist/components/flat-text-button/index.d.ts +2 -0
  46. package/dist/components/flat-text-button/index.d.ts.map +1 -0
  47. package/dist/components/flat-text-button/index.js +2 -0
  48. package/dist/components/flat-text-button/index.js.map +1 -0
  49. package/dist/components/icon-button/icon-button.d.ts +11 -3
  50. package/dist/components/icon-button/icon-button.d.ts.map +1 -1
  51. package/dist/components/icon-button/icon-button.js +126 -71
  52. package/dist/components/icon-button/icon-button.js.map +1 -1
  53. package/dist/components/index.d.ts +4 -0
  54. package/dist/components/index.d.ts.map +1 -1
  55. package/dist/components/index.js +4 -0
  56. package/dist/components/index.js.map +1 -1
  57. package/dist/components/panel/panel.d.ts +0 -1
  58. package/dist/components/panel/panel.d.ts.map +1 -1
  59. package/dist/components/panel/panel.js +7 -10
  60. package/dist/components/panel/panel.js.map +1 -1
  61. package/dist/components/section-header/section-header.d.ts +33 -39
  62. package/dist/components/section-header/section-header.d.ts.map +1 -1
  63. package/dist/components/section-header/section-header.js +124 -155
  64. package/dist/components/section-header/section-header.js.map +1 -1
  65. package/dist/components/section-header/section-header.spec.js +57 -17
  66. package/dist/components/section-header/section-header.spec.js.map +1 -1
  67. package/dist/components/text/index.d.ts +2 -0
  68. package/dist/components/text/index.d.ts.map +1 -0
  69. package/dist/components/text/index.js +2 -0
  70. package/dist/components/text/index.js.map +1 -0
  71. package/dist/components/text/text.d.ts +45 -0
  72. package/dist/components/text/text.d.ts.map +1 -0
  73. package/dist/components/text/text.js +35 -0
  74. package/dist/components/text/text.js.map +1 -0
  75. package/dist/components/text-button/text-button.d.ts +26 -23
  76. package/dist/components/text-button/text-button.d.ts.map +1 -1
  77. package/dist/components/text-button/text-button.js +114 -88
  78. package/dist/components/text-button/text-button.js.map +1 -1
  79. package/dist/components/text-button/text-button.spec.js +108 -9
  80. package/dist/components/text-button/text-button.spec.js.map +1 -1
  81. package/dist/hudini.js +4220 -467
  82. package/dist/hudini.min.js +1 -1
  83. package/dist/index.d.ts +1 -0
  84. package/dist/index.d.ts.map +1 -1
  85. package/dist/index.js +1 -0
  86. package/dist/index.js.map +1 -1
  87. package/dist/loaders/index.d.ts +2 -0
  88. package/dist/loaders/index.d.ts.map +1 -0
  89. package/dist/loaders/index.js +2 -0
  90. package/dist/loaders/index.js.map +1 -0
  91. package/dist/loaders/load-fonts.d.ts +8 -0
  92. package/dist/loaders/load-fonts.d.ts.map +1 -0
  93. package/dist/loaders/load-fonts.js +41 -0
  94. package/dist/loaders/load-fonts.js.map +1 -0
  95. package/dist/test-setup.js +8 -2
  96. package/dist/test-setup.js.map +1 -1
  97. package/dist/utils/color-variants.d.ts +43 -0
  98. package/dist/utils/color-variants.d.ts.map +1 -0
  99. package/dist/utils/color-variants.js +72 -0
  100. package/dist/utils/color-variants.js.map +1 -0
  101. package/dist/utils/index.d.ts +1 -0
  102. package/dist/utils/index.d.ts.map +1 -1
  103. package/dist/utils/index.js +1 -0
  104. package/dist/utils/index.js.map +1 -1
  105. package/package.json +3 -3
package/dist/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  export * from './components';
2
2
  export * from './exports-phaser-wind';
3
+ export * from './loaders';
3
4
  export * from './plugin';
4
5
  export * from './scene';
5
6
  export * from './utils';
@@ -1 +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"}
1
+ {"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 CHANGED
@@ -1,5 +1,6 @@
1
1
  export * from './components';
2
2
  export * from './exports-phaser-wind';
3
+ export * from './loaders';
3
4
  export * from './plugin';
4
5
  export * from './scene';
5
6
  export * from './utils';
package/dist/index.js.map CHANGED
@@ -1 +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"}
1
+ {"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"}
@@ -0,0 +1,2 @@
1
+ export * from './load-fonts';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/loaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from './load-fonts';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/loaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
@@ -0,0 +1,8 @@
1
+ type LoadFontsOptions = {
2
+ fontAwesomeUrl?: string;
3
+ baseFont?: string;
4
+ baseFontFamily?: string;
5
+ };
6
+ export declare const loadFonts: (options?: LoadFontsOptions) => Promise<void>;
7
+ export {};
8
+ //# sourceMappingURL=load-fonts.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,41 @@
1
+ import { loadFont as loadFontAwesomeForPhaser } from 'font-awesome-for-phaser';
2
+ const loadStylesheet = (url) => {
3
+ return new Promise((resolve, reject) => {
4
+ const existingLink = document.querySelector(`link[href="${url}"]`);
5
+ if (existingLink) {
6
+ resolve();
7
+ return;
8
+ }
9
+ const link = document.createElement('link');
10
+ link.rel = 'stylesheet';
11
+ link.href = url;
12
+ link.onload = () => {
13
+ resolve();
14
+ };
15
+ link.onerror = () => {
16
+ reject(new Error(`Failed to load stylesheet: ${url}`));
17
+ };
18
+ document.head.appendChild(link);
19
+ });
20
+ };
21
+ const ensureBaseFontReady = async (fontFamily) => {
22
+ const loads = [
23
+ document.fonts.load(`400 16px "${fontFamily}"`, 'A'),
24
+ document.fonts.load(`700 16px "${fontFamily}"`, 'B'),
25
+ ];
26
+ await Promise.all(loads);
27
+ await document['fonts'].ready;
28
+ };
29
+ export const loadFonts = async (options) => {
30
+ const { fontAwesomeUrl, baseFont = 'https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap', baseFontFamily = 'Bebas Neue', } = options ?? {};
31
+ try {
32
+ await loadFontAwesomeForPhaser(fontAwesomeUrl);
33
+ await loadStylesheet(baseFont);
34
+ await ensureBaseFontReady(baseFontFamily);
35
+ await document.fonts.ready;
36
+ }
37
+ catch (error) {
38
+ throw new Error(`Failed to load fonts: ${error instanceof Error ? error.message : String(error)}`);
39
+ }
40
+ };
41
+ //# sourceMappingURL=load-fonts.js.map
@@ -0,0 +1 @@
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"}
@@ -29,8 +29,14 @@ vi.mock('phaser', () => {
29
29
  return this;
30
30
  }
31
31
  }
32
- const GameObjects = { Container };
33
- return { GameObjects, Scene, default: { GameObjects, Scene } };
32
+ class Text {
33
+ // Mock Text class for Phaser.GameObjects.Text
34
+ // eslint-disable-next-line no-unused-vars
35
+ constructor(..._args) { }
36
+ }
37
+ const GameObjects = { Container, Text };
38
+ const Phaser = { GameObjects, Scene };
39
+ return { GameObjects, Scene, Phaser, default: Phaser };
34
40
  });
35
41
  // Mock phaser-wind globally (after Phaser mock)
36
42
  vi.mock('phaser-wind', () => {
@@ -1 +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"}
1
+ {"version":3,"file":"test-setup.js","sourceRoot":"","sources":["../src/test-setup.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,43 @@
1
+ import { type ColorKey } from 'phaser-wind';
2
+ /**
3
+ * Calculates a color variant by adjusting brightness.
4
+ *
5
+ * @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")
6
+ * @param tokenDiff - Amount to adjust the shade for color tokens. Positive values make it darker, negative lighter.
7
+ * For example: -400 for lighter (blue-500 → blue-100), +400 for darker (blue-500 → blue-900)
8
+ * @param colorDiff - Amount to lighten/darken CSS colors. Positive values lighten, negative values darken.
9
+ * Range: 0-100. For example: 90 to lighten, -90 to darken
10
+ * @returns The adjusted color as a number
11
+ *
12
+ * @remarks
13
+ * - If only a color name is provided without a shade (e.g., "red"), it automatically adds "-500" as the default shade
14
+ * - If a color token is provided (e.g., "blue-500"), it uses the token system to calculate variants
15
+ * by adjusting the shade value with tokenDiff (clamped between 100-900)
16
+ * - If a CSS color is provided (hex or rgb), it uses Phaser's lighten/darken methods
17
+ * with colorDiff (positive = lighten, negative = darken)
18
+ *
19
+ * @example
20
+ * ```typescript
21
+ * // Using color name only - defaults to -500
22
+ * const defaultRed = getColorVariant('red', 0, 0);
23
+ * // Returns red-500 color value
24
+ *
25
+ * // Using color token - lighter variant
26
+ * const lightBlue = getColorVariant('blue-500', -400, 0);
27
+ * // Returns blue-100 color value
28
+ *
29
+ * // Using color token - darker variant
30
+ * const darkBlue = getColorVariant('blue-500', 400, 0);
31
+ * // Returns blue-900 color value
32
+ *
33
+ * // Using CSS color - lighter
34
+ * const lightCss = getColorVariant('#3B82F6', 0, 90);
35
+ * // Returns lightened color
36
+ *
37
+ * // Using CSS color - darker
38
+ * const darkCss = getColorVariant('#3B82F6', 0, -90);
39
+ * // Returns darkened color
40
+ * ```
41
+ */
42
+ export declare const getColorVariant: (color: ColorKey | string, tokenDiff: number, colorDiff: number) => number;
43
+ //# sourceMappingURL=color-variants.d.ts.map
@@ -0,0 +1 @@
1
+ {"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"}
@@ -0,0 +1,72 @@
1
+ import Phaser from 'phaser';
2
+ import { Color, palette } from 'phaser-wind';
3
+ /**
4
+ * Calculates a color variant by adjusting brightness.
5
+ *
6
+ * @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")
7
+ * @param tokenDiff - Amount to adjust the shade for color tokens. Positive values make it darker, negative lighter.
8
+ * For example: -400 for lighter (blue-500 → blue-100), +400 for darker (blue-500 → blue-900)
9
+ * @param colorDiff - Amount to lighten/darken CSS colors. Positive values lighten, negative values darken.
10
+ * Range: 0-100. For example: 90 to lighten, -90 to darken
11
+ * @returns The adjusted color as a number
12
+ *
13
+ * @remarks
14
+ * - If only a color name is provided without a shade (e.g., "red"), it automatically adds "-500" as the default shade
15
+ * - If a color token is provided (e.g., "blue-500"), it uses the token system to calculate variants
16
+ * by adjusting the shade value with tokenDiff (clamped between 100-900)
17
+ * - If a CSS color is provided (hex or rgb), it uses Phaser's lighten/darken methods
18
+ * with colorDiff (positive = lighten, negative = darken)
19
+ *
20
+ * @example
21
+ * ```typescript
22
+ * // Using color name only - defaults to -500
23
+ * const defaultRed = getColorVariant('red', 0, 0);
24
+ * // Returns red-500 color value
25
+ *
26
+ * // Using color token - lighter variant
27
+ * const lightBlue = getColorVariant('blue-500', -400, 0);
28
+ * // Returns blue-100 color value
29
+ *
30
+ * // Using color token - darker variant
31
+ * const darkBlue = getColorVariant('blue-500', 400, 0);
32
+ * // Returns blue-900 color value
33
+ *
34
+ * // Using CSS color - lighter
35
+ * const lightCss = getColorVariant('#3B82F6', 0, 90);
36
+ * // Returns lightened color
37
+ *
38
+ * // Using CSS color - darker
39
+ * const darkCss = getColorVariant('#3B82F6', 0, -90);
40
+ * // Returns darkened color
41
+ * ```
42
+ */
43
+ export const getColorVariant = (color, tokenDiff, colorDiff) => {
44
+ // If only the color name is provided (without shade), validate and add -500 as default
45
+ let normalizedColor = color;
46
+ if (typeof color === 'string' && !color.includes('-') && !Color.isValidColorToken(color)) {
47
+ // Check if the color exists in the palette
48
+ if (color in palette && color !== 'black' && color !== 'white') {
49
+ normalizedColor = `${color}-500`;
50
+ }
51
+ }
52
+ const colorRgb = Color.rgb(normalizedColor);
53
+ if (Color.isValidColorToken(normalizedColor)) {
54
+ // Token-based calculation
55
+ const parts = normalizedColor.split('-');
56
+ const colorShade = parseInt(parts[1].toString(), 10);
57
+ const shadeMin = 100;
58
+ const shadeMax = 900;
59
+ const newShade = Math.max(Math.min(colorShade + tokenDiff, shadeMax), shadeMin).toString();
60
+ return Color.hex(`${parts[0]}-${newShade}`);
61
+ }
62
+ // CSS color calculation
63
+ const baseColor = Phaser.Display.Color.ValueToColor(colorRgb);
64
+ if (colorDiff === 0) {
65
+ return baseColor.color;
66
+ }
67
+ if (colorDiff > 0) {
68
+ return baseColor.clone().lighten(colorDiff).color;
69
+ }
70
+ return baseColor.clone().darken(Math.abs(colorDiff)).color;
71
+ };
72
+ //# sourceMappingURL=color-variants.js.map
@@ -0,0 +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,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"}
@@ -1,3 +1,4 @@
1
+ export * from './color-variants';
1
2
  export * from './get-hudini';
2
3
  export * from './get-pw-from-scene';
3
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
1
+ {"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"}
@@ -1,3 +1,4 @@
1
+ export * from './color-variants';
1
2
  export * from './get-hudini';
2
3
  export * from './get-pw-from-scene';
3
4
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
1
+ {"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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hudini",
3
- "version": "0.17.2",
3
+ "version": "0.18.1",
4
4
  "description": "🎩 Magical Phaser UI components - Reusable HUD elements for game development. Is magic, like a wizard",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -62,8 +62,8 @@
62
62
  "vitest": "^3.2.4"
63
63
  },
64
64
  "dependencies": {
65
- "phaser-wind": "0.8.0",
66
- "font-awesome-for-phaser": "0.9.0"
65
+ "phaser-wind": "0.9.1",
66
+ "font-awesome-for-phaser": "0.10.0"
67
67
  },
68
68
  "peerDependencies": {
69
69
  "phaser": "*"