miki-template 2.3.1 → 2.3.3

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 (167) hide show
  1. package/README.md +1 -1
  2. package/package.json +24 -2
  3. package/src/codegen.js +140 -9
  4. package/src/parser.js +69 -1
  5. package/src/tags/control.js +112 -51
  6. package/src/tags/extra.js +4 -17
  7. package/src/tags/i18n.js +6 -17
  8. package/src/tags/inheritance.js +6 -20
  9. package/src/tags/util.js +5 -20
  10. package/.eslintrc.json +0 -16
  11. package/.github/release-notes/v1.3.1.md +0 -55
  12. package/.github/release-notes/v1.3.3.md +0 -77
  13. package/.github/release-notes/v1.3.7.md +0 -20
  14. package/.github/workflows/ci.yml +0 -42
  15. package/.github/workflows/docs.yml +0 -107
  16. package/.github/workflows/release.yml +0 -107
  17. package/AGENT.md +0 -71
  18. package/API_REFERENCE.md +0 -341
  19. package/CHANGELOG.md +0 -173
  20. package/CODE_OF_CONDUCT.md +0 -14
  21. package/CONTRIBUTING.md +0 -27
  22. package/ROADMAP.md +0 -40
  23. package/assets/banner.png +0 -0
  24. package/assets/logo.png +0 -0
  25. package/benchmarks/ejs-results.json +0 -17
  26. package/benchmarks/ejs.js +0 -38
  27. package/benchmarks/handlebars-results.json +0 -17
  28. package/benchmarks/handlebars.js +0 -45
  29. package/benchmarks/miki-results.json +0 -17
  30. package/benchmarks/miki.js +0 -39
  31. package/benchmarks/pug-results.json +0 -17
  32. package/benchmarks/pug.js +0 -38
  33. package/benchmarks/report.json +0 -17
  34. package/benchmarks/run.js +0 -81
  35. package/benchmarks/stress.mjs +0 -647
  36. package/benchmarks/templates/large.dtpl +0 -7
  37. package/benchmarks/templates/medium.dtpl +0 -3
  38. package/benchmarks/templates/small.dtpl +0 -7
  39. package/context/component.md +0 -109
  40. package/context/prd.md +0 -131
  41. package/context/project-structure.md +0 -33
  42. package/dir/base.html +0 -23
  43. package/dir/cmpnt.html +0 -11
  44. package/dir/footer.html +0 -3
  45. package/dir/home.html +0 -80
  46. package/dir/index.html +0 -80
  47. package/dir/navbar.html +0 -9
  48. package/docs/api/async-render.md +0 -170
  49. package/docs/api/cache.md +0 -174
  50. package/docs/api/compile.md +0 -256
  51. package/docs/api/context-processors.md +0 -154
  52. package/docs/api/filters.md +0 -437
  53. package/docs/api/finder.md +0 -188
  54. package/docs/api/helpers.md +0 -106
  55. package/docs/api/i18n.md +0 -314
  56. package/docs/api/index.md +0 -108
  57. package/docs/api/libraries.md +0 -414
  58. package/docs/api/render-partial.md +0 -162
  59. package/docs/api/render.md +0 -184
  60. package/docs/api/security.md +0 -290
  61. package/docs/api/setup-express.md +0 -152
  62. package/docs/api/tags.md +0 -268
  63. package/docs/assets/banner.png +0 -0
  64. package/docs/assets/logo.png +0 -0
  65. package/docs/filter.md +0 -0
  66. package/docs/guide/advanced-usage.md +0 -794
  67. package/docs/guide/async-rendering.md +0 -616
  68. package/docs/guide/context-processors.md +0 -514
  69. package/docs/guide/custom-filters.md +0 -622
  70. package/docs/guide/custom-tags.md +0 -542
  71. package/docs/guide/filters.md +0 -1314
  72. package/docs/guide/getting-started.md +0 -204
  73. package/docs/guide/installation.md +0 -190
  74. package/docs/guide/partial-templates.md +0 -734
  75. package/docs/guide/quick-start.md +0 -444
  76. package/docs/guide/security.md +0 -690
  77. package/docs/guide/tags.md +0 -1566
  78. package/docs/guide/template-discovery.md +0 -340
  79. package/docs/guide/template-inheritance.md +0 -546
  80. package/docs/guide/what-is-miki-template.md +0 -28
  81. package/docs/guide/why-miki-template.md +0 -75
  82. package/docs/index.md +0 -86
  83. package/docs/integrations/elysia.md +0 -80
  84. package/docs/integrations/express.md +0 -219
  85. package/docs/integrations/fastify.md +0 -79
  86. package/docs/integrations/hono.md +0 -80
  87. package/docs/integrations/index.md +0 -68
  88. package/docs/integrations/koa.md +0 -90
  89. package/docs/integrations/nestjs.md +0 -80
  90. package/docs/integrations/tsed.md +0 -83
  91. package/docs/performance.md +0 -74
  92. package/eslint.config.mjs +0 -42
  93. package/ex.mjs +0 -36
  94. package/live-test/integrations/elysia-example.js +0 -16
  95. package/live-test/integrations/express-example.js +0 -24
  96. package/live-test/integrations/fastify-example.js +0 -20
  97. package/live-test/integrations/hono-example.js +0 -16
  98. package/live-test/integrations/koa-example.js +0 -30
  99. package/live-test/integrations/nestjs-example.js +0 -25
  100. package/live-test/integrations/smoke-test.js +0 -166
  101. package/live-test/integrations/tsed-example.js +0 -23
  102. package/live-test/package-lock.json +0 -1150
  103. package/live-test/package.json +0 -13
  104. package/live-test/packages/product/templates/product/detail.html +0 -7
  105. package/live-test/server.js +0 -38
  106. package/live-test/templates/app_templates/detail.html +0 -6
  107. package/live-test/views/base.html +0 -8
  108. package/live-test/views/child.html +0 -7
  109. package/live-test/views/home.html +0 -17
  110. package/live-test/views/index.html +0 -1
  111. package/miki-template-extension/.github/workflows/ci.yml +0 -116
  112. package/miki-template-extension/.vscodeignore +0 -7
  113. package/miki-template-extension/CHANGELOG.md +0 -99
  114. package/miki-template-extension/LICENSE +0 -21
  115. package/miki-template-extension/README.md +0 -273
  116. package/miki-template-extension/extension.js +0 -1013
  117. package/miki-template-extension/icon.png +0 -0
  118. package/miki-template-extension/icon.svg +0 -10
  119. package/miki-template-extension/miki-template-1.7.1.vsix +0 -0
  120. package/miki-template-extension/package.json +0 -280
  121. package/miki-template-extension/snippets/miki-template.json +0 -717
  122. package/miki-template-extension/syntaxes/language-configuration.json +0 -114
  123. package/miki-template-extension/syntaxes/miki-template.tmLanguage.json +0 -355
  124. package/miki-template-extension/tests/grammar-tests.json +0 -162
  125. package/miki-template-extension/tests/run-grammar-tests.js +0 -82
  126. package/mkdocs.yml +0 -195
  127. package/overrides/main.html +0 -26
  128. package/requirements-docs.txt +0 -2
  129. package/sample-app/package-lock.json +0 -901
  130. package/sample-app/package.json +0 -9
  131. package/sample-app/server.js +0 -14
  132. package/sample-app/views/index.html +0 -1
  133. package/scripts/build-vsix.js +0 -129
  134. package/scripts/build-vsix.ps1 +0 -15
  135. package/snippets/miki-template.json +0 -177
  136. package/src/asyncRender.js +0 -21
  137. package/src/types.d.ts +0 -107
  138. package/syntaxes/language-configuration.json +0 -26
  139. package/syntaxes/miki-template.tmLanguage.json +0 -146
  140. package/tests/asyncRender.test.js +0 -17
  141. package/tests/base.html +0 -6
  142. package/tests/child.html +0 -3
  143. package/tests/context_processors.test.js +0 -13
  144. package/tests/esm.test.mjs +0 -61
  145. package/tests/filters.test.js +0 -263
  146. package/tests/finder-appdirs.test.js +0 -19
  147. package/tests/finder.test.js +0 -17
  148. package/tests/fixtures/views/nested/index.html +0 -1
  149. package/tests/fixtures/views/partial.html +0 -1
  150. package/tests/fixtures/views/sub/deepfile.html +0 -1
  151. package/tests/fixtures/views-appdirs/product/site/detail.html +0 -1
  152. package/tests/include_security.test.js +0 -9
  153. package/tests/integration/README.md +0 -32
  154. package/tests/integration/features.test.cjs +0 -1681
  155. package/tests/integration/features.test.mjs +0 -1697
  156. package/tests/integration/finder.esm.test.mjs +0 -13
  157. package/tests/integration/partial-render.test.cjs +0 -13
  158. package/tests/integration/templates/base.miki +0 -6
  159. package/tests/integration/templates/child.miki +0 -6
  160. package/tests/integration/templates/index.html +0 -17
  161. package/tests/lexer.test.js +0 -45
  162. package/tests/parser.test.js +0 -57
  163. package/tests/partial.html +0 -1
  164. package/tests/partialdef.test.js +0 -79
  165. package/tests/production_checks.js +0 -57
  166. package/tests/security.test.js +0 -28
  167. package/tests/tags.test.js +0 -233
@@ -1,13 +0,0 @@
1
- {
2
- "name": "live-test",
3
- "version": "1.0.0",
4
- "private": true,
5
- "dependencies": {
6
- "express": "^5.2.1",
7
- "miki-template": "file:../miki-template-2.0.0.tgz"
8
- },
9
- "devDependencies": {
10
- "elysia": "^1.4.30",
11
- "hono": "^4.13.7"
12
- }
13
- }
@@ -1,7 +0,0 @@
1
- <html>
2
- <head><title>Product Detail</title></head>
3
- <body>
4
- <h1>Product: {{ name }}</h1>
5
- <p>Price: {{ price }}</p>
6
- </body>
7
- </html>
@@ -1,38 +0,0 @@
1
- const express = require('express');
2
- const path = require('path');
3
- const miki = require('miki-template');
4
-
5
- const app = express();
6
- const views = path.join(__dirname, 'views');
7
- const templatesRoot = path.join(__dirname, 'templates');
8
-
9
- // Demonstrate multiple discovery roots: explicit views dir,
10
- // plus a top-level `templates/` (Django-style) and app-style nested folders
11
- // discovered anywhere under the project root.
12
- miki.setupExpress(app, { extension: 'html', views: [views, templatesRoot, __dirname] });
13
-
14
- // Note: `miki.setupExpress` may expand `app.get('views')` to include
15
- // nested template directories (project-level `templates/`,
16
- // app-style `packages/*/templates/...`, etc.). The live-test app
17
- // intentionally passed multiple roots to demonstrate discovery.
18
-
19
- app.get('/', (req, res) => {
20
- res.render('index', { name: 'Live NPM' });
21
- });
22
-
23
- // Render a nested child template that extends base.html located in views/
24
- app.get('/child', (req, res) => {
25
- res.render('child', { title: 'From Live', message: 'Hello from child' });
26
- });
27
-
28
- // Render a template located under templates/app_templates/detail.html
29
-
30
- app.get('/app-detail', (req, res) => {
31
- res.render('detail', { item: 'Widget 42' });
32
- });
33
-
34
- app.get('/product', (req, res) => {
35
- res.render('product/detail', { name: 'Gizmo', price: '$19.99' });
36
- });
37
-
38
- app.listen(3002, () => console.log('Live test app listening on 3002'));
@@ -1,6 +0,0 @@
1
- <html>
2
- <head><title>App Template</title></head>
3
- <body>
4
- <h1>App-level template: {{ item }}</h1>
5
- </body>
6
- </html>
@@ -1,8 +0,0 @@
1
- <html>
2
- <head>
3
- <title>{% block title %}Base Title{% endblock %}</title>
4
- </head>
5
- <body>
6
- {% block content %}Base content{% endblock %}
7
- </body>
8
- </html>
@@ -1,7 +0,0 @@
1
- {% extends 'base.html' %}
2
- {% block title %}Child - {{ title }}{% endblock %}
3
- {% block content %}
4
- <h2>Child Content</h2>
5
- <p>{{ message }}</p>
6
- {{ block.super }}
7
- {% endblock %}
@@ -1,17 +0,0 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <title>Home</title>
5
- </head>
6
- <body>
7
- <h1>Welcome, {{ user }}</h1>
8
-
9
- {% partialdef card %}
10
- <div class="card">Card: {{ title }}</div>
11
- {% endpartialdef %}
12
-
13
- <div id="content">
14
- {% partial card %}
15
- </div>
16
- </body>
17
- </html>
@@ -1 +0,0 @@
1
- <html><head><title>{{ name }}</title></head><body><h1>Hello {{ name }}</h1></body></html>
@@ -1,116 +0,0 @@
1
- name: CI
2
-
3
- on:
4
- push:
5
- branches: [ main, master ]
6
- pull_request:
7
- branches: [ main, master ]
8
- workflow_dispatch:
9
-
10
- jobs:
11
- lint:
12
- name: Lint Extension
13
- runs-on: ubuntu-latest
14
- steps:
15
- - name: Checkout
16
- uses: actions/checkout@v4
17
-
18
- - name: Setup Node.js
19
- uses: actions/setup-node@v4
20
- with:
21
- node-version: '20'
22
-
23
- - name: Install dependencies
24
- run: npm install
25
-
26
- - name: Validate package.json
27
- run: npm run validate
28
-
29
- - name: Check for required files
30
- run: |
31
- echo "Checking required files..."
32
- for file in package.json extension.js README.md CHANGELOG.md LICENSE; do
33
- if [ ! -f "$file" ]; then
34
- echo "Missing required file: $file"
35
- exit 1
36
- fi
37
- done
38
-
39
- test-grammar:
40
- name: Test Grammar
41
- runs-on: ubuntu-latest
42
- steps:
43
- - name: Checkout
44
- uses: actions/checkout@v4
45
-
46
- - name: Setup Node.js
47
- uses: actions/setup-node@v4
48
- with:
49
- node-version: '20'
50
-
51
- - name: Install test dependencies
52
- run: npm install --save-dev textmate-grammar-test
53
-
54
- - name: Run grammar tests
55
- run: npm run test:grammar
56
-
57
- package:
58
- name: Package Extension
59
- runs-on: ubuntu-latest
60
- needs: [lint, test-grammar]
61
- steps:
62
- - name: Checkout
63
- uses: actions/checkout@v4
64
-
65
- - name: Setup Node.js
66
- uses: actions/setup-node@v4
67
- with:
68
- node-version: '20'
69
-
70
- - name: Install dependencies
71
- run: npm install
72
-
73
- - name: Package VSIX
74
- id: package
75
- run: |
76
- npx vsce package --no-dependencies
77
- echo "version=$(node -p \"require('./package.json').version\")" >> $GITHUB_OUTPUT
78
- echo "vsix=$(ls *.vsix 2>/dev/null | head -1)" >> $GITHUB_OUTPUT
79
-
80
- - name: Upload VSIX artifact
81
- uses: actions/upload-artifact@v4
82
- with:
83
- name: miki-template-${{ steps.package.outputs.version }}.vsix
84
- path: ${{ steps.package.outputs.vsix }}
85
-
86
- - name: List output files
87
- run: ls -la *.vsix 2>/dev/null || echo "No VSIX files found"
88
-
89
- publish:
90
- name: Publish to Marketplace
91
- runs-on: ubuntu-latest
92
- needs: [package]
93
- if: github.event_name == 'push' && (github.ref == 'refs/heads/main' || github.ref == 'refs/heads/master')
94
- steps:
95
- - name: Checkout
96
- uses: actions/checkout@v4
97
-
98
- - name: Download VSIX
99
- uses: actions/download-artifact@v4
100
- with:
101
- name: miki-template-${{ needs.package.outputs.version }}.vsix
102
-
103
- - name: Publish to VS Code Marketplace
104
- run: npx vsce publish --no-dependencies
105
- env:
106
- VSCE_PAT: ${{ secrets.VSCE_PAT }}
107
- continue-on-error: true
108
-
109
- - name: Create Release
110
- if: success()
111
- uses: softprops/action-gh-release@v1
112
- with:
113
- files: *.vsix
114
- generate_release_notes: true
115
- env:
116
- GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -1,7 +0,0 @@
1
- .github/
2
- tests/
3
- *.vsix
4
- icon.svg
5
- *.log
6
- node_modules/
7
- .DS_Store
@@ -1,99 +0,0 @@
1
- # Changelog
2
-
3
- All notable changes to this extension will be documented in this file.
4
-
5
- The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
- and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
-
8
- ## [1.7.1] - 2026-09-03
9
-
10
- ### Added
11
-
12
- - **Rename Blocks (F2)**: Rename `{% block name %}` across workspace with F2
13
- - **Path Completions**: Auto-suggest template files for `{% include %}` and `{% extends %}`
14
- - **Semantic Token Provider**: Enhanced semantic highlighting with proper token classification
15
- - **HTML/CSS/JS Embedded Support**: Full syntax highlighting for embedded languages
16
- - **Emmet Support**: HTML and JavaScript Emmet abbreviations work in templates
17
- - **CSS in `<style>` tags**: Proper CSS syntax highlighting
18
- - **JS in `<script>` tags**: Proper JavaScript syntax highlighting
19
-
20
- ### Fixed
21
-
22
- - Grammar patterns for proper HTML scope activation
23
- - Embedded language mappings for CSS and JavaScript
24
- - Multiple bug fixes and improvements
25
-
26
- ## [1.7.0] - 2026-09-03
27
-
28
- ### Added
29
-
30
- - **Inlay Hints**: Show inline parameter hints for filter arguments
31
- - **Project-wide Find References**: Find blocks, includes, extends across entire workspace
32
- - **Smart Tag Selection**: Double-click to select entire `{% block %}` content
33
- - **Custom Tag/Filters Detection**: Auto-detect from project config files
34
- - **Template Preview Command**: Preview template syntax in a webview panel
35
- - **Smart Paste**: Auto-detect HTML paste for potential escaping
36
- - **Bracket Matching Highlights**: Visual highlight for matching `{% if %}`/`{% endif %}` pairs
37
- - **Template Variables IntelliSense**: Common variable names (user, request, form, items, etc.)
38
- - **Performance Debouncing**: Optimized validation and decorations with debounce
39
- - **Quick Outline Navigation**: `Ctrl+Shift+.` and `Ctrl+Shift+,` to jump between blocks
40
-
41
- ### New Commands
42
- - `goToNextBlock` / `goToPrevBlock` - Navigate between blocks
43
- - `previewTemplate` - Preview template in new tab
44
- - `showOutline` - Quick outline navigation
45
- - `findBlockReferences` - Find all block references
46
-
47
- ### New Settings
48
- - `enableInlayHints` - Toggle inlay hints
49
- - `enableBracketHighlight` - Toggle bracket highlighting
50
- - `enableSmartPaste` - Toggle smart paste
51
-
52
- ## [1.6.0] - 2026-09-03
53
-
54
- ### Added
55
-
56
- - **Color Decorations**: Automatically highlights color values (`#ff0000`, `rgb()`, `rgba()`, `hsl()`, `hsla()`) in templates
57
- - **Code Actions**: Quick fixes for common issues
58
- - **Find References**: Find all references to blocks and includes
59
- - **New Commands**: wrapInBlock, wrapInFor, wrapInIf, addPrettierIgnore
60
- - **New Settings**: enableColorDecorations, enableCodeActions
61
-
62
- ### Changed
63
-
64
- - Improved completion items with argument hints
65
- - Better validation diagnostics
66
- - Enhanced outline view with icons
67
-
68
- ## [1.5.0] - 2026-09-03
69
-
70
- ### Added
71
-
72
- - **Go-to-Definition**: Jump to included/extended templates and block definitions
73
- - **Outline View**: See template structure
74
- - **forloop.* Completions**: Auto-complete loop variables
75
- - **Keyboard Shortcut**: `Ctrl+Shift+F` to wrap selection with filter
76
-
77
- ## [1.4.0] - 2026-09-02
78
-
79
- ### Added
80
-
81
- - Dual language support: `miki-template` and `django-html`
82
- - File associations: `.miki`, `.miki-template`, `.django`, `.dj`
83
- - Comprehensive filter support (70+ filters)
84
- - Prettier integration with `prettier-ignore`
85
-
86
- ## [1.3.0] - 2026-08-15
87
-
88
- ### Added
89
-
90
- - Buy Me a Coffee integration
91
- - Format on save configuration
92
-
93
- ## [1.2.0] - 2026-06-01
94
-
95
- ### Added
96
-
97
- - Initial release
98
- - Basic syntax highlighting
99
- - Code snippets
@@ -1,21 +0,0 @@
1
- MIT License
2
-
3
- Copyright (c) 2026 miki-template contributors
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
@@ -1,273 +0,0 @@
1
- # miki-template VS Code Extension
2
-
3
- [![Buy Me A Coffee](https://img.buymeacoffee.com/button-api/?text=Buy%20me%20a%20coffee&emoji=%E2%98%95&slug=alainmiki&button_colour=FFDD00&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=ffffff)](https://www.buymeacoffee.com/alainmiki)
4
-
5
- The **ultimate** VS Code extension for **miki-template** and **Django** templates. Packed with features to supercharge your template development.
6
-
7
- ## Why miki-template?
8
-
9
- - 100% Django compatible
10
- - All Django template tags & filters
11
- - miki-template extensions (partialdef, cache, addtoblock)
12
- - Works with `.django`, `.dj`, `.miki`, `.miki-template` files
13
-
14
- ---
15
-
16
- ## Features
17
-
18
- ### 🔥 Intelligent Completions
19
- - **Tags**: All 50+ Django/miki-template tags
20
- - **Filters**: All 70+ filters with argument hints
21
- - **forloop.* variables**: Auto-complete when inside for loops
22
- - **Custom tags/filters**: Auto-detected from project config
23
- - **Common variables**: user, request, form, items, etc.
24
- - **Path completions**: Auto-suggest template files for `{% include %}` and `{% extends %}`
25
-
26
- ### 📖 Hover Documentation
27
- Hover over any tag or filter to see:
28
- - Full description
29
- - Syntax example
30
- - Argument hints for filters
31
- - `{{ block.super }}` shows parent block content explanation
32
-
33
- ### ⚡ Real-time Validation
34
- - Unclosed tag detection
35
- - Mismatched opening/closing tags
36
- - `{% extends %}` placement validation
37
- - Performance optimized with debouncing
38
-
39
- ### 🎨 Color Decorations
40
- Automatically highlights:
41
- - `#ff0000`, `#fff`, `#ffffffaa`
42
- - `rgb()`, `rgba()`
43
- - `hsl()`, `hsla()`
44
-
45
- ### 🔧 Code Actions (Quick Fixes)
46
- - Add missing `{% endif %}`
47
- - Add missing `{% endfor %}`
48
- - Wrap selection in `{% block %}`
49
- - Add `{# prettier-ignore #}`
50
-
51
- ### 💡 Inlay Hints
52
- Show inline parameter hints for filter arguments.
53
-
54
- ### 🔗 Bracket Matching Highlights
55
- Highlight matching `{% if %}` / `{% endif %}` pairs.
56
-
57
- ### 🚀 Go-to-Definition
58
- Jump to:
59
- - `{% include "file" %}`
60
- - `{% extends "file" %}`
61
- - `{% block name %}`
62
- - `{% partialdef name %}`
63
-
64
- ### 🔍 Project-wide Find References
65
- Find all references to:
66
- - Block definitions across workspace
67
- - Included templates
68
- - Extended templates
69
-
70
- ### 📋 Smart Tag Selection
71
- Double-click to select entire `{% block %}` content.
72
-
73
- ### 🎯 Quick Outline Navigation
74
- Jump between blocks with keyboard shortcuts.
75
-
76
- ### 📝 Template Preview
77
- Preview template syntax in a new tab.
78
-
79
- ### ✏️ Rename Blocks (F2)
80
- Rename any `{% block name %}` and automatically update all `{{ block.name }}` references across your entire workspace. Just place cursor on a block name and press F2.
81
-
82
- ### 🎨 Semantic Highlighting
83
- Enhanced syntax highlighting using VS Code's Semantic Token API for better theme support and more accurate token classification.
84
-
85
- ### 🌐 HTML/CSS/JS Support
86
- Full embedded language support for:
87
- - **HTML**: Proper tag and attribute highlighting
88
- - **CSS**: Syntax highlighting in `<style>` tags
89
- - **JavaScript**: Syntax highlighting in `<script>` tags
90
- - **Emmet**: Full Emmet abbreviation support for HTML and JavaScript
91
- - **Auto-closing**: HTML tags, brackets, and quotes
92
- - **Bracket matching**: HTML tags, parentheses, brackets
93
-
94
- ### 📋 Smart Paste
95
- Paste HTML content and the extension will automatically append `|safe` filter to prevent escaping issues.
96
-
97
- ### 🔧 Code Actions
98
- Quick fixes for common issues.
99
-
100
- ---
101
-
102
- ## Quick Commands
103
-
104
- | Command | Description | Shortcut |
105
- |---------|-------------|----------|
106
- | `insertFilter` | Wrap with filter | `Ctrl+Shift+F` |
107
- | `wrapInBlock` | Wrap in block | - |
108
- | `wrapInFor` | Wrap in for loop | - |
109
- | `wrapInIf` | Wrap in if condition | - |
110
- | `addPrettierIgnore` | Add prettier ignore | - |
111
- | `goToNextBlock` | Next block | `Ctrl+Shift+.` |
112
- | `goToPrevBlock` | Previous block | `Ctrl+Shift+,` |
113
- | `previewTemplate` | Preview template | - |
114
- | `showOutline` | Show outline | - |
115
- | `findBlockReferences` | Find block refs | - |
116
- | `validateAll` | Validate all | - |
117
-
118
- > **Tip:** Press `F2` on any block name to rename it across the workspace!
119
-
120
- ---
121
-
122
- ## Settings
123
-
124
- | Setting | Default | Description |
125
- |---------|---------|-------------|
126
- | `enableValidation` | `true` | Enable validation |
127
- | `enableCompletions` | `true` | Enable completions |
128
- | `enableHover` | `true` | Enable hover docs |
129
- | `enableColorDecorations` | `true` | Highlight colors |
130
- | `enableCodeActions` | `true` | Enable quick fixes |
131
- | `enableInlayHints` | `true` | Show inlay hints |
132
- | `enableBracketHighlight` | `true` | Highlight brackets |
133
- | `enableSmartPaste` | `true` | Smart paste handling |
134
- | `formatOnSave` | `false` | Format on save |
135
-
136
- ---
137
-
138
- ## File Associations
139
-
140
- | Extension | Language |
141
- |-----------|----------|
142
- | `.miki` | miki-template |
143
- | `.miki-template` | miki-template |
144
- | `.django` | Django HTML |
145
- | `.dj` | Django HTML |
146
-
147
- ---
148
-
149
- ## Format on Save
150
-
151
- ```json
152
- {
153
- "[django-html]": {
154
- "editor.formatOnSave": true,
155
- "editor.defaultFormatter": "esbenp.prettier-vscode"
156
- }
157
- }
158
- ```
159
-
160
- ---
161
-
162
- ## Custom Tags/Filters Detection
163
-
164
- The extension auto-detects custom tags and filters from:
165
- - `miki-template.config.js`
166
- - `miki-template.config.json`
167
- - `.mikirc`
168
- - `package.json`
169
-
170
- ```javascript
171
- // miki-template.config.js
172
- module.exports = {
173
- filters: ['myFilter', 'customFilter'],
174
- tags: ['myTag', 'customTag']
175
- };
176
- ```
177
-
178
- ---
179
-
180
- ## Path Completions
181
-
182
- When typing `{% include %}` or `{% extends %}`, the extension automatically suggests template files from your workspace:
183
-
184
- ```html
185
- {% include "partials/" ← Shows all template files
186
- {% extends "base" ← Shows matching templates
187
- ```
188
-
189
- Files are searched recursively throughout your workspace and filtered as you type.
190
-
191
- ---
192
-
193
- ## Examples
194
-
195
- ### Basic Template
196
- ```html
197
- {% extends "base.html" %}
198
-
199
- {% block content %}
200
- <h1>{{ title|default:"Welcome" }}</h1>
201
-
202
- {% if user.is_authenticated %}
203
- <p>Hello, {{ user.name }}!</p>
204
- {% else %}
205
- <p>Please log in.</p>
206
- {% endif %}
207
-
208
- {% for item in items %}
209
- <li>{{ forloop.counter }}. {{ item }}</li>
210
- {% empty %}
211
- <li>No items found.</li>
212
- {% endfor %}
213
- {% endblock %}
214
- ```
215
-
216
- ### Rename Blocks
217
- Place cursor on any `{% block name %}` and press `F2`:
218
-
219
- ```html
220
- <!-- Before rename: block title → block heading -->
221
- {% block title %}Welcome{% endblock %}
222
- {{ block.title }}
223
-
224
- <!-- After pressing F2 and entering "heading": -->
225
- {% block heading %}Welcome{% endblock %}
226
- {{ block.heading }}
227
- ```
228
-
229
- All references across the workspace are updated automatically.
230
-
231
- ### With Partial
232
- ```html
233
- {% partialdef card inline %}
234
- <div class="card">
235
- <h3>{{ title }}</h3>
236
- <p>{{ description }}</p>
237
- </div>
238
- {% endpartialdef %}
239
-
240
- {% partial card with title="Hello" %}
241
- ```
242
-
243
- ---
244
-
245
- ## Development
246
-
247
- ```bash
248
- # Install dependencies
249
- npm install
250
-
251
- # Run tests
252
- npm test
253
-
254
- # Package
255
- npm run package
256
-
257
- # Watch & install
258
- npm run watch
259
- ```
260
-
261
- ---
262
-
263
- ## License
264
-
265
- MIT
266
-
267
- ---
268
-
269
- ## Support
270
-
271
- If this extension helps you, consider [buying me a coffee](https://www.buymeacoffee.com/alainmiki)!
272
-
273
- [![Buy Me A Coffee](https://img.buymeacoffee.com/button-api/?text=Buy%20me%20a%20coffee&emoji=%E2%98%95&slug=alainmiki&button_colour=FFDD00&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=ffffff)](https://www.buymeacoffee.com/alainmiki)