defaultGeoTypeDefinitions • tldraw Docs

Built-in geo type definitions keyed by their geo prop value. Every default geo type (rectangle, ellipse, cloud, etc.) is registered here. The same registry powers path generation, handle snapping, the style panel picker, and creation defaults — so custom types added through get the same treatment as the built-ins.
The key order here defines the visual order of items in the geo style panel picker.
defaultGeoTypeDefinitions: {
  readonly "arrow-down": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-arrow-down";
    readonly snapType: "polygon";
  };
  readonly "arrow-left": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-arrow-left";
    readonly snapType: "polygon";
  };
  readonly "arrow-right": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-arrow-right";
    readonly snapType: "polygon";
  };
  readonly "arrow-up": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-arrow-up";
    readonly snapType: "polygon";
  };
  readonly "check-box": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-check-box";
    readonly snapType: "polygon";
  };
  readonly "rhombus-2": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-rhombus-2";
    readonly snapType: "polygon";
  };
  readonly "x-box": {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
      strokeWidth: number,
    ) => PathBuilder;
    readonly icon: "geo-x-box";
    readonly snapType: "polygon";
  };
  readonly cloud: {
    readonly defaultSize: {
      readonly h: 180;
      readonly w: 300;
    };
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-cloud";
    readonly snapType: "blobby";
  };
  readonly diamond: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-diamond";
    readonly snapType: "polygon";
  };
  readonly ellipse: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-ellipse";
    readonly snapType: "blobby";
  };
  readonly heart: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-heart";
    readonly snapType: "blobby";
  };
  readonly hexagon: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-hexagon";
    readonly snapType: "polygon";
  };
  readonly octagon: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-octagon";
    readonly snapType: "polygon";
  };
  readonly oval: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-oval";
    readonly snapType: "blobby";
  };
  readonly pentagon: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-pentagon";
    readonly snapType: "polygon";
  };
  readonly rectangle: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-rectangle";
    readonly snapType: "polygon";
  };
  readonly rhombus: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-rhombus";
    readonly snapType: "polygon";
  };
  readonly star: {
    readonly defaultSize: {
      readonly h: 190;
      readonly w: 200;
    };
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-star";
    readonly snapType: "polygon";
  };
  readonly trapezoid: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-trapezoid";
    readonly snapType: "polygon";
  };
  readonly triangle: {
    readonly getPath: (
      w: number,
      h: number,
      shape: TLGeoShape,
    ) => PathBuilder;
    readonly icon: "geo-triangle";
    readonly snapType: "polygon";
  };
};