WindyMadman/fortune-sheet
1
0
Fork 0
mirror of https://github.com/ruilisi/fortune-sheet.git synced 2025-01-07 03:16:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: use produceWithPatches universally for op extracting and history recording

Browse Source
This commit is contained in:
zyc9012 2022-04-04 21:35:26 +08:00
parent cde439db0b
commit 6757b973a5
18 changed files with 499 additions and 596 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/core/tsconfig.json
View File

@ -1,10 +0,0 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"outDir": "./lib",
"rootDir": "./src",
"baseUrl": "./",
"composite": true
},
"include": ["./src"]
}

9
packages/react/src/components/ContextMenu/SheetTab.tsx
View File

@ -6,7 +6,6 @@ import React, {
useState,
useLayoutEffect,
} from "react";
import produce from "immer";
import WorkbookContext from "../../context";
import "./index.css";
import Menu from "./Menu";
@ -68,12 +67,10 @@ const SheetTabContextMenu: React.FC<Props> = ({
>
<Menu
onClick={() => {
setContext(
produce((draftCtx) => {
deleteSheet(draftCtx, sheet.index);
setContext((draftCtx) => {
deleteSheet(draftCtx, sheet.index!);
onClose?.();
})
);
});
}}
>
{sheetconfig.delete}

43
packages/react/src/components/ContextMenu/index.tsx
View File

@ -7,7 +7,6 @@ import {
} from "@fortune-sheet/core";
import _ from "lodash";
import React, { useContext, useMemo, useRef, useLayoutEffect } from "react";
import produce from "immer";
import WorkbookContext from "../../context";
import "./index.css";
import Menu from "./Menu";
@ -24,12 +23,10 @@ const ContextMenu: React.FC = () => {
<Menu
key="copy"
onClick={() => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleCopy(draftCtx);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
{rightclick.copy}
@ -39,12 +36,10 @@ const ContextMenu: React.FC = () => {
<Menu
key="paste"
onClick={() => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handlePasteByClick(draftCtx);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
{rightclick.paste}
@ -56,8 +51,7 @@ const ContextMenu: React.FC = () => {
<Menu
key={`add-col-${dir}`}
onClick={(e) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
const position =
draftCtx.luckysheet_select_save?.[0]?.column?.[0];
if (position == null) return;
@ -76,8 +70,7 @@ const ContextMenu: React.FC = () => {
draftCtx.currentSheetIndex
);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
<>
@ -106,8 +99,7 @@ const ContextMenu: React.FC = () => {
<Menu
key={`add-row-${dir}`}
onClick={(e, container) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
const position =
draftCtx.luckysheet_select_save?.[0]?.row?.[0];
if (position == null) return;
@ -124,8 +116,7 @@ const ContextMenu: React.FC = () => {
draftCtx.currentSheetIndex
);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
<>
@ -154,12 +145,10 @@ const ContextMenu: React.FC = () => {
onClick={() => {
if (!selection) return;
const [st_index, ed_index] = selection.column;
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
deleteRowCol(draftCtx, "column", st_index, ed_index);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
{rightclick.deleteSelected}
@ -172,12 +161,10 @@ const ContextMenu: React.FC = () => {
onClick={() => {
if (!selection) return;
const [st_index, ed_index] = selection.row;
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
deleteRowCol(draftCtx, "row", st_index, ed_index);
draftCtx.contextMenu = undefined;
})
);
});
}}
>
{rightclick.deleteSelected}
@ -214,12 +201,10 @@ const ContextMenu: React.FC = () => {
hasOverflow = true;
}
if (hasOverflow) {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
draftCtx.contextMenu.x = left;
draftCtx.contextMenu.y = top;
})
);
});
}
}, [contextMenu, setContext]);

19
packages/react/src/components/FxEditor/index.tsx
View File

@ -17,7 +17,6 @@ import React, {
useEffect,
useRef,
} from "react";
import produce from "immer";
import "./index.css";
import _ from "lodash";
import WorkbookContext from "../../context";
@ -65,8 +64,7 @@ const FxEditor: React.FC = () => {
const onFocus = useCallback(() => {
if ((context.luckysheet_select_save?.length ?? 0) > 0) {
setFocused(true);
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
const last =
draftCtx.luckysheet_select_save![
draftCtx.luckysheet_select_save!.length - 1
@ -78,8 +76,7 @@ const FxEditor: React.FC = () => {
draftCtx.luckysheetCellUpdate = [row_index, col_index];
refs.globalCache.doNotFocus = true;
// formula.rangeResizeTo = $("#luckysheet-functionbox-cell");
})
);
});
}
}, [context.luckysheet_select_save, refs.globalCache, setContext]);
@ -90,8 +87,7 @@ const FxEditor: React.FC = () => {
// return;
// }
lastKeyDownEventRef.current = e;
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
if (context.luckysheetCellUpdate.length > 0) {
switch (e.key) {
case "Enter": {
@ -194,8 +190,7 @@ const FxEditor: React.FC = () => {
break;
}
}
})
);
});
},
[context.luckysheetCellUpdate.length, refs.fxInput, setContext]
);
@ -222,16 +217,14 @@ const FxEditor: React.FC = () => {
kcode === 46 ||
(e.ctrlKey && kcode === 86)
) {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleFormulaInput(
draftCtx,
refs.cellInput.current!,
refs.fxInput.current!,
kcode
);
})
);
});
}
}, [refs.cellInput, refs.fxInput, setContext]);

27
packages/react/src/components/Sheet/index.tsx
View File

@ -9,7 +9,6 @@ import {
} from "@fortune-sheet/core";
import "./index.css";
import type { CellMatrix } from "@fortune-sheet/core";
import produce from "immer";
import WorkbookContext from "../../context";
import SheetOverlay from "../SheetOverlay";
@ -25,16 +24,14 @@ const Sheet: React.FC<Props> = ({ data }) => {
useEffect(() => {
function resize() {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
updateContextWithSheetData(draftCtx, data);
updateContextWithCanvas(
draftCtx,
canvasRef.current!,
placeholderRef.current!
);
})
);
});
}
window.addEventListener("resize", resize);
return () => {
@ -43,30 +40,24 @@ const Sheet: React.FC<Props> = ({ data }) => {
}, [data, setContext]);
useEffect(() => {
setContext(
produce((draftCtx) => updateContextWithSheetData(draftCtx, data))
);
setContext((draftCtx) => updateContextWithSheetData(draftCtx, data));
}, [context.config?.rowlen, context.config?.columnlen, data, setContext]);
useEffect(() => {
setContext(
produce((draftCtx) =>
setContext((draftCtx) =>
updateContextWithCanvas(
draftCtx,
canvasRef.current!,
placeholderRef.current!
)
)
);
}, [setContext]);
useEffect(() => {
if (hasGroupValuesRefreshData()) {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
groupValuesRefresh(draftCtx);
})
);
});
}
}, [context.luckysheetfile, context.currentSheetIndex, setContext]);
@ -82,8 +73,7 @@ const Sheet: React.FC<Props> = ({ data }) => {
const onWheel = useCallback(
(e: WheelEvent) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleGlobalWheel(
draftCtx,
e,
@ -91,8 +81,7 @@ const Sheet: React.FC<Props> = ({ data }) => {
refs.scrollbarX.current!,
refs.scrollbarY.current!
);
})
);
});
},
[refs.globalCache, refs.scrollbarX, refs.scrollbarY, setContext]
);

19
packages/react/src/components/SheetOverlay/ColumnHeader.tsx
View File

@ -15,7 +15,6 @@ import React, {
useCallback,
useEffect,
} from "react";
import produce from "immer";
import WorkbookContext from "../../context";
const ColumnHeader: React.FC = () => {
@ -55,15 +54,13 @@ const ColumnHeader: React.FC = () => {
const onMouseDown = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleColumnHeaderMouseDown(
draftCtx,
e.nativeEvent,
containerRef.current!
);
})
);
});
},
[setContext]
);
@ -77,16 +74,14 @@ const ColumnHeader: React.FC = () => {
const onColSizeHandleMouseDown = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleColSizeHandleMouseDown(
draftCtx,
e.nativeEvent,
containerRef.current!,
refs.cellArea.current!
);
})
);
});
e.stopPropagation();
},
[refs.cellArea, setContext]
@ -94,16 +89,14 @@ const ColumnHeader: React.FC = () => {
const onContextMenu = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleContextMenu(
draftCtx,
settings,
e.nativeEvent,
refs.workbookContainer.current!
);
})
);
});
},
[refs.workbookContainer, setContext, settings]
);

18
packages/react/src/components/SheetOverlay/InputBox.tsx
View File

@ -19,7 +19,6 @@ import React, {
useLayoutEffect,
} from "react";
import _ from "lodash";
import produce from "immer";
import WorkbookContext from "../../context";
import ContentEditable from "./ContentEditable";
import FormulaSearch from "./FormulaSearch";
@ -107,8 +106,7 @@ const InputBox: React.FC = () => {
// return;
// }
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
if (e.key === "Escape" && draftCtx.luckysheetCellUpdate.length > 0) {
cancelNormalSelected(draftCtx);
moveHighlightCell(draftCtx, "down", 0, "rangeOfSelect");
@ -152,10 +150,7 @@ const InputBox: React.FC = () => {
// }
e.preventDefault();
} else if (
e.key === "F4" &&
draftCtx.luckysheetCellUpdate.length > 0
) {
} else if (e.key === "F4" && draftCtx.luckysheetCellUpdate.length > 0) {
// formula.setfreezonFuc(event);
e.preventDefault();
} /* else if (
@ -179,8 +174,7 @@ const InputBox: React.FC = () => {
) {
formulaMoveEvent("right", ctrlKey, shiftKey, event);
} */
})
);
});
},
[setContext]
);
@ -213,8 +207,7 @@ const InputBox: React.FC = () => {
kcode === 46 ||
(e.ctrlKey && kcode === 86)
) {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
// if(event.target.id!="luckysheet-input-box" && event.target.id!="luckysheet-rich-text-editor"){
handleFormulaInput(
draftCtx,
@ -233,8 +226,7 @@ const InputBox: React.FC = () => {
// draftCtx.flowdata
// );
// }
})
);
});
}
}, [refs.cellInput, refs.fxInput, setContext]);

19
packages/react/src/components/SheetOverlay/RowHeader.tsx
View File

@ -15,7 +15,6 @@ import React, {
useCallback,
useEffect,
} from "react";
import produce from "immer";
import WorkbookContext from "../../context";
const RowHeader: React.FC = () => {
@ -55,15 +54,13 @@ const RowHeader: React.FC = () => {
const onMouseDown = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleRowHeaderMouseDown(
draftCtx,
e.nativeEvent,
containerRef.current!
);
})
);
});
},
[setContext]
);
@ -77,16 +74,14 @@ const RowHeader: React.FC = () => {
const onRowSizeHandleMouseDown = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleRowSizeHandleMouseDown(
draftCtx,
e.nativeEvent,
containerRef.current!,
refs.cellArea.current!
);
})
);
});
e.stopPropagation();
},
[refs.cellArea, setContext]
@ -94,16 +89,14 @@ const RowHeader: React.FC = () => {
const onContextMenu = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleContextMenu(
draftCtx,
settings,
e.nativeEvent,
refs.workbookContainer.current!
);
})
);
});
},
[refs.workbookContainer, setContext, settings]
);

10
packages/react/src/components/SheetOverlay/ScrollBar/index.tsx
View File

@ -7,7 +7,7 @@ type Props = {
};
const ScrollBar: React.FC<Props> = ({ axis }) => {
const { context, refs, setContextValue } = useContext(WorkbookContext);
const { context, refs, setContext } = useContext(WorkbookContext);
useEffect(() => {
if (axis === "x") {
@ -24,9 +24,13 @@ const ScrollBar: React.FC<Props> = ({ axis }) => {
className={`luckysheet-scrollbars luckysheet-scrollbar-ltr luckysheet-scrollbar-${axis}`}
onScroll={() => {
if (axis === "x") {
setContextValue("scrollLeft", refs.scrollbarX.current!.scrollLeft);
setContext((draftCtx) => {
draftCtx.scrollLeft = refs.scrollbarX.current!.scrollLeft;
});
} else {
setContextValue("scrollTop", refs.scrollbarY.current!.scrollTop);
setContext((draftCtx) => {
draftCtx.scrollTop = refs.scrollbarY.current!.scrollTop;
});
}
}}
>

31
packages/react/src/components/SheetOverlay/index.tsx
View File

@ -1,6 +1,5 @@
import React, { useContext, useCallback, useRef, useEffect } from "react";
import "./index.css";
import produce from "immer";
import {
handleCellAreaDoubleClick,
handleCellAreaMouseDown,
@ -20,56 +19,49 @@ const SheetOverlay: React.FC = () => {
const cellAreaMouseDown = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleCellAreaMouseDown(
draftCtx,
e.nativeEvent,
refs.cellInput.current!,
refs.cellArea.current!
);
})
);
});
},
[refs.cellArea, refs.cellInput, setContext]
);
const cellAreaContextMenu = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleContextMenu(
draftCtx,
settings,
e.nativeEvent,
refs.workbookContainer.current!
);
})
);
});
},
[refs.workbookContainer, setContext, settings]
);
const cellAreaDoubleClick = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleCellAreaDoubleClick(
draftCtx,
settings,
e.nativeEvent,
refs.cellArea.current!
);
})
);
});
},
[refs.cellArea, setContext, settings]
);
const onMouseMove = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleOverlayMouseMove(
draftCtx,
e.nativeEvent,
@ -77,24 +69,21 @@ const SheetOverlay: React.FC = () => {
refs.scrollbarY.current!,
containerRef.current!
);
})
);
});
},
[refs.scrollbarX, refs.scrollbarY, setContext]
);
const onMouseUp = useCallback(
(e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleOverlayMouseUp(
draftCtx,
settings,
e.nativeEvent,
containerRef.current!
);
})
);
});
},
[setContext, settings]
);

13
packages/react/src/components/SheetTab/SheetItem.tsx
View File

@ -6,7 +6,6 @@ import React, {
useRef,
useCallback,
} from "react";
import produce from "immer";
import WorkbookContext from "../../context";
import SheetTabContextMenu from "../ContextMenu/SheetTab";
@ -15,7 +14,7 @@ type Props = {
};
const SheetItem: React.FC<Props> = ({ sheet }) => {
const { context, setContext, setContextValue } = useContext(WorkbookContext);
const { context, setContext } = useContext(WorkbookContext);
const [editing, setEditing] = useState(false);
const containerRef = useRef<HTMLDivElement>(null);
const editable = useRef<HTMLSpanElement>(null);
@ -53,11 +52,9 @@ const SheetItem: React.FC<Props> = ({ sheet }) => {
}, [editing]);
const onBlur = useCallback(() => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
handleSheetTabOnBlur(draftCtx, editable.current!);
})
);
});
setEditing(false);
}, [setContext]);
@ -71,7 +68,9 @@ const SheetItem: React.FC<Props> = ({ sheet }) => {
: ""
}`}
onClick={() => {
setContextValue("currentSheetIndex", sheet.index);
setContext((draftCtx) => {
draftCtx.currentSheetIndex = sheet.index!;
});
}}
onContextMenu={(e) => {
const rect = containerRef.current!.getBoundingClientRect();

7
packages/react/src/components/SheetTab/index.tsx
View File

@ -1,5 +1,4 @@
import React, { useContext, useRef } from "react";
import produce from "immer";
import { updateCell, addSheet } from "@fortune-sheet/core";
import WorkbookContext from "../../context";
import SVGIcon from "../SVGIcon";
@ -21,8 +20,7 @@ const SheetTab: React.FC = () => {
<div
className="fortune-sheettab-button"
onClick={() => {
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
if (draftCtx.luckysheetCellUpdate.length > 0) {
updateCell(
draftCtx,
@ -32,8 +30,7 @@ const SheetTab: React.FC = () => {
);
}
addSheet(draftCtx);
})
);
});
}}
>
<SVGIcon name="plus" width={16} height={16} />

13
packages/react/src/components/Toolbar/index.tsx
View File

@ -1,5 +1,4 @@
import React, { useContext, useCallback, useRef } from "react";
import produce from "immer";
import {
getToolbarItemClickHandler,
handleTextBackground,
@ -32,14 +31,12 @@ const Toolbar: React.FC = () => {
}
if (["text-color", "text-background"].includes(name)) {
const pick = (color: string) => {
setContext(
produce((draftCtx) =>
setContext((draftCtx) =>
(name === "text-color" ? handleTextColor : handleTextBackground)(
draftCtx,
refs.cellInput.current!,
color
)
)
);
if (name === "text-color") {
refs.globalCache.recentTextColor = color;
@ -103,14 +100,12 @@ const Toolbar: React.FC = () => {
<Option
key={num}
onClick={() => {
setContext(
produce((draftContext) =>
setContext((draftContext) =>
handleTextSize(
draftContext,
refs.cellInput.current!,
num
)
)
);
setOpen(false);
}}
@ -129,14 +124,12 @@ const Toolbar: React.FC = () => {
tooltip={name}
key={name}
onClick={() =>
setContext(
produce((draftCtx) => {
setContext((draftCtx) => {
getToolbarItemClickHandler(name)?.(
draftCtx,
refs.cellInput.current!
);
})
)
}
/>
);

64
packages/react/src/components/Workbook/index.tsx
View File

@ -20,7 +20,7 @@ import React, {
useRef,
} from "react";
import "./index.css";
import produce from "immer";
import { enablePatches, produceWithPatches } from "immer";
import _, { assign } from "lodash";
import Sheet from "../Sheet";
import WorkbookContext from "../../context";
@ -30,6 +30,8 @@ import SheetTab from "../SheetTab";
import ContextMenu from "../ContextMenu";
import SVGDefines from "../SVGDefines";
enablePatches();
const Workbook: React.FC<
Settings & { onChange?: (data: SheetType[]) => void }
> = ({ onChange, ...props }) => {
@ -45,21 +47,21 @@ const Workbook: React.FC<
() => assign(defaultSettings, props) as Required<Settings>,
[props]
);
const setContextValue = useCallback(
<K extends keyof Context>(key: K, value: Context[K]) => {
setContext(
produce((draftCtx) => {
draftCtx[key] = value;
})
);
const setContextWithProduce = useCallback(
(recipe: (ctx: Context) => void) => {
setContext((ctx_) => {
const [result] = produceWithPatches(ctx_, recipe);
return result;
});
},
[]
);
const providerValue = useMemo(
() => ({
context,
setContext,
setContextValue,
setContext: setContextWithProduce,
settings: mergedSettings,
refs: {
globalCache: globalCache.current,
@ -71,7 +73,7 @@ const Workbook: React.FC<
workbookContainer,
},
}),
[context, mergedSettings, setContextValue]
[context, mergedSettings, setContextWithProduce]
);
useEffect(() => {
@ -79,8 +81,7 @@ const Workbook: React.FC<
}, [context.luckysheetfile, onChange]);
useEffect(() => {
setContext(
produce((draftCtx) => {
setContextWithProduce((draftCtx) => {
if (_.isEmpty(draftCtx.luckysheetfile)) {
// mergedSettings.data at this time may be immutable, causing following modifications to fail,
// clone it to make it mutable
@ -121,9 +122,8 @@ const Workbook: React.FC<
const lastRowNum = lastRow?.r || draftCtx.defaultrowNum;
const lastColNum = lastCol?.c || draftCtx.defaultcolumnNum;
if (lastRowNum && lastColNum) {
const expandedData: SheetType["data"] = _.times(
lastRowNum + 1,
() => _.times(lastColNum + 1, () => null)
const expandedData: SheetType["data"] = _.times(lastRowNum + 1, () =>
_.times(lastColNum + 1, () => null)
);
cellData?.forEach((d) => {
// TODO setCellValue(draftCtx, d.r, d.c, expandedData, d.v);
@ -196,12 +196,11 @@ const Workbook: React.FC<
if (!_.isNil(mergedSettings.lang)) {
localStorage.setItem("lang", mergedSettings.lang);
}
})
);
});
}, [
mergedSettings.data,
context.currentSheetIndex,
context.luckysheetfile?.length,
context.luckysheetfile.length,
mergedSettings.defaultRowHeight,
mergedSettings.defaultColWidth,
mergedSettings.column,
@ -212,11 +211,12 @@ const Workbook: React.FC<
mergedSettings.allowEdit,
mergedSettings.limitSheetNameLength,
mergedSettings.defaultSheetNameMaxLength,
setContextWithProduce,
]);
const onKeyDown = useCallback((e: React.KeyboardEvent<HTMLDivElement>) => {
setContext(
produce((draftCtx) => {
const onKeyDown = useCallback(
(e: React.KeyboardEvent<HTMLDivElement>) => {
setContextWithProduce((draftCtx) => {
handleGlobalKeyDown(
draftCtx,
cellInput.current!,
@ -224,17 +224,19 @@ const Workbook: React.FC<
e.nativeEvent,
globalCache.current!
);
})
});
},
[setContextWithProduce]
);
}, []);
const onPaste = useCallback((e: ClipboardEvent) => {
setContext(
produce((draftCtx) => {
const onPaste = useCallback(
(e: ClipboardEvent) => {
setContextWithProduce((draftCtx) => {
handlePaste(draftCtx, e);
})
});
},
[setContextWithProduce]
);
}, []);
useEffect(() => {
document.addEventListener("paste", onPaste);
@ -270,7 +272,9 @@ const Workbook: React.FC<
{!_.isEmpty(context.contextMenu) && (
<div
onMouseDown={() => {
setContextValue("contextMenu", undefined);
setContextWithProduce((draftCtx) => {
draftCtx.contextMenu = undefined;
});
}}
onMouseMove={(e) => e.stopPropagation()}
onMouseUp={(e) => e.stopPropagation()}

4
packages/react/src/context/index.ts
View File

@ -19,15 +19,13 @@ type RefValues = {
const WorkbookContext = React.createContext<{
context: Context;
setContext: React.Dispatch<React.SetStateAction<Context>>;
setContext: (recipe: (ctx: Context) => void) => void;
// eslint-disable-next-line
setContextValue: <K extends keyof Context>(key: K, value: Context[K]) => void;
settings: Required<Settings>;
refs: RefValues;
}>({
context: defaultContext(),
setContext: () => {},
setContextValue: () => {},
settings: defaultSettings,
refs: {
globalCache: {},

16
packages/react/tsconfig.json
View File

@ -1,16 +0,0 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"rootDirs": ["./src", "../core/src"],
"outDir": "./lib",
"baseUrl": "./",
"paths": {
"@fortune-sheet/core": ["../core/src"]
},
"composite": true
},
"include": [
"./src"
],
"references": [{ "path": "../core" }]
}

4
stories/Workbook.stories.tsx
View File

@ -11,6 +11,7 @@ export default {
} as ComponentMeta<typeof Workbook>;
const Template: ComponentStory<typeof Workbook> = ({
// eslint-disable-next-line react/prop-types
data: data0,
...args
}) => {
@ -26,13 +27,16 @@ const Template: ComponentStory<typeof Workbook> = ({
};
export const Basic = Template.bind({});
// @ts-ignore
Basic.args = { data: [cell] };
export const Formula = Template.bind({});
// @ts-ignore
Formula.args = { data: [formula] };
export const Empty = Template.bind({});
Empty.args = { data: [empty] };
export const Tabs = Template.bind({});
// @ts-ignore
Tabs.args = { data: [cell, formula] };

1
tsconfig.json
View File

@ -19,7 +19,6 @@
"@fortune-sheet/react": ["packages/react/src"]
}
},
"references": [{ "path": "./packages/core" }, { "path": "./packages/react" }],
"include": ["packages/*/src", "stories/"],
"exclude": [
"node_modules",