michael/webpack-base
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: michael:da29115c33b332be2afe63d9a743f730bd2515d0
Branches Tags
michael:master
..
compare: michael:32214a0ef63c6d9201a194098d044aac94caa4b5
Branches Tags
michael:master

No commits in common. "da29115c33b332be2afe63d9a743f730bd2515d0" and "32214a0ef63c6d9201a194098d044aac94caa4b5" have entirely different histories.
da29115c33 ... 32214a0ef6

4 changed files with 2186 additions and 1592 deletions
Show Stats Expand all files Collapse all files

3734
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

34
package.json
View File

@ -10,32 +10,32 @@
"author": "", "author": "",
"license": "ISC", "license": "ISC",
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.17.0", "@eslint/js": "^9.7.0",
"@types/eslint__js": "^8.42.3", "@types/eslint__js": "^8.42.3",
"@types/react": "^19.0.2", "@types/react": "^18.3.3",
"@types/react-dom": "^19.0.2", "@types/react-dom": "^18.3.0",
"css-loader": "^7.1.2", "css-loader": "^7.1.2",
"eslint": "^8.57.1", "eslint": "^8.57.0",
"eslint-plugin-react": "^7.37.2", "eslint-plugin-react": "^7.35.0",
"eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-hooks": "^4.6.2",
"eslint-plugin-unused-imports": "^3.2.0", "eslint-plugin-unused-imports": "^3.2.0",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"html-webpack-plugin": "^5.6.3", "html-webpack-plugin": "^5.6.0",
"prettier": "^3.4.2", "prettier": "^3.3.3",
"prettier-plugin-organize-imports": "^4.1.0", "prettier-plugin-organize-imports": "^4.0.0",
"sass": "^1.83.0", "sass": "^1.77.8",
"sass-loader": "^16.0.4", "sass-loader": "^14.2.1",
"style-loader": "^4.0.0", "style-loader": "^4.0.0",
"ts-loader": "^9.5.1", "ts-loader": "^9.5.1",
"typescript": "^5.7.2", "typescript": "^5.5.3",
"typescript-eslint": "^7.18.0", "typescript-eslint": "^7.16.1",
"webpack": "^5.97.1", "webpack": "^5.93.0",
"webpack-cli": "^5.1.4", "webpack-cli": "^5.1.4",
"webpack-dev-server": "^5.2.0" "webpack-dev-server": "^5.0.4"
}, },
"dependencies": { "dependencies": {
"jotai": "^2.10.4", "jotai": "^2.9.0",
"react": "^19.0.0", "react": "^18.3.1",
"react-dom": "^19.0.0" "react-dom": "^18.3.1"
} }
} }

8
src/core/context-menu.tsx
View File

@ -6,19 +6,19 @@ import { useAlignment } from './hooks';
/** calls the close action when you hit escape or click outside of the ref element */ /** calls the close action when you hit escape or click outside of the ref element */
export function useActionWhenEscapeOrClickedOrContextOutsideEffect( export function useActionWhenEscapeOrClickedOrContextOutsideEffect(
refs: RefObject<HTMLElement | null>[], refs: RefObject<HTMLElement>[],
actionFunc: () => void, actionFunc: () => void,
) { ) {
// have to use a ref here and not states since we can't re-assign state between mouseup and click // have to use a ref here and not states since we can't re-assign state between mouseup and click
const data = useRef< const data = useRef<
Map<number, { ref: RefObject<HTMLElement | null>; mouseDownTarget: Node | null; mouseUpTarget: Node | null }> Map<number, { ref: RefObject<HTMLElement>; mouseDownTarget: Node | null; mouseUpTarget: Node | null }>
>(new Map()); >(new Map());
const [hadMouseDown, setHadMouseDown] = useState<boolean>(false); const [hadMouseDown, setHadMouseDown] = useState<boolean>(false);
useEffect(() => { useEffect(() => {
data.current.clear(); data.current.clear();
for (let i = 0; i < refs.length; ++i) { for (let i = 0; i < refs.length; ++i) {
const ref = refs[i] as RefObject<HTMLElement | null>; const ref = refs[i] as RefObject<HTMLElement>;
data.current.set(i, { ref, mouseDownTarget: null, mouseUpTarget: null }); data.current.set(i, { ref, mouseDownTarget: null, mouseUpTarget: null });
} }
}, [refs]); }, [refs]);
@ -125,7 +125,7 @@ export function useActionWhenEscapeOrClickedOrContextOutsideEffect(
} }
export interface ContextProps { export interface ContextProps {
rootRef?: RefObject<HTMLDivElement | null>; rootRef?: RefObject<HTMLDivElement>;
relativeToRef?: RefObject<HTMLElement>; relativeToRef?: RefObject<HTMLElement>;
relativeToPos?: { x: number; y: number }; relativeToPos?: { x: number; y: number };
alignment: IAlignment; alignment: IAlignment;

2
src/core/hooks.ts
View File

@ -173,7 +173,7 @@ export function useAsyncSubmitText<ErrorType>(
/** aligns an element to a reference element or position every time realignDeps changes */ /** aligns an element to a reference element or position every time realignDeps changes */
export function useAlignment( export function useAlignment(
rootRef: RefObject<HTMLElement | null>, rootRef: RefObject<HTMLElement>,
relativeToRef: RefObject<HTMLElement | null> | null, relativeToRef: RefObject<HTMLElement | null> | null,
relativeToPos: { x: number; y: number } | null, relativeToPos: { x: number; y: number } | null,
alignment: IAlignment, alignment: IAlignment,