Auto-position tooltip

andreas-schultz · andreas-schultz · commit aa762f51137a · 2025-08-06T12:09:17.000+02:00
diff --git a/src/components/VisualTour/VisualTour.tsx b/src/components/VisualTour/VisualTour.tsx
@@ -147,7 +147,7 @@ const StepPopover = ({ highlightedElement, step, titleSuffix, actionButtons }: S
         (tooltip: HTMLDivElement | null) => {
             if (tooltip) {
                 createPopper(highlightedElement, tooltip, {
-                    placement: "right",
+                    placement: "auto",
                 });
             }
         },
diff --git a/src/components/VisualTour/stories/VisualTour.stories.tsx b/src/components/VisualTour/stories/VisualTour.stories.tsx
@@ -57,7 +57,6 @@ const stepDefinitions = Math.random() < 0.5 ? stepDefinitionsEn : stepDefinition
 
 export const Default = Template.bind({});
 const defaultArgs: VisualTourProps = {
-    containerElementQuery: "#tourContainer",
     steps: [
         {
             ...stepDefinitions.firstStep,

Original file line number	Diff line number	Diff line change
`@@ -147,7 +147,7 @@ const StepPopover = ({ highlightedElement, step, titleSuffix, actionButtons }: S`
`147`	`147`	`(tooltip: HTMLDivElement \| null) => {`
`148`	`148`	`if (tooltip) {`
`149`	`149`	`createPopper(highlightedElement, tooltip, {`
`150`		`- placement: "right",`
	`150`	`+ placement: "auto",`
`151`	`151`	`});`
`152`	`152`	`}`
`153`	`153`	`},`
Original file line number	Diff line number	Diff line change
`@@ -57,7 +57,6 @@ const stepDefinitions = Math.random() < 0.5 ? stepDefinitionsEn : stepDefinition`
`57`	`57`
`58`	`58`	`export const Default = Template.bind({});`
`59`	`59`	`const defaultArgs: VisualTourProps = {`
`60`		`- containerElementQuery: "#tourContainer",`
`61`	`60`	`steps: [`
`62`	`61`	`{`
`63`	`62`	`...stepDefinitions.firstStep,`