1. Release Notes
  2. Release 1.60.0

Booking Client (Renderer) API Changes - v1.60.0

Release: v1.60.0 Package: @seatmap.pro/renderer Date: 2026-03-19

Summary

Breaking Changes: NO New Features: 4 (selectSections mode, onSectionsSelectionChange callback, ISection.seatCount, whole-table section hover) Behavior Changes: 1 (section click at full view skips zoom) Deprecations: 0 Bug Fixes: 1 (GA section text color preserved) Architecture Improvements: Admin Renderer state machine extended with rect-select and click-toggle logic

Migration Required: NO - all existing integrations continue to work unchanged

New Features

Admin Renderer: selectSections mode (SEAT-815)

Status: New

Description: A new selectSections mode for SeatmapAdminRenderer that enables clicking and drag-selecting multiple sections at a time. Designed for use cases where consumers need the user to choose one or more sections (e.g., price assignment, capacity management).

API:

// Set mode
renderer.setMode('selectSections');

// New callback in IRendererSettings
interface IRendererSettings {
  onSectionsSelectionChange?: (sections: ISection[]) => void;  // NEW
}

// ISection extended
interface ISection {
  id: number;
  name: string;
  type: string;
  ga: boolean;
  seatCount?: number;  // NEW: number of seats (non-GA sections only)
}

Example:

const renderer = new SeatmapAdminRenderer(container, {
  publicKey: 'your-key',
  onSectionsSelectionChange: (sections) => {
    // Called after every click or drag selection
    console.log(`Selected ${sections.length} sections:`);
    sections.forEach(s => {
      console.log(`  #${s.id} ${s.name} (${s.seatCount ?? 'GA'} seats)`);
    });
  }
});

await renderer.loadEvent('event-id');

// Activate section selection
renderer.setMode('selectSections');

Drag selection modifiers (macOS-aware):

Modifier Behavior
None Replace selection with dragged rect
Shift or Cmd/Meta Add dragged rect to current selection
Alt/Option Remove dragged rect from current selection

Behavior:

  • Clicking a section in selectSections mode toggles its visual selection state
  • Dragging draws a rect; all sections intersecting the rect are selected/added/removed
  • onSectionsSelectionChange fires once per interaction with the full current selection
  • Switching away from selectSections mode clears all section visual states
  • Existing modes (pan, select, selectRows) are not affected

Performance Impact: LOW - rect intersection uses existing SVG outline geometry

Related Files:

  • src/admin-renderer/machine.ts - New SELECT_SECTIONS mode; drag and click reducers
  • src/Renderer.ts - handleRectSelectSections, fireSelectedSections
  • src/models.ts - ISection.seatCount, IRendererSettings.onSectionsSelectionChange

Whole-Table Section Hover (SEAT-824)

Status: New

Description: Tables with section-level pricing now fire onSectorMouseEnter / onSectorMouseLeave callbacks, consistent with regular section hover behavior. No new callback types are introduced; consumers can distinguish table sections via section.type.

API:

// Existing callbacks in IRendererSettings -- now also fire for table sections
interface IRendererSettings {
  onSectorMouseEnter?: (section: ISection) => void;
  onSectorMouseLeave?: () => void;
}

Behavior:

  • Tables with section-level pricing (not individual seat pricing) now trigger hover callbacks
  • The ISection object passed to onSectorMouseEnter contains the table section’s properties
  • No additional consumer code changes needed – existing hover handlers automatically receive table hover events

Performance Impact: LOW – reuses existing section hover path

Related Files:

  • src/Renderer.ts - hover event dispatch for table sections

Bug Fixes

GA Section Text Color (SEAT-817)

Status: Fixed

Description: The textColor property on GA sections was stripped during SVG redraws by inline style cleaning. The color is now preserved through the pipeline from editor to booking-service shape metadata to renderer outline processing.

Impact: LOW – GA sections with custom text colors now display correctly in the renderer

Related Files:

  • src/Renderer.ts - SVG outline processing preserves textColor

Behavior Changes

Section click at full view skips zoom (SEAT-818)

Status: Changed (no new API)

Description: When the renderer is at full zoom-out (the entire venue fits in the viewport), clicking a section no longer triggers zoom/pan. Instead, onSectionClick fires, treating the click as a selection. This applies regardless of the configured interactionZoomStrategy ('section', 'next-scale', 'default').

When zoomed in past the full-view threshold, all strategies work as before.

Impact: LOW – onSectionClick fires where it previously did not (for non-GA seated sections at full view). Consumers who rely on auto-zoom at full view can call renderer.zoomToSection() from their onSectionClick callback.

Related Files:

  • src/Renderer.ts - Early return in handleDestPanZoom() when scale <= zoomToFitScale

Configuration Changes

Constructor Options

New Options

interface IRendererSettings {
  // New in v1.60.0 - Admin Renderer only
  onSectionsSelectionChange?: (sections: ISection[]) => void;
}

No removed or deprecated options

Type Definitions

Modified Types

export interface ISection {
  id: number;
  name: string;
  type: string;
  ga: boolean;
  seatCount?: number;  // Added in v1.60.0 - seats count for non-GA sections
}

Migration Guide

No Breaking Changes

All existing integrations using SeatmapAdminRenderer or SeatmapBookingRenderer continue to work without modification.

To adopt the new selectSections mode:

// 1. Add the callback when constructing the renderer
const renderer = new SeatmapAdminRenderer(container, {
  publicKey: 'your-key',
  onSectionsSelectionChange: (sections) => {
    // Handle selection
  }
});

// 2. Switch to selectSections mode when needed
renderer.setMode('selectSections');

// 3. Switch back to another mode when done
renderer.setMode('pan');

Support

Questions or Issues?