Novelty Palliates Malaise

    @toast-ui/editor-plugin-uml
    TypeScript icon, indicating that this package has built-in type declarations

    3.0.1 • Public • Published

    TOAST UI Editor : UML Plugin

    This is a plugin of TOAST UI Editor to render UML.

    npm version

    uml

    🚩 Table of Contents

    📁 Bundle File Structure

    Files Distributed on npm

    - node_modules/
      - @toast-ui/
        - editor-plugin-uml/
          - dist/
            - toastui-editor-plugin-uml.js
    

    Files Distributed on CDN

    The bundle files include all dependencies of this plugin.

    - uicdn.toast.com/
      - editor-plugin-uml/
        - latest/
          - toastui-editor-plugin-uml.js
          - toastui-editor-plugin-uml.min.js
    

    📦 Usage npm

    To use the plugin, @toast-ui/editor must be installed.

    Ref. Getting Started

    Install

    $ npm install @toast-ui/editor-plugin-uml

    Import Plugin

    ES Modules

    import uml from '@toast-ui/editor-plugin-uml';

    CommonJS

    const uml = require('@toast-ui/editor-plugin-uml');

    Create Instance

    Basic

    import Editor from '@toast-ui/editor';
    import uml from '@toast-ui/editor-plugin-uml';
    
    const editor = new Editor({
      // ...
      plugins: [uml]
    });

    With Viewer

    import Viewer from '@toast-ui/editor/dist/toustui-editor-viewer';
    import uml from '@toast-ui/editor-plugin-uml';
    
    const viewer = new Viewer({
      // ...
      plugins: [uml]
    });

    or

    import Editor from '@toast-ui/editor';
    import uml from '@toast-ui/editor-plugin-uml';
    
    const viewer = Editor.factory({
      // ...
      plugins: [uml],
      viewer: true
    });

    🗂 Usage CDN

    To use the plugin, the CDN files(CSS, Script) of @toast-ui/editor must be included.

    Include Files

    ...
    <body>
      ...
      <!-- Editor -->
      <script src="https://uicdn.toast.com/editor/latest/toastui-editor-all.min.js"></script>
      <!-- Editor's Plugin -->
      <script src="https://uicdn.toast.com/editor-plugin-uml/latest/toastui-editor-plugin-uml.min.js"></script>
      ...
    </body>
    ...

    Create Instance

    Basic

    const { Editor } = toastui;
    const { uml } = Editor.plugin;
    
    const editor = new Editor({
      // ...
      plugins: [uml]
    });

    With Viewer

    const Viewer = toastui.Editor;
    const { uml } = Viewer.plugin;
    
    const viewer = new Viewer({
      // ...
      plugins: [uml]
    });

    or

    const { Editor } = toastui;
    const { uml } = Editor.plugin;
    
    const viewer = Editor.factory({
      // ...
      plugins: [uml],
      viewer: true
    });

    [Optional] Use Plugin with Options

    The uml plugin can set options when used. Just add the plugin function and options related to the plugin to the array([pluginFn, pluginOptions]) and push them to the plugins option of the editor.

    The following option is available in the uml plugin.

    Name Type Default Value Description
    rendererURL string 'http://www.plantuml.com/plantuml/png/' URL of plant uml renderer
    // ...
    
    import Editor from '@toast-ui/editor';
    import uml from '@toast-ui/editor-plugin-uml';
    
    const umlOptions = {
      rendererURL: // ...
    };
    
    const editor = new Editor({
      // ...
      plugins: [[uml, umlOptions]]
    });

    Install

    npm i @toast-ui/editor-plugin-uml

    Homepage

    ui.toast.com

    DownloadsWeekly Downloads

    539

    Version

    3.0.1

    License

    MIT

    Unpacked Size

    10.7 kB

    Total Files

    4

    Last publish

    Collaborators

    • nhnent
    • codepink