How to use the hyperview/src/services/stylesheets.createStylesheets function in hyperview

.then((responseText) => {
        if (typeof this.props.onParseBefore === 'function') {
          this.props.onParseBefore(url);
        }
        let doc = this.parser.parseFromString(responseText);
        let error = false;
        const stylesheets = Stylesheets.createStylesheets(doc);
        this.navigation.setRouteKey(url, routeKey);

        // Make sure the XML has the required elements: , , .
        const docElement = getFirstTag(doc, 'doc');
        if (!docElement) {
          console.error(`No  tag found in the response from ${url}.`);
          doc = null;
          error = true;
        } else {
          const screenElement = getFirstTag(docElement, 'screen');
          if (!screenElement) {
            console.error(`No  tag found in the  tag from ${url}.`);
            doc = null;
            error = true;
          } else {
            const bodyElement = getFirstTag(screenElement, 'body');

if (newPreloadScreen !== oldPreloadScreen) {
      this.navigation.removePreloadScreen(oldPreloadScreen);
    }

    // TODO: If the preload screen is changing, delete the old one from
    // this.navigation.preloadScreens to prevent memory leaks.

    if (newUrl && newUrl !== oldUrl) {
      this.needsLoad = true;

      const preloadScreen = newPreloadScreen
        ? this.navigation.getPreloadScreen(newPreloadScreen)
        : null;

      const doc = preloadScreen || this.state.doc;
      const styles = preloadScreen ? Stylesheets.createStylesheets(preloadScreen) : this.state.styles;

      this.setState({ doc, styles, url: newUrl });
    }
  }

componentDidMount() {
    const { params } = this.getNavigationState(this.props);
    // The screen may be rendering via a navigation from another HyperScreen.
    // In this case, the url to load in the screen will be passed via navigation props.
    // Otherwise, use the entrypoint URL provided as a prop to the first HyperScreen.
    const url = params.url || this.props.entrypointUrl || null;

    const preloadScreen = params.preloadScreen
      ? this.navigation.getPreloadScreen(params.preloadScreen)
      : null;
    const preloadStyles = preloadScreen ? Stylesheets.createStylesheets(preloadScreen) : {};

    this.needsLoad = true;
    if (preloadScreen) {
      this.setState({
        doc: preloadScreen,
        styles: preloadStyles,
        error: false,
        url,
      });
    } else {
      this.setState({
        error: false,
        url,
      });
    }
  }

return (templateName: string, render: any) => {
    const templatePath = `${componentPath}/stories/${templateName}.xml`;
    const storyName = humps.pascalize(templateName);
    const parser = new DOMParser();
    const document = parser.parseFromString(templates[templatePath]);
    const element = getFirstTag(document, Component.localName);
    const stylesheets = Stylesheets.createStylesheets(document);
    s.add(storyName, () => render({ element, stylesheets }));
  };
};