diff --git a/components/View/GridViewLayout/GridItem/index.js b/components/View/GridViewLayout/GridItem/index.js
index abc171c2e..2443c0f15 100644
--- a/components/View/GridViewLayout/GridItem/index.js
+++ b/components/View/GridViewLayout/GridItem/index.js
@@ -1,4 +1,5 @@
import PropTypes from 'prop-types';
+import { _cs } from '@togglecorp/fujs';
import React from 'react';
import styles from './styles.scss';
@@ -39,17 +40,11 @@ export default class GridItem extends React.PureComponent {
render() {
const {
- className: classNameFromProps,
+ className,
layoutSelector,
datum,
} = this.props;
- const className = `
- ${classNameFromProps}
- grid-item
- ${styles.gridItem}
- `;
-
const Header = this.renderHeader;
const Content = this.renderContent;
const layout = layoutSelector(datum);
@@ -61,7 +56,7 @@ export default class GridItem extends React.PureComponent {
return (
diff --git a/components/View/GridViewLayout/GridItem/styles.scss b/components/View/GridViewLayout/GridItem/styles.scss
index d24083f1a..35615c499 100644
--- a/components/View/GridViewLayout/GridItem/styles.scss
+++ b/components/View/GridViewLayout/GridItem/styles.scss
@@ -1,4 +1,3 @@
-
.grid-item {
position: absolute;
top: 0;
diff --git a/components/View/GridViewLayout/index.js b/components/View/GridViewLayout/index.js
index 24f05b3ad..36aa6eee7 100644
--- a/components/View/GridViewLayout/index.js
+++ b/components/View/GridViewLayout/index.js
@@ -1,5 +1,6 @@
import PropTypes from 'prop-types';
import React from 'react';
+import { _cs } from '@togglecorp/fujs';
import List from '../List';
import GridItem from './GridItem';
@@ -18,12 +19,14 @@ const propTypes = {
itemContentModifier: PropTypes.func.isRequired,
layoutSelector: PropTypes.func.isRequired,
keySelector: PropTypes.func.isRequired,
+ itemRendererParams: PropTypes.func,
};
const defaultProps = {
className: '',
itemClassName: '',
data: [],
+ itemRendererParams: undefined,
};
@@ -68,29 +71,27 @@ export default class GridViewLayout extends React.PureComponent {
layoutSelector,
itemHeaderModifier: headerModifier,
itemContentModifier: contentModifier,
+ itemRendererParams,
} = this.props;
+ const newParams = itemRendererParams ? itemRendererParams(key, datum) : {};
+
return {
layoutSelector,
headerModifier,
contentModifier,
datum,
+ ...newParams,
};
}
render() {
const {
- className: classNameFromProps,
+ className,
keySelector,
itemClassName,
} = this.props;
- const className = `
- ${classNameFromProps}
- ${styles.gridViewLayout}
- 'grid-view-layout'
- `;
-
const style = {
width: `${this.bounds.width}px`,
height: `${this.bounds.height}px`,
@@ -98,7 +99,7 @@ export default class GridViewLayout extends React.PureComponent {
return (
);
}