feat(examples): make multi-file examples collapsible

assets/scss/_examples.scss

@@ -13,6 +13,19 @@
   }
 }
 
+.example-file-details {
+  margin: 1.2rem 0;
+
+  > summary {
+    cursor: pointer;
+    font-weight: $font-semibold;
+  }
+
+  &[open] > summary {
+    margin-bottom: 0.6rem;
+  }
+}
+
 @media (min-width: 768px) {
   .td-404 main,
   .td-main main .examples-index-page {

content/en/examples/score/resources/community-provisioners/azure-blob.md

@@ -60,8 +60,12 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-azurite-azure-blob.provisioners.yaml" %}}
 {{% example-file filename="10-azurite-azure-blob.provisioners.yaml" dir="score/resources/community-provisioners/azure-blob/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/azure-blob/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/dapr-pubsub.md

@@ -64,8 +64,12 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-rabbitmq-dapr-pubsub.provisioners.yaml" %}}
 {{% example-file filename="10-rabbitmq-dapr-pubsub.provisioners.yaml" dir="score/resources/community-provisioners/dapr-pubsub/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-redis-dapr-pubsub.provisioners.yaml" %}}
 {{% example-file filename="10-redis-dapr-pubsub.provisioners.yaml" dir="score/resources/community-provisioners/dapr-pubsub/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/dns.md

@@ -14,9 +14,15 @@ flavor: "Resources"
 
 {{< tabs >}}
 {{% tab name="score-compose" %}}
+{{% details "10-dns-in-codespace.provisioners.yaml" %}}
 {{% example-file filename="10-dns-in-codespace.provisioners.yaml" dir="score/resources/community-provisioners/dns/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dns-with-url.provisioners.yaml" %}}
 {{% example-file filename="10-dns-with-url.provisioners.yaml" dir="score/resources/community-provisioners/dns/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/dns/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 
@@ -66,9 +72,15 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-dns-in-codespace.provisioners.yaml" %}}
 {{% example-file filename="10-dns-in-codespace.provisioners.yaml" dir="score/resources/community-provisioners/dns/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dns-with-url.provisioners.yaml" %}}
 {{% example-file filename="10-dns-with-url.provisioners.yaml" dir="score/resources/community-provisioners/dns/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/dns/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/environment.md

@@ -10,13 +10,21 @@ flavor: "Resources"
 
 ---
 
+{{% details ".env" %}}
 {{% example-file filename=".env" dir="score/resources/community-provisioners/environment" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "score.yaml" %}}
 {{% example-file filename="score.yaml" dir="score/resources/community-provisioners/environment" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 {{< tabs >}}
 {{% tab name="score-compose" %}}
+{{% details "10-env.provisioners.yaml" %}}
 {{% example-file filename="10-env.provisioners.yaml" dir="score/resources/community-provisioners/environment/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/environment/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 
@@ -66,8 +74,12 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-env.provisioners.yaml" %}}
 {{% example-file filename="10-env.provisioners.yaml" dir="score/resources/community-provisioners/environment/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/environment/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/llm-model.md

@@ -14,12 +14,24 @@ flavor: "Resources"
 
 {{< tabs >}}
 {{% tab name="score-compose" %}}
+{{% details "10-dmr-llm-model-for-openai-clients.provisioners.yaml" %}}
 {{% example-file filename="10-dmr-llm-model-for-openai-clients.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dmr-llm-model-via-curl-cmd.provisioners.yaml" %}}
 {{% example-file filename="10-dmr-llm-model-via-curl-cmd.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dmr-llm-model-via-curl-service.provisioners.yaml" %}}
 {{% example-file filename="10-dmr-llm-model-via-curl-service.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dmr-llm-model-via-service-provider.provisioners.yaml" %}}
 {{% example-file filename="10-dmr-llm-model-via-service-provider.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-dmr-llm-model.provisioners.yaml" %}}
 {{% example-file filename="10-dmr-llm-model.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-ollama-llm-model-service.provisioners.yaml" %}}
 {{% example-file filename="10-ollama-llm-model-service.provisioners.yaml" dir="score/resources/community-provisioners/llm-model/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/redis.md

@@ -60,9 +60,15 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-redis-helm-template.provisioners.yaml" %}}
 {{% example-file filename="10-redis-helm-template.provisioners.yaml" dir="score/resources/community-provisioners/redis/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-redis-helm-upgrade.provisioners.yaml" %}}
 {{% example-file filename="10-redis-helm-upgrade.provisioners.yaml" dir="score/resources/community-provisioners/redis/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "README.md" %}}
 {{% example-file filename="README.md" dir="score/resources/community-provisioners/redis/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/route.md

@@ -60,10 +60,18 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-ingress-route.provisioners.yaml" %}}
 {{% example-file filename="10-ingress-route.provisioners.yaml" dir="score/resources/community-provisioners/route/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-ingress-with-netpol-route.provisioners.yaml" %}}
 {{% example-file filename="10-ingress-with-netpol-route.provisioners.yaml" dir="score/resources/community-provisioners/route/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-shared-gateway-httproute-with-netpol.provisioners.yaml" %}}
 {{% example-file filename="10-shared-gateway-httproute-with-netpol.provisioners.yaml" dir="score/resources/community-provisioners/route/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-shared-gateway-httproute.provisioners.yaml" %}}
 {{% example-file filename="10-shared-gateway-httproute.provisioners.yaml" dir="score/resources/community-provisioners/route/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

content/en/examples/score/resources/community-provisioners/service.md

@@ -10,14 +10,24 @@ flavor: "Resources"
 
 ---
 
+{{% details "backend-openapi.yaml" %}}
 {{% example-file filename="backend-openapi.yaml" dir="score/resources/community-provisioners/service" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "score-backend.yaml" %}}
 {{% example-file filename="score-backend.yaml" dir="score/resources/community-provisioners/service" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "score-frontend.yaml" %}}
 {{% example-file filename="score-frontend.yaml" dir="score/resources/community-provisioners/service" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 {{< tabs >}}
 {{% tab name="score-compose" %}}
+{{% details "10-service-with-microcks.provisioners.yaml" %}}
 {{% example-file filename="10-service-with-microcks.provisioners.yaml" dir="score/resources/community-provisioners/service/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-service.provisioners.yaml" %}}
 {{% example-file filename="10-service.provisioners.yaml" dir="score/resources/community-provisioners/service/score-compose" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 
@@ -67,9 +77,15 @@ docker ps
 
 {{%/ tab %}}
 {{% tab name="score-k8s" %}}
+{{% details "10-service-with-microcks-cli.provisioners.yaml" %}}
 {{% example-file filename="10-service-with-microcks-cli.provisioners.yaml" dir="score/resources/community-provisioners/service/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-service-with-netpol.provisioners.yaml" %}}
 {{% example-file filename="10-service-with-netpol.provisioners.yaml" dir="score/resources/community-provisioners/service/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
+{{% details "10-service.provisioners.yaml" %}}
 {{% example-file filename="10-service.provisioners.yaml" dir="score/resources/community-provisioners/service/score-k8s" githubUrl="https://github.com/score-spec/community-provisioners/blob/main" %}}
+{{% /details %}}
 
 ---
 

gen/examples-site/frontmatter.js

@@ -10,6 +10,9 @@ const { isDirectory } = require("./file-utils");
 const { beautify } = require("./content-utils");
 
 const sourceFolder = process.argv[2];
+const NON_COLLAPSIBLE_EXAMPLE_DIRECTORIES = new Set([
+  "score/specification/files",
+]);
 
 /**
  * Generates frontmatter content for a markdown file.
@@ -60,6 +63,37 @@ const generateExampleFileContent = (file, dir, githubUrl) => {
   return `{{% example-file filename="${file}" dir="${dir}" githubUrl="${githubUrl}" %}}`;
 };
 
+/**
+ * Generates example file shortcodes, collapsing each file when multiple files
+ * are displayed together.
+ * @param {string[]} files - The filenames to display.
+ * @param {string} dir - The directory containing the files.
+ * @param {string} githubUrl - The GitHub URL for the files.
+ * @returns {string} The generated example files content.
+ */
+const generateExampleFilesContent = (files, dir, githubUrl) => {
+  const shouldCollapse =
+    files.length > 1 && !NON_COLLAPSIBLE_EXAMPLE_DIRECTORIES.has(dir);
+
+  return files
+    .map((file) => {
+      const exampleFileContent = generateExampleFileContent(
+        file,
+        dir,
+        githubUrl
+      );
+
+      if (!shouldCollapse) {
+        return exampleFileContent;
+      }
+
+      return `{{% details ${JSON.stringify(file)} %}}
+${exampleFileContent}
+{{% /details %}}`;
+    })
+    .join("\n");
+};
+
 /**
  * Processes the README.md file in the given path and extracts metadata, content, and excerpt.
  * @param {string} path - The path to the directory containing the README.md file.
@@ -131,12 +165,12 @@ const generateTabs = (
         const filesInDir = fs
           .readdirSync(directoryPath)
           .filter((file) => !isDirectory(`${directoryPath}/${file}`));
-        const directoryContent = filesInDir
-          .map((file) => {
-            const shortcodeDir = `${path}/${dirName}`;
-            return generateExampleFileContent(file, shortcodeDir, githubUrl);
-          })
-          .join("\n");
+        const shortcodeDir = `${path}/${dirName}`;
+        const directoryContent = generateExampleFilesContent(
+          filesInDir,
+          shortcodeDir,
+          githubUrl
+        );
 
         if (!tabsMap.has(dirName)) {
           tabsMap.set(dirName, { readmeContent: "", directoryContent: "" });
@@ -214,9 +248,11 @@ const buildFrontmatter = (
     options
   );
 
-  const otherFilesContent = otherFiles
-    .map((file) => generateExampleFileContent(file, dir, githubUrl))
-    .join("\n");
+  const otherFilesContent = generateExampleFilesContent(
+    otherFiles,
+    dir,
+    githubUrl
+  );
 
   writeContentToFile(
     path,

layouts/shortcodes/details.html

@@ -0,0 +1,11 @@
+{{- $summary := .Get 0 -}}
+{{- if not $summary -}}
+  {{- errorf "No summary provided for details shortcode" -}}
+{{- end -}}
+{{- if not .Inner -}}
+  {{- errorf "No content provided for details shortcode" -}}
+{{- end -}}
+<details class="example-file-details">
+  <summary>{{ $summary }}</summary>
+  {{ .Inner | markdownify }}
+</details>