1 | "use strict";
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 | exports["default"] = void 0;
|
7 |
|
8 | var _react = _interopRequireDefault(require("react"));
|
9 |
|
10 | var _components = require("@storybook/components");
|
11 |
|
12 | var _storybookPrettyProps = _interopRequireDefault(require("storybook-pretty-props"));
|
13 |
|
14 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
15 |
|
16 | function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
17 |
|
18 | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
19 |
|
20 | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
21 |
|
22 | function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
23 |
|
24 |
|
25 | function createStyleObject(classNames, elementStyle, stylesheet) {
|
26 | return classNames.reduce(function (styleObject, className) {
|
27 | return _objectSpread({}, styleObject, {}, stylesheet[className]);
|
28 | }, elementStyle);
|
29 | }
|
30 |
|
31 |
|
32 |
|
33 | function createClassNameString(classNames) {
|
34 | return classNames.join(' ');
|
35 | }
|
36 |
|
37 |
|
38 | function createChildren(components, stylesheet, useInlineStyles) {
|
39 | var childrenCount = 0;
|
40 | return function (children) {
|
41 | childrenCount += 1;
|
42 | return children.map(function (child, i) {
|
43 | return (
|
44 | createElement({
|
45 | node: child,
|
46 | stylesheet: stylesheet,
|
47 | useInlineStyles: useInlineStyles,
|
48 | components: components,
|
49 | key: "code-segment-".concat(childrenCount, "-").concat(i)
|
50 | })
|
51 | );
|
52 | });
|
53 | };
|
54 | }
|
55 |
|
56 | var componentStack = [];
|
57 |
|
58 |
|
59 | function createElement(_ref) {
|
60 | var node = _ref.node,
|
61 | _ref$stylesheet = _ref.stylesheet,
|
62 | stylesheet = _ref$stylesheet === void 0 ? {} : _ref$stylesheet,
|
63 | components = _ref.components,
|
64 | _ref$style = _ref.style,
|
65 | style = _ref$style === void 0 ? {} : _ref$style,
|
66 | useInlineStyles = _ref.useInlineStyles,
|
67 | key = _ref.key;
|
68 | var properties = node.properties,
|
69 | type = node.type,
|
70 | tagName = node.tagName,
|
71 | value = node.value;
|
72 |
|
73 | if (type === 'text') {
|
74 | return value;
|
75 | }
|
76 |
|
77 | if (tagName) {
|
78 | var TagName = tagName;
|
79 | var childrenCreator = createChildren(components, stylesheet, useInlineStyles);
|
80 | var nonStylesheetClassNames = useInlineStyles && properties.className && properties.className.filter(function (className) {
|
81 | return !stylesheet[className];
|
82 | });
|
83 | var className = nonStylesheetClassNames && nonStylesheetClassNames.length ? nonStylesheetClassNames : '';
|
84 | var props = useInlineStyles ? _objectSpread({}, properties, {}, {
|
85 | className: className ? createClassNameString(className) : className
|
86 | }, {
|
87 | style: createStyleObject(properties.className, _objectSpread({}, properties.style, {}, style), stylesheet)
|
88 | }) : _objectSpread({}, properties, {
|
89 | className: createClassNameString(properties.className)
|
90 | });
|
91 | var children = childrenCreator(node.children);
|
92 | var lastComponent = componentStack[componentStack.length - 1] || '';
|
93 | var name = typeof children[0] === 'string' ? children[0] : '';
|
94 | var hasDocs = props.className.includes('class-name') || props.className.includes('attr-name');
|
95 |
|
96 | if (hasDocs) {
|
97 | var message;
|
98 | var title;
|
99 |
|
100 | if (props.className.includes('class-name')) {
|
101 | var docs = components[name] || {};
|
102 |
|
103 | if (docs.description) {
|
104 | title = children;
|
105 | message = _react["default"].createElement("div", null, docs.description);
|
106 | }
|
107 |
|
108 | componentStack.push(name);
|
109 | } else if (lastComponent.match(/^[A-Z]/)) {
|
110 | var _ref2 = components[lastComponent] || {},
|
111 | _ref2$props = _ref2.props,
|
112 | componentProps = _ref2$props === void 0 ? {} : _ref2$props;
|
113 |
|
114 | var _docs = componentProps[name] || {};
|
115 |
|
116 | if (_docs.type || _docs.description || _docs.required) {
|
117 | title = _react["default"].createElement("div", {
|
118 | style: {
|
119 | display: 'flex',
|
120 | justifyContent: 'space-between'
|
121 | }
|
122 | }, children, _docs.required && _react["default"].createElement("div", {
|
123 | style: {
|
124 | color: 'red',
|
125 | fontWeight: 900
|
126 | }
|
127 | }, "Required"));
|
128 | message = _react["default"].createElement("div", null, _react["default"].createElement("div", {
|
129 | style: {
|
130 | color: 'green',
|
131 | fontWeight: 'bold'
|
132 | }
|
133 | }, _react["default"].createElement(_storybookPrettyProps["default"], {
|
134 | propType: _docs.type
|
135 | })), _docs.description);
|
136 | }
|
137 | }
|
138 |
|
139 | if (title) {
|
140 | return _react["default"].createElement(_components.WithTooltip, {
|
141 | key: key,
|
142 | placement: "bottom",
|
143 | trigger: "hover",
|
144 | tooltip: _react["default"].createElement(_components.TooltipMessage, {
|
145 | title: title,
|
146 | desc: message
|
147 | })
|
148 | }, _react["default"].createElement(TagName, props, children));
|
149 | }
|
150 | } else if (name === '/>' || name === '>') {
|
151 | componentStack.pop();
|
152 | }
|
153 |
|
154 | return _react["default"].createElement(TagName, _extends({
|
155 | key: key
|
156 | }, props), children);
|
157 | }
|
158 | }
|
159 |
|
160 |
|
161 | var jsxRenderer = function jsxRenderer(components) {
|
162 | return function (_ref3) {
|
163 | var rows = _ref3.rows,
|
164 | stylesheet = _ref3.stylesheet,
|
165 | useInlineStyles = _ref3.useInlineStyles;
|
166 | return rows.map(function (node, i) {
|
167 | return createElement({
|
168 | node: node,
|
169 | stylesheet: stylesheet,
|
170 | useInlineStyles: useInlineStyles,
|
171 | components: components,
|
172 | key: "code-segement".concat(i)
|
173 | });
|
174 | });
|
175 | };
|
176 | };
|
177 |
|
178 | var _default = jsxRenderer;
|
179 | exports["default"] = _default; |
\ | No newline at end of file |