ListView API

API reference docs for the Stash ListView component. Learn about the props, CSS, and other APIs of this exported module.

Import

import ListView from '@leaflink/stash/ListView.vue';

Props

Name	Type	Default	Description
disableLoader	boolean	false	Do not use the LoadingManager, and instead render the default slot as passed
disablePersistency	boolean	-	Whether to disable the sticky filters if disabled, the following will happen 1. pre-selected value(s) can be added to the filter component's attributes to overwrite the sticky filters 2. users will not have sticky filters on the page
disableShowFilter	boolean	-	Whether to disable the ability of saving 'show-filters' in local storage
disableStickyHeader	boolean	-	Whether to disable the stickiness of the header. Default is false. When true, neither the list headers nor the bulk actions (when applicable) will be sticky.
emptyStateText	string	''	Text to render in EmptyState component if there are no results
filterSchema	array	[]
fuzzySearch	boolean	false	Make search fuzzy. Only for client side search.
hideBulkActionOptions	boolean	false	Prevent bulk actions dropdown from rendering
hideNumberOfTotalSelected	boolean	false	Hide the '{number} of {total} selected' text for bulk actions
hideSelectAll	boolean	false	Hide the Select All checkbox for bulk actions
hideTotal	boolean	-
initialPage	number	undefined
initialSearchTerm	string	''	If initial search term is provided, the list will be filtered on load.
isItemDisabled	func	() => false	Function that determines whether the item checkbox is disabled or not (default: false)
isSelectable	boolean	-	Can items on the page be selected for bulk actions
isServerSide	boolean	-	For loading data already paginated, filtered (including search), and sorted from a backend. Defining this prop will disable the built-in search, filtering, sorting and pagination. You will instead need to use the available events (`@change`, and `@change:` prefixed) to know when to request new pages from your backend. This requires providing `totalItemCount`. Use the loading prop to indicate when data is being loaded.
itemTrackBy	string	'id'	Default field to track selected items by
items	array	[]	The data for each row. Used in this file as this.internalItems (a copy) to allow mutation;
loading	boolean	-
pageSize	number	50
searchSchema	object	{}
showFiltersOnLoad	boolean	-	Whether to expand the filters section by default on load.
sortLabel	string	'() => t(ll.listView.sortBy)'
sortOnLoad	boolean	-
sorts	object	{}
stickyHeaderOffset	number	null	Override the header offset used to position the sticky header
totalItemCount	number	undefined	Total number of unpaginated results Required when `isServerSide` is `true`
validationSchema	func	() => () => undefined	Validation schema function that returns an object

Slots

Name	Description
actions
secondary-controls
eyebrow	Renders custom content in the space below the filters and above the list
list-header
bulk-actions
list-items
default

Events

Name	Description
change
change:filter
change:page
change:search
change:sort
change:reset
filters-toggle-click
select-all
deselect-all
update-filters
updateResults