IPlannerProps

@spartanfx/react v1.0.8

---

@spartanfx/react / IPlannerProps

Interface: IPlannerProps

Props for the Planner component.

Remarks

Raw items are converted into planner items based on the provided schema. View state changes may be captured via the provided callbacks.

Properties

Property	Type	Description
allowAddNew?	boolean	Whether adding new items is enabled
allowDragDrop?	boolean	Whether drag-and-drop is enabled.
allowPeriodCountSelection?	boolean	Whether to show the period count selector in the UI.
allowViewByWeek?	boolean	Whether viewing by week is permitted.
allowViewByYear?	boolean	Whether viewing by year is permitted.
appearance?	string	Appearance mode (light/dark) - AppearanceMode enum. Defaults to light.
categories?	string[]	Explicit list of category (group) strings to display as rows. When provided, one row per entry is rendered in exactly this order, even if no items exist for a given category. Extra categories found in items but not in this array are appended after the explicit list. When omitted, categories are derived from items at render time (current behavior).
className?	string	Custom CSS class on the container.
colorIndex?	number	Index for selecting a predefined color palette.
colorMapping?	ColorMapping	Optional custom color mapping.
containerHeight?	number	Height of the planner container.
containerWidth?	number	Width of the planner container.
currentMonth?	number	Current month in view.
currentWeek?	number	Current week in view.
currentYear?	number	Current year in view.
elementClassName?	string	CSS class applied to each item element.
grouped?	boolean	Whether items should be displayed in grouped mode.
groupIconMapping?	GroupIconMapping	Optional custom group icon mapping per group.
items	Record<string, unknown>[]	Raw item list before schema transformation.
legendProps?	Partial<ILegendProps>	Additional props passed to the legend component.
loading?	boolean	Update this prop to show the embbedded loading animation of the Planner
maxPeriodCount?	PeriodCount	Max period count to show in the selector in the UI.
nonWorkingDates?	Date[]	Specific dates that should be styled as non-working days. Independent of nonWorkingWeekdays — both can be used together. A day is non-working if it matches either rule. Time components are ignored when comparing. Defaults to an empty array when omitted.
nonWorkingWeekdays?	number[]	Recurring weekday numbers that should be styled as non-working days. Uses JavaScript Date.getDay() numbering: 0 = Sunday, 6 = Saturday. Defaults to [0, 6] (Saturday and Sunday) when omitted.
onChangeCurrentMonth?	(month) => void	Month change callback.
onChangeCurrentWeek?	(week) => void	Week change callback.
onChangeCurrentYear?	(year) => void	Year change callback.
onChangePeriodCount?	(count) => void	Period count change callback.
onChangeViewBy?	(viewBy) => void	View mode change callback.
onDragClass?	string	CSS class applied during drag operations.
onPlannerDatesChanged?	(newStartDate, newEndDate) => void	Callback for planner dates changed
onRenderGroup?	(groupStr) => Element	Custom renderer to render the group element.
onRenderItem?	(item, props) => ReactNode	Optional callback to render a custom inner element for each planner item. The ElementWrapper behaviour (drag, resize, click, context menu) is preserved.
options	IPlannerOptions	Global planner configuration and event hooks.
periodCount?	PeriodCount	Number of periods to display (1 or 2).
schema	IPlannerSchema	Mapping definition from raw data to planner item.
showLegend?	boolean	Whether the color legend should be displayed.
style?	any	Inline styles for the container.
viewBy?	ViewBy	Current view mode.