From f29f19affff5313ad904abace37226e0bd313edb Mon Sep 17 00:00:00 2001
From: racehd <7813112-racehd@users.noreply.gitlab.com>
Date: Sun, 1 Dec 2024 10:30:34 -0500
Subject: [PATCH 1/2] tpl/tplimpl: Add details shortcode

- Add new shortcode to render details HTML element.
- Implement integration tests to check: default state, custom summary, open state,  attribute sanitization, allowed attributes, and localization of default summary text.
- Update docs to include details shortcode.

Closes # 13090
---
 content/en/content-management/shortcodes.md | 34 +++++++++++++++++++++
 data/embedded_template_urls.toml            |  1 +
 2 files changed, 35 insertions(+)

diff --git a/content/en/content-management/shortcodes.md b/content/en/content-management/shortcodes.md
index 8e345f2fb..7a589a340 100644
--- a/content/en/content-management/shortcodes.md
+++ b/content/en/content-management/shortcodes.md
@@ -94,6 +94,40 @@ Example usage:
 
 Although you can call this shortcode using the `{{</* */>}}` notation, computationally it is more efficient to call it using the `{{%/* */%}}` notation as shown above.
 
+### details
+
+{{< new-in 0.140.0 >}}
+
+{{% note %}}
+To override Hugo's embedded `details` shortcode, copy the [source code] to a file with the same name in the layouts/shortcodes directory.
+
+This may be useful if you are wanting access to more global HTML attributes. 
+
+[source code]: {{% eturl details %}}
+{{% /note %}}
+
+Use the `details` shortcode to generate a collapsible details HTML element. For example:
+
+```text
+{{</* details summary="Custom Summary Text" */>}}
+Showing custom `summary` text.
+{{</* /details */>}}
+```
+
+Additional examples can be found in the source code. The `details` shortcode can use the following named arguments:
+
+summary
+: (`string`) Optional. Specifies the content of the child summary element. Default is "Details"
+
+open
+: (`bool`) Optional. Whether to initially display the contents of the details element. Default is `false`.
+
+name
+: (`string`) Optional. The value of the element's name attribute.
+
+class
+: (`string`) Optional. The value of the element's class attribute.
+
 ### figure
 
 {{% note %}}
diff --git a/data/embedded_template_urls.toml b/data/embedded_template_urls.toml
index 38b437fe1..b7247f272 100644
--- a/data/embedded_template_urls.toml
+++ b/data/embedded_template_urls.toml
@@ -25,6 +25,7 @@
 
 # Shortcodes
 'comment' = 'shortcodes/comment.html'
+'details' = 'shortcodes/details.html'
 'figure' = 'shortcodes/figure.html'
 'gist' = 'shortcodes/gist.html'
 'highlight' = 'shortcodes/highlight.html'

From c9b23cf6dc7c7aba75b8e48fd0cec9aec949a2e9 Mon Sep 17 00:00:00 2001
From: Joe Mooring <joe.mooring@veriphor.com>
Date: Fri, 13 Dec 2024 03:25:10 -0800
Subject: [PATCH 2/2] tpl/tplimpl: Update details shortcode

- Remove localization of default summary value
- Add title attribute
- Reformat to be consistent with other embedded templates
- Simplify and improve integration test
- Update documentation
---
 content/en/content-management/shortcodes.md | 34 +++++++++++++--------
 1 file changed, 22 insertions(+), 12 deletions(-)

diff --git a/content/en/content-management/shortcodes.md b/content/en/content-management/shortcodes.md
index 7a589a340..47e4f94ed 100644
--- a/content/en/content-management/shortcodes.md
+++ b/content/en/content-management/shortcodes.md
@@ -101,32 +101,42 @@ Although you can call this shortcode using the `{{</* */>}}` notation, computati
 {{% note %}}
 To override Hugo's embedded `details` shortcode, copy the [source code] to a file with the same name in the layouts/shortcodes directory.
 
-This may be useful if you are wanting access to more global HTML attributes. 
-
 [source code]: {{% eturl details %}}
 {{% /note %}}
 
-Use the `details` shortcode to generate a collapsible details HTML element. For example:
+Use the `details` shortcode to create a `details` HTML element. For example:
 
 ```text
-{{</* details summary="Custom Summary Text" */>}}
-Showing custom `summary` text.
+{{</* details summary="See the details" */>}}
+This is a **bold** word.
 {{</* /details */>}}
 ```
 
-Additional examples can be found in the source code. The `details` shortcode can use the following named arguments:
+Hugo renders this to:
+
+```html
+<details>
+  <summary>See the details</summary>
+  <p>This is a <strong>bold</strong> word.</p>
+</details>
+```
+
+The details shortcode accepts these named arguments:
 
 summary
-: (`string`) Optional. Specifies the content of the child summary element. Default is "Details"
+: (`string`) The content of the child `summary` element rendered from Markdown to HTML. Default is `Details`.
 
 open
-: (`bool`) Optional. Whether to initially display the contents of the details element. Default is `false`.
-
-name
-: (`string`) Optional. The value of the element's name attribute.
+: (`bool`) Whether to initially display the content of the `details` element. Default is `false`.
 
 class
-: (`string`) Optional. The value of the element's class attribute.
+: (`string`) The value of the element's `class` attribute.
+
+name
+: (`string`) The value of the element's `name` attribute.
+
+title
+: (`string`) The value of the element's `title` attribute.
 
 ### figure