Directory Options

Complete reference for the options object passed to .directory.init().

Top-level init keys

These are set on .directory.init(), not inside options:

Key	Type	Default	Description
selector	string	#haven-app	DOM element to render into
format	string	list	Display format
category	string	null	Lock to a single category nicename
data	array	null	Pre-fetched product data
routing	object	see Routing	URL routing configuration
options	object	{}	Feature options (below)

Layout

Option	Type	Default	Description
id	string	haven-list	ID of the generated list wrapper
sort	string	name	Sort field (name, etc.)
cols	number	1	Grid columns
maxWidth	number/string	1280	Max container width (px)
responsive	object	null	Breakpoint → { cols } map
css	string	''	Additional CSS class on container
titleTag	string	h3	Heading tag for list item titles
showCategoryTitle	boolean	true	Show category title when active
categoryTitleTag	string	h1	Tag for category title
omitDetails	array	[]	Detail fields to hide

Categories

Option	Type	Default	Description
categories.include	array	null	Category nicenames to include
categories.includePath	boolean	false	Include category in URL path
categories.custom	array	null	Custom category configuration

Default category set when none specified: ACCOMM, FOODDRINK, ATTRACTION, SPORTREC.

Breadcrumb

Option	Type	Default	Description
breadcrumb.enabled	boolean	false	Enable breadcrumbs
breadcrumb.selector	string	null	External container selector
breadcrumb.rootLabel	string	Directory	Root breadcrumb label
breadcrumb.showOnRoot	boolean	false	Show breadcrumb on root view
breadcrumb.showProductInLightbox	boolean	true	Show product name in lightbox
breadcrumb.includeRootWhenCategoryLocked	boolean	true	Show root when category locked
breadcrumb.autoload	boolean	false	Auto-load breadcrumb on init
breadcrumb.maxWidth	string	''	Max width override

Images

Each image type accepts imgix parameters:

images: {
  thumbnail: { ar: '3:2', w: 600, h: 400, fit: 'crop' },
  logo:      { ar: '3:2', w: 600, h: 400, fit: 'max' },
  featured:  { ar: '3:2', w: 1280, h: 400, fit: 'max' },
  banner:    { ar: '21:6', w: 1280, fit: 'crop' },
  gallery:   { ar: '16:9', w: 1280, fit: 'crop' },
}

Map

Enable with includeMap: true. See Maps and Lightbox for details.

Option	Type	Default	Description
map.autoload	boolean	false	Load map on init
map.geoLocateControl	boolean	false	Show geolocation button
map.mapAttachment	string	beforebegin	Where to insert map in DOM
map.isClustered	boolean	false	Cluster markers
map.hideFiltered	boolean	false	Hide filtered markers
map.mapBoxOptions.style	string	mapbox://styles/mapbox/light-v11	Mapbox style URL
map.mapBoxOptions.zoom	number	10	Initial zoom level
map.mapBoxOptions.center	array	[lng, lat]	Initial map center
map.markerOptions.showLabel	boolean	false	Show marker labels
map.markerOptions.style.default.color	string	#00A4DB	Marker color
map.markerOptions.style.default.hoverColor	string	#8DC63F	Hover color
map.zoomOptions.target	number	17	Zoom level on item click
map.zoomOptions.popups	number	15	Zoom level for labels
map.zoomOptions.controls	boolean	true	Show zoom controls

Lightbox

Enable with includeLightbox: true.

Option	Type	Default	Description
lightbox.expandDirection	string	bottom	Panel direction: top, bottom, left, right

Filter

Option	Type	Default	Description
filter.selector	string	required	External filter container
filter.maxWidth	number	inherits maxWidth	Filter max width
filter.fields	object	{}	Field definitions (see Filters)

Favorites

Option	Type	Description
faves	object	Favorites configuration (passed to HavenFaves)

Valid formats

list, itinerary, contactcard, category, detail, category-list, category-event