@irwinproject/storybook-addon-tsdoc/dist/decorators.js

Generate mdx documentation from your typescript!

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.$section = exports.$t = exports.$s = exports.$doc = exports.$h = exports.$reg = exports.$kd = exports.$name = exports.$link = exports.$href = exports.$literal = exports.$type = exports.$kind = void 0;
const ts_morph_1 = require("ts-morph");
const node_tools_1 = require("./node-tools");
const node_signature_1 = require("./node-signature");
const constants_1 = require("./constants");
/*
Decorators are just a mechanism to color code different parts of the syntax.
*/
/**
 * Creates a kind decorator
 * @param kind
 * @returns
 */
const $kind = (kind) => `<span className="ts-doc-kind">${kind}</span>`;
exports.$kind = $kind;
/**
 * Creates a type decorator
 * @param type
 * @returns
 */
const $type = (type) => `<span className="ts-doc-type">${type}</span>`;
exports.$type = $type;
/**
 * Creates a literal decorator
 * @param lit
 * @returns
 */
const $literal = (lit) => `<span className="ts-doc-lit">${lit}</span>`;
exports.$literal = $literal;
/**
 * Creates a link to a reference.
 * @param text
 * @param href
 * @returns
 */
const $href = (text, href) => `[${text}](${href})`;
exports.$href = $href;
/**
 * Just a convenience that can be used anywhere.
 *
 * My new traversal method of types may prevent expressions from being handled however if not this is a good point to add support that does not directly effect the signature process.
 */
const $link = (node) => {
    const href = (0, node_tools_1.getDocPath)(node);
    const nm = (0, node_tools_1.getName)(node);
    return href ? (0, exports.$href)(nm, href) : nm;
};
exports.$link = $link;
/**
 * Creates a name decorator
 * @param text
 * @returns
 */
const $name = (text) => `<span className="ts-doc-name">${text}</span>`;
exports.$name = $name;
/**
 * Because types are often just a string a template string array is a convenience.
 * @param strings
 * @param args
 * @returns
 */
const $kd = (strings, ...args) => (0, exports.$kind)(strings.reduce((o, s, i) => { var _a; return o + s + ((_a = args[i]) !== null && _a !== void 0 ? _a : ''); }, ''));
exports.$kd = $kd;
const $reg = (...strings) => `<span className="ts-doc-reg">${strings.filter(a => a).join('')}</span>`;
exports.$reg = $reg;
/**
 * Create a title section that allows for a more dynamic naming then what .mdx typically supports.
 *
 * This is accomplished by visibly hiding the default header and positioning a new header elements over the original header. this will replicate the scroll effect while allowing a more descriptive title.
 * @param s
 * @param node
 * @param content
 * @returns
 */
const $h = (s, node, ...content) => `<div className="ts-doc-header-wrapper">

<h${s} className="ts-doc-header">${content.join(' ')}</h${s}>

${node ? `${'#'.repeat(s)} ${(0, node_tools_1.getFullName)(node)}\n\n` : ''}</div>`;
exports.$h = $h;
const $doc = (data, title) => `${constants_1.STORY_BOOK_BLOCK}
<Meta title="${title}"/>

<article className="ts-doc-document">${data}</article>`;
exports.$doc = $doc;
const $s = (s, kind, node) => `<div className="ts-doc-header-wrapper">
	<h${s} className="ts-doc-header">${(0, exports.$kind)(kind)} ${(0, node_tools_1.getName)(node)} ${((0, exports.$reg)(ts_morph_1.Node.isParameterDeclaration(node) ? (node.isRestParameter() ? '...' : '') + (0, node_signature_1.getSignature)(node.getTypeNode()) : (0, node_signature_1.getSignature)(node))).wrap(': ', '')}</h${s}>
	${'#'.repeat(s)} ${(0, node_tools_1.getFullName)(node)}
</div>`;
exports.$s = $s;
const $t = (s) => (strings, ...args) => `<div className="ts-doc-header-wrapper">
	<h${s} className="ts-doc-header">${strings.reduce((o, s, i) => { var _a; return o + s + ((_a = args[i]) !== null && _a !== void 0 ? _a : ''); }, '')}</h${s}>
</div>`;
exports.$t = $t;
const $section = (...content) => {
    const ctn = content.filter(c => c.trim()).join('\n');
    if (!ctn)
        return '';
    return `<div className="ts-doc-section">
		${ctn}
</div>`;
};
exports.$section = $section;