nexa-devtools 0.7.1 → 0.7.2

package/dist/components/NDevPanel.nexa

@@ -1,257 +1,428 @@
 <script setup>
-import { signal, computed, onMounted, onUnmounted } from 'nexa-framework'
-import { NCard, NButton, NBadge } from 'nexa-ui-kit'
+import { signal, computed, effect, onMounted, onUnmounted } from 'nexa-framework'
+import { NCard, NButton, NBadge, NInput } from 'nexa-ui-kit'
 
 const isOpen = signal(false)
-const activeTab = signal('signals') // 'signals' | 'components'
+const activeTab = signal('signals')
+const searchQuery = signal('')
+const editingSignalId = signal(null)
+const editValue = signal('')
+const expandedComponents = signal(new Set())
 
-const signals = signal([])
-const components = signal([])
-let intervalId = null
+const rawSignals = signal([])
+const rawComponents = signal([])
 
-const safeStringify = (val) => {
-  try { return JSON.stringify(val) } catch { return String(val) }
-}
+const api = () => typeof window !== 'undefined' ? window['__NEXA_DEVTOOLS__'] : null
 
-const refreshData = () => {
-  if (typeof window !== 'undefined' && window['__NEXA_DEVTOOLS__']) {
-    const api = window['__NEXA_DEVTOOLS__']
-    signals.value = Object.entries(api.inspectSignals()).map(([label, value]) => ({ label, value }))
-    components.value = api.inspectComponents()
+const filteredSignals = computed(() => {
+  const q = searchQuery.value.toLowerCase()
+  if (!q) return rawSignals.value
+  return rawSignals.value.filter(s => s.label.toLowerCase().includes(q))
+})
+
+const filteredComponents = computed(() => {
+  const q = searchQuery.value.toLowerCase()
+  if (!q) return rawComponents.value
+  return rawComponents.value.filter(c => c.name.toLowerCase().includes(q) || JSON.stringify(c.props).toLowerCase().includes(q))
+})
+
+let intervalId = null
+
+const refresh = () => {
+  const dev = api()
+  if (dev) {
+    rawSignals.value = dev.getSignalEntries()
+    rawComponents.value = dev.getComponentEntries()
   }
 }
 
 onMounted(() => {
-  refreshData()
-  if (!intervalId) {
-    intervalId = setInterval(refreshData, 1000)
-  }
+  refresh()
+  intervalId = setInterval(refresh, 500)
 })
 
 onUnmounted(() => {
-  if (intervalId) {
-    clearInterval(intervalId)
-    intervalId = null
-  }
+  if (intervalId) { clearInterval(intervalId); intervalId = null }
 })
+
+const startEdit = (id, currentValue) => {
+  editingSignalId.value = id
+  editValue.value = typeof currentValue === 'object' ? JSON.stringify(currentValue, null, 2) : String(currentValue)
+}
+
+const saveEdit = () => {
+  const dev = api()
+  if (dev && editingSignalId.value !== null) {
+    const entry = rawSignals.value.find(s => s.id === editingSignalId.value)
+    if (entry) {
+      let val = editValue.value
+      const current = entry.value
+      if (typeof current === 'number') {
+        val = Number(val)
+      } else if (typeof current === 'boolean') {
+        val = val === 'true' || val === true
+      } else if (current && typeof current === 'object') {
+        try { val = JSON.parse(val) } catch {}
+      }
+      dev.setSignalValue(editingSignalId.value, val)
+    }
+  }
+  editingSignalId.value = null
+  editValue.value = ''
+}
+
+const cancelEdit = () => {
+  editingSignalId.value = null
+  editValue.value = ''
+}
+
+const toggleExpand = (name) => {
+  const s = new Set(expandedComponents.value)
+  if (s.has(name)) s.delete(name)
+  else s.add(name)
+  expandedComponents.value = s
+}
+
+const formatValue = (val) => {
+  if (val === null) return 'null'
+  if (val === undefined) return 'undefined'
+  if (typeof val === 'object') {
+    try { return JSON.stringify(val) } catch { return String(val) }
+  }
+  return String(val)
+}
+
+const getType = (val) => {
+  if (val === null) return 'null'
+  if (Array.isArray(val)) return `array[${val.length}]`
+  const t = typeof val
+  return t === 'object' ? 'object' : t
+}
 </script>
 
 <template>
-  <div class="nexa-devtools" :class="{ 'is-open': isOpen.value }">
-    <button class="devtools-trigger" @click="isOpen.value = !isOpen.value">
-      <span class="trigger-icon">⚡</span>
-      <span class="trigger-label">DevTools</span>
+  <div class="ndp" :class="{ 'is-open': isOpen.value }">
+    <button class="ndp-trigger" @click="isOpen.value = !isOpen.value">
+      <span class="ndp-trigger-icon">⚡</span>
+      <span class="ndp-trigger-label">Nexa Dev</span>
+      <span class="ndp-badge" v-if="rawSignals.value.length">{{ rawSignals.value.length }}</span>
     </button>
 
-    <div v-if="isOpen.value" class="devtools-panel">
-      <NCard variant="glass" class="panel-card">
-        <header class="panel-header">
-          <div class="header-title">
-            <span class="logo">Nexa</span>
-            <span class="version">v0.5.2</span>
-            <button class="close-btn" @click="isOpen.value = false">✕</button>
+    <div v-if="isOpen.value" class="ndp-panel">
+      <div class="ndp-card">
+        <div class="ndp-header">
+          <div class="ndp-title-row">
+            <span class="ndp-logo">Nexa DevTools</span>
+            <span class="ndp-close" @click="isOpen.value = false">✕</span>
+          </div>
+          <div class="ndp-tabs">
+            <button :class="{ 'is-active': activeTab.value === 'signals' }" @click="activeTab.value = 'signals'">Signals</button>
+            <button :class="{ 'is-active': activeTab.value === 'components' }" @click="activeTab.value = 'components'">Components</button>
           </div>
-          <nav class="tab-nav">
-            <button 
-              :class="{ 'is-active': activeTab.value === 'signals' }" 
-              @click="activeTab.value = 'signals'"
-            >Signals</button>
-            <button 
-              :class="{ 'is-active': activeTab.value === 'components' }" 
-              @click="activeTab.value = 'components'"
-            >Components</button>
-          </nav>
-        </header>
+          <div class="ndp-search">
+            <input placeholder="Filter..." v-model="searchQuery.value" />
+          </div>
+        </div>
 
-        <div class="panel-content">
-          <!-- Signals Tab -->
-          <div v-if="activeTab.value === 'signals'" class="tab-pane">
-            <div v-for="sig in signals.value" :key="sig.label" class="data-item">
-              <span class="item-label">{{ sig.label }}</span>
-              <NBadge variant="primary" size="sm">{{ safeStringify(sig.value) }}</NBadge>
+        <div class="ndp-body">
+          <!-- SIGNALS TAB -->
+          <div v-if="activeTab.value === 'signals'" class="ndp-list">
+            <div v-for="sig in filteredSignals.value" :key="sig.id" class="ndp-item">
+              <div class="ndp-item-left">
+                <span class="ndp-item-label">{{ sig.label }}</span>
+                <NBadge size="xs" variant="subtle">{{ getType(sig.value) }}</NBadge>
+              </div>
+              <div class="ndp-item-right">
+                <div v-if="editingSignalId.value === sig.id" class="ndp-edit-row">
+                  <input class="ndp-edit-input" v-model="editValue.value" @keyup.enter="saveEdit" @keyup.escape="cancelEdit" />
+                  <button class="ndp-edit-save" @click="saveEdit">✓</button>
+                  <button class="ndp-edit-cancel" @click="cancelEdit">✕</button>
+                </div>
+                <div v-else class="ndp-value" @click="startEdit(sig.id, sig.value)" title="Click to edit">{{ formatValue(sig.value) }}</div>
+              </div>
+            </div>
+            <div v-if="filteredSignals.value.length === 0" class="ndp-empty">
+              {{ searchQuery.value ? 'No signals match filter.' : 'No signals registered.' }}
             </div>
-            <p v-if="signals.value.length === 0" class="empty-state">No signals registered.</p>
           </div>
 
-          <!-- Components Tab -->
-          <div v-if="activeTab.value === 'components'" class="tab-pane">
-            <div v-for="comp in components.value" :key="comp.id" class="data-item">
-              <span class="item-label">{{ comp.name }}</span>
-              <span class="item-id">#{{ comp.id }}</span>
+          <!-- COMPONENTS TAB -->
+          <div v-if="activeTab.value === 'components'" class="ndp-list">
+            <div v-for="comp in filteredComponents.value" :key="comp.id" class="ndp-item">
+              <div class="ndp-item-left" @click="toggleExpand(comp.name + comp.id)">
+                <span class="ndp-tree-toggle">{{ expandedComponents.value.has(comp.name + comp.id) ? '▼' : '▶' }}</span>
+                <span class="ndp-item-label">{{ comp.name }}</span>
+                <span class="ndp-item-depth" v-if="comp.depth > 0">d{{ comp.depth }}</span>
+              </div>
+              <div class="ndp-item-right">
+                <span class="ndp-item-id">#{{ comp.id }}</span>
+              </div>
+              <div v-if="expandedComponents.value.has(comp.name + comp.id)" class="ndp-detail">
+                <div class="ndp-detail-section">
+                  <div class="ndp-detail-title">Props</div>
+                  <div v-for="(val, key) in comp.props" :key="key" class="ndp-detail-row">
+                    <span class="ndp-detail-key">{{ key }}</span>
+                    <span class="ndp-detail-val">{{ formatValue(val) }}</span>
+                  </div>
+                  <div v-if="Object.keys(comp.props).length === 0" class="ndp-detail-empty">No props</div>
+                </div>
+              </div>
+            </div>
+            <div v-if="filteredComponents.value.length === 0" class="ndp-empty">
+              {{ searchQuery.value ? 'No components match filter.' : 'No components mounted.' }}
             </div>
-            <p v-if="components.value.length === 0" class="empty-state">No components mounted.</p>
           </div>
         </div>
-      </NCard>
+      </div>
     </div>
   </div>
 </template>
 
 <style scoped>
-.nexa-devtools {
+.ndp {
   position: fixed;
-  bottom: 1.5rem;
-  right: 1.5rem;
+  bottom: 1rem;
+  right: 1rem;
   z-index: 9999;
-  font-family: 'Inter', sans-serif;
+  font-family: system-ui, -apple-system, sans-serif;
+  font-size: 13px;
+  line-height: 1.4;
 }
-
-.devtools-trigger {
+.ndp-trigger {
   position: relative;
   z-index: 1;
-  background: #3b82f6;
+  background: #6366f1;
   color: white;
   border: none;
-  padding: 0.75rem 1.5rem;
+  padding: 0.6rem 1.2rem;
   border-radius: 9999px;
   display: flex;
   align-items: center;
-  gap: 0.5rem;
+  gap: 0.4rem;
   cursor: pointer;
-  min-width: 120px;
-  box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.5);
-  transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
+  box-shadow: 0 4px 12px rgba(99,102,241,0.4);
   font-weight: 600;
+  transition: all 0.2s;
 }
-
-.devtools-trigger:hover {
-  transform: translateY(-2px);
-  background: #2563eb;
-}
-
-.trigger-icon {
-  font-size: 1.25rem;
+.ndp-trigger:hover { background: #4f46e5; transform: translateY(-1px); }
+.ndp-trigger-icon { font-size: 1.1rem; }
+.ndp-badge {
+  background: rgba(255,255,255,0.25);
+  padding: 0.1rem 0.4rem;
+  border-radius: 999px;
+  font-size: 0.7rem;
+  font-weight: 700;
 }
-
-.devtools-panel {
+.ndp-panel {
   position: absolute;
-  bottom: 4rem;
+  bottom: 3.8rem;
   right: 0;
-  width: 350px;
-  max-height: 500px;
-  animation: slide-up 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
+  width: 380px;
+  max-height: 520px;
+  animation: slide-up 0.25s ease;
 }
-
 @keyframes slide-up {
-  from { transform: translateY(20px); opacity: 0; }
+  from { transform: translateY(12px); opacity: 0; }
   to { transform: translateY(0); opacity: 1; }
 }
-
-.panel-card {
-  height: 100%;
+.ndp-card {
+  background: #1e1b4b;
+  border: 1px solid rgba(255,255,255,0.08);
+  border-radius: 14px;
+  overflow: hidden;
   display: flex;
   flex-direction: column;
-  background: rgba(15, 23, 42, 0.8) !important;
-  backdrop-filter: blur(20px);
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  padding: 0 !important;
-  overflow: hidden;
+  height: 100%;
+  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
 }
-
-.panel-header {
-  padding: 1rem;
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+.ndp-header {
+  padding: 0.8rem 1rem;
+  border-bottom: 1px solid rgba(255,255,255,0.06);
 }
-
-.header-title {
+.ndp-title-row {
   display: flex;
+  justify-content: space-between;
   align-items: center;
-  gap: 0.5rem;
-  margin-bottom: 1rem;
-}
-
-.close-btn {
-  margin-left: auto;
-  background: none;
-  border: none;
-  color: #94a3b8;
-  font-size: 1rem;
-  cursor: pointer;
-  padding: 0.25rem;
-  line-height: 1;
-  border-radius: 4px;
-  transition: all 0.15s;
-}
-
-.close-btn:hover {
-  color: white;
-  background: rgba(255, 255, 255, 0.1);
-}
-
-.logo {
-  font-weight: 900;
-  color: white;
-  letter-spacing: -0.025em;
-}
-
-.version {
-  font-size: 0.7rem;
-  color: #64748b;
+  margin-bottom: 0.6rem;
 }
-
-.tab-nav {
+.ndp-logo { font-weight: 800; color: white; letter-spacing: -0.02em; font-size: 0.9rem; }
+.ndp-close { color: #64748b; cursor: pointer; font-size: 0.85rem; padding: 0.2rem; }
+.ndp-close:hover { color: white; }
+.ndp-tabs {
   display: flex;
-  gap: 0.25rem;
-  background: rgba(0, 0, 0, 0.2);
-  padding: 0.25rem;
+  gap: 0.2rem;
+  background: rgba(0,0,0,0.25);
+  padding: 0.2rem;
   border-radius: 8px;
+  margin-bottom: 0.5rem;
 }
-
-.tab-nav button {
+.ndp-tabs button {
   flex: 1;
   background: transparent;
   border: none;
   color: #94a3b8;
-  padding: 0.4rem;
+  padding: 0.35rem;
   border-radius: 6px;
-  font-size: 0.8rem;
+  font-size: 0.75rem;
   font-weight: 600;
   cursor: pointer;
-  transition: all 0.2s;
+  transition: all 0.15s;
 }
-
-.tab-nav button.is-active {
-  background: rgba(255, 255, 255, 0.1);
-  color: white;
+.ndp-tabs button.is-active { background: rgba(255,255,255,0.08); color: white; }
+.ndp-search input {
+  width: 100%;
+  background: rgba(0,0,0,0.3);
+  border: 1px solid rgba(255,255,255,0.06);
+  border-radius: 6px;
+  padding: 0.35rem 0.5rem;
+  color: #e2e8f0;
+  font-size: 0.75rem;
+  outline: none;
+  box-sizing: border-box;
 }
-
-.panel-content {
-  padding: 1rem;
+.ndp-search input::placeholder { color: #475569; }
+.ndp-search input:focus { border-color: #6366f1; }
+.ndp-body {
   overflow-y: auto;
-  min-height: 0;
-  max-height: 380px;
+  flex: 1;
+  padding: 0.25rem 0;
 }
-
-.tab-pane {
+.ndp-list { display: flex; flex-direction: column; }
+.ndp-item {
+  padding: 0.4rem 1rem;
   display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.4rem;
+  border-bottom: 1px solid rgba(255,255,255,0.03);
+  transition: background 0.1s;
 }
-
-.data-item {
+.ndp-item:hover { background: rgba(255,255,255,0.02); }
+.ndp-item-left {
   display: flex;
-  justify-content: space-between;
   align-items: center;
-  padding: 0.5rem;
-  background: rgba(255, 255, 255, 0.03);
-  border-radius: 8px;
+  gap: 0.4rem;
+  min-width: 0;
+  flex: 1;
+  cursor: pointer;
 }
-
-.item-label {
+.ndp-item-right {
+  display: flex;
+  align-items: center;
+  gap: 0.3rem;
+  max-width: 55%;
+}
+.ndp-item-label {
   color: #e2e8f0;
-  font-size: 0.85rem;
-  font-family: 'JetBrains Mono', monospace;
+  font-size: 0.8rem;
+  font-family: 'JetBrains Mono', 'Consolas', monospace;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
-
-.item-id {
-  color: #64748b;
+.ndp-item-depth {
+  color: #475569;
+  font-size: 0.65rem;
+  background: rgba(255,255,255,0.04);
+  padding: 0.05rem 0.3rem;
+  border-radius: 3px;
+}
+.ndp-tree-toggle {
+  color: #475569;
+  font-size: 0.6rem;
+  width: 1rem;
+  flex-shrink: 0;
+}
+.ndp-value {
+  color: #a5b4fc;
+  font-size: 0.78rem;
+  font-family: 'JetBrains Mono', 'Consolas', monospace;
+  cursor: pointer;
+  padding: 0.1rem 0.3rem;
+  border-radius: 3px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 180px;
+  transition: background 0.1s;
+}
+.ndp-value:hover { background: rgba(99,102,241,0.15); }
+.ndp-item-id { color: #475569; font-size: 0.7rem; }
+.ndp-edit-row {
+  display: flex;
+  align-items: center;
+  gap: 0.2rem;
+}
+.ndp-edit-input {
+  width: 140px;
+  background: rgba(0,0,0,0.4);
+  border: 1px solid #6366f1;
+  border-radius: 4px;
+  padding: 0.2rem 0.3rem;
+  color: #e2e8f0;
   font-size: 0.75rem;
+  font-family: 'JetBrains Mono', 'Consolas', monospace;
+  outline: none;
 }
-
-.empty-state {
-  text-align: center;
+.ndp-edit-save, .ndp-edit-cancel {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  font-size: 0.7rem;
+  padding: 0.15rem;
+  border-radius: 3px;
+  line-height: 1;
+}
+.ndp-edit-save { color: #34d399; }
+.ndp-edit-save:hover { background: rgba(52,211,153,0.15); }
+.ndp-edit-cancel { color: #f87171; }
+.ndp-edit-cancel:hover { background: rgba(248,113,113,0.15); }
+.ndp-detail {
+  width: 100%;
+  padding: 0.3rem 0 0.3rem 1.4rem;
+}
+.ndp-detail-section {
+  background: rgba(0,0,0,0.15);
+  border-radius: 6px;
+  padding: 0.4rem;
+}
+.ndp-detail-title {
+  font-size: 0.65rem;
   color: #64748b;
-  font-size: 0.85rem;
-  margin-top: 2rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 0.3rem;
+}
+.ndp-detail-row {
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+  padding: 0.15rem 0;
+}
+.ndp-detail-key {
+  color: #94a3b8;
+  font-size: 0.72rem;
+  font-family: 'JetBrains Mono', 'Consolas', monospace;
+  min-width: 80px;
+}
+.ndp-detail-val {
+  color: #a5b4fc;
+  font-size: 0.72rem;
+  font-family: 'JetBrains Mono', 'Consolas', monospace;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.ndp-detail-empty {
+  color: #475569;
+  font-size: 0.7rem;
+  font-style: italic;
+}
+.ndp-empty {
+  text-align: center;
+  color: #475569;
+  font-size: 0.78rem;
+  padding: 2rem 1rem;
 }
 </style>

package/dist/index.d.ts

@@ -7,6 +7,22 @@ export declare function inspectComponents(): Record<string, any>[];
 export declare function inspectStore(): Record<string, any>;
 export declare function clearDevTools(): void;
 export declare function registerSignal(signal: Signal<any>, label?: string): number;
+export declare function setSignalValue(id: number, value: any): void;
+export declare function setSignalByLabel(label: string, value: any): boolean;
+export declare function getSignalEntries(): {
+    id: number;
+    label: string;
+    value: any;
+    createdAt: number;
+}[];
+export declare function getComponentEntries(): {
+    id: number;
+    name: string;
+    props: Record<string, any>;
+    mountedAt: number;
+    parent: ComponentInstance | null;
+    depth: number;
+}[];
 export declare function registerComponent(name: string, instance: ComponentInstance): number;
 export declare function unregisterComponent(instance: ComponentInstance): void;
 export declare function initDevTools(): void;

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,iBAAiB,CAAA;AAC7C,OAAO,EAAE,KAAK,iBAAiB,EAAS,MAAM,cAAc,CAAA;AAwB5D,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAIxE;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,iBAAiB,GAAG,MAAM,CAI9E;AAED,wBAAgB,cAAc,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CASpD;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAWzD;AAED,wBAAgB,YAAY,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAKlD;AAED,wBAAgB,aAAa,IAAI,IAAI,CAKpC;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAI1E;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,iBAAiB,GAAG,MAAM,CAInF;AAED,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAOrE;AAED,wBAAgB,YAAY,IAAI,IAAI,CAmBnC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,iBAAiB,CAAA;AAC7C,OAAO,EAAE,KAAK,iBAAiB,EAAS,MAAM,cAAc,CAAA;AAwB5D,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAIxE;AAED,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,iBAAiB,GAAG,MAAM,CAI9E;AAED,wBAAgB,cAAc,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CASpD;AAED,wBAAgB,iBAAiB,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAWzD;AAED,wBAAgB,YAAY,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAKlD;AAED,wBAAgB,aAAa,IAAI,IAAI,CAKpC;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAI1E;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI,CAK3D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,OAAO,CAQnE;AAED,wBAAgB,gBAAgB,IAAI;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,GAAG,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,EAAE,CAWjG;AAED,wBAAgB,mBAAmB,IAAI;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,EAAE,CAapK;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,iBAAiB,GAAG,MAAM,CAInF;AAED,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAOrE;AAED,wBAAgB,YAAY,IAAI,IAAI,CAuBnC"}

package/dist/index.js

@@ -54,6 +54,47 @@ export function registerSignal(signal, label) {
     signalRegistry.set(id, { id, label: label || `_signal_${id}`, signal, createdAt: Date.now() });
     return id;
 }
+export function setSignalValue(id, value) {
+    const entry = signalRegistry.get(id);
+    if (entry) {
+        entry.signal.value = value;
+    }
+}
+export function setSignalByLabel(label, value) {
+    for (const [, entry] of signalRegistry) {
+        if (entry.label === label) {
+            entry.signal.value = value;
+            return true;
+        }
+    }
+    return false;
+}
+export function getSignalEntries() {
+    const result = [];
+    for (const [, entry] of signalRegistry) {
+        result.push({
+            id: entry.id,
+            label: entry.label,
+            value: entry.signal.peek(),
+            createdAt: entry.createdAt,
+        });
+    }
+    return result;
+}
+export function getComponentEntries() {
+    const result = [];
+    for (const [, entry] of componentRegistry) {
+        result.push({
+            id: entry.id,
+            name: entry.name,
+            props: entry.instance.props.peek(),
+            mountedAt: entry.mountedAt,
+            parent: entry.instance.parent,
+            depth: entry.instance.depth,
+        });
+    }
+    return result;
+}
 export function registerComponent(name, instance) {
     const id = nextComponentId++;
     componentRegistry.set(id, { id, name, instance, mountedAt: Date.now(), children: [] });
@@ -79,6 +120,10 @@ export function initDevTools() {
         registerSignal,
         registerComponent,
         unregisterComponent,
+        setSignalValue,
+        setSignalByLabel,
+        getSignalEntries,
+        getComponentEntries,
         clear: clearDevTools,
     };
     window.__NEXA_DEVTOOLS__ = api;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nexa-devtools",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -13,9 +13,9 @@
     }
   },
   "dependencies": {
-    "nexa-runtime": "0.7.1",
-    "nexa-framework": "0.7.1",
-    "nexa-ui-kit": "0.7.1"
+    "nexa-framework": "0.7.2",
+    "nexa-runtime": "0.7.2",
+    "nexa-ui-kit": "0.7.2"
   },
   "files": [
     "dist"
@@ -24,7 +24,7 @@
     "access": "public"
   },
   "peerDependencies": {
-    "nexa-reactivity": "0.7.1"
+    "nexa-reactivity": "0.7.2"
   },
   "scripts": {
     "build": "tsc && cpx \"src/**/*.nexa\" dist",