diff --git a/src/components/TableHeadingCellEnhancer.js b/src/components/TableHeadingCellEnhancer.js
index c7590770..3ee6c757 100644
--- a/src/components/TableHeadingCellEnhancer.js
+++ b/src/components/TableHeadingCellEnhancer.js
@@ -11,7 +11,10 @@ const EnhancedHeadingCell = OriginalComponent => compose(
   }),
   mapProps(({ events: { onSort }, ...props }) => ({
     ...props,
-    onClick: combineHandlers([() => onSort && onSort({ id: props.columnId }), props.onClick]),
+    onClick: combineHandlers([
+      () => onSort && onSort(props.sortProperty || { id: props.columnId }),
+      props.onClick,
+    ]),
   }))
 )(props => <OriginalComponent {...props} />);
 
diff --git a/stories/index.tsx b/stories/index.tsx
index 20556ca5..dfb7e141 100644
--- a/stories/index.tsx
+++ b/stories/index.tsx
@@ -90,11 +90,11 @@ storiesOf('Griddle main', module)
 
     // don't do things this way - fine for example storybook
     const events = {
-      onFilter: () => console.log('onFilter'),
-      onSort: () => console.log('onSort'),
+      onFilter: filter => console.log('onFilter', filter),
+      onSort: sortProperties => console.log('onSort', sortProperties),
       onNext: () => console.log('onNext'),
       onPrevious: () => console.log('onPrevious'),
-      onGetPage: () => console.log('onGetPage')
+      onGetPage: pageNumber => console.log('onGetPage', pageNumber),
     }
 
     return (