Merge pull request #1273 from d-oit/file-options

feat: File component extend with Hugo highlight options

data/structures/file.yml

@@ -38,3 +38,7 @@ arguments:
     type: string
     optional: true
     comment: Class attribute of the tab control that wraps the file element.
+  options:
+    type: string
+    optional: true
+    comment: Hugo highlighting options.  

exampleSite/content/en/blog/file-highlight.md

@@ -0,0 +1,30 @@
+---
+author: Hinode Contributors
+title: File highlighting
+date: 2023-09-23
+description: The file shortcode prints the full content of any given file with syntax highlighting
+tags: ["file", "shortcode"]
+thumbnail:
+  url: img/puzzle.jpg
+  author: Ryoji Iwata
+  authorURL: https://unsplash.com/@ryoji__iwata
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/5siQcvSxCP8
+---
+
+The [file shortcode](https://gethinode.com/docs/components/file/) prints and highlights the full content of a given input file. It recognizes the languages supported by Hugo’s highlight function.
+
+## File Shortcode
+
+Use the Hugo syntax highlighting options for marking lines in the file.
+[Hugo Documentation](https://gohugo.io/content-management/syntax-highlighting/#highlight-shortcode)
+
+{{< file full="true" show="true" path="./layouts/shortcodes/file.html" options="linenos=table,hl_lines=41 68-70,linenostart=42" >}}
+
+## Default configuration
+
+{{< file full="true" show="false" path="./config/_default/markup.toml" >}}
+
+## Current page as markdown file
+
+{{< file full="true" show="true" path="./content/en/blog/file-highlight.md" >}}

exampleSite/hugo_stats.json

@@ -292,6 +292,8 @@
       "link-secondary",
       "link-success",
       "link-warning",
+      "lntable",
+      "lntd",
       "lottie-animation",
       "m-0",
       "main-content",
@@ -316,7 +318,9 @@
       "mt-auto",
       "mt-md-0",
       "multi-docs-collapse-15",
+      "multi-file-collapse-0",
       "multi-file-collapse-1",
+      "multi-file-collapse-2",
       "mx-auto",
       "mx-md-0",
       "mx-md-2",
@@ -500,7 +504,9 @@
       "barre-de-navigation",
       "blog",
       "body-docs-collapse-15",
+      "body-file-collapse-0",
       "body-file-collapse-1",
+      "body-file-collapse-2",
       "bouton",
       "breadcrumb",
       "button",
@@ -517,8 +523,10 @@
       "collapse-1",
       "command-prompt",
       "cookies-etc",
+      "current-page-as-markdown-file",
       "custom-activity",
       "data-tables",
+      "default-configuration",
       "docs",
       "documentation",
       "example",
@@ -556,8 +564,11 @@
       "fichier",
       "fil-dariane",
       "file",
+      "file-shortcode",
       "footer-docs-collapse-15",
+      "footer-file-collapse-0",
       "footer-file-collapse-1",
+      "footer-file-collapse-2",
       "formula-katex",
       "formule-katex",
       "groupe-de-boutons",

layouts/shortcodes/file.html

@@ -38,6 +38,7 @@
 {{- $full := true -}}
 {{ if isset .Params "full" }}{{ $full = partial "utilities/CastBool.html" (.Get "full") }}{{ end -}}
 {{- $class := .Get "class" | default "" -}}
+{{- $options := .Get "options" -}}
 
 {{ if not (fileExists $file) }}
     {{ warnf "Cannot find file: '%q'. See %s" $file $.Position }}
@@ -65,7 +66,7 @@
     </ul>
     <div class="border-start border-end border-bottom mb-3">
         <div class="collapse multi-{{ $id }}{{ if $show }} show{{ end }} syntax-highlight" id="body-{{ $id }}">
-            {{- highlight (trim $content "\r\n") $lang "" -}}
+            {{- highlight (trim $content "\r\n") $lang $options -}}
         </div>
         <div class="collapse multi-{{ $id }}{{ if not $show }} show{{ end }} p-3" id="footer-{{ $id }}"><i>...</i></div>
     </div>