Restore being able to select the screen and nav, now with unique IDs

This commit is contained in:
Andrew Kingston 2023-08-23 15:00:26 +01:00
parent a352f8ee0a
commit 899a1dd754
1 changed files with 14 additions and 6 deletions

View File

@ -72,6 +72,12 @@
$context.device.height $context.device.height
) )
$: autoCloseSidePanel = !$builderStore.inBuilder && $sidePanelStore.open $: autoCloseSidePanel = !$builderStore.inBuilder && $sidePanelStore.open
$: screenId = $builderStore.inBuilder
? `${$builderStore.screen?._id}-screen`
: "screen"
$: navigationId = $builderStore.inBuilder
? `${$builderStore.screen?._id}-navigation`
: "navigation"
// Scroll navigation into view if selected. // Scroll navigation into view if selected.
// Memoize into a primitive to avoid spamming this whenever builder store // Memoize into a primitive to avoid spamming this whenever builder store
@ -145,27 +151,29 @@
} }
return style return style
} }
$: console.log($builderStore.selectedComponentId)
</script> </script>
<div <div
class="component screen layout layout--{typeClass}" class="component {screenId} layout layout--{typeClass}"
use:styleable={$component.styles} use:styleable={$component.styles}
class:desktop={!mobile} class:desktop={!mobile}
class:mobile={!!mobile} class:mobile={!!mobile}
data-id={`${$builderStore.screen?._id}-screen`} data-id={screenId}
data-name="Screen" data-name="Screen"
data-icon="WebPage" data-icon="WebPage"
> >
<div class="screen-dom screen-wrapper layout-body"> <div class="{screenId}-dom screen-wrapper layout-body">
{#if typeClass !== "none"} {#if typeClass !== "none"}
<div <div
class="interactive component navigation" class="interactive component {navigationId}"
data-id="navigation" data-id={navigationId}
data-name="Navigation" data-name="Navigation"
data-icon="Visibility" data-icon="Visibility"
> >
<div <div
class="nav-wrapper navigation-dom" class="nav-wrapper {navigationId}-dom"
class:sticky class:sticky
class:hidden={$routeStore.queryParams?.peek} class:hidden={$routeStore.queryParams?.peek}
class:clickable={$builderStore.inBuilder} class:clickable={$builderStore.inBuilder}