diff --git a/packages/openbridge-webcomponents/__vis__/linux/__baselines__/navigation-instruments/thruster/thruster.stories.ts/single-direction-with-propellers-auto.png b/packages/openbridge-webcomponents/__vis__/linux/__baselines__/navigation-instruments/thruster/thruster.stories.ts/single-direction-with-propellers-auto.png new file mode 100644 index 000000000..179b2a9cc Binary files /dev/null and b/packages/openbridge-webcomponents/__vis__/linux/__baselines__/navigation-instruments/thruster/thruster.stories.ts/single-direction-with-propellers-auto.png differ diff --git a/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.stories.ts b/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.stories.ts index d7b19435c..eb8d62845 100644 --- a/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.stories.ts +++ b/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.stories.ts @@ -102,6 +102,18 @@ export const SingleDirection: Story = { }, }; +export const SingleDirectionWithPropellers: Story = { + args: { + singleDirection: true, + thrust: 50, + setpoint: 30, + state: InstrumentState.active, + priority: Priority.enhanced, + topPropeller: PropellerType.single, + bottomPropeller: PropellerType.cap, + }, +}; + export const SingleDirectionSingleSidedWithAdvice: Story = { args: { singleDirection: true, diff --git a/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.ts b/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.ts index 0c43ab9fb..c642ee0ce 100644 --- a/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.ts +++ b/packages/openbridge-webcomponents/src/navigation-instruments/thruster/thruster.ts @@ -756,12 +756,17 @@ export function thruster( let viewBox = '-80 -160 160 320'; let y = -160; if (options.singleDirection) { - viewBox = '-80 -300 160 320'; - y = -320; + if (options.bottomPropeller !== PropellerType.none) { + viewBox = '-80 -300 160 356'; + y = -320; + } else { + viewBox = '-80 -300 160 320'; + y = -320; + } } const top = topPropeller(height, tc.arrowColor, options.topPropeller); const bottom = bottomPropeller( - options.singleDirectionHalfSize ? 0.5 : height, + options.singleDirectionHalfSize || options.singleDirection ? 0.5 : height, options.bottomPropeller ); return svg`