Merge pull request #853 from HaNdTriX/dev

Add onScroll prop to Panel component

components/layout/Panel.js

@@ -3,13 +3,13 @@ import classnames from 'classnames';
 import { themr } from 'react-css-themr';
 import { LAYOUT } from '../identifiers.js';
 
-const Panel = ({ children, className, scrollY, theme }) => {
+const Panel = ({ children, className, onScroll, scrollY, theme }) => {
   const _className = classnames(theme.panel, {
     [theme.scrollY]: scrollY
   }, className);
 
   return (
-    <div data-react-toolbox='panel' className={_className}>
+    <div data-react-toolbox='panel' onScroll={onScroll} className={_className}>
       {children}
     </div>
   );
@@ -18,6 +18,7 @@ const Panel = ({ children, className, scrollY, theme }) => {
 Panel.propTypes = {
   children: PropTypes.any,
   className: PropTypes.string,
+  onScroll: PropTypes.func,
   scrollY: PropTypes.bool,
   theme: PropTypes.shape({
     panel: PropTypes.string,

components/layout/readme.md

@@ -148,6 +148,7 @@ The `Panel` is the main content area within a `Layout`.  It is a full-height fle
 ### Properties
 | Name | Type | Default | Description |
 |:-----|:-----|:-----|:-----|
+| `onScroll` | `Function` | | Callback function to be invoked when the component scrolls. |
 | `scrollY` | `bool` | `false` | If true, the panel will vertically scroll all content. |
 | `className` | `string` |  | Additional class(es) for custom styling. |
 

lib/layout/Panel.js

@@ -24,6 +24,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 var Panel = function Panel(_ref) {
   var children = _ref.children;
   var className = _ref.className;
+  var onScroll = _ref.onScroll;
   var scrollY = _ref.scrollY;
   var theme = _ref.theme;
 
@@ -31,7 +32,7 @@ var Panel = function Panel(_ref) {
 
   return _react2.default.createElement(
     'div',
-    { 'data-react-toolbox': 'panel', className: _className },
+    { 'data-react-toolbox': 'panel', onScroll: onScroll, className: _className },
     children
   );
 };
@@ -39,6 +40,7 @@ var Panel = function Panel(_ref) {
 Panel.propTypes = {
   children: _react.PropTypes.any,
   className: _react.PropTypes.string,
+  onScroll: _react.PropTypes.func,
   scrollY: _react.PropTypes.bool,
   theme: _react.PropTypes.shape({
     panel: _react.PropTypes.string,