Merge pull request #371 from gethinode/markdumay-patch-2

Update tested nodejs versions

.github/workflows/build.yml

@@ -12,7 +12,7 @@ jobs:
     strategy:
       matrix:
         os: [macos-latest, windows-latest, ubuntu-latest]
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     runs-on: ${{ matrix.os }}

.github/workflows/lint.yml

@@ -14,7 +14,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:

config/_default/params.toml

@@ -5,6 +5,9 @@
     enableDarkMode = true
     modes = ["light", "dark"]
     canonifyAssetsURLs = false
+    [main.externalLinks]
+        cue = false
+        tab = false
 # toml-docs-end main
 
 # toml-docs-start modules

go.mod

@@ -3,7 +3,7 @@ module github.com/gethinode/hinode
 go 1.19
 
 require (
-	github.com/gethinode/mod-bootstrap v1.1.0 // indirect
+	github.com/gethinode/mod-bootstrap v1.1.1 // indirect
 	github.com/gethinode/mod-flexsearch v1.1.4 // indirect
 	github.com/gethinode/mod-fontawesome v1.2.1 // indirect
 	github.com/gethinode/mod-katex v1.0.2 // indirect

go.sum

@@ -2,6 +2,8 @@ github.com/gethinode/mod-bootstrap v1.0.1 h1:NDZar+UEL42YHCvzzO+jVgqkZU5INA12Bpj
 github.com/gethinode/mod-bootstrap v1.0.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-bootstrap v1.1.0 h1:BbalsW8kmFhv+J+dcc41TGcjIlM/p69AB0h0oGhAXIU=
 github.com/gethinode/mod-bootstrap v1.1.0/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
+github.com/gethinode/mod-bootstrap v1.1.1 h1:Tx4M5hGVOFrEaxnUONDAm6N9xuRi5UphKlT7F26HujU=
+github.com/gethinode/mod-bootstrap v1.1.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-flexsearch v1.0.1 h1:FJkRsUzSnQTXl3MWCigT4E6vfff870UWTnkGqaDGIhA=
 github.com/gethinode/mod-flexsearch v1.0.1/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-flexsearch v1.1.0 h1:7BCMyQDlYlskNXuazt8Jg/jg9WREexu2xVkYqThkAX4=

layouts/partials/assets/button.html

@@ -22,6 +22,10 @@
                     "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
     "clipboard"     Optional text to be copied to the clipboard when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
 -->
 
 {{- $title := trim .title " \r\n" -}}
@@ -95,6 +99,7 @@
 {{- end -}}
 
 {{- $class := .class }}
+{{ with $badge }}{{ $class = printf "%s me-3" $class }}{{ end }}
 
 {{- $order := "last" -}}
 {{- with .order }}{{ $order = . }}{{ end -}}
@@ -113,8 +118,27 @@
 {{- $toast := .toast -}}
 {{- $clipboard := .clipboard -}}
 
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $href)).Host (urls.Parse site.BaseURL).Host -}}
+{{- $target := "" -}}
+{{- $rel := "" -}}
+
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if and $title $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $title = printf "%s %s" $title $suffix | safeHTML -}}
+    {{- end -}}
+{{- end -}}
+
 <a aria-label="{{ $title }}" {{ if ne $state "disabled" }}{{ with $href }}href="{{ . }}"{{ end }}{{ end }}
     {{ with $id }}id="{{ . }}"{{ end }}
+    {{ with $target }}target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}
     {{ with $toast }}data-toast-target="{{ $toast }}"{{ end }}
     {{ with $clipboard }}data-clipboard="{{ $clipboard }}"{{ end }}
     {{ if eq $type "button" }}class="btn btn-{{ if $outline }}outline-{{ end }}{{ $color }} {{ if ne $size "md"}}btn-{{ $size }}{{ end }} position-relative {{ if in (slice "disabled" "active") $state }}{{ $state }}{{ end }} {{ $class }}"
@@ -127,8 +151,8 @@
     >
 
     <div class="d-flex justify-content-{{ $justify }}">
-        <div>{{ $title }}</div>
+        <div class="my-auto">{{ $title }}</div>
-        {{- with $icon }}<div class="align-self-center{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
+        {{- with $icon }}<div class="align-self-center{{ if $title }}{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
     </div>
 
     {{- with $badge }}

layouts/partials/assets/navbar-item.html

@@ -9,12 +9,24 @@
 {{- $isActive := hasPrefix $pageURL $menuURL -}}
 {{- $isAlias := $menu.Params.alias -}}
 {{- $isIcon := $menu.Params.icon -}}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
 
 {{- $url := urls.Parse $menuURL -}}
 {{- $baseURL := urls.Parse $.Site.Params.Baseurl -}}
 {{- $isExternal := ne $url.Host $baseURL.Host -}}
 {{- $externalHref := "" }}
-{{- if $isExternal }}{{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}{{ end -}}
+{{- $suffix := "" }}
+
+{{- if $isExternal }}
+    {{- if $tab -}}
+        {{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix = partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+    {{- end -}}
+{{ end -}}
 
 {{- $mainNav := urlize (lower $menu.Name) -}}
 {{- $childNav := "" -}}
@@ -44,5 +56,5 @@
     {{- with $menu.Pre }}{{ . }}{{ end -}}
     <span {{ if $isActive }} class="active"{{ end }}>{{ if not $isIcon }}{{ $menu.Name }}{{ end }}</span>
     {{- with $menu.Post }}{{ . }}{{ end -}}
-    {{- if and $isExternal (not $isIcon)}} {{ partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}{{ end -}}
+    {{- if not $isIcon }} {{ $suffix }}{{ end -}}
 </a>

layouts/partials/assets/navbar.html

@@ -21,11 +21,11 @@
     {{- $collapsed := .collapsed -}}
 
     <li class="nav-item dropdown {{ if $collapsed }}d-{{ $size }}-none{{ else }}d-none d-{{ $size }}-block{{ end }}">
-        <a class="nav-link dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false" id="navbar-color-theme">
+        <a class="nav-link dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false" id="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
             {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon-active") }} {{ if $collapsed }} {{ T "colorMode" }} {{ end }}
             <span class="d-md-none"></span>
         </a>
-        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbar-color-theme">
+        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
             <li>
                 <a class="dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}" data-bs-theme-value="light" href="#!">
                     {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon") }}

layouts/partials/assets/sharing.html

@@ -10,7 +10,7 @@
             {{ T "shareLink" }}
             {{- range $index, $item := $list -}}
                 {{- $url := $item.url -}}
-                {{- $url = replace $url "{url}" $page.RelPermalink -}}
+                {{- $url = replace $url "{url}" $page.Permalink -}}
                 {{- $url = replace $url "{title}" (urlquery $page.Title) -}}
                 {{- $url = $url | safeURL -}}
                 {{- $target := "" -}}

layouts/partials/footer/social.html

@@ -1,3 +1,4 @@
+{{- $tab := site.Params.main.externalLinks.tab -}}
 <div class="container-fluid">
     <div class="row row-cols-1 row-cols-sm-4 bg-primary p-3 bg-opacity-{{ .Site.Params.style.themeOpacity | default "25" | safeHTML }} align-items-center">
         <div class="col col-md-2 d-none d-md-block"></div>
@@ -7,7 +8,7 @@
         </div>
         <div class="col text-sm-start text-center col-sm-6 col-md-4">
             {{ range .Site.Menus.social -}}
-                <a href="{{ .URL }}" target="_blank" rel="noopener noreferrer" aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
+                <a href="{{ .URL }}" {{ if $tab }} target="_blank" rel="noopener noreferrer"{{ end }} aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
                     {{ .Pre | safeHTML }}
                 </a>
             {{ end -}}

layouts/partials/utilities/link.html

@@ -0,0 +1,43 @@
+{{ $destination := .destination }}
+{{- if not $destination -}}
+    {{- errorf "partial [utilities/link.html] - Missing param 'destination'" -}}
+{{- end -}}
+
+{{- $target := "" -}}
+{{- $rel := "" -}}
+{{- $case := .case | default true }}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $destination)).Host (urls.Parse site.BaseURL).Host -}}
+
+{{ $text := .text }}
+{{- if not $text -}}
+    {{ if $isExternal }}
+        {{ $text = (urls.Parse (absURL $destination)).Host }}
+    {{ else }}
+        {{ $target := site.GetPage $destination }}
+        {{ if not $target }}
+            {{- errorf "partial [utilities/link.html] - Cannot find page: %s" $destination -}}
+        {{ else }}
+            {{ $text = $target.Title }}
+            {{ if not $case }}{{ $text = lower $text }}{{ end }}
+            {{ $destination = $target.RelPermalink }}
+        {{ end }}
+    {{ end }}
+{{- end -}}
+
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $text = printf "%s %s" $text $suffix | safeHTML -}}
+    {{- end -}}
+{{ else }}
+    {{ $destination = relLangURL $destination }}
+{{- end -}}
+
+<a href="{{ $destination | safeURL }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{ $text }}</a>

layouts/shortcodes/alert.html

@@ -4,10 +4,27 @@
                     "warning", "info", "light", "dark", "white" or "black".
     "dismissible"   Optional flag to indicate the alert is dismissible, defaults to false.
     "icon"          Optional class and name of a Font Awesome icon to include.
+    "type"          Optional type of the alert, either "danger" or "info". Generates an alert with related color and
+                    icon.
 -->
 
 {{- $error := false -}}
 {{ $color := "primary" -}}
+{{ $icon := "" }}
+{{ $type := "" -}}
+
+{{ with .Get "type" }}{{ $type = . }}{{ end -}}
+{{ $supportedTypes := slice "danger" "info" -}}
+{{ if $type }}
+    {{ if not (in $supportedTypes $type) -}}
+        {{ errorf "Invalid value for param 'type': %s" .Position -}}
+        {{ $error = true -}}
+    {{ else }}
+        {{ $color = $type }}
+        {{ if eq $type "danger" }}{{ $icon = "fas triangle-exclamation" }}{{ else }}{{ $icon = "fa lightbulb" }}{{ end }}
+    {{ end -}}
+{{ end -}}
+
 {{ with .Get "color" }}{{ $color = . }}{{ end -}}
 {{ $supportedColors := slice "primary" "secondary" "success" "danger" "warning" "info" "light" "dark" -}}
 {{ if not (in $supportedColors $color) -}}
@@ -15,9 +32,9 @@
     {{ $error = true -}}
 {{ end -}}
 
-{{ $icon := "" }}
+{{ with .Get "icon" }}{{ $icon = . }}{{ end }}
-{{ with .Get "icon" }}
+{{ with $icon }}
-    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-pull-left" .)) }}
+    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-fw" .)) }}
 {{ end }}
 
 {{ $dismissibleParam := "false" -}}
@@ -32,9 +49,11 @@
 {{ end -}}
 
 {{- if not $error -}}
-    <div class="alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
+    <div class="d-flex alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
-        {{ with $icon }}{{ . }}{{ end }}
+        {{ with $icon }}<div class="pt-1 pe-2">{{ . }}</div>{{ end }}
-        {{ trim .Inner " \r\n" | markdownify | safeHTML -}}
+        <div class="flex-grow-1 my-auto">
-        {{ if $dismissible }}<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>{{ end }}
+            {{ trim .Inner " \r\n" | markdownify | safeHTML -}}
+            {{ if $dismissible }}<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>{{ end }}
+        </div>
     </div>
 {{- end -}}

layouts/shortcodes/button.html

@@ -12,17 +12,29 @@
     "aria-label"    Optional label for the badge.
     "tooltip"       Optional text to display in a tooltip. Cannot be used together with collapse. Ignored for active/
                     inactive buttons.
-    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive buttons.
+    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive
+                    buttons.
     "placement"     Optional position of the tooltip: "top" (default), "bottom", "left", or "right". 
+    "class"         Optional class attribute of the button element, e.g. “p-5”.
+    "icon"          Font Awesome icon class attribute, required unless button title is set. An example value is
+                    "fas sort".
+    "order"         Optional order of the icon, either "first" or "last" (default).
+    "justify"       Optional justification of the button title and icon, either "start", "end", "center" (default),
+                    "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
 -->
 
 {{ $error := false }}
 {{ $type := "button" -}}
 
+{{- $icon := .Get "icon" }}
 {{ $title := trim .Inner " \r\n" -}}
-{{ if not $title -}}
+{{ if not (or $title $icon) -}}
-    {{ errorf "Missing inner element text: %s" .Position -}}
+    {{ errorf "Missing icon or inner element text: %s" .Position -}}
     {{ $error = true }}
 {{ end -}}
 
@@ -69,6 +81,7 @@
 {{ if $relref }}
     {{ $href = relref . $relref }}
 {{ end }}
+{{ $class := .Get "class" -}}
 
 {{ $placement := "top" -}}
 {{ with .Get "placement" }}{{ $placement = . }}{{ end -}}
@@ -80,6 +93,25 @@
 
 {{- $toast := .Get "toast" -}}
 
+{{- $order := "last" -}}
+{{- with .Get "order" }}{{ $order = . }}{{ end -}}
+{{- $supportedOrders := slice "first" "last" -}}
+{{- if not (in $supportedOrders $order) -}}
+    {{ errorf "Invalid value for param 'order': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $justify := "center" -}}
+{{- with .Get "justify" }}{{ $justify = . }}{{ end -}}
+{{- $supportedJustify := slice "start" "end" "center" "between" "around" "evenly" -}}
+{{- if not (in $supportedJustify $justify) -}}
+    {{ errorf "Invalid value for param 'justify': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $cue := .Get "cue" | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .Get "tab" | default site.Params.main.externalLinks.tab -}}
+
 {{ if not $error }}
     {{- partial "assets/button.html" (dict 
         "type" $type
@@ -94,7 +126,13 @@
         "href" $href
         "id" $id
         "state" $state
+        "class" $class
         "placement" $placement
+        "icon" $icon
+        "order" $order
+        "justify" $justify
+        "cue" $cue
+        "tab" $tab
         "toast" $toast)
     -}} 
 {{ end }}

layouts/shortcodes/link.html

@@ -0,0 +1,55 @@
+<!-- 
+    Generates a link for a given named link or url. The shortcode supports a single unnamed parameter, or various named
+    parameters. The unnamed parameter is recognized as a named link if it does not contain any "/", otherwise it is
+    treated as a url. Any inner text is rendered as the link title, otherwise it uses the host name (for external links)
+    or page name (for internal links). The shortcode supports the following named arguments:
+    "name"          Optional name of the link maintained in the "links" section of the site's parameters. If omitted,
+                    the "url" argument should be provided instead.
+    "url"           Optional url of the link, including the scheme ("http" or "https"). If omitted, the "name" argument
+                    should be provided instead.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "main.externalLinks.cue" in the site's parameters.
+    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
+                    "main.externalLinks.tab" in the site's parameters.
+    "case"          Optional flag to indicate if the retrieved title (e.g. no inner text is provided) of an internal
+                    link should use its original case, defaults to true. If false, the title is set to lower case.
+-->
+
+{{- $error := false -}}
+{{ $name := "" }}
+{{ $url := "" }}
+{{ $case := true }}
+{{ $cue := site.Params.main.externalLinks.cue }}
+{{ $tab := site.Params.main.externalLinks.tab }}
+
+{{ if .IsNamedParams }}
+    {{ $name = .Get "name" }}
+    {{ $url = .Get "url" }}
+    {{ $cue = .Get "cue" | default site.Params.main.externalLinks.cue }}
+    {{ $tab = .Get "tab" | default site.Params.main.externalLinks.tab }}
+    {{ $case = .Get "case" | default true }}
+{{ else if strings.Contains (.Get 0) "/" }}
+    {{ $url = .Get 0 }}
+{{ else }}
+    {{ $name = .Get 0 }}
+{{ end }}
+
+{{ if not (or $name $url) }}
+    {{ errorf "Expected param 'name' or 'url': %s" .Position -}}
+    {{ $error = true -}}
+{{ end }}
+
+{{ if $name }}
+    {{ $url = index site.Params.links $name }}
+    {{ if not $url }}
+        {{ errorf "Cannot find link '%s': %s" $name .Position -}}
+        {{ $error = true -}}
+    {{ end }}
+{{ end }}
+
+{{ $text := trim .Inner " \r\n" | markdownify | safeHTML }}
+
+{{- if not $error -}}
+    {{ partial "utilities/link.html" (dict "destination" $url "text" $text "cue" $cue "tab" $tab "case" $case) }}
+{{- end -}}
+

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gethinode/hinode",
-  "version": "0.16.5",
+  "version": "0.16.8",
   "description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
   "keywords": [
     "hugo",
@@ -44,7 +44,7 @@
     "create:syntax-light": "hugo gen chromastyles --style=github > ./assets/scss/components/_syntax-light.scss",
     "create:syntax-dark": "hugo gen chromastyles --style=github-dark > ./assets/scss/components/_syntax-dark.scss",
     "update:syntax-dark": "replace-in-files --string=\"#ffffcc\" --replacement=\"#b8b800\" ./assets/scss/components/_syntax-dark.scss",
-    "upgrade": "npx npm-check-updates -u && mod:update"
+    "upgrade": "npx npm-check-updates -u && npm run -s mod:update"
   },
   "repository": {
     "type": "git",