vue-styleguidist/lib/client/index.js

Vue components style guide generator

/* eslint-disable import/first */
import 'react-styleguidist/lib/client/polyfills';
import 'react-styleguidist/lib/client/styles';
import { createRoot } from 'react-dom/client';
import { getParameterByName, hasInHash } from 'react-styleguidist/lib/client/utils/handleHash';
import renderStyleguide from './utils/renderStyleguide';

// Examples code revision to rerender only code examples (not the whole page) when code changes
// eslint-disable-next-line no-unused-vars
var codeRevision = 0;

// Scrolls to origin when current window location hash points to an isolated view.
var scrollToOrigin = function scrollToOrigin() {
  var hash = window.location.hash;
  if (hasInHash(hash, '#/') || hasInHash(hash, '#!/')) {
    // Extracts the id param of hash
    var idHashParam = getParameterByName(hash, 'id');

    // For default scroll scrollTop is the page top
    var scrollTop = 0;
    if (idHashParam) {
      // Searches the node with the same id, takes his offsetTop
      // And with offsetTop, tries to scroll to node
      var idElement = document.getElementById(idHashParam);
      if (idElement && idElement.offsetTop) {
        scrollTop = idElement.offsetTop;
      }
    }
    window.scrollTo(0, scrollTop);
  }
};
var root;
var render = function render() {
  // eslint-disable-next-line @typescript-eslint/no-var-requires,import/no-unresolved,import/extensions
  var styleguide = require('!!../loaders/styleguide-loader!./index.js');
  var container = document.getElementById(styleguide.config.mountPointId);
  if (!container) {
    throw new Error("Could not find container with id \"".concat(styleguide.config.mountPointId, "\""));
  }
  if (!root) {
    root = createRoot(container); // createRoot(container!) if you use TypeScript
  }

  root.render(renderStyleguide(styleguide, codeRevision));
};
window.addEventListener('hashchange', render);
window.addEventListener('hashchange', scrollToOrigin);

// @ts-expect-error hot module replacement
if (module.hot) {
  // @ts-expect-error hot module replacement
  module.hot.accept('!!../loaders/styleguide-loader!./index.js', function () {
    codeRevision += 1;
    render();
  });
}
render();