UNPKG

@antv/t8

Version:

T8 is a text visualization solution for unstructured data within the AntV technology stack, and it is a declarative T8 markdown syntax that can be used to describe the content of data interpretation reports.

122 lines (118 loc) 4.17 kB
'use strict'; var tslib = require('tslib'); var preact = require('preact'); require('preact/jsx-runtime'); require('uuid'); require('./schema/paragraph.js'); require('./schema/phrase.js'); require('./vis-components/styled/bullet.js'); require('./vis-components/styled/container.js'); require('./vis-components/styled/entity.js'); require('./vis-components/styled/heading.js'); require('./vis-components/styled/marks.js'); require('./vis-components/styled/paragraph.js'); require('./vis-components/context/hooks/theme.js'); require('./vis-components/context/hooks/plugin.js'); require('./vis-components/context/hooks/event.js'); require('./vis-components/context/hooks/currentParagraphInfo.js'); require('./plugin/index.js'); var util = require('./theme/util.js'); require('./theme/seed/index.js'); require('preact/hooks'); var NarrativeTextVis = require('./vis-components/NarrativeTextVis.js'); var EE = require('@antv/event-emitter'); var syntaxParser = require('./parser/syntax-parser.js'); var PluginManager = require('./plugin/PluginManager.js'); var index = require('./plugin/presets/index.js'); /** * Text component for rendering narrative text visualizations. * * Usage: * ```javascript * const text = new Text('#container'); * text.theme('light').render(` * # Sales Report * Total sales are [¥1,234,567](metric_value). * `); * ``` */ var Text = /** @class */ (function (_super) { tslib.__extends(Text, _super); function Text(container) { var _this = _super.call(this) || this; _this.container = typeof container === 'string' ? document.querySelector(container) : container; _this.pluginManager = new PluginManager.PluginManager(index.presetPlugins); return _this; } /** * Set the theme for the narrative text visualization. * @param theme - The theme configuration for the text visualization. * @returns The Text instance for method chaining. */ Text.prototype.theme = function (theme, seedToken) { this.themeSeedToken = util.getThemeSeedToken(theme, seedToken); return this; }; /** * Register a plugin for the text visualization. * @param plugin - The plugin to register. * @returns The Text instance for method chaining. */ Text.prototype.registerPlugin = function (plugin) { this.pluginManager.register(plugin); return this; }; /** * Render the narrative text visualization. * Accepts a T8 syntax string for rendering. * @param t8Syntax - T8 syntax string to render. * @returns A function to unmount the component. */ Text.prototype.render = function (t8Syntax) { var container = this.container; var spec; // Parse T8 syntax if provided if (t8Syntax) { try { // Parse T8 syntax string with error tolerance spec = syntaxParser.parseSyntax(t8Syntax); } catch (error) { // Log error but continue with empty spec for error tolerance console.error("T8 Syntax parsing failed: ".concat(error instanceof Error ? error.message : String(error))); spec = { sections: [] }; } } else { // Use stored spec if no content provided spec = this.spec; } // Render the component. // We use `preact` to code the `NarrativeTextVis` components. preact.render(preact.h(NarrativeTextVis.NarrativeTextVis, { spec: spec, pluginManager: this.pluginManager, themeSeedToken: this.themeSeedToken, onEvent: this.emit.bind(this), }), container); // Return unmount function. return function () { preact.render(null, container); }; }; /** * Clear the visualization. */ Text.prototype.clear = function () { this.unmount(); }; /** * Unmount the component. */ Text.prototype.unmount = function () { preact.render(null, this.container); }; return Text; }(EE)); exports.Text = Text; //# sourceMappingURL=text.js.map