Merge pull request #9284 from weseek/fix/155877-155879-add-remark-directive

imprv: Add remark-directive

apps/app/package.json

@@ -186,6 +186,7 @@
     "rehype-slug": "^6.0.0",
     "rehype-toc": "^3.0.2",
     "remark-breaks": "^4.0.0",
+    "remark-directive": "^3.0.0",
     "remark-emoji": "^5.0.0",
     "remark-frontmatter": "^5.0.0",
     "remark-gfm": "^4.0.0",

apps/app/src/features/callout/services/callout.ts

@@ -11,7 +11,7 @@ export const remarkPlugin: Plugin = () => {
         const data = node.data ?? (node.data = {});
         data.hName = 'callout';
         data.hProperties = {
-          name: node.name,
+          name: node.name.toLocaleLowerCase(),
         };
       }
     });

apps/app/src/services/renderer/renderer.tsx

@@ -5,6 +5,7 @@ import raw from 'rehype-raw';
 import sanitize from 'rehype-sanitize';
 import slug from 'rehype-slug';
 import breaks from 'remark-breaks';
+import remarkDirective from 'remark-directive';
 import emoji from 'remark-emoji';
 import remarkFrontmatter from 'remark-frontmatter';
 import gfm from 'remark-gfm';
@@ -99,6 +100,7 @@ export const generateCommonOptions = (pagePath: string|undefined): RendererOptio
       emoji,
       pukiwikiLikeLinker,
       growiDirective,
+      remarkDirective,
       remarkFrontmatter,
       codeBlock.remarkPlugin,
     ],

packages/remark-growi-directive/src/mdast-util-growi-directive/lib/index.js

@@ -37,25 +37,24 @@ export function directiveFromMarkdown() {
   return {
     canContainEols: [DirectiveType.Text],
     enter: {
-      directiveLeaf: enterLeaf,
-      directiveLeafAttributes: enterAttributes,
+      directiveGrowiLeaf: enterLeaf,
+      directiveGrowiLeafAttributes: enterAttributes,
 
-      directiveText: enterText,
-      directiveTextAttributes: enterAttributes,
+      directiveGrowiText: enterText,
+      directiveGrowiTextAttributes: enterAttributes,
     },
     exit: {
-      directiveLeaf: exit,
-      directiveLeafAttributeName: exitAttributeName,
-      directiveLeafAttributeValue: exitAttributeValue,
-      directiveLeafAttributes: exitAttributes,
-      directiveLeafName: exitName,
-
-      directiveText: exit,
-      directiveTextAttributeName: exitAttributeName,
-      directiveTextAttributeValue: exitAttributeValue,
-      directiveTextAttributes: exitAttributes,
-      directiveTextName: exitName,
-
+      directiveGrowiLeaf: exit,
+      directiveGrowiLeafAttributeName: exitAttributeName,
+      directiveGrowiLeafAttributeValue: exitAttributeValue,
+      directiveGrowiLeafAttributes: exitAttributes,
+      directiveGrowiLeafName: exitName,
+
+      directiveGrowiText: exit,
+      directiveGrowiTextAttributeName: exitAttributeName,
+      directiveGrowiTextAttributeValue: exitAttributeValue,
+      directiveGrowiTextAttributes: exitAttributes,
+      directiveGrowiTextName: exitName,
     },
   };
 }

packages/remark-growi-directive/src/micromark-extension-growi-directive/lib/directive-leaf.js

@@ -62,9 +62,9 @@ function tokenizeDirectiveLeaf(effects, ok, nok) {
   /** @type {State} */
   function start(code) {
     assert(code === codes.dollarSign, 'expected `$`');
-    effects.enter('directiveLeaf');
+    effects.enter('directiveGrowiLeaf');
     effects.consume(code);
-    return factoryName.call(self, effects, afterName, nok, 'directiveLeafName');
+    return factoryName.call(self, effects, afterName, nok, 'directiveGrowiLeafName');
   }
 
   /** @type {State} */
@@ -92,7 +92,7 @@ function tokenizeDirectiveLeaf(effects, ok, nok) {
   /** @type {State} */
   function end(code) {
     if (code === codes.eof || markdownLineEnding(code)) {
-      effects.exit('directiveLeaf');
+      effects.exit('directiveGrowiLeaf');
       return ok(code);
     }
 
@@ -107,9 +107,9 @@ function tokenizeLabel(effects, ok, nok) {
     effects,
     ok,
     nok,
-    'directiveLeafLabel',
-    'directiveLeafLabelMarker',
-    'directiveLeafLabelString',
+    'directiveGrowiLeafLabel',
+    'directiveGrowiLeafLabelMarker',
+    'directiveGrowiLeafLabelString',
     true,
   );
 }
@@ -121,15 +121,15 @@ function tokenizeAttributes(effects, ok, nok) {
     effects,
     ok,
     nok,
-    'directiveLeafAttributes',
-    'directiveLeafAttributesMarker',
-    'directiveLeafAttribute',
-    'directiveLeafAttributeName',
-    'directiveLeafAttributeInitializerMarker',
-    'directiveLeafAttributeValueLiteral',
-    'directiveLeafAttributeValue',
-    'directiveLeafAttributeValueMarker',
-    'directiveLeafAttributeValueData',
+    'directiveGrowiLeafAttributes',
+    'directiveGrowiLeafAttributesMarker',
+    'directiveGrowiLeafAttribute',
+    'directiveGrowiLeafAttributeName',
+    'directiveGrowiLeafAttributeInitializerMarker',
+    'directiveGrowiLeafAttributeValueLiteral',
+    'directiveGrowiLeafAttributeValue',
+    'directiveGrowiLeafAttributeValueMarker',
+    'directiveGrowiLeafAttributeValueData',
     true,
   );
 }

packages/remark-growi-directive/src/micromark-extension-growi-directive/lib/directive-text.js

@@ -41,11 +41,11 @@ function tokenizeDirectiveText(effects, ok, nok) {
   function start(code) {
     assert(code === codes.dollarSign, 'expected `$`');
     assert(previous.call(self, self.previous), 'expected correct previous');
-    effects.enter('directiveText');
-    effects.enter('directiveTextMarker');
+    effects.enter('directiveGrowiText');
+    effects.enter('directiveGrowiTextMarker');
     effects.consume(code);
-    effects.exit('directiveTextMarker');
-    return factoryName.call(self, effects, afterName, nok, 'directiveTextName');
+    effects.exit('directiveGrowiTextMarker');
+    return factoryName.call(self, effects, afterName, nok, 'directiveGrowiTextName');
   }
 
   /** @type {State} */
@@ -67,7 +67,7 @@ function tokenizeDirectiveText(effects, ok, nok) {
 
   /** @type {State} */
   function afterAttributes(code) {
-    effects.exit('directiveText');
+    effects.exit('directiveGrowiText');
     return ok(code);
   }
 }
@@ -79,9 +79,9 @@ function tokenizeLabel(effects, ok, nok) {
     effects,
     ok,
     nok,
-    'directiveTextLabel',
-    'directiveTextLabelMarker',
-    'directiveTextLabelString',
+    'directiveGrowiTextLabel',
+    'directiveGrowiTextLabelMarker',
+    'directiveGrowiTextLabelString',
   );
 }
 
@@ -92,14 +92,14 @@ function tokenizeAttributes(effects, ok, nok) {
     effects,
     ok,
     nok,
-    'directiveTextAttributes',
-    'directiveTextAttributesMarker',
-    'directiveTextAttribute',
-    'directiveTextAttributeName',
-    'directiveTextAttributeInitializerMarker',
-    'directiveTextAttributeValueLiteral',
-    'directiveTextAttributeValue',
-    'directiveTextAttributeValueMarker',
-    'directiveTextAttributeValueData',
+    'directiveGrowiTextAttributes',
+    'directiveGrowiTextAttributesMarker',
+    'directiveGrowiTextAttribute',
+    'directiveGrowiTextAttributeName',
+    'directiveGrowiTextAttributeInitializerMarker',
+    'directiveGrowiTextAttributeValueLiteral',
+    'directiveGrowiTextAttributeValue',
+    'directiveGrowiTextAttributeValueMarker',
+    'directiveGrowiTextAttributeValueData',
   );
 }

packages/remark-growi-directive/src/micromark-extension-growi-directive/lib/html.js

@@ -35,32 +35,32 @@ export function directiveHtml(options = {}) {
   return {
     enter: {
 
-      directiveLeaf() {
+      directiveGrowiLeaf() {
         return enter.call(this, DirectiveType.Leaf);
       },
-      directiveLeafAttributes: enterAttributes,
-      directiveLeafLabel: enterLabel,
+      directiveGrowiLeafAttributes: enterAttributes,
+      directiveGrowiLeafLabel: enterLabel,
 
-      directiveText() {
+      directiveGrowiText() {
         return enter.call(this, DirectiveType.Text);
       },
-      directiveTextAttributes: enterAttributes,
-      directiveTextLabel: enterLabel,
+      directiveGrowiTextAttributes: enterAttributes,
+      directiveGrowiTextLabel: enterLabel,
     },
     exit: {
-      directiveLeaf: exit,
-      directiveLeafAttributeName: exitAttributeName,
-      directiveLeafAttributeValue: exitAttributeValue,
-      directiveLeafAttributes: exitAttributes,
-      directiveLeafLabel: exitLabel,
-      directiveLeafName: exitName,
-
-      directiveText: exit,
-      directiveTextAttributeName: exitAttributeName,
-      directiveTextAttributeValue: exitAttributeValue,
-      directiveTextAttributes: exitAttributes,
-      directiveTextLabel: exitLabel,
-      directiveTextName: exitName,
+      directiveGrowiLeaf: exit,
+      directiveGrowiLeafAttributeName: exitAttributeName,
+      directiveGrowiLeafAttributeValue: exitAttributeValue,
+      directiveGrowiLeafAttributes: exitAttributes,
+      directiveGrowiLeafLabel: exitLabel,
+      directiveGrowiLeafName: exitName,
+
+      directiveGrowiText: exit,
+      directiveGrowiTextAttributeName: exitAttributeName,
+      directiveGrowiTextAttributeValue: exitAttributeValue,
+      directiveGrowiTextAttributes: exitAttributes,
+      directiveGrowiTextLabel: exitLabel,
+      directiveGrowiTextName: exitName,
     },
   };
 

yarn.lock

@@ -13119,6 +13119,19 @@ micromark-core-commonmark@^2.0.0:
     micromark-util-symbol "^2.0.0"
     micromark-util-types "^2.0.0"
 
+micromark-extension-directive@^3.0.0:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/micromark-extension-directive/-/micromark-extension-directive-3.0.2.tgz#2eb61985d1995a7c1ff7621676a4f32af29409e8"
+  integrity sha512-wjcXHgk+PPdmvR58Le9d7zQYWy+vKEU9Se44p2CrCDPiLr2FMyiT4Fyb5UFKFC66wGB3kPlgD7q3TnoqPS7SZA==
+  dependencies:
+    devlop "^1.0.0"
+    micromark-factory-space "^2.0.0"
+    micromark-factory-whitespace "^2.0.0"
+    micromark-util-character "^2.0.0"
+    micromark-util-symbol "^2.0.0"
+    micromark-util-types "^2.0.0"
+    parse-entities "^4.0.0"
+
 micromark-extension-frontmatter@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/micromark-extension-frontmatter/-/micromark-extension-frontmatter-2.0.0.tgz#651c52ffa5d7a8eeed687c513cd869885882d67a"
@@ -16077,6 +16090,16 @@ remark-breaks@^4.0.0:
     mdast-util-newline-to-break "^2.0.0"
     unified "^11.0.0"
 
+remark-directive@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/remark-directive/-/remark-directive-3.0.0.tgz#34452d951b37e6207d2e2a4f830dc33442923268"
+  integrity sha512-l1UyWJ6Eg1VPU7Hm/9tt0zKtReJQNOA4+iDMAxTyZNWnJnFlbS/7zhiel/rogTLQ2vMYwDzSJa4BiVNqGlqIMA==
+  dependencies:
+    "@types/mdast" "^4.0.0"
+    mdast-util-directive "^3.0.0"
+    micromark-extension-directive "^3.0.0"
+    unified "^11.0.0"
+
 remark-emoji@^5.0.0:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/remark-emoji/-/remark-emoji-5.0.1.tgz#fb08ef9f5a1a036e765d68ac3dcc1b81624f4f6f"