Support for links and buttons in details summary (#26)

docs/pages/components/details.md

@@ -154,6 +154,39 @@ const App = () => (
 );
 ```
 
+### Header Actions
+
+You can now include anchor tags and buttons with `onClick` handlers within the `summary` slot.
+
+```html:preview
+<sl-details summary="Toggle Me">
+  <div slot="summary">
+    <a href="https://google.com">Link</a>
+    <sl-button href="https://google.com" size="small">Button with href</sl-button>
+    <sl-button size="small" onclick="() => {console.log('onClick called')}">Button with onClick</sl-button>
+  </div>
+  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
+  aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+</sl-details>
+```
+
+```pug:slim
+sl-details summary="Toggle Me"
+  | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
+  | aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+```
+
+```jsx:react
+import SlDetails from '@teamshares/shoelace/dist/react/details';
+
+const App = () => (
+  <SlDetails summary="Toggle Me">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
+    aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+  </SlDetails>
+);
+```
+
 ### Grouping Details
 
 Details are designed to function independently, but you can simulate a group or "accordion" where only one is shown at a time by listening for the `sl-show` event.

docs/pages/teamshares/changelog.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 2.0.1
+
+- Fix: Support for clickable links and buttons in the `summary` slot of `sl-details`.
+
 ## 2.0.0
 
 - **MASSIVE** set of changes from upstream (jumping from 2.5.0 > 2.11.2). This included a big restructuring of the codebase in upstream 2.6.0, which moved the component code into separate `name.component.ts` files. Lots of other files got moved around, the build process changed, and the docs site is now using eleventy. Please see the upstream change logs for more details.

src/components/details/details.component.ts

@@ -97,6 +97,15 @@ export default class SlDetails extends ShoelaceElement {
   }
 
   private handleSummaryClick(event: MouseEvent) {
+    const htmlElement = event.target as HTMLElement;
+    if (htmlElement) {
+      // If the element has its own behavior, return without calling preventDefault or toggling the visibility.
+      const hasHref = htmlElement.getAttribute('href');
+      const hasOnClick = typeof htmlElement.onclick === 'function';
+      if (hasHref || hasOnClick) {
+        return;
+      }
+    }
     event.preventDefault();
 
     if (!this.disabled) {