How to use Framework7-React in Storybook?


#1

There’s no Framework7 wrapper for Storybook like material ui for storybook. So, I try to create a simple Framework7 wrapper. So far this is my code :

Part of ./storybook/config.js

import f7 from './f7-react-sb/f7';
        
addDecorator(f7());

Here is f7.js

import React from 'react';
import F7Wrapper from './F7Wrapper';

import 'framework7/css/framework7.min.css';
import Framework7 from 'framework7';
import Framework7React from 'framework7-react';

Framework7.use(Framework7React);

const f7 = () => {
  return getStory => {
    const story = getStory();

    return <F7Wrapper>{story}</F7Wrapper>;
  };
};

export default f7;

And F7Wrapper.js

import React from 'react';
import { App, Statusbar, View } from 'framework7-react';

export default ({ config, children }) => (
  <App params={config}>
    <Statusbar />

    <View>{children}</View>
  </App>
);

Its working properly with the first stories. But when I select another stories from left panel, Its return error and say

Framework7 is already initialized and can’t be initialized more than once

Is Am I missing something?