modern-canvas 0.7.15 → 0.8.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.
package/dist/index.cjs CHANGED
@@ -5,7 +5,6 @@ const colord = require('colord');
5
5
  const namesPlugin = require('colord/plugins/names');
6
6
  const modernPath2d = require('modern-path2d');
7
7
  const modernText = require('modern-text');
8
- const load = require('yoga-layout/load');
9
8
 
10
9
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
11
10
 
@@ -2582,6 +2581,8 @@ attribute vec4 aDisableWrapMode;
2582
2581
  uniform mat3 projectionMatrix;
2583
2582
  uniform mat3 viewMatrix;
2584
2583
  uniform vec4 modulate;
2584
+ uniform float canvasWidth;
2585
+ uniform float canvasHeight;
2585
2586
 
2586
2587
  varying float vTextureId;
2587
2588
  varying vec2 vUv;
@@ -2589,6 +2590,10 @@ varying vec4 vModulate;
2589
2590
  varying vec4 vBackgroundColor;
2590
2591
  varying vec4 vDisableWrapMode;
2591
2592
 
2593
+ vec2 roundPixels(vec2 position, vec2 targetSize) {
2594
+ return (floor(((position * 0.5 + 0.5) * targetSize) + 0.5) / targetSize) * 2.0 - 1.0;
2595
+ }
2596
+
2592
2597
  void main(void) {
2593
2598
  mat3 modelMatrix = mat3(
2594
2599
  1.0, 0.0, 0.0,
@@ -2596,8 +2601,9 @@ void main(void) {
2596
2601
  0.0, 0.0, 1.0
2597
2602
  );
2598
2603
  vTextureId = aTextureId;
2599
- mat3 modelViewProjectionMatrix = projectionMatrix * viewMatrix * modelMatrix;
2600
- gl_Position = vec4((modelViewProjectionMatrix * vec3(aPosition, 1.0)).xy, 0.0, 1.0);
2604
+ vec3 pos = projectionMatrix * viewMatrix * modelMatrix * vec3(aPosition, 1.0);
2605
+ gl_Position = vec4(roundPixels(pos.xy, vec2(canvasWidth, canvasHeight)), 0.0, 1.0);
2606
+
2601
2607
  vUv = aUv;
2602
2608
  vModulate = aModulate * modulate;
2603
2609
  vBackgroundColor = aBackgroundColor;
@@ -2682,6 +2688,8 @@ void main(void) {
2682
2688
  renderer2.program.updateUniforms(program, {
2683
2689
  samplers,
2684
2690
  modulate: [1, 1, 1, 1],
2691
+ canvasWidth: renderer2.gl.drawingBufferWidth,
2692
+ canvasHeight: renderer2.gl.drawingBufferHeight,
2685
2693
  ...renderer2.program.uniforms
2686
2694
  });
2687
2695
  renderer2.vertexArray.bind(vao ?? vertexArray);
@@ -10350,59 +10358,123 @@ exports.Element2D = __decorateClass$k([
10350
10358
  customNode("Element2D")
10351
10359
  ], exports.Element2D);
10352
10360
 
10361
+ const edgeMap = {
10362
+ left: 0,
10363
+ // Edge.Left
10364
+ top: 1,
10365
+ // Edge.Top
10366
+ right: 2,
10367
+ // Edge.Right
10368
+ bottom: 3,
10369
+ // Edge.Bottom
10370
+ start: 4,
10371
+ // Edge.Start
10372
+ end: 5,
10373
+ // Edge.End
10374
+ horizontal: 6,
10375
+ // Edge.Horizontal
10376
+ vertical: 7,
10377
+ // Edge.Vertical
10378
+ all: 8
10379
+ // Edge.All
10380
+ };
10381
+ const gutterMap = {
10382
+ column: 0,
10383
+ // Gutter.Column
10384
+ row: 1,
10385
+ // Gutter.Row
10386
+ all: 2
10387
+ // Gutter.All
10388
+ };
10353
10389
  const alignMap = {
10354
- "auto": load.Align.Auto,
10355
- "flex-start": load.Align.FlexStart,
10356
- "center": load.Align.Center,
10357
- "flex-end": load.Align.FlexEnd,
10358
- "stretch": load.Align.Stretch,
10359
- "baseline": load.Align.Baseline,
10360
- "space-between": load.Align.SpaceBetween,
10361
- "space-around": load.Align.SpaceAround,
10362
- "space-evenly": load.Align.SpaceEvenly
10390
+ "auto": 0,
10391
+ // Align.Auto
10392
+ "flex-start": 1,
10393
+ // Align.FlexStart
10394
+ "center": 2,
10395
+ // Align.Center
10396
+ "flex-end": 3,
10397
+ // Align.FlexEnd
10398
+ "stretch": 4,
10399
+ // Align.Stretch
10400
+ "baseline": 5,
10401
+ // Align.Baseline
10402
+ "space-between": 6,
10403
+ // Align.SpaceBetween
10404
+ "space-around": 7,
10405
+ // Align.SpaceAround
10406
+ "space-evenly": 8
10407
+ // Align.SpaceEvenly
10363
10408
  };
10364
10409
  const displayMap = {
10365
- none: load.Display.None,
10366
- flex: load.Display.Flex,
10367
- contents: load.Display.Contents
10410
+ flex: 0,
10411
+ // Display.Flex
10412
+ none: 1,
10413
+ // Display.None
10414
+ contents: 2
10415
+ // Display.Contents
10368
10416
  };
10369
10417
  const directionMap = {
10370
- inherit: load.Direction.Inherit,
10371
- ltr: load.Direction.LTR,
10372
- rtl: load.Direction.RTL
10418
+ inherit: 0,
10419
+ // Direction.Inherit
10420
+ ltr: 1,
10421
+ // Direction.LTR
10422
+ rtl: 2
10423
+ // Direction.RTL
10373
10424
  };
10374
10425
  const flexDirectionMap = {
10375
- "column": load.FlexDirection.Column,
10376
- "column-reverse": load.FlexDirection.ColumnReverse,
10377
- "row": load.FlexDirection.Row,
10378
- "row-reverse": load.FlexDirection.RowReverse
10426
+ "column": 0,
10427
+ // FlexDirection.Column
10428
+ "column-reverse": 1,
10429
+ // FlexDirection.ColumnReverse
10430
+ "row": 2,
10431
+ // FlexDirection.Row
10432
+ "row-reverse": 3
10433
+ // FlexDirection.RowReverse
10379
10434
  };
10380
10435
  const flexWrapMap = {
10381
- "no-wrap": load.Wrap.NoWrap,
10382
- "wrap": load.Wrap.Wrap,
10383
- "Wrap-reverse": load.Wrap.WrapReverse
10436
+ "no-wrap": 0,
10437
+ // Wrap.NoWrap
10438
+ "wrap": 1,
10439
+ // Wrap.Wrap
10440
+ "Wrap-reverse": 2
10441
+ // Wrap.WrapReverse
10384
10442
  };
10385
10443
  const justifyMap = {
10386
- "flex-start": load.Justify.FlexStart,
10387
- "center": load.Justify.Center,
10388
- "flex-end": load.Justify.FlexEnd,
10389
- "space-between": load.Justify.SpaceBetween,
10390
- "space-around": load.Justify.SpaceAround,
10391
- "space-evenly": load.Justify.SpaceEvenly
10444
+ "flex-start": 0,
10445
+ // Justify.FlexStart
10446
+ "center": 1,
10447
+ // Justify.Center
10448
+ "flex-end": 2,
10449
+ // Justify.FlexEnd
10450
+ "space-between": 3,
10451
+ // Justify.SpaceBetween
10452
+ "space-around": 4,
10453
+ // Justify.SpaceAround
10454
+ "space-evenly": 5
10455
+ // Justify.SpaceEvenly
10392
10456
  };
10393
10457
  const overflowMap = {
10394
- visible: load.Overflow.Visible,
10395
- hidden: load.Overflow.Hidden,
10396
- scroll: load.Overflow.Scroll
10458
+ visible: 0,
10459
+ // Overflow.Visible
10460
+ hidden: 1,
10461
+ // Overflow.Hidden
10462
+ scroll: 2
10463
+ // Overflow.Scroll
10397
10464
  };
10398
10465
  const positionTypeMap = {
10399
- static: load.PositionType.Static,
10400
- relative: load.PositionType.Relative,
10401
- absolute: load.PositionType.Absolute
10466
+ static: 0,
10467
+ // PositionType.Static
10468
+ relative: 1,
10469
+ // PositionType.Relative
10470
+ absolute: 2
10471
+ // PositionType.Absolute
10402
10472
  };
10403
10473
  const boxSizingMap = {
10404
- "border-box": load.BoxSizing.BorderBox,
10405
- "content-box": load.BoxSizing.ContentBox
10474
+ "border-box": 0,
10475
+ // BoxSizing.BorderBox
10476
+ "content-box": 1
10477
+ // BoxSizing.ContentBox
10406
10478
  };
10407
10479
  class FlexLayout {
10408
10480
  constructor(_element) {
@@ -10410,7 +10482,8 @@ class FlexLayout {
10410
10482
  }
10411
10483
  static _yoga;
10412
10484
  static async load() {
10413
- this._yoga = await load.loadYoga();
10485
+ const { loadYoga } = await import('yoga-layout/load');
10486
+ this._yoga = await loadYoga();
10414
10487
  }
10415
10488
  _node = FlexLayout._yoga.Node.create();
10416
10489
  get _style() {
@@ -10456,19 +10529,19 @@ class FlexLayout {
10456
10529
  this._node.setAspectRatio(value);
10457
10530
  break;
10458
10531
  case "borderTop":
10459
- this._node.setBorder(load.Edge.Top, this._style.borderWidth);
10532
+ this._node.setBorder(edgeMap.top, this._style.borderWidth);
10460
10533
  break;
10461
10534
  case "borderBottom":
10462
- this._node.setBorder(load.Edge.Bottom, this._style.borderWidth);
10535
+ this._node.setBorder(edgeMap.bottom, this._style.borderWidth);
10463
10536
  break;
10464
10537
  case "borderLeft":
10465
- this._node.setBorder(load.Edge.Left, this._style.borderWidth);
10538
+ this._node.setBorder(edgeMap.left, this._style.borderWidth);
10466
10539
  break;
10467
10540
  case "borderRight":
10468
- this._node.setBorder(load.Edge.Right, this._style.borderWidth);
10541
+ this._node.setBorder(edgeMap.right, this._style.borderWidth);
10469
10542
  break;
10470
10543
  case "border":
10471
- this._node.setBorder(load.Edge.All, this._style.borderWidth);
10544
+ this._node.setBorder(edgeMap.all, this._style.borderWidth);
10472
10545
  break;
10473
10546
  case "direction":
10474
10547
  this._node.setDirection(
@@ -10511,22 +10584,22 @@ class FlexLayout {
10511
10584
  );
10512
10585
  break;
10513
10586
  case "gap":
10514
- value !== void 0 && this._node.setGap(load.Gutter.All, value);
10587
+ value !== void 0 && this._node.setGap(gutterMap.all, value);
10515
10588
  break;
10516
10589
  case "marginTop":
10517
- this._node.setMargin(load.Edge.Top, value);
10590
+ this._node.setMargin(edgeMap.top, value);
10518
10591
  break;
10519
10592
  case "marginBottom":
10520
- this._node.setMargin(load.Edge.Top, value);
10593
+ this._node.setMargin(edgeMap.bottom, value);
10521
10594
  break;
10522
10595
  case "marginLeft":
10523
- this._node.setMargin(load.Edge.Left, value);
10596
+ this._node.setMargin(edgeMap.left, value);
10524
10597
  break;
10525
10598
  case "marginRight":
10526
- this._node.setMargin(load.Edge.Top, value);
10599
+ this._node.setMargin(edgeMap.right, value);
10527
10600
  break;
10528
10601
  case "margin":
10529
- this._node.setMargin(load.Edge.All, value);
10602
+ this._node.setMargin(edgeMap.all, value);
10530
10603
  break;
10531
10604
  case "maxHeight":
10532
10605
  this._node.setMaxHeight(value);
@@ -10548,31 +10621,31 @@ class FlexLayout {
10548
10621
  );
10549
10622
  break;
10550
10623
  case "paddingTop":
10551
- this._node.setPadding(load.Edge.Top, this._style.paddingTop);
10624
+ this._node.setPadding(edgeMap.top, this._style.paddingTop);
10552
10625
  break;
10553
10626
  case "paddingBottom":
10554
- this._node.setPadding(load.Edge.Bottom, this._style.paddingBottom);
10627
+ this._node.setPadding(edgeMap.bottom, this._style.paddingBottom);
10555
10628
  break;
10556
10629
  case "paddingLeft":
10557
- this._node.setPadding(load.Edge.Left, this._style.paddingLeft);
10630
+ this._node.setPadding(edgeMap.left, this._style.paddingLeft);
10558
10631
  break;
10559
10632
  case "paddingRight":
10560
- this._node.setPadding(load.Edge.Right, this._style.paddingRight);
10633
+ this._node.setPadding(edgeMap.right, this._style.paddingRight);
10561
10634
  break;
10562
10635
  case "padding":
10563
- this._node.setPadding(load.Edge.All, this._style.padding);
10636
+ this._node.setPadding(edgeMap.all, this._style.padding);
10564
10637
  break;
10565
10638
  case "top":
10566
- this._node.setPosition(load.Edge.Top, this._style.top);
10639
+ this._node.setPosition(edgeMap.top, this._style.top);
10567
10640
  break;
10568
10641
  case "bottom":
10569
- this._node.setPosition(load.Edge.Bottom, this._style.bottom);
10642
+ this._node.setPosition(edgeMap.bottom, this._style.bottom);
10570
10643
  break;
10571
10644
  case "left":
10572
- this._node.setPosition(load.Edge.Left, this._style.left);
10645
+ this._node.setPosition(edgeMap.left, this._style.left);
10573
10646
  break;
10574
10647
  case "right":
10575
- this._node.setPosition(load.Edge.Right, this._style.right);
10648
+ this._node.setPosition(edgeMap.right, this._style.right);
10576
10649
  break;
10577
10650
  case "position":
10578
10651
  this._node.setPositionType(
@@ -10653,7 +10726,7 @@ exports.FlexElement2D = class FlexElement2D extends exports.BaseElement2D {
10653
10726
  }
10654
10727
  }
10655
10728
  updateTransform() {
10656
- this.calculateLayout(void 0, void 0, load.Direction.LTR);
10729
+ this.calculateLayout(void 0, void 0, directionMap.ltr);
10657
10730
  const { left, top, width, height } = this._layout.getComputedLayout();
10658
10731
  this.position.x = left;
10659
10732
  this.position.y = top;
@@ -13436,7 +13509,7 @@ exports.TwistTransition = __decorateClass$1([
13436
13509
  customNode("TwistTransition")
13437
13510
  ], exports.TwistTransition);
13438
13511
 
13439
- class GIFLoader extends Loader {
13512
+ class GifLoader extends Loader {
13440
13513
  install(assets) {
13441
13514
  const handler = async (url) => {
13442
13515
  const { decodeFrames } = await import('modern-gif');
@@ -13462,7 +13535,7 @@ class GIFLoader extends Loader {
13462
13535
  }
13463
13536
  }
13464
13537
 
13465
- class JSONLoader extends Loader {
13538
+ class JsonLoader extends Loader {
13466
13539
  install(assets) {
13467
13540
  const handler = (url) => {
13468
13541
  return assets.fetch(url).then((rep) => rep.json());
@@ -13794,7 +13867,7 @@ class Assets {
13794
13867
  this._handled.clear();
13795
13868
  }
13796
13869
  }
13797
- const assets = new Assets().use(new FontLoader()).use(new GIFLoader()).use(new JSONLoader()).use(new LottieLoader()).use(new TextLoader()).use(new TextureLoader()).use(new VideoLoader());
13870
+ const assets = new Assets().use(new FontLoader()).use(new GifLoader()).use(new JsonLoader()).use(new LottieLoader()).use(new TextLoader()).use(new TextureLoader()).use(new VideoLoader());
13798
13871
 
13799
13872
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
13800
13873
  var __decorateClass = (decorators, target, key, kind) => {
@@ -14266,8 +14339,8 @@ exports.Engine = Engine;
14266
14339
  exports.FlexElement2DStyle = FlexElement2DStyle;
14267
14340
  exports.FlexLayout = FlexLayout;
14268
14341
  exports.FontLoader = FontLoader;
14269
- exports.GIFLoader = GIFLoader;
14270
14342
  exports.Geometry = Geometry;
14343
+ exports.GifLoader = GifLoader;
14271
14344
  exports.GradientTexture = GradientTexture;
14272
14345
  exports.HTMLAudio = HTMLAudio;
14273
14346
  exports.HTMLAudioContext = HTMLAudioContext;
@@ -14277,7 +14350,7 @@ exports.ImageTexture = ImageTexture;
14277
14350
  exports.IndexBuffer = IndexBuffer;
14278
14351
  exports.Input = Input;
14279
14352
  exports.InputEvent = InputEvent;
14280
- exports.JSONLoader = JSONLoader;
14353
+ exports.JsonLoader = JsonLoader;
14281
14354
  exports.KeyboardInputEvent = KeyboardInputEvent;
14282
14355
  exports.Loader = Loader;
14283
14356
  exports.LottieLoader = LottieLoader;
@@ -14353,7 +14426,9 @@ exports.WebGLVertexArrayModule = WebGLVertexArrayModule;
14353
14426
  exports.WebGLViewportModule = WebGLViewportModule;
14354
14427
  exports.WebSound = WebSound;
14355
14428
  exports.WheelInputEvent = WheelInputEvent;
14429
+ exports.alignMap = alignMap;
14356
14430
  exports.assets = assets;
14431
+ exports.boxSizingMap = boxSizingMap;
14357
14432
  exports.clamp = clamp;
14358
14433
  exports.clampFrag = clampFrag;
14359
14434
  exports.createHTMLCanvas = createHTMLCanvas;
@@ -14365,29 +14440,38 @@ exports.customNode = customNode;
14365
14440
  exports.customNodes = customNodes;
14366
14441
  exports.defaultOptions = defaultOptions;
14367
14442
  exports.determineCrossOrigin = determineCrossOrigin;
14443
+ exports.directionMap = directionMap;
14444
+ exports.displayMap = displayMap;
14368
14445
  exports.ease = ease;
14369
14446
  exports.easeIn = easeIn;
14370
14447
  exports.easeInOut = easeInOut;
14371
14448
  exports.easeOut = easeOut;
14449
+ exports.edgeMap = edgeMap;
14450
+ exports.flexDirectionMap = flexDirectionMap;
14451
+ exports.flexWrapMap = flexWrapMap;
14372
14452
  exports.frag = frag$1;
14373
14453
  exports.getDefaultCssPropertyValue = getDefaultCssPropertyValue;
14454
+ exports.gutterMap = gutterMap;
14374
14455
  exports.isCanvasElement = isCanvasElement;
14375
14456
  exports.isElementNode = isElementNode;
14376
14457
  exports.isImageElement = isImageElement;
14377
14458
  exports.isPow2 = isPow2;
14378
14459
  exports.isVideoElement = isVideoElement;
14379
14460
  exports.isWebgl2 = isWebgl2;
14461
+ exports.justifyMap = justifyMap;
14380
14462
  exports.lerp = lerp;
14381
14463
  exports.linear = linear;
14382
14464
  exports.log2 = log2;
14383
14465
  exports.mapWebGLBlendModes = mapWebGLBlendModes;
14384
14466
  exports.nextPow2 = nextPow2;
14385
14467
  exports.nextTick = nextTick;
14468
+ exports.overflowMap = overflowMap;
14386
14469
  exports.parseCSSFilter = parseCSSFilter;
14387
14470
  exports.parseCSSTransform = parseCSSTransform;
14388
14471
  exports.parseCSSTransformOrigin = parseCSSTransformOrigin;
14389
14472
  exports.parseCssFunctions = parseCssFunctions;
14390
14473
  exports.parseCssProperty = parseCssProperty;
14474
+ exports.positionTypeMap = positionTypeMap;
14391
14475
  exports.render = render;
14392
14476
  exports.timingFunctions = timingFunctions;
14393
14477
  exports.uid = uid;
package/dist/index.d.cts CHANGED
@@ -5,7 +5,7 @@ import { AnimationItem } from 'lottie-web';
5
5
  import { Colord, RgbaColor, HslaColor, HsvaColor } from 'colord';
6
6
  import { Path2D, LineCap, LineJoin, LineStyle, Path2DSet } from 'modern-path2d';
7
7
  import { Text, MeasureResult } from 'modern-text';
8
- import { Node as Node$1, Direction } from 'yoga-layout/load';
8
+ import { Node as Node$1 } from 'yoga-layout/load';
9
9
 
10
10
  declare abstract class Loader {
11
11
  abstract install(assets: Assets): this;
@@ -2221,6 +2221,76 @@ declare class Element2D extends BaseElement2D {
2221
2221
  protected _updateStyleProperty(key: string, value: any, oldValue: any, declaration?: PropertyDeclaration): void;
2222
2222
  }
2223
2223
 
2224
+ declare const edgeMap: {
2225
+ left: number;
2226
+ top: number;
2227
+ right: number;
2228
+ bottom: number;
2229
+ start: number;
2230
+ end: number;
2231
+ horizontal: number;
2232
+ vertical: number;
2233
+ all: number;
2234
+ };
2235
+ declare const gutterMap: {
2236
+ column: number;
2237
+ row: number;
2238
+ all: number;
2239
+ };
2240
+ declare const alignMap: {
2241
+ auto: number;
2242
+ 'flex-start': number;
2243
+ center: number;
2244
+ 'flex-end': number;
2245
+ stretch: number;
2246
+ baseline: number;
2247
+ 'space-between': number;
2248
+ 'space-around': number;
2249
+ 'space-evenly': number;
2250
+ };
2251
+ declare const displayMap: {
2252
+ flex: number;
2253
+ none: number;
2254
+ contents: number;
2255
+ };
2256
+ declare const directionMap: {
2257
+ inherit: number;
2258
+ ltr: number;
2259
+ rtl: number;
2260
+ };
2261
+ declare const flexDirectionMap: {
2262
+ column: number;
2263
+ 'column-reverse': number;
2264
+ row: number;
2265
+ 'row-reverse': number;
2266
+ };
2267
+ declare const flexWrapMap: {
2268
+ 'no-wrap': number;
2269
+ wrap: number;
2270
+ 'Wrap-reverse': number;
2271
+ };
2272
+ declare const justifyMap: {
2273
+ 'flex-start': number;
2274
+ center: number;
2275
+ 'flex-end': number;
2276
+ 'space-between': number;
2277
+ 'space-around': number;
2278
+ 'space-evenly': number;
2279
+ };
2280
+ declare const overflowMap: {
2281
+ visible: number;
2282
+ hidden: number;
2283
+ scroll: number;
2284
+ };
2285
+ declare const positionTypeMap: {
2286
+ static: number;
2287
+ relative: number;
2288
+ absolute: number;
2289
+ };
2290
+ declare const boxSizingMap: {
2291
+ 'border-box': number;
2292
+ 'content-box': number;
2293
+ };
2224
2294
  interface ComputedLayout {
2225
2295
  left: number;
2226
2296
  right: number;
@@ -2240,7 +2310,7 @@ declare class FlexLayout {
2240
2310
  get offsetWidth(): number;
2241
2311
  get offsetHeight(): number;
2242
2312
  constructor(_element: FlexElement2D);
2243
- calculateLayout(width?: number | 'auto', height?: number | 'auto', direction?: Direction): void;
2313
+ calculateLayout(width?: number | 'auto', height?: number | 'auto', direction?: typeof displayMap[keyof typeof displayMap]): void;
2244
2314
  getComputedLayout(): ComputedLayout;
2245
2315
  updateStyleProperty(key: string, value: any, oldValue: any, declaration?: PropertyDeclaration): void;
2246
2316
  }
@@ -2271,7 +2341,7 @@ declare class FlexElement2D extends BaseElement2D implements Rectangulable {
2271
2341
  protected _unparented(oldParent: Node): void;
2272
2342
  protected _updateStyleProperty(key: string, value: any, oldValue: any, declaration?: PropertyDeclaration): void;
2273
2343
  updateTransform(): void;
2274
- calculateLayout(width?: number | 'auto', height?: number | 'auto', direction?: Direction): void;
2344
+ calculateLayout(width?: number | 'auto', height?: number | 'auto', direction?: typeof directionMap[keyof typeof directionMap]): void;
2275
2345
  }
2276
2346
 
2277
2347
  interface Image2DProperties extends Element2DProperties {
@@ -3142,12 +3212,12 @@ declare class TwistTransition extends Transition {
3142
3212
  apply(renderer: WebGLRenderer, source: Viewport): void;
3143
3213
  }
3144
3214
 
3145
- declare class GIFLoader extends Loader {
3215
+ declare class GifLoader extends Loader {
3146
3216
  load: (url: string) => Promise<AnimatedTexture>;
3147
3217
  install(assets: Assets): this;
3148
3218
  }
3149
3219
 
3150
- declare class JSONLoader extends Loader {
3220
+ declare class JsonLoader extends Loader {
3151
3221
  load: (url: string) => Promise<Record<string, any>>;
3152
3222
  install(assets: Assets): this;
3153
3223
  }
@@ -3175,8 +3245,8 @@ declare class VideoLoader extends Loader {
3175
3245
  type AssetHandler = (url: string, options?: any) => any | Promise<any>;
3176
3246
  interface Assets {
3177
3247
  font: FontLoader;
3178
- gif: GIFLoader;
3179
- json: JSONLoader;
3248
+ gif: GifLoader;
3249
+ json: JsonLoader;
3180
3250
  lottie: LottieLoader;
3181
3251
  text: TextLoader;
3182
3252
  texture: TextureLoader;
@@ -3311,5 +3381,5 @@ interface RenderOptions {
3311
3381
  }
3312
3382
  declare function render(options: RenderOptions): Promise<HTMLCanvasElement>;
3313
3383
 
3314
- export { AnimatedTexture, Animation, Assets, Audio, AudioPipeline, AudioProcessor, AudioSpectrum, AudioWaveform, BaseElement2D, BaseElement2DBackground, BaseElement2DFill, BaseElement2DForeground, BaseElement2DOutline, BaseElement2DShadow, BaseElement2DShape, BaseElement2DStyle, BaseElement2DText, Camera2D, CanvasContext, CanvasItem, CanvasItemEditor, CanvasTexture, Color, ColorAdjustEffect, ColorFilterEffect, ColorMatrix, ColorOverlayEffect, ColorRemoveEffect, ColorReplaceEffect, ColorTexture, Control, CoreObject, DEG_TO_RAD, DEVICE_PIXEL_RATIO, DropShadowEffect, Effect, EffectMaterial, Element2D, Element2DStyle, EmbossEffect, Engine, FlexElement2D, FlexElement2DStyle, FlexLayout, FontLoader, GIFLoader, GaussianBlurEffect, Geometry, GlitchEffect, GodrayEffect, GradientTexture, HTMLAudio, HTMLAudioContext, HTMLSound, IN_BROWSER, Image2D, ImageTexture, IndexBuffer, Input, InputEvent, JSONLoader, KawaseBlurEffect, KawaseTransition, KeyboardInputEvent, LeftEraseTransition, Loader, Lottie2D, LottieLoader, MainLoop, MaskEffect, Material, Matrix, Matrix2, Matrix3, Matrix4, MouseInputEvent, Node, Node2D, OutlineEffect, PI, PI_2, PixelateEffect, PixelsTexture, PointerInputEvent, Projection2D, QuadGeometry, QuadUvGeometry, RAD_TO_DEG, Range, RawWeakMap, Rect2, RefCounted, Renderer, Resource, Ruler, SUPPORTS_AUDIO_CONTEXT, SUPPORTS_CLICK_EVENTS, SUPPORTS_CREATE_IMAGE_BITMAP, SUPPORTS_IMAGE_BITMAP, SUPPORTS_MOUSE_EVENTS, SUPPORTS_OFFLINE_AUDIO_CONTEXT, SUPPORTS_POINTER_EVENTS, SUPPORTS_RESIZE_OBSERVER, SUPPORTS_TOUCH_EVENTS, SUPPORTS_WEBGL2, SUPPORTS_WEBKIT_AUDIO_CONTEXT, SUPPORTS_WEBKIT_OFFLINE_AUDIO_CONTEXT, SUPPORTS_WEB_AUDIO, SUPPORTS_WHEEL_EVENTS, Scaler, SceneTree, ScrollBar, TextLoader, Texture2D, TextureLoader, TextureRect2D, Ticker, TiltShiftTransition, Timeline, TimelineNode, Transform2D, TransformRect2D, Transition, TwistTransition, UvGeometry, UvMaterial, Vector, Vector2, Vector3, Vector4, VertexAttribute, VertexBuffer, Video2D, VideoLoader, VideoTexture, Viewport, ViewportTexture, WebAudio, WebAudioContext, WebGLBatch2DModule, WebGLBlendMode, WebGLBufferModule, WebGLFramebufferModule, WebGLMaskModule, WebGLModule, WebGLProgramModule, WebGLRenderer, WebGLScissorModule, WebGLState, WebGLStateModule, WebGLStencilModule, WebGLTextureModule, WebGLVertexArrayModule, WebGLViewportModule, WebSound, WheelInputEvent, Window, XScrollBar, YScrollBar, ZoomBlurEffect, assets, clamp, clampFrag, createHTMLCanvas, createNode, crossOrigin, cubicBezier, curves, customNode, customNodes, defaultOptions, determineCrossOrigin, ease, easeIn, easeInOut, easeOut, frag, getDefaultCssPropertyValue, isCanvasElement, isElementNode, isImageElement, isPow2, isVideoElement, isWebgl2, lerp, linear, log2, mapWebGLBlendModes, nextPow2, nextTick, parseCSSFilter, parseCSSTransform, parseCSSTransformOrigin, parseCssFunctions, parseCssProperty, render, timingFunctions, uid };
3384
+ export { AnimatedTexture, Animation, Assets, Audio, AudioPipeline, AudioProcessor, AudioSpectrum, AudioWaveform, BaseElement2D, BaseElement2DBackground, BaseElement2DFill, BaseElement2DForeground, BaseElement2DOutline, BaseElement2DShadow, BaseElement2DShape, BaseElement2DStyle, BaseElement2DText, Camera2D, CanvasContext, CanvasItem, CanvasItemEditor, CanvasTexture, Color, ColorAdjustEffect, ColorFilterEffect, ColorMatrix, ColorOverlayEffect, ColorRemoveEffect, ColorReplaceEffect, ColorTexture, Control, CoreObject, DEG_TO_RAD, DEVICE_PIXEL_RATIO, DropShadowEffect, Effect, EffectMaterial, Element2D, Element2DStyle, EmbossEffect, Engine, FlexElement2D, FlexElement2DStyle, FlexLayout, FontLoader, GaussianBlurEffect, Geometry, GifLoader, GlitchEffect, GodrayEffect, GradientTexture, HTMLAudio, HTMLAudioContext, HTMLSound, IN_BROWSER, Image2D, ImageTexture, IndexBuffer, Input, InputEvent, JsonLoader, KawaseBlurEffect, KawaseTransition, KeyboardInputEvent, LeftEraseTransition, Loader, Lottie2D, LottieLoader, MainLoop, MaskEffect, Material, Matrix, Matrix2, Matrix3, Matrix4, MouseInputEvent, Node, Node2D, OutlineEffect, PI, PI_2, PixelateEffect, PixelsTexture, PointerInputEvent, Projection2D, QuadGeometry, QuadUvGeometry, RAD_TO_DEG, Range, RawWeakMap, Rect2, RefCounted, Renderer, Resource, Ruler, SUPPORTS_AUDIO_CONTEXT, SUPPORTS_CLICK_EVENTS, SUPPORTS_CREATE_IMAGE_BITMAP, SUPPORTS_IMAGE_BITMAP, SUPPORTS_MOUSE_EVENTS, SUPPORTS_OFFLINE_AUDIO_CONTEXT, SUPPORTS_POINTER_EVENTS, SUPPORTS_RESIZE_OBSERVER, SUPPORTS_TOUCH_EVENTS, SUPPORTS_WEBGL2, SUPPORTS_WEBKIT_AUDIO_CONTEXT, SUPPORTS_WEBKIT_OFFLINE_AUDIO_CONTEXT, SUPPORTS_WEB_AUDIO, SUPPORTS_WHEEL_EVENTS, Scaler, SceneTree, ScrollBar, TextLoader, Texture2D, TextureLoader, TextureRect2D, Ticker, TiltShiftTransition, Timeline, TimelineNode, Transform2D, TransformRect2D, Transition, TwistTransition, UvGeometry, UvMaterial, Vector, Vector2, Vector3, Vector4, VertexAttribute, VertexBuffer, Video2D, VideoLoader, VideoTexture, Viewport, ViewportTexture, WebAudio, WebAudioContext, WebGLBatch2DModule, WebGLBlendMode, WebGLBufferModule, WebGLFramebufferModule, WebGLMaskModule, WebGLModule, WebGLProgramModule, WebGLRenderer, WebGLScissorModule, WebGLState, WebGLStateModule, WebGLStencilModule, WebGLTextureModule, WebGLVertexArrayModule, WebGLViewportModule, WebSound, WheelInputEvent, Window, XScrollBar, YScrollBar, ZoomBlurEffect, alignMap, assets, boxSizingMap, clamp, clampFrag, createHTMLCanvas, createNode, crossOrigin, cubicBezier, curves, customNode, customNodes, defaultOptions, determineCrossOrigin, directionMap, displayMap, ease, easeIn, easeInOut, easeOut, edgeMap, flexDirectionMap, flexWrapMap, frag, getDefaultCssPropertyValue, gutterMap, isCanvasElement, isElementNode, isImageElement, isPow2, isVideoElement, isWebgl2, justifyMap, lerp, linear, log2, mapWebGLBlendModes, nextPow2, nextTick, overflowMap, parseCSSFilter, parseCSSTransform, parseCSSTransformOrigin, parseCssFunctions, parseCssProperty, positionTypeMap, render, timingFunctions, uid };
3315
3385
  export type { AnimationEffectMode, AnimationProperties, AssetHandler, AudioWaveformProperties, BaseElement2DEventMap, BaseElement2DProperties, BaseElement2DStyleProperties, Batchable2D, CSSFilterKey, CSSFilters, Camera2DEventMap, Camera2DProperties, CanvasBatchable, CanvasItemEventMap, CanvasItemProperties, ColorAdjustEffectProperties, ColorFilterEffectProperties, ColorOverlayEffectProperties, ColorRemoveEffectProperties, ColorReplaceEffectProperties, ComputedLayout, ControlEventMap, ControlProperties, CoreObjectEventMap, CssFunction, CssFunctionArg, Cursor, CustomPropertyAccessor, DropShadowEffectProperties, Easing, EffectContext, EffectMode, EffectProperties, Element2DEventMap, Element2DProperties, Element2DStyleProperties, EmbossEffectProperties, EngineOptions, FillDraw, FlexBaseElement2DEventMap, FlexElement2DProperties, FlexElement2DStyleProperties, GaussianBlurEffectProperties, GeometryOptions, GlitchEffectProperties, GodrayEffectProperties, IAudioContext, IAudioNode, IPlayOptions, Image2DProperties, ImageFrame, ImageTextureOptions, IndexBufferOptions, InputEventKey, InputEventMap, InternalMode, KawaseBlurEffectProperties, Keyframe, Lottie2DProperties, MainLoopEventMap, MaskColor, MaskData, MaskEffectProperties, MaskObject, MaskRect, Maskable, MaterialOptions, MatrixLike, MatrixOperateOutput, Node2DEventMap, Node2DProperties, NodeEventMap, NodeProperties, NormalizedKeyframe, OutlineEffectProperties, PixelateEffectProperties, PlatformAudio, PlatformSound, ProcessMode, ProcessSortMode, RangeProperties, Rectangulable, RectangulableEventMap, RefCountedEventMap, RenderMode, RenderOptions, Renderable, ResourceEventMap, RulerProperties, ScalerEventMap, ScalerProperties, SceneTreeEventMap, ScrollBarProperties, StrokeDraw, Texture2DFilterMode, Texture2DPixelsSource, Texture2DSource, Texture2DWrapMode, TextureRect2DProperties, TimelineEventMap, TimelineNodeEventMap, TimelineNodeProperties, TimelineProperties, TimingFunctions, TransformObject, TransformRect2DProperties, TransformableObject, TransitionProperties, UvTransform, Vector2Data, VectorLike, VectorOperateOutput, VertTransform, VertexAttributeOptions, VertexBufferOptions, Video2DProperties, VideoTextureOptions, VideoTextureSource, ViewportEventMap, ViewportFramebuffer, WebGLBufferMeta, WebGLBufferOptions, WebGLBufferTarget, WebGLBufferUsage, WebGLDrawMode, WebGLDrawOptions, WebGLExtensions, WebGLFramebufferMeta, WebGLFramebufferOptions, WebGLProgramMeta, WebGLProgramOptions, WebGLTarget, WebGLTextureFilterMode, WebGLTextureLocation, WebGLTextureMeta, WebGLTextureOptions, WebGLTextureSource, WebGLTextureTarget, WebGLTextureWrapMode, WebGLVertexArrayObjectMeta, WebGLVertexArrayObjectOptions, WebGLVertexAttrib, WebGLVertexAttribType, WebGLViewport, XScrollBarProperties, YScrollBarProperties, ZoomBlurEffectProperties };