sdk/vue3js-app
1
0
Fork 0
forked from flow/vue3js-app-proposal-for-sdk-claude
Code Pull Requests Activity

Switch to FO pane on any label click in CP or SubObjects panes

Browse Source
This commit is contained in:
c0dev0id 2026-06-23 21:36:46 +02:00
parent 4c392927cf
commit c52b0bf9cf
3 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
static/components/AppShell.js
View File

@ -31,11 +31,11 @@ export const AppShell = {
// Pane area
h('div', { class: 'se-pane-area' }, [
h('div', { class: ['se-pane', activePane.value === 'cp' ? 'active' : null] },
h(PaneCP, { store, onImportClick: openImport })),
h(PaneCP, { store, onImportClick: openImport, onFocusFO: () => { activePane.value = 'fo'; } })),
h('div', { class: ['se-pane', activePane.value === 'fo' ? 'active' : null] },
h(PaneFO, { store })),
h('div', { class: ['se-pane', activePane.value === 'sub' ? 'active' : null] },
h(PaneSubObjects, { store })),
h(PaneSubObjects, { store, onFocusFO: () => { activePane.value = 'fo'; } })),
]),
// Handle bar (tab switcher at bottom)

3
static/components/PaneCP.js
View File

@ -32,7 +32,7 @@ function shortView(node) {
}
export const PaneCP = {
props: ['store', 'onImportClick'],
props: ['store', 'onImportClick', 'onFocusFO'],
setup(props) {
const exporting = ref(false);
const exportError = ref('');
@ -92,6 +92,7 @@ export const PaneCP = {
onClick: () => {
if (idx === -1) store.setFocus([]);
else store.setFocus(fp.slice(0, idx + 1));
props.onFocusFO?.();
},
}, [
h('span', { class: 'se-object-type' }, typeTag),

6
static/components/PaneSubObjects.js
View File

@ -3,7 +3,7 @@ import { ObjectShort } from './ObjectShort.js';
// Shows sub-objects of the currently focused node — variations, bars, voices, etc.
export const PaneSubObjects = {
props: ['store'],
props: ['store', 'onFocusFO'],
setup(props) {
function focused() {
const fp = props.store.focusPath;
@ -71,8 +71,8 @@ export const PaneSubObjects = {
typeTag: item.kind,
focused: props.store.focusPath.includes(item.node),
hasChildren: item.hasChildren ?? (item.kind !== 'bar' && item.kind !== 'voice'),
onFocus: () => props.store.pushFocus(item.node),
onDrillDown: () => props.store.pushFocus(item.node),
onFocus: () => { props.store.pushFocus(item.node); props.onFocusFO?.(); },
onDrillDown: () => { props.store.pushFocus(item.node); props.onFocusFO?.(); },
})
)),
]);