Skip to content

Commit fcb9b9a

Browse files
authored
feat: Slot group prop getter (jquense#1471) (jquense#1510)
* feat: Added slotGroupPropGetter (jquense#1471) * fix: Pass getters to time gutter
1 parent 7b5a6a7 commit fcb9b9a

File tree

5 files changed

+33
-17
lines changed

5 files changed

+33
-17
lines changed

.size-snapshot.json

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
{
22
"./dist/react-big-calendar.js": {
3-
"bundled": 501317,
4-
"minified": 146786,
5-
"gzipped": 44762
3+
"bundled": 507436,
4+
"minified": 149016,
5+
"gzipped": 45496
66
},
77
"./dist/react-big-calendar.min.js": {
8-
"bundled": 439004,
9-
"minified": 127972,
10-
"gzipped": 40409
8+
"bundled": 444328,
9+
"minified": 130089,
10+
"gzipped": 41174
1111
},
1212
"dist/react-big-calendar.esm.js": {
13-
"bundled": 168678,
14-
"minified": 80552,
15-
"gzipped": 19913,
13+
"bundled": 174497,
14+
"minified": 83179,
15+
"gzipped": 20739,
1616
"treeshaked": {
1717
"rollup": {
18-
"code": 58283,
18+
"code": 60400,
1919
"import_statements": 1578
2020
},
2121
"webpack": {
22-
"code": 62787
22+
"code": 64923
2323
}
2424
}
2525
}

src/Calendar.js

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -486,14 +486,23 @@ class Calendar extends React.Component {
486486

487487
/**
488488
* Optionally provide a function that returns an object of className or style props
489-
* to be applied to the the time-slot node. Caution! Styles that change layout or
489+
* to be applied to the time-slot node. Caution! Styles that change layout or
490490
* position may break the calendar in unexpected ways.
491491
*
492492
* ```js
493493
* (date: Date, resourceId: (number|string)) => { className?: string, style?: Object }
494494
* ```
495495
*/
496-
slotPropGetter: PropTypes.func,
496+
slotPropGetter: PropTypes.func,
497+
498+
/**
499+
* Optionally provide a function that returns an object of props to be applied
500+
* to the time-slot group node. Useful to dynamically change the sizing of time nodes.
501+
* ```js
502+
* () => { style?: Object }
503+
* ```
504+
*/
505+
slotGroupPropGetter: PropTypes.func,
497506

498507
/**
499508
* Optionally provide a function that returns an object of className or style props
@@ -775,7 +784,8 @@ class Calendar extends React.Component {
775784
resourceIdAccessor,
776785
resourceTitleAccessor,
777786
eventPropGetter,
778-
slotPropGetter,
787+
slotPropGetter,
788+
slotGroupPropGetter,
779789
dayPropGetter,
780790
view,
781791
views,
@@ -794,7 +804,9 @@ class Calendar extends React.Component {
794804
eventProp: (...args) =>
795805
(eventPropGetter && eventPropGetter(...args)) || {},
796806
slotProp: (...args) =>
797-
(slotPropGetter && slotPropGetter(...args)) || {},
807+
(slotPropGetter && slotPropGetter(...args)) || {},
808+
slotGroupProp: (...args) =>
809+
(slotGroupPropGetter && slotGroupPropGetter(...args)) || {},
798810
dayProp: (...args) => (dayPropGetter && dayPropGetter(...args)) || {},
799811
},
800812
components: defaults(components[view] || {}, omit(components, names), {

src/TimeGrid.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -240,6 +240,7 @@ export default class TimeGrid extends Component {
240240
timeslots={this.props.timeslots}
241241
components={components}
242242
className="rbc-time-gutter"
243+
getters={getters}
243244
/>
244245
{this.renderEvents(range, rangeEvents, getNow())}
245246
</div>

src/TimeGutter.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export default class TimeGutter extends Component {
3636
}
3737

3838
render() {
39-
const { resource, components } = this.props
39+
const { resource, components, getters } = this.props
4040

4141
return (
4242
<div className="rbc-time-gutter rbc-time-column">
@@ -48,6 +48,7 @@ export default class TimeGutter extends Component {
4848
resource={resource}
4949
components={components}
5050
renderSlot={this.renderSlot}
51+
getters={getters}
5152
/>
5253
)
5354
})}
@@ -63,6 +64,7 @@ TimeGutter.propTypes = {
6364
step: PropTypes.number.isRequired,
6465
getNow: PropTypes.func.isRequired,
6566
components: PropTypes.object.isRequired,
67+
getters: PropTypes.object,
6668

6769
localizer: PropTypes.object.isRequired,
6870
resource: PropTypes.string,

src/TimeSlotGroup.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,9 @@ export default class TimeSlotGroup extends Component {
1414
components: { timeSlotWrapper: Wrapper = BackgroundWrapper } = {},
1515
} = this.props
1616

17+
const groupProps = getters ? getters.slotGroupProp() : {}
1718
return (
18-
<div className="rbc-timeslot-group">
19+
<div className="rbc-timeslot-group" {...groupProps}>
1920
{group.map((value, idx) => {
2021
const slotProps = getters ? getters.slotProp(value, resource) : {}
2122
return (

0 commit comments

Comments
 (0)