types of property orientation are incompatible

[AdrienLemaire]

Getting this error when trying to type my Tiled map:

[tsserver 2345] [E] Argument of type '{ compressionlevel: number; height: number; infinite: boolean; layers: { compression: string; data: string; encoding: string; height: number; id: number; name: string; opacity: number; type: string; visible: boolean; width: number; x: number; y: number; }[]; ... 10 more ...; width: number; }' is not assignable to parameter of type 'SetStateAction<TiledMapOrthogonal | TiledMapIsometric | TiledMapHexagonal | TiledMapStaggered | undefined>'.
  Type '{ compressionlevel: number; height: number; infinite: boolean; layers: { compression: string; data: string; encoding: string; height: number; id: number; name: string; opacity: number; type: string; visible: boolean; width: number; x: number; y: number; }[]; ... 10 more ...; width: number; }' is not assignable to type 'TiledMapOrthogonal'.
    Types of property 'orientation' are incompatible.
      Type 'string' is not assignable to type '"orthogonal"'.

My tiled json looks like this:

{
  "compressionlevel": -1,
  "height": 50,
  "infinite": false,
  ...
  "orientation": "orthogonal",
  "renderorder": "right-down",
  "tiledversion": "1.4.2",
  ...
}

Also, compressionlevel seems to be missing from the types definition.

Using typescript 4.1 and tiled-types 1.1.0

[AdrienLemaire]

This is strange. My map only has tilelayer type objects in layers, but tiled-types detects imagelayer...

{
  "compressionlevel": -1,
  "height": 50,
  "infinite": false,
  "layers": [
    {
      "compression": "zlib",
      "data": "eJztlFsOgjAQRQl8CN2IwEbFxz7Exz7Ex6K8PyaTQUNbDTM183GSmSbT0HtKyyLLKuBAmXBdgwa0idfSOc7tg85qcfCND6fIQaiPT3tIO/D1QXstuYf64Odwb9xIO/DxURfj/9v3vmny8arpWUoFucf44LnTNQ0OYt4r7kKDA9/3it4tOqvFQagPfg4tDnx98LfrH3zQ/0KLg1AfKdTSOZoP8zFHvcjRgwq4fNyn4mOJb61BA9p83JsP82HvVfrvlfnQk6n5kM/RfJgPzbV0jubDfGiupXM0H+ZDcy2do/kwH5pr6Rx/Va/AGmzANoKOzXcEvh7bT+23A3twAEdwiqBn8z2Br8f2U/udwQVcwQ3cIxjY/EDg67H91H4P8AS1PGLR",
      "encoding": "base64",
      "height": 50,
      "id": 1,
      "name": "Ground",
      "opacity": 1,
      "type": "tilelayer",
      "visible": true,
      "width": 50,
      "x": 0,
      "y": 0
    },
    ...
  ],
  ...
}

[Chnapy]

Hi,
It's because layers are not always tilelayers:

export type TiledLayer<O extends TiledMapType> = TiledLayerTilelayer | TiledLayerObjectgroup<O> | TiledLayerImagelayer | TiledLayerGroup;

So in your case you have to check if current layer is a tilelayer, then you can manipulate its data:

map.layers.forEach(layer => {

  if(layer.type === 'tilelayer') {
    pako.inflate(layer.data);
  }

});

This said, I see that your data is string, but my typings expect number[].
What version of Tiled did you use to generate your file ?

Ok I checked Tiled doc, seems that there is changes in props (or I just forgot them 🙈 ).
So I see two changes to do:

• in TiledLayerTilelayer, data: string | number[];
• in TiledMapAbstract, add compressionlevel: number;

I hope finding some time to make changes & also check others forgotten props. If you can make a PR for that it would be great 😄

[Chnapy]

I just released a new version with all fixed, consider upgrading to 1.2.1.

For tilelayer typing consider doing one of these solutions:

// you have only tilelayers, no need to check them

const tilelayers = map.layers as TiledLayerTilelayer[];

tilelayers.layers.forEach(layer => {
    pako.inflate(layer.data);
});

// you can have other layer types

map.layers.forEach(layer => {
  if(layer.type === 'tilelayer') {
    pako.inflate(layer.data);
  }
});

[AdrienLemaire]

That was fast! Thank you very much @Chnapy !