vue-styleguidist
Version:
Vue components style guide generator
120 lines (117 loc) • 5.37 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
import "core-js/modules/es.array.concat.js";
import "core-js/modules/es.function.name.js";
import "core-js/modules/es.object.to-string.js";
import "core-js/modules/web.dom-collections.for-each.js";
import "core-js/modules/es.object.keys.js";
import "core-js/modules/es.symbol.js";
import "core-js/modules/es.array.filter.js";
import "core-js/modules/es.object.get-own-property-descriptor.js";
import "core-js/modules/es.object.get-own-property-descriptors.js";
import { cleanName, compileTemplateForEval, h, isVue3 } from 'vue-inbrowser-compiler-utils';
import { getVueApp } from './getVueApp';
export function getCompiledExampleComponent(_ref) {
var compiledExample = _ref.compiledExample,
evalInContext = _ref.evalInContext,
vuex = _ref.vuex,
component = _ref.component,
renderRootJsx = _ref.renderRootJsx,
enhancePreviewApp = _ref.enhancePreviewApp,
handleError = _ref.handleError,
destroyVueInstance = _ref.destroyVueInstance,
el = _ref.el,
locallyRegisterComponents = _ref.locallyRegisterComponents,
moduleId = _ref.moduleId;
var style;
var previewComponent = {};
var calcOptions = function calcOptions() {
try {
style = compiledExample.style;
if (compiledExample.script) {
// compile and execute the script
// it can be:
// - a script setting up variables => we set up the data function of previewComponent
// - a `new Vue()` script that will return a full config object
previewComponent = evalInContext(compiledExample.script)() || {};
if (previewComponent.render) {
var originalRender = previewComponent.render;
previewComponent.render = function () {
try {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return originalRender.call.apply(originalRender, [this].concat(args));
} catch (e) {
handleError(e);
return undefined;
}
};
}
}
if (compiledExample.template) {
// if this is a pure template or if we are in hybrid vsg mode,
// we need to set the template up.
previewComponent.template = "<div>".concat(compiledExample.template, "</div>");
}
} catch (err) {
handleError(err);
previewComponent = {
template: '<div/>'
};
}
};
calcOptions();
// In case the template is inlined in the script,
// we need to compile it
if (previewComponent.template && compiledExample) {
compiledExample.template = previewComponent.template;
compileTemplateForEval(compiledExample);
calcOptions();
delete previewComponent.template;
}
var extendsComponent = {};
if (vuex) {
extendsComponent = {
store: vuex["default"]
};
}
if (isVue3) {
previewComponent.__scopeId = 'data-' + moduleId;
} else {
previewComponent._scopeId = 'data-' + moduleId;
}
// if we are in local component registration, register current component
// NOTA: on independent md files, component.module is undefined
if (component.module && locallyRegisterComponents &&
// NOTA: if the components member of the vue config object is
// already set it should not be changed
!previewComponent.components) {
component.displayName = cleanName(component.name);
// register component locally
previewComponent.components = _defineProperty({}, component.displayName, component.module["default"] || component.module);
if (component.props.subComponents) {
component.props.subComponents.forEach(function (c) {
c.displayName = cleanName(c.name);
previewComponent.components[c.displayName] = c.module["default"] || c.module;
});
}
}
// then we just have to render the setup previewComponent in the prepared slot
var rootComponent = typeof (renderRootJsx === null || renderRootJsx === void 0 ? void 0 : renderRootJsx["default"]) === 'function' ? renderRootJsx["default"](previewComponent) : {
render: function render(createElement) {
return (isVue3 ? h : createElement)(previewComponent);
}
};
try {
destroyVueInstance();
return {
app: getVueApp(_objectSpread(_objectSpread({}, extendsComponent), rootComponent), el, enhancePreviewApp),
style: style
};
} catch (err) {
handleError(err);
return {};
}
}