vue-styleguidist/lib/client/utils/renderStyleguide.js

Vue components style guide generator

import "core-js/modules/es.object.to-string.js";
import "core-js/modules/web.dom-collections.for-each.js";
import "core-js/modules/es.regexp.exec.js";
import "core-js/modules/es.string.search.js";
import * as React from 'react';
import slots from 'rsg-components/slots';
import StyleGuide from 'rsg-components/StyleGuide';
import hashSum from 'hash-sum';
import getRouteData from 'react-styleguidist/lib/client/utils/getRouteData';
import getPageTitle from 'react-styleguidist/lib/client/utils/getPageTitle';
import getComponentsFromSections from './getComponentsFromSections';
import globalizeComponent from './globalizeComponent';
import processSections from './processSections';
export var RenderJsxContext = /*#__PURE__*/React.createContext( /*#__PURE__*/React.createElement("div", null));
export var EnhanceAppContext = /*#__PURE__*/React.createContext(function () {});
export var VueComponentMapContext = /*#__PURE__*/React.createContext({});

/**
 * @param {object} styleguide An object returned by styleguide-loader
 * @param {number} codeRevision
 * @param {Location} [loc]
 * @param {Document} [doc]
 * @param {History} [hist]
 * @return {React.ReactElement}
 */
export default function renderStyleguide(styleguide, codeRevision) {
  var loc = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : window.location;
  var doc = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : document;
  var hist = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : window.history;
  var exampleFileNames = [];
  var allSections = processSections({
    sections: styleguide.sections,
    exampleFileNames: exampleFileNames
  }, {
    useRouterLinks: !!styleguide.config.pagePerSection
  });
  if (!styleguide.config.locallyRegisterComponents) {
    // Globalize all components, not just ones we see on the screen, to make
    // all components accessible to all examples
    var components = getComponentsFromSections(allSections);
    components.forEach(function (component) {
      return globalizeComponent(component);
    });
  }
  var _styleguide$config = styleguide.config,
    title = _styleguide$config.title,
    pagePerSection = _styleguide$config.pagePerSection,
    theme = _styleguide$config.theme,
    styles = _styleguide$config.styles;
  var _getRouteData = getRouteData(allSections, loc.hash, pagePerSection),
    sections = _getRouteData.sections,
    displayMode = _getRouteData.displayMode;

  // Update page title
  doc.title = getPageTitle(sections, title || '', displayMode);

  // If the current hash location was set to just `/` (e.g. when navigating back from isolated view to overview)
  // replace the URL with one without hash, to present the user with a single address of the overview screen
  if (loc.hash === '#/') {
    var url = loc.pathname + loc.search;
    hist.replaceState('', doc.title, url);
  }
  return /*#__PURE__*/React.createElement(EnhanceAppContext.Provider, {
    value: styleguide.enhancePreviewApp["default"] || styleguide.enhancePreviewApp
  }, /*#__PURE__*/React.createElement(RenderJsxContext.Provider, {
    value: styleguide.renderRootJsx
  }, /*#__PURE__*/React.createElement(StyleGuide, {
    codeRevision: codeRevision
    // only calculate css revisions in dev when hot is on to avoid
    // stringifying the styles in production
    ,
    cssRevision: hashSum({
      theme: theme,
      styles: styles
    }),
    config: styleguide.config,
    slots: slots(styleguide.config),
    welcomeScreen: styleguide.welcomeScreen,
    patterns: styleguide.patterns,
    sections: sections,
    allSections: allSections,
    displayMode: displayMode,
    pagePerSection: pagePerSection
  })));
}