@docyrus/animaguru 0.6.0

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 (198) hide show
  1. package/NOTICE.md +256 -0
  2. package/README.md +241 -0
  3. package/dist/animaguru.js +27338 -0
  4. package/package.json +37 -0
  5. package/skills/animaguru/SKILL.md +115 -0
  6. package/skills/animaguru-advertising/SKILL.md +25 -0
  7. package/skills/animaguru-advertising/references/brand-bumper.md +11 -0
  8. package/skills/animaguru-advertising/references/comparison.md +11 -0
  9. package/skills/animaguru-advertising/references/creator-testimonial.md +11 -0
  10. package/skills/animaguru-advertising/references/editorial-advertorial.md +11 -0
  11. package/skills/animaguru-advertising/references/game-reward.md +11 -0
  12. package/skills/animaguru-advertising/references/offer-promotion.md +11 -0
  13. package/skills/animaguru-advertising/references/product-launch.md +11 -0
  14. package/skills/animaguru-advertising/references/product-proof.md +11 -0
  15. package/skills/animaguru-analog-film-tape/SKILL.md +29 -0
  16. package/skills/animaguru-analog-film-tape/references/recipe.md +23 -0
  17. package/skills/animaguru-animated-data-visualization/SKILL.md +39 -0
  18. package/skills/animaguru-animated-data-visualization/references/data-contract.md +16 -0
  19. package/skills/animaguru-animated-data-visualization/references/variants.md +17 -0
  20. package/skills/animaguru-art-deco-motion/SKILL.md +29 -0
  21. package/skills/animaguru-art-deco-motion/references/recipe.md +22 -0
  22. package/skills/animaguru-ascii-crt/SKILL.md +29 -0
  23. package/skills/animaguru-ascii-crt/references/recipe.md +22 -0
  24. package/skills/animaguru-blueprint-drafting/SKILL.md +29 -0
  25. package/skills/animaguru-blueprint-drafting/references/recipe.md +22 -0
  26. package/skills/animaguru-cartoon-character-animation/SKILL.md +35 -0
  27. package/skills/animaguru-cartoon-character-animation/references/variants.md +17 -0
  28. package/skills/animaguru-cutout-animation/SKILL.md +33 -0
  29. package/skills/animaguru-cutout-animation/references/production-recipe.md +37 -0
  30. package/skills/animaguru-cutout-animation/references/variants.md +17 -0
  31. package/skills/animaguru-cutout-animation/references/visual-style.md +34 -0
  32. package/skills/animaguru-dark-tech-stage/SKILL.md +29 -0
  33. package/skills/animaguru-dark-tech-stage/references/recipe.md +23 -0
  34. package/skills/animaguru-diagram-formula-motion/SKILL.md +36 -0
  35. package/skills/animaguru-diagram-formula-motion/references/variants.md +17 -0
  36. package/skills/animaguru-engraved-relief-print/SKILL.md +29 -0
  37. package/skills/animaguru-engraved-relief-print/references/recipe.md +24 -0
  38. package/skills/animaguru-flat-vector-motion/SKILL.md +35 -0
  39. package/skills/animaguru-flat-vector-motion/references/variants.md +17 -0
  40. package/skills/animaguru-general-video/SKILL.md +20 -0
  41. package/skills/animaguru-general-video/references/ambient-loop.md +11 -0
  42. package/skills/animaguru-general-video/references/music-lyrics.md +11 -0
  43. package/skills/animaguru-general-video/references/short-film.md +11 -0
  44. package/skills/animaguru-general-video/references/titles-event.md +11 -0
  45. package/skills/animaguru-general-video/references/visual-essay.md +11 -0
  46. package/skills/animaguru-generative-light-signal/SKILL.md +29 -0
  47. package/skills/animaguru-generative-light-signal/references/recipe.md +23 -0
  48. package/skills/animaguru-glass-mosaic/SKILL.md +29 -0
  49. package/skills/animaguru-glass-mosaic/references/recipe.md +23 -0
  50. package/skills/animaguru-halftone-editorial/SKILL.md +29 -0
  51. package/skills/animaguru-halftone-editorial/references/recipe.md +23 -0
  52. package/skills/animaguru-holographic-scan/SKILL.md +29 -0
  53. package/skills/animaguru-holographic-scan/references/recipe.md +22 -0
  54. package/skills/animaguru-interface-motion/SKILL.md +36 -0
  55. package/skills/animaguru-interface-motion/references/screen-mapping.md +16 -0
  56. package/skills/animaguru-interface-motion/references/variants.md +17 -0
  57. package/skills/animaguru-isometric-worlds/SKILL.md +35 -0
  58. package/skills/animaguru-isometric-worlds/references/variants.md +17 -0
  59. package/skills/animaguru-kinetic-typography/SKILL.md +35 -0
  60. package/skills/animaguru-kinetic-typography/references/variants.md +17 -0
  61. package/skills/animaguru-miniature-diorama/SKILL.md +29 -0
  62. package/skills/animaguru-miniature-diorama/references/recipe.md +23 -0
  63. package/skills/animaguru-painterly-depth-animation/SKILL.md +35 -0
  64. package/skills/animaguru-painterly-depth-animation/references/variants.md +17 -0
  65. package/skills/animaguru-paper-popup/SKILL.md +29 -0
  66. package/skills/animaguru-paper-popup/references/recipe.md +22 -0
  67. package/skills/animaguru-photo-footage-editorial/SKILL.md +29 -0
  68. package/skills/animaguru-photo-footage-editorial/references/recipe.md +23 -0
  69. package/skills/animaguru-pixel-art-animation/SKILL.md +36 -0
  70. package/skills/animaguru-pixel-art-animation/references/variants.md +17 -0
  71. package/skills/animaguru-portal-zoom/SKILL.md +29 -0
  72. package/skills/animaguru-portal-zoom/references/recipe.md +21 -0
  73. package/skills/animaguru-risograph-print/SKILL.md +29 -0
  74. package/skills/animaguru-risograph-print/references/recipe.md +23 -0
  75. package/skills/animaguru-sand-drawing/SKILL.md +29 -0
  76. package/skills/animaguru-sand-drawing/references/recipe.md +21 -0
  77. package/skills/animaguru-shadow-theatre/SKILL.md +29 -0
  78. package/skills/animaguru-shadow-theatre/references/recipe.md +23 -0
  79. package/skills/animaguru-silkscreen-poster/SKILL.md +29 -0
  80. package/skills/animaguru-silkscreen-poster/references/recipe.md +22 -0
  81. package/skills/animaguru-stop-motion-objects/SKILL.md +29 -0
  82. package/skills/animaguru-stop-motion-objects/references/recipe.md +23 -0
  83. package/skills/animaguru-studio-product-reveal/SKILL.md +29 -0
  84. package/skills/animaguru-studio-product-reveal/references/recipe.md +23 -0
  85. package/skills/animaguru-video/SKILL.md +79 -0
  86. package/skills/animaguru-whiteboard-line-drawing/SKILL.md +34 -0
  87. package/skills/animaguru-whiteboard-line-drawing/references/variants.md +17 -0
  88. package/templates/video/AGENTS.md +34 -0
  89. package/templates/video/CLAUDE.md +19 -0
  90. package/templates/video/README.md +101 -0
  91. package/templates/video/VIDEO-STYLE-NOTICES.txt +54 -0
  92. package/templates/video/film.config.json +10 -0
  93. package/templates/video/gitignore +11 -0
  94. package/templates/video/index.html +14 -0
  95. package/templates/video/package.json +28 -0
  96. package/templates/video/public/brand/logo-mark.svg +5 -0
  97. package/templates/video/scripts/build.mjs +12 -0
  98. package/templates/video/scripts/export-html.mjs +12 -0
  99. package/templates/video/scripts/export-mp4.mjs +209 -0
  100. package/templates/video/scripts/html-export-plugin.mjs +35 -0
  101. package/templates/video/scripts/html-export.mjs +54 -0
  102. package/templates/video/scripts/install-example.mjs +32 -0
  103. package/templates/video/scripts/review-analysis.mjs +29 -0
  104. package/templates/video/scripts/review-audio.mjs +24 -0
  105. package/templates/video/scripts/review.mjs +37 -0
  106. package/templates/video/scripts/starter-film.sha256 +1 -0
  107. package/templates/video/shared/locales/en/export.json +10 -0
  108. package/templates/video/shared/locales/en/film.json +42 -0
  109. package/templates/video/shared/locales/en/player.json +31 -0
  110. package/templates/video/shared/locales/en/style-studies.json +168 -0
  111. package/templates/video/shared/locales/en/timeline.json +33 -0
  112. package/templates/video/src/assets.ts +4 -0
  113. package/templates/video/src/download.ts +27 -0
  114. package/templates/video/src/exporter.ts +70 -0
  115. package/templates/video/src/film-resources.ts +29 -0
  116. package/templates/video/src/film.ts +132 -0
  117. package/templates/video/src/main.ts +219 -0
  118. package/templates/video/src/resource-timeline.ts +193 -0
  119. package/templates/video/src/review.ts +50 -0
  120. package/templates/video/src/studies/film.ts +26 -0
  121. package/templates/video/src/studies/media.ts +46 -0
  122. package/templates/video/src/studies/model.ts +60 -0
  123. package/templates/video/src/studies/pixi-renderer.ts +121 -0
  124. package/templates/video/src/studies/scenes.ts +410 -0
  125. package/templates/video/src/studies/timing.ts +53 -0
  126. package/templates/video/src/studies/variants.ts +39 -0
  127. package/templates/video/src/style.css +111 -0
  128. package/templates/video/src/timeline-model.ts +55 -0
  129. package/templates/video/style-source-provenance.json +11 -0
  130. package/templates/video/tsconfig.json +15 -0
  131. package/templates/video/vite.config.mjs +9 -0
  132. package/vendor/pixijs-skills/LICENSE +21 -0
  133. package/vendor/pixijs-skills/provenance.json +79 -0
  134. package/vendor/pixijs-skills/skills/pixijs/SKILL.md +66 -0
  135. package/vendor/pixijs-skills/skills/pixijs/references/index.md +136 -0
  136. package/vendor/pixijs-skills/skills/pixijs-accessibility/SKILL.md +224 -0
  137. package/vendor/pixijs-skills/skills/pixijs-application/SKILL.md +293 -0
  138. package/vendor/pixijs-skills/skills/pixijs-application/references/application-options.md +314 -0
  139. package/vendor/pixijs-skills/skills/pixijs-assets/SKILL.md +303 -0
  140. package/vendor/pixijs-skills/skills/pixijs-assets/references/background.md +137 -0
  141. package/vendor/pixijs-skills/skills/pixijs-assets/references/bundles.md +122 -0
  142. package/vendor/pixijs-skills/skills/pixijs-assets/references/caching.md +143 -0
  143. package/vendor/pixijs-skills/skills/pixijs-assets/references/compressed-textures.md +120 -0
  144. package/vendor/pixijs-skills/skills/pixijs-assets/references/fonts.md +205 -0
  145. package/vendor/pixijs-skills/skills/pixijs-assets/references/gif.md +171 -0
  146. package/vendor/pixijs-skills/skills/pixijs-assets/references/manifests.md +175 -0
  147. package/vendor/pixijs-skills/skills/pixijs-assets/references/progress.md +142 -0
  148. package/vendor/pixijs-skills/skills/pixijs-assets/references/resolution.md +142 -0
  149. package/vendor/pixijs-skills/skills/pixijs-assets/references/spritesheet.md +119 -0
  150. package/vendor/pixijs-skills/skills/pixijs-assets/references/svg.md +132 -0
  151. package/vendor/pixijs-skills/skills/pixijs-assets/references/video.md +158 -0
  152. package/vendor/pixijs-skills/skills/pixijs-blend-modes/SKILL.md +215 -0
  153. package/vendor/pixijs-skills/skills/pixijs-color/SKILL.md +299 -0
  154. package/vendor/pixijs-skills/skills/pixijs-core-concepts/SKILL.md +132 -0
  155. package/vendor/pixijs-skills/skills/pixijs-core-concepts/references/render-loop.md +216 -0
  156. package/vendor/pixijs-skills/skills/pixijs-core-concepts/references/renderers.md +287 -0
  157. package/vendor/pixijs-skills/skills/pixijs-create/SKILL.md +276 -0
  158. package/vendor/pixijs-skills/skills/pixijs-custom-rendering/SKILL.md +405 -0
  159. package/vendor/pixijs-skills/skills/pixijs-custom-rendering/references/advanced-gpu.md +244 -0
  160. package/vendor/pixijs-skills/skills/pixijs-custom-rendering/references/uniform-types.md +94 -0
  161. package/vendor/pixijs-skills/skills/pixijs-environments/SKILL.md +243 -0
  162. package/vendor/pixijs-skills/skills/pixijs-events/SKILL.md +387 -0
  163. package/vendor/pixijs-skills/skills/pixijs-filters/SKILL.md +300 -0
  164. package/vendor/pixijs-skills/skills/pixijs-html-source/SKILL.md +228 -0
  165. package/vendor/pixijs-skills/skills/pixijs-math/SKILL.md +489 -0
  166. package/vendor/pixijs-skills/skills/pixijs-migration-v8/SKILL.md +415 -0
  167. package/vendor/pixijs-skills/skills/pixijs-performance/SKILL.md +489 -0
  168. package/vendor/pixijs-skills/skills/pixijs-scene-container/SKILL.md +345 -0
  169. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/SKILL.md +243 -0
  170. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/constructor-options.md +155 -0
  171. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/container-hierarchy.md +232 -0
  172. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/layers.md +145 -0
  173. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/masking.md +129 -0
  174. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/render-groups.md +140 -0
  175. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/scene-management.md +169 -0
  176. package/vendor/pixijs-skills/skills/pixijs-scene-core-concepts/references/transforms.md +198 -0
  177. package/vendor/pixijs-skills/skills/pixijs-scene-dom-container/SKILL.md +193 -0
  178. package/vendor/pixijs-skills/skills/pixijs-scene-gif/SKILL.md +233 -0
  179. package/vendor/pixijs-skills/skills/pixijs-scene-graphics/SKILL.md +576 -0
  180. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/SKILL.md +141 -0
  181. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/references/mesh-perspective.md +189 -0
  182. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/references/mesh-plane.md +159 -0
  183. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/references/mesh-rope.md +176 -0
  184. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/references/mesh-simple.md +144 -0
  185. package/vendor/pixijs-skills/skills/pixijs-scene-mesh/references/mesh.md +213 -0
  186. package/vendor/pixijs-skills/skills/pixijs-scene-particle-container/SKILL.md +323 -0
  187. package/vendor/pixijs-skills/skills/pixijs-scene-sprite/SKILL.md +120 -0
  188. package/vendor/pixijs-skills/skills/pixijs-scene-sprite/references/animated-sprite.md +262 -0
  189. package/vendor/pixijs-skills/skills/pixijs-scene-sprite/references/nineslice-sprite.md +202 -0
  190. package/vendor/pixijs-skills/skills/pixijs-scene-sprite/references/sprite.md +181 -0
  191. package/vendor/pixijs-skills/skills/pixijs-scene-sprite/references/tiling-sprite.md +216 -0
  192. package/vendor/pixijs-skills/skills/pixijs-scene-text/SKILL.md +136 -0
  193. package/vendor/pixijs-skills/skills/pixijs-scene-text/references/bitmap-text.md +232 -0
  194. package/vendor/pixijs-skills/skills/pixijs-scene-text/references/html-text.md +192 -0
  195. package/vendor/pixijs-skills/skills/pixijs-scene-text/references/split-bitmap-text.md +187 -0
  196. package/vendor/pixijs-skills/skills/pixijs-scene-text/references/split-text.md +168 -0
  197. package/vendor/pixijs-skills/skills/pixijs-scene-text/references/text.md +311 -0
  198. package/vendor/pixijs-skills/skills/pixijs-ticker/SKILL.md +292 -0
@@ -0,0 +1,53 @@
1
+ /** Absolute-time helpers: no frame history, uncontrolled timers or random sampling. */
2
+ export const clamp = (v: number, min = 0, max = 1) => Math.max(min, Math.min(max, v));
3
+ export const lerp = (a: number, b: number, t: number) => a + (b - a) * t;
4
+ export const ease = (t: number) => 1 - (1 - clamp(t)) ** 3;
5
+ export const progress = (t: number, at: number, duration = 1) => ease((t - at) / duration);
6
+ export const hash = (n: number) => { const x = Math.sin(n * 127.1 + 311.7) * 43758.5453; return x - Math.floor(x); };
7
+ export const sampled = (t: number, cadence: number) => Math.floor(t * cadence) / cadence;
8
+ /** Critically damped response with an explicit initial velocity. */
9
+ export function spring(t: number, from: number, to: number, speed = 12, velocity = 0) {
10
+ if (t <= 0)
11
+ return from;
12
+ const displacement = from - to;
13
+ return to + (displacement + (velocity + speed * displacement) * t) * Math.exp(-speed * t);
14
+ }
15
+ export type Point = readonly [
16
+ number,
17
+ number
18
+ ];
19
+ /** Truncate a polyline by measured arc length, preserving completed segments. */
20
+ export function strokePoints(points: readonly Point[], amount: number): Point[] {
21
+ if (!points.length)
22
+ return [];
23
+ let total = 0;
24
+ for (let i = 1; i < points.length; i++)
25
+ total += Math.hypot(points[i][0] - points[i - 1][0], points[i][1] - points[i - 1][1]);
26
+ let remaining = total * clamp(amount);
27
+ const result: Point[] = [points[0]];
28
+ for (let i = 1; i < points.length; i++) {
29
+ const a = points[i - 1], b = points[i];
30
+ const length = Math.hypot(b[0] - a[0], b[1] - a[1]);
31
+ if (remaining >= length) {
32
+ result.push(b);
33
+ remaining -= length;
34
+ }
35
+ else {
36
+ if (length > 0)
37
+ result.push([lerp(a[0], b[0], remaining / length), lerp(a[1], b[1], remaining / length)]);
38
+ break;
39
+ }
40
+ }
41
+ return result;
42
+ }
43
+ export type Cue = {
44
+ id: string;
45
+ time: number;
46
+ audioTime?: number;
47
+ label: string;
48
+ };
49
+ export function cueDifferences(cues: readonly Cue[], fps: number) {
50
+ return cues.filter((cue) => cue.audioTime !== undefined).map((cue) => ({
51
+ ...cue, delta: Math.abs(cue.time - cue.audioTime!), pass: Math.abs(cue.time - cue.audioTime!) <= 1 / fps,
52
+ }));
53
+ }
@@ -0,0 +1,39 @@
1
+ import { clamp, spring, type Point } from "./timing";
2
+ type TargetChange = {
3
+ time: number;
4
+ value: number;
5
+ };
6
+ /** Sum target changes so interrupted UI springs remain cold-seekable and continuous. */
7
+ export function springTrack(initial: number, changes: readonly TargetChange[], seconds: number, speed = 12) {
8
+ let value = initial, previous = initial;
9
+ for (const change of changes) {
10
+ if (seconds < change.time)
11
+ break;
12
+ value += spring(seconds - change.time, 0, change.value - previous, speed);
13
+ previous = change.value;
14
+ }
15
+ return value;
16
+ }
17
+ /** Palette changes preserve explicitly protected semantic indices. */
18
+ export function remapPalette(indices: Uint8Array, lookup: readonly number[], protectedIndices: ReadonlySet<number> = new Set()) {
19
+ return Uint8Array.from(indices, (index) => protectedIndices.has(index) ? index : lookup[index] ?? index);
20
+ }
21
+ /** A data-space annotation and its plot marks must share this projection. */
22
+ export function plotPoint(value: Point, xDomain: Point, yDomain: Point, box: {
23
+ x: number;
24
+ y: number;
25
+ width: number;
26
+ height: number;
27
+ }): Point {
28
+ if (xDomain[0] === xDomain[1] || yDomain[0] === yDomain[1])
29
+ throw new Error("Plot domain has no range.");
30
+ return [box.x + (value[0] - xDomain[0]) / (xDomain[1] - xDomain[0]) * box.width, box.y + box.height - (value[1] - yDomain[0]) / (yDomain[1] - yDomain[0]) * box.height];
31
+ }
32
+ /** A known stroke length and deadline determine reveal, rather than accumulated pen speed. */
33
+ export function strokeSchedule(lengths: readonly number[], start: number, end: number, seconds: number) {
34
+ if (end <= start || lengths.some((length) => length < 0 || !Number.isFinite(length)))
35
+ throw new Error("Invalid stroke schedule.");
36
+ const total = lengths.reduce((sum, length) => sum + length, 0);
37
+ let cursor = 0;
38
+ return lengths.map((length) => { const from = cursor; cursor += length; return length ? clamp((total * clamp((seconds - start) / (end - start)) - from) / length) : 0; });
39
+ }
@@ -0,0 +1,111 @@
1
+ * { box-sizing: border-box; }
2
+ :root { font-family: Arial, Helvetica, sans-serif; color: #172624; background: #f5f3ed; font-synthesis: none; }
3
+ body { margin: 0; }
4
+ button, input { font: inherit; }
5
+ button, a, summary { -webkit-tap-highlight-color: transparent; }
6
+ button { cursor: pointer; }
7
+ button:disabled { cursor: default; opacity: .48; }
8
+ button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid #2c6bd0; outline-offset: 5px; }
9
+ .masthead { max-width: 1536px; margin: auto; padding: 27px 48px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #dcded4; gap: 20px; }
10
+ .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
11
+ .brand img { width: 35px; height: 35px; }
12
+ .brand strong { font-size: 23px; letter-spacing: -.9px; }
13
+ .brand span { margin-left: 18px; padding-left: 24px; border-left: 1px solid #c9d0c6; font-size: 12px; color: #6b786e; }
14
+ .template { padding: 9px 14px; border: 1px solid #cad0c2; border-radius: 50px; font-size: 11px; }
15
+ main { max-width: 1380px; margin: auto; padding: 45px 48px 15px; }
16
+ .eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 1.9px; margin: 0 0 12px; color: #667660; }
17
+ .specs { font: 10px monospace; color: #6a7668; white-space: nowrap; }
18
+ #theater { border-radius: 17px; overflow: hidden; border: 1px solid #d9ddcf; background: #f4f1e9; box-shadow: 0 16px 60px #1726240d; }
19
+ #canvas-host { width: 100%; position: relative; aspect-ratio: 16 / 9; }
20
+ #canvas-host canvas { display: block; width: 100%; height: 100%; object-fit: contain; }
21
+ #loading { position: absolute; inset: 45% 0 auto; text-align: center; color: #788073; }
22
+ .transport { display: flex; align-items: center; gap: 16px; padding: 15px 20px; background: #fffcf5; border-top: 1px solid #e7e6dc; }
23
+ .transport button { border: 0; background: transparent; font-size: 11px; color: #374b40; padding: 9px 6px; white-space: nowrap; border-radius: 7px; }
24
+ .transport .primary { min-width: 68px; background: #263f32; color: #fff; padding: 10px 16px; }
25
+ .transport button:hover { background: #e6ebdd; color: #172624; }
26
+ #time { font: 11px monospace; white-space: nowrap; color: #657460; }
27
+ #timeline { min-width: 50px; flex: 1; accent-color: #356748; height: 4px; }
28
+ .tools { display: flex; align-items: center; gap: 8px; }
29
+ .transport .icon-button { display: grid; place-items: center; width: 36px; height: 36px; padding: 8px; }
30
+ .icon-button svg { width: 19px; height: 19px; pointer-events: none; }
31
+ .download-control { position: relative; }
32
+ #download-menu { position: absolute; right: 0; bottom: calc(100% + 9px); z-index: 5; width: 200px; padding: 6px; background: #fffcf5; border: 1px solid #daddcf; border-radius: 12px; box-shadow: 0 8px 32px #17262426; }
33
+ #download-menu button { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 12px 10px; text-align: left; font-size: 12px; }
34
+ #download-menu small { color: #77836f; font-size: 10px; }
35
+ #captions[aria-pressed="true"] { background: #e7ecdc; font-weight: 700; }
36
+ .player-note { display: flex; justify-content: space-between; gap: 15px; color: #7b8174; font-size: 10px; margin: 14px 2px 0; }
37
+ .preview-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
38
+ #status { color: #9a391c; font-size: 13px; margin: 10px 0; }
39
+ .resource-timeline { min-width: 0; margin: 32px 0; border: 1px solid #daddcf; border-radius: 12px; overflow: hidden; background: #fbf9f3; }
40
+ .timeline-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 16px; border-bottom: 1px solid #daddcf; }
41
+ .timeline-toolbar .eyebrow { font-size: 9px; margin: 0 0 5px; }
42
+ .timeline-count { font-size: 10px; color: #809078; }
43
+ .timeline-zoom { display: flex; align-items: center; gap: 5px; }
44
+ .timeline-zoom button { display: grid; place-items: center; border: 1px solid #d9dfd0; background: #f6f7ee; color: #3c5343; border-radius: 5px; min-width: 27px; height: 28px; padding: 4px 7px; font-size: 10px; }
45
+ .timeline-zoom button:hover:enabled { background: #e3ead8; }
46
+ .timeline-zoom svg { width: 13px; height: 13px; }
47
+ .zoom-level { font: 9px monospace; min-width: 36px; text-align: center; color: #667a61; }
48
+ .timeline-clock { margin-right: 10px; font: 11px monospace; color: #2c6bd0; font-variant-numeric: tabular-nums; }
49
+ .timeline-viewport { height: auto; max-height: none; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #c6cebd #f4f4eb; }
50
+ .timeline-content { position: relative; }
51
+ .timeline-ruler-row, .resource-row { display: grid; grid-template-columns: var(--resource-label-width, 160px) minmax(0, 1fr); }
52
+ .timeline-ruler-row { position: sticky; top: 0; z-index: 6; height: 34px; background: #f2f3e9; border-bottom: 1px solid #d9dfcf; }
53
+ .timeline-corner { position: sticky; left: 0; z-index: 7; padding: 11px 12px; background: #f2f3e9; border-right: 1px solid #d9dfcf; color: #7a8a72; font-size: 9px; }
54
+ .timeline-ruler { position: relative; touch-action: none; cursor: col-resize; outline-offset: -3px; overflow: hidden; }
55
+ .timeline-ruler:focus-visible { outline: 2px solid #2c6bd0; }
56
+ .timeline-ticks { position: absolute; inset: 0; }
57
+ .timeline-tick { position: absolute; top: 10px; bottom: 0; font: 9px monospace; color: #85937a; transform: translateX(-50%); pointer-events: none; }
58
+ .timeline-tick::after { content: ""; position: absolute; bottom: 0; left: 50%; height: 5px; width: 1px; background: #abb69e; }
59
+ .timeline-tick.first { transform: none; padding-left: 5px; }.timeline-tick.first::after { left: 0; }
60
+ .timeline-tick.last { transform: translateX(-100%); padding-right: 5px; }.timeline-tick.last::after { left: auto; right: 0; }
61
+ .timeline-handle { position: absolute; top: 0; bottom: 0; width: 2px; background: #2c6bd0; pointer-events: none; }
62
+ .timeline-handle::before { content: ""; position: absolute; top: 0; left: -4px; width: 10px; height: 8px; background: #2c6bd0; clip-path: polygon(0 0,100% 0,100% 60%,50% 100%,0 60%); }
63
+ .resource-row { height: 39px; border-bottom: 1px solid #e6e8dc; }
64
+ .resource-label { position: sticky; left: 0; z-index: 4; display: flex; align-items: center; gap: 8px; min-width: 0; padding: 0 11px; background: #fbf9f3; border-right: 1px solid #d9dfcf; }
65
+ .resource-icon { color: #819372; display: flex; flex: none; }.resource-icon svg { width: 14px; height: 14px; }
66
+ .kind-text .resource-icon { color: #9a83b7; }.kind-captions .resource-icon { color: #ab914b; }.kind-audio .resource-icon { color: #438d7a; }.kind-video .resource-icon, .kind-image .resource-icon { color: #6388bd; }
67
+ .resource-name { font-size: 10px; color: #596d52; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
68
+ .resource-state { margin-left: auto; font-size: 8px; color: #8b927e; }
69
+ .resource-lane { position: relative; background-image: linear-gradient(to right, #dfe4d480 1px, transparent 1px); background-size: var(--resource-grid-step, 100px) 100%; }
70
+ .resource-clip { position: absolute; top: 5px; bottom: 5px; display: flex; align-items: center; min-width: 1px; max-width: 100%; border: 1px solid #c9d5ae; border-radius: 4px; background: #e3ebd1; color: #5b734a; padding: 0 7px; opacity: .72; text-align: left; overflow: hidden; }
71
+ .resource-clip span { font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
72
+ .kind-text .resource-clip { background: #ece4f3; border-color: #d9cce4; color: #836b98; }
73
+ .kind-captions .resource-clip { background: #f4edcd; border-color: #e5d99f; color: #91792f; }
74
+ .kind-audio .resource-clip { background: #d5e9df; border-color: #aed2c0; color: #3d7b62; }
75
+ .kind-video .resource-clip, .kind-image .resource-clip { background: #dee8f4; border-color: #becfe8; color: #5b7fae; }
76
+ .resource-clip.active, .resource-clip:hover { opacity: 1; filter: saturate(1.12); }
77
+ .resource-clip.selected { border-color: #2c6bd0; box-shadow: inset 0 0 0 1px #2c6bd0; opacity: 1; }
78
+ .resource-clip:focus-visible { outline-offset: -2px; }
79
+ .resource-off .resource-clip { opacity: .32; }
80
+ .resource-playhead { position: absolute; top: 34px; bottom: 0; z-index: 3; width: 1px; background: #2c6bd0; pointer-events: none; }
81
+ .timeline-inspector { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-height: 54px; padding: 11px 15px; border-top: 1px solid #daddcf; color: #859379; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
82
+ .timeline-inspector strong { color: #4b644a; font-weight: 500; }
83
+ details { font-size: 12px; color: #6e7b6a; margin: 25px 0 5px; }
84
+ summary { cursor: pointer; width: fit-content; }
85
+ #transcript { line-height: 1.8; }
86
+ footer { max-width: 1380px; margin: auto; padding: 25px 48px; display: flex; justify-content: space-between; color: #85917e; font-size: 10px; }
87
+ footer span:last-child { font-size: 8px; letter-spacing: 1.5px; }
88
+ #theater:fullscreen { border: none; border-radius: 0; display: flex; flex-direction: column; justify-content: center; background: #15221c; }
89
+ #theater:fullscreen #canvas-host { min-height: 0; flex: 1; aspect-ratio: auto; }
90
+ .capture .masthead, .capture .transport, .capture .player-note, .capture #resource-timeline, .capture details, .capture footer { display: none; }
91
+ .capture main { padding: 0; max-width: none; }
92
+ .capture #theater { border: 0; border-radius: 0; box-shadow: none; }
93
+ .capture #canvas-host { height: 100vh; aspect-ratio: auto; }
94
+ .capture #status { display: none; }
95
+ .embed { height: 100vh; overflow: hidden; }
96
+ .embed #app, .embed main { height: 100%; }
97
+ .embed main { padding: 0; max-width: none; }
98
+ .embed .masthead, .embed .player-note, .embed #resource-timeline, .embed details, .embed footer, .embed .download-control, .embed #status { display: none; }
99
+ .embed #theater { height: 100%; display: flex; flex-direction: column; border: 0; border-radius: 0; box-shadow: none; }
100
+ .embed #canvas-host { flex: 1; min-height: 0; aspect-ratio: auto !important; }
101
+ .embed .transport { flex: none; }
102
+ .embed.no-controls .transport { display: none; }
103
+ @media (max-width: 750px) {
104
+ .masthead { padding: 20px; }.brand span { display: none; }.brand strong { font-size: 20px; }.template { font-size: 9px; padding: 8px 10px; }
105
+ main { padding: 30px 20px 10px; }
106
+ .transport { flex-wrap: wrap; gap: 12px; padding: 12px; }.tools { justify-content: space-between; width: 100%; }.tools button { min-height: 36px; }
107
+ .player-note { flex-direction: column; gap: 6px; font-size: 9px; }
108
+ .timeline-toolbar { flex-wrap: wrap; padding: 13px; }.timeline-zoom { margin-left: auto; }.timeline-clock { margin-right: 4px; }
109
+ footer { padding: 25px 20px; }footer span:last-child { display: none; }
110
+ }
111
+ @media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto; } }
@@ -0,0 +1,55 @@
1
+ export type ResourceKind = "graphics" | "image" | "video" | "text" | "captions" | "audio";
2
+ export type ResourceClip = { id: string; label: string; start: number; end: number; source?: string };
3
+ export type ResourceTrack = { id: string; label: string; kind: ResourceKind; clips: ResourceClip[] };
4
+
5
+ export function frameTime(seconds: number, duration: number, fps: number) {
6
+ return Math.max(0, Math.min(duration, Math.round((Number.isFinite(seconds) ? seconds : 0) * fps) / fps));
7
+ }
8
+
9
+ export function timecode(seconds: number, fps: number) {
10
+ const frames = Math.max(0, Math.round(seconds * fps));
11
+ const wholeSeconds = Math.floor(frames / fps);
12
+ return `${String(Math.floor(wholeSeconds / 60)).padStart(2, "0")}:${String(wholeSeconds % 60).padStart(2, "0")}:${String(frames % fps).padStart(2, "0")}`;
13
+ }
14
+
15
+ export function rulerTicks(duration: number, width: number, fps: number) {
16
+ const minimum = duration / Math.max(1, width / 76);
17
+ const steps = [1 / fps, 0.1, 0.2, 0.5, 1, 2, 5, 10, 15, 30, 60, 120, 300, 600];
18
+ const step = steps.find((value) => value >= minimum) ?? Math.ceil(minimum / 600) * 600;
19
+ const ticks = [0];
20
+ for (let value = step; value < duration; value += step) {
21
+ if (duration - value > step * 0.6) ticks.push(frameTime(value, duration, fps));
22
+ }
23
+ if (duration > 0) ticks.push(duration);
24
+ return [...new Set(ticks)];
25
+ }
26
+
27
+ export function clipRange(clip: ResourceClip, duration: number) {
28
+ const start = Math.max(0, clip.start);
29
+ const end = Math.min(duration, clip.end);
30
+ if (!Number.isFinite(start) || !Number.isFinite(end) || end <= start || duration <= 0) return null;
31
+ return { start, end, left: start / duration * 100, width: (end - start) / duration * 100 };
32
+ }
33
+
34
+ /** Keep scrubbing responsive when decoding a video takes longer than pointer events. */
35
+ export function createSeekQueue(seek: (seconds: number) => Promise<void>, onError: (error: unknown) => void) {
36
+ let pending: number | undefined;
37
+ let running = false;
38
+ let cancelled = false;
39
+ const drain = async () => {
40
+ if (running) return;
41
+ running = true;
42
+ try {
43
+ while (!cancelled && pending !== undefined) {
44
+ const time = pending;
45
+ pending = undefined;
46
+ await seek(time);
47
+ }
48
+ } catch (error) { pending = undefined; onError(error); }
49
+ finally { running = false; }
50
+ };
51
+ return {
52
+ request(seconds: number) { if (cancelled) return; pending = seconds; void drain(); },
53
+ cancel() { cancelled = true; pending = undefined; },
54
+ };
55
+ }
@@ -0,0 +1,11 @@
1
+ {
2
+ "lemo-opuscar": {
3
+ "url": "https://github.com/lemomo-ai/lemo-opuscar",
4
+ "commit": "b65efe6ea393fdc71212898ea4c57c754cfefa46"
5
+ },
6
+ "awesome-opus5-5-videos": {
7
+ "url": "https://github.com/yihui-dev/awesome-opus5-5-videos",
8
+ "commit": "3d54892e2ae5b0e8d337171e6508bba4cec01ab8"
9
+ },
10
+ "scope": "Material and motion guidance; original scene study implementations. No source demo assets or creator footage bundled."
11
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "compilerOptions": {
3
+ "target": "ES2022",
4
+ "module": "ESNext",
5
+ "moduleResolution": "bundler",
6
+ "lib": ["ES2022", "DOM", "DOM.Iterable"],
7
+ "strict": true,
8
+ "skipLibCheck": true,
9
+ "noEmit": true,
10
+ "resolveJsonModule": true,
11
+ "allowImportingTsExtensions": true,
12
+ "types": ["vite/client"]
13
+ },
14
+ "include": ["src"]
15
+ }
@@ -0,0 +1,9 @@
1
+ import { defineConfig } from "vite";
2
+ import { fileURLToPath } from "node:url";
3
+ import { htmlExportPlugin } from "./scripts/html-export-plugin.mjs";
4
+
5
+ export default defineConfig({
6
+ base: "./",
7
+ server: { watch: { ignored: ["**/production/exports/**"] } },
8
+ plugins: [htmlExportPlugin(fileURLToPath(new URL("./", import.meta.url)))],
9
+ });
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 PixiJS
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
@@ -0,0 +1,79 @@
1
+ {
2
+ "source": "https://github.com/pixijs/pixijs-skills",
3
+ "license": "MIT",
4
+ "snapshotDate": "2026-10-06",
5
+ "origin": "Installed official skills snapshot; file hashes identify the bundled content.",
6
+ "files": {
7
+ "pixijs/SKILL.md": "2fdfe58823b46cad1d931747565016733e415ab07f2d3fb4dca58640b5ff82ce",
8
+ "pixijs/references/index.md": "d9cb110d63eedb6e79bfadbce86c56b2c253c55141eb89efeff787b2859c5ed9",
9
+ "pixijs-accessibility/SKILL.md": "4f97542f4209ae1031361bad982fd170e47490373cf3de68a6c018b9e58149bb",
10
+ "pixijs-application/SKILL.md": "99a4dc0e2625e3d95badf01b2a6715c1573f3ce5bfcd3298aaacf18533de12fb",
11
+ "pixijs-application/references/application-options.md": "071d9db92511f460f7f2d1d68186e1beb958764f5227060d295acf0cd21c352a",
12
+ "pixijs-assets/SKILL.md": "c34d4b5729ea9a8c7f085ab5150e294f670095580c718af985a3fcb3f8741ca9",
13
+ "pixijs-assets/references/background.md": "2fbd10a8297ab3c17217d89da721e4586806e27a986ce1fac8b44ae4bea2274c",
14
+ "pixijs-assets/references/bundles.md": "a624c5a8371e576d3078834c050711cb1ff44893ce72887eeddcc04bd0c9aef0",
15
+ "pixijs-assets/references/caching.md": "bfae76d4b28a312fe0a16dece584d6e3404d3af67579b7f6724b956dae0f3f49",
16
+ "pixijs-assets/references/compressed-textures.md": "8d155c18976921ed085fd0282e0001f409433dc6ca2933a71899648d5794db3e",
17
+ "pixijs-assets/references/fonts.md": "a8d205a18307c38bead2fb7833c230a1923126a9b6c75ea45b62a73814d7b017",
18
+ "pixijs-assets/references/gif.md": "b0c0ec364af806c0b199a9740e1a611f42b6f28c37c934c89832cd14f627aac7",
19
+ "pixijs-assets/references/manifests.md": "f8a082f85ebae434ad7f76990219f701e49661eddb72a5d92b9e1cdbb39624ac",
20
+ "pixijs-assets/references/progress.md": "e00dbb268ae044203bce83fd39ffaf0269eefa47fe3f3fba4b23a2a84a5dffad",
21
+ "pixijs-assets/references/resolution.md": "813e921bb8171a2f3d60d5fa95e549c4870b8850cdceef554b930bfb6d6bb53e",
22
+ "pixijs-assets/references/spritesheet.md": "61f8b710bbd8f619f63740a6691391963f7211afa3e40df2c94a09e348cfffe7",
23
+ "pixijs-assets/references/svg.md": "e12d2be0ad1fa1a9cd01c2662e35d1afe594071584473d0fed6ca670e9ea4171",
24
+ "pixijs-assets/references/video.md": "5f00ebd6d63028729c18dfe510608350a1380dd0140da21f2c1c1cd0a9770cc6",
25
+ "pixijs-blend-modes/SKILL.md": "a6caea6766b1dd31efa35171ec2a29ec5ea4e0728f14d6847570804f71feb1a5",
26
+ "pixijs-color/SKILL.md": "7635f6e165038a96602b161273f2549bc74ebe51e147eab4c7c1811cc988c3b9",
27
+ "pixijs-core-concepts/SKILL.md": "cf632dd602779c0f584fdbb6f5b0a022c68cfdb408882c243ba0cff43d2957d9",
28
+ "pixijs-core-concepts/references/render-loop.md": "5f70bb13b0315ceed2d828011eceacc56596ff98092569092fed4f8c40c5fad1",
29
+ "pixijs-core-concepts/references/renderers.md": "4863dfb738d4d31e1801b421844eae72c92d7c7b702779f79fc82484d2da3fc9",
30
+ "pixijs-create/SKILL.md": "a254ac504b83bf276f56f20ff89f5bbb5fbb3a8fdc7be67c957ecb834ae3ec71",
31
+ "pixijs-custom-rendering/SKILL.md": "0037d1fbdd82652c0fc32491f34d02287d84c2db49deb65ac024307b8d01021b",
32
+ "pixijs-custom-rendering/references/advanced-gpu.md": "ffbde5ee149d75f579ad9264d9ccfa11e4aa88a9633a75176e7fe72d50d4c8cd",
33
+ "pixijs-custom-rendering/references/uniform-types.md": "dee566401a5bc795bb9ef6bc1a0a58fd23ac7850dbe6af55d8952a8927e574d7",
34
+ "pixijs-environments/SKILL.md": "5cfab873cbf8c68ce3e010bc96262d88e4e924ae6fa8345c614ae8256f22360e",
35
+ "pixijs-events/SKILL.md": "a74a29339baa9bc80ceb1f4e837736edb2c5afb62ff34dab89d1ab0a0cc9e4b7",
36
+ "pixijs-filters/SKILL.md": "bdf834030fff36be20f0c566d970999ae2429994487a56054be8d2dc8d26a056",
37
+ "pixijs-html-source/SKILL.md": "8061235e80fad00c23ca274d67e0198246b49c6093511fa983ca347ba2ceb492",
38
+ "pixijs-math/SKILL.md": "62a2df69568937cb3353d67b9dc35b19db7cba477f179f34137d110b12989550",
39
+ "pixijs-migration-v8/SKILL.md": "e3c1c40b5c8385df6eb055067c9c23598d78d1b96cf519a97b2acb3f3b057cad",
40
+ "pixijs-performance/SKILL.md": "994bcad9687a5ad698b466436ad7d1120e47864bfadb86c9d17180fe90cf194b",
41
+ "pixijs-scene-container/SKILL.md": "8d4ba1f4a3a7703b86cfce896119556dd624636a40c2db0d70c9b29b2f62b246",
42
+ "pixijs-scene-core-concepts/SKILL.md": "ad9f459a74de66784d1ba7930fc080cfaf14b38a79f4e6a10185f23914998f40",
43
+ "pixijs-scene-core-concepts/references/constructor-options.md": "b49d74adeaed4820497b2aef62e934a18ea83e4fc03dd7feb67552a2e3fff3b7",
44
+ "pixijs-scene-core-concepts/references/container-hierarchy.md": "3affc169278cce85b89cd09c2851bfa251c1ca7addcfb92243d51b4e355fe10a",
45
+ "pixijs-scene-core-concepts/references/layers.md": "7725724b7cf7f0f6954a8efdbe1cb1ac7d5b3c2e1e44042ebe5eb5e6c07c507e",
46
+ "pixijs-scene-core-concepts/references/masking.md": "247543de62c58604c8b677cce54b85e271b75cda086c46da6cbad4e6537cba3b",
47
+ "pixijs-scene-core-concepts/references/render-groups.md": "7eaee69a0fcc41f1a946bf37a227d90e054e3914b6301ecf5468a882f7a0d92c",
48
+ "pixijs-scene-core-concepts/references/scene-management.md": "5433c35f8c57621b7b4d1e719a6d2ad433b9831b3ece2a5cb5417cdc3ed4ddb9",
49
+ "pixijs-scene-core-concepts/references/transforms.md": "6e8c76a297fb14b96f2a9b12e9c7b7c586a5509e680391e318b5dc90513c8ad6",
50
+ "pixijs-scene-dom-container/SKILL.md": "6c65323e40999ca97ad752758148193e55185706a44b8656e278a237d88c2a22",
51
+ "pixijs-scene-gif/SKILL.md": "9f8e2f9e2c70ba427695e67126948188e2868109e86449f31e06b822fe2ae078",
52
+ "pixijs-scene-graphics/SKILL.md": "7a1e683086170b086d4e79f5d80bd760b67ce63b90b30d17ef2079ae22c746a0",
53
+ "pixijs-scene-mesh/SKILL.md": "64b76b7d10b8cb3e38239bc9a54e314ef70812ce2828ff35b5bdec6800c53448",
54
+ "pixijs-scene-mesh/references/mesh-perspective.md": "65f267d9627c7f0521f9810acca266710a7c6522cc8348b44f432776f18bb7df",
55
+ "pixijs-scene-mesh/references/mesh-plane.md": "803f49721b848b3383f4d8c84c7a0c674f05cfc2495b01c7e7f90fe6b86cc490",
56
+ "pixijs-scene-mesh/references/mesh-rope.md": "2849b988460d8798936206a467f46b678d20b2fe1d07f1a44b745ec0e04731ca",
57
+ "pixijs-scene-mesh/references/mesh-simple.md": "2b5899de195268262555b576e981632554665b376197949a7b1330f7bab205c9",
58
+ "pixijs-scene-mesh/references/mesh.md": "e0aa3b7488eb14aecc183b88a5ac1c674aefbc48e9d5d87f99232727ca65f542",
59
+ "pixijs-scene-particle-container/SKILL.md": "b322029602cbb088bd298e5b914f8056e4539a50f1d6054e5d183c11b731bfdf",
60
+ "pixijs-scene-sprite/SKILL.md": "2ca79e5aaedea4898f7a972676fa93166a6c35ebe1ab63b8331e76899e081345",
61
+ "pixijs-scene-sprite/references/animated-sprite.md": "5fa8fe00d5714f7a6d5ceb0d88e99a03ad8b57fe147ed0c8e5608bfcb957657d",
62
+ "pixijs-scene-sprite/references/nineslice-sprite.md": "e82b46b27ca57da9900d4981fe3e2e7cc4ade00064232053b2e8bbf744da37f3",
63
+ "pixijs-scene-sprite/references/sprite.md": "1fefed94d0f5f8c6d8e78a860234076a8124ab14f8a618d3e8b61b51525da0af",
64
+ "pixijs-scene-sprite/references/tiling-sprite.md": "e2645352a1f432997f5fbcd94a3b523ac750f73b444ec1df44471de61ef479db",
65
+ "pixijs-scene-text/SKILL.md": "1ebbd6a643050af5bc42c6db445029149e6d17b7af132db4772792ee33106472",
66
+ "pixijs-scene-text/references/bitmap-text.md": "696f4227edef38c150a7bdb8caa1fa2ae8d23742d318af6391f57b1b325a3f8d",
67
+ "pixijs-scene-text/references/html-text.md": "07f90d0e08fdaa8a6650e931c583ab656c6d0b278bbc7747d43a4a87906212d8",
68
+ "pixijs-scene-text/references/split-bitmap-text.md": "8bd467a5a5daf2e1482dc846b741258260ef047c32c278063edefa08bb914abd",
69
+ "pixijs-scene-text/references/split-text.md": "6a57784c73c5d3ca10c6ecde9c90bb4f087d41728d86d836ff3503ed3677da27",
70
+ "pixijs-scene-text/references/text.md": "afbd3052b411d5bf2c6545d13573bbf1c5f0c8cd7ce394dd8ebb07a6ef9141f1",
71
+ "pixijs-ticker/SKILL.md": "f9831fff4604279e45fe6a605a244d5535fb2669e6f6a92a184d61e35b9b4a64"
72
+ },
73
+ "normalizations": {
74
+ "pixijs-custom-rendering/references/uniform-types.md": {
75
+ "originalSha256": "ab80615c39f48b9a340693cf677b48e86a7fb0c6ecf8d12be9155ea1e860e556",
76
+ "change": "Removed an extra trailing blank line; documentation content is unchanged."
77
+ }
78
+ }
79
+ }
@@ -0,0 +1,66 @@
1
+ ---
2
+ name: pixijs
3
+ description: "Use this skill first for ANY PixiJS v8 task; it routes to the right specialized skill for the job. Covers the full PixiJS surface: Application setup, the scene graph (Container, Sprite, Graphics, Text, Mesh, ParticleContainer, DOMContainer, GifSprite), rendering (WebGL/WebGPU/Canvas, render loop, custom shaders, filters, blend modes), assets, events, color, math, ticker, accessibility, performance, environments, migration from v7, and project scaffolding. Triggers on: pixi, pixi.js, pixijs, PixiJS, v8, Application, app.init, Sprite, Container, Graphics, Text, Mesh, ParticleContainer, DOMContainer, GifSprite, Assets, Ticker, renderer, WebGL, WebGPU, scene graph, filter, shader, blend mode, texture, 3D texture, depth slice, layer, storage texture, BitmapText, create-pixi, how do I draw, how do I render, how do I animate in pixi."
4
+ license: MIT
5
+ ---
6
+
7
+ Entry point for the PixiJS v8 skill collection. PixiJS is the fastest library available for the web, working across all devices and allowing you to create rich, interactive graphics and cross-platform applications using WebGL, WebGPU, and Canvas as a fallback.
8
+
9
+ ## How to use this skill
10
+
11
+ 1. Find the specialized skill in the router below that best matches the task.
12
+ 2. Load that skill's `SKILL.md` and follow its guidance.
13
+ 3. If no sub-skill fits (the task references a specific class, function, option, or API surface not listed below), **WebFetch `https://pixijs.download/release/docs/llms.txt`**. That file is the auto-generated, always-current index of the full PixiJS API and guides. Each entry links to a `.html.md` page you can WebFetch for the detailed content.
14
+
15
+ For the long-form description and trigger keywords of every skill, see [references/index.md](references/index.md).
16
+
17
+ ## Skill router
18
+
19
+ ### Foundations
20
+
21
+ | Skill | Load when... |
22
+ |---|---|
23
+ | [pixijs-application](../pixijs-application/SKILL.md) | Creating or configuring a PixiJS `Application`, calling `app.init()`, accessing `app.stage`/`renderer`/`canvas`/`screen`, resize/ticker plugins, `app.destroy()`. |
24
+ | [pixijs-core-concepts](../pixijs-core-concepts/SKILL.md) | Understanding the renderer pipeline, choosing WebGL/WebGPU/Canvas, render loop internals, systems and pipes, renderer loader extensions, rendering into a `RenderTexture`/`RenderTarget` (`flipY`, `mipLevel`, `layer`, `bind`/`push`/`pop`, depth) or a depth slice of a 3D texture, WebGL context loss and WebGPU device loss. |
25
+ | [pixijs-create](../pixijs-create/SKILL.md) | Scaffolding a new project with the `create-pixi` CLI (bundler-vite, creation-web, framework-react templates), adding PixiJS to an existing project, or setting up `tsconfig.json` for TypeScript 5, 6, or 7 (`moduleResolution`, `@webgpu/types`, `@types/web`). |
26
+ | [pixijs-environments](../pixijs-environments/SKILL.md) | Running PixiJS in Web Workers, Node/SSR, or strict-CSP contexts (`DOMAdapter`, `WebWorkerAdapter`, `pixi.js/unsafe-eval`). |
27
+ | [pixijs-migration-v8](../pixijs-migration-v8/SKILL.md) | Upgrading from v7 to v8 or fixing v7 patterns (`beginFill`/`endFill`, `@pixi/*` packages, `BaseTexture`, `DisplayObject`). |
28
+ | [pixijs-scene-core-concepts](../pixijs-scene-core-concepts/SKILL.md) | Understanding the scene graph as a whole: containers vs leaves, transforms, render order, masking, `RenderLayer`. |
29
+
30
+ ### Scene Objects
31
+
32
+ | Skill | Load when... |
33
+ |---|---|
34
+ | [pixijs-scene-container](../pixijs-scene-container/SKILL.md) | Working with `Container`: `addChild`/`removeChild`, transforms, `zIndex`, bounds, `toGlobal`/`toLocal`, `destroy`. |
35
+ | [pixijs-scene-sprite](../pixijs-scene-sprite/SKILL.md) | Drawing images: `Sprite`, `AnimatedSprite`, `NineSliceSprite`, `TilingSprite`. |
36
+ | [pixijs-scene-graphics](../pixijs-scene-graphics/SKILL.md) | Drawing vector shapes or paths: `Graphics`, `GraphicsContext`, `fill`/`stroke`, `FillGradient`, `FillPattern`, `textureSpace`, texture and pattern fills, SVG import (`svg()`, gradients). |
37
+ | [pixijs-scene-text](../pixijs-scene-text/SKILL.md) | Rendering text: `Text`, `BitmapText`, `HTMLText`, `SplitText`, `TextStyle`. |
38
+ | [pixijs-scene-mesh](../pixijs-scene-mesh/SKILL.md) | Custom geometry: `Mesh`, `MeshSimple`, `MeshPlane`, `MeshRope`, `PerspectiveMesh`. |
39
+ | [pixijs-scene-particle-container](../pixijs-scene-particle-container/SKILL.md) | Rendering thousands of lightweight sprites: `ParticleContainer`, `Particle`, `dynamicProperties`. |
40
+ | [pixijs-scene-dom-container](../pixijs-scene-dom-container/SKILL.md) | Overlaying HTML elements on the canvas: `DOMContainer`, `pixi.js/dom`. |
41
+ | [pixijs-scene-gif](../pixijs-scene-gif/SKILL.md) | Displaying animated GIFs: `GifSprite`, `GifSource`, `pixi.js/gif`. |
42
+ | [pixijs-html-source](../pixijs-html-source/SKILL.md) | Rendering live HTML/DOM elements or snapshots as textures (experimental, needs a browser that supports the HTML-in-Canvas spec): `HTMLSource`, `ElementImageSource`, `pixi.js/html-source`, `requestPaint`. |
43
+
44
+ ### Utilities
45
+
46
+ | Skill | Load when... |
47
+ |---|---|
48
+ | [pixijs-assets](../pixijs-assets/SKILL.md) | Loading resources: `Assets.init`, `Assets.load`, bundles, manifests, spritesheets, caching. |
49
+ | [pixijs-color](../pixijs-color/SKILL.md) | Creating or converting colors: `Color` class, hex/rgb/hsl, `tint`, `premultiply`. |
50
+ | [pixijs-events](../pixijs-events/SKILL.md) | Handling pointer/mouse/touch/wheel input: `eventMode`, `FederatedEvent`, `hitArea`, `cursor`, drag. |
51
+ | [pixijs-math](../pixijs-math/SKILL.md) | Points, vectors, matrices, shapes, hit testing: `Point`, `Matrix`, `Rectangle`, `Polygon`, `Triangle`, `strokeContains`, `containsRect`, `Matrix.decompose` (mirrored matrices), `toGlobal`/`toLocal`. |
52
+ | [pixijs-ticker](../pixijs-ticker/SKILL.md) | Per-frame logic or controlling the render loop: `Ticker`, `deltaTime`, `UPDATE_PRIORITY`, `maxFPS`. |
53
+
54
+ ### Advanced
55
+
56
+ | Skill | Load when... |
57
+ |---|---|
58
+ | [pixijs-accessibility](../pixijs-accessibility/SKILL.md) | Screen reader or keyboard navigation: `AccessibilitySystem`, `accessibleTitle`, `tabIndex`. |
59
+ | [pixijs-blend-modes](../pixijs-blend-modes/SKILL.md) | Compositing with blend modes: `add`, `multiply`, `screen`, `overlay`, `pixi.js/advanced-blend-modes`. |
60
+ | [pixijs-custom-rendering](../pixijs-custom-rendering/SKILL.md) | Writing custom shaders, uniforms, or batchers: `Shader.from`, `GlProgram`/`GpuProgram`, `UniformGroup`, custom `Filter`, WGSL `override` constants, `gpuLayout`, `TextureView`, `Buffer.update`, `TexturePool`, 3D/array textures, storage textures, render bundles, custom pipes. |
61
+ | [pixijs-filters](../pixijs-filters/SKILL.md) | Applying visual effects: `BlurFilter`, `ColorMatrixFilter`, `DisplacementFilter`, `Filter.from`, `pixi-filters`. |
62
+ | [pixijs-performance](../pixijs-performance/SKILL.md) | Profiling or optimizing FPS, draw calls, GPU memory: culling, `GCSystem`, `cacheAsTexture`, object pooling, transient MSAA render textures, render bundles, filter texture sizing. |
63
+
64
+ ## Fallback: canonical PixiJS docs
65
+
66
+ If the task references a class, function, option, or API surface not covered by any sub-skill above, **WebFetch `https://pixijs.download/release/docs/llms.txt`**. It's the auto-generated index of the full PixiJS API and guides, regenerated on every release. Each entry links to a `.html.md` page you can WebFetch for the detailed content. Use this fallback whenever the router table doesn't point at an obvious match.
@@ -0,0 +1,136 @@
1
+ # PixiJS Skills: Full Index
2
+
3
+ Detailed routing table for the PixiJS v8 skill collection. Each entry lists the skill's full description and the trigger keywords that should match it. For a scannable short-form table, see the parent `SKILL.md`.
4
+
5
+ ## Foundations
6
+
7
+ ### pixijs-application
8
+ Create and configure a PixiJS v8 `Application`. Covers `new Application()` + async `app.init()` options (width, height, background, antialias, resolution, autoDensity, preference, resizeTo, autoStart, sharedTicker, canvas), `app.stage`/`renderer`/`canvas`/`screen` access, `ResizePlugin`, `TickerPlugin`, and `app.destroy()`.
9
+
10
+ **Triggers:** Application, app.init, app.stage, app.renderer, app.canvas, app.screen, ApplicationOptions, resizeTo, preference, autoStart, sharedTicker, app.destroy.
11
+
12
+ ### pixijs-core-concepts
13
+ How PixiJS v8 renders frames: the systems-and-pipes renderer, the render loop, and how the library adapts to different environments. Covers `WebGLRenderer`/`WebGPURenderer`/`CanvasRenderer` selection, `renderer.render()` pipeline, environment detection, and pointers to per-topic deep dives.
14
+
15
+ **Triggers:** renderer, WebGL, WebGPU, Canvas, render loop, render pipeline, systems, environments, autoDetectRenderer, RenderTexture, RenderTarget, render to texture, flipY, mipLevel, layer, 3D texture, depth slice, renderTarget.bind, copyToTexture, copyDepthTexture, depth-only, WebGLLoader, WebGPULoader, CanvasLoader, RendererLoader, lazy-load renderer systems, context lost, webglcontextlost, device lost, GPUDevice.lost.
16
+
17
+ ### pixijs-create
18
+ Scaffold a new PixiJS v8 project with the `create-pixi` CLI or add PixiJS to an existing project. Covers npm/yarn/pnpm/bun create commands, interactive vs non-interactive flows, available template presets (bundler-vite, bundler-webpack, bundler-esbuild, bundler-import-map, creation-web, framework-react, extension-default), Node version requirements, TypeScript 5/6/7 tsconfig setup (`moduleResolution`, `@webgpu/types`, `@types/web`), and post-scaffold dev flow.
19
+
20
+ **Triggers:** create pixi.js, npm create, scaffold, template, bundler-vite, bundler-webpack, creation-web, framework-react, new project, getting started, TypeScript, tsconfig, moduleResolution, @webgpu/types, @types/web, Cannot find name GPUTextureUsage.
21
+
22
+ ### pixijs-environments
23
+ Run PixiJS v8 outside a standard browser: Web Workers, `OffscreenCanvas`, Node/SSR, or CSP-restricted contexts. Covers `DOMAdapter.set`, `BrowserAdapter`, `WebWorkerAdapter`, custom `Adapter` interface, `pixi.js/unsafe-eval` for strict CSP.
24
+
25
+ **Triggers:** DOMAdapter, BrowserAdapter, WebWorkerAdapter, Web Worker, OffscreenCanvas, Node, headless, SSR, CSP, unsafe-eval, Adapter.
26
+
27
+ ### pixijs-migration-v8
28
+ Upgrade a PixiJS project from v7 to v8 or diagnose broken v7 code after an upgrade. Covers async `app.init`, single `pixi.js` package (deprecated `@pixi/*` sub-packages), `Graphics` shape-then-fill, `BaseTexture` -> `TextureSource`, shader/uniform rework, `ParticleContainer`+`Particle`, constructor options objects, `DisplayObject` removal, `settings`/`utils` removal, `Ticker` signature, events rewrite.
29
+
30
+ **Triggers:** migrate v7, v8 breaking changes, @pixi/ import, DisplayObject, beginFill, endFill, cacheAsBitmap, BaseTexture, deprecated.
31
+
32
+ ### pixijs-scene-core-concepts
33
+ The PixiJS v8 scene graph as a whole: how containers, leaves, transforms, and render order fit together. Covers leaf vs container distinction, local/world coordinates, culling, render groups, sortable children, masking, `RenderLayer`, and which leaf skill covers which display object.
34
+
35
+ **Triggers:** scene graph, display list, Container, Sprite, Graphics, Text, Mesh, ParticleContainer, DOMContainer, GifSprite, masking, mask texture destroyed, MaskFilter, render group, RenderLayer, world transform.
36
+
37
+ ## Scene Objects
38
+
39
+ ### pixijs-scene-container
40
+ Group, position, or transform display objects. Covers `Container` constructor options (`isRenderGroup`, `sortableChildren`, `boundsArea`), `addChild`/`removeChild`/`addChildAt`/`swapChildren`/`setChildIndex`, `position`/`scale`/`rotation`/`pivot`/`skew`/`alpha`/`tint`, `getBounds`/`getGlobalPosition`/`toLocal`/`toGlobal`, `zIndex` sorting, `cullable`, `destroy`.
41
+
42
+ **Triggers:** Container, addChild, removeChild, addChildAt, swapChildren, sortableChildren, zIndex, position, scale, rotation, pivot, getBounds, toGlobal, toLocal, destroy.
43
+
44
+ ### pixijs-scene-dom-container
45
+ Overlay HTML elements on the PixiJS v8 canvas. Covers `DOMContainer` with `element`, `anchor`, and scene-graph-driven CSS transforms, the `pixi.js/dom` side-effect import, `DOMPipe` registration, visibility sync, pointer-events handling.
46
+
47
+ **Triggers:** DOMContainer, pixi.js/dom, DOMPipe, HTML overlay, input on canvas, iframe overlay, DOMContainerOptions, element, anchor.
48
+
49
+ ### pixijs-scene-gif
50
+ Display animated GIFs. Covers the `pixi.js/gif` side-effect import, `Assets.load` returning a `GifSource`, `GifSprite` playback (`play`/`stop`/`currentFrame`/`animationSpeed`), `autoPlay`/`loop` options, `onComplete`/`onLoop`/`onFrameChange` callbacks, `GifSource` sharing, `clone`, `destroy`.
51
+
52
+ **Triggers:** GifSprite, GifSource, pixi.js/gif, animationSpeed, currentFrame, autoPlay, onComplete, onFrameChange.
53
+
54
+ ### pixijs-html-source
55
+ Render live HTML/DOM elements or frozen snapshots as PixiJS v8 textures via the HTML-in-Canvas browser APIs. Experimental: requires a browser that supports the HTML-in-Canvas spec (the API must be enabled, or the texture uploader throws on first render). Covers the `pixi.js/html-source` side-effect import, feature detection with `canvas.requestPaint`, `HTMLSource` for a live repainting element (`autoLayout`/`autoUpdate`/`autoRequestPaint`, `requestPaint`, `isReady`, the direct-child-of-canvas + `layoutsubtree` rule), `ElementImageSource` for an immutable `captureElementImage()` snapshot (`autoClose`, ready immediately), using the source on a `Sprite`/`Texture`/`Mesh`, and fallback-only auto-detection via `Texture.from`.
56
+
57
+ **Triggers:** HTMLSource, ElementImageSource, pixi.js/html-source, requestPaint, captureElementImage, ElementImage, layoutsubtree, autoRequestPaint, autoClose, HTML in canvas, HTML-in-Canvas, render DOM to texture, render HTML to texture, HTMLSourceCanvas, texElementImage2D, copyElementImageToTexture, experimental.
58
+
59
+ ### pixijs-scene-graphics
60
+ Draw vector shapes and paths. Covers the `Graphics` shape-then-fill API (`rect`/`circle`/`ellipse`/`poly`/`roundRect`/`star`), path methods (`moveTo`/`lineTo`/`bezierCurveTo`/`arc`), `fill`/`stroke`/`cut`, `FillGradient`, `FillPattern`, `GraphicsContext` sharing, SVG markup.
61
+
62
+ **Triggers:** Graphics, GraphicsContext, rect, circle, poly, roundRect, fill, stroke, cut, FillGradient, FillPattern, FillPatternOptions, textureSpace, pattern fill, texture fill, spritesheet fill, radialGradient, linearGradient, svg gradient, moveTo, bezierCurveTo, svg.
63
+
64
+ ### pixijs-scene-mesh
65
+ Render custom geometry. Covers `Mesh` with `MeshGeometry` (positions, uvs, indices, topology), `MeshSimple` for per-frame vertex animation, `MeshPlane` for subdivided deformation, `MeshRope` for path-following textures, `PerspectiveMesh` for 2.5D corners.
66
+
67
+ **Triggers:** Mesh, MeshGeometry, MeshSimple, MeshPlane, MeshRope, PerspectiveMesh, positions, uvs, indices, topology, setCorners.
68
+
69
+ ### pixijs-scene-particle-container
70
+ Render thousands of lightweight sprites. Covers `ParticleContainer` with `Particle` instances, `addParticle`/`removeParticle`, `particleChildren` array, `dynamicProperties` (vertex, position, rotation, uvs, color), `boundsArea`, `roundPixels`, `update`.
71
+
72
+ **Triggers:** ParticleContainer, Particle, IParticle, addParticle, particleChildren, dynamicProperties, boundsArea, particle effects, particle alpha, particle tint, fade particles.
73
+
74
+ ### pixijs-scene-sprite
75
+ Draw images. Covers `Sprite` with `anchor`/`tint`/`texture`, `AnimatedSprite` for frame animation, `NineSliceSprite` for resizable UI panels, `TilingSprite` for scrolling/repeating backgrounds.
76
+
77
+ **Triggers:** Sprite, AnimatedSprite, NineSliceSprite, TilingSprite, Sprite.from, anchor, tint, tilePosition, animationSpeed, gotoAndPlay, leftWidth, topHeight.
78
+
79
+ ### pixijs-scene-text
80
+ Render text. Covers `Text` for canvas-quality styled labels, `BitmapText` for cheap per-frame updates via glyph atlas, `HTMLText` for HTML/CSS markup via SVG, `SplitText` and `SplitBitmapText` for per-character animation, `TextStyle`, `tagStyles`.
81
+
82
+ **Triggers:** Text, BitmapText, HTMLText, SplitText, SplitBitmapText, TextStyle, HTMLTextStyle, BitmapFont.install, tagStyles, fontFamily, wordWrap, textureStyle, scaleMode, context loss.
83
+
84
+ ## Utilities
85
+
86
+ ### pixijs-assets
87
+ Load and manage resources. Covers `Assets.init`, `Assets.load`/`add`/`unload`, bundles, manifests, background loading, `onProgress`, caching, spritesheets, compressed textures, SVG as texture or Graphics, resolution detection.
88
+
89
+ **Triggers:** Assets, Assets.load, Assets.init, loadBundle, manifest, backgroundLoad, Spritesheet, Cache, LoadOptions, unload, svg, loadSvg, parseAsGraphicsContext, svg gradient.
90
+
91
+ ### pixijs-color
92
+ Create, convert, or manipulate colors. Covers `Color` class input formats (hex, CSS names, RGB/HSL objects, arrays, `Uint8Array`), conversion methods (`toHex`, `toNumber`, `toArray`, `toRgba`), component access, `setAlpha`/`multiply`/`premultiply`, `Color.shared` singleton.
93
+
94
+ **Triggers:** Color, ColorSource, hex, rgb, hsl, tint, premultiply, Color.shared, color conversion.
95
+
96
+ ### pixijs-events
97
+ Handle pointer, mouse, touch, or wheel input. Covers `eventMode` (none, passive, auto, static, dynamic), `FederatedEvent` types, propagation and capture phase, `hitArea`, `interactiveChildren`, `cursor` and `cursorStyles`, global move events for drag, `eventFeatures` config.
98
+
99
+ **Triggers:** eventMode, FederatedPointerEvent, pointerdown, click, tap, globalpointermove, drag, hitArea, cursor, stopPropagation, persistentDeviceId.
100
+
101
+ ### pixijs-math
102
+ Coordinates, vectors, matrices, shapes, and hit testing. Covers `Point`/`ObservablePoint`, `Matrix` (2D affine, decompose, apply), shapes (`Rectangle`, `Circle`, `Ellipse`, `Polygon`, `RoundedRectangle`, `Triangle`), `toGlobal`/`toLocal`, `PointData` types, `DEG_TO_RAD`, and `pixi.js/math-extras` vector helpers.
103
+
104
+ **Triggers:** Point, ObservablePoint, Matrix, Rectangle, Circle, Polygon, Triangle, RoundedRectangle, strokeContains, containsRect, intersects, isClockwise, winding order, stroke hit test, decompose, mirror, flip, negative scale, setFromMatrix, toGlobal, toLocal, hitArea, math-extras, DEG_TO_RAD, PointData.
105
+
106
+ ### pixijs-ticker
107
+ Run per-frame logic or control the render loop. Covers `Ticker.add`/`addOnce`/`remove`, `deltaTime` vs `deltaMS` vs `elapsedMS`, `UPDATE_PRIORITY` ordering, `maxFPS`/`minFPS` capping, speed scaling, `Ticker.shared` vs new instances, per-object `onRender` hook, manual rendering.
108
+
109
+ **Triggers:** Ticker, UPDATE_PRIORITY, deltaTime, deltaMS, elapsedMS, onRender, app.ticker, maxFPS, minFPS, Ticker.shared.
110
+
111
+ ## Advanced
112
+
113
+ ### pixijs-accessibility
114
+ Add screen reader and keyboard navigation to PixiJS v8 apps. Covers `AccessibilitySystem` options (`enabledByDefault`, `debug`, `activateOnTab`, `deactivateOnMouseMove`), per-container accessibility properties, shadow DOM overlay, mobile touch-hook activation.
115
+
116
+ **Triggers:** accessibility, a11y, screen reader, ARIA, keyboard navigation, tab order, AccessibilitySystem, accessibleTitle, accessibleHint, tabIndex, accessibleChildren.
117
+
118
+ ### pixijs-blend-modes
119
+ Composite display objects with blend modes. Covers standard modes (`normal`, `add`, `multiply`, `screen`, `erase`, `min`, `max`), advanced modes via `pixi.js/advanced-blend-modes` (`color-burn`, `overlay`, `hard-light`, etc.), batch-friendly ordering.
120
+
121
+ **Triggers:** blendMode, additive, multiply, screen, overlay, color-burn, color-dodge, advanced-blend-modes, glow, erase.
122
+
123
+ ### pixijs-custom-rendering
124
+ Write custom shaders, uniforms, or batchers. Covers `Shader.from({gl, gpu, resources})`, `GlProgram`/`GpuProgram`, `UniformGroup` with typed uniforms (`f32`, `vec2`, `mat4x4`), UBO mode, textures as resources, 3D and array textures, WebGPU storage textures, custom `Filter`, custom `Batcher` via extensions.
125
+
126
+ **Triggers:** Shader, GlProgram, GpuProgram, UniformGroup, Batcher, Filter, GLSL, WGSL, UBO, uniform, custom shader, ShaderOverrides, gpuLayout, bind group layout, TextureView, depth texture, 3D texture, sampler3D, texture_3d, storage texture, Buffer.update, vertexCount, indexCount, getSize, clockwiseFrontFace, cullMode, render bundle, beginBundle, executeBundle, RenderBundle, TexturePool, getOptimalTexture, InstructionPipe, destroyInstructionSet.
127
+
128
+ ### pixijs-filters
129
+ Apply visual effects to containers via the filter pipeline. Covers built-in filters (`AlphaFilter`, `BlurFilter`, `ColorMatrixFilter`, `DisplacementFilter`, `NoiseFilter`), custom `Filter.from()` with GLSL/WGSL, options (`resolution`, `padding`, `antialias`, `blendRequired`), `filterArea` optimization, `pixi-filters` community package.
130
+
131
+ **Triggers:** filters, BlurFilter, ColorMatrixFilter, DisplacementFilter, NoiseFilter, Filter.from, GLSL filter, pixi-filters, filterArea.
132
+
133
+ ### pixijs-performance
134
+ Profile or optimize a PixiJS v8 app for FPS, draw calls, or GPU memory. Covers destroy patterns (`cacheAsTexture(false)`, `releaseGlobalResources`), `GCSystem` and `TextureGCSystem`, `PrepareSystem`, object pooling, batching rules, `BitmapText` for dynamic text, culling (`Culler`, `CullerPlugin`, `cullable`, `cullArea`), resolution/antialias tradeoffs.
135
+
136
+ **Triggers:** FPS, jank, draw calls, batching, object pool, GCSystem, PrepareSystem, Culler, cacheAsTexture, memory leak, destroy patterns, render bundle, transient, MSAA, Buffer.update, WebGPU performance, TexturePool, repeatEdgePixels, bind group.