diff --git a/src/components/map/TiledLayer.test.tsx b/src/components/map/TiledLayer.test.tsx
index 5f5fbf6..81bc9a9 100644
--- a/src/components/map/TiledLayer.test.tsx
+++ b/src/components/map/TiledLayer.test.tsx
@@ -1,5 +1,8 @@
import { render, screen } from '@testing-library/react';
import TiledLayer from './TiledLayer';
+import { TileFactory } from './types';
+
+const fakeTileFactory: TileFactory = (keyObject) => <>>;
describe('The TiledLayer component ', () => {
test('exposes the tiles needed per its viewport', () => {
@@ -8,6 +11,7 @@ describe('The TiledLayer component ', () => {
);
@@ -37,6 +41,7 @@ describe('The TiledLayer component ', () => {
);
@@ -45,6 +50,7 @@ describe('The TiledLayer component ', () => {
);
diff --git a/src/components/map/TiledLayer.tsx b/src/components/map/TiledLayer.tsx
index 4c34858..68f0b55 100644
--- a/src/components/map/TiledLayer.tsx
+++ b/src/components/map/TiledLayer.tsx
@@ -1,7 +1,7 @@
import react, { useRef } from 'react';
import { range } from 'lodash';
-import { Rectangle, TileKeyObject } from './types';
+import { Rectangle, TileFactory, TileKeyObject } from './types';
import tileUri from './uris';
export interface TiledLayerProperties {
@@ -9,6 +9,8 @@ export interface TiledLayerProperties {
keyObject: TileKeyObject;
/** The current viewport expressed in tiles coordinates */
viewPort: Rectangle;
+ /** The factory to create tiles */
+ tileFactory: TileFactory;
}
/**
diff --git a/src/components/map/types.ts b/src/components/map/types.ts
index 3fe0f9a..a2af287 100644
--- a/src/components/map/types.ts
+++ b/src/components/map/types.ts
@@ -29,3 +29,9 @@ export interface Rectangle {
topLeft: Point;
bottomRight: Point;
}
+
+/**
+ * A function which creates tiles
+ * @param keyObject - the {@link TileKeyObject} identifying the tile.
+ */
+export type TileFactory = (keyObject: TileKeyObject) => any;