search

jeanverster / chakra-ui-steps

Steps component designed to work seamlessly with Chakra UI
https://chakra-ui-steps.vercel.app
390 stars 44 forks source link

the example code didn't work #51

Closed zaherkassem closed 2 years ago

zaherkassem commented 2 years ago

chakra-ui-steps.esm.js:310 Uncaught TypeError: Cannot read properties of undefined (reading 'width') at chakra-ui-steps.esm.js:310:1 at renderWithHooks (react-dom.development.js:14985:1) at updateForwardRef (react-dom.development.js:17044:1) at beginWork (react-dom.development.js:19098:1) at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1) at invokeGuardedCallback (react-dom.development.js:4056:1) at beginWork$1 (react-dom.development.js:23964:1) at performUnitOfWork (react-dom.development.js:22776:1) at workLoopSync (react-dom.development.js:22707:1) (anonymous) @ chakra-ui-steps.esm.js:310 renderWithHooks @ react-dom.development.js:14985 updateForwardRef @ react-dom.development.js:17044 beginWork @ react-dom.development.js:19098 callCallback @ react-dom.development.js:3945 invokeGuardedCallbackDev @ react-dom.development.js:3994 invokeGuardedCallback @ react-dom.development.js:4056 beginWork$1 @ react-dom.development.js:23964 performUnitOfWork @ react-dom.development.js:22776 workLoopSync @ react-dom.development.js:22707 renderRootSync @ react-dom.development.js:22670 performSyncWorkOnRoot @ react-dom.development.js:22293 scheduleUpdateOnFiber @ react-dom.development.js:21881 updateContainer @ react-dom.development.js:25482 (anonymous) @ react-dom.development.js:26021 unbatchedUpdates @ react-dom.development.js:22431 legacyRenderSubtreeIntoContainer @ react-dom.development.js:26020 render @ react-dom.development.js:26103 (anonymous) @ render.js:62 _callee$ @ render.js:61 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ render.js:36 _next @ render.js:38 (anonymous) @ render.js:38 (anonymous) @ render.js:38 renderElement @ render.js:76 _callee2$ @ render.js:167 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ render.js:36 _next @ render.js:38 (anonymous) @ render.js:38 (anonymous) @ render.js:38 _renderToDOM @ render.js:176 renderToDOM @ render.js:139 (anonymous) @ PreviewWeb.js:1122 _callee12$ @ PreviewWeb.js:1051 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 runPhase @ PreviewWeb.js:1072 _callee14$ @ PreviewWeb.js:1121 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 Promise.then (async) asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 render @ PreviewWeb.js:1185 renderStoryToElement @ PreviewWeb.js:1193 renderStory @ PreviewWeb.js:973 _callee8$ @ PreviewWeb.js:795 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 Promise.then (async) asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 Promise.then (async) asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 renderSelection @ PreviewWeb.js:808 _callee3$ @ PreviewWeb.js:336 tryCatch @ runtime.js:63 invoke @ runtime.js:294 (anonymous) @ runtime.js:119 asyncGeneratorStep @ PreviewWeb.js:8 _next @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 (anonymous) @ PreviewWeb.js:10 selectSpecifiedStory @ PreviewWeb.js:349 (anonymous) @ PreviewWeb.js:289 (anonymous) @ index.js:217 _runResolutions @ index.js:214 then @ index.js:67 initializeWithStoryIndex @ PreviewWeb.js:282 (anonymous) @ PreviewWeb.js:179 (anonymous) @ index.js:217 _runResolutions @ index.js:214 then @ index.js:67 initializeWithProjectAnnotations @ PreviewWeb.js:178 (anonymous) @ PreviewWeb.js:120 (anonymous) @ index.js:217 _runResolutions @ index.js:214 then @ index.js:67 initialize @ PreviewWeb.js:119 configure @ start.js:148 configure @ index.js:21 (anonymous) @ generated-stories-entry.js:6 ./generated-stories-entry.js @ generated-stories-entry.js:6 webpack_require @ bootstrap:853 fn @ bootstrap:150 0 @ storybook-init-framework-entry.js:1 webpack_require @ bootstrap:853 checkDeferredModules @ bootstrap:45 webpackJsonpCallback @ bootstrap:32 (anonymous) @ main.iframe.bundle.js:1 Show 64 more frames 3react-dom.development.js:20085 The above error occurred in the component:

at http://localhost:6006/vendors~main.iframe.bundle.js:101192:24
at div
at http://localhost:6006/vendors~main.iframe.bundle.js:64702:73
at StepsProvider (http://localhost:6006/vendors~main.iframe.bundle.js:100982:20)
at http://localhost:6006/vendors~main.iframe.bundle.js:101302:101
at div
at http://localhost:6006/vendors~main.iframe.bundle.js:64702:73
at http://localhost:6006/vendors~main.iframe.bundle.js:47087:25
at Stepper (http://localhost:6006/main.iframe.bundle.js:3514:160)
at EnvironmentProvider (http://localhost:6006/vendors~main.iframe.bundle.js:51921:24)
at ColorModeProvider (http://localhost:6006/vendors~main.iframe.bundle.js:43626:21)
at ThemeProvider (http://localhost:6006/vendors~main.iframe.bundle.js:64741:71)
at ThemeProvider (http://localhost:6006/vendors~main.iframe.bundle.js:54750:27)
at http://localhost:6006/vendors~main.iframe.bundle.js:45253:23
at ChakraProvider (http://localhost:6006/vendors~main.iframe.bundle.js:51766:24)
at unboundStoryFn (http://localhost:6006/vendors~main.iframe.bundle.js:95967:12)
at ErrorBoundary (http://localhost:6006/vendors~main.iframe.bundle.js:93156:5)

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary.

zaherkassem commented 2 years ago

duplicate