@aigne/doc-smith 0.8.16-beta → 0.9.0-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/agents/evaluate/generate-report.mjs +7 -0
  3. package/agents/evaluate/index.yaml +6 -0
  4. package/agents/generate/check-need-generate-structure.mjs +8 -4
  5. package/agents/generate/document-structure-tools/add-document.mjs +4 -0
  6. package/agents/generate/document-structure-tools/update-document.mjs +11 -0
  7. package/agents/generate/draw-diagram.yaml +2 -2
  8. package/agents/generate/generate-structure.yaml +3 -2
  9. package/agents/init/index.mjs +6 -4
  10. package/agents/media/load-media-description.mjs +2 -1
  11. package/agents/schema/document-structure-item.yaml +3 -0
  12. package/agents/schema/document-structure-refine-item.yaml +3 -0
  13. package/agents/schema/document-structure.yaml +3 -0
  14. package/agents/update/pre-check-generate-diagram.yaml +1 -1
  15. package/agents/utils/document-icon-generate.yaml +52 -0
  16. package/agents/utils/generate-document-icon-if-needed.mjs +93 -0
  17. package/aigne.yaml +2 -0
  18. package/package.json +3 -7
  19. package/prompts/common/document/media-file-list-usage-rules.md +8 -2
  20. package/prompts/common/document/openapi-usage-rules.md +174 -21
  21. package/prompts/common/document-structure/document-icon-generate.md +116 -0
  22. package/prompts/common/document-structure/document-structure-rules.md +8 -3
  23. package/prompts/common/document-structure/openapi-usage-rules.md +28 -0
  24. package/prompts/common/document-structure/output-constraints.md +9 -0
  25. package/prompts/detail/custom/{custom-code-block.md → code-block-usage-rules.md} +43 -16
  26. package/prompts/detail/custom/custom-components/x-card-usage-rules.md +62 -0
  27. package/prompts/detail/custom/custom-components/x-cards-usage-rules.md +75 -0
  28. package/prompts/detail/custom/custom-components/x-field-desc-usage-rules.md +86 -0
  29. package/prompts/detail/custom/custom-components/x-field-group-usage-rules.md +95 -0
  30. package/prompts/detail/custom/custom-components/x-field-usage-rules.md +189 -0
  31. package/prompts/detail/custom/custom-components-usage-rules.md +10 -534
  32. package/prompts/detail/{d2-diagram → diagram}/rules.md +5 -3
  33. package/prompts/detail/generate/document-rules.md +6 -0
  34. package/prompts/detail/generate/system-prompt.md +3 -2
  35. package/prompts/detail/generate/user-prompt.md +7 -1
  36. package/prompts/detail/update/system-prompt.md +3 -3
  37. package/prompts/structure/generate/system-prompt.md +2 -5
  38. package/prompts/structure/generate/user-prompt.md +14 -39
  39. package/types/document-structure-schema.mjs +1 -0
  40. package/utils/evaluate/report-utils.mjs +7 -3
  41. /package/prompts/detail/{d2-diagram → diagram}/guide.md +0 -0
  42. /package/prompts/detail/{d2-diagram → diagram}/official-examples.md +0 -0
  43. /package/prompts/detail/{d2-diagram → diagram}/pre-check.md +0 -0
  44. /package/prompts/detail/{d2-diagram → diagram}/role-and-personality.md +0 -0
  45. /package/prompts/detail/{d2-diagram → diagram}/system-prompt.md +0 -0
  46. /package/prompts/detail/{d2-diagram → diagram}/user-prompt.md +0 -0
@@ -1,36 +1,189 @@
1
1
  {% if openAPISpec %}
2
2
  <openapi_usage_rules>
3
+ ## OpenAPI Usage Rules
3
4
 
4
- **Goal:** Use the provided OpenAPI (Swagger) specification, align it with the current page objective, and leverage it to refine this document.
5
+ Use the provided OpenAPI (Swagger) specification in `<openapi_usage_rules>`, align it with the current page objective, and leverage it to refine this document.
5
6
 
6
- **OpenAPI File Content:**
7
- <openapi_doc>
7
+ ### Documentation Requirements and Constraints
8
8
 
9
- {{ openAPISpec }}
9
+ - Extract the core content
10
+ - Organize the document by functional modules.
11
+ - For each path item, include the following elements:
12
+ - HTTP method and path.
13
+ - Concise summary.
14
+ - Detailed description.
15
+ - Request parameters: name, location (`in`), type, required flag, description.
16
+ - Request body: describe its structure when present.
17
+ - Response body: describe its structure, ignore status code layer.
18
+ - Response Example: provide example responses for common scenarios
10
19
 
11
- </openapi_doc>
20
+ - Mandatory API description constraints (deduplication rule):
21
+ - **Ensure** that throughout the document (including preface, overview, etc.), any introduction to the project APIs appears only within this OpenAPI-generated "API reference" section.
22
+ - **Never** repeat or expand the interface list elsewhere in the document (for example, "Quick Start" or "Architecture Overview" sections).
12
23
 
13
- ---
24
+ ### Expected Output Format
25
+ - A concise, clear, and easy-to-scan Markdown document.
14
26
 
15
- ### **Documentation Requirements and Constraints**
27
+ ### Examples
28
+ #### OpenAPI Spec Content
29
+ ```yml
30
+ openapi: 3.0.1
31
+ info:
32
+ title: DISCUSS KIT
33
+ description: ''
34
+ version: 1.0.0
35
+ paths:
36
+ /api/v1/sdk/posts:
37
+ get:
38
+ summary: List posts
39
+ deprecated: false
40
+ description: 'List posts'
41
+ parameters:
42
+ - name: type
43
+ in: query
44
+ description: 'The type of the posts'
45
+ required: false
46
+ example: blog
47
+ schema:
48
+ type: string
49
+ enum:
50
+ - discussion
51
+ - blog
52
+ - doc
53
+ - name: locale
54
+ in: query
55
+ description: 'The locale of the posts'
56
+ required: false
57
+ example: en
58
+ schema:
59
+ type: string
60
+ default: en
61
+ examples:
62
+ - en
63
+ - zh
64
+ - name: page
65
+ in: query
66
+ description: 'The page number'
67
+ required: false
68
+ example: 1
69
+ schema:
70
+ type: integer
71
+ - name: size
72
+ in: query
73
+ description: 'The number of posts per page'
74
+ required: false
75
+ example: 20
76
+ schema:
77
+ type: integer
78
+ - name: sort
79
+ in: query
80
+ description: 'The sort order of the posts'
81
+ required: false
82
+ example: '-createdAt'
83
+ schema:
84
+ type: string
85
+ enum:
86
+ - createdAt
87
+ - '-createdAt'
88
+ - name: labels
89
+ in: query
90
+ description: 'The labels of the posts'
91
+ required: false
92
+ example:
93
+ - did
94
+ schema:
95
+ type: array
96
+ items:
97
+ type: string
98
+ nullable: true
99
+ responses:
100
+ '200':
101
+ description: succeed
102
+ content:
103
+ application/json:
104
+ schema:
105
+ type: object
106
+ properties:
107
+ data:
108
+ type: array
109
+ items:
110
+ type: object
111
+ properties: {}
112
+ meta:
113
+ type: object
114
+ properties:
115
+ total:
116
+ type: integer
117
+ required:
118
+ - total
119
+ required:
120
+ - data
121
+ - meta
122
+ ```
16
123
 
17
- 1. **Extract the core content:**
18
- * Organize the document by functional modules.
19
- * For each path item, include the following elements:
20
- * HTTP method and path.
21
- * Concise summary.
22
- * Detailed description.
23
- * Request parameters: name, location (`in`), type, required flag, description.
24
- * Request body: describe its structure when present.
25
- * Responses: at least the key status codes (e.g., 200, 201, 400, 500) and their schemas.
124
+ #### Generate Output
125
+ ````md
126
+ ### Posts
26
127
 
27
- 2. **Mandatory API description constraints (deduplication rule):**
28
- * **Ensure that throughout the document (including preface, overview, etc.), any introduction to the project APIs appears only within this OpenAPI-generated "API reference" section.**
29
- * **Never** repeat or expand the interface list elsewhere in the document (for example, "Quick Start" or "Architecture Overview" sections).
128
+ ### List posts
30
129
 
31
- ---
130
+ Retrieves a list of posts, which can be filtered by type, locale, and other criteria. This endpoint supports pagination.
32
131
 
33
- **Expected output format:** A concise, clear, and easy-to-scan Markdown document.
132
+ `GET` `/api/v1/sdk/posts`
133
+
134
+ #### Parameters
135
+
136
+ <x-field-group>
137
+ <x-field data-name="type" data-type="string" data-required="false" data-default="blog">
138
+ <x-field-desc markdown>The type of posts to retrieve. Can be `discussion`, `blog`, or `doc`.</x-field-desc>
139
+ </x-field>
140
+ <x-field data-name="locale" data-type="string" data-required="false" data-default="en">
141
+ <x-field-desc markdown>The locale of the posts, e.g., `en` or `zh`.</x-field-desc>
142
+ </x-field>
143
+ <x-field data-name="page" data-type="integer" data-required="false">
144
+ <x-field-desc markdown>The page number for pagination.</x-field-desc>
145
+ </x-field>
146
+ <x-field data-name="size" data-type="integer" data-required="false" data-default="20">
147
+ <x-field-desc markdown>The number of posts to return per page.</x-field-desc>
148
+ </x-field>
149
+ <x-field data-name="sort" data-type="string" data-required="false" data-default="-createdAt">
150
+ <x-field-desc markdown>The sort order for the posts. Use `createdAt` for ascending or `-createdAt` for descending.</x-field-desc>
151
+ </x-field>
152
+ <x-field data-name="labels" data-type="array" data-required="false">
153
+ <x-field-desc markdown>An array of label strings to filter posts by.</x-field-desc>
154
+ </x-field>
155
+ </x-field-group>
156
+
157
+ #### Responses
158
+
159
+ <x-field-group>
160
+ <x-field data-name="data" data-type="array" data-required="true">
161
+ <x-field-desc markdown>An array of post objects.</x-field-desc>
162
+ </x-field>
163
+ <x-field data-name="meta" data-type="object" data-required="true">
164
+ <x-field-desc markdown>Metadata for pagination.</x-field-desc>
165
+ <x-field data-name="total" data-type="integer" data-required="true" data-desc="The total number of posts available."></x-field>
166
+ </x-field>
167
+ </x-field-group>
168
+
169
+ #### Response Example
170
+
171
+ ```json posts result
172
+ {
173
+ "data": [
174
+ {
175
+ "id": "15bcb4e7-8bd9-4759-b60b-ae826534057a",
176
+ "title": "Example Blog Post",
177
+ "content": "This is the content of the blog post.",
178
+ "createdAt": "2023-10-27T10:00:00Z"
179
+ }
180
+ ],
181
+ "meta": {
182
+ "total": 1
183
+ }
184
+ }
185
+ ```
186
+ ````
34
187
 
35
188
  </openapi_usage_rules>
36
189
  {% endif %}
@@ -0,0 +1,116 @@
1
+ # Document Icon Generation
2
+
3
+ <role>
4
+ You are an icon selection specialist. Your task is to generate appropriate Iconify icon names for document structure root nodes based on their title and description. The icon should semantically match the document's purpose and content to provide better visual identification.
5
+ </role>
6
+
7
+ <input>
8
+
9
+ - documentList: {{documentList}}
10
+
11
+ </input>
12
+
13
+ <icon_generation_rules>
14
+
15
+ **Core Requirements:**
16
+
17
+ 1. **Icon Format:**
18
+ - Must be a valid **Lucide icon name** in the format: `lucide:icon-name`
19
+ - Examples: `lucide:book`, `lucide:rocket`, `lucide:code`, `lucide:settings`
20
+ - **Only Lucide icons are supported** - do not use other icon collections
21
+
22
+ 3. **Icon Selection Guidelines:**
23
+ - Choose icons that **semantically match** the document's purpose and content based on both title and description
24
+ - Analyze the combined meaning of title and description to understand the document's purpose
25
+ - Consider the **target audience** and **document type** when selecting icons
26
+
27
+ 4. **Icon Categories and Suggestions:**
28
+
29
+ **General Documentation:**
30
+ - `lucide:book` - General documentation, guides
31
+ - `lucide:file-text` - Text documents, articles
32
+ - `lucide:book-open` - Reading materials, tutorials
33
+ - `lucide:library` - Reference materials
34
+
35
+ **Getting Started & Quick Start:**
36
+ - `lucide:rocket` - Quick start, getting started guides
37
+ - `lucide:play-circle` - Getting started, tutorials
38
+ - `lucide:zap` - Quick start, fast setup
39
+ - `lucide:sparkles` - Quick start, new features
40
+
41
+ **API & Code References:**
42
+ - `lucide:code` - API documentation, code references
43
+ - `lucide:file-code-2` - Code files, programming guides
44
+ - `lucide:terminal` - Command-line interfaces, CLI tools
45
+ - `lucide:git-branch` - Version control, development
46
+ - `lucide:brackets` - Code syntax, programming
47
+
48
+ **Configuration & Settings:**
49
+ - `lucide:settings` - Configuration guides, settings
50
+ - `lucide:cog` - Configuration, setup
51
+ - `lucide:wrench` - Tools, configuration
52
+ - `lucide:sliders` - Settings, preferences
53
+
54
+ **Tutorials & Learning:**
55
+ - `lucide:graduation-cap` - Learning materials, tutorials
56
+ - `lucide:lightbulb` - Tips, tutorials, guides
57
+ - `lucide:book-open` - Learning, reading
58
+ - `lucide:school` - Educational content
59
+
60
+ **Project & Overview:**
61
+ - `lucide:folder-open` - Project overview, structure
62
+ - `lucide:layers` - Architecture, structure
63
+ - `lucide:package` - Packages, modules
64
+ - `lucide:box` - Components, modules
65
+
66
+ **User & Community:**
67
+ - `lucide:users` - User guides, community
68
+ - `lucide:user` - User documentation
69
+ - `lucide:help-circle` - Help, FAQ
70
+ - `lucide:message-circle` - Communication, chat
71
+
72
+ **Security & Admin:**
73
+ - `lucide:shield` - Security, protection
74
+ - `lucide:key` - Authentication, access
75
+ - `lucide:lock` - Security, privacy
76
+ - `lucide:shield-check` - Security verification
77
+
78
+ **Deployment & Operations:**
79
+ - `lucide:cloud` - Cloud services, deployment
80
+ - `lucide:server` - Server, infrastructure
81
+ - `lucide:database` - Database, data
82
+ - `lucide:network` - Networking, connections
83
+
84
+ 5. **Selection Process:**
85
+ - Read both title and description carefully
86
+ - Identify the primary purpose and content type
87
+ - Match to the most appropriate icon category
88
+ - Select the most semantically relevant Lucide icon from that category
89
+ - Ensure the icon clearly represents the document's purpose
90
+ - **Only use Lucide icons** - format must be `lucide:icon-name`
91
+
92
+ 6. **Important Notes:**
93
+ - Only generate icons for root-level documents (where parentId is null or empty)
94
+ - Each document should have exactly one icon
95
+ - Icons should be immediately recognizable and semantically clear
96
+ - Avoid overly generic icons when a more specific one is available
97
+ - Consider cultural and language context when appropriate
98
+
99
+ </icon_generation_rules>
100
+
101
+ <output_rules>
102
+
103
+ Return a JSON object with:
104
+
105
+ - `documentList`: array of document items with generated icons, each containing:
106
+ - `path`: the same path from input (for mapping purposes)
107
+ - `icon`: Lucide icon name in the format `lucide:icon-name` (e.g., `lucide:book`)
108
+
109
+ Ensure each item:
110
+ - Preserves the exact `path` value from the corresponding input item
111
+ - Has an `icon` field with a valid Lucide icon name (format: `lucide:icon-name`)
112
+ - The icon semantically matches the document's title and description
113
+ - **Only uses Lucide icons** - do not use other icon collections
114
+
115
+ </output_rules>
116
+
@@ -28,13 +28,18 @@ Structural planning rules:
28
28
 
29
29
  2. Content planning should prioritize displaying information from user-provided `<data_sources>` or supplement with your existing knowledge. Do not arbitrarily fabricate information.
30
30
 
31
- {% ifAsync docsType == 'general' %}
32
- {% include "../../structure/document-rules.md" %}
31
+ 3. **Document Icon Generation:**
32
+ - For root-level nodes (where `parentPath` is null or empty), add an `icon` attribute
33
+ - Format: `lucide:icon-name` (only Lucide icons supported)
34
+ - Choose icons that semantically match the document's purpose based on title and description
35
+ - Common icons: `lucide:book` (documentation), `lucide:rocket` (quick start), `lucide:code` (API), `lucide:settings` (configuration), `lucide:graduation-cap` (tutorials), `lucide:folder-open` (overview), `lucide:users` (user guides), `lucide:shield` (security), `lucide:cloud` (deployment)
33
36
 
37
+ {% ifAsync docsType == 'general' %}
38
+ {% include "../../structure/document-rules.md" %}
34
39
  {% endif %}
35
40
 
36
41
  {% ifAsync docsType == 'getting-started' %}
37
- {% include "../../structure/structure-getting-started.md" %}
42
+ {% include "../../structure/structure-getting-started.md" %}
38
43
  {% endif %}
39
44
 
40
45
  Other requirements:
@@ -0,0 +1,28 @@
1
+ {% if userContext.openAPISpec %}
2
+
3
+ <openapi_usage_rules>
4
+ ## OpenAPI Usage Rules
5
+
6
+ Use the provided OpenAPI (Swagger) specification in `<openapi_spec_content>` to design how the OpenAPI content and the overall document should be structured together.
7
+
8
+ ### Documentation Requirements and Constraints
9
+
10
+ - Section structure and titles
11
+ - Create a dedicated top-level section for the OpenAPI content.
12
+ - The section title must be professional and user friendly
13
+ - **Never** include terms such as OpenAPI, Swagger, or file formats.
14
+ - Recommended titles include **"API Interface Reference"** or **"Interface Reference"**.
15
+
16
+ - Content hierarchy and presentation:
17
+ - **Ideal state (single-level page):** Prefer to present all API endpoints within **one Markdown file (one page)**.
18
+ - **Split criteria (two-level pages):** Only when the number of endpoints is too large for a single file should you split by OpenAPI tags or logical modules, creating individual Markdown files per module.
19
+ - **Forced file hierarchy constraint:** Whether using one or two levels, the generated API reference files (Markdown) may contain **no more than two levels.**
20
+ - **Example (two-level structure):** `/api-reference.md` (index) -> `/api/user.md`, `/api/order.md` (module pages)
21
+ - **Disallow any third level or deeper structure:** for example, `/api/v1/user/get.md`.
22
+
23
+ - Mandatory API description constraints (deduplication rule):
24
+ - Ensure that for the entire document (including preface, overview, etc.), any introduction to the project APIs appears only within this OpenAPI-generated "API reference" section.
25
+ - **Never** repeat or extend the API list elsewhere in the document (for example, "Quick Start" or "Architecture Overview" sections).
26
+
27
+ </openapi_usage_rules>
28
+ {% endif %}
@@ -6,4 +6,13 @@
6
6
  - For referenced files, analyze another layer of source code files referenced within them and add to sourceIds to ensure complete context for detail generation
7
7
  2. **Ensure sourceIds are never empty**. Do not plan {{nodeName}} items without related data sources
8
8
 
9
+ 3. **Project Information Length Constraints:**
10
+ - `projectName`: Must not exceed **40 characters** (counted as character length, regardless of language - Chinese, English, Russian, etc.). Keep it concise and clear. Generate a complete, meaningful name within this limit.
11
+ - `projectDesc`: Must not exceed **160 characters** (counted as character length, regardless of language - Chinese, English, Russian, etc.). Provide a brief, informative description. Generate a complete, coherent description within this limit.
12
+ - **Character counting rules:**
13
+ - Count all characters equally (Chinese, English, Russian, etc. - each character counts as 1)
14
+ - Spaces in the middle of the text count toward the character limit
15
+ - Leading and trailing spaces will be automatically removed, so do not include them
16
+ - **Important**: These are hard limits. Ensure your generated content is complete and grammatically correct within these character constraints. Do not generate content that would need truncation.
17
+
9
18
  </output_constraints>
@@ -1,36 +1,42 @@
1
- <enhanced_code_block_rules>
1
+ <code_block_usage_rules>
2
+
2
3
  ## Enhanced Attributes for Markdown Code Blocks
3
4
 
4
5
  When generating Markdown, you can add enhanced attributes to code blocks to provide richer functionality and better display effects. These attributes allow you to specify **titles**, **icons**, and more for code blocks.
5
6
 
6
- **Please use these enhanced attributes as much as possible to improve display effects**
7
-
8
7
  ### Attribute Definition
9
8
 
10
9
  The following are the available enhanced attributes and their descriptions:
11
10
 
12
- * `language`: The language of the code block (e.g., `javascript`, `python`, `html`). This attribute is placed directly after the three backticks (\`\`\`).
13
- * `title`: The title of the code block, which is optional.
14
- * `icon`: The icon displayed next to the code block, which is optional. This value must be a valid **Iconify icon name** (e.g., `logos:javascript`, `mdi:folder-open`).
11
+ - `language`: The language of the code block (e.g., `javascript`, `python`, `html`). This attribute is placed directly after the three backticks (\`\`\`).
12
+ - `title`: The title of the code block (optional)
13
+ - `icon`: The icon displayed next to the code block, which is optional. This value must be a valid **Iconify icon name** (e.g., `logos:javascript`, `mdi:folder-open`).
15
14
 
16
15
  ### Attribute Usage
17
16
 
18
- * `language` and `title` are written directly after \`\`\`, separated by spaces.
19
- * Other attributes (`icon`) must be provided in **key=value** format, separated by spaces.
17
+ - `language` and `title` are written directly after \`\`\`, separated by spaces.
18
+ - Do not add quotes around the `title` value.
19
+ - Other attributes (`icon`) must be provided in **key=value** format, separated by spaces.
20
20
 
21
- ### Special Rules
21
+ ### Usage Requirements
22
+ - Use these enhanced attributes as much as possible to improve display effects.
22
23
  - If the language is a shell (includes `sh`, `bash`, `zsh`, etc.):
23
24
  - Executable shell code blocks must be a single-line command to make copying and running easier.
24
25
  - Do not include comments inside executable shell code blocks; place explanatory comments outside the code block.
26
+ - Prefer use filename as title:
27
+ - If the code block content demonstrates usage of a component or library (for example a React component file, a Vue component, or a util module), the `title` should be the filename used in real usage (for example `MyComponent.jsx`, `index.ts`, `utils.js`). Using the filename as the title makes the example clearer and helps standardize code-block titles across the docs.
28
+ - If the content is not a usage example, prefer a short descriptive title that summarizes the snippet's purpose.
29
+ - Ensure readability of the document:
30
+ - After inserting a code block, update the surrounding document text to introduce, reference, or explain the code block.
25
31
 
26
32
  ### Examples
27
33
 
28
- <code_block_good_examples>
34
+ #### Good Examples
29
35
  The following are some examples of Markdown code blocks using enhanced attributes:
30
36
 
31
37
  **Example 1: Code block with title and icon**
32
38
 
33
- ```javascript Shopping Cart Class icon=logos:javascript
39
+ ```javascript shopping-cart.js icon=logos:javascript
34
40
  class ShoppingCart {
35
41
  constructor() {
36
42
  this.items = [];
@@ -54,7 +60,7 @@ class ShoppingCart {
54
60
 
55
61
  **Example 3: Code block with title only**
56
62
 
57
- ```javascript Shopping Cart Class
63
+ ```javascript shopping-cart.js
58
64
  class ShoppingCart {
59
65
  constructor() {
60
66
  this.items = [];
@@ -76,6 +82,29 @@ class ShoppingCart {
76
82
  }
77
83
  ```
78
84
 
85
+ **Example 7: Component usage example with filename title**
86
+
87
+ ```javascript MyComponent.jsx icon=logos:react
88
+ import React from 'react';
89
+
90
+ export default function MyComponent(props) {
91
+ return (
92
+ <div className="my-component">
93
+ <h1>{props.title}</h1>
94
+ </div>
95
+ );
96
+ }
97
+ ```
98
+
99
+ **Example 8: Utility module example with filename title**
100
+
101
+ ```javascript utils.js
102
+ // simple utility function exported from utils.js
103
+ export function formatDate(date) {
104
+ return new Date(date).toLocaleDateString();
105
+ }
106
+ ```
107
+
79
108
  **Example 5: Shell code block should in one line**
80
109
 
81
110
  ```sh Install aigne deps icon=lucide:terminal
@@ -91,9 +120,8 @@ blocklet deploy . \
91
120
  --app-id z2qa9sD2tFAP8gM7C1i8iETg3a1T3A3aT3bQ
92
121
  ```
93
122
 
94
- </code_block_good_examples>
95
123
 
96
- <code_block_bad_examples>
124
+ #### Bad Examples
97
125
 
98
126
  **Example 1**
99
127
 
@@ -132,5 +160,4 @@ npm i -g @aigne/websmith-smith
132
160
  npm i -g @aigne/cli
133
161
  ```
134
162
 
135
- </code_block_bad_examples>
136
- </enhanced_code_block_rules>
163
+ </code_block_usage_rules>
@@ -0,0 +1,62 @@
1
+ <x-card-usage-rules>
2
+ ## XCard Usage Rules
3
+
4
+ XCard is individual link display card, suitable for displaying individual links with a richer and more visually appealing presentation format.
5
+
6
+ ### Attributes
7
+
8
+ - `data-title` (required): Card title.
9
+ - `data-icon` (optional): Icon identifier (e.g., lucide:icon-name or material-symbols:rocket-outline).
10
+ - Icons should prioritize Lucide (lucide:icon-name). If not available in Lucide, use Iconify (collection:icon-name, e.g., material-symbols:rocket-outline).
11
+ - `data-image` (optional): Image URL, can coexist with icon.
12
+ - **Requirement**: At least one of `data-icon` or `data-image` must be provided.
13
+ - It's recommended to always provide data-icon.
14
+ - `data-href` (optional): Navigation link for clicking the card or button.
15
+ - `data-horizontal` (optional): Whether to use horizontal layout.
16
+ - `data-cta` (optional): Button text (call to action).
17
+
18
+ ### Children
19
+
20
+ - Must be written within `<x-card>...</x-card>` children.
21
+ - **Plain Text Only**: All markdown formatting is prohibited, including inline formats like `code`, **bold**, _italic_, [links](), and block-level formats like headers (# ##), lists (- \*), code blocks (```), tables (|), and any other markdown syntax. Only plain text content is allowed.
22
+
23
+ ### Good Examples
24
+
25
+ - Example 1: Basic card with icon and description
26
+ ```md
27
+ <x-card data-title="alarm()" data-icon="lucide:alarm-clock"> SIGALRM: Sent when a real-time timer has expired. </x-card>
28
+ ```
29
+
30
+ - Example 2: Horizontal card layout
31
+ ```md
32
+ <x-card data-title="Horizontal card" data-icon="lucide:atom" data-horizontal="true">
33
+ This is an example of a horizontal card.
34
+ </x-card>
35
+ ```
36
+
37
+ ### Bad Examples
38
+
39
+ - Example 1: Inline Markdown formatting in card content
40
+ ```md
41
+ <x-card data-title="alarm()" data-icon="lucide:alarm-clock"> `SIGALRM`: Sent when a real-time timer has expired. </x-card>
42
+ ```
43
+
44
+ - Example 2: Code block inside card content
45
+ ````md
46
+ <x-card data-title="ctrl_break()" data-icon="lucide:keyboard">
47
+ Creates a listener for "ctrl-break" events.
48
+
49
+ ```rust
50
+ use tokio::signal::windows::ctrl_break;
51
+
52
+ #[tokio::main]
53
+ async fn main() -> std::io::Result<()> {
54
+ let mut stream = ctrl_break()?;
55
+ stream.recv().await;
56
+ println!("got ctrl-break");
57
+ Ok(())
58
+ }
59
+ ```
60
+
61
+ ````
62
+ </x-card-usage-rules>
@@ -0,0 +1,75 @@
1
+ <x-card-usage-rules>
2
+ ## XCard Usage Rules
3
+
4
+ XCards is multiple `<x-card>` container, suitable for displaying multiple links using a card list format, providing a richer and more visually appealing presentation.
5
+
6
+ ### Attributes
7
+
8
+ - `data-columns` (optional): Must be an **integer ≥ 2**. Values below 2 are disallowed. Default is 2.
9
+
10
+ ### Children
11
+
12
+ - Must contain multiple `<x-card>` elements internally.
13
+
14
+ ### Usage Rules
15
+
16
+ - **Visual Consistency**: All `<x-card>` elements within the same `<x-cards>` must maintain visual consistency:
17
+ - It's recommended to always provide data-icon for each card.
18
+ - Or all cards should have data-image.
19
+ - Avoid mixing (some with icons, some with only images).
20
+
21
+ ### Good Examples
22
+
23
+ - Example 1: Three-column cards with icons
24
+ ```md
25
+ <x-cards data-columns="3">
26
+ <x-card data-title="Feature 1" data-icon="lucide:rocket">Description of Feature 1.</x-card>
27
+ <x-card data-title="Feature 2" data-icon="lucide:bolt">Description of Feature 2.</x-card>
28
+ <x-card data-title="Feature 3" data-icon="material-symbols:rocket-outline">Description of Feature 3.</x-card>
29
+ </x-cards>
30
+ ```
31
+
32
+ - Example 2: Two-column cards with images
33
+ ```md
34
+ <x-cards data-columns="2">
35
+ <x-card data-title="Card A" data-image="https://picsum.photos/id/10/300/300">Content A</x-card>
36
+ <x-card data-title="Card B" data-image="https://picsum.photos/id/11/300/300">Content B</x-card>
37
+ </x-cards>
38
+ ```
39
+
40
+ - Example 3: Replace markdown format multiple links
41
+ ```md
42
+ For more detailed information on specific features, please refer to the following sections:
43
+
44
+ <x-cards data-columns="3">
45
+ <x-card data-title="Using Discussions" data-href="/discussions">Introduce how to use discussions</x-card>
46
+ <x-card data-title="Using the Blog" data-href="/blog">Introduce how to use the Blog</x-card>
47
+ <x-card data-title="Using Chat" data-href="/chat">Introduce how to use Chat</x-card>
48
+ </x-cards>
49
+ ```
50
+
51
+ ### Bad Examples
52
+
53
+ - Example 1: Using a single-column layout (`data-columns="1"`) is not allowed
54
+ ```md
55
+ <x-cards data-columns="1">
56
+ <x-card data-title="Feature 1" data-icon="lucide:rocket">Description of Feature 1.</x-card>
57
+ <x-card data-title="Feature 2" data-icon="lucide:bolt">Description of Feature 2.</x-card>
58
+ </x-cards>
59
+ ```
60
+
61
+ - Example 2: Contains only one `<x-card>` (must include multiple cards)
62
+ ```md
63
+ <x-cards data-columns="2">
64
+ <x-card data-title="Card A" data-image="https://picsum.photos/id/10/300/300">Content A</x-card>
65
+ </x-cards>
66
+ ```
67
+
68
+ - Example 3: Markdown format multiple links
69
+ ```md
70
+ For more detailed information on specific features, please refer to the following sections:
71
+ - [Using Discussions](./discussions.md)
72
+ - [Using the Blog](./blog.md)
73
+ - [Using Chat](./chat.md)
74
+ ```
75
+ </x-card-usage-rules>