diff --git a/package-lock.json b/package-lock.json index 5a3c20d12..9487c93a5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,8 +16,8 @@ "dotenv": "^16.4.7", "i18next": "^24.2.0", "i18next-browser-languagedetector": "^8.0.2", - "react": "^18.2.0", - "react-dom": "^18.3.1", + "react": "^19.0.0", + "react-dom": "^19.0.0", "react-i18next": "^15.2.0", "tailwind-merge": "^2.6.0" }, @@ -27,7 +27,7 @@ "@tailwindcss/forms": "^0.5.9", "@types/lodash": "^4.17.13", "@types/node": "^22.9.0", - "@types/react": "^18.3.12", + "@types/react": "^19.0.2", "@types/react-dom": "^18.3.1", "@typescript-eslint/eslint-plugin": "^8.18.1", "@typescript-eslint/parser": "^8.15.0", @@ -1567,19 +1567,12 @@ "undici-types": "~6.19.8" } }, - "node_modules/@types/prop-types": { - "version": "15.7.11", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.11.tgz", - "integrity": "sha512-ga8y9v9uyeiLdpKddhxYQkxNDrfvuPrlFb0N1qnZZByvcElJaXthF1UhvCh9TLWJBEHeNtdnbysW7Y6Uq8CVng==", - "dev": true - }, "node_modules/@types/react": { - "version": "18.3.12", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz", - "integrity": "sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==", + "version": "19.0.2", + "resolved": "https://registry.npmjs.org/@types/react/-/react-19.0.2.tgz", + "integrity": "sha512-USU8ZI/xyKJwFTpjSVIrSeHBVAGagkHQKPNbxeWwql/vDmnTIBgx+TJnhFnj1NXgz8XfprU0egV2dROLGpsBEg==", "dev": true, "dependencies": { - "@types/prop-types": "*", "csstype": "^3.0.2" } }, @@ -5107,26 +5100,22 @@ ] }, "node_modules/react": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", - "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", - "dependencies": { - "loose-envify": "^1.1.0" - }, + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz", + "integrity": "sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==", "engines": { "node": ">=0.10.0" } }, "node_modules/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz", + "integrity": "sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==", "dependencies": { - "loose-envify": "^1.1.0", - "scheduler": "^0.23.2" + "scheduler": "^0.25.0" }, "peerDependencies": { - "react": "^18.3.1" + "react": "^19.0.0" } }, "node_modules/react-i18next": { @@ -5396,12 +5385,9 @@ } }, "node_modules/scheduler": { - "version": "0.23.2", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", - "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", - "dependencies": { - "loose-envify": "^1.1.0" - } + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0.tgz", + "integrity": "sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==" }, "node_modules/semver": { "version": "7.6.0", diff --git a/package.json b/package.json index 387a14d1d..0ed96cf63 100644 --- a/package.json +++ b/package.json @@ -23,8 +23,8 @@ "dotenv": "^16.4.7", "i18next": "^24.2.0", "i18next-browser-languagedetector": "^8.0.2", - "react": "^18.2.0", - "react-dom": "^18.3.1", + "react": "^19.0.0", + "react-dom": "^19.0.0", "react-i18next": "^15.2.0", "tailwind-merge": "^2.6.0" }, @@ -34,7 +34,7 @@ "@tailwindcss/forms": "^0.5.9", "@types/lodash": "^4.17.13", "@types/node": "^22.9.0", - "@types/react": "^18.3.12", + "@types/react": "^19.0.2", "@types/react-dom": "^18.3.1", "@typescript-eslint/eslint-plugin": "^8.18.1", "@typescript-eslint/parser": "^8.15.0", diff --git a/resources/ts/Components/Card.tsx b/resources/ts/Components/Card.tsx index f2e81190d..c7ed2d412 100644 --- a/resources/ts/Components/Card.tsx +++ b/resources/ts/Components/Card.tsx @@ -8,18 +8,18 @@ import { useTranslateRoute } from "../hooks/useTranslateRoute"; import { Link } from "@inertiajs/react"; type Props = { - title?: ReactElement | string; + title?: ReactElement> | string; subtitle?: string; description?: string; - img?: ReactElement | string; + img?: ReactElement> | string; badge?: string; - icon?: ReactElement; + icon?: ReactElement>; active?: boolean; headless?: boolean; contentStyles?: string; textCenter?: boolean; border?: boolean; - iconButton?: ReactElement; + iconButton?: ReactElement>; clickableHeading?: boolean; id?: string; headingStyles?: string; diff --git a/resources/ts/Components/FormElement.tsx b/resources/ts/Components/FormElement.tsx index 01125d4d7..be2d45b00 100644 --- a/resources/ts/Components/FormElement.tsx +++ b/resources/ts/Components/FormElement.tsx @@ -9,7 +9,7 @@ type LabelWeight = keyof Theme["fontWeight"]; type WrapperProps = { labelPosition?: LabelPosition; - children: JSX.Element; + children: ReactElement>; }; const Wrapper = ({ labelPosition, children }: WrapperProps) => { @@ -34,7 +34,7 @@ const getAlignItems = (labelPosition: LabelPosition | undefined) => { type LabelProps = ComponentProps<"label"> & { id: string; - label: string | ReactElement; + label: string | ReactElement>; labelSize: LabelSize; required: boolean; labelWeight?: LabelWeight; @@ -74,13 +74,13 @@ const InputStyle = { }; export type Props = { - label?: string | ReactElement; + label?: string | ReactElement>; labelPosition?: LabelPosition; labelSize?: LabelSize; labelWeight?: LabelWeight; error?: string; info?: string; - component: ReactElement; + component: ReactElement>; elementId?: string; required?: boolean; } & ComponentProps<"div">; diff --git a/resources/ts/Components/RadioButtonGroup.tsx b/resources/ts/Components/RadioButtonGroup.tsx index b97853b89..22cdba676 100644 --- a/resources/ts/Components/RadioButtonGroup.tsx +++ b/resources/ts/Components/RadioButtonGroup.tsx @@ -6,8 +6,8 @@ export const RadioButtonGroupLabel = ({ name, description, }: { - name: string | ReactElement; - description: string | ReactElement; + name: string | ReactElement>; + description: string | ReactElement>; }) => (
{name} @@ -18,7 +18,7 @@ export const RadioButtonGroupLabel = ({ ); type Option = { - label: string | ReactElement; + label: string | ReactElement>; value: string; }; diff --git a/resources/ts/Components/Tabs.tsx b/resources/ts/Components/Tabs.tsx index 0ef75b56d..0949221ae 100644 --- a/resources/ts/Components/Tabs.tsx +++ b/resources/ts/Components/Tabs.tsx @@ -1,4 +1,4 @@ -import type { ComponentProps, ReactElement } from "react"; +import type { ComponentProps, PropsWithChildren, ReactElement } from "react"; import React, { cloneElement, useMemo } from "react"; import { classNames } from "../utils/classNames"; @@ -32,7 +32,9 @@ export const Tabs = ({ children, active, onChange, ...props }: Props) => { React.Children.toArray(children).filter( (child) => typeof child === "object" && "type" in child && child.type === Item - ) as ReactElement[], + ) as ReactElement< + PropsWithChildren<{ className?: string; type: string }> + >[], [children] ); @@ -42,7 +44,11 @@ export const Tabs = ({ children, active, onChange, ...props }: Props) => { const isActive = item.props.type === active; if (!isActive) { - return cloneElement(item, { ...item.props, onChange }); + return cloneElement(item, { + ...item.props, + // @ts-expect-error + onChange, + }); } return cloneElement(item, { @@ -51,6 +57,7 @@ export const Tabs = ({ children, active, onChange, ...props }: Props) => { item.props.className, "text-publiq-blue-light border-publiq-blue border-b-[3px]" ), + // @ts-expect-error onChange, }); }),