Tilemaps are a new placeable asset type that is painted with autotiles in the scene view, with layers, brush, eraser and rectangle, and is drawn at runtime and in the export (#128)

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/core/properties/PropertySchema.ts

@@ -21,6 +21,7 @@ import {
 } from './kinds';
 import { findAssetOf, type Project } from '../model/Project';
 import { AUTOTILE_FPS_KEY, AUTOTILE_KIND_KEY, AUTOTILE_PLAYBACK_KEY } from '../model/autotile';
+import { TILEMAP_COLUMNS_KEY, TILEMAP_ROWS_KEY, TILEMAP_TILE_KEY } from '../model/tilemap';
 import { SLICE_SCALE_KEY } from '../model/texture';
 import type { SceneObject } from '../model/SceneObject';
 import { flatListOf, listItemOf } from './listItems';
@@ -140,6 +141,7 @@ const TRANSFORM_TYPES: ReadonlySet<AssetType> = new Set([
   'collider',
   'container',
   'particles',
+  'tilemap',
 ]);
 
 export function hasTransformProps(type: AssetType): boolean {
@@ -244,6 +246,14 @@ const ASSET_SCHEMAS: Record<AssetType, PropertySchema> = {
       ],
     },
   ],
+  // The layers and their cells are intrinsic data on the asset (see TilemapAsset); these three say
+  // how far the grid reaches and how big one cell is drawn. An autotile's own pictures are scaled
+  // onto that cell, so one tilemap can mix autotiles drawn at different resolutions.
+  tilemap: [
+    { key: TILEMAP_COLUMNS_KEY, label: 'Columns', kind: 'number', default: 20, min: 1, max: 1000, step: 1 },
+    { key: TILEMAP_ROWS_KEY, label: 'Rows', kind: 'number', default: 15, min: 1, max: 1000, step: 1 },
+    { key: TILEMAP_TILE_KEY, label: 'Tile size', kind: 'number', default: 48, min: 1, step: 1 },
+  ],
   // Behaviors declare their own properties (variables) per asset too – see `schemaForAsset`.
   behavior: [{ key: 'runInEditor', label: 'Run in editor', kind: 'boolean', default: false }],
   // Every row is declared on the asset itself – see `schemaForBag`.

src/core/properties/bounds.ts

@@ -15,6 +15,7 @@ import {
   translation,
 } from '../model/matrix';
 import { type PropertyBag, textOf, type Vec2 } from '../model/Properties';
+import { tilemapSize } from '../model/tilemap';
 import { cameraFrame } from './camera';
 import { colliderSize } from './collider';
 import { defaultsFor } from './PropertySchema';
@@ -64,6 +65,10 @@ export function footprintOf(type: AssetType, props: PropertyBag): { w: number; h
     // framed is the source, which is a point with a handle around it.
     case 'particles':
       return { w: PARTICLES_SYMBOL, h: PARTICLES_SYMBOL };
+    // The whole grid, centred on the object's position like every other footprint – so its cells
+    // are the same squares for drawing, for picking and for the outline around it.
+    case 'tilemap':
+      return tilemapSize(props);
     default:
       return cameraFrame(props);
   }