fix: component id 0 not being de-selected (#128)

* fix: component id 0 not being de-selected

* fix: start component counter at 1

* remove: id === 0 check

* fix: take 1 from id on window vars

* fix: take 1 from id on window vars

Author: ryangjchandler

packages/shell-chrome/src/backend.js

@@ -2,7 +2,7 @@ import { getComponentName, isSerializable, serializeHTMLElement, set, waitForAlp
 
 window.__alpineDevtool = {
     components: [],
-    uuid: 0,
+    uuid: 1,
     stopMutationObserver: false,
     hoverElement: null,
     observer: null,
@@ -140,7 +140,7 @@ function discoverComponents() {
 
         if (!rootEl.__alpineDevtool.id) {
             rootEl.__alpineDevtool.id = window.__alpineDevtool.uuid++
-            window[`$x${rootEl.__alpineDevtool.id}`] = rootEl.__x
+            window[`$x${rootEl.__alpineDevtool.id - 1}`] = rootEl.__x
         }
 
         var depth = 0

packages/shell-chrome/views/_partials/component.edge

@@ -18,9 +18,9 @@
         <div
             data-testid="console-global"
             class="text-white pl-2 text-xs"
-            :title="`Available as $x${component.id} in the console`"
+            :title="`Available as $x${component.id - 1} in the console`"
         >
-            = <span x-text="`$x${component.id}`"></span>
+            = <span x-text="`$x${component.id - 1}`"></span>
         </div>
     </h5>
 </a>