Rename resizing->resized, defaultResizing->defaultResized, onResize->onResizedChange

This commit is contained in:
Aaron Schwartz
2017-05-10 16:52:45 -07:00
parent 7e0bca8a17
commit 171ff37bcd
4 changed files with 35 additions and 35 deletions

View File

@@ -20,8 +20,10 @@ export default {
collapseOnDataChange: true,
freezeWhenExpanded: false,
showFilters: false,
resizable: true,
defaultSorted: [],
defaultFiltered: [],
defaultResized: [],
defaultExpanded: {},
defaultFilterMethod: (filter, row, column) => {
const id = filter.pivotId || filter.id
@@ -44,15 +46,13 @@ export default {
// returning 0, undefined or any falsey value will use subsequent sorts or the index as a tiebreaker
return 0
},
resizable: true,
defaultResizing: [],
// Controlled State Props
// page: undefined,
// pageSize: undefined,
// sorted: [],
// filtered: [],
// resizing: [],
// resized: [],
// expanded: {},
// Controlled State Callbacks
@@ -61,7 +61,7 @@ export default {
onPageSizeChange: undefined,
onSortedChange: undefined,
onFilteredChange: undefined,
onResize: undefined,
onResizedChange: undefined,
onExpanded: undefined,
// Pivoting

View File

@@ -37,7 +37,7 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
sorted: props.defaultSorted,
expanded: props.defaultExpanded,
filtered: props.defaultFiltered,
resizing: props.defaultResizing,
resized: props.defaultResized,
currentlyResizing: false,
skipNextSort: false
}
@@ -92,7 +92,7 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
page,
sorted,
filtered,
resizing,
resized,
pages,
// Pivoting State
expanded,
@@ -159,8 +159,8 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
const canNext = page + 1 < pages
const rowMinWidth = _.sum(allVisibleColumns.map(d => {
const resized = resizing.find(x => x.id === d.id) || {}
return _.getFirstDefined(resized.value, d.width, d.minWidth)
const resizedColumn = resized.find(x => x.id === d.id) || {}
return _.getFirstDefined(resizedColumn.value, d.width, d.minWidth)
}))
let rowIndex = -1
@@ -204,7 +204,7 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
}
const makeHeaderGroup = (column, i) => {
const resizedValue = col => (resizing.find(x => x.id === col.id) || {}).value
const resizedValue = col => (resized.find(x => x.id === col.id) || {}).value
const flex = _.sum(column.columns.map(col => col.width || resizedValue(col) ? 0 : col.minWidth))
const width = _.sum(column.columns.map(col => _.getFirstDefined(resizedValue(col), col.width, col.minWidth)))
const maxWidth = _.sum(column.columns.map(col => _.getFirstDefined(resizedValue(col), col.width, col.maxWidth)))
@@ -279,11 +279,11 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
}
const makeHeader = (column, i) => {
const resized = resizing.find(x => x.id === column.id) || {}
const resizedCol = resized.find(x => x.id === column.id) || {}
const sort = sorted.find(d => d.id === column.id)
const show = typeof column.show === 'function' ? column.show() : column.show
const width = _.getFirstDefined(resized.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resized.value, column.width, column.maxWidth)
const width = _.getFirstDefined(resizedCol.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resizedCol.value, column.width, column.maxWidth)
const theadThProps = _.splitProps(getTheadThProps(finalState, undefined, column, this))
const columnHeaderProps = _.splitProps(column.getHeaderProps(finalState, undefined, column, this))
@@ -370,9 +370,9 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
}
const makeFilter = (column, i) => {
const resized = resizing.find(x => x.id === column.id) || {}
const width = _.getFirstDefined(resized.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resized.value, column.width, column.maxWidth)
const resizedCol = resized.find(x => x.id === column.id) || {}
const width = _.getFirstDefined(resizedCol.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resizedCol.value, column.width, column.maxWidth)
const theadFilterThProps = _.splitProps(getTheadFilterThProps(finalState, undefined, column, this))
const columnHeaderProps = _.splitProps(column.getHeaderProps(finalState, undefined, column, this))
@@ -454,10 +454,10 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
{...trProps.rest}
>
{allVisibleColumns.map((column, i2) => {
const resized = resizing.find(x => x.id === column.id) || {}
const resizedCol = resized.find(x => x.id === column.id) || {}
const show = typeof column.show === 'function' ? column.show() : column.show
const width = _.getFirstDefined(resized.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resized.value, column.width, column.maxWidth)
const width = _.getFirstDefined(resizedCol.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resizedCol.value, column.width, column.maxWidth)
const tdProps = _.splitProps(getTdProps(finalState, rowInfo, column, this))
const columnProps = _.splitProps(column.getProps(finalState, rowInfo, column, this))
@@ -641,11 +641,11 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
}
const makePadColumn = (column, i) => {
const resized = resizing.find(x => x.id === column.id) || {}
const resizedCol = resized.find(x => x.id === column.id) || {}
const show = typeof column.show === 'function' ? column.show() : column.show
let width = _.getFirstDefined(resized.value, column.width, column.minWidth)
let width = _.getFirstDefined(resizedCol.value, column.width, column.minWidth)
let flex = width
let maxWidth = _.getFirstDefined(resized.value, column.width, column.maxWidth)
let maxWidth = _.getFirstDefined(resizedCol.value, column.width, column.maxWidth)
const tdProps = _.splitProps(getTdProps(finalState, undefined, column, this))
const columnProps = _.splitProps(column.getProps(finalState, undefined, column, this))
@@ -707,10 +707,10 @@ export default class ReactTable extends Methods(Lifecycle(Component)) {
}
const makeColumnFooter = (column, i) => {
const resized = resizing.find(x => x.id === column.id) || {}
const resizedCol = resized.find(x => x.id === column.id) || {}
const show = typeof column.show === 'function' ? column.show() : column.show
const width = _.getFirstDefined(resized.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resized.value, column.width, column.maxWidth)
const width = _.getFirstDefined(resizedCol.value, column.width, column.minWidth)
const maxWidth = _.getFirstDefined(resizedCol.value, column.width, column.maxWidth)
const tFootTdProps = _.splitProps(getTfootTdProps(finalState, undefined, undefined, this))
const columnProps = _.splitProps(column.getProps(finalState, undefined, column, this))
const columnFooterProps = _.splitProps(column.getFooterProps(finalState, undefined, column, this))

View File

@@ -633,11 +633,11 @@ export default Base => class extends Base {
}
resizeColumnMoving (event) {
const {onResize} = this.props
const {resizing, currentlyResizing} = this.getResolvedState()
const {onResizedChange} = this.props
const {resized, currentlyResizing} = this.getResolvedState()
// Delete old value
const newResizing = resizing.filter(x => x.id !== currentlyResizing.id)
const newResized = resized.filter(x => x.id !== currentlyResizing.id)
let pageX
@@ -650,19 +650,19 @@ export default Base => class extends Base {
// Set the min size to 10 to account for margin and border or else the group headers don't line up correctly
const newWidth = Math.max(currentlyResizing.parentWidth + pageX - currentlyResizing.startX, 11)
newResizing.push({
newResized.push({
id: currentlyResizing.id,
value: newWidth
})
onResize && onResize(newResizing, event)
onResizedChange && onResizedChange(newResized, event)
if (this.props.resizing) {
if (this.props.resized) {
return
}
this.setStateWithData({
resizing: newResizing
resized: newResized
})
}
}

View File

@@ -38,7 +38,7 @@ class Story extends React.Component {
page: 0,
pageSize: 10,
expanded: {},
resizing: [],
resized: [],
filtered: []
}
}
@@ -57,14 +57,14 @@ class Story extends React.Component {
page={this.state.page}
pageSize={this.state.pageSize}
expanded={this.state.expanded}
resizing={this.state.resizing}
resized={this.state.resized}
filtered={this.state.filtered}
// Callbacks
onSortedChange={sorted => this.setState({sorted})}
onPageChange={page => this.setState({page})}
onPageSizeChange={(pageSize, page) => this.setState({page, pageSize})}
onExpanded={(expanded) => this.setState({expanded})}
onResize={resizing => this.setState({resizing})}
onExpanded={expanded => this.setState({expanded})}
onResizedChange={resized => this.setState({resized})}
onFilteredChange={filtered => this.setState({filtered})}
/>
</div>