Storybook setup in example app

[LanceALaughlin]

Hello! I'm working on setting up a component library that has storybook setup in the example app. I've been able to get the storybook to work correctly; however, I'm having some trouble getting the components I've created in src imported into the .storybook/stories directory. It doesn't recognize my src package; however, I can import it into App.jsx without issue. I know this isn't a react-native-builder-bob issue, but I'm hoping someone else has done this setup and can offer some guidance. Thank you!

[LanceALaughlin]

I suspect it may be related to how the app root is registered:

example/index.js:

import { registerRootComponent } from 'expo';

import App from './src/App';

// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in Expo Go or in a native build,
// the environment is set up appropriately
registerRootComponent(App);

example/App.tsx:

export { default } from '../.storybook';

Perhaps its a scoping issue caused by my changes to App.tsx?

Or perhaps it's related to introducing withStorybook in my metro.config.js:

const path = require('path');
const { getDefaultConfig } = require('@expo/metro-config');
const { getConfig } = require('react-native-builder-bob/metro-config');
const pkg = require('../package.json');

const root = path.resolve(__dirname, '..');
const withStorybook = require('@storybook/react-native/metro/withStorybook');

/**
 * Metro configuration
 * https://facebook.github.io/metro/docs/configuration
 *
 * @type {import('metro-config').MetroConfig}
 */
const defaultConfig = getConfig(getDefaultConfig(__dirname), {
  root,
  pkg,
  project: __dirname,
});

module.exports = withStorybook(defaultConfig);