TemplateList component

Author: FileEX

schemas/function.yaml

@@ -121,6 +121,10 @@ $defs:
           description: |
             The default value for this parameter, if none was given in the call to the function.
             This property automatically implicitly marks this parameter as optional.
+        templateList:
+          type: string
+          description: It allows to display a list of possible values (radio station IDs, bone IDs, onPlayerChat message types, etc.).
+
   ignore_parameters:
     type: array
     description: |
@@ -152,4 +156,7 @@ $defs:
               description: Type of the return value.
             name:
               type: string
-              description: Name of the return value.
+              description: Name of the return value.
+            templateList:
+              type: string
+              description: It allows to display a list of possible values (radio station IDs, bone IDs, onPlayerChat message types, etc.).

web/src/components/TemplateList.astro

@@ -0,0 +1,57 @@
+---
+const { name } = Astro.props;
+
+const lists: Record<string, { id: number; label: string }[]> = {
+    "message-types": [
+        { id: 0, label: "normal message" },
+        { id: 1, label: "action message (/me)" },
+        { id: 2, label: "team message" },
+        { id: 3, label: "private message" },
+        { id: 4, label: "internal message" },
+    ],
+};
+
+const icons: Record<string, string> = {
+    "message-types": "💬",
+};
+
+const items = lists[name] || [];
+const icon = icons[name] || "○";
+---
+
+{
+    items.length > 0 && (
+        <ul class="template-list" style={`--icon: "${icon}"`}>
+            {items.map((item) => (
+                <li>
+                    <strong>{item.id}</strong>: {item.label}
+                </li>
+            ))}
+        </ul>
+    )
+}
+
+<style>
+    .template-list {
+        list-style: none;
+        font-style: italic;
+        border: 1px solid var(--sl-color-white);
+        padding-left: 0;
+    }
+
+    .template-list li::before {
+        content: var(--icon, "○");
+        margin-right: 0.5rem;
+        margin-left: 0.5rem;
+    }
+
+    :root[data-theme="light"] .template-list li::before {
+        filter: sepia(1) hue-rotate(-50deg) saturate(5) brightness(1.1)
+            drop-shadow(0 0 1px black);
+    }
+
+    :root[data-theme="dark"] .template-list li::before {
+        filter: sepia(1) hue-rotate(-50deg) saturate(5) brightness(0.8)
+            drop-shadow(0 0 1px white);
+    }
+</style>

web/src/pages/reference/[func].astro

@@ -18,6 +18,7 @@ import ChangelogList from '@src/components/ChangelogList.astro';
 import ItemDescription from '@src/components/ItemDescription.astro';
 import EnhancedMarkdown from '@src/components/EnhancedMarkdown.astro';
 import PreviewImages from '@src/components/PreviewImages.astro';
+import TemplateList from '@src/components/TemplateList.astro';
 
 import { marked } from 'marked';
 
@@ -241,6 +242,9 @@ let funcSyntaxes = parseFunctionSyntaxes(func.id, func.data);
                             <li>
                                 <strong>{param.name}</strong>:
                                 <EnhancedMarkdown content={param.description} inline={true}/>
+                                {param.templateList && (
+                                    <TemplateList name={param.templateList}/>
+                                )}
                             </li>
                             ))}
                         </ul>
@@ -258,6 +262,9 @@ let funcSyntaxes = parseFunctionSyntaxes(func.id, func.data);
                             <li>
                                 <strong>{param.name}</strong> (default: <em>{param.default}</em>):
                                 <EnhancedMarkdown content={param.description} inline={true}/>
+                                {param.templateList && (
+                                    <TemplateList name={param.templateList}/>
+                                )}
                             </li>
                             ))}
                         </ul>
@@ -269,7 +276,12 @@ let funcSyntaxes = parseFunctionSyntaxes(func.id, func.data);
                     <h4>Returns</h4>
                     <ul>
                         {syntax.returns.values.map((ret: any) => (
-                            <li set:html={"<strong>" + ret.type + "</strong>: " + renderInlineMarkdown(ret.name)} />
+                            <li>
+                                <strong>{ret.type}</strong>: {renderInlineMarkdown(ret.name)}
+                                {ret.templateList && (
+                                    <TemplateList name={ret.templateList}/>
+                                )}
+                            </li>
                         ))}
                     </ul>
 

web/src/utils/functions.ts

@@ -81,11 +81,13 @@ type Parameter = {
   type: string;
   description: string;
   default?: string;
+  templateList?: string;
 };
 
 type ReturnValue = {
   type: string;
   name: string;
+  templateList?: string;
 };
 
 type ReturnBlock = {