neviaumi / react-components Goto Github PK

react-dom.development.js:86 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

Check the render method of `Controller`.
    at Field (http://localhost:6006/src/Form/Field.tsx:23:3)
    at Controller (http://localhost:6006/node_modules/.cache/.vite-storybook/deps/react-hook-form.js?v=b466ab71:292:35)
    at form
    at article
    at Main (http://localhost:6006/src/Layout/Layout.tsx:31:3)
    at main
    at Content (http://localhost:6006/src/Layout/Layout.tsx:42:3)
    at div
    at Page (http://localhost:6006/src/Layout/Layout.tsx:19:3)
    at unboundStoryFn (http://localhost:6006/sb-preview/runtime.js:34:3330)
    at ErrorBoundary (http://localhost:6006/node_modules/.cache/.vite-storybook/deps/chunk-LI4M2HUF.js?v=b466ab71:26:5)
    at WithCallback (http://localhost:6006/node_modules/.cache/.vite-storybook/deps/chunk-V55I5SVR.js?v=b466ab71:15:23)
printWarning @ react-dom.development.js:86
error @ react-dom.development.js:60
validateFunctionComponentInDev @ react-dom.development.js:20193
mountIndeterminateComponent @ react-dom.development.js:20160
beginWork @ react-dom.development.js:21587
beginWork$1 @ react-dom.development.js:27426
performUnitOfWork @ react-dom.development.js:26557
workLoopSync @ react-dom.development.js:26466
renderRootSync @ react-dom.development.js:26434
performConcurrentWorkOnRoot @ react-dom.development.js:25738
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
Form.stories.tsx?t=1688785178874:49 You are using Testing Library's `screen` object. Use `within(canvasElement)` instead.
More info: https://storybook.js.org/docs/react/essentials/interactions
warn @ index.mjs:15
(anonymous) @ index.mjs:22
get @ index.mjs:358
play @ Form.stories.tsx?t=1688785178874:49
await in play (async)
playFunction @ runtime.js:34
(anonymous) @ runtime.js:74
runPhase @ runtime.js:74
render @ runtime.js:74
await in render (async)
renderToElement @ runtime.js:74
renderSelection @ runtime.js:94
await in renderSelection (async)
selectSpecifiedStory @ runtime.js:94
(anonymous) @ runtime.js:85
(anonymous) @ runtime.js:4
_runResolutions @ runtime.js:4
then @ runtime.js:4
initializeWithStoryIndex @ runtime.js:85
(anonymous) @ runtime.js:80
Promise.then (async)
initializeWithProjectAnnotations @ runtime.js:80
(anonymous) @ runtime.js:74
(anonymous) @ runtime.js:4
_runResolutions @ runtime.js:4
_setResolved @ runtime.js:4
_continueWith @ runtime.js:4
(anonymous) @ runtime.js:4
_runResolutions @ runtime.js:4
_setResolved @ runtime.js:4
_continueWith @ runtime.js:4
_handleUserFunctionResult @ runtime.js:4
(anonymous) @ runtime.js:4
_runResolutions @ runtime.js:4
_setResolved @ runtime.js:4
_continueWith @ runtime.js:4
(anonymous) @ runtime.js:4
Promise.then (async)
_chainPromiseData @ runtime.js:4
_handleUserFunctionResult @ runtime.js:4
(anonymous) @ runtime.js:4
_runResolutions @ runtime.js:4
then @ runtime.js:4
getProjectAnnotationsOrRenderError @ runtime.js:74
initialize @ runtime.js:74
(anonymous) @ vite-app.js:25
useControlled.js:18 MUI: A component is changing the uncontrolled value state of FormControl to be controlled.
Elements should not switch from uncontrolled to controlled (or vice versa).
Decide between using a controlled or uncontrolled FormControl element for the lifetime of the component.
The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.
More info: https://fb.me/react-controlled-components
(anonymous) @ useControlled.js:18
commitHookEffectListMount @ react-dom.development.js:23150
commitPassiveMountOnFiber @ react-dom.development.js:24926
commitPassiveMountEffects_complete @ react-dom.development.js:24891
commitPassiveMountEffects_begin @ react-dom.development.js:24878
commitPassiveMountEffects @ react-dom.development.js:24866
flushPassiveEffectsImpl @ react-dom.development.js:27039
flushPassiveEffects @ react-dom.development.js:26984
(anonymous) @ react-dom.development.js:26769
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533
Form.stories.tsx?t=1688785178874:53 MUI: A component is changing the uncontrolled value state of FormControl to be controlled.
Elements should not switch from uncontrolled to controlled (or vice versa).
Decide between using a controlled or uncontrolled FormControl element for the lifetime of the component.
The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.
More info: https://fb.me/react-controlled-components