office-viewer 0.1.0

package/lib/Word.js

@@ -0,0 +1,374 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('./node_modules/tslib/tslib.es6.js');
+var parseRelationship = require('./parse/parseRelationship.js');
+var ContentType = require('./openxml/ContentType.js');
+var Style = require('./openxml/Style.js');
+var Theme = require('./openxml/Theme.js');
+var renderDocument = require('./render/renderDocument.js');
+var blob = require('./util/blob.js');
+var Numbering = require('./openxml/word/numbering/Numbering.js');
+var dom = require('./util/dom.js');
+var renderStyle = require('./render/renderStyle.js');
+var mergeRun = require('./util/mergeRun.js');
+var WDocument = require('./openxml/word/WDocument.js');
+var renderRun = require('./render/renderRun.js');
+var ZipPackageParser = require('./package/ZipPackageParser.js');
+var xml = require('./util/xml.js');
+
+/**
+ * 总入口，它将包括所有 word 文档信息，后续渲染的时候依赖它来获取关联信息
+ */
+var defaultRenderOptions = {
+    imageDataURL: false,
+    classPrefix: 'docx-viewer',
+    inWrap: true,
+    bulletUseFont: true,
+    ignoreHeight: true,
+    ignoreWidth: true,
+    minLineHeight: 1.0,
+    enableVar: false,
+    debug: false
+};
+var Word = /** @class */ (function () {
+    /**
+     * 构建 word
+     *
+     * @param docxFile docx 文件
+     * @param options 渲染配置
+     * @param packaParser 包解析器
+     */
+    function Word(docFile, renderOptions, parser) {
+        if (parser === void 0) { parser = new ZipPackageParser["default"](); }
+        /**
+         * 解析 theme 目录里的数据
+         */
+        this.themes = [];
+        /**
+         * 样式名映射，因为自定义样式名有可能不符合 css 命名规范，因此实际使用这个名字
+         */
+        this.styleIdMap = {};
+        /**
+         * 用于自动生成样式名时的计数，保证每次都是唯一的
+         */
+        this.styleIdNum = 0;
+        this.wrapClassName = 'docx-viewer-wrapper';
+        this.inited = false;
+        parser.load(docFile);
+        this.id = Word.globalId++;
+        this.parser = parser;
+        this.renderOptions = tslib_es6.__assign(tslib_es6.__assign({}, defaultRenderOptions), renderOptions);
+    }
+    /**
+     * 初始化一些公共资源，比如
+     */
+    Word.prototype.init = function () {
+        if (this.inited) {
+            return;
+        }
+        // 这个必须在最前面，因为后面很多依赖它来查找文件的
+        this.initContentType();
+        this.initTheme();
+        this.initStyle();
+        this.initRelation();
+        this.initNumbering();
+        this.inited = true;
+    };
+    /**
+     * 解析全局主题配置
+     */
+    Word.prototype.initTheme = function () {
+        var e_1, _a;
+        try {
+            for (var _b = tslib_es6.__values(this.conentTypes.overrides), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var override = _c.value;
+                if (override.partName.startsWith('/word/theme')) {
+                    var theme = this.parser.getXML(override.partName);
+                    this.themes.push(Theme.parseTheme(theme));
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+    };
+    /**
+     * 解析全局样式
+     */
+    Word.prototype.initStyle = function () {
+        var e_2, _a;
+        try {
+            for (var _b = tslib_es6.__values(this.conentTypes.overrides), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var override = _c.value;
+                if (override.partName.startsWith('/word/styles.xml')) {
+                    this.styles = Style.parseStyles(this, this.parser.getXML('/word/styles.xml'));
+                }
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+    };
+    /**
+     * 解析关系
+     */
+    Word.prototype.initRelation = function () {
+        var rels = {};
+        if (this.parser.fileExists('/_rels/.rels')) {
+            rels = parseRelationship.parseRelationships(this.parser.getXML('/_rels/.rels'), 'root');
+        }
+        var documentRels = {};
+        if (this.parser.fileExists('/word/_rels/document.xml.rels')) {
+            documentRels = parseRelationship.parseRelationships(this.parser.getXML('/word/_rels/document.xml.rels'), 'word');
+        }
+        this.relationships = tslib_es6.__assign(tslib_es6.__assign({}, rels), documentRels);
+    };
+    /**
+     * 解析全局配置
+     */
+    Word.prototype.initContentType = function () {
+        var contentType = this.parser.getXML('[Content_Types].xml');
+        this.conentTypes = ContentType.parseContentType(contentType);
+    };
+    /**
+     * 解析 numbering
+     */
+    Word.prototype.initNumbering = function () {
+        var e_3, _a;
+        try {
+            for (var _b = tslib_es6.__values(this.conentTypes.overrides), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var override = _c.value;
+                if (override.partName.startsWith('/word/numbering')) {
+                    var numberingData = this.parser.getXML(override.partName);
+                    this.numbering = Numbering.Numbering.fromXML(this, numberingData);
+                }
+            }
+        }
+        catch (e_3_1) { e_3 = { error: e_3_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_3) throw e_3.error; }
+        }
+    };
+    /**
+     * 根据 id 获取关系
+     */
+    Word.prototype.getRelationship = function (id) {
+        if (id) {
+            return this.relationships[id];
+        }
+        return null;
+    };
+    /**
+     * 进行文本替换
+     */
+    Word.prototype.replaceText = function (text) {
+        if (this.renderOptions.enableVar === false ||
+            !this.renderOptions.replaceText) {
+            return text;
+        }
+        return this.renderOptions.replaceText(text);
+    };
+    /**
+     * 加载图片
+     */
+    Word.prototype.loadImage = function (relation) {
+        var path = relation.target;
+        if (relation.part === 'word') {
+            path = 'word/' + path;
+        }
+        var data = this.parser.getFileByType(path, 'blob');
+        if (data) {
+            if (this.renderOptions.imageDataURL) {
+                return blob.blobToDataURL(data);
+            }
+            else {
+                return new Promise(function (resolve, reject) {
+                    resolve(URL.createObjectURL(data));
+                });
+            }
+        }
+        return null;
+    };
+    /**
+     * 解析 html
+     */
+    Word.prototype.getXML = function (filePath) {
+        return this.parser.getXML(filePath);
+    };
+    /**
+     * 获取 styleId 的显示名称，因为这里可以自定义，理论上会出现 css 不支持的语法
+     */
+    Word.prototype.getStyleIdDisplayName = function (styleId) {
+        /**
+         * 简单判断一下，如果是合法的 css 名称，就直接返回
+         * In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".
+         */
+        if (styleId.match(/^[a-zA-Z]+[a-zA-Z0-9\-\_]*$/)) {
+            return this.getClassPrefix() + '-' + styleId;
+        }
+        if (styleId in this.styleIdMap) {
+            return this.styleIdMap[styleId];
+        }
+        else {
+            this.styleIdMap[styleId] = this.genClassName();
+            return this.styleIdMap[styleId];
+        }
+    };
+    /**
+     * 生成个新的唯一的 class 名称
+     */
+    Word.prototype.genClassName = function () {
+        return 'docx-classname-' + this.styleIdNum++;
+    };
+    /**
+     * 添加新样式，主要用于表格的单元格样式
+     */
+    Word.prototype.appendStyle = function (style) {
+        var styleElement = document.createElement('style');
+        styleElement.innerHTML = style;
+        this.rootElement.appendChild(styleElement);
+    };
+    /**
+     * 返回样式表名及它的父级样式表名
+     * @param styleId 样式表里的 style 名称
+     * @returns 返回 className 数组
+     */
+    Word.prototype.getStyleClassName = function (stylId) {
+        var style = this.styles.styleMap[stylId];
+        if (!style) {
+            return [];
+        }
+        var classNames = [this.getStyleIdDisplayName(stylId)];
+        if (style.basedOn) {
+            classNames.unshift(this.getStyleIdDisplayName(style.basedOn));
+        }
+        return classNames;
+    };
+    /**
+     * 渲染时的 css 类前缀
+     */
+    Word.prototype.getClassPrefix = function () {
+        return "".concat(this.renderOptions.classPrefix, "-").concat(this.id);
+    };
+    /**
+     * 获取主题色，目前基于 css 变量实现，方便动态修改
+     */
+    Word.prototype.getThemeColor = function (name) {
+        return "var(--docx-".concat(this.id, "-theme-").concat(name, "-color)");
+    };
+    Word.prototype.addClass = function (element, className) {
+        element.classList.add("".concat(this.getClassPrefix(), "-").concat(className));
+    };
+    /**
+     * 更新页面中的变量，这个要在 render 后运行
+     */
+    Word.prototype.updateVariable = function () {
+        if (!this.rootElement ||
+            this.renderOptions.enableVar === false ||
+            !this.renderOptions.replaceText) {
+            return;
+        }
+        renderRun.updateVariableText(this);
+    };
+    /**
+     * 下载生成的文档，会对 word/document.xml 进行处理，替换文本
+     */
+    Word.prototype.download = function (fileName) {
+        if (fileName === void 0) { fileName = 'document.docx'; }
+        var documentData = this.getXML('word/document.xml');
+        if (this.renderOptions.enableVar && this.renderOptions.replaceText) {
+            mergeRun.mergeRun(this, documentData);
+            // 对文本进行替换
+            var ts = documentData.getElementsByTagName('w:t');
+            for (var i = 0; i < ts.length; i++) {
+                ts[i].textContent = this.replaceText(ts[i].textContent || '');
+            }
+        }
+        var blob$1 = this.parser.generateZip(xml.buildXML(documentData));
+        blob.downloadBlob(blob$1, fileName);
+    };
+    /**
+     * 打印功能
+     */
+    Word.prototype.print = function () {
+        var _a, _b;
+        return tslib_es6.__awaiter(this, void 0, void 0, function () {
+            var iframe;
+            return tslib_es6.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        iframe = document.createElement('iframe');
+                        iframe.style.position = 'absolute';
+                        iframe.style.top = '-10000px';
+                        document.body.appendChild(iframe);
+                        (_a = iframe.contentDocument) === null || _a === void 0 ? void 0 : _a.write('<div id="print"></div>');
+                        return [4 /*yield*/, this.render((_b = iframe.contentDocument) === null || _b === void 0 ? void 0 : _b.getElementById('print'))];
+                    case 1:
+                        _c.sent();
+                        setTimeout(function () {
+                            var _a, _b;
+                            iframe.focus();
+                            (_a = iframe.contentWindow) === null || _a === void 0 ? void 0 : _a.print();
+                            (_b = iframe.parentNode) === null || _b === void 0 ? void 0 : _b.removeChild(iframe);
+                        }, 100);
+                        window.focus();
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    /**
+     * 渲染文档入口
+     *
+     * @param root 渲染的根节点
+     */
+    Word.prototype.render = function (root) {
+        return tslib_es6.__awaiter(this, void 0, void 0, function () {
+            var renderOptions, isDebug, documentData, document, documentElement;
+            return tslib_es6.__generator(this, function (_a) {
+                this.init();
+                renderOptions = this.renderOptions;
+                isDebug = renderOptions.debug;
+                isDebug && console.log('init', this);
+                this.rootElement = root;
+                root.innerHTML = '';
+                documentData = this.getXML('word/document.xml');
+                isDebug && console.log('documentData', documentData);
+                if (renderOptions.enableVar && renderOptions.replaceText) {
+                    mergeRun.mergeRun(this, documentData);
+                    // 这里不进行变量替换，方便后续进行局部替换来更新变量
+                }
+                document = WDocument.WDocument.fromXML(this, documentData);
+                isDebug && console.log('document', document);
+                documentElement = renderDocument["default"](this, document);
+                root.classList.add(this.getClassPrefix());
+                if (renderOptions.inWrap) {
+                    root.classList.add(this.wrapClassName);
+                }
+                dom.appendChild(root, renderStyle.renderStyle(this));
+                dom.appendChild(root, documentElement);
+                return [2 /*return*/];
+            });
+        });
+    };
+    /**
+     * 全局 id，用于一个页面渲染多个 word 文档
+     */
+    Word.globalId = 0;
+    return Word;
+}());
+
+exports["default"] = Word;

package/lib/index.d.ts

@@ -0,0 +1,6 @@
+import Word from './Word';
+export { Word };
+declare const _default: {
+    Word: typeof Word;
+};
+export default _default;

package/lib/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Word = require('./Word.js');
+
+var index = { Word: Word["default"] };
+
+exports.Word = Word["default"];
+exports["default"] = index;

package/lib/node_modules/tslib/tslib.es6.js

@@ -0,0 +1,129 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise */
+
+var extendStatics = function(d, b) {
+    extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+    return extendStatics(d, b);
+};
+
+function __extends(d, b) {
+    if (typeof b !== "function" && b !== null)
+        throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+    extendStatics(d, b);
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+}
+
+exports.__assign = function() {
+    exports.__assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return exports.__assign.apply(this, arguments);
+};
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
+function __generator(thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+}
+
+function __values(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+}
+
+function __read(o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+}
+
+function __spreadArray(to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+}
+
+exports.__awaiter = __awaiter;
+exports.__extends = __extends;
+exports.__generator = __generator;
+exports.__read = __read;
+exports.__spreadArray = __spreadArray;
+exports.__values = __values;

package/lib/openxml/ContentType.d.ts

@@ -0,0 +1,12 @@
+interface Override {
+    partName: string;
+    contentType: string;
+}
+export interface ContentTypes {
+    overrides: Override[];
+}
+/**
+ * 解析 [Content_Types].xml
+ */
+export declare function parseContentType(doc: Document): ContentTypes;
+export {};

package/lib/openxml/ContentType.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/**
+ * 解析 [Content_Types].xml
+ */
+function parseContentType(doc) {
+    var types = { overrides: [] };
+    doc.querySelectorAll('Override').forEach(function (item) {
+        types.overrides.push({
+            partName: item.getAttribute('PartName'),
+            contentType: item.getAttribute('ContentType')
+        });
+    });
+    return types;
+}
+
+exports.parseContentType = parseContentType;

package/lib/openxml/Style.d.ts

@@ -0,0 +1,41 @@
+/**
+ * 解析共享样式 Style
+ */
+import Word from '../Word';
+import { ST_StyleType, ST_TblStyleOverrideType } from './Types';
+import { ParagraphPr } from './word/Paragraph';
+import { RunPr } from './word/Run';
+import { TablePr } from './word/Table';
+import { TcPr } from './word/table/Tc';
+import { TrPr } from './word/table/Tr';
+export interface CSSStyle {
+    [key: string]: string;
+}
+export interface TblStylePrStyle {
+    rPr?: RunPr;
+    pPr?: ParagraphPr;
+    tblPr?: TablePr;
+    trPr?: TrPr;
+    tcPr?: TcPr;
+}
+/**
+ * 单个样式定义
+ */
+export interface Style extends TblStylePrStyle {
+    id?: string;
+    type?: ST_StyleType;
+    name?: string;
+    basedOn?: string;
+    tblStylePr?: Record<ST_TblStyleOverrideType, TblStylePrStyle>;
+}
+/**
+ * 所有样式定义及默认样式
+ */
+export interface Styles {
+    styleMap: Record<string, Style>;
+    defaultStyle?: Style;
+}
+/**
+ * 解析 styles.xml
+ */
+export declare function parseStyles(word: Word, doc: Document): Styles;