Fixing children prop in Step

[etomarat]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

The Step component proptypes does not accept children property, but work with that. Same as this.

Here is the diff that solved my problem:

diff --git a/node_modules/@adminjs/design-system/types/molecules/stepper/step.d.ts b/node_modules/@adminjs/design-system/types/molecules/stepper/step.d.ts
index e4b4109..e21395f 100644
--- a/node_modules/@adminjs/design-system/types/molecules/stepper/step.d.ts
+++ b/node_modules/@adminjs/design-system/types/molecules/stepper/step.d.ts
@@ -27,6 +27,8 @@ export declare type StepProps = {
     onClick?: OnStepClickHandler;
     /** Optional className */
     className?: string;
+
+    children?: React.ReactNode
 };
 /**
  * @classdesc

This issue body was partially generated by patch-package.

[dziraf]

As far as I know, children has to be specified in props only in React v18: https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-typescript-definitions

AdminJS has not yet been updated to React v18, we're still using v16.

[etomarat]

Thanks for the answer @dziraf!

Strange, but my linter highlights the error. Here is a screenshot:

How is that possible?

[dziraf]

Do you have react or @types/react in your package.json?

[etomarat]

No. This is my dependencies section:

"dependencies": {
    "@adminjs/express": "^4.1.0",
    "@adminjs/mongoose": "^2.0.2",
    "@adminjs/upload": "^2.0.2",
    "adminjs": "^5.10.0",
    "connect-mongo": "^4.6.0",
    "crypto-js": "^4.1.1",
    "dotenv": "^16.0.0",
    "express": "^4.18.0",
    "express-formidable": "^1.2.0",
    "express-session": "^1.17.2",
    "mongoose": "^6.3.1",
    "patch-package": "^6.4.7",
    "postinstall-postinstall": "^2.1.0",
    "react-image-crop": "^10.0.0"
  },
  "devDependencies": {
    "@types/crypto-js": "^4.1.1",
    "@types/express": "^4.17.13",
    "@types/express-session": "^1.17.4",
    "@types/node": "^17.0.29",
    "@typescript-eslint/eslint-plugin": "^5.21.0",
    "@typescript-eslint/parser": "^5.21.0",
    "concurrently": "^7.1.0",
    "eslint": "^8.14.0",
    "nodemon": "^2.0.15",
    "tslint": "^6.1.3",
    "typescript": "^4.6.3"
  }

[dziraf]

You can try to yarn add -D @types/react@^16 and see if it helps. I think you also need @adminjs/design-system to use design system components in your project.

[etomarat]

Thanx! Yes it helped. Should I close the issues?