import React from 'react' ; import { FocusZone , FocusZoneDirection } from '@fluentui/react/lib/FocusZone' ; import { List } from '@fluentui/react/lib/List' ; import ProviderTemplateListItem from './ProviderTemplateListItem' ; import store from '../../../store' ; import { TopLevelSpec } from 'vega-lite' ; import { Spec } from 'vega' ; import { resolveTemplatesForProvider } from '../../../core/template' ; const ProviderTemplateList = ( ) => { const { templateProvider } = store ( ( state ) => state ) , localTemplates = resolveTemplatesForProvider ( ) , onRenderCell = ( item , index , containsFocus ) : JSX . Element => ( < ProviderTemplateListItem item = { item } index = { index } / > ) ; return ( < FocusZone direction = { FocusZoneDirection . vertical } key = { templateProvider } > < List items = { localTemplates } onRenderCell = { onRenderCell } / > < /FocusZone>); } ; export default ProviderTemplateList ;