fix: pane cannot scale when its size became 0

src/client/pages/component-docs.vue

@@ -70,7 +70,7 @@ watch(keywords, () => {
           </div>
         </div>
       </Pane>
-      <Pane>
+      <Pane min-size="8">
         <div h-full select-none overflow-scroll p-2 class="no-scrollbar">
           <JsonEditorVue
             v-show="list.length" v-model="content" h-full class="json-editor-vue" :class="[

src/client/pages/components.vue

@@ -80,7 +80,7 @@ function openInEditor() {
           <ComponentTreeNode v-for="(item) in componentTree" :key="item.id" :data="item" />
         </div>
       </Pane>
-      <Pane>
+      <Pane min-size="8">
         <div v-if="normalizedComponentState.length" border="b base" flex justify-between px-4 py-2>
           <span v-if="selectedComponentName" text-sm text-primary op90>&lt;{{ selectedComponentName }}&gt;</span>
           <p flex>

src/client/pages/pinia.vue

@@ -45,7 +45,7 @@ const data = computed(() => {
           </div>
         </div>
       </Pane>
-      <Pane :size="60">
+      <Pane min-size="8" :size="60">
         <div h-screen select-none overflow-scroll p-2 class="no-scrollbar">
           <StateFields v-for="(item, index) in data" :id="index" :key="index" :data="item" />
         </div>

src/client/pages/routes.vue

@@ -38,7 +38,7 @@ import { activeRouteRecordIndex, activeRouteRecordMatcherState, routeRecordMatch
           </div>
         </div>
       </Pane>
-      <Pane size="60">
+      <Pane min-size="8" size="60">
         <div h-screen select-none overflow-scroll p-2 class="no-scrollbar">
           <StateFields :data="activeRouteRecordMatcherState" />
         </div>

src/client/pages/timeline.vue

@@ -33,12 +33,12 @@ import {
           </div>
         </div>
       </Pane>
-      <Pane border="r base" size="45">
+      <Pane border="r base" min-size="8" size="45">
         <div h-screen select-none overflow-scroll class="no-scrollbar">
           <TimelineEvent :data="activeTimelineEvents" :selected="activeTimelineEventIndex" @update-selected="toggleTimelineEventIndex" />
         </div>
       </Pane>
-      <Pane v-if="timelineEventDetails.value" size="35">
+      <Pane v-if="timelineEventDetails.value" min-size="8" size="35">
         <div h-screen select-none overflow-scroll p-2 class="no-scrollbar">
           <StateFields :data="timelineEventDetails" />
         </div>