From cc32dafada8bc79f8a5a03a7f76f54e4c0e2dc00 Mon Sep 17 00:00:00 2001
From: Muthu Kumar <muthukumar@thefeathers.in>
Date: Wed, 22 Feb 2023 02:41:25 +0530
Subject: [PATCH 1/3] feat(proposal): cli-args

---
 assets/cli-railroad/diagram/Alphanumeric.svg  |  47 ++++
 assets/cli-railroad/diagram/Char.svg          |  53 +++++
 assets/cli-railroad/diagram/CmdIdentifier.svg |  45 ++++
 assets/cli-railroad/diagram/Command.svg       |  59 +++++
 .../cli-railroad/diagram/LongFlagOption.svg   |  53 +++++
 assets/cli-railroad/diagram/LongOption.svg    |  52 +++++
 .../cli-railroad/diagram/LongValueOption.svg  |  67 ++++++
 assets/cli-railroad/diagram/Operand.svg       |  44 ++++
 assets/cli-railroad/diagram/Option.svg        |  52 +++++
 .../diagram/OptionValueDelimiter.svg          |  53 +++++
 .../cli-railroad/diagram/ShortFlagOption.svg  |  53 +++++
 assets/cli-railroad/diagram/ShortOption.svg   |  52 +++++
 .../cli-railroad/diagram/ShortValueOption.svg |  67 ++++++
 assets/cli-railroad/diagram/Space.svg         |  46 ++++
 assets/cli-railroad/diagram/Value.svg         |  75 +++++++
 assets/cli-railroad/diagram/rr-2.0.svg        |  57 +++++
 assets/cli-railroad/index.md                  | 204 ++++++++++++++++++
 cli-args.md                                   |  88 ++++++++
 18 files changed, 1167 insertions(+)
 create mode 100644 assets/cli-railroad/diagram/Alphanumeric.svg
 create mode 100644 assets/cli-railroad/diagram/Char.svg
 create mode 100644 assets/cli-railroad/diagram/CmdIdentifier.svg
 create mode 100644 assets/cli-railroad/diagram/Command.svg
 create mode 100644 assets/cli-railroad/diagram/LongFlagOption.svg
 create mode 100644 assets/cli-railroad/diagram/LongOption.svg
 create mode 100644 assets/cli-railroad/diagram/LongValueOption.svg
 create mode 100644 assets/cli-railroad/diagram/Operand.svg
 create mode 100644 assets/cli-railroad/diagram/Option.svg
 create mode 100644 assets/cli-railroad/diagram/OptionValueDelimiter.svg
 create mode 100644 assets/cli-railroad/diagram/ShortFlagOption.svg
 create mode 100644 assets/cli-railroad/diagram/ShortOption.svg
 create mode 100644 assets/cli-railroad/diagram/ShortValueOption.svg
 create mode 100644 assets/cli-railroad/diagram/Space.svg
 create mode 100644 assets/cli-railroad/diagram/Value.svg
 create mode 100644 assets/cli-railroad/diagram/rr-2.0.svg
 create mode 100644 assets/cli-railroad/index.md
 create mode 100644 cli-args.md

diff --git a/assets/cli-railroad/diagram/Alphanumeric.svg b/assets/cli-railroad/diagram/Alphanumeric.svg
new file mode 100644
index 0000000..0f629e8
--- /dev/null
+++ b/assets/cli-railroad/diagram/Alphanumeric.svg
@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="161" height="125">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <polygon points="51 19 58 3 106 3 113 19 106 35 58 35"/>
+   <polygon points="49 17 56 1 104 1 111 17 104 33 56 33" class="regexp"/>
+   <text class="regexp" x="64" y="21">[0-9]</text>
+   <polygon points="51 63 58 47 104 47 111 63 104 79 58 79"/>
+   <polygon points="49 61 56 45 102 45 109 61 102 77 56 77" class="regexp"/>
+   <text class="regexp" x="64" y="65">[a-z]</text>
+   <polygon points="51 107 58 91 106 91 113 107 106 123 58 123"/>
+   <polygon points="49 105 56 89 104 89 111 105 104 121 56 121" class="regexp"/>
+   <text class="regexp" x="64" y="109">[A-Z]</text>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m62 0 h10 m-102 0 h20 m82 0 h20 m-122 0 q10 0 10 10 m102 0 q0 -10 10 -10 m-112 10 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m60 0 h10 m0 0 h2 m-92 -10 v20 m102 0 v-20 m-102 20 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m62 0 h10 m23 -88 h-3"/>
+   <polygon points="151 17 159 13 159 21"/>
+   <polygon points="151 17 143 13 143 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Char.svg b/assets/cli-railroad/diagram/Char.svg
new file mode 100644
index 0000000..3302916
--- /dev/null
+++ b/assets/cli-railroad/diagram/Char.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="301" height="81">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#UnicodeExceptDoubleQuotes"
+       xlink:title="UnicodeExceptDoubleQuotes">
+      <rect x="51" y="3" width="202" height="32"/>
+      <rect x="49" y="1" width="202" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">UnicodeExceptDoubleQuotes</text>
+   </a>
+   <rect x="51" y="47" width="34" height="32" rx="10"/>
+   <rect x="49"
+          y="45"
+          width="34"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="65">\"</text>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m202 0 h10 m-242 0 h20 m222 0 h20 m-262 0 q10 0 10 10 m242 0 q0 -10 10 -10 m-252 10 v24 m242 0 v-24 m-242 24 q0 10 10 10 m222 0 q10 0 10 -10 m-232 10 h10 m34 0 h10 m0 0 h168 m23 -44 h-3"/>
+   <polygon points="291 17 299 13 299 21"/>
+   <polygon points="291 17 283 13 283 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/CmdIdentifier.svg b/assets/cli-railroad/diagram/CmdIdentifier.svg
new file mode 100644
index 0000000..10ea49f
--- /dev/null
+++ b/assets/cli-railroad/diagram/CmdIdentifier.svg
@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="205" height="57">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Alphanumeric"
+       xlink:title="Alphanumeric">
+      <rect x="51" y="3" width="106" height="32"/>
+      <rect x="49" y="1" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">Alphanumeric</text>
+   </a>
+   <path class="line"
+          d="m17 51 h2 m20 0 h10 m0 0 h116 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m126 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-126 0 h10 m106 0 h10 m23 34 h-3"/>
+   <polygon points="195 51 203 47 203 55"/>
+   <polygon points="195 51 187 47 187 55"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Command.svg b/assets/cli-railroad/diagram/Command.svg
new file mode 100644
index 0000000..cd7bec8
--- /dev/null
+++ b/assets/cli-railroad/diagram/Command.svg
@@ -0,0 +1,59 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="421" height="71">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#CmdIdentifier"
+       xlink:title="CmdIdentifier">
+      <rect x="31" y="37" width="106" height="32"/>
+      <rect x="29" y="35" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="39" y="55">CmdIdentifier</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Option"
+       xlink:title="Option">
+      <rect x="177" y="3" width="62" height="32"/>
+      <rect x="175" y="1" width="62" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="185" y="21">Option</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Operand"
+       xlink:title="Operand">
+      <rect x="299" y="3" width="74" height="32"/>
+      <rect x="297" y="1" width="74" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="307" y="21">Operand</text>
+   </a>
+   <path class="line"
+          d="m17 51 h2 m0 0 h10 m106 0 h10 m20 0 h10 m0 0 h72 m-102 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m82 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-82 0 h10 m62 0 h10 m40 34 h10 m0 0 h84 m-114 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m94 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-94 0 h10 m74 0 h10 m23 34 h-3"/>
+   <polygon points="411 51 419 47 419 55"/>
+   <polygon points="411 51 403 47 403 55"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/LongFlagOption.svg b/assets/cli-railroad/diagram/LongFlagOption.svg
new file mode 100644
index 0000000..70d6c87
--- /dev/null
+++ b/assets/cli-railroad/diagram/LongFlagOption.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="257" height="53">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 33 1 29 1 37"/>
+   <polygon points="17 33 9 29 9 37"/>
+   <rect x="31" y="19" width="32" height="32" rx="10"/>
+   <rect x="29"
+          y="17"
+          width="32"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="39" y="37">--</text>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Alphanumeric"
+       xlink:title="Alphanumeric">
+      <rect x="103" y="19" width="106" height="32"/>
+      <rect x="101" y="17" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="111" y="37">Alphanumeric</text>
+   </a>
+   <path class="line"
+          d="m17 33 h2 m0 0 h10 m32 0 h10 m20 0 h10 m106 0 h10 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m126 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-126 0 h10 m0 0 h116 m23 32 h-3"/>
+   <polygon points="247 33 255 29 255 37"/>
+   <polygon points="247 33 239 29 239 37"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/LongOption.svg b/assets/cli-railroad/diagram/LongOption.svg
new file mode 100644
index 0000000..8ffc45c
--- /dev/null
+++ b/assets/cli-railroad/diagram/LongOption.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="227" height="81">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#LongFlagOption"
+       xlink:title="LongFlagOption">
+      <rect x="51" y="3" width="118" height="32"/>
+      <rect x="49" y="1" width="118" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">LongFlagOption</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#LongValueOption"
+       xlink:title="LongValueOption">
+      <rect x="51" y="47" width="128" height="32"/>
+      <rect x="49" y="45" width="128" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="65">LongValueOption</text>
+   </a>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m118 0 h10 m0 0 h10 m-168 0 h20 m148 0 h20 m-188 0 q10 0 10 10 m168 0 q0 -10 10 -10 m-178 10 v24 m168 0 v-24 m-168 24 q0 10 10 10 m148 0 q10 0 10 -10 m-158 10 h10 m128 0 h10 m23 -44 h-3"/>
+   <polygon points="217 17 225 13 225 21"/>
+   <polygon points="217 17 209 13 209 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/LongValueOption.svg b/assets/cli-railroad/diagram/LongValueOption.svg
new file mode 100644
index 0000000..b259028
--- /dev/null
+++ b/assets/cli-railroad/diagram/LongValueOption.svg
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="507" height="53">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 33 1 29 1 37"/>
+   <polygon points="17 33 9 29 9 37"/>
+   <rect x="31" y="19" width="32" height="32" rx="10"/>
+   <rect x="29"
+          y="17"
+          width="32"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="39" y="37">--</text>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Alphanumeric"
+       xlink:title="Alphanumeric">
+      <rect x="103" y="19" width="106" height="32"/>
+      <rect x="101" y="17" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="111" y="37">Alphanumeric</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#OptionValueDelimiter"
+       xlink:title="OptionValueDelimiter">
+      <rect x="249" y="19" width="154" height="32"/>
+      <rect x="247" y="17" width="154" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="257" y="37">OptionValueDelimiter</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Value"
+       xlink:title="Value">
+      <rect x="423" y="19" width="56" height="32"/>
+      <rect x="421" y="17" width="56" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="431" y="37">Value</text>
+   </a>
+   <path class="line"
+          d="m17 33 h2 m0 0 h10 m32 0 h10 m20 0 h10 m106 0 h10 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m126 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-126 0 h10 m0 0 h116 m20 32 h10 m154 0 h10 m0 0 h10 m56 0 h10 m3 0 h-3"/>
+   <polygon points="497 33 505 29 505 37"/>
+   <polygon points="497 33 489 29 489 37"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Operand.svg b/assets/cli-railroad/diagram/Operand.svg
new file mode 100644
index 0000000..cb8c835
--- /dev/null
+++ b/assets/cli-railroad/diagram/Operand.svg
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="115" height="37">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Value"
+       xlink:title="Value">
+      <rect x="31" y="3" width="56" height="32"/>
+      <rect x="29" y="1" width="56" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="39" y="21">Value</text>
+   </a>
+   <path class="line" d="m17 17 h2 m0 0 h10 m56 0 h10 m3 0 h-3"/>
+   <polygon points="105 17 113 13 113 21"/>
+   <polygon points="105 17 97 13 97 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Option.svg b/assets/cli-railroad/diagram/Option.svg
new file mode 100644
index 0000000..a826d03
--- /dev/null
+++ b/assets/cli-railroad/diagram/Option.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="195" height="81">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#ShortOption"
+       xlink:title="ShortOption">
+      <rect x="51" y="3" width="96" height="32"/>
+      <rect x="49" y="1" width="96" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">ShortOption</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#LongOption"
+       xlink:title="LongOption">
+      <rect x="51" y="47" width="92" height="32"/>
+      <rect x="49" y="45" width="92" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="65">LongOption</text>
+   </a>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m96 0 h10 m-136 0 h20 m116 0 h20 m-156 0 q10 0 10 10 m136 0 q0 -10 10 -10 m-146 10 v24 m136 0 v-24 m-136 24 q0 10 10 10 m116 0 q10 0 10 -10 m-126 10 h10 m92 0 h10 m0 0 h4 m23 -44 h-3"/>
+   <polygon points="185 17 193 13 193 21"/>
+   <polygon points="185 17 177 13 177 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/OptionValueDelimiter.svg b/assets/cli-railroad/diagram/OptionValueDelimiter.svg
new file mode 100644
index 0000000..2597f51
--- /dev/null
+++ b/assets/cli-railroad/diagram/OptionValueDelimiter.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="157" height="81">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Space"
+       xlink:title="Space">
+      <rect x="51" y="3" width="58" height="32"/>
+      <rect x="49" y="1" width="58" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">Space</text>
+   </a>
+   <rect x="51" y="47" width="30" height="32" rx="10"/>
+   <rect x="49"
+          y="45"
+          width="30"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="65">=</text>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m58 0 h10 m-98 0 h20 m78 0 h20 m-118 0 q10 0 10 10 m98 0 q0 -10 10 -10 m-108 10 v24 m98 0 v-24 m-98 24 q0 10 10 10 m78 0 q10 0 10 -10 m-88 10 h10 m30 0 h10 m0 0 h28 m23 -44 h-3"/>
+   <polygon points="147 17 155 13 155 21"/>
+   <polygon points="147 17 139 13 139 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/ShortFlagOption.svg b/assets/cli-railroad/diagram/ShortFlagOption.svg
new file mode 100644
index 0000000..300cccd
--- /dev/null
+++ b/assets/cli-railroad/diagram/ShortFlagOption.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="211" height="37">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <rect x="31" y="3" width="26" height="32" rx="10"/>
+   <rect x="29"
+          y="1"
+          width="26"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="39" y="21">-</text>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Alphanumeric"
+       xlink:title="Alphanumeric">
+      <rect x="77" y="3" width="106" height="32"/>
+      <rect x="75" y="1" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="85" y="21">Alphanumeric</text>
+   </a>
+   <path class="line"
+          d="m17 17 h2 m0 0 h10 m26 0 h10 m0 0 h10 m106 0 h10 m3 0 h-3"/>
+   <polygon points="201 17 209 13 209 21"/>
+   <polygon points="201 17 193 13 193 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/ShortOption.svg b/assets/cli-railroad/diagram/ShortOption.svg
new file mode 100644
index 0000000..3a997f6
--- /dev/null
+++ b/assets/cli-railroad/diagram/ShortOption.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="229" height="81">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#ShortFlagOption"
+       xlink:title="ShortFlagOption">
+      <rect x="51" y="3" width="122" height="32"/>
+      <rect x="49" y="1" width="122" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">ShortFlagOption</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#ShortValueOption"
+       xlink:title="ShortValueOption">
+      <rect x="51" y="47" width="130" height="32"/>
+      <rect x="49" y="45" width="130" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="65">ShortValueOption</text>
+   </a>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m122 0 h10 m0 0 h8 m-170 0 h20 m150 0 h20 m-190 0 q10 0 10 10 m170 0 q0 -10 10 -10 m-180 10 v24 m170 0 v-24 m-170 24 q0 10 10 10 m150 0 q10 0 10 -10 m-160 10 h10 m130 0 h10 m23 -44 h-3"/>
+   <polygon points="219 17 227 13 227 21"/>
+   <polygon points="219 17 211 13 211 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/ShortValueOption.svg b/assets/cli-railroad/diagram/ShortValueOption.svg
new file mode 100644
index 0000000..dbe1f24
--- /dev/null
+++ b/assets/cli-railroad/diagram/ShortValueOption.svg
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="461" height="37">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <rect x="31" y="3" width="26" height="32" rx="10"/>
+   <rect x="29"
+          y="1"
+          width="26"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="39" y="21">-</text>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Alphanumeric"
+       xlink:title="Alphanumeric">
+      <rect x="77" y="3" width="106" height="32"/>
+      <rect x="75" y="1" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="85" y="21">Alphanumeric</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#OptionValueDelimiter"
+       xlink:title="OptionValueDelimiter">
+      <rect x="203" y="3" width="154" height="32"/>
+      <rect x="201" y="1" width="154" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="211" y="21">OptionValueDelimiter</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Value"
+       xlink:title="Value">
+      <rect x="377" y="3" width="56" height="32"/>
+      <rect x="375" y="1" width="56" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="385" y="21">Value</text>
+   </a>
+   <path class="line"
+          d="m17 17 h2 m0 0 h10 m26 0 h10 m0 0 h10 m106 0 h10 m0 0 h10 m154 0 h10 m0 0 h10 m56 0 h10 m3 0 h-3"/>
+   <polygon points="451 17 459 13 459 21"/>
+   <polygon points="451 17 443 13 443 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Space.svg b/assets/cli-railroad/diagram/Space.svg
new file mode 100644
index 0000000..ce1a49f
--- /dev/null
+++ b/assets/cli-railroad/diagram/Space.svg
@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="175" height="57">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <rect x="51" y="3" width="76" height="32" rx="10"/>
+   <rect x="49"
+          y="1"
+          width="76"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="21">U+0020</text>
+   <path class="line"
+          d="m17 51 h2 m20 0 h10 m0 0 h86 m-116 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m96 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-96 0 h10 m76 0 h10 m23 34 h-3"/>
+   <polygon points="165 51 173 47 173 55"/>
+   <polygon points="165 51 157 47 157 55"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/Value.svg b/assets/cli-railroad/diagram/Value.svg
new file mode 100644
index 0000000..d1475ba
--- /dev/null
+++ b/assets/cli-railroad/diagram/Value.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="369" height="179">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Char"
+       xlink:title="Char">
+      <rect x="71" y="3" width="50" height="32"/>
+      <rect x="69" y="1" width="50" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="79" y="21">Char</text>
+   </a>
+   <rect x="51" y="85" width="26" height="32" rx="10"/>
+   <rect x="49"
+          y="83"
+          width="26"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="103">"</text>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Char"
+       xlink:title="Char">
+      <rect x="157" y="85" width="50" height="32"/>
+      <rect x="155" y="83" width="50" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="165" y="103">Char</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Space"
+       xlink:title="Space">
+      <rect x="157" y="129" width="58" height="32"/>
+      <rect x="155" y="127" width="58" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="165" y="147">Space</text>
+   </a>
+   <rect x="295" y="85" width="26" height="32" rx="10"/>
+   <rect x="293"
+          y="83"
+          width="26"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="303" y="103">"</text>
+   <path class="line"
+          d="m17 51 h2 m40 0 h10 m0 0 h60 m-90 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m70 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-70 0 h10 m50 0 h10 m20 34 h180 m-310 0 h20 m290 0 h20 m-330 0 q10 0 10 10 m310 0 q0 -10 10 -10 m-320 10 v28 m310 0 v-28 m-310 28 q0 10 10 10 m290 0 q10 0 10 -10 m-300 10 h10 m26 0 h10 m60 0 h10 m50 0 h10 m0 0 h8 m-98 0 h20 m78 0 h20 m-118 0 q10 0 10 10 m98 0 q0 -10 10 -10 m-108 10 v24 m98 0 v-24 m-98 24 q0 10 10 10 m78 0 q10 0 10 -10 m-88 10 h10 m58 0 h10 m-118 -44 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m118 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-118 0 h10 m0 0 h108 m-158 32 h20 m158 0 h20 m-198 0 q10 0 10 10 m178 0 q0 -10 10 -10 m-188 10 v58 m178 0 v-58 m-178 58 q0 10 10 10 m158 0 q10 0 10 -10 m-168 10 h10 m0 0 h148 m20 -78 h10 m26 0 h10 m23 -48 h-3"/>
+   <polygon points="359 51 367 47 367 55"/>
+   <polygon points="359 51 351 47 351 55"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/rr-2.0.svg b/assets/cli-railroad/diagram/rr-2.0.svg
new file mode 100644
index 0000000..1de2f82
--- /dev/null
+++ b/assets/cli-railroad/diagram/rr-2.0.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <g transform="scale(0.178)">
+      <circle cx="45" cy="45" r="45" style="stroke:none; fill:#FFCC00"/>
+      <circle cx="45"
+               cy="45"
+               r="42"
+               style="stroke:#332900; stroke-width:2px; fill:#FFCC00"/>
+      <line x1="15"
+             y1="15"
+             x2="75"
+             y2="75"
+             stroke="#332900"
+             style="stroke-width:9px;"/>
+      <line x1="15"
+             y1="75"
+             x2="75"
+             y2="15"
+             stroke="#332900"
+             style="stroke-width:9px;"/>
+      <text x="7"
+             y="54"
+             style="font-size:26px; font-family:Arial, Sans-serif; font-weight:bold; fill: #332900">R</text>
+      <text x="64"
+             y="54"
+             style="font-size:26px; font-family:Arial, Sans-serif; font-weight:bold; fill: #332900">R</text>
+   </g>
+</svg>
diff --git a/assets/cli-railroad/index.md b/assets/cli-railroad/index.md
new file mode 100644
index 0000000..4430268
--- /dev/null
+++ b/assets/cli-railroad/index.md
@@ -0,0 +1,204 @@
+**Command:**
+
+![Command](diagram/Command.svg)
+
+```
+Command  ::= CmdIdentifier Option* Operand*
+```
+
+**CmdIdentifier:**
+
+![CmdIdentifier](diagram/CmdIdentifier.svg)
+
+```
+CmdIdentifier
+         ::= Alphanumeric*
+```
+
+referenced by:
+
+- Command
+
+**Option:**
+
+![Option](diagram/Option.svg)
+
+```
+Option   ::= ShortOption
+           | LongOption
+```
+
+referenced by:
+
+- Command
+
+**ShortOption:**
+
+![ShortOption](diagram/ShortOption.svg)
+
+```
+ShortOption
+         ::= ShortFlagOption
+           | ShortValueOption
+```
+
+referenced by:
+
+- Option
+
+**LongOption:**
+
+![LongOption](diagram/LongOption.svg)
+
+```
+LongOption
+         ::= LongFlagOption
+           | LongValueOption
+```
+
+referenced by:
+
+- Option
+
+**ShortFlagOption:**
+
+![ShortFlagOption](diagram/ShortFlagOption.svg)
+
+```
+ShortFlagOption
+         ::= '-' Alphanumeric
+```
+
+referenced by:
+
+- ShortOption
+
+**ShortValueOption:**
+
+![ShortValueOption](diagram/ShortValueOption.svg)
+
+```
+ShortValueOption
+         ::= '-' Alphanumeric OptionValueDelimiter Value
+```
+
+referenced by:
+
+- ShortOption
+
+**LongFlagOption:**
+
+![LongFlagOption](diagram/LongFlagOption.svg)
+
+```
+LongFlagOption
+         ::= '--' Alphanumeric+
+```
+
+referenced by:
+
+- LongOption
+
+**LongValueOption:**
+
+![LongValueOption](diagram/LongValueOption.svg)
+
+```
+LongValueOption
+         ::= '--' Alphanumeric+ OptionValueDelimiter Value
+```
+
+referenced by:
+
+- LongOption
+
+**OptionValueDelimiter:**
+
+![OptionValueDelimiter](diagram/OptionValueDelimiter.svg)
+
+```
+OptionValueDelimiter
+         ::= Space
+           | '='
+```
+
+referenced by:
+
+- LongValueOption
+- ShortValueOption
+
+**Alphanumeric:**
+
+![Alphanumeric](diagram/Alphanumeric.svg)
+
+```
+Alphanumeric
+         ::= [0-9a-zA-Z]
+```
+
+referenced by:
+
+- CmdIdentifier
+- LongFlagOption
+- LongValueOption
+- ShortFlagOption
+- ShortValueOption
+
+**Value:**
+
+![Value](diagram/Value.svg)
+
+```
+Value    ::= Char*
+           | '"' ( Char | Space )* '"'
+```
+
+referenced by:
+
+- LongValueOption
+- Operand
+- ShortValueOption
+
+**Char:**
+
+![Char](diagram/Char.svg)
+
+```
+Char     ::= UnicodeExceptDoubleQuotes
+           | '\"'
+```
+
+referenced by:
+
+- Value
+
+**Space:**
+
+![Space](diagram/Space.svg)
+
+```
+Space    ::= ( U+0020 )*
+```
+
+referenced by:
+
+- OptionValueDelimiter
+- Value
+
+**Operand:**
+
+![Operand](diagram/Operand.svg)
+
+```
+Operand  ::= Value
+```
+
+referenced by:
+
+- Command
+
+##
+
+![rr-2.0](diagram/rr-2.0.svg) <sup>generated by [RR - Railroad Diagram Generator][rr]</sup>
+
+[rr]: http://bottlecaps.de/rr/ui
diff --git a/cli-args.md b/cli-args.md
new file mode 100644
index 0000000..cf0f959
--- /dev/null
+++ b/cli-args.md
@@ -0,0 +1,88 @@
+# Command-line argument conventions
+
+```
+Code: conv/cli-args
+Version: 1.0.0
+Author: Muthu Kumar <muthukumar@thefeathers.in>
+Org: Feathers Studio
+```
+
+## Introduction
+
+The POSIX standard is often cited when designing command line interfaces. However, the most recent version published as IEEE Std 1003.1-2017 (also published as [The Open Group Base Specifications](https://pubs.opengroup.org/onlinepubs/9699919799/basedefs/V1_chap12.html)) still falls woefully short of modern requirements. The [GNU extensions](https://www.gnu.org/software/libc/manual/html_node/Argument-Syntax.html) to POSIX are the most widely used. However, there is still room for disambiguation. This specification addresses them.
+
+## Specification
+
+A command MAY accept sub-commands, options, and operands.
+
+### Sub-commands
+
+-   A sub-command is a part of the command that acts as a command by itself. In other words, a sub-command is a recursive command.
+-   Commands (or sub-commands) with sub-commands MUST NOT accept operands. They MAY accept options.
+-   Any arguments after a sub-command MUST be accepted literally without parsing, even if they start with `-`, `--`, or `=`. They MUST be parsed by the sub-command's own arg parser, following this specification.
+
+### Options
+
+-   Options are arguments that MAY modify the behaviour of the command.
+-   Options MAY be supplied in any order.
+
+#### Boolean options
+
+-   Boolean options MUST NOT accept any value. They are boolean in nature and their presence MUST be inferred as true.
+-   Boolean options MAY be referred to as "flags".
+
+#### Non-boolean options
+
+-   A non-boolean option MUST accept a single value. An option MAY be repeated several times to pass multiple values.
+-   A non-boolean option MUST be separated from their value by a space or "=".
+
+#### Long-form options
+
+-   Every option MUST have a long-form. This is denoted by the delimiter `--` followed by the option name without spaces.
+-   Long-form options MUST be at least two characters, and consist of alphanumeric characters, `-`, or `_`.
+-   Long-form options MUST begin with an alphanumeric character.
+
+#### Short-form options
+
+-   Options MAY have a short-form. This is denoted by the delimiter `-` and MUST be followed by a single alphanumeric character.
+-   Every short-form option MUST correspond to a long-form option. The inverse is not required.
+
+### Operands
+
+-   Operands are any values passed as input to the utility for its primary function.
+-   Operands MUST be passed after all options.
+
+### Strict-mode
+
+-   "Strict-mode" MAY be specified by the application developer via the parser library or their own implementation of this specification.
+-   "Strict-mode" MAY be specified by the application user via the environment variable `ARG_PARSER_STRICT_MODE`.
+-   In "strict-mode", non-boolean options MUST be separated from their value by "=" only.
+
+### Special-cases
+
+-   Any arguments after the delimiter `--` followed by space MUST be accepted literally without parsing, even if they start with `-`, `--`, or `=`.
+-   A single `-` MUST be interpreted as a regular operand. By convention, this MAY represent input from or output to the standard input/output streams.
+
+## Formal Grammar
+
+```grammar
+Command ::= CmdIdentifier
+Command ::= CmdIdentifier Operand*
+Command ::= CmdIdentifier Option* Operand*
+CmdIdentifier ::= Alphanumeric*
+Option ::= ShortOption | LongOption
+ShortOption ::= ShortFlagOption | ShortValueOption
+LongOption ::= LongFlagOption | LongValueOption
+ShortFlagOption ::= '-' Alphanumeric
+ShortValueOption ::= '-' Alphanumeric OptionValueDelimiter Value
+LongFlagOption ::= '--' Alphanumeric Alphanumeric*
+LongValueOption ::= '--' Alphanumeric Alphanumeric* OptionValueDelimiter Value
+OptionValueDelimiter ::= Space | '='
+Alphanumeric ::= [0-9a-zA-Z]
+Value ::= Char* | '"' ( Char | Space )* '"'
+Char ::= ( UnicodeExceptDoubleQuotes | '\"' )
+Space ::= ( U+0020 )\*
+Operand ::= Value
+```
+
+This grammar is also available as a [railroad diagram](./assets/cli-railroad.md).

From fa5207b5a45cbcf8fe89cc4a49a10127b88741c7 Mon Sep 17 00:00:00 2001
From: Muthu Kumar <muthukumar@thefeathers.in>
Date: Wed, 22 Feb 2023 02:56:00 +0530
Subject: [PATCH 2/3] feat(cli-args): allow sub-commands in grammar

---
 .../cli-railroad/diagram/AlphanumericAnd.svg  | 63 +++++++++++++++++++
 assets/cli-railroad/diagram/CmdIdentifier.svg | 18 +++---
 assets/cli-railroad/diagram/Command.svg       | 21 ++++---
 .../cli-railroad/diagram/LongFlagOption.svg   | 31 +++++----
 .../cli-railroad/diagram/LongValueOption.svg  | 43 +++++++------
 assets/cli-railroad/index.md                  | 28 +++++++--
 cli-args.md                                   | 15 +++--
 7 files changed, 163 insertions(+), 56 deletions(-)
 create mode 100644 assets/cli-railroad/diagram/AlphanumericAnd.svg

diff --git a/assets/cli-railroad/diagram/AlphanumericAnd.svg b/assets/cli-railroad/diagram/AlphanumericAnd.svg
new file mode 100644
index 0000000..d3991eb
--- /dev/null
+++ b/assets/cli-railroad/diagram/AlphanumericAnd.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="161" height="213">
+   <defs>
+      <style type="text/css">
+    @namespace "http://www.w3.org/2000/svg";
+    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
+    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
+    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
+    .filled               {fill: #332900; stroke: none;}
+    text.terminal         {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #141000;
+                            font-weight: bold;
+                          }
+    text.nonterminal      {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1A1400;
+                            font-weight: normal;
+                          }
+    text.regexp           {font-family: Verdana, Sans-serif;
+                            font-size: 12px;
+                            fill: #1F1800;
+                            font-weight: normal;
+                          }
+    rect, circle, polygon {fill: #332900; stroke: #332900;}
+    rect.terminal         {fill: #FFDB4D; stroke: #332900; stroke-width: 1;}
+    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
+    rect.text             {fill: none; stroke: none;}
+    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
+  </style>
+   </defs>
+   <polygon points="9 17 1 13 1 21"/>
+   <polygon points="17 17 9 13 9 21"/>
+   <polygon points="51 19 58 3 106 3 113 19 106 35 58 35"/>
+   <polygon points="49 17 56 1 104 1 111 17 104 33 56 33" class="regexp"/>
+   <text class="regexp" x="64" y="21">[0-9]</text>
+   <polygon points="51 63 58 47 104 47 111 63 104 79 58 79"/>
+   <polygon points="49 61 56 45 102 45 109 61 102 77 56 77" class="regexp"/>
+   <text class="regexp" x="64" y="65">[a-z]</text>
+   <polygon points="51 107 58 91 106 91 113 107 106 123 58 123"/>
+   <polygon points="49 105 56 89 104 89 111 105 104 121 56 121" class="regexp"/>
+   <text class="regexp" x="64" y="109">[A-Z]</text>
+   <rect x="51" y="135" width="26" height="32" rx="10"/>
+   <rect x="49"
+          y="133"
+          width="26"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="153">-</text>
+   <rect x="51" y="179" width="28" height="32" rx="10"/>
+   <rect x="49"
+          y="177"
+          width="28"
+          height="32"
+          class="terminal"
+          rx="10"/>
+   <text class="terminal" x="59" y="197">_</text>
+   <path class="line"
+          d="m17 17 h2 m20 0 h10 m62 0 h10 m-102 0 h20 m82 0 h20 m-122 0 q10 0 10 10 m102 0 q0 -10 10 -10 m-112 10 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m60 0 h10 m0 0 h2 m-92 -10 v20 m102 0 v-20 m-102 20 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m62 0 h10 m-92 -10 v20 m102 0 v-20 m-102 20 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m26 0 h10 m0 0 h36 m-92 -10 v20 m102 0 v-20 m-102 20 v24 m102 0 v-24 m-102 24 q0 10 10 10 m82 0 q10 0 10 -10 m-92 10 h10 m28 0 h10 m0 0 h34 m23 -176 h-3"/>
+   <polygon points="151 17 159 13 159 21"/>
+   <polygon points="151 17 143 13 143 21"/>
+</svg>
diff --git a/assets/cli-railroad/diagram/CmdIdentifier.svg b/assets/cli-railroad/diagram/CmdIdentifier.svg
index 10ea49f..e75517d 100644
--- a/assets/cli-railroad/diagram/CmdIdentifier.svg
+++ b/assets/cli-railroad/diagram/CmdIdentifier.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="205" height="57">
+<svg xmlns="http://www.w3.org/2000/svg" width="229" height="57">
    <defs>
       <style type="text/css">
     @namespace "http://www.w3.org/2000/svg";
@@ -32,14 +32,14 @@
    <polygon points="9 51 1 47 1 55"/>
    <polygon points="17 51 9 47 9 55"/>
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
-       xlink:href="#Alphanumeric"
-       xlink:title="Alphanumeric">
-      <rect x="51" y="3" width="106" height="32"/>
-      <rect x="49" y="1" width="106" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="59" y="21">Alphanumeric</text>
+       xlink:href="#AlphanumericAnd"
+       xlink:title="AlphanumericAnd">
+      <rect x="51" y="3" width="130" height="32"/>
+      <rect x="49" y="1" width="130" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="59" y="21">AlphanumericAnd</text>
    </a>
    <path class="line"
-          d="m17 51 h2 m20 0 h10 m0 0 h116 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m126 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-126 0 h10 m106 0 h10 m23 34 h-3"/>
-   <polygon points="195 51 203 47 203 55"/>
-   <polygon points="195 51 187 47 187 55"/>
+          d="m17 51 h2 m20 0 h10 m0 0 h140 m-170 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m150 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-150 0 h10 m130 0 h10 m23 34 h-3"/>
+   <polygon points="219 51 227 47 227 55"/>
+   <polygon points="219 51 211 47 211 55"/>
 </svg>
diff --git a/assets/cli-railroad/diagram/Command.svg b/assets/cli-railroad/diagram/Command.svg
index cd7bec8..666aca3 100644
--- a/assets/cli-railroad/diagram/Command.svg
+++ b/assets/cli-railroad/diagram/Command.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="421" height="71">
+<svg xmlns="http://www.w3.org/2000/svg" width="471" height="153">
    <defs>
       <style type="text/css">
     @namespace "http://www.w3.org/2000/svg";
@@ -48,12 +48,19 @@
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
        xlink:href="#Operand"
        xlink:title="Operand">
-      <rect x="299" y="3" width="74" height="32"/>
-      <rect x="297" y="1" width="74" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="307" y="21">Operand</text>
+      <rect x="319" y="37" width="74" height="32"/>
+      <rect x="317" y="35" width="74" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="327" y="55">Operand</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#Command"
+       xlink:title="Command">
+      <rect x="319" y="103" width="84" height="32"/>
+      <rect x="317" y="101" width="84" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="327" y="121">Command</text>
    </a>
    <path class="line"
-          d="m17 51 h2 m0 0 h10 m106 0 h10 m20 0 h10 m0 0 h72 m-102 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m82 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-82 0 h10 m62 0 h10 m40 34 h10 m0 0 h84 m-114 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m94 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-94 0 h10 m74 0 h10 m23 34 h-3"/>
-   <polygon points="411 51 419 47 419 55"/>
-   <polygon points="411 51 403 47 403 55"/>
+          d="m17 51 h2 m0 0 h10 m106 0 h10 m20 0 h10 m0 0 h72 m-102 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m82 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-82 0 h10 m62 0 h10 m60 34 h10 m74 0 h10 m-114 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m94 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-94 0 h10 m0 0 h84 m20 32 h10 m-164 0 h20 m144 0 h20 m-184 0 q10 0 10 10 m164 0 q0 -10 10 -10 m-174 10 v46 m164 0 v-46 m-164 46 q0 10 10 10 m144 0 q10 0 10 -10 m-134 10 h10 m84 0 h10 m-124 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m104 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-104 0 h10 m0 0 h94 m-134 22 v20 m164 0 v-20 m-164 20 v14 m164 0 v-14 m-164 14 q0 10 10 10 m144 0 q10 0 10 -10 m-154 10 h10 m0 0 h134 m23 -100 h-3"/>
+   <polygon points="461 51 469 47 469 55"/>
+   <polygon points="461 51 453 47 453 55"/>
 </svg>
diff --git a/assets/cli-railroad/diagram/LongFlagOption.svg b/assets/cli-railroad/diagram/LongFlagOption.svg
index 70d6c87..75b5282 100644
--- a/assets/cli-railroad/diagram/LongFlagOption.svg
+++ b/assets/cli-railroad/diagram/LongFlagOption.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="257" height="53">
+<svg xmlns="http://www.w3.org/2000/svg" width="407" height="71">
    <defs>
       <style type="text/css">
     @namespace "http://www.w3.org/2000/svg";
@@ -29,25 +29,32 @@
     polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
   </style>
    </defs>
-   <polygon points="9 33 1 29 1 37"/>
-   <polygon points="17 33 9 29 9 37"/>
-   <rect x="31" y="19" width="32" height="32" rx="10"/>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <rect x="31" y="37" width="32" height="32" rx="10"/>
    <rect x="29"
-          y="17"
+          y="35"
           width="32"
           height="32"
           class="terminal"
           rx="10"/>
-   <text class="terminal" x="39" y="37">--</text>
+   <text class="terminal" x="39" y="55">--</text>
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
        xlink:href="#Alphanumeric"
        xlink:title="Alphanumeric">
-      <rect x="103" y="19" width="106" height="32"/>
-      <rect x="101" y="17" width="106" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="111" y="37">Alphanumeric</text>
+      <rect x="83" y="37" width="106" height="32"/>
+      <rect x="81" y="35" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="91" y="55">Alphanumeric</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#AlphanumericAnd"
+       xlink:title="AlphanumericAnd">
+      <rect x="229" y="3" width="130" height="32"/>
+      <rect x="227" y="1" width="130" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="237" y="21">AlphanumericAnd</text>
    </a>
    <path class="line"
-          d="m17 33 h2 m0 0 h10 m32 0 h10 m20 0 h10 m106 0 h10 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m126 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-126 0 h10 m0 0 h116 m23 32 h-3"/>
-   <polygon points="247 33 255 29 255 37"/>
-   <polygon points="247 33 239 29 239 37"/>
+          d="m17 51 h2 m0 0 h10 m32 0 h10 m0 0 h10 m106 0 h10 m20 0 h10 m0 0 h140 m-170 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m150 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-150 0 h10 m130 0 h10 m23 34 h-3"/>
+   <polygon points="397 51 405 47 405 55"/>
+   <polygon points="397 51 389 47 389 55"/>
 </svg>
diff --git a/assets/cli-railroad/diagram/LongValueOption.svg b/assets/cli-railroad/diagram/LongValueOption.svg
index b259028..df85023 100644
--- a/assets/cli-railroad/diagram/LongValueOption.svg
+++ b/assets/cli-railroad/diagram/LongValueOption.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="507" height="53">
+<svg xmlns="http://www.w3.org/2000/svg" width="657" height="71">
    <defs>
       <style type="text/css">
     @namespace "http://www.w3.org/2000/svg";
@@ -29,39 +29,46 @@
     polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
   </style>
    </defs>
-   <polygon points="9 33 1 29 1 37"/>
-   <polygon points="17 33 9 29 9 37"/>
-   <rect x="31" y="19" width="32" height="32" rx="10"/>
+   <polygon points="9 51 1 47 1 55"/>
+   <polygon points="17 51 9 47 9 55"/>
+   <rect x="31" y="37" width="32" height="32" rx="10"/>
    <rect x="29"
-          y="17"
+          y="35"
           width="32"
           height="32"
           class="terminal"
           rx="10"/>
-   <text class="terminal" x="39" y="37">--</text>
+   <text class="terminal" x="39" y="55">--</text>
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
        xlink:href="#Alphanumeric"
        xlink:title="Alphanumeric">
-      <rect x="103" y="19" width="106" height="32"/>
-      <rect x="101" y="17" width="106" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="111" y="37">Alphanumeric</text>
+      <rect x="83" y="37" width="106" height="32"/>
+      <rect x="81" y="35" width="106" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="91" y="55">Alphanumeric</text>
+   </a>
+   <a xmlns:xlink="http://www.w3.org/1999/xlink"
+       xlink:href="#AlphanumericAnd"
+       xlink:title="AlphanumericAnd">
+      <rect x="229" y="3" width="130" height="32"/>
+      <rect x="227" y="1" width="130" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="237" y="21">AlphanumericAnd</text>
    </a>
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
        xlink:href="#OptionValueDelimiter"
        xlink:title="OptionValueDelimiter">
-      <rect x="249" y="19" width="154" height="32"/>
-      <rect x="247" y="17" width="154" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="257" y="37">OptionValueDelimiter</text>
+      <rect x="399" y="37" width="154" height="32"/>
+      <rect x="397" y="35" width="154" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="407" y="55">OptionValueDelimiter</text>
    </a>
    <a xmlns:xlink="http://www.w3.org/1999/xlink"
        xlink:href="#Value"
        xlink:title="Value">
-      <rect x="423" y="19" width="56" height="32"/>
-      <rect x="421" y="17" width="56" height="32" class="nonterminal"/>
-      <text class="nonterminal" x="431" y="37">Value</text>
+      <rect x="573" y="37" width="56" height="32"/>
+      <rect x="571" y="35" width="56" height="32" class="nonterminal"/>
+      <text class="nonterminal" x="581" y="55">Value</text>
    </a>
    <path class="line"
-          d="m17 33 h2 m0 0 h10 m32 0 h10 m20 0 h10 m106 0 h10 m-146 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -12 q0 -10 10 -10 m126 32 l20 0 m-20 0 q10 0 10 -10 l0 -12 q0 -10 -10 -10 m-126 0 h10 m0 0 h116 m20 32 h10 m154 0 h10 m0 0 h10 m56 0 h10 m3 0 h-3"/>
-   <polygon points="497 33 505 29 505 37"/>
-   <polygon points="497 33 489 29 489 37"/>
+          d="m17 51 h2 m0 0 h10 m32 0 h10 m0 0 h10 m106 0 h10 m20 0 h10 m0 0 h140 m-170 0 l20 0 m-1 0 q-9 0 -9 -10 l0 -14 q0 -10 10 -10 m150 34 l20 0 m-20 0 q10 0 10 -10 l0 -14 q0 -10 -10 -10 m-150 0 h10 m130 0 h10 m20 34 h10 m154 0 h10 m0 0 h10 m56 0 h10 m3 0 h-3"/>
+   <polygon points="647 51 655 47 655 55"/>
+   <polygon points="647 51 639 47 639 55"/>
 </svg>
diff --git a/assets/cli-railroad/index.md b/assets/cli-railroad/index.md
index 4430268..4df89c7 100644
--- a/assets/cli-railroad/index.md
+++ b/assets/cli-railroad/index.md
@@ -3,16 +3,20 @@
 ![Command](diagram/Command.svg)
 
 ```
-Command  ::= CmdIdentifier Option* Operand*
+Command  ::= CmdIdentifier Option* ( Operand* | Command+ )
 ```
 
+referenced by:
+
+- Command
+
 **CmdIdentifier:**
 
 ![CmdIdentifier](diagram/CmdIdentifier.svg)
 
 ```
 CmdIdentifier
-         ::= Alphanumeric*
+         ::= AlphanumericAnd*
 ```
 
 referenced by:
@@ -92,7 +96,7 @@ referenced by:
 
 ```
 LongFlagOption
-         ::= '--' Alphanumeric+
+         ::= '--' Alphanumeric AlphanumericAnd*
 ```
 
 referenced by:
@@ -105,7 +109,7 @@ referenced by:
 
 ```
 LongValueOption
-         ::= '--' Alphanumeric+ OptionValueDelimiter Value
+         ::= '--' Alphanumeric AlphanumericAnd* OptionValueDelimiter Value
 ```
 
 referenced by:
@@ -138,12 +142,26 @@ Alphanumeric
 
 referenced by:
 
-- CmdIdentifier
 - LongFlagOption
 - LongValueOption
 - ShortFlagOption
 - ShortValueOption
 
+**AlphanumericAnd:**
+
+![AlphanumericAnd](diagram/AlphanumericAnd.svg)
+
+```
+AlphanumericAnd
+         ::= [0-9a-zA-Z_#x2D]
+```
+
+referenced by:
+
+- CmdIdentifier
+- LongFlagOption
+- LongValueOption
+
 **Value:**
 
 ![Value](diagram/Value.svg)
diff --git a/cli-args.md b/cli-args.md
index cf0f959..be26819 100644
--- a/cli-args.md
+++ b/cli-args.md
@@ -15,6 +15,8 @@ The POSIX standard is often cited when designing command line interfaces. Howeve
 
 A command MAY accept sub-commands, options, and operands.
 
+##### Note: This specification is available as a [formal grammar](#formal-grammar), or as a [railroad diagram](./assets/cli-railroad/index.md).
+
 ### Sub-commands
 
 -   A sub-command is a part of the command that acts as a command by itself. In other words, a sub-command is a recursive command.
@@ -65,23 +67,26 @@ A command MAY accept sub-commands, options, and operands.
 
 ## Formal Grammar
 
-```grammar
+```C
 Command ::= CmdIdentifier
 Command ::= CmdIdentifier Operand*
 Command ::= CmdIdentifier Option* Operand*
-CmdIdentifier ::= Alphanumeric*
+Command ::= CmdIdentifier Command*
+Command ::= CmdIdentifier Option* Command*
+CmdIdentifier ::= AlphanumericAnd*
 Option ::= ShortOption | LongOption
 ShortOption ::= ShortFlagOption | ShortValueOption
 LongOption ::= LongFlagOption | LongValueOption
 ShortFlagOption ::= '-' Alphanumeric
 ShortValueOption ::= '-' Alphanumeric OptionValueDelimiter Value
-LongFlagOption ::= '--' Alphanumeric Alphanumeric*
-LongValueOption ::= '--' Alphanumeric Alphanumeric* OptionValueDelimiter Value
+LongFlagOption ::= '--' Alphanumeric AlphanumericAnd*
+LongValueOption ::= '--' Alphanumeric AlphanumericAnd* OptionValueDelimiter Value
 OptionValueDelimiter ::= Space | '='
 Alphanumeric ::= [0-9a-zA-Z]
+AlphanumericAnd ::= [0-9a-zA-Z-_]
 Value ::= Char* | '"' ( Char | Space )* '"'
 Char ::= ( UnicodeExceptDoubleQuotes | '\"' )
-Space ::= ( U+0020 )\*
+Space ::= ( U+0020 )*
 Operand ::= Value
 ```
 

From 5611a136f0e70cf3853c6b6e0a1fb168be9384e5 Mon Sep 17 00:00:00 2001
From: Muthu Kumar <muthukumar@thefeathers.in>
Date: Wed, 22 Feb 2023 03:09:03 +0530
Subject: [PATCH 3/3] fix(cli-args): broken link

---
 cli-args.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cli-args.md b/cli-args.md
index be26819..6062166 100644
--- a/cli-args.md
+++ b/cli-args.md
@@ -90,4 +90,4 @@ Space ::= ( U+0020 )*
 Operand ::= Value
 ```
 
-This grammar is also available as a [railroad diagram](./assets/cli-railroad.md).
+This grammar is also available as a [railroad diagram](./assets/cli-railroad/index.md).