@code-rhapsodie/react-scheduler 0.4.0 → 0.5.0

package/dist/components/Calendar/Grid/Grid.d.ts

@@ -1,5 +1,5 @@
 import { JSX } from "react";
 import { GridProps } from "./types";
-export declare function Grid({ zoom, rows, data, onTileClick, ref }: GridProps & {
+export declare function Grid({ zoom, rows, data, onTileClick, onCellClick, onCellRangeSelect, onTileMove, selectedCell, ref }: GridProps & {
     ref?: React.Ref<HTMLDivElement>;
 }): JSX.Element;

package/dist/components/Calendar/Grid/styles.d.ts

@@ -4,3 +4,4 @@ export declare const StyledInnerWrapper: IStyledComponent<any, any>;
 export declare const StyledCanvas: IStyledComponent<any, any>;
 export declare const StyledCanvasHeader: IStyledComponent<any, any>;
 export declare const StyledSpan: IStyledComponent<any, any>;
+export declare const StyledSelectedCell: IStyledComponent<any, any>;

package/dist/components/Calendar/Grid/types.d.ts

@@ -1,10 +1,17 @@
-import { PaginatedSchedulerData, SchedulerProjectData } from "@/types/global";
+import { CellClickData, CellRangeSelectData, PaginatedSchedulerData, SchedulerProjectData, SelectedRange, TileMoveData } from "@/types/global";
 export type GridProps = {
     zoom: number;
     rows: number;
     data: PaginatedSchedulerData;
     onTileClick?: (data: SchedulerProjectData) => void;
+    onCellClick?: (data: CellClickData) => void;
+    onCellRangeSelect?: (data: CellRangeSelectData) => void;
+    onTileMove?: (data: TileMoveData) => void;
+    /**
+     * A cell or range to highlight (e.g. the last selection made via onCellClick/onCellRangeSelect)
+     */
+    selectedCell?: SelectedRange | null;
 };
 export type StyledSpanProps = {
-    position: "left" | "right";
+    $position: "left" | "right";
 };

package/dist/components/Calendar/types.d.ts

@@ -1,12 +1,16 @@
-import { SchedulerData, SchedulerItemClickData, SchedulerProjectData } from "@/types/global";
+import { CellClickData, CellRangeSelectData, SchedulerData, SchedulerItemClickData, SchedulerProjectData, SelectedRange, TileMoveData } from "@/types/global";
 export type CalendarProps = {
     data: SchedulerData;
     topBarWidth: number;
     onTileClick?: (data: SchedulerProjectData) => void;
     onItemClick?: (data: SchedulerItemClickData) => void;
+    onCellClick?: (data: CellClickData) => void;
+    onCellRangeSelect?: (data: CellRangeSelectData) => void;
+    onTileMove?: (data: TileMoveData) => void;
+    selectedCell?: SelectedRange | null;
     toggleTheme?: () => void;
 };
 export type StyledSpanProps = {
-    position: "left" | "right";
+    $position: "left" | "right";
 };
 export type ProjectsData = [projectsPerPerson: SchedulerProjectData[][][], rowsPerPerson: number[]];

package/dist/components/LeftColumn/LeftColumnItem/types.d.ts

@@ -6,9 +6,9 @@ export type LeftColumnItemProps = {
     onItemClick?: (data: SchedulerItemClickData) => void;
 };
 export type StyledTextProps = {
-    isMain?: boolean;
+    $isMain?: boolean;
 };
 export type StyledLeftColumnItemWrapperProps = {
-    rows: number;
-    clickable: boolean;
+    $rows: number;
+    $clickable: boolean;
 };

package/dist/components/LeftColumn/types.d.ts

@@ -11,5 +11,5 @@ export type LeftColumnProps = {
     onItemClick?: (data: SchedulerItemClickData) => void;
 };
 export type StyledInputWrapperProps = {
-    isFocused: boolean;
+    $isFocused: boolean;
 };

package/dist/components/Loader/types.d.ts

@@ -1,6 +1,7 @@
 export interface StyledWrapperProps {
-    position: "left" | "right";
+    $position: "left" | "right";
 }
-export interface LoaderProps extends StyledWrapperProps {
+export interface LoaderProps {
     isLoading: boolean;
+    position: "left" | "right";
 }

package/dist/components/PaginationButton/types.d.ts

@@ -7,5 +7,5 @@ export type PaginationButtonProps = {
     icon?: React.ReactNode;
 };
 export type StyledPaginationButton = {
-    isVisible: boolean;
+    $isVisible: boolean;
 };

package/dist/components/Scheduler/Scheduler.d.ts

@@ -1,4 +1,4 @@
 import { JSX } from "react";
 import { SchedulerProps } from "./types";
-declare const Scheduler: ({ data, config, startDate, onRangeChange, onTileClick, onFilterData, onClearFilterData, onItemClick, isLoading }: SchedulerProps) => JSX.Element;
+declare const Scheduler: ({ data, config, startDate, onRangeChange, onTileClick, onFilterData, onClearFilterData, onItemClick, onCellClick, onCellRangeSelect, onTileMove, selectedCell, isLoading }: SchedulerProps) => JSX.Element;
 export default Scheduler;

package/dist/components/Scheduler/types.d.ts

@@ -1,4 +1,4 @@
-import { Config, SchedulerData, SchedulerItemClickData, SchedulerProjectData } from "@/types/global";
+import { CellClickData, CellRangeSelectData, Config, SchedulerData, SchedulerItemClickData, SchedulerProjectData, SelectedRange, TileMoveData } from "@/types/global";
 import { ParsedDatesRange } from "@/utils/getDatesRange";
 export type SchedulerProps = {
     data: SchedulerData;
@@ -10,7 +10,26 @@ export type SchedulerProps = {
     onFilterData?: () => void;
     onClearFilterData?: () => void;
     onItemClick?: (data: SchedulerItemClickData) => void;
+    /**
+     * Fired when clicking an empty cell (a resource row on a given date with no tile),
+     * without dragging to a different date
+     */
+    onCellClick?: (data: CellClickData) => void;
+    /**
+     * Fired when dragging across several empty cells on the same resource row, from
+     * mouse down to mouse up
+     */
+    onCellRangeSelect?: (data: CellRangeSelectData) => void;
+    /**
+     * Fired when a tile is dragged and dropped onto a new cell, to reschedule it (and
+     * optionally reassign it to a different resource row)
+     */
+    onTileMove?: (data: TileMoveData) => void;
+    /**
+     * A cell or range to highlight, e.g. the last selection made via onCellClick/onCellRangeSelect
+     */
+    selectedCell?: SelectedRange | null;
 };
 export type StyledOutsideWrapperProps = {
-    showScroll: boolean;
+    $showScroll: boolean;
 };

package/dist/components/Tiles/Tile/types.d.ts

@@ -4,7 +4,26 @@ export type TileProps = {
     data: SchedulerProjectData;
     zoom: number;
     onTileClick?: (data: SchedulerProjectData) => void;
+    /**
+     * When true, the tile can be dragged to reschedule it (an ancestor is
+     * expected to handle the drop and call the consumer's onTileMove)
+     */
+    draggable?: boolean;
+    /**
+     * Fired when the tile starts being dragged, with the number of cells between the
+     * tile's start and the point it was grabbed at
+     */
+    onDragStart?: (grabOffset: number) => void;
+    onDragEnd?: () => void;
+    /**
+     * When true, the tile is rendered as a non-interactive ghost showing where a dragged
+     * tile would land
+     */
+    preview?: boolean;
+};
+export type StyledTileWrapperProps = {
+    $preview?: boolean;
 };
 export type StyledTextProps = {
-    bold?: boolean;
+    $bold?: boolean;
 };

package/dist/components/Tiles/types.d.ts

@@ -1,8 +1,16 @@
 import type { JSX } from "react";
-import { PaginatedSchedulerData, SchedulerProjectData } from "@/types/global";
+import { PaginatedSchedulerData, SchedulerProjectData, TileMoveData } from "@/types/global";
 export type TilesProps = {
     zoom: number;
     data: PaginatedSchedulerData;
     onTileClick?: (data: SchedulerProjectData) => void;
+    onTileMove?: (data: TileMoveData) => void;
+    onTileDragStart?: (drag: TileDragStart) => void;
+    onTileDragEnd?: () => void;
+};
+export type TileDragStart = {
+    project: SchedulerProjectData;
+    resourceId: string;
+    grabOffset: number;
 };
 export type PlacedTiles = JSX.Element[];

package/dist/context/CalendarProvider/types.d.ts

@@ -25,6 +25,15 @@ export type CalendarContextType = {
     dayOfYear: number;
     recordsThreshold: number;
     config: Config;
+    /**
+     * Bumped every time handleGoNext/handleGoPrev navigate, paired with the direction,
+     * so a consumer can replay a transition each time (a plain state change is not enough
+     * when the same direction is pressed twice in a row).
+     */
+    navigation: {
+        direction: "next" | "prev";
+        tick: number;
+    } | null;
 };
 export type CalendarProviderProps = {
     children: ReactNode;