@uiw/react-md-editor 3.18.1 → 3.18.3

package/esm/commands/bold.js

@@ -5,9 +5,10 @@ export var bold = {
   name: 'bold',
   keyCommand: 'bold',
   shortcuts: 'ctrlcmd+b',
+  value: '**',
   buttonProps: {
-    'aria-label': 'Add bold text',
-    title: 'Add bold text'
+    'aria-label': 'Add bold text (ctrl + b)',
+    title: 'Add bold text (ctrl + b)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     role: "img",

package/esm/commands/bold.js.map

@@ -7,6 +7,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -29,7 +30,7 @@
     "../../src/commands/bold.tsx"
   ],
   "sourcesContent": [
-    "import React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const bold: ICommand = {\n  name: 'bold',\n  keyCommand: 'bold',\n  shortcuts: 'ctrlcmd+b',\n  buttonProps: { 'aria-label': 'Add bold text', title: 'Add bold text' },\n  icon: (\n    <svg role=\"img\" width=\"12\" height=\"12\" viewBox=\"0 0 384 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M304.793 243.891c33.639-18.537 53.657-54.16 53.657-95.693 0-48.236-26.25-87.626-68.626-104.179C265.138 34.01 240.849 32 209.661 32H24c-8.837 0-16 7.163-16 16v33.049c0 8.837 7.163 16 16 16h33.113v318.53H24c-8.837 0-16 7.163-16 16V464c0 8.837 7.163 16 16 16h195.69c24.203 0 44.834-1.289 66.866-7.584C337.52 457.193 376 410.647 376 350.014c0-52.168-26.573-91.684-71.207-106.123zM142.217 100.809h67.444c16.294 0 27.536 2.019 37.525 6.717 15.828 8.479 24.906 26.502 24.906 49.446 0 35.029-20.32 56.79-53.029 56.79h-76.846V100.809zm112.642 305.475c-10.14 4.056-22.677 4.907-31.409 4.907h-81.233V281.943h84.367c39.645 0 63.057 25.38 63.057 63.057.001 28.425-13.66 52.483-34.782 61.284z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the bold mark up\n    const state2 = api.replaceSelection(`**${state1.selectedText}**`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: state2.selection.end - 2 - state1.selectedText.length,\n      end: state2.selection.end - 2,\n    });\n  },\n};\n"
+    "import React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const bold: ICommand = {\n  name: 'bold',\n  keyCommand: 'bold',\n  shortcuts: 'ctrlcmd+b',\n  value: '**',\n  buttonProps: { 'aria-label': 'Add bold text (ctrl + b)', title: 'Add bold text (ctrl + b)' },\n  icon: (\n    <svg role=\"img\" width=\"12\" height=\"12\" viewBox=\"0 0 384 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M304.793 243.891c33.639-18.537 53.657-54.16 53.657-95.693 0-48.236-26.25-87.626-68.626-104.179C265.138 34.01 240.849 32 209.661 32H24c-8.837 0-16 7.163-16 16v33.049c0 8.837 7.163 16 16 16h33.113v318.53H24c-8.837 0-16 7.163-16 16V464c0 8.837 7.163 16 16 16h195.69c24.203 0 44.834-1.289 66.866-7.584C337.52 457.193 376 410.647 376 350.014c0-52.168-26.573-91.684-71.207-106.123zM142.217 100.809h67.444c16.294 0 27.536 2.019 37.525 6.717 15.828 8.479 24.906 26.502 24.906 49.446 0 35.029-20.32 56.79-53.029 56.79h-76.846V100.809zm112.642 305.475c-10.14 4.056-22.677 4.907-31.409 4.907h-81.233V281.943h84.367c39.645 0 63.057 25.38 63.057 63.057.001 28.425-13.66 52.483-34.782 61.284z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the bold mark up\n    const state2 = api.replaceSelection(`**${state1.selectedText}**`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: state2.selection.end - 2 - state1.selectedText.length,\n      end: state2.selection.end - 2,\n    });\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,IAAc,GAAG;EAC5BC,IAAI,EAAE,MADsB;EAE5BC,UAAU,EAAE,MAFgB;EAG5BC,SAAS,EAAE,WAHiB;EAI5BC,WAAW,EAAE;IAAE,cAAc,eAAhB;IAAiCC,KAAK,EAAE;EAAxC,CAJe;EAK5BC,IAAI,eACF;IAAK,IAAI,EAAC,KAAV;IAAgB,KAAK,EAAC,IAAtB;IAA2B,MAAM,EAAC,IAAlC;IAAuC,OAAO,EAAC,aAA/C;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAN0B;EAa5BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGX,UAAU,CAAC;MAAEY,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,QAA0BH,MAAM,CAACI,YAAjC,QAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID;AAxB2B,CAAvB"
+  "mappings": "AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,IAAc,GAAG;EAC5BC,IAAI,EAAE,MADsB;EAE5BC,UAAU,EAAE,MAFgB;EAG5BC,SAAS,EAAE,WAHiB;EAI5BC,KAAK,EAAE,IAJqB;EAK5BC,WAAW,EAAE;IAAE,cAAc,0BAAhB;IAA4CC,KAAK,EAAE;EAAnD,CALe;EAM5BC,IAAI,eACF;IAAK,IAAI,EAAC,KAAV;IAAgB,KAAK,EAAC,IAAtB;IAA2B,MAAM,EAAC,IAAlC;IAAuC,OAAO,EAAC,aAA/C;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAP0B;EAc5BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGZ,UAAU,CAAC;MAAEa,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,QAA0BH,MAAM,CAACI,YAAjC,QAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID;AAzB2B,CAAvB"
 }

package/esm/commands/code.js

@@ -5,9 +5,10 @@ export var code = {
   name: 'code',
   keyCommand: 'code',
   shortcuts: 'ctrlcmd+j',
+  value: '``',
   buttonProps: {
-    'aria-label': 'Insert code',
-    title: 'Insert code'
+    'aria-label': 'Insert code (ctrl + j)',
+    title: 'Insert code (ctrl + j)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     width: "12",
@@ -58,6 +59,7 @@ export var codeBlock = {
   name: 'codeBlock',
   keyCommand: 'codeBlock',
   shortcuts: 'ctrlcmd+shift+j',
+  value: '```\n```',
   icon: /*#__PURE__*/_jsx("svg", {
     width: "12",
     height: "12",
@@ -69,8 +71,8 @@ export var codeBlock = {
     })
   }),
   buttonProps: {
-    'aria-label': 'Insert Code Block',
-    title: 'Insert Code Block'
+    'aria-label': 'Insert Code Block (ctrl + shift + j)',
+    title: 'Insert Code Block (ctrl + shift +j)'
   },
   execute: (tate, api) => {
     // Adjust the selection to encompass the whole word if the caret is inside one

package/esm/commands/code.js.map

@@ -9,6 +9,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -40,7 +41,7 @@
     "../../src/commands/code.tsx"
   ],
   "sourcesContent": [
-    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport {\n  selectWord,\n  getBreaksNeededForEmptyLineBefore,\n  getBreaksNeededForEmptyLineAfter,\n} from '../utils/markdownUtils';\n\nexport const code: ICommand = {\n  name: 'code',\n  keyCommand: 'code',\n  shortcuts: 'ctrlcmd+j',\n  buttonProps: { 'aria-label': 'Insert code', title: 'Insert code' },\n  icon: (\n    <svg width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 640 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M278.9 511.5l-61-17.7c-6.4-1.8-10-8.5-8.2-14.9L346.2 8.7c1.8-6.4 8.5-10 14.9-8.2l61 17.7c6.4 1.8 10 8.5 8.2 14.9L293.8 503.3c-1.9 6.4-8.5 10.1-14.9 8.2zm-114-112.2l43.5-46.4c4.6-4.9 4.3-12.7-.8-17.2L117 256l90.6-79.7c5.1-4.5 5.5-12.3.8-17.2l-43.5-46.4c-4.5-4.8-12.1-5.1-17-.5L3.8 247.2c-5.1 4.7-5.1 12.8 0 17.5l144.1 135.1c4.9 4.6 12.5 4.4 17-.5zm327.2.6l144.1-135.1c5.1-4.7 5.1-12.8 0-17.5L492.1 112.1c-4.8-4.5-12.4-4.3-17 .5L431.6 159c-4.6 4.9-4.3 12.7.8 17.2L523 256l-90.6 79.7c-5.1 4.5-5.5 12.3-.8 17.2l43.5 46.4c4.5 4.9 12.1 5.1 17 .6z\"\n      />\n    </svg>\n  ),\n  execute: (tate: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: tate.text, selection: tate.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // when there's no breaking line\n    if (state1.selectedText.indexOf('\\n') === -1) {\n      api.replaceSelection(`\\`${state1.selectedText}\\``);\n      // Adjust the selection to not contain the **\n\n      const selectionStart = state1.selection.start + 1;\n      const selectionEnd = selectionStart + state1.selectedText.length;\n\n      api.setSelectionRange({\n        start: selectionStart,\n        end: selectionEnd,\n      });\n      return;\n    }\n\n    const breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);\n    const breaksBefore = Array(breaksBeforeCount + 1).join('\\n');\n\n    const breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);\n    const breaksAfter = Array(breaksAfterCount + 1).join('\\n');\n\n    api.replaceSelection(`${breaksBefore}\\`\\`\\`\\n${state1.selectedText}\\n\\`\\`\\`${breaksAfter}`);\n\n    const selectionStart = state1.selection.start + breaksBeforeCount + 4;\n    const selectionEnd = selectionStart + state1.selectedText.length;\n\n    api.setSelectionRange({\n      start: selectionStart,\n      end: selectionEnd,\n    });\n  },\n};\n\nexport const codeBlock: ICommand = {\n  name: 'codeBlock',\n  keyCommand: 'codeBlock',\n  shortcuts: 'ctrlcmd+shift+j',\n  icon: (\n    <svg width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 156 156\">\n      <path\n        fill=\"currentColor\"\n        d=\"M110.85 120.575 43.7 120.483333 43.7083334 110.091667 110.85 110.191667 110.841667 120.583333 110.85 120.575ZM85.1333334 87.1916666 43.625 86.7083332 43.7083334 76.3166666 85.2083334 76.7916666 85.1333334 87.1916666 85.1333334 87.1916666ZM110.841667 53.4166666 43.7 53.3166666 43.7083334 42.925 110.85 43.025 110.841667 53.4166666ZM36 138C27.2916666 138 20.75 136.216667 16.4 132.666667 12.1333334 129.2 10 124.308333 10 118L10 95.3333332C10 91.0666666 9.25 88.1333332 7.7333334 86.5333332 6.3166668 84.8416666 3.7333334 84 0 84L0 72C3.7333334 72 6.3083334 71.2 7.7333334 69.6 9.2416668 67.9083334 10 64.9333334 10 60.6666666L10 38C10 31.775 12.1333334 26.8833334 16.4 23.3333332 20.7583334 19.7749998 27.2916666 18 36 18L40.6666668 18 40.6666668 30 36 30C34.0212222 29.9719277 32.1263151 30.7979128 30.8 32.2666666 29.3605875 33.8216362 28.5938182 35.8823287 28.6666668 38L28.6666668 60.6666666C28.6666668 67.5083332 26.6666668 72.4 22.6666668 75.3333332 20.9317416 76.7274684 18.8640675 77.6464347 16.6666668 78 18.8916668 78.35 20.8916668 79.2416666 22.6666668 80.6666666 26.6666668 83.95 28.6666668 88.8416666 28.6666668 95.3333332L28.6666668 118C28.6666668 120.308333 29.3750002 122.216667 30.8 123.733333 32.2166666 125.241667 33.9583334 126 36 126L40.6666668 126 40.6666668 138 36 138 36 138ZM114.116667 126 118.783333 126C120.833333 126 122.566667 125.241667 123.983333 123.733333 125.422746 122.178364 126.189515 120.117671 126.116667 118L126.116667 95.3333332C126.116667 88.8333332 128.116667 83.9499998 132.116667 80.6666666 133.9 79.2416666 135.9 78.35 138.116667 78 135.919156 77.6468047 133.851391 76.7277979 132.116667 75.3333332 128.116667 72.3999998 126.116667 67.5 126.116667 60.6666666L126.116667 38C126.189515 35.8823287 125.422746 33.8216361 123.983333 32.2666666 122.657018 30.7979128 120.762111 29.9719277 118.783333 30L114.116667 30 114.116667 18 118.783333 18C127.5 18 133.983333 19.775 138.25 23.3333332 142.608333 26.8833332 144.783333 31.7749998 144.783333 38L144.783333 60.6666666C144.783333 64.9333332 145.5 67.9083332 146.916667 69.6 148.433333 71.2 151.05 72 154.783333 72L154.783333 84C151.05 84 148.433333 84.8333334 146.916667 86.5333332 145.5 88.1333332 144.783333 91.0666666 144.783333 95.3333332L144.783333 118C144.783333 124.308333 142.616667 129.2 138.25 132.666667 133.983333 136.216667 127.5 138 118.783333 138L114.116667 138 114.116667 126 114.116667 126Z\"\n      />\n    </svg>\n  ),\n  buttonProps: { 'aria-label': 'Insert Code Block', title: 'Insert Code Block' },\n  execute: (tate: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: tate.text, selection: tate.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n\n    const breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);\n    const breaksBefore = Array(breaksBeforeCount + 1).join('\\n');\n\n    const breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);\n    const breaksAfter = Array(breaksAfterCount + 1).join('\\n');\n\n    api.replaceSelection(`${breaksBefore}\\`\\`\\`\\n${state1.selectedText}\\n\\`\\`\\`${breaksAfter}`);\n\n    const selectionStart = state1.selection.start + breaksBeforeCount + 4;\n    const selectionEnd = selectionStart + state1.selectedText.length;\n\n    api.setSelectionRange({\n      start: selectionStart,\n      end: selectionEnd,\n    });\n  },\n};\n"
+    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport {\n  selectWord,\n  getBreaksNeededForEmptyLineBefore,\n  getBreaksNeededForEmptyLineAfter,\n} from '../utils/markdownUtils';\n\nexport const code: ICommand = {\n  name: 'code',\n  keyCommand: 'code',\n  shortcuts: 'ctrlcmd+j',\n  value: '``',\n  buttonProps: { 'aria-label': 'Insert code (ctrl + j)', title: 'Insert code (ctrl + j)' },\n  icon: (\n    <svg width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 640 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M278.9 511.5l-61-17.7c-6.4-1.8-10-8.5-8.2-14.9L346.2 8.7c1.8-6.4 8.5-10 14.9-8.2l61 17.7c6.4 1.8 10 8.5 8.2 14.9L293.8 503.3c-1.9 6.4-8.5 10.1-14.9 8.2zm-114-112.2l43.5-46.4c4.6-4.9 4.3-12.7-.8-17.2L117 256l90.6-79.7c5.1-4.5 5.5-12.3.8-17.2l-43.5-46.4c-4.5-4.8-12.1-5.1-17-.5L3.8 247.2c-5.1 4.7-5.1 12.8 0 17.5l144.1 135.1c4.9 4.6 12.5 4.4 17-.5zm327.2.6l144.1-135.1c5.1-4.7 5.1-12.8 0-17.5L492.1 112.1c-4.8-4.5-12.4-4.3-17 .5L431.6 159c-4.6 4.9-4.3 12.7.8 17.2L523 256l-90.6 79.7c-5.1 4.5-5.5 12.3-.8 17.2l43.5 46.4c4.5 4.9 12.1 5.1 17 .6z\"\n      />\n    </svg>\n  ),\n  execute: (tate: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: tate.text, selection: tate.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // when there's no breaking line\n    if (state1.selectedText.indexOf('\\n') === -1) {\n      api.replaceSelection(`\\`${state1.selectedText}\\``);\n      // Adjust the selection to not contain the **\n\n      const selectionStart = state1.selection.start + 1;\n      const selectionEnd = selectionStart + state1.selectedText.length;\n\n      api.setSelectionRange({\n        start: selectionStart,\n        end: selectionEnd,\n      });\n      return;\n    }\n\n    const breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);\n    const breaksBefore = Array(breaksBeforeCount + 1).join('\\n');\n\n    const breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);\n    const breaksAfter = Array(breaksAfterCount + 1).join('\\n');\n\n    api.replaceSelection(`${breaksBefore}\\`\\`\\`\\n${state1.selectedText}\\n\\`\\`\\`${breaksAfter}`);\n\n    const selectionStart = state1.selection.start + breaksBeforeCount + 4;\n    const selectionEnd = selectionStart + state1.selectedText.length;\n\n    api.setSelectionRange({\n      start: selectionStart,\n      end: selectionEnd,\n    });\n  },\n};\n\nexport const codeBlock: ICommand = {\n  name: 'codeBlock',\n  keyCommand: 'codeBlock',\n  shortcuts: 'ctrlcmd+shift+j',\n  value: '```\\n```',\n  icon: (\n    <svg width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 156 156\">\n      <path\n        fill=\"currentColor\"\n        d=\"M110.85 120.575 43.7 120.483333 43.7083334 110.091667 110.85 110.191667 110.841667 120.583333 110.85 120.575ZM85.1333334 87.1916666 43.625 86.7083332 43.7083334 76.3166666 85.2083334 76.7916666 85.1333334 87.1916666 85.1333334 87.1916666ZM110.841667 53.4166666 43.7 53.3166666 43.7083334 42.925 110.85 43.025 110.841667 53.4166666ZM36 138C27.2916666 138 20.75 136.216667 16.4 132.666667 12.1333334 129.2 10 124.308333 10 118L10 95.3333332C10 91.0666666 9.25 88.1333332 7.7333334 86.5333332 6.3166668 84.8416666 3.7333334 84 0 84L0 72C3.7333334 72 6.3083334 71.2 7.7333334 69.6 9.2416668 67.9083334 10 64.9333334 10 60.6666666L10 38C10 31.775 12.1333334 26.8833334 16.4 23.3333332 20.7583334 19.7749998 27.2916666 18 36 18L40.6666668 18 40.6666668 30 36 30C34.0212222 29.9719277 32.1263151 30.7979128 30.8 32.2666666 29.3605875 33.8216362 28.5938182 35.8823287 28.6666668 38L28.6666668 60.6666666C28.6666668 67.5083332 26.6666668 72.4 22.6666668 75.3333332 20.9317416 76.7274684 18.8640675 77.6464347 16.6666668 78 18.8916668 78.35 20.8916668 79.2416666 22.6666668 80.6666666 26.6666668 83.95 28.6666668 88.8416666 28.6666668 95.3333332L28.6666668 118C28.6666668 120.308333 29.3750002 122.216667 30.8 123.733333 32.2166666 125.241667 33.9583334 126 36 126L40.6666668 126 40.6666668 138 36 138 36 138ZM114.116667 126 118.783333 126C120.833333 126 122.566667 125.241667 123.983333 123.733333 125.422746 122.178364 126.189515 120.117671 126.116667 118L126.116667 95.3333332C126.116667 88.8333332 128.116667 83.9499998 132.116667 80.6666666 133.9 79.2416666 135.9 78.35 138.116667 78 135.919156 77.6468047 133.851391 76.7277979 132.116667 75.3333332 128.116667 72.3999998 126.116667 67.5 126.116667 60.6666666L126.116667 38C126.189515 35.8823287 125.422746 33.8216361 123.983333 32.2666666 122.657018 30.7979128 120.762111 29.9719277 118.783333 30L114.116667 30 114.116667 18 118.783333 18C127.5 18 133.983333 19.775 138.25 23.3333332 142.608333 26.8833332 144.783333 31.7749998 144.783333 38L144.783333 60.6666666C144.783333 64.9333332 145.5 67.9083332 146.916667 69.6 148.433333 71.2 151.05 72 154.783333 72L154.783333 84C151.05 84 148.433333 84.8333334 146.916667 86.5333332 145.5 88.1333332 144.783333 91.0666666 144.783333 95.3333332L144.783333 118C144.783333 124.308333 142.616667 129.2 138.25 132.666667 133.983333 136.216667 127.5 138 118.783333 138L114.116667 138 114.116667 126 114.116667 126Z\"\n      />\n    </svg>\n  ),\n  buttonProps: { 'aria-label': 'Insert Code Block (ctrl + shift + j)', title: 'Insert Code Block (ctrl + shift +j)' },\n  execute: (tate: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: tate.text, selection: tate.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n\n    const breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);\n    const breaksBefore = Array(breaksBeforeCount + 1).join('\\n');\n\n    const breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);\n    const breaksAfter = Array(breaksAfterCount + 1).join('\\n');\n\n    api.replaceSelection(`${breaksBefore}\\`\\`\\`\\n${state1.selectedText}\\n\\`\\`\\`${breaksAfter}`);\n\n    const selectionStart = state1.selection.start + breaksBeforeCount + 4;\n    const selectionEnd = selectionStart + state1.selectedText.length;\n\n    api.setSelectionRange({\n      start: selectionStart,\n      end: selectionEnd,\n    });\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SACEC,UADF,EAEEC,iCAFF,EAGEC,gCAHF,QAIO,wBAJP;;AAMA,OAAO,IAAMC,IAAc,GAAG;EAC5BC,IAAI,EAAE,MADsB;EAE5BC,UAAU,EAAE,MAFgB;EAG5BC,SAAS,EAAE,WAHiB;EAI5BC,WAAW,EAAE;IAAE,cAAc,aAAhB;IAA+BC,KAAK,EAAE;EAAtC,CAJe;EAK5BC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,IAAI,EAAC,KAAjC;IAAuC,OAAO,EAAC,aAA/C;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAN0B;EAa5BC,OAAO,EAAE,CAACC,IAAD,EAAkBC,GAAlB,KAA2C;IAClD;IACA,IAAMC,iBAAiB,GAAGb,UAAU,CAAC;MAAEc,IAAI,EAAEH,IAAI,CAACG,IAAb;MAAmBC,SAAS,EAAEJ,IAAI,CAACI;IAAnC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHkD,CAIlD;;IACA,IAAIG,MAAM,CAACE,YAAP,CAAoBC,OAApB,CAA4B,IAA5B,MAAsC,CAAC,CAA3C,EAA8C;MAC5CP,GAAG,CAACQ,gBAAJ,OAA0BJ,MAAM,CAACE,YAAjC,QAD4C,CAE5C;;MAEA,IAAMG,eAAc,GAAGL,MAAM,CAACD,SAAP,CAAiBO,KAAjB,GAAyB,CAAhD;;MACA,IAAMC,aAAY,GAAGF,eAAc,GAAGL,MAAM,CAACE,YAAP,CAAoBM,MAA1D;;MAEAZ,GAAG,CAACK,iBAAJ,CAAsB;QACpBK,KAAK,EAAED,eADa;QAEpBI,GAAG,EAAEF;MAFe,CAAtB;MAIA;IACD;;IAED,IAAMG,iBAAiB,GAAGzB,iCAAiC,CAACe,MAAM,CAACF,IAAR,EAAcE,MAAM,CAACD,SAAP,CAAiBO,KAA/B,CAA3D;IACA,IAAMK,YAAY,GAAGC,KAAK,CAACF,iBAAiB,GAAG,CAArB,CAAL,CAA6BG,IAA7B,CAAkC,IAAlC,CAArB;IAEA,IAAMC,gBAAgB,GAAG5B,gCAAgC,CAACc,MAAM,CAACF,IAAR,EAAcE,MAAM,CAACD,SAAP,CAAiBU,GAA/B,CAAzD;IACA,IAAMM,WAAW,GAAGH,KAAK,CAACE,gBAAgB,GAAG,CAApB,CAAL,CAA4BD,IAA5B,CAAiC,IAAjC,CAApB;IAEAjB,GAAG,CAACQ,gBAAJ,CAAwBO,YAAxB,aAA+CX,MAAM,CAACE,YAAtD,aAA6Ea,WAA7E;IAEA,IAAMV,cAAc,GAAGL,MAAM,CAACD,SAAP,CAAiBO,KAAjB,GAAyBI,iBAAzB,GAA6C,CAApE;IACA,IAAMH,YAAY,GAAGF,cAAc,GAAGL,MAAM,CAACE,YAAP,CAAoBM,MAA1D;IAEAZ,GAAG,CAACK,iBAAJ,CAAsB;MACpBK,KAAK,EAAED,cADa;MAEpBI,GAAG,EAAEF;IAFe,CAAtB;EAID;AA/C2B,CAAvB;AAkDP,OAAO,IAAMS,SAAmB,GAAG;EACjC5B,IAAI,EAAE,WAD2B;EAEjCC,UAAU,EAAE,WAFqB;EAGjCC,SAAS,EAAE,iBAHsB;EAIjCG,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,IAAI,EAAC,KAAjC;IAAuC,OAAO,EAAC,aAA/C;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAL+B;EAYjCF,WAAW,EAAE;IAAE,cAAc,mBAAhB;IAAqCC,KAAK,EAAE;EAA5C,CAZoB;EAajCE,OAAO,EAAE,CAACC,IAAD,EAAkBC,GAAlB,KAA2C;IAClD;IACA,IAAMC,iBAAiB,GAAGb,UAAU,CAAC;MAAEc,IAAI,EAAEH,IAAI,CAACG,IAAb;MAAmBC,SAAS,EAAEJ,IAAI,CAACI;IAAnC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf;IAEA,IAAMa,iBAAiB,GAAGzB,iCAAiC,CAACe,MAAM,CAACF,IAAR,EAAcE,MAAM,CAACD,SAAP,CAAiBO,KAA/B,CAA3D;IACA,IAAMK,YAAY,GAAGC,KAAK,CAACF,iBAAiB,GAAG,CAArB,CAAL,CAA6BG,IAA7B,CAAkC,IAAlC,CAArB;IAEA,IAAMC,gBAAgB,GAAG5B,gCAAgC,CAACc,MAAM,CAACF,IAAR,EAAcE,MAAM,CAACD,SAAP,CAAiBU,GAA/B,CAAzD;IACA,IAAMM,WAAW,GAAGH,KAAK,CAACE,gBAAgB,GAAG,CAApB,CAAL,CAA4BD,IAA5B,CAAiC,IAAjC,CAApB;IAEAjB,GAAG,CAACQ,gBAAJ,CAAwBO,YAAxB,aAA+CX,MAAM,CAACE,YAAtD,aAA6Ea,WAA7E;IAEA,IAAMV,cAAc,GAAGL,MAAM,CAACD,SAAP,CAAiBO,KAAjB,GAAyBI,iBAAzB,GAA6C,CAApE;IACA,IAAMH,YAAY,GAAGF,cAAc,GAAGL,MAAM,CAACE,YAAP,CAAoBM,MAA1D;IAEAZ,GAAG,CAACK,iBAAJ,CAAsB;MACpBK,KAAK,EAAED,cADa;MAEpBI,GAAG,EAAEF;IAFe,CAAtB;EAID;AAjCgC,CAA5B"
+  "mappings": "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"
 }

package/esm/commands/comment.js

@@ -1,8 +1,15 @@
 import { selectWord } from '../utils/markdownUtils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 export var comment = {
   name: 'comment',
   keyCommand: 'comment',
   shortcuts: 'ctrlcmd+/',
+  value: '<!-- -->',
+  buttonProps: {
+    'aria-label': 'Insert comment (ctrl + /)',
+    title: 'Insert comment (ctrl + /)'
+  },
   execute: (state, api) => {
     // Adjust the selection to encompass the whole word if the caret is inside one
     var newSelectionRange = selectWord({
@@ -17,6 +24,19 @@ export var comment = {
       start: state2.selection.end - 4 - state1.selectedText.length,
       end: state2.selection.end - 4
     });
-  }
+  },
+  icon: /*#__PURE__*/_jsxs("svg", {
+    role: "img",
+    viewBox: "0 0 512 512",
+    width: "12",
+    height: "12",
+    children: [/*#__PURE__*/_jsx("path", {
+      fill: "currentColor",
+      d: "M281 72H231oLuLFozwYpLrBi5VTa8sg7fDqKkeyD81V172H281V72Z"
+    }), /*#__PURE__*/_jsx("path", {
+      fill: "currentColor",
+      d: "M287.817 501H213.333L298.667 334H438.857C438.857 334 438.857 333.021 438.857 308.308V187.875V74.6028C438.857 64.3818 438.857 67.2814 438.857 62.625C438.857 61.7594 439.31 62.625 426.667 62.625H256H73.1429C73.1429 65.4903 73.1429 77.3378 73.1429 79.8845V187.875V308.308C73.1429 311.005 73.1429 334 73.1429 334C73.1429 334 113.826 334 106.667 334H149.333H237.714V385.385H73.1429C53.7442 385.385 35.14 377.264 21.423 362.809C7.7061 348.355 0 328.75 0 308.308V77.0769C0 56.6349 7.7061 37.03 21.423 22.5753C35.14 8.12058 53.7442 0 73.1429 0H438.857C458.256 0 476.86 8.12058 490.577 22.5753C504.294 37.03 512 56.6349 512 77.0769V308.308C512 328.75 504.294 348.355 490.577 362.809C476.86 377.264 458.256 385.385 438.857 385.385H350.354L287.817 501Z"
+    })]
+  })
 };
 //# sourceMappingURL=comment.js.map

package/esm/commands/comment.js.map

@@ -6,6 +6,9 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
+    "buttonProps",
+    "title",
     "execute",
     "state",
     "api",
@@ -19,13 +22,14 @@
     "selectedText",
     "start",
     "end",
-    "length"
+    "length",
+    "icon"
   ],
   "sources": [
     "../../src/commands/comment.tsx"
   ],
   "sourcesContent": [
-    "import { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const comment: ICommand = {\n  name: 'comment',\n  keyCommand: 'comment',\n  shortcuts: 'ctrlcmd+/',\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the bold mark up\n    const state2 = api.replaceSelection(`<!-- ${state1.selectedText} -->`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: state2.selection.end - 4 - state1.selectedText.length,\n      end: state2.selection.end - 4,\n    });\n  },\n};\n"
+    "import { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const comment: ICommand = {\n  name: 'comment',\n  keyCommand: 'comment',\n  shortcuts: 'ctrlcmd+/',\n  value: '<!-- -->',\n  buttonProps: { 'aria-label': 'Insert comment (ctrl + /)', title: 'Insert comment (ctrl + /)' },\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the bold mark up\n    const state2 = api.replaceSelection(`<!-- ${state1.selectedText} -->`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: state2.selection.end - 4 - state1.selectedText.length,\n      end: state2.selection.end - 4,\n    });\n  },\n  icon: (\n    <svg role=\"img\" viewBox=\"0 0 512 512\" width=\"12\" height=\"12\">\n      <path fill=\"currentColor\" d=\"M281 72H231oLuLFozwYpLrBi5VTa8sg7fDqKkeyD81V172H281V72Z\" />\n      <path fill=\"currentColor\" d=\"M287.817 501H213.333L298.667 334H438.857C438.857 334 438.857 333.021 438.857 308.308V187.875V74.6028C438.857 64.3818 438.857 67.2814 438.857 62.625C438.857 61.7594 439.31 62.625 426.667 62.625H256H73.1429C73.1429 65.4903 73.1429 77.3378 73.1429 79.8845V187.875V308.308C73.1429 311.005 73.1429 334 73.1429 334C73.1429 334 113.826 334 106.667 334H149.333H237.714V385.385H73.1429C53.7442 385.385 35.14 377.264 21.423 362.809C7.7061 348.355 0 328.75 0 308.308V77.0769C0 56.6349 7.7061 37.03 21.423 22.5753C35.14 8.12058 53.7442 0 73.1429 0H438.857C458.256 0 476.86 8.12058 490.577 22.5753C504.294 37.03 512 56.6349 512 77.0769V308.308C512 328.75 504.294 348.355 490.577 362.809C476.86 377.264 458.256 385.385 438.857 385.385H350.354L287.817 501Z\" />\n    </svg>\n  )\n};\n"
   ],
-  "mappings": "AACA,SAASA,UAAT,QAA2B,wBAA3B;AAEA,OAAO,IAAMC,OAAiB,GAAG;EAC/BC,IAAI,EAAE,SADyB;EAE/BC,UAAU,EAAE,SAFmB;EAG/BC,SAAS,EAAE,WAHoB;EAI/BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGR,UAAU,CAAC;MAAES,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,WAA6BH,MAAM,CAACI,YAApC,UAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID;AAf8B,CAA1B"
+  "mappings": "AACA,SAASA,UAAT,QAA2B,wBAA3B;;;AAEA,OAAO,IAAMC,OAAiB,GAAG;EAC/BC,IAAI,EAAE,SADyB;EAE/BC,UAAU,EAAE,SAFmB;EAG/BC,SAAS,EAAE,WAHoB;EAI/BC,KAAK,EAAE,UAJwB;EAK/BC,WAAW,EAAE;IAAE,cAAc,2BAAhB;IAA6CC,KAAK,EAAE;EAApD,CALkB;EAM/BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGX,UAAU,CAAC;MAAEY,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,WAA6BH,MAAM,CAACI,YAApC,UAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID,CAjB8B;EAkB/BE,IAAI,eACF;IAAK,IAAI,EAAC,KAAV;IAAgB,OAAO,EAAC,aAAxB;IAAsC,KAAK,EAAC,IAA5C;IAAiD,MAAM,EAAC,IAAxD;IAAA,wBACE;MAAM,IAAI,EAAC,cAAX;MAA0B,CAAC,EAAC;IAA5B,EADF,eAEE;MAAM,IAAI,EAAC,cAAX;MAA0B,CAAC,EAAC;IAA5B,EAFF;EAAA;AAnB6B,CAA1B"
 }

package/esm/commands/fullscreen.js

@@ -3,10 +3,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 export var fullscreen = {
   name: 'fullscreen',
   keyCommand: 'fullscreen',
-  shortcuts: 'escape',
+  shortcuts: 'ctrlcmd+0',
+  value: 'fullscreen',
   buttonProps: {
-    'aria-label': 'fullscreen',
-    title: 'fullscreen'
+    'aria-label': 'Toggle fullscreen (ctrl + 0)',
+    title: 'Toggle fullscreen (ctrl+ 0)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     width: "12",

package/esm/commands/fullscreen.js.map

@@ -6,6 +6,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -21,7 +22,7 @@
     "../../src/commands/fullscreen.tsx"
   ],
   "sourcesContent": [
-    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { ContextStore, ExecuteCommandState } from '../Context';\n\nexport const fullscreen: ICommand = {\n  name: 'fullscreen',\n  keyCommand: 'fullscreen',\n  shortcuts: 'escape',\n  buttonProps: { 'aria-label': 'fullscreen', title: 'fullscreen' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 520 520\">\n      <path\n        fill=\"currentColor\"\n        d=\"M118 171.133334L118 342.200271C118 353.766938 126.675 365.333605 141.133333 365.333605L382.634614 365.333605C394.201281 365.333605 405.767948 356.658605 405.767948 342.200271L405.767948 171.133334C405.767948 159.566667 397.092948 148 382.634614 148L141.133333 148C126.674999 148 117.999999 156.675 118 171.133334zM465.353591 413.444444L370 413.444444 370 471.222222 474.0221 471.222222C500.027624 471.222222 520.254143 451 520.254143 425L520.254143 321 462.464089 321 462.464089 413.444444 465.353591 413.444444zM471.0221 43L367 43 367 100.777778 462.353591 100.777778 462.353591 196.111111 520.143647 196.111111 520.143647 89.2222219C517.254144 63.2222219 497.027624 43 471.0221 43zM57.7900547 100.777778L153.143646 100.777778 153.143646 43 46.2320439 43C20.2265191 43 0 63.2222219 0 89.2222219L0 193.222222 57.7900547 193.222222 57.7900547 100.777778zM57.7900547 321L0 321 0 425C0 451 20.2265191 471.222222 46.2320439 471.222223L150.254143 471.222223 150.254143 413.444445 57.7900547 413.444445 57.7900547 321z\"\n      />\n    </svg>\n  ),\n  execute: (\n    state: TextState,\n    api: TextAreaTextApi,\n    dispatch?: React.Dispatch<ContextStore>,\n    executeCommandState?: ExecuteCommandState,\n  ) => {\n    api.textArea.focus();\n    if (dispatch && executeCommandState && executeCommandState.fullscreen) {\n      dispatch({ fullscreen: false });\n    }\n  },\n};\n"
+    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { ContextStore, ExecuteCommandState } from '../Context';\n\nexport const fullscreen: ICommand = {\n  name: 'fullscreen',\n  keyCommand: 'fullscreen',\n  shortcuts: 'ctrlcmd+0',\n  value: 'fullscreen',\n  buttonProps: { 'aria-label': 'Toggle fullscreen (ctrl + 0)', title: 'Toggle fullscreen (ctrl+ 0)' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 520 520\">\n      <path\n        fill=\"currentColor\"\n        d=\"M118 171.133334L118 342.200271C118 353.766938 126.675 365.333605 141.133333 365.333605L382.634614 365.333605C394.201281 365.333605 405.767948 356.658605 405.767948 342.200271L405.767948 171.133334C405.767948 159.566667 397.092948 148 382.634614 148L141.133333 148C126.674999 148 117.999999 156.675 118 171.133334zM465.353591 413.444444L370 413.444444 370 471.222222 474.0221 471.222222C500.027624 471.222222 520.254143 451 520.254143 425L520.254143 321 462.464089 321 462.464089 413.444444 465.353591 413.444444zM471.0221 43L367 43 367 100.777778 462.353591 100.777778 462.353591 196.111111 520.143647 196.111111 520.143647 89.2222219C517.254144 63.2222219 497.027624 43 471.0221 43zM57.7900547 100.777778L153.143646 100.777778 153.143646 43 46.2320439 43C20.2265191 43 0 63.2222219 0 89.2222219L0 193.222222 57.7900547 193.222222 57.7900547 100.777778zM57.7900547 321L0 321 0 425C0 451 20.2265191 471.222222 46.2320439 471.222223L150.254143 471.222223 150.254143 413.444445 57.7900547 413.444445 57.7900547 321z\"\n      />\n    </svg>\n  ),\n  execute: (\n    state: TextState,\n    api: TextAreaTextApi,\n    dispatch?: React.Dispatch<ContextStore>,\n    executeCommandState?: ExecuteCommandState,\n  ) => {\n    api.textArea.focus();\n    if (dispatch && executeCommandState && executeCommandState.fullscreen) {\n      dispatch({ fullscreen: false });\n    }\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAIA,OAAO,IAAMC,UAAoB,GAAG;EAClCC,IAAI,EAAE,YAD4B;EAElCC,UAAU,EAAE,YAFsB;EAGlCC,SAAS,EAAE,QAHuB;EAIlCC,WAAW,EAAE;IAAE,cAAc,YAAhB;IAA8BC,KAAK,EAAE;EAArC,CAJqB;EAKlCC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,aAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EANgC;EAalCC,OAAO,EAAE,CACPC,KADO,EAEPC,GAFO,EAGPC,QAHO,EAIPC,mBAJO,KAKJ;IACHF,GAAG,CAACG,QAAJ,CAAaC,KAAb;;IACA,IAAIH,QAAQ,IAAIC,mBAAZ,IAAmCA,mBAAmB,CAACX,UAA3D,EAAuE;MACrEU,QAAQ,CAAC;QAAEV,UAAU,EAAE;MAAd,CAAD,CAAR;IACD;EACF;AAvBiC,CAA7B"
+  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAIA,OAAO,IAAMC,UAAoB,GAAG;EAClCC,IAAI,EAAE,YAD4B;EAElCC,UAAU,EAAE,YAFsB;EAGlCC,SAAS,EAAE,WAHuB;EAIlCC,KAAK,EAAE,YAJ2B;EAKlCC,WAAW,EAAE;IAAE,cAAc,8BAAhB;IAAgDC,KAAK,EAAE;EAAvD,CALqB;EAMlCC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,aAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAPgC;EAclCC,OAAO,EAAE,CACPC,KADO,EAEPC,GAFO,EAGPC,QAHO,EAIPC,mBAJO,KAKJ;IACHF,GAAG,CAACG,QAAJ,CAAaC,KAAb;;IACA,IAAIH,QAAQ,IAAIC,mBAAZ,IAAmCA,mBAAmB,CAACZ,UAA3D,EAAuE;MACrEW,QAAQ,CAAC;QAAEX,UAAU,EAAE;MAAd,CAAD,CAAR;IACD;EACF;AAxBiC,CAA7B"
 }

package/esm/commands/hr.js

@@ -4,9 +4,10 @@ export var hr = {
   name: 'hr',
   keyCommand: 'hr',
   shortcuts: 'ctrlcmd+h',
+  value: '----------',
   buttonProps: {
-    'aria-label': 'Insert HR',
-    title: 'Insert HR'
+    'aria-label': 'Insert HR (ctrl + h)',
+    title: 'Insert HR (ctrl + h)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     width: "12",

package/esm/commands/hr.js.map

@@ -6,6 +6,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -19,7 +20,7 @@
     "../../src/commands/hr.tsx"
   ],
   "sourcesContent": [
-    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\n\nexport const hr: ICommand = {\n  name: 'hr',\n  keyCommand: 'hr',\n  shortcuts: 'ctrlcmd+h',\n  buttonProps: { 'aria-label': 'Insert HR', title: 'Insert HR' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 175 175\">\n      <path\n        fill=\"currentColor\"\n        d=\"M0,129 L175,129 L175,154 L0,154 L0,129 Z M3,9 L28.2158203,9 L28.2158203,47.9824219 L55.7695313,47.9824219 L55.7695313,9 L81.0966797,9 L81.0966797,107.185547 L55.7695313,107.185547 L55.7695313,68.0214844 L28.2158203,68.0214844 L28.2158203,107.185547 L3,107.185547 L3,9 Z M93.1855469,100.603516 L93.1855469,19 L135.211914,19 C143.004922,19 148.960917,19.6679621 153.080078,21.0039063 C157.199239,22.3398504 160.520495,24.8168764 163.043945,28.4350586 C165.567395,32.0532407 166.829102,36.459935 166.829102,41.6552734 C166.829102,46.1826398 165.864267,50.0883625 163.93457,53.3725586 C162.004873,56.6567547 159.351579,59.3193257 155.974609,61.3603516 C153.822255,62.6591862 150.872089,63.7353473 147.124023,64.5888672 C150.129898,65.5908253 152.319329,66.5927684 153.692383,67.5947266 C154.620122,68.2626987 155.965323,69.6913953 157.728027,71.8808594 C159.490731,74.0703234 160.668942,75.7587831 161.262695,76.9462891 L173,100.603516 L144.953125,100.603516 L131.482422,75.6660156 C129.775382,72.4374839 128.253913,70.3408251 126.917969,69.3759766 C125.0996,68.1142515 123.040051,67.4833984 120.739258,67.4833984 L118.512695,67.4833984 L118.512695,100.603516 L93.1855469,100.603516 Z M118.512695,52.0644531 L129.144531,52.0644531 C130.294928,52.0644531 132.521468,51.6933631 135.824219,50.9511719 C137.494149,50.6171858 138.857905,49.7636787 139.915527,48.390625 C140.97315,47.0175713 141.501953,45.4404386 141.501953,43.6591797 C141.501953,41.0244009 140.667001,39.0019602 138.99707,37.5917969 C137.32714,36.1816336 134.191429,35.4765625 129.589844,35.4765625 L117.512695,35.4765625 L118.512695,52.0644531 Z\"\n        transform=\"translate(0 9)\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    api.replaceSelection(`${state.selectedText}\\n\\n----------\\n\\n`);\n  },\n};\n"
+    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\n\nexport const hr: ICommand = {\n  name: 'hr',\n  keyCommand: 'hr',\n  shortcuts: 'ctrlcmd+h',\n  value: '----------',\n  buttonProps: { 'aria-label': 'Insert HR (ctrl + h)', title: 'Insert HR (ctrl + h)' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 175 175\">\n      <path\n        fill=\"currentColor\"\n        d=\"M0,129 L175,129 L175,154 L0,154 L0,129 Z M3,9 L28.2158203,9 L28.2158203,47.9824219 L55.7695313,47.9824219 L55.7695313,9 L81.0966797,9 L81.0966797,107.185547 L55.7695313,107.185547 L55.7695313,68.0214844 L28.2158203,68.0214844 L28.2158203,107.185547 L3,107.185547 L3,9 Z M93.1855469,100.603516 L93.1855469,19 L135.211914,19 C143.004922,19 148.960917,19.6679621 153.080078,21.0039063 C157.199239,22.3398504 160.520495,24.8168764 163.043945,28.4350586 C165.567395,32.0532407 166.829102,36.459935 166.829102,41.6552734 C166.829102,46.1826398 165.864267,50.0883625 163.93457,53.3725586 C162.004873,56.6567547 159.351579,59.3193257 155.974609,61.3603516 C153.822255,62.6591862 150.872089,63.7353473 147.124023,64.5888672 C150.129898,65.5908253 152.319329,66.5927684 153.692383,67.5947266 C154.620122,68.2626987 155.965323,69.6913953 157.728027,71.8808594 C159.490731,74.0703234 160.668942,75.7587831 161.262695,76.9462891 L173,100.603516 L144.953125,100.603516 L131.482422,75.6660156 C129.775382,72.4374839 128.253913,70.3408251 126.917969,69.3759766 C125.0996,68.1142515 123.040051,67.4833984 120.739258,67.4833984 L118.512695,67.4833984 L118.512695,100.603516 L93.1855469,100.603516 Z M118.512695,52.0644531 L129.144531,52.0644531 C130.294928,52.0644531 132.521468,51.6933631 135.824219,50.9511719 C137.494149,50.6171858 138.857905,49.7636787 139.915527,48.390625 C140.97315,47.0175713 141.501953,45.4404386 141.501953,43.6591797 C141.501953,41.0244009 140.667001,39.0019602 138.99707,37.5917969 C137.32714,36.1816336 134.191429,35.4765625 129.589844,35.4765625 L117.512695,35.4765625 L118.512695,52.0644531 Z\"\n        transform=\"translate(0 9)\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    api.replaceSelection(`${state.selectedText}\\n\\n----------\\n\\n`);\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAGA,OAAO,IAAMC,EAAY,GAAG;EAC1BC,IAAI,EAAE,IADoB;EAE1BC,UAAU,EAAE,IAFc;EAG1BC,SAAS,EAAE,WAHe;EAI1BC,WAAW,EAAE;IAAE,cAAc,WAAhB;IAA6BC,KAAK,EAAE;EAApC,CAJa;EAK1BC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,aAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC,ukDAFJ;MAGE,SAAS,EAAC;IAHZ;EADF,EANwB;EAc1BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnDA,GAAG,CAACC,gBAAJ,CAAwBF,KAAK,CAACG,YAA9B;EACD;AAhByB,CAArB"
+  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAGA,OAAO,IAAMC,EAAY,GAAG;EAC1BC,IAAI,EAAE,IADoB;EAE1BC,UAAU,EAAE,IAFc;EAG1BC,SAAS,EAAE,WAHe;EAI1BC,KAAK,EAAE,YAJmB;EAK1BC,WAAW,EAAE;IAAE,cAAc,sBAAhB;IAAwCC,KAAK,EAAE;EAA/C,CALa;EAM1BC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,aAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC,ukDAFJ;MAGE,SAAS,EAAC;IAHZ;EADF,EAPwB;EAe1BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnDA,GAAG,CAACC,gBAAJ,CAAwBF,KAAK,CAACG,YAA9B;EACD;AAjByB,CAArB"
 }

package/esm/commands/image.js

@@ -4,10 +4,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 export var image = {
   name: 'image',
   keyCommand: 'image',
-  shortcuts: 'ctrlcmd+i',
+  shortcuts: 'ctrlcmd+k',
+  value: '![image]()',
   buttonProps: {
-    'aria-label': 'Add image',
-    title: 'Add image'
+    'aria-label': 'Add image (ctrl + k)',
+    title: 'Add image (ctrl + k)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     width: "12",

package/esm/commands/image.js.map

@@ -7,6 +7,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -29,7 +30,7 @@
     "../../src/commands/image.tsx"
   ],
   "sourcesContent": [
-    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const image: ICommand = {\n  name: 'image',\n  keyCommand: 'image',\n  shortcuts: 'ctrlcmd+i',\n  buttonProps: { 'aria-label': 'Add image', title: 'Add image' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 20 20\">\n      <path\n        fill=\"currentColor\"\n        d=\"M15 9c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm4-7H1c-.55 0-1 .45-1 1v14c0 .55.45 1 1 1h18c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm-1 13l-6-5-2 2-4-5-4 8V4h16v11z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Select everything\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the image\n    const imageTemplate = state1.selectedText || 'https://example.com/your-image.png';\n    api.replaceSelection(`![](${imageTemplate})`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: 4 + state1.selection.start,\n      end: 4 + state1.selection.start + imageTemplate.length,\n    });\n  },\n};\n"
+    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const image: ICommand = {\n  name: 'image',\n  keyCommand: 'image',\n  shortcuts: 'ctrlcmd+k',\n  value: '![image]()',\n  buttonProps: { 'aria-label': 'Add image (ctrl + k)', title: 'Add image (ctrl + k)' },\n  icon: (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 20 20\">\n      <path\n        fill=\"currentColor\"\n        d=\"M15 9c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm4-7H1c-.55 0-1 .45-1 1v14c0 .55.45 1 1 1h18c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm-1 13l-6-5-2 2-4-5-4 8V4h16v11z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Select everything\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the image\n    const imageTemplate = state1.selectedText || 'https://example.com/your-image.png';\n    api.replaceSelection(`![](${imageTemplate})`);\n    // Adjust the selection to not contain the **\n    api.setSelectionRange({\n      start: 4 + state1.selection.start,\n      end: 4 + state1.selection.start + imageTemplate.length,\n    });\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,KAAe,GAAG;EAC7BC,IAAI,EAAE,OADuB;EAE7BC,UAAU,EAAE,OAFiB;EAG7BC,SAAS,EAAE,WAHkB;EAI7BC,WAAW,EAAE;IAAE,cAAc,WAAhB;IAA6BC,KAAK,EAAE;EAApC,CAJgB;EAK7BC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,WAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAN2B;EAa7BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGX,UAAU,CAAC;MAAEY,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,aAAa,GAAGF,MAAM,CAACG,YAAP,IAAuB,oCAA7C;IACAP,GAAG,CAACQ,gBAAJ,UAA4BF,aAA5B,QANmD,CAOnD;;IACAN,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAE,IAAIL,MAAM,CAACD,SAAP,CAAiBM,KADR;MAEpBC,GAAG,EAAE,IAAIN,MAAM,CAACD,SAAP,CAAiBM,KAArB,GAA6BH,aAAa,CAACK;IAF5B,CAAtB;EAID;AAzB4B,CAAxB"
+  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,KAAe,GAAG;EAC7BC,IAAI,EAAE,OADuB;EAE7BC,UAAU,EAAE,OAFiB;EAG7BC,SAAS,EAAE,WAHkB;EAI7BC,KAAK,EAAE,YAJsB;EAK7BC,WAAW,EAAE;IAAE,cAAc,sBAAhB;IAAwCC,KAAK,EAAE;EAA/C,CALgB;EAM7BC,IAAI,eACF;IAAK,KAAK,EAAC,IAAX;IAAgB,MAAM,EAAC,IAAvB;IAA4B,OAAO,EAAC,WAApC;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAP2B;EAc7BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGZ,UAAU,CAAC;MAAEa,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,aAAa,GAAGF,MAAM,CAACG,YAAP,IAAuB,oCAA7C;IACAP,GAAG,CAACQ,gBAAJ,UAA4BF,aAA5B,QANmD,CAOnD;;IACAN,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAE,IAAIL,MAAM,CAACD,SAAP,CAAiBM,KADR;MAEpBC,GAAG,EAAE,IAAIN,MAAM,CAACD,SAAP,CAAiBM,KAArB,GAA6BH,aAAa,CAACK;IAF5B,CAAtB;EAID;AA1B4B,CAAxB"
 }

package/esm/commands/index.d.ts

@@ -1,11 +1,18 @@
 import React from 'react';
+import { ContextStore, ExecuteCommandState } from '../Context';
 import { bold } from './bold';
 import { code, codeBlock } from './code';
+import { divider } from './divider';
+import { fullscreen } from './fullscreen';
+import { group } from './group';
+import { hr } from './hr';
+import { image } from './image';
 import { italic } from './italic';
 import { link } from './link';
-import { unorderedListCommand, orderedListCommand, checkedListCommand } from './list';
+import { checkedListCommand, orderedListCommand, unorderedListCommand } from './list';
+import { codeEdit, codeLive, codePreview } from './preview';
 import { quote } from './quote';
-import { hr } from './hr';
+import { strikethrough } from './strikeThrough';
 import { title } from './title';
 import { title1 } from './title1';
 import { title2 } from './title2';
@@ -13,13 +20,6 @@ import { title3 } from './title3';
 import { title4 } from './title4';
 import { title5 } from './title5';
 import { title6 } from './title6';
-import { group } from './group';
-import { divider } from './divider';
-import { codePreview, codeEdit, codeLive } from './preview';
-import { fullscreen } from './fullscreen';
-import { image } from './image';
-import { strikethrough } from './strikeThrough';
-import { ContextStore, ExecuteCommandState } from '../Context';
 export interface CommandOrchestrator {
     executeCommand(command: ICommand): void;
 }

package/esm/commands/index.js

@@ -1,10 +1,18 @@
+import { insertTextAtPosition } from '../utils/InsertTextAtPosition';
 import { bold } from './bold';
 import { code, codeBlock } from './code';
+import { comment } from './comment';
+import { divider } from './divider';
+import { fullscreen } from './fullscreen';
+import { group } from './group';
+import { hr } from './hr';
+import { image } from './image';
 import { italic } from './italic';
 import { link } from './link';
-import { unorderedListCommand, orderedListCommand, checkedListCommand } from './list';
+import { checkedListCommand, orderedListCommand, unorderedListCommand } from './list';
+import { codeEdit, codeLive, codePreview } from './preview';
 import { quote } from './quote';
-import { hr } from './hr';
+import { strikethrough } from './strikeThrough';
 import { title } from './title';
 import { title1 } from './title1';
 import { title2 } from './title2';
@@ -12,16 +20,15 @@ import { title3 } from './title3';
 import { title4 } from './title4';
 import { title5 } from './title5';
 import { title6 } from './title6';
-import { comment } from './comment';
-import { group } from './group';
-import { divider } from './divider';
-import { codePreview, codeEdit, codeLive } from './preview';
-import { fullscreen } from './fullscreen';
-import { image } from './image';
-import { strikethrough } from './strikeThrough';
-import { insertTextAtPosition } from '../utils/InsertTextAtPosition';
 
-var getCommands = () => [comment, bold, italic, strikethrough, hr, title, divider, link, quote, code, codeBlock, image, divider, unorderedListCommand, orderedListCommand, checkedListCommand];
+var getCommands = () => [comment, bold, italic, strikethrough, hr, group([title1, title2, title3, title4, title5, title6], {
+  name: "title",
+  groupName: "title",
+  buttonProps: {
+    "aria-label": "Insert title",
+    title: "Insert title"
+  }
+}), divider, link, quote, code, codeBlock, image, divider, unorderedListCommand, orderedListCommand, checkedListCommand];
 
 var getExtraCommands = () => [codeEdit, codeLive, codePreview, divider, fullscreen];
 
@@ -86,7 +93,6 @@ class TextAreaCommandOrchestrator {
 
 }
 
-export { // Toolbars.
-title, title1, title2, title3, title4, title5, title6, bold, codeBlock, italic, strikethrough, hr, group, divider, link, quote, code, image, unorderedListCommand, orderedListCommand, checkedListCommand, codeEdit, codeLive, codePreview, fullscreen, // Tool method.
+export { title, title1, title2, title3, title4, title5, title6, bold, codeBlock, italic, strikethrough, hr, group, divider, link, quote, code, image, unorderedListCommand, orderedListCommand, checkedListCommand, codeEdit, codeLive, codePreview, fullscreen, // Tool method.
 getCommands, getExtraCommands, getStateFromTextArea, TextAreaCommandOrchestrator, TextAreaTextApi };
 //# sourceMappingURL=index.js.map

package/esm/commands/index.js.map

@@ -1,16 +1,26 @@
 {
   "version": 3,
   "names": [
+    "insertTextAtPosition",
     "bold",
     "code",
     "codeBlock",
+    "comment",
+    "divider",
+    "fullscreen",
+    "group",
+    "hr",
+    "image",
     "italic",
     "link",
-    "unorderedListCommand",
-    "orderedListCommand",
     "checkedListCommand",
+    "orderedListCommand",
+    "unorderedListCommand",
+    "codeEdit",
+    "codeLive",
+    "codePreview",
     "quote",
-    "hr",
+    "strikethrough",
     "title",
     "title1",
     "title2",
@@ -18,17 +28,10 @@
     "title4",
     "title5",
     "title6",
-    "comment",
-    "group",
-    "divider",
-    "codePreview",
-    "codeEdit",
-    "codeLive",
-    "fullscreen",
-    "image",
-    "strikethrough",
-    "insertTextAtPosition",
     "getCommands",
+    "name",
+    "groupName",
+    "buttonProps",
     "getExtraCommands",
     "getStateFromTextArea",
     "textArea",
@@ -59,7 +62,7 @@
     "../../src/commands/index.ts"
   ],
   "sourcesContent": [
-    "import React from 'react';\nimport { bold } from './bold';\nimport { code, codeBlock } from './code';\nimport { italic } from './italic';\nimport { link } from './link';\nimport { unorderedListCommand, orderedListCommand, checkedListCommand } from './list';\nimport { quote } from './quote';\nimport { hr } from './hr';\nimport { title } from './title';\nimport { title1 } from './title1';\nimport { title2 } from './title2';\nimport { title3 } from './title3';\nimport { title4 } from './title4';\nimport { title5 } from './title5';\nimport { title6 } from './title6';\nimport { comment } from './comment';\nimport { group } from './group';\nimport { divider } from './divider';\nimport { codePreview, codeEdit, codeLive } from './preview';\nimport { fullscreen } from './fullscreen';\nimport { image } from './image';\nimport { strikethrough } from './strikeThrough';\nimport { insertTextAtPosition } from '../utils/InsertTextAtPosition';\nimport { ContextStore, ExecuteCommandState } from '../Context';\n\nexport interface CommandOrchestrator {\n  executeCommand(command: ICommand): void;\n}\n\nexport interface ICommandChildHandle<T = string> extends ICommandBase<T> {\n  children?: (handle: {\n    close: () => void;\n    execute: () => void;\n    getState?: TextAreaCommandOrchestrator['getState'];\n    textApi?: TextAreaTextApi;\n  }) => React.ReactElement;\n}\n\nexport interface ICommandChildCommands<T = string> extends ICommandBase<T> {\n  children?: Array<ICommand<T>>;\n}\n\nexport interface ICommandBase<T> {\n  parent?: ICommand<any>;\n  keyCommand?: string;\n  name?: string;\n  shortcuts?: string;\n  groupName?: string;\n  icon?: React.ReactElement;\n  value?: T;\n  position?: 'right';\n  liProps?: React.LiHTMLAttributes<HTMLLIElement>;\n  buttonProps?: React.ButtonHTMLAttributes<HTMLButtonElement> | null;\n  render?: (\n    command: ICommand<T>,\n    disabled: boolean,\n    executeCommand: (command: ICommand<T>, name?: string) => void,\n    index: number,\n  ) => void | undefined | null | React.ReactElement;\n  execute?: (\n    state: TextState,\n    api: TextAreaTextApi,\n    dispatch?: React.Dispatch<ContextStore>,\n    executeCommandState?: ExecuteCommandState,\n  ) => void;\n}\n\nexport type ICommand<T = string> = ICommandChildCommands<T> | ICommandChildHandle<T>;\n\nexport interface TextRange {\n  start: number;\n  end: number;\n}\n\nexport interface TextState {\n  text: string;\n  selectedText: string;\n  selection: TextRange;\n}\n\nconst getCommands: () => ICommand[] = () => [\n  comment,\n  bold,\n  italic,\n  strikethrough,\n  hr,\n  title,\n  divider,\n  link,\n  quote,\n  code,\n  codeBlock,\n  image,\n  divider,\n  unorderedListCommand,\n  orderedListCommand,\n  checkedListCommand,\n];\n\nconst getExtraCommands: () => ICommand[] = () => [codeEdit, codeLive, codePreview, divider, fullscreen];\n\nfunction getStateFromTextArea(textArea: HTMLTextAreaElement): TextState {\n  return {\n    selection: {\n      start: textArea.selectionStart,\n      end: textArea.selectionEnd,\n    },\n    text: textArea.value,\n    selectedText: textArea.value.slice(textArea.selectionStart, textArea.selectionEnd),\n  };\n}\n\nclass TextAreaTextApi {\n  textArea: HTMLTextAreaElement;\n\n  constructor(textArea: HTMLTextAreaElement) {\n    this.textArea = textArea;\n  }\n\n  /**\n   * Replaces the current selection with the new text. This will make the new selectedText to be empty, the\n   * selection start and selection end will be the same and will both point to the end\n   * @param text Text that should replace the current selection\n   */\n  replaceSelection(text: string): TextState {\n    insertTextAtPosition(this.textArea, text);\n    return getStateFromTextArea(this.textArea);\n  }\n\n  /**\n   * Selects the specified text range\n   * @param selection\n   */\n  setSelectionRange(selection: TextRange): TextState {\n    this.textArea.focus();\n    this.textArea.selectionStart = selection.start;\n    this.textArea.selectionEnd = selection.end;\n    return getStateFromTextArea(this.textArea);\n  }\n}\n\nclass TextAreaCommandOrchestrator implements CommandOrchestrator {\n  textArea: HTMLTextAreaElement;\n  textApi: TextAreaTextApi;\n\n  constructor(textArea: HTMLTextAreaElement) {\n    this.textArea = textArea;\n    this.textApi = new TextAreaTextApi(textArea);\n  }\n\n  getState() {\n    if (!this.textArea) return false;\n    return getStateFromTextArea(this.textArea);\n  }\n\n  executeCommand(\n    command: ICommand<string>,\n    dispatch?: React.Dispatch<ContextStore>,\n    state?: ExecuteCommandState,\n  ): void {\n    command.execute && command.execute(getStateFromTextArea(this.textArea), this.textApi, dispatch, state);\n  }\n}\n\nexport {\n  // Toolbars.\n  title,\n  title1,\n  title2,\n  title3,\n  title4,\n  title5,\n  title6,\n  bold,\n  codeBlock,\n  italic,\n  strikethrough,\n  hr,\n  group,\n  divider,\n  link,\n  quote,\n  code,\n  image,\n  unorderedListCommand,\n  orderedListCommand,\n  checkedListCommand,\n  codeEdit,\n  codeLive,\n  codePreview,\n  fullscreen,\n  // Tool method.\n  getCommands,\n  getExtraCommands,\n  getStateFromTextArea,\n  TextAreaCommandOrchestrator,\n  TextAreaTextApi,\n};\n"
+    "import React from 'react';\nimport { ContextStore, ExecuteCommandState } from '../Context';\nimport { insertTextAtPosition } from '../utils/InsertTextAtPosition';\nimport { bold } from './bold';\nimport { code, codeBlock } from './code';\nimport { comment } from './comment';\nimport { divider } from './divider';\nimport { fullscreen } from './fullscreen';\nimport { group } from './group';\nimport { hr } from './hr';\nimport { image } from './image';\nimport { italic } from './italic';\nimport { link } from './link';\nimport { checkedListCommand, orderedListCommand, unorderedListCommand } from './list';\nimport { codeEdit, codeLive, codePreview } from './preview';\nimport { quote } from './quote';\nimport { strikethrough } from './strikeThrough';\nimport { title } from './title';\nimport { title1 } from './title1';\nimport { title2 } from './title2';\nimport { title3 } from './title3';\nimport { title4 } from './title4';\nimport { title5 } from './title5';\nimport { title6 } from './title6';\n\nexport interface CommandOrchestrator {\n  executeCommand(command: ICommand): void;\n}\n\nexport interface ICommandChildHandle<T = string> extends ICommandBase<T> {\n  children?: (handle: {\n    close: () => void;\n    execute: () => void;\n    getState?: TextAreaCommandOrchestrator['getState'];\n    textApi?: TextAreaTextApi;\n  }) => React.ReactElement;\n}\n\nexport interface ICommandChildCommands<T = string> extends ICommandBase<T> {\n  children?: Array<ICommand<T>>;\n}\n\nexport interface ICommandBase<T> {\n  parent?: ICommand<any>;\n  keyCommand?: string;\n  name?: string;\n  shortcuts?: string;\n  groupName?: string;\n  icon?: React.ReactElement;\n  value?: T;\n  position?: 'right';\n  liProps?: React.LiHTMLAttributes<HTMLLIElement>;\n  buttonProps?: React.ButtonHTMLAttributes<HTMLButtonElement> | null;\n  render?: (\n    command: ICommand<T>,\n    disabled: boolean,\n    executeCommand: (command: ICommand<T>, name?: string) => void,\n    index: number,\n  ) => void | undefined | null | React.ReactElement;\n  execute?: (\n    state: TextState,\n    api: TextAreaTextApi,\n    dispatch?: React.Dispatch<ContextStore>,\n    executeCommandState?: ExecuteCommandState,\n  ) => void;\n}\n\nexport type ICommand<T = string> = ICommandChildCommands<T> | ICommandChildHandle<T>;\n\nexport interface TextRange {\n  start: number;\n  end: number;\n}\n\nexport interface TextState {\n  text: string;\n  selectedText: string;\n  selection: TextRange;\n}\n\nconst getCommands: () => ICommand[] = () => [\n  comment,\n  bold,\n  italic,\n  strikethrough,\n  hr,\n  group([title1, title2, title3, title4, title5, title6], {\n\t\t\tname: \"title\",\n\t\t\tgroupName: \"title\",\n\t\t\tbuttonProps: { \"aria-label\": \"Insert title\", title: \"Insert title\" },\n\t\t}),\n  divider,\n  link,\n  quote,\n  code,\n  codeBlock,\n  image,\n  divider,\n  unorderedListCommand,\n  orderedListCommand,\n  checkedListCommand,\n];\n\nconst getExtraCommands: () => ICommand[] = () => [codeEdit, codeLive, codePreview, divider, fullscreen];\n\nfunction getStateFromTextArea(textArea: HTMLTextAreaElement): TextState {\n  return {\n    selection: {\n      start: textArea.selectionStart,\n      end: textArea.selectionEnd,\n    },\n    text: textArea.value,\n    selectedText: textArea.value.slice(textArea.selectionStart, textArea.selectionEnd),\n  };\n}\n\nclass TextAreaTextApi {\n  textArea: HTMLTextAreaElement;\n\n  constructor(textArea: HTMLTextAreaElement) {\n    this.textArea = textArea;\n  }\n\n  /**\n   * Replaces the current selection with the new text. This will make the new selectedText to be empty, the\n   * selection start and selection end will be the same and will both point to the end\n   * @param text Text that should replace the current selection\n   */\n  replaceSelection(text: string): TextState {\n    insertTextAtPosition(this.textArea, text);\n    return getStateFromTextArea(this.textArea);\n  }\n\n  /**\n   * Selects the specified text range\n   * @param selection\n   */\n  setSelectionRange(selection: TextRange): TextState {\n    this.textArea.focus();\n    this.textArea.selectionStart = selection.start;\n    this.textArea.selectionEnd = selection.end;\n    return getStateFromTextArea(this.textArea);\n  }\n}\n\nclass TextAreaCommandOrchestrator implements CommandOrchestrator {\n  textArea: HTMLTextAreaElement;\n  textApi: TextAreaTextApi;\n\n  constructor(textArea: HTMLTextAreaElement) {\n    this.textArea = textArea;\n    this.textApi = new TextAreaTextApi(textArea);\n  }\n\n  getState() {\n    if (!this.textArea) return false;\n    return getStateFromTextArea(this.textArea);\n  }\n\n  executeCommand(\n    command: ICommand<string>,\n    dispatch?: React.Dispatch<ContextStore>,\n    state?: ExecuteCommandState,\n  ): void {\n    command.execute && command.execute(getStateFromTextArea(this.textArea), this.textApi, dispatch, state);\n  }\n}\n\nexport {\n  title,\n  title1,\n  title2,\n  title3,\n  title4,\n  title5,\n  title6,\n  bold,\n  codeBlock,\n  italic,\n  strikethrough,\n  hr,\n  group,\n  divider,\n  link,\n  quote,\n  code,\n  image,\n  unorderedListCommand,\n  orderedListCommand,\n  checkedListCommand,\n  codeEdit,\n  codeLive,\n  codePreview,\n  fullscreen,\n  // Tool method.\n  getCommands,\n  getExtraCommands,\n  getStateFromTextArea,\n  TextAreaCommandOrchestrator,\n  TextAreaTextApi,\n};\n\n"
   ],
-  "mappings": "AACA,SAASA,IAAT,QAAqB,QAArB;AACA,SAASC,IAAT,EAAeC,SAAf,QAAgC,QAAhC;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,IAAT,QAAqB,QAArB;AACA,SAASC,oBAAT,EAA+BC,kBAA/B,EAAmDC,kBAAnD,QAA6E,QAA7E;AACA,SAASC,KAAT,QAAsB,SAAtB;AACA,SAASC,EAAT,QAAmB,MAAnB;AACA,SAASC,KAAT,QAAsB,SAAtB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,OAAT,QAAwB,WAAxB;AACA,SAASC,KAAT,QAAsB,SAAtB;AACA,SAASC,OAAT,QAAwB,WAAxB;AACA,SAASC,WAAT,EAAsBC,QAAtB,EAAgCC,QAAhC,QAAgD,WAAhD;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAASC,KAAT,QAAsB,SAAtB;AACA,SAASC,aAAT,QAA8B,iBAA9B;AACA,SAASC,oBAAT,QAAqC,+BAArC;;AA0DA,IAAMC,WAA6B,GAAG,MAAM,CAC1CV,OAD0C,EAE1CjB,IAF0C,EAG1CG,MAH0C,EAI1CsB,aAJ0C,EAK1ChB,EAL0C,EAM1CC,KAN0C,EAO1CS,OAP0C,EAQ1Cf,IAR0C,EAS1CI,KAT0C,EAU1CP,IAV0C,EAW1CC,SAX0C,EAY1CsB,KAZ0C,EAa1CL,OAb0C,EAc1Cd,oBAd0C,EAe1CC,kBAf0C,EAgB1CC,kBAhB0C,CAA5C;;AAmBA,IAAMqB,gBAAkC,GAAG,MAAM,CAACP,QAAD,EAAWC,QAAX,EAAqBF,WAArB,EAAkCD,OAAlC,EAA2CI,UAA3C,CAAjD;;AAEA,SAASM,oBAAT,CAA8BC,QAA9B,EAAwE;EACtE,OAAO;IACLC,SAAS,EAAE;MACTC,KAAK,EAAEF,QAAQ,CAACG,cADP;MAETC,GAAG,EAAEJ,QAAQ,CAACK;IAFL,CADN;IAKLC,IAAI,EAAEN,QAAQ,CAACO,KALV;IAMLC,YAAY,EAAER,QAAQ,CAACO,KAAT,CAAeE,KAAf,CAAqBT,QAAQ,CAACG,cAA9B,EAA8CH,QAAQ,CAACK,YAAvD;EANT,CAAP;AAQD;;AAED,MAAMK,eAAN,CAAsB;EAGpBC,WAAW,CAACX,QAAD,EAAgC;IAAA,KAF3CA,QAE2C;IACzC,KAAKA,QAAL,GAAgBA,QAAhB;EACD;EAED;AACF;AACA;AACA;AACA;;;EACEY,gBAAgB,CAACN,IAAD,EAA0B;IACxCV,oBAAoB,CAAC,KAAKI,QAAN,EAAgBM,IAAhB,CAApB;IACA,OAAOP,oBAAoB,CAAC,KAAKC,QAAN,CAA3B;EACD;EAED;AACF;AACA;AACA;;;EACEa,iBAAiB,CAACZ,SAAD,EAAkC;IACjD,KAAKD,QAAL,CAAcc,KAAd;IACA,KAAKd,QAAL,CAAcG,cAAd,GAA+BF,SAAS,CAACC,KAAzC;IACA,KAAKF,QAAL,CAAcK,YAAd,GAA6BJ,SAAS,CAACG,GAAvC;IACA,OAAOL,oBAAoB,CAAC,KAAKC,QAAN,CAA3B;EACD;;AA1BmB;;AA6BtB,MAAMe,2BAAN,CAAiE;EAI/DJ,WAAW,CAACX,QAAD,EAAgC;IAAA,KAH3CA,QAG2C;IAAA,KAF3CgB,OAE2C;IACzC,KAAKhB,QAAL,GAAgBA,QAAhB;IACA,KAAKgB,OAAL,GAAe,IAAIN,eAAJ,CAAoBV,QAApB,CAAf;EACD;;EAEDiB,QAAQ,GAAG;IACT,IAAI,CAAC,KAAKjB,QAAV,EAAoB,OAAO,KAAP;IACpB,OAAOD,oBAAoB,CAAC,KAAKC,QAAN,CAA3B;EACD;;EAEDkB,cAAc,CACZC,OADY,EAEZC,QAFY,EAGZC,KAHY,EAIN;IACNF,OAAO,CAACG,OAAR,IAAmBH,OAAO,CAACG,OAAR,CAAgBvB,oBAAoB,CAAC,KAAKC,QAAN,CAApC,EAAqD,KAAKgB,OAA1D,EAAmEI,QAAnE,EAA6EC,KAA7E,CAAnB;EACD;;AApB8D;;AAuBjE,SACE;AACAzC,KAFF,EAGEC,MAHF,EAIEC,MAJF,EAKEC,MALF,EAMEC,MANF,EAOEC,MAPF,EAQEC,MARF,EASEhB,IATF,EAUEE,SAVF,EAWEC,MAXF,EAYEsB,aAZF,EAaEhB,EAbF,EAcES,KAdF,EAeEC,OAfF,EAgBEf,IAhBF,EAiBEI,KAjBF,EAkBEP,IAlBF,EAmBEuB,KAnBF,EAoBEnB,oBApBF,EAqBEC,kBArBF,EAsBEC,kBAtBF,EAuBEc,QAvBF,EAwBEC,QAxBF,EAyBEF,WAzBF,EA0BEG,UA1BF,EA2BE;AACAI,WA5BF,EA6BEC,gBA7BF,EA8BEC,oBA9BF,EA+BEgB,2BA/BF,EAgCEL,eAhCF"
+  "mappings": "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"
 }

package/esm/commands/italic.js

@@ -5,9 +5,10 @@ export var italic = {
   name: 'italic',
   keyCommand: 'italic',
   shortcuts: 'ctrlcmd+i',
+  value: '* *',
   buttonProps: {
-    'aria-label': 'Add italic text',
-    title: 'Add italic text'
+    'aria-label': 'Add italic text (ctrl + i)',
+    title: 'Add italic text (ctrl + i)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     "data-name": "italic",

package/esm/commands/italic.js.map

@@ -7,6 +7,7 @@
     "name",
     "keyCommand",
     "shortcuts",
+    "value",
     "buttonProps",
     "title",
     "icon",
@@ -29,7 +30,7 @@
     "../../src/commands/italic.tsx"
   ],
   "sourcesContent": [
-    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const italic: ICommand = {\n  name: 'italic',\n  keyCommand: 'italic',\n  shortcuts: 'ctrlcmd+i',\n  buttonProps: { 'aria-label': 'Add italic text', title: 'Add italic text' },\n  icon: (\n    <svg data-name=\"italic\" width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 320 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M204.758 416h-33.849l62.092-320h40.725a16 16 0 0 0 15.704-12.937l6.242-32C297.599 41.184 290.034 32 279.968 32H120.235a16 16 0 0 0-15.704 12.937l-6.242 32C96.362 86.816 103.927 96 113.993 96h33.846l-62.09 320H46.278a16 16 0 0 0-15.704 12.935l-6.245 32C22.402 470.815 29.967 480 40.034 480h158.479a16 16 0 0 0 15.704-12.935l6.245-32c1.927-9.88-5.638-19.065-15.704-19.065z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the italic mark up\n    const state2 = api.replaceSelection(`*${state1.selectedText}*`);\n    // Adjust the selection to not contain the *\n    api.setSelectionRange({\n      start: state2.selection.end - 1 - state1.selectedText.length,\n      end: state2.selection.end - 1,\n    });\n  },\n};\n"
+    "import * as React from 'react';\nimport { ICommand, TextState, TextAreaTextApi } from './';\nimport { selectWord } from '../utils/markdownUtils';\n\nexport const italic: ICommand = {\n  name: 'italic',\n  keyCommand: 'italic',\n  shortcuts: 'ctrlcmd+i',\n  value: '* *',\n  buttonProps: { 'aria-label': 'Add italic text (ctrl + i)', title: 'Add italic text (ctrl + i)' },\n  icon: (\n    <svg data-name=\"italic\" width=\"12\" height=\"12\" role=\"img\" viewBox=\"0 0 320 512\">\n      <path\n        fill=\"currentColor\"\n        d=\"M204.758 416h-33.849l62.092-320h40.725a16 16 0 0 0 15.704-12.937l6.242-32C297.599 41.184 290.034 32 279.968 32H120.235a16 16 0 0 0-15.704 12.937l-6.242 32C96.362 86.816 103.927 96 113.993 96h33.846l-62.09 320H46.278a16 16 0 0 0-15.704 12.935l-6.245 32C22.402 470.815 29.967 480 40.034 480h158.479a16 16 0 0 0 15.704-12.935l6.245-32c1.927-9.88-5.638-19.065-15.704-19.065z\"\n      />\n    </svg>\n  ),\n  execute: (state: TextState, api: TextAreaTextApi) => {\n    // Adjust the selection to encompass the whole word if the caret is inside one\n    const newSelectionRange = selectWord({ text: state.text, selection: state.selection });\n    const state1 = api.setSelectionRange(newSelectionRange);\n    // Replaces the current selection with the italic mark up\n    const state2 = api.replaceSelection(`*${state1.selectedText}*`);\n    // Adjust the selection to not contain the *\n    api.setSelectionRange({\n      start: state2.selection.end - 1 - state1.selectedText.length,\n      end: state2.selection.end - 1,\n    });\n  },\n};\n"
   ],
-  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,MAAgB,GAAG;EAC9BC,IAAI,EAAE,QADwB;EAE9BC,UAAU,EAAE,QAFkB;EAG9BC,SAAS,EAAE,WAHmB;EAI9BC,WAAW,EAAE;IAAE,cAAc,iBAAhB;IAAmCC,KAAK,EAAE;EAA1C,CAJiB;EAK9BC,IAAI,eACF;IAAK,aAAU,QAAf;IAAwB,KAAK,EAAC,IAA9B;IAAmC,MAAM,EAAC,IAA1C;IAA+C,IAAI,EAAC,KAApD;IAA0D,OAAO,EAAC,aAAlE;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAN4B;EAa9BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGX,UAAU,CAAC;MAAEY,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,OAAyBH,MAAM,CAACI,YAAhC,OAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID;AAxB6B,CAAzB"
+  "mappings": "AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT,QAA2B,wBAA3B;;AAEA,OAAO,IAAMC,MAAgB,GAAG;EAC9BC,IAAI,EAAE,QADwB;EAE9BC,UAAU,EAAE,QAFkB;EAG9BC,SAAS,EAAE,WAHmB;EAI9BC,KAAK,EAAE,KAJuB;EAK9BC,WAAW,EAAE;IAAE,cAAc,4BAAhB;IAA8CC,KAAK,EAAE;EAArD,CALiB;EAM9BC,IAAI,eACF;IAAK,aAAU,QAAf;IAAwB,KAAK,EAAC,IAA9B;IAAmC,MAAM,EAAC,IAA1C;IAA+C,IAAI,EAAC,KAApD;IAA0D,OAAO,EAAC,aAAlE;IAAA,uBACE;MACE,IAAI,EAAC,cADP;MAEE,CAAC,EAAC;IAFJ;EADF,EAP4B;EAc9BC,OAAO,EAAE,CAACC,KAAD,EAAmBC,GAAnB,KAA4C;IACnD;IACA,IAAMC,iBAAiB,GAAGZ,UAAU,CAAC;MAAEa,IAAI,EAAEH,KAAK,CAACG,IAAd;MAAoBC,SAAS,EAAEJ,KAAK,CAACI;IAArC,CAAD,CAApC;IACA,IAAMC,MAAM,GAAGJ,GAAG,CAACK,iBAAJ,CAAsBJ,iBAAtB,CAAf,CAHmD,CAInD;;IACA,IAAMK,MAAM,GAAGN,GAAG,CAACO,gBAAJ,OAAyBH,MAAM,CAACI,YAAhC,OAAf,CALmD,CAMnD;;IACAR,GAAG,CAACK,iBAAJ,CAAsB;MACpBI,KAAK,EAAEH,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB,CAAvB,GAA2BN,MAAM,CAACI,YAAP,CAAoBG,MADlC;MAEpBD,GAAG,EAAEJ,MAAM,CAACH,SAAP,CAAiBO,GAAjB,GAAuB;IAFR,CAAtB;EAID;AAzB6B,CAAzB"
 }

package/esm/commands/link.js

@@ -4,10 +4,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 export var link = {
   name: 'link',
   keyCommand: 'link',
-  shortcuts: 'ctrlcmd+k',
+  shortcuts: 'ctrlcmd+l',
+  value: '[](url)',
   buttonProps: {
-    'aria-label': 'Add a link',
-    title: 'Add a link'
+    'aria-label': 'Add a link (ctrl + l)',
+    title: 'Add a link (ctrl + l)'
   },
   icon: /*#__PURE__*/_jsx("svg", {
     "data-name": "italic",