From 14ec6fb3ec36f61f01107b9e53ff8d2ec1b32c78 Mon Sep 17 00:00:00 2001
From: Jefferson Rafael Kozerski <jeff.drumgod@gmail.com>
Date: Fri, 22 Mar 2024 11:51:59 -0300
Subject: [PATCH] Refactor slot name in Operation component

---
 .../components/operation/Operation.astro      | 29 +++++++++++++++----
 1 file changed, 24 insertions(+), 5 deletions(-)

diff --git a/packages/starlight-openapi-rapidoc/components/operation/Operation.astro b/packages/starlight-openapi-rapidoc/components/operation/Operation.astro
index 807d444..e03cd2a 100644
--- a/packages/starlight-openapi-rapidoc/components/operation/Operation.astro
+++ b/packages/starlight-openapi-rapidoc/components/operation/Operation.astro
@@ -52,6 +52,9 @@ const rapidocProps: Record<string, any> = {
 }
 
 const { operation } = pathItemOperation
+const slotName = `${pathItemOperation.method}-${
+  pathItemOperation?.path?.replaceAll('{', '-')?.replaceAll('}', '-') ?? ''
+}`
 ---
 
 <script is:inline define:vars={{ schemaFiltred }}>
@@ -109,10 +112,7 @@ const { operation } = pathItemOperation
 </script>
 
 <rapi-doc id="starlight-openapi-rapidoc" {...rapidocProps}>
-  <div
-    slot={`${pathItemOperation.method}-${pathItemOperation?.path?.replaceAll('{', '-')?.replaceAll('}', '-') ?? ''}`}
-    id="starlight-openapi-rapidoc-servers"
-  >
+  <div slot={slotName} id="starlight-openapi-rapidoc-servers">
     <label for="starlight-openapi-rapidoc-servers-select">Server</label>
     <select id="starlight-openapi-rapidoc-servers-select">
       {
@@ -150,7 +150,7 @@ const { operation } = pathItemOperation
 </div>
 
 <script is:inline src="https://unpkg.com/rapidoc/dist/rapidoc-min.js"></script>
-<style is:inline>
+<style is:inline define:vars={{ slotName: `'${slotName}'` }}>
   #starlight-openapi-rapidoc {
     background-color: transparent !important;
   }
@@ -162,5 +162,24 @@ const { operation } = pathItemOperation
     justify-content: flex-start;
     align-items: baseline;
     gap: 10px;
+    order: -4;
+  }
+  #starlight-openapi-rapidoc::part(section-operation) {
+    display: flex;
+    flex-direction: column;
+  }
+  #starlight-openapi-rapidoc::part(section-operation-summary) {
+    margin-top: 0;
+    order: -2;
+  }
+  #starlight-openapi-rapidoc::part(section-operation-webhook-method) {
+    order: -3;
+  }
+  #starlight-openapi-rapidoc::part(var(--slotName)) {
+    order: 3;
+  }
+
+  #starlight-openapi-rapidoc::part(section-operation-tag) {
+    display: none;
   }
 </style>