examples/text-editor.svg

<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" contentScriptType="application/ecmascript" contentStyleType="text/css" height="601px" preserveAspectRatio="none" style="width:552px;height:601px;" version="1.1" viewBox="0 0 552 601" width="552px" zoomAndPan="magnify"><defs><filter height="300%" id="fbe5jqjre1r7r" width="300%" x="-1" y="-1"><feGaussianBlur result="blurOut" stdDeviation="2.0"/><feColorMatrix in="blurOut" result="blurOut2" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .4 0"/><feOffset dx="4.0" dy="4.0" in="blurOut2" result="blurOut3"/><feBlend in="SourceGraphic" in2="blurOut3" mode="normal"/></filter></defs><g><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="582.4883" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="534" x="6" y="8"/><rect fill="#FFFFFF" height="550" rx="12.5" ry="12.5" style="stroke: #FFFFFF; stroke-width: 1.0;" width="528" x="9" y="37.4883"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="6" x2="540" y1="34.4883" y2="34.4883"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="68" x="239" y="26.5352">textEditor</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="104.4883" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="330" x="97" y="471.4883"/><rect fill="#FFFFFF" height="72" rx="12.5" ry="12.5" style="stroke: #FFFFFF; stroke-width: 1.0;" width="324" x="100" y="500.9766"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="97" x2="427" y1="497.9766" y2="497.9766"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="31" x="246.5" y="490.0234">bold</text><ellipse cx="118" cy="535.574" fill="#000000" filter="url(#fbe5jqjre1r7r)" rx="10" ry="10" style="stroke: none; stroke-width: 1.0;"/><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="344" y="510.574"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="344" x2="394" y1="537.0622" y2="537.0622"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="18" x="360" y="529.1091">on</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="165" y="510.574"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="165" x2="215" y1="537.0622" y2="537.0622"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="19" x="180.5" y="529.1091">off</text><!--link *start*textEditor.bold to textEditor.bold.off--><path d="M128.0113,535.574 C136.2543,535.574 148.3897,535.574 159.7429,535.574 " fill="none" id="*start*textEditor.bold-textEditor.bold.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="164.8874,535.574,155.8874,531.574,159.8874,535.574,155.8874,539.574,164.8874,535.574" style="stroke: #A80036; stroke-width: 1.0;"/><!--link textEditor.bold.on to textEditor.bold.off--><path d="M343.662,548.8377 C337.9953,551.2128 331.9093,553.3266 326,554.574 C285.5578,563.1108 273.4422,563.1108 233,554.574 C228.7527,553.6775 224.4141,552.3333 220.2055,550.7662 " fill="none" id="textEditor.bold.on-textEditor.bold.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="215.338,548.8377,222.2316,555.8717,219.9864,550.6795,225.1786,548.4343,215.338,548.8377" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="91" x="234" y="551.1423">TOGGLE_BOLD</text><!--link textEditor.bold.off to textEditor.bold.on--><path d="M215.2667,535.574 C247.6493,535.574 303.7434,535.574 338.4775,535.574 " fill="none" id="textEditor.bold.off-textEditor.bold.on" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="343.8619,535.574,334.8619,531.574,338.8619,535.574,334.8619,539.574,343.8619,535.574" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="91" x="234" y="532.1423">TOGGLE_BOLD</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="107.4883" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="368" x="78" y="345.9883"/><rect fill="#FFFFFF" height="75" rx="12.5" ry="12.5" style="stroke: #FFFFFF; stroke-width: 1.0;" width="362" x="81" y="375.4766"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="78" x2="446" y1="372.4766" y2="372.4766"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="66" x="229" y="364.5234">underline</text><ellipse cx="99" cy="410.4579" fill="#000000" filter="url(#fbe5jqjre1r7r)" rx="10" ry="10" style="stroke: none; stroke-width: 1.0;"/><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="363" y="385.4579"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="363" x2="413" y1="411.9461" y2="411.9461"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="18" x="379" y="403.993">on</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="146" y="385.4579"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="146" x2="196" y1="411.9461" y2="411.9461"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="19" x="161.5" y="403.993">off</text><!--link *start*textEditor.underline to textEditor.underline.off--><path d="M109.0113,410.4579 C117.2543,410.4579 129.3897,410.4579 140.7429,410.4579 " fill="none" id="*start*textEditor.underline-textEditor.underline.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="145.8874,410.4579,136.8874,406.4579,140.8874,410.4579,136.8874,414.4579,145.8874,410.4579" style="stroke: #A80036; stroke-width: 1.0;"/><!--link textEditor.underline.on to textEditor.underline.off--><path d="M362.662,423.7216 C356.9953,426.0967 350.9093,428.2105 345,429.4579 C288.0331,441.4828 270.9669,441.4828 214,429.4579 C209.7527,428.5614 205.4141,427.2172 201.2055,425.6501 " fill="none" id="textEditor.underline.on-textEditor.underline.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="196.338,423.7216,203.2316,430.7556,200.9864,425.5634,206.1786,423.3182,196.338,423.7216" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="129" x="215" y="426.0262">TOGGLE_UNDERLINE</text><!--link textEditor.underline.off to textEditor.underline.on--><path d="M196.3174,410.4579 C236.4977,410.4579 314.7145,410.4579 357.7722,410.4579 " fill="none" id="textEditor.underline.off-textEditor.underline.on" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="362.8439,410.4579,353.8439,406.4579,357.8439,410.4579,353.8439,414.4579,362.8439,410.4579" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="129" x="215" y="407.0262">TOGGLE_UNDERLINE</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="105.4883" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="344" x="90" y="222.9883"/><rect fill="#FFFFFF" height="73" rx="12.5" ry="12.5" style="stroke: #FFFFFF; stroke-width: 1.0;" width="338" x="93" y="252.4766"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="90" x2="434" y1="249.4766" y2="249.4766"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="39" x="242.5" y="241.5234">italics</text><ellipse cx="111" cy="287.1102" fill="#000000" filter="url(#fbe5jqjre1r7r)" rx="10" ry="10" style="stroke: none; stroke-width: 1.0;"/><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="351" y="262.1102"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="351" x2="401" y1="288.5984" y2="288.5984"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="18" x="367" y="280.6453">on</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="50" x="158" y="262.1102"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="158" x2="208" y1="288.5984" y2="288.5984"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="19" x="173.5" y="280.6453">off</text><!--link *start*textEditor.italics to textEditor.italics.off--><path d="M121.0113,287.1102 C129.2543,287.1102 141.3897,287.1102 152.7429,287.1102 " fill="none" id="*start*textEditor.italics-textEditor.italics.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="157.8874,287.1102,148.8874,283.1102,152.8874,287.1102,148.8874,291.1102,157.8874,287.1102" style="stroke: #A80036; stroke-width: 1.0;"/><!--link textEditor.italics.on to textEditor.italics.off--><path d="M350.662,300.3739 C344.9953,302.749 338.9093,304.8628 333,306.1102 C286.4698,315.9321 272.5302,315.9321 226,306.1102 C221.7527,305.2136 217.4141,303.8695 213.2055,302.3024 " fill="none" id="textEditor.italics.on-textEditor.italics.off" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="208.338,300.3739,215.2316,307.4079,212.9864,302.2157,218.1786,299.9705,208.338,300.3739" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="105" x="227" y="302.6785">TOGGLE_ITALICS</text><!--link textEditor.italics.off to textEditor.italics.on--><path d="M208.2314,287.1102 C243.4859,287.1102 307.4133,287.1102 345.3589,287.1102 " fill="none" id="textEditor.italics.off-textEditor.italics.on" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="350.7624,287.1102,341.7624,283.1102,345.7624,287.1102,341.7624,291.1102,350.7624,287.1102" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="105" x="227" y="283.6785">TOGGLE_ITALICS</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="157.4883" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="490" x="17" y="47.9883"/><rect fill="#FFFFFF" height="125" rx="12.5" ry="12.5" style="stroke: #FFFFFF; stroke-width: 1.0;" width="484" x="20" y="77.4766"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="17" x2="507" y1="74.4766" y2="74.4766"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="20" x="252" y="66.5234">list</text><ellipse cx="38" cy="163.5757" fill="#000000" filter="url(#fbe5jqjre1r7r)" rx="10" ry="10" style="stroke: none; stroke-width: 1.0;"/><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="55" x="85" y="138.5757"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="85" x2="140" y1="165.0639" y2="165.0639"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="35" x="95" y="157.1108">none</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="66" x="230" y="87.5757"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="230" x2="296" y1="114.0639" y2="114.0639"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="46" x="240" y="106.1108">bullets</text><rect fill="#FEFECE" filter="url(#fbe5jqjre1r7r)" height="50" rx="12.5" ry="12.5" style="stroke: #A80036; stroke-width: 1.5;" width="81" x="393" y="138.5757"/><line style="stroke: #A80036; stroke-width: 1.5;" x1="393" x2="474" y1="165.0639" y2="165.0639"/><text fill="#000000" font-family="sans-serif" font-size="14" lengthAdjust="spacingAndGlyphs" textLength="61" x="403" y="157.1108">numbers</text><!--link *start*textEditor.list to textEditor.list.none--><path d="M48.0474,163.5757 C56.1758,163.5757 68.104,163.5757 79.4956,163.5757 " fill="none" id="*start*textEditor.list-textEditor.list.none" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="84.6762,163.5757,75.6762,159.5757,79.6762,163.5757,75.6762,167.5757,84.6762,163.5757" style="stroke: #A80036; stroke-width: 1.0;"/><!--link textEditor.list.none to textEditor.list.bullets--><path d="M140.4897,138.6226 C145.9961,134.7352 151.9505,131.158 158,128.5757 C178.9497,119.6328 204.1303,115.595 224.5803,113.8108 " fill="none" id="textEditor.list.none-textEditor.list.bullets" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="229.6722,113.4041,220.3823,110.1334,224.6881,113.8022,221.0193,118.108,229.6722,113.4041" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="52" x="159" y="112.144">BULLETS</text><!--link textEditor.list.none to textEditor.list.numbers--><path d="M140.4062,164.9963 C146.2192,165.2377 152.3084,165.4506 158,165.5757 C254.4212,167.6938 278.5696,167.2236 375,165.5757 C379.1627,165.5045 383.4913,165.4049 387.8261,165.2878 " fill="none" id="textEditor.list.none-textEditor.list.numbers" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="392.908,165.1429,383.7975,161.4014,387.91,165.2856,384.0258,169.3981,392.908,165.1429" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="59" x="233.5" y="164.144">NUMBERS</text><!--link textEditor.list.bullets to textEditor.list.none--><path d="M233.4274,137.6829 C226.7334,142.2931 219.4047,146.5862 212,149.5757 C190.7659,158.1482 165.1463,161.6104 145.2219,162.949 " fill="none" id="textEditor.list.bullets-textEditor.list.none" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="140.0241,163.2591,149.2464,166.7158,145.0152,162.9612,148.7698,158.73,140.0241,163.2591" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="37" x="166.5" y="146.144">NONE</text><!--link textEditor.list.bullets to textEditor.list.numbers--><path d="M296.166,113.8698 C318.9008,115.5806 349.4507,119.5227 375,128.5757 C380.665,130.5829 386.3843,133.1711 391.9137,136.0306 " fill="none" id="textEditor.list.bullets-textEditor.list.numbers" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="396.5082,138.4897,390.4607,130.7161,392.0999,136.1303,386.6857,137.7695,396.5082,138.4897" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="59" x="315" y="113.144">NUMBERS</text><!--link textEditor.list.numbers to textEditor.list.bullets--><path d="M392.9835,163.8914 C369.2493,162.8515 339.1018,159.3732 314,149.5757 C307.991,147.2303 302.0442,144.0022 296.4499,140.4225 " fill="none" id="textEditor.list.numbers-textEditor.list.bullets" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="292.2454,137.6253,297.523,145.9407,296.4083,140.3948,301.9542,139.2801,292.2454,137.6253" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="52" x="318.5" y="146.144">BULLETS</text><!--link textEditor.list.numbers to textEditor.list.none--><path d="M392.621,174.0868 C351.5641,183.3494 286.4632,194.5159 230,188.5757 C200.9539,185.5198 168.5252,178.3263 145.1064,172.4363 " fill="none" id="textEditor.list.numbers-textEditor.list.none" style="stroke: #A80036; stroke-width: 1.0;"/><polygon fill="#A80036" points="140.2503,171.2012,147.9867,177.2961,145.096,172.4336,149.9586,169.543,140.2503,171.2012" style="stroke: #A80036; stroke-width: 1.0;"/><text fill="#000000" font-family="sans-serif" font-size="13" lengthAdjust="spacingAndGlyphs" textLength="37" x="244.5" y="185.144">NONE</text><!--
@startuml
left to right direction
state "textEditor" as textEditor {
  state "bold" as textEditor.bold {
    [*] - -> textEditor.bold.off

    state "on" as textEditor.bold.on {
      textEditor.bold.on - -> textEditor.bold.off : TOGGLE_BOLD
    }

    state "off" as textEditor.bold.off {
      textEditor.bold.off - -> textEditor.bold.on : TOGGLE_BOLD
    }
  }

  state "underline" as textEditor.underline {
    [*] - -> textEditor.underline.off

    state "on" as textEditor.underline.on {
      textEditor.underline.on - -> textEditor.underline.off : TOGGLE_UNDERLINE
    }

    state "off" as textEditor.underline.off {
      textEditor.underline.off - -> textEditor.underline.on : TOGGLE_UNDERLINE
    }
  }

  state "italics" as textEditor.italics {
    [*] - -> textEditor.italics.off

    state "on" as textEditor.italics.on {
      textEditor.italics.on - -> textEditor.italics.off : TOGGLE_ITALICS
    }

    state "off" as textEditor.italics.off {
      textEditor.italics.off - -> textEditor.italics.on : TOGGLE_ITALICS
    }
  }

  state "list" as textEditor.list {
    [*] - -> textEditor.list.none

    state "none" as textEditor.list.none {
      textEditor.list.none - -> textEditor.list.bullets : BULLETS
      textEditor.list.none - -> textEditor.list.numbers : NUMBERS
    }

    state "bullets" as textEditor.list.bullets {
      textEditor.list.bullets - -> textEditor.list.none : NONE
      textEditor.list.bullets - -> textEditor.list.numbers : NUMBERS
    }

    state "numbers" as textEditor.list.numbers {
      textEditor.list.numbers - -> textEditor.list.bullets : BULLETS
      textEditor.list.numbers - -> textEditor.list.none : NONE
    }
  }
}
@enduml

PlantUML version 1.2018.09(Fri Jul 27 18:58:18 CEST 2018)
(GPL source distribution)
Java Runtime: Java(TM) SE Runtime Environment
JVM: Java HotSpot(TM) 64-Bit Server VM
Java Version: 1.8.0_91-b14
Operating System: Mac OS X
OS Version: 10.13.1
Default Encoding: UTF-8
Language: en
Country: US
--></g></svg>