Teeboxes.

Teeboxes privately match rendered tee pixels to the canonical scorecard's tee sets, colors, and per-hole yardages. The server sorts the matches by hole yardage and returns only the requested pixel-and-color drawing instructions. Tee names, yardages, coordinates, geometry, and projection data stay inside CADDIE.100.

type: "teeboxes"component: caddie-teeboxesProtected placement

Usage

Add the teeboxes to a graphic.

Include the component in the initial mount call, reconcile it through view.setSmartComponents, or append it with view.addSmartComponent. Types may repeat. Give repeated instances stable id values to style, show, hide, move, reset, or remove one instance independently. The selected Smart Component type, instance ID, render receipt, and protected selection options such as yardages, grid spacing, coverage, measured origin, buffer distance, detail, limits, or targets are sent to the overlay service. Marker-image origins, images, presentation styles, supported labels, and movement remain local.

const view = await caddie.mount(container, graphicRequest, [
  {
    type: "teeboxes",
    name: "Blue",
    limit: "all",
    style: {
      size: 18,
      outlineColor: "#07110D",
      outlineWidth: 2,
    },
  },
]);

view.setSmartComponentVisible("teeboxes", false);
view.setSmartComponentStyle({
  type: "teeboxes",
  style: { size: 22 },
});

Defaults

Built-in presentation.

LocationsAll scorecard-matched teeboxes

OrderLongest to shortest for selected hole

ColorCanonical scorecard tee color

DOM outputLocked SVG circles

Component options

Configure behavior and presentation.

Option	Type	Default	Description
type	"teeboxes"	Required	Requests the hole's scorecard-matched teebox locations.
id	string	Automatic	Optional stable 1–64 character instance ID using letters, numbers, underscores, or hyphens. Use IDs to independently control repeated Smart Components of the same type.
name	string	Undefined	Optionally selects one tee by exact normalized scorecard name. Matching is case-insensitive and ignores spaces and punctuation.
limit	"all" \| 5 \| 4 \| 3	"all"	Shows all matched locations or only the selected number of longest tee sets for this hole.
style.size	number	18	Dot diameter from 8 through 48 image pixels.
style.outlineColor	#RRGGBB	"#07110D"	Outline color, which keeps light scorecard colors visible on the map.
style.outlineWidth	number	2	Non-scaling outline width from 0 through 8 image pixels.

Behavior

Important implementation details.

Changing dot size or outline presentation is a local SVG update. Changing the name or location limit requests a new protected selection against the cached sidecar. A supplied name takes precedence over limit and returns one match.
Teeboxes are deliberately locked: setSmartComponentMovable("teeboxes", true) returns false.
The component response contains only image pixels and hex colors. It does not echo the requested name and excludes tee names, per-hole yardages, longitude, latitude, course geometry, and transforms.
A hole with no scorecard-matched locations fails explicitly rather than guessing colors or positions.

Protected course dataComponent responses contain only artifact-bound image pixels and safe presentation values. They do not include longitude, latitude, course geometry, affine transforms, control points, or the internal render sidecar.