diff --git a/docs/package.json b/docs/package.json index 124220e3f..e18b7549b 100644 --- a/docs/package.json +++ b/docs/package.json @@ -23,13 +23,13 @@ "@docusaurus/plugin-svgr": "^3.7.0", "@docusaurus/theme-classic": "^3.7.0", "@docusaurus/theme-search-algolia": "^3.7.0", - "@mdx-js/react": "^3.0.0", + "@mdx-js/react": "^3.1.0", "@waveterm/docusaurus-og": "https://github.com/wavetermdev/docusaurus-og.git", "clsx": "^2.1.1", "docusaurus-plugin-sass": "^0.2.6", "prism-react-renderer": "^2.4.1", - "react": "^18.0.0", - "react-dom": "^18.0.0", + "react": "^19.0.0", + "react-dom": "^19.0.0", "rehype-highlight": "^7.0.2", "remark-gfm": "^4.0.0", "remark-typescript-code-import": "^1.0.1", diff --git a/frontend/app/block/blockframe.tsx b/frontend/app/block/blockframe.tsx index 6a9e4185d..7855eda2d 100644 --- a/frontend/app/block/blockframe.tsx +++ b/frontend/app/block/blockframe.tsx @@ -28,13 +28,14 @@ import clsx from "clsx"; import * as jotai from "jotai"; import { OverlayScrollbarsComponent } from "overlayscrollbars-react"; import * as React from "react"; +import { JSX } from "react"; import { CopyButton } from "../element/copybutton"; import { BlockFrameProps } from "./blocktypes"; const NumActiveConnColors = 8; function handleHeaderContextMenu( - e: React.MouseEvent, + e: React.PointerEvent, blockData: Block, viewModel: ViewModel, magnified: boolean, @@ -106,7 +107,7 @@ const OptMagnifyButton = React.memo( function computeEndIcons( viewModel: ViewModel, nodeModel: NodeModel, - onContextMenu: (e: React.MouseEvent) => void + onContextMenu: (e: React.PointerEvent) => void ): JSX.Element[] { const endIconsElem: JSX.Element[] = []; const endIconButtons = util.useAtomValueSafe(viewModel?.endIconButtons); @@ -197,7 +198,7 @@ const BlockFrame_Header = ({ } const onContextMenu = React.useCallback( - (e: React.MouseEvent) => { + (e: React.PointerEvent) => { handleHeaderContextMenu(e, blockData, viewModel, magnified, nodeModel.toggleMagnify, nodeModel.onClose); }, [magnified] @@ -536,7 +537,7 @@ const BlockFrame_Default_Component = (props: BlockFrameProps) => { const magnifiedBlockBlur = jotai.useAtomValue(magnifiedBlockBlurAtom); const [magnifiedBlockOpacityAtom] = React.useState(() => getSettingsKeyAtom("window:magnifiedblockopacity")); const magnifiedBlockOpacity = jotai.useAtomValue(magnifiedBlockOpacityAtom); - const connBtnRef = React.useRef(); + const connBtnRef = React.useRef(null); React.useEffect(() => { if (!manageConnection) { return; diff --git a/frontend/app/block/blockutil.tsx b/frontend/app/block/blockutil.tsx index e2c0259ee..e010b9ed2 100644 --- a/frontend/app/block/blockutil.tsx +++ b/frontend/app/block/blockutil.tsx @@ -145,6 +145,7 @@ export function getBlockHeaderIcon(blockIcon: string, blockData: Block): React.R interface ConnectionButtonProps { connection: string; changeConnModalAtom: jotai.PrimitiveAtom; + ref?: React.RefObject; } export function computeConnColorNum(connStatus: ConnStatus): number { @@ -156,88 +157,84 @@ export function computeConnColorNum(connStatus: ConnStatus): number { return connColorNum; } -export const ConnectionButton = React.memo( - React.forwardRef( - ({ connection, changeConnModalAtom }: ConnectionButtonProps, ref) => { - const [connModalOpen, setConnModalOpen] = jotai.useAtom(changeConnModalAtom); - const isLocal = util.isBlank(connection); - const connStatusAtom = getConnStatusAtom(connection); - const connStatus = jotai.useAtomValue(connStatusAtom); - let showDisconnectedSlash = false; - let connIconElem: React.ReactNode = null; - const connColorNum = computeConnColorNum(connStatus); - let color = `var(--conn-icon-color-${connColorNum})`; - const clickHandler = function () { - setConnModalOpen(true); - }; - let titleText = null; - let shouldSpin = false; - if (isLocal) { - color = "var(--grey-text-color)"; - titleText = "Connected to Local Machine"; - connIconElem = ( - - ); - } else { - titleText = "Connected to " + connection; - let iconName = "arrow-right-arrow-left"; - let iconSvg = null; - if (connStatus?.status == "connecting") { - color = "var(--warning-color)"; - titleText = "Connecting to " + connection; - shouldSpin = false; - iconSvg = ( -
- -
- ); - } else if (connStatus?.status == "error") { - color = "var(--error-color)"; - titleText = "Error connecting to " + connection; - if (connStatus?.error != null) { - titleText += " (" + connStatus.error + ")"; - } - showDisconnectedSlash = true; - } else if (!connStatus?.connected) { - color = "var(--grey-text-color)"; - titleText = "Disconnected from " + connection; - showDisconnectedSlash = true; - } - if (iconSvg != null) { - connIconElem = iconSvg; - } else { - connIconElem = ( - - ); - } - } - - return ( -
- - {connIconElem} - - - {isLocal ? null :
{connection}
} +export const ConnectionButton = React.memo(({ connection, changeConnModalAtom, ref }: ConnectionButtonProps) => { + const setConnModalOpen = jotai.useSetAtom(changeConnModalAtom); + const isLocal = util.isBlank(connection); + const connStatusAtom = getConnStatusAtom(connection); + const connStatus = jotai.useAtomValue(connStatusAtom); + let showDisconnectedSlash = false; + let connIconElem: React.ReactNode = null; + const connColorNum = computeConnColorNum(connStatus); + let color = `var(--conn-icon-color-${connColorNum})`; + const clickHandler = function () { + setConnModalOpen(true); + }; + let titleText = null; + let shouldSpin = false; + if (isLocal) { + color = "var(--grey-text-color)"; + titleText = "Connected to Local Machine"; + connIconElem = ( + + ); + } else { + titleText = "Connected to " + connection; + let iconName = "arrow-right-arrow-left"; + let iconSvg = null; + if (connStatus?.status == "connecting") { + color = "var(--warning-color)"; + titleText = "Connecting to " + connection; + shouldSpin = false; + iconSvg = ( +
+
); + } else if (connStatus?.status == "error") { + color = "var(--error-color)"; + titleText = "Error connecting to " + connection; + if (connStatus?.error != null) { + titleText += " (" + connStatus.error + ")"; + } + showDisconnectedSlash = true; + } else if (!connStatus?.connected) { + color = "var(--grey-text-color)"; + titleText = "Disconnected from " + connection; + showDisconnectedSlash = true; + } + if (iconSvg != null) { + connIconElem = iconSvg; + } else { + connIconElem = ( + + ); } - ) -); + } + + return ( +
+ + {connIconElem} + + + {isLocal ? null :
{connection}
} +
+ ); +}); export const Input = React.memo( ({ decl, className, preview }: { decl: HeaderInput; className: string; preview: boolean }) => { diff --git a/frontend/app/element/button.tsx b/frontend/app/element/button.tsx index 00c98b8bc..3a28134e7 100644 --- a/frontend/app/element/button.tsx +++ b/frontend/app/element/button.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: Apache-2.0 import clsx from "clsx"; -import { forwardRef, memo, ReactNode, useImperativeHandle, useRef } from "react"; +import { JSX, memo, ReactNode, useImperativeHandle, useRef } from "react"; import "./button.scss"; @@ -10,38 +10,35 @@ interface ButtonProps extends React.ButtonHTMLAttributes { className?: string; children?: ReactNode; as?: keyof JSX.IntrinsicElements | React.ComponentType; + ref?: React.RefObject; } -const Button = memo( - forwardRef( - ({ children, disabled, className = "", as: Component = "button", ...props }: ButtonProps, ref) => { - const btnRef = useRef(null); - useImperativeHandle(ref, () => btnRef.current as HTMLButtonElement); - - // Check if the className contains any of the categories: solid, outlined, or ghost - const containsButtonCategory = /(solid|outline|ghost)/.test(className); - // If no category is present, default to 'solid' - const categoryClassName = containsButtonCategory ? className : `solid ${className}`; - - // Check if the className contains any of the color options: green, grey, red, or yellow - const containsColor = /(green|grey|red|yellow)/.test(categoryClassName); - // If no color is present, default to 'green' - const finalClassName = containsColor ? categoryClassName : `green ${categoryClassName}`; - - return ( - - {children} - - ); - } - ) -); +const Button = memo(({ children, disabled, className = "", as: Component = "button", ref, ...props }: ButtonProps) => { + const btnRef = useRef(null); + useImperativeHandle(ref, () => btnRef.current as HTMLButtonElement); + + // Check if the className contains any of the categories: solid, outlined, or ghost + const containsButtonCategory = /(solid|outline|ghost)/.test(className); + // If no category is present, default to 'solid' + const categoryClassName = containsButtonCategory ? className : `solid ${className}`; + + // Check if the className contains any of the color options: green, grey, red, or yellow + const containsColor = /(green|grey|red|yellow)/.test(categoryClassName); + // If no color is present, default to 'green' + const finalClassName = containsColor ? categoryClassName : `green ${categoryClassName}`; + + return ( + + {children} + + ); +}); Button.displayName = "Button"; diff --git a/frontend/app/element/copybutton.tsx b/frontend/app/element/copybutton.tsx index e33d9109d..70bacae33 100644 --- a/frontend/app/element/copybutton.tsx +++ b/frontend/app/element/copybutton.tsx @@ -9,14 +9,14 @@ import { IconButton } from "./iconbutton"; type CopyButtonProps = { title: string; className?: string; - onClick: (e: React.MouseEvent) => void; + onClick: (e: React.PointerEvent) => void; }; const CopyButton = ({ title, className, onClick }: CopyButtonProps) => { const [isCopied, setIsCopied] = useState(false); const timeoutRef = useRef(null); - const handleOnClick = (e: React.MouseEvent) => { + const handleOnClick = (e: React.PointerEvent) => { if (isCopied) { return; } diff --git a/frontend/app/element/expandablemenu.tsx b/frontend/app/element/expandablemenu.tsx index f0d71b705..987499599 100644 --- a/frontend/app/element/expandablemenu.tsx +++ b/frontend/app/element/expandablemenu.tsx @@ -3,7 +3,7 @@ import { clsx } from "clsx"; import { atom, useAtom } from "jotai"; -import { Children, ReactElement, ReactNode, cloneElement, isValidElement, useRef } from "react"; +import { Children, ReactNode, cloneElement, isValidElement, useRef } from "react"; import "./expandablemenu.scss"; @@ -109,7 +109,7 @@ const ExpandableMenuItemGroup = ({ const [openGroups, setOpenGroups] = useAtom(openGroupsAtom); // Generate a unique ID for this group using useRef - const idRef = useRef(); + const idRef = useRef(null); if (!idRef.current) { // Generate a unique ID when the component is first rendered @@ -144,7 +144,8 @@ const ExpandableMenuItemGroup = ({ } }; - const renderChildren = Children.map(children, (child: ReactElement) => { + // TODO: As of React 19, this is bad practice and considered unsound. See https://react.dev/blog/2024/04/25/react-19-upgrade-guide#changes-to-the-reactelement-typescript-type + const renderChildren = Children.map(children, (child: any) => { if (child && child.type === ExpandableMenuItemGroupTitle) { return cloneElement(child, { ...child.props, diff --git a/frontend/app/element/flyoutmenu.tsx b/frontend/app/element/flyoutmenu.tsx index e99e83284..f5e3dc97a 100644 --- a/frontend/app/element/flyoutmenu.tsx +++ b/frontend/app/element/flyoutmenu.tsx @@ -3,7 +3,7 @@ import { FloatingPortal, type Placement, useDismiss, useFloating, useInteractions } from "@floating-ui/react"; import clsx from "clsx"; -import { createRef, Fragment, memo, ReactNode, useRef, useState } from "react"; +import { createRef, Fragment, JSX, memo, ReactNode, useRef, useState } from "react"; import ReactDOM from "react-dom"; import "./flyoutmenu.scss"; diff --git a/frontend/app/element/iconbutton.tsx b/frontend/app/element/iconbutton.tsx index 45e577109..933957a8a 100644 --- a/frontend/app/element/iconbutton.tsx +++ b/frontend/app/element/iconbutton.tsx @@ -5,60 +5,60 @@ import { useLongClick } from "@/app/hook/useLongClick"; import { makeIconClass } from "@/util/util"; import clsx from "clsx"; import { atom, useAtom } from "jotai"; -import { forwardRef, memo, useMemo, useRef } from "react"; +import { memo, useMemo, useRef } from "react"; import "./iconbutton.scss"; -type IconButtonProps = { decl: IconButtonDecl; className?: string }; -export const IconButton = memo( - forwardRef(({ decl, className }, ref) => { - ref = ref ?? useRef(null); - const spin = decl.iconSpin ?? false; - useLongClick(ref, decl.click, decl.longClick, decl.disabled); - const disabled = decl.disabled ?? false; - return ( - - ); - }) -); +type IconButtonProps = { decl: IconButtonDecl; className?: string; ref?: React.RefObject }; +export const IconButton = memo(({ decl, className, ref }: IconButtonProps) => { + ref = ref ?? useRef(null); + const spin = decl.iconSpin ?? false; + useLongClick(ref, decl.click, decl.longClick, decl.disabled); + const disabled = decl.disabled ?? false; + return ( + + ); +}); -type ToggleIconButtonProps = { decl: ToggleIconButtonDecl; className?: string }; +type ToggleIconButtonProps = { + decl: ToggleIconButtonDecl; + className?: string; + ref?: React.RefObject; +}; -export const ToggleIconButton = memo( - forwardRef(({ decl, className }, ref) => { - const activeAtom = useMemo(() => decl.active ?? atom(false), [decl.active]); - const [active, setActive] = useAtom(activeAtom); - ref = ref ?? useRef(null); - const spin = decl.iconSpin ?? false; - const title = `${decl.title}${active ? " (Active)" : ""}`; - const disabled = decl.disabled ?? false; - return ( - - ); - }) -); +export const ToggleIconButton = memo(({ decl, className, ref }: ToggleIconButtonProps) => { + const activeAtom = useMemo(() => decl.active ?? atom(false), [decl.active]); + const [active, setActive] = useAtom(activeAtom); + ref = ref ?? useRef(null); + const spin = decl.iconSpin ?? false; + const title = `${decl.title}${active ? " (Active)" : ""}`; + const disabled = decl.disabled ?? false; + return ( + + ); +}); diff --git a/frontend/app/element/input.tsx b/frontend/app/element/input.tsx index 83dcb11d1..7c6476e7b 100644 --- a/frontend/app/element/input.tsx +++ b/frontend/app/element/input.tsx @@ -2,40 +2,39 @@ // SPDX-License-Identifier: Apache-2.0 import clsx from "clsx"; -import React, { forwardRef, memo, useImperativeHandle, useRef, useState } from "react"; +import React, { memo, useImperativeHandle, useRef, useState } from "react"; import "./input.scss"; interface InputGroupProps { children: React.ReactNode; className?: string; + ref?: React.RefObject; } -const InputGroup = memo( - forwardRef(({ children, className }: InputGroupProps, ref) => { - const [isFocused, setIsFocused] = useState(false); - - const manageFocus = (focused: boolean) => { - setIsFocused(focused); - }; - - return ( -
- {React.Children.map(children, (child) => { - if (React.isValidElement(child)) { - return React.cloneElement(child as any, { manageFocus }); - } - return child; - })} -
- ); - }) -); +const InputGroup = memo(({ children, className, ref }: InputGroupProps) => { + const [isFocused, setIsFocused] = useState(false); + + const manageFocus = (focused: boolean) => { + setIsFocused(focused); + }; + + return ( +
+ {React.Children.map(children, (child) => { + if (React.isValidElement(child)) { + return React.cloneElement(child as any, { manageFocus }); + } + return child; + })} +
+ ); +}); interface InputLeftElementProps { children: React.ReactNode; @@ -70,85 +69,81 @@ interface InputProps { autoSelect?: boolean; disabled?: boolean; isNumber?: boolean; - inputRef?: React.MutableRefObject; manageFocus?: (isFocused: boolean) => void; + ref?: React.RefObject; } const Input = memo( - forwardRef( - ( - { - value, - className, - onChange, - onKeyDown, - onFocus, - onBlur, - placeholder, - defaultValue = "", - required, - maxLength, - autoFocus, - autoSelect, - disabled, - isNumber, - manageFocus, - }: InputProps, - ref - ) => { - const [internalValue, setInternalValue] = useState(defaultValue); - const inputRef = useRef(null); - - useImperativeHandle(ref, () => inputRef.current as HTMLInputElement); - - const handleInputChange = (e: React.ChangeEvent) => { - const inputValue = e.target.value; - - if (isNumber && inputValue !== "" && !/^\d*$/.test(inputValue)) { - return; - } + ({ + value, + className, + onChange, + onKeyDown, + onFocus, + onBlur, + placeholder, + defaultValue = "", + required, + maxLength, + autoFocus, + autoSelect, + disabled, + isNumber, + manageFocus, + ref, + }: InputProps) => { + const [internalValue, setInternalValue] = useState(defaultValue); + const inputRef = useRef(null); + + useImperativeHandle(ref, () => inputRef.current as HTMLInputElement); + + const handleInputChange = (e: React.ChangeEvent) => { + const inputValue = e.target.value; + + if (isNumber && inputValue !== "" && !/^\d*$/.test(inputValue)) { + return; + } + + if (value === undefined) { + setInternalValue(inputValue); + } + + onChange && onChange(inputValue); + }; - if (value === undefined) { - setInternalValue(inputValue); - } + const handleFocus = () => { + if (autoSelect) { + inputRef.current?.select(); + } + manageFocus?.(true); + onFocus?.(); + }; + + const handleBlur = () => { + manageFocus?.(false); + onBlur?.(); + }; - onChange && onChange(inputValue); - }; + const inputValue = value ?? internalValue; - const handleFocus = () => { - if (autoSelect) { - inputRef.current?.select(); - } - manageFocus?.(true); - onFocus?.(); - }; - - const handleBlur = () => { - manageFocus?.(false); - onBlur?.(); - }; - - const inputValue = value ?? internalValue; - - return ( - - ); - } - ) + return ( + + ); + } ); export { Input, InputGroup, InputLeftElement, InputRightElement }; diff --git a/frontend/app/element/markdown.tsx b/frontend/app/element/markdown.tsx index 96f2235e8..74d11a096 100644 --- a/frontend/app/element/markdown.tsx +++ b/frontend/app/element/markdown.tsx @@ -76,13 +76,13 @@ const CodeBlock = ({ children, onClickExecute }: CodeBlockProps) => { return ""; }; - const handleCopy = async (e: React.MouseEvent) => { + const handleCopy = async (e: React.PointerEvent) => { let textToCopy = getTextContent(children); textToCopy = textToCopy.replace(/\n$/, ""); // remove trailing newline await navigator.clipboard.writeText(textToCopy); }; - const handleExecute = (e: React.MouseEvent) => { + const handleExecute = (e: React.PointerEvent) => { let textToCopy = getTextContent(children); textToCopy = textToCopy.replace(/\n$/, ""); // remove trailing newline if (onClickExecute) { diff --git a/frontend/app/element/multilineinput.tsx b/frontend/app/element/multilineinput.tsx index 3530bce1a..6ba15e11a 100644 --- a/frontend/app/element/multilineinput.tsx +++ b/frontend/app/element/multilineinput.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: Apache-2.0 import clsx from "clsx"; -import React, { forwardRef, memo, useEffect, useImperativeHandle, useRef, useState } from "react"; +import React, { memo, useEffect, useImperativeHandle, useRef, useState } from "react"; import "./multilineinput.scss"; @@ -21,122 +21,119 @@ interface MultiLineInputProps { rows?: number; maxRows?: number; manageFocus?: (isFocused: boolean) => void; + ref?: React.RefObject; } const MultiLineInput = memo( - forwardRef( - ( - { - value, - className, - onChange, - onKeyDown, - onFocus, - onBlur, - placeholder, - defaultValue = "", - maxLength, - autoFocus, - disabled, - rows = 1, - maxRows = 5, - manageFocus, - }: MultiLineInputProps, - ref - ) => { - const textareaRef = useRef(null); - const [internalValue, setInternalValue] = useState(defaultValue); - const [lineHeight, setLineHeight] = useState(24); // Default line height fallback of 24px - const [paddingTop, setPaddingTop] = useState(0); - const [paddingBottom, setPaddingBottom] = useState(0); - - useImperativeHandle(ref, () => textareaRef.current as HTMLTextAreaElement); - - // Function to count the number of lines in the textarea value - const countLines = (text: string) => { - return text.split("\n").length; - }; - - const adjustTextareaHeight = () => { - if (textareaRef.current) { - textareaRef.current.style.height = "auto"; // Reset height to auto first - - const maxHeight = maxRows * lineHeight + paddingTop + paddingBottom; // Max height based on maxRows - const currentLines = countLines(textareaRef.current.value); // Count the number of lines - const newHeight = Math.min(textareaRef.current.scrollHeight, maxHeight); // Calculate new height - - // If the number of lines is less than or equal to maxRows, set height accordingly - const calculatedHeight = - currentLines <= maxRows - ? `${lineHeight * currentLines + paddingTop + paddingBottom}px` - : `${newHeight}px`; - - textareaRef.current.style.height = calculatedHeight; - } - }; - - const handleInputChange = (e: React.ChangeEvent) => { - setInternalValue(e.target.value); - onChange?.(e); - - // Adjust the height of the textarea after text change - adjustTextareaHeight(); - }; - - const handleFocus = () => { - manageFocus?.(true); - onFocus?.(); - }; - - const handleBlur = () => { - manageFocus?.(false); - onBlur?.(); - }; - - useEffect(() => { - if (textareaRef.current) { - const computedStyle = window.getComputedStyle(textareaRef.current); - const detectedLineHeight = parseFloat(computedStyle.lineHeight); - const detectedPaddingTop = parseFloat(computedStyle.paddingTop); - const detectedPaddingBottom = parseFloat(computedStyle.paddingBottom); - - setLineHeight(detectedLineHeight); - setPaddingTop(detectedPaddingTop); - setPaddingBottom(detectedPaddingBottom); - } - }, [textareaRef]); - - useEffect(() => { - adjustTextareaHeight(); - }, [value, maxRows, lineHeight, paddingTop, paddingBottom]); - - const inputValue = value ?? internalValue; - - return ( - - ); - } -); + useEffect(() => { + adjustTextAreaHeight(value); + }, [value]); + + return ( + + ); +}; const WaveAi = ({ model }: { model: WaveAiModel; blockId: string }) => { const { sendMessage } = model.useWaveAi(); diff --git a/frontend/types/custom.d.ts b/frontend/types/custom.d.ts index d0e8fbc92..2ca9f8c79 100644 --- a/frontend/types/custom.d.ts +++ b/frontend/types/custom.d.ts @@ -158,6 +158,8 @@ declare global { iconSpin?: boolean; className?: string; title?: string; + click?: (e: React.MouseEvent) => void; + longClick?: (e: React.PointerEvent) => void; disabled?: boolean; noAction?: boolean; }; diff --git a/package.json b/package.json index fd5c23b15..d53a5e00d 100644 --- a/package.json +++ b/package.json @@ -51,8 +51,8 @@ "@types/papaparse": "^5", "@types/pngjs": "^6.0.5", "@types/prop-types": "^15", - "@types/react": "^18.3.13", - "@types/react-dom": "^18.3.1", + "@types/react": "^19.0.8", + "@types/react-dom": "^19.0.3", "@types/semver": "^7", "@types/shell-quote": "^1", "@types/sprintf-js": "^1", @@ -127,10 +127,10 @@ "parse-srcset": "^1.0.2", "pngjs": "^7.0.0", "prop-types": "^15.8.1", - "react": "^18.3.1", + "react": "^19.0.0", "react-dnd": "^16.0.1", "react-dnd-html5-backend": "^16.0.1", - "react-dom": "^18.3.1", + "react-dom": "^19.0.0", "react-frame-component": "^5.2.7", "react-gauge-chart": "^0.5.1", "react-markdown": "^9.0.3", diff --git a/yarn.lock b/yarn.lock index 46765d911..ac62b3c54 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3514,7 +3514,7 @@ __metadata: languageName: node linkType: hard -"@mdx-js/react@npm:^3.0.0": +"@mdx-js/react@npm:^3.0.0, @mdx-js/react@npm:^3.1.0": version: 3.1.0 resolution: "@mdx-js/react@npm:3.1.0" dependencies: @@ -6033,12 +6033,12 @@ __metadata: languageName: node linkType: hard -"@types/react-dom@npm:^18.3.1": - version: 18.3.1 - resolution: "@types/react-dom@npm:18.3.1" - dependencies: - "@types/react": "npm:*" - checksum: 10c0/8b416551c60bb6bd8ec10e198c957910cfb271bc3922463040b0d57cf4739cdcd24b13224f8d68f10318926e1ec3cd69af0af79f0291b599a992f8c80d47f1eb +"@types/react-dom@npm:^19.0.3": + version: 19.0.3 + resolution: "@types/react-dom@npm:19.0.3" + peerDependencies: + "@types/react": ^19.0.0 + checksum: 10c0/3867427b333cbe8cbba496d7cc20ec9676d32c25ae44f4d1263a4129d42e57cf4adf0039ad263432f1215b88075c27d326e7eb4ed646128235d01a76e661d48f languageName: node linkType: hard @@ -6084,13 +6084,12 @@ __metadata: languageName: node linkType: hard -"@types/react@npm:^18.3.13": - version: 18.3.13 - resolution: "@types/react@npm:18.3.13" +"@types/react@npm:^19.0.8": + version: 19.0.8 + resolution: "@types/react@npm:19.0.8" dependencies: - "@types/prop-types": "npm:*" csstype: "npm:^3.0.2" - checksum: 10c0/91815e00157deb179fa670aa2dfc491952698b7743ffddca0e3e0f16e7a18454f3f5ef72321a07386c49e721563b9d280dbbdfae039face764e2fdd8ad949d4b + checksum: 10c0/5fa7236356b1476de03519c66ef65d4fd904826956105619e2ad60cb0b55ae7b251dd5fff02234076225b5e15333d0d936bf9dbe1d461406f8a2ba01c197ddcd languageName: node linkType: hard @@ -13600,7 +13599,7 @@ __metadata: languageName: node linkType: hard -"loose-envify@npm:^1.0.0, loose-envify@npm:^1.1.0, loose-envify@npm:^1.2.0, loose-envify@npm:^1.3.1, loose-envify@npm:^1.4.0": +"loose-envify@npm:^1.0.0, loose-envify@npm:^1.2.0, loose-envify@npm:^1.3.1, loose-envify@npm:^1.4.0": version: 1.4.0 resolution: "loose-envify@npm:1.4.0" dependencies: @@ -17324,7 +17323,7 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0": +"react-dom@npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0, react-dom@npm:^19.0.0": version: 19.0.0 resolution: "react-dom@npm:19.0.0" dependencies: @@ -17335,18 +17334,6 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:^18.0.0, react-dom@npm:^18.3.1": - version: 18.3.1 - resolution: "react-dom@npm:18.3.1" - dependencies: - loose-envify: "npm:^1.1.0" - scheduler: "npm:^0.23.2" - peerDependencies: - react: ^18.3.1 - checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85 - languageName: node - linkType: hard - "react-error-overlay@npm:^6.0.11": version: 6.0.11 resolution: "react-error-overlay@npm:6.0.11" @@ -17575,22 +17562,13 @@ __metadata: languageName: node linkType: hard -"react@npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0": +"react@npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0, react@npm:^19.0.0": version: 19.0.0 resolution: "react@npm:19.0.0" checksum: 10c0/9cad8f103e8e3a16d15cb18a0d8115d8bd9f9e1ce3420310aea381eb42aa0a4f812cf047bb5441349257a05fba8a291515691e3cb51267279b2d2c3253f38471 languageName: node linkType: hard -"react@npm:^18.0.0, react@npm:^18.3.1": - version: 18.3.1 - resolution: "react@npm:18.3.1" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3 - languageName: node - linkType: hard - "read-binary-file-arch@npm:^1.0.6": version: 1.0.6 resolution: "read-binary-file-arch@npm:1.0.6" @@ -19008,15 +18986,6 @@ __metadata: languageName: node linkType: hard -"scheduler@npm:^0.23.2": - version: 0.23.2 - resolution: "scheduler@npm:0.23.2" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78 - languageName: node - linkType: hard - "scheduler@npm:^0.25.0": version: 0.25.0 resolution: "scheduler@npm:0.25.0" @@ -21576,7 +21545,7 @@ __metadata: "@docusaurus/tsconfig": "npm:3.7.0" "@docusaurus/types": "npm:3.7.0" "@eslint/js": "npm:^9.20.0" - "@mdx-js/react": "npm:^3.0.0" + "@mdx-js/react": "npm:^3.1.0" "@mdx-js/typescript-plugin": "npm:^0.0.8" "@types/eslint": "npm:^9.6.1" "@types/eslint-config-prettier": "npm:^6.11.3" @@ -21590,8 +21559,8 @@ __metadata: prettier-plugin-jsdoc: "npm:^1.3.2" prettier-plugin-organize-imports: "npm:^4.1.0" prism-react-renderer: "npm:^2.4.1" - react: "npm:^18.0.0" - react-dom: "npm:^18.0.0" + react: "npm:^19.0.0" + react-dom: "npm:^19.0.0" rehype-highlight: "npm:^7.0.2" remark-cli: "npm:^12.0.1" remark-frontmatter: "npm:^5.0.0" @@ -21639,8 +21608,8 @@ __metadata: "@types/papaparse": "npm:^5" "@types/pngjs": "npm:^6.0.5" "@types/prop-types": "npm:^15" - "@types/react": "npm:^18.3.13" - "@types/react-dom": "npm:^18.3.1" + "@types/react": "npm:^19.0.8" + "@types/react-dom": "npm:^19.0.3" "@types/semver": "npm:^7" "@types/shell-quote": "npm:^1" "@types/sprintf-js": "npm:^1" @@ -21687,10 +21656,10 @@ __metadata: prettier-plugin-jsdoc: "npm:^1.3.2" prettier-plugin-organize-imports: "npm:^4.1.0" prop-types: "npm:^15.8.1" - react: "npm:^18.3.1" + react: "npm:^19.0.0" react-dnd: "npm:^16.0.1" react-dnd-html5-backend: "npm:^16.0.1" - react-dom: "npm:^18.3.1" + react-dom: "npm:^19.0.0" react-frame-component: "npm:^5.2.7" react-gauge-chart: "npm:^0.5.1" react-markdown: "npm:^9.0.3"