@wingsuit-designsystem/storybook
Version:
Wingsuit Storybook Integration.
114 lines (112 loc) • 6.25 kB
JavaScript
;
require("core-js/modules/es.object.define-property.js");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.csfParser = csfParser;
require("core-js/modules/es.symbol.js");
require("core-js/modules/es.symbol.description.js");
require("core-js/modules/es.array.concat.js");
require("core-js/modules/es.array.for-each.js");
require("core-js/modules/es.array.join.js");
require("core-js/modules/es.function.name.js");
require("core-js/modules/es.object.keys.js");
require("core-js/modules/es.object.to-string.js");
require("core-js/modules/es.string.starts-with.js");
require("core-js/modules/web.dom-collections.for-each.js");
var _path = _interopRequireDefault(require("path"));
var _fs = _interopRequireDefault(require("fs"));
var _core = require("@wingsuit-designsystem/core");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
// eslint-disable-next-line import/no-extraneous-dependencies
var YAML = require('yaml');
var babylon = require('babylon');
var traverse = require('babel-traverse')["default"];
var _require = require('lodash'),
camelCase = _require.camelCase;
function csfParser(resourcePath, src, appConfig) {
var loader = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
var namespaces = appConfig.namespaces;
var ast = babylon.parse(src, {
sourceType: 'module'
});
var absYamlPath = '';
var patternClientYamlPath = '';
traverse(ast, {
VariableDeclaration: function VariableDeclaration(pathItem) {
if (pathItem.node.declarations[0].id.name === 'patternDefinition') {
var yamlPath = pathItem.node.declarations[0].init.arguments[0].value;
if (yamlPath.startsWith('.') || yamlPath.startsWith('/')) {
absYamlPath = _path["default"].join(_path["default"].dirname(resourcePath), yamlPath);
patternClientYamlPath = "./".concat(_path["default"].basename(absYamlPath));
} else {
absYamlPath = require.resolve(yamlPath);
patternClientYamlPath = "".concat(yamlPath);
}
}
}
});
var results = [];
var generated = src;
var output = [];
if (absYamlPath !== '') {
var _defaultPattern$label, _defaultPattern$names;
if (loader) {
loader.addDependency(absYamlPath);
}
var hasIndexFile = _fs["default"].existsSync(_path["default"].join(_path["default"].dirname(resourcePath), 'index.js'));
var patternDefinitionFile = _fs["default"].readFileSync(absYamlPath, 'utf8');
var patternDefinition = YAML.parse(patternDefinitionFile);
var patternIds = Object.keys(patternDefinition);
var defaultPatternId = patternIds[0];
if (!defaultPatternId) {
return src;
}
var defaultPattern = patternDefinition[defaultPatternId];
(0, _core.invokeHook)(appConfig, 'patternLoaded', [defaultPatternId, defaultPattern]);
(0, _core.invokeHook)(appConfig, 'storyLoaded', [defaultPatternId, defaultPattern]);
var defaultPatternLabel = (_defaultPattern$label = defaultPattern.label) !== null && _defaultPattern$label !== void 0 ? _defaultPattern$label : defaultPatternId;
var defaultPatternNamespace = (_defaultPattern$names = defaultPattern.namespace) !== null && _defaultPattern$names !== void 0 ? _defaultPattern$names : '';
var namespacePath = '';
if (defaultPatternNamespace === '') {
Object.keys(namespaces).forEach(function (key) {
if (resourcePath.startsWith(namespaces[key]) && namespaces[key].length > namespacePath.length) {
defaultPatternNamespace = key;
namespacePath = namespaces[key];
}
});
} else {
namespacePath = defaultPatternNamespace;
}
if (hasIndexFile) {
output.push("import './index';");
}
output.push("\n ".concat(generated, ";\n import { storage } from '@wingsuit-designsystem/pattern';\n import { PatternPreview } from '@wingsuit-designsystem/pattern-react';\n import { args, argTypes } from '@wingsuit-designsystem/storybook';\n import React from 'react';\n import {version} from 'react-dom';\n import '").concat(patternClientYamlPath, "';\n export default {\n tags: ['autodocs'],\n component: PatternPreview\n }\n let pattern = null;\n"));
patternIds.forEach(function (patternId) {
var _patternDefinition$pa;
var label = patternDefinition[patternId].label;
var variants = (_patternDefinition$pa = patternDefinition[patternId].variants) !== null && _patternDefinition$pa !== void 0 ? _patternDefinition$pa : {
__default: {
label: 'Default'
}
};
Object.keys(variants).forEach(function (variantName) {
var _patternDefinition$pa2;
var variantLabel = variants[variantName].label;
var jsKey = camelCase("P".concat(patternId).concat(variantName, "Pattern"));
var storyLabel = label === defaultPatternLabel ? variantLabel : "".concat(label, ": ").concat(variantLabel);
output.push("\n export const ".concat(jsKey, " = {\n name: '").concat(storyLabel, "',\n args: {patternId: '").concat(patternId, "', variantId: '").concat(variantName, "', ...args({}, '").concat(patternId, "', '").concat(variantName, "') },\n argTypes: argTypes('").concat(patternId, "', '").concat(variantName, "'),\n parameters: {\n ... wingsuit.parameters ?? {},\n docs: { \n description: {\n component: `").concat((_patternDefinition$pa2 = patternDefinition[patternId].description) !== null && _patternDefinition$pa2 !== void 0 ? _patternDefinition$pa2 : '', "`\n },\n source: {\n code: storage.loadVariant('").concat(patternId, "', '").concat(variantName, "').getCode(),\n language: 'jsx',\n type: 'auto',\n format: true\n }\n }\n }\n }"));
results.push({
namespace: "".concat(defaultPatternNamespace, "/").concat(label),
label: storyLabel,
patternId: patternId,
exportName: jsKey
});
});
});
}
return {
items: results,
csf: output.join(' ')
};
}