Tab: fix aria-controls

When porting, I thought I was being clever by just using ids instead of refs in $api.panels
But I didn't notice that the refs let you distinguish those panels which are rendered from those which are not.
My implementation had aria-controls= set for all tabs, even when their panels were not in the DOM.

src/lib/components/tabs/TabGroup.svelte

@@ -1,4 +1,8 @@
 <script lang="ts" context="module">
+  interface PanelData {
+    id: string;
+    ref: Readable<HTMLElement | null>;
+  }
   export type StateDefinition = {
     // State
     selectedIndex: number | null;
@@ -6,14 +10,14 @@
     activation: "auto" | "manual";
 
     tabs: (HTMLElement | null)[];
-    panels: string[];
+    panels: PanelData[];
 
     // State mutators
     setSelectedIndex(index: number): void;
     registerTab(tab: HTMLElement | null): void;
     unregisterTab(tab: HTMLElement | null): void;
-    registerPanel(panel: string): void;
-    unregisterPanel(panel: string): void;
+    registerPanel(panel: PanelData): void;
+    unregisterPanel(panel: PanelData): void;
   };
 
   const TABS_CONTEXT_NAME = "headlessui-tabs-context";