gitea源码

EasyMDEToolbarActions.ts 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. import {svg} from '../../svg.ts';
  2. import type EasyMDE from 'easymde';
  3. import type {ComboMarkdownEditor} from './ComboMarkdownEditor.ts';
  4. export function easyMDEToolbarActions(easyMde: typeof EasyMDE, editor: ComboMarkdownEditor): Record<string, Partial<EasyMDE.ToolbarIcon | string>> {
  5. const actions: Record<string, Partial<EasyMDE.ToolbarIcon> | string> = {
  6. '|': '|',
  7. 'heading-1': {
  8. action: easyMde.toggleHeading1,
  9. icon: svg('octicon-heading'),
  10. title: 'Heading 1',
  11. },
  12. 'heading-2': {
  13. action: easyMde.toggleHeading2,
  14. icon: svg('octicon-heading'),
  15. title: 'Heading 2',
  16. },
  17. 'heading-3': {
  18. action: easyMde.toggleHeading3,
  19. icon: svg('octicon-heading'),
  20. title: 'Heading 3',
  21. },
  22. 'heading-smaller': {
  23. action: easyMde.toggleHeadingSmaller,
  24. icon: svg('octicon-heading'),
  25. title: 'Decrease Heading',
  26. },
  27. 'heading-bigger': {
  28. action: easyMde.toggleHeadingBigger,
  29. icon: svg('octicon-heading'),
  30. title: 'Increase Heading',
  31. },
  32. 'bold': {
  33. action: easyMde.toggleBold,
  34. icon: svg('octicon-bold'),
  35. title: 'Bold',
  36. },
  37. 'italic': {
  38. action: easyMde.toggleItalic,
  39. icon: svg('octicon-italic'),
  40. title: 'Italic',
  41. },
  42. 'strikethrough': {
  43. action: easyMde.toggleStrikethrough,
  44. icon: svg('octicon-strikethrough'),
  45. title: 'Strikethrough',
  46. },
  47. 'quote': {
  48. action: easyMde.toggleBlockquote,
  49. icon: svg('octicon-quote'),
  50. title: 'Quote',
  51. },
  52. 'code': {
  53. action: easyMde.toggleCodeBlock,
  54. icon: svg('octicon-code'),
  55. title: 'Code',
  56. },
  57. 'link': {
  58. action: easyMde.drawLink,
  59. icon: svg('octicon-link'),
  60. title: 'Link',
  61. },
  62. 'unordered-list': {
  63. action: easyMde.toggleUnorderedList,
  64. icon: svg('octicon-list-unordered'),
  65. title: 'Unordered List',
  66. },
  67. 'ordered-list': {
  68. action: easyMde.toggleOrderedList,
  69. icon: svg('octicon-list-ordered'),
  70. title: 'Ordered List',
  71. },
  72. 'image': {
  73. action: easyMde.drawImage,
  74. icon: svg('octicon-image'),
  75. title: 'Image',
  76. },
  77. 'table': {
  78. action: easyMde.drawTable,
  79. icon: svg('octicon-table'),
  80. title: 'Table',
  81. },
  82. 'horizontal-rule': {
  83. action: easyMde.drawHorizontalRule,
  84. icon: svg('octicon-horizontal-rule'),
  85. title: 'Horizontal Rule',
  86. },
  87. 'preview': {
  88. action: easyMde.togglePreview,
  89. icon: svg('octicon-eye'),
  90. title: 'Preview',
  91. },
  92. 'fullscreen': {
  93. action: easyMde.toggleFullScreen,
  94. icon: svg('octicon-screen-full'),
  95. title: 'Fullscreen',
  96. },
  97. 'side-by-side': {
  98. action: easyMde.toggleSideBySide,
  99. icon: svg('octicon-columns'),
  100. title: 'Side by Side',
  101. },
  102. // gitea's custom actions
  103. 'gitea-checkbox-empty': {
  104. action(e) {
  105. const cm = e.codemirror;
  106. cm.replaceSelection(`\n- [ ] ${cm.getSelection()}`);
  107. cm.focus();
  108. },
  109. icon: svg('gitea-empty-checkbox'),
  110. title: 'Add Checkbox (empty)',
  111. },
  112. 'gitea-checkbox-checked': {
  113. action(e) {
  114. const cm = e.codemirror;
  115. cm.replaceSelection(`\n- [x] ${cm.getSelection()}`);
  116. cm.focus();
  117. },
  118. icon: svg('octicon-checkbox'),
  119. title: 'Add Checkbox (checked)',
  120. },
  121. 'gitea-switch-to-textarea': {
  122. action: () => {
  123. editor.userPreferredEditor = 'textarea';
  124. editor.switchToTextarea();
  125. },
  126. icon: svg('octicon-arrow-switch'),
  127. title: 'Revert to simple textarea',
  128. },
  129. 'gitea-code-inline': {
  130. action(e) {
  131. const cm = e.codemirror;
  132. const selection = cm.getSelection();
  133. cm.replaceSelection(`\`${selection}\``);
  134. if (!selection) {
  135. const cursorPos = cm.getCursor();
  136. cm.setCursor(cursorPos.line, cursorPos.ch - 1);
  137. }
  138. cm.focus();
  139. },
  140. icon: svg('octicon-chevron-right'),
  141. title: 'Add Inline Code',
  142. },
  143. };
  144. for (const [key, value] of Object.entries(actions)) {
  145. if (typeof value !== 'string') {
  146. value.name = key;
  147. }
  148. }
  149. return actions;
  150. }