diff --git a/src/uix/eidos/components/menubar/menubar-trigger.svelte b/src/uix/eidos/components/menubar/menubar-trigger.svelte index 3325c7213..17296914a 100644 --- a/src/uix/eidos/components/menubar/menubar-trigger.svelte +++ b/src/uix/eidos/components/menubar/menubar-trigger.svelte @@ -12,6 +12,9 @@ let { children, ...rest }: MenubarTriggerProps = $props(); - + + {@render children?.()} diff --git a/src/uix/eidos/components/menubar/menubar.css b/src/uix/eidos/components/menubar/menubar.css index 90908711c..b743a18c3 100644 --- a/src/uix/eidos/components/menubar/menubar.css +++ b/src/uix/eidos/components/menubar/menubar.css @@ -29,6 +29,11 @@ --_menubar-radius: var(--radius-md); --_menubar-trigger-px: var(--space-3); --_menubar-font-size: var(--font-size-sm); + /* Concentric nesting (Arq. 6 / shape engine): the in-bar trigger consumes the + shared `[data-shape-nest]` rule instead of hand-rolling its own calc — the bar + exposes its radius + padding as the nest's outer-radius + gap. */ + --shape-outer-radius: var(--_menubar-radius); + --shape-nest-gap: var(--_menubar-padding); display: inline-flex; align-items: center; @@ -66,7 +71,8 @@ min-block-size: calc(var(--_menubar-height) - var(--_menubar-padding) * 2 - 2px); padding-inline: var(--_menubar-trigger-px); border: none; - border-radius: calc(var(--_menubar-radius) - var(--_menubar-padding)); + /* Radius from the shared `[data-shape-nest]` rule — concentric with the bar + (--shape-outer-radius − --shape-nest-gap, set on [data-menubar] above). */ background: transparent; color: var(--color-content-primary); font-family: var(--font-ui);