General question about Storybook

I am running Storybook and want to point to the same themed components that Plasmic uses. I am using a registerChakraProvider(loader); in Plasmic. But How does StoryBook see this?

I assume I need a seperate React App not connected to Plasmic, yet point to the same theme files to extent the theme:

// Create react app
<ChakraProvider theme={theme}>
  <App />

Possible? Am I on the right track?

You ultimately just need to make sure Storybook sees the same provided theme, see

I see. So I’ve added this code to .storyBook/preview.js but it does take effect.
Should I be using ?
Maybe thats the issue.

import React from 'react';

import { ChakraProvider, ChakraProviderProps } from "@chakra-ui/react";
import { theme as proTheme } from "../theme/src/index";
import { extendTheme, theme as baseTheme } from "@chakra-ui/react";

const theme = extendTheme(
      colors: { ...baseTheme.colors, brand: baseTheme.colors.yellow },

export const decorators = [
  (Story) => (
    <ChakraProvider theme={theme}>

export const parameters = {
  actions: { argTypesRegex: "^on[A-Z].*" },
  controls: {
    matchers: {
      color: /(background|color)$/i,
      date: /Date$/,

If I use the this, the Chakra docs say I need:

const theme = require('../path/to/your/theme')

export const parameters = {
  chakra: {

Yet this doesn’t work either