diff --git a/platform/wab/src/wab/client/components/sidebar-tabs/Sections.tsx b/platform/wab/src/wab/client/components/sidebar-tabs/Sections.tsx index 142b5a84869..466a4930d2b 100644 --- a/platform/wab/src/wab/client/components/sidebar-tabs/Sections.tsx +++ b/platform/wab/src/wab/client/components/sidebar-tabs/Sections.tsx @@ -100,6 +100,7 @@ import { import { ValComponent } from "@/wab/shared/core/val-nodes"; import { DEVFLAGS, DevFlagsType } from "@/wab/shared/devflags"; import { isGridTag } from "@/wab/shared/grid-utils"; +import { isPositionSet } from "@/wab/shared/layoututils"; import { TplComponent, TplNode, @@ -569,7 +570,7 @@ export function getRenderBySection( Section.PositioningPanel, () => (isTag || isComponent) && - !isRoot && + (!isRoot || isPositionSet(tpl, viewCtx)) && !isColumn && !isTplTextBlock(tpl.parent) && showSection(Section.PositioningPanel) && ( diff --git a/platform/wab/src/wab/client/components/style-controls/StyleComponent.tsx b/platform/wab/src/wab/client/components/style-controls/StyleComponent.tsx index 460189852e2..b28f0a1b828 100644 --- a/platform/wab/src/wab/client/components/style-controls/StyleComponent.tsx +++ b/platform/wab/src/wab/client/components/style-controls/StyleComponent.tsx @@ -62,8 +62,8 @@ import { import { computeDefinedIndicator, DefinedIndicatorType, - isIndicatorExplicitlySet, getPropAndValueFromIndicator, + isIndicatorExplicitlySet, } from "@/wab/shared/defined-indicator"; import { makeExpProxy, makeMergedExpProxy } from "@/wab/shared/exprs"; import { @@ -78,6 +78,7 @@ import { ContainerType, convertSelfContainerType, getRshContainerType, + isPositionSet, PositionLayoutType, } from "@/wab/shared/layoututils"; import { @@ -1304,7 +1305,7 @@ export class TplExpsProvider implements ExpsProvider { showPositioningPanel = () => { // Don't show positioning panel for the root node - return !!this.tpl.parent; + return !!this.tpl.parent || isPositionSet(this.tpl, this.viewCtx); }; getTargetDeepLayoutParentRsh = () => { diff --git a/platform/wab/src/wab/shared/layoututils.ts b/platform/wab/src/wab/shared/layoututils.ts index 828a16772c8..47a78427c5d 100644 --- a/platform/wab/src/wab/shared/layoututils.ts +++ b/platform/wab/src/wab/shared/layoututils.ts @@ -1,17 +1,7 @@ -import { unexpected } from "@/wab/shared/common"; +import type { ViewCtx } from "@/wab/client/studio-ctx/view-ctx"; import { isMixinPropRef, isTokenRef } from "@/wab/commons/StyleToken"; import { DeepReadonly } from "@/wab/commons/types"; -import { parseCssNumericNew } from "@/wab/shared/css"; -import { createGridSpec, showGridCss } from "@/wab/shared/Grids"; -import { HORIZ_CONTAINER_CAP, VERT_CONTAINER_CAP } from "@/wab/shared/Labels"; -import { - IRuleSetHelpers, - IRuleSetHelpersX, - RSH, - ReadonlyIRuleSetHelpers, - ReadonlyIRuleSetHelpersX, -} from "@/wab/shared/RuleSetHelpers"; -import { ensureBaseVariantSetting } from "@/wab/shared/Variants"; +import { unexpected } from "@/wab/shared/common"; import { CONTENT_LAYOUT, FAKE_FLEX_CONTAINER_PROPS, @@ -19,14 +9,29 @@ import { contentLayoutProps, gridCssProps, } from "@/wab/shared/core/style-props"; +import { + getTplTagRoot, + isTplComponent, + isTplVariantable, +} from "@/wab/shared/core/tpls"; +import { parseCssNumericNew } from "@/wab/shared/css"; import { CONTENT_LAYOUT_INITIALS } from "@/wab/shared/default-styles"; +import { createGridSpec, showGridCss } from "@/wab/shared/Grids"; +import { HORIZ_CONTAINER_CAP, VERT_CONTAINER_CAP } from "@/wab/shared/Labels"; import { RuleSet, TplNode, TplTag, VariantSetting, } from "@/wab/shared/model/classes"; -import { getTplTagRoot, isTplComponent, isTplVariantable } from "@/wab/shared/core/tpls"; +import { + IRuleSetHelpers, + IRuleSetHelpersX, + RSH, + ReadonlyIRuleSetHelpers, + ReadonlyIRuleSetHelpersX, +} from "@/wab/shared/RuleSetHelpers"; +import { ensureBaseVariantSetting } from "@/wab/shared/Variants"; export type ContainerType = | "free" @@ -345,3 +350,14 @@ export function isContentLayoutTpl(tpl: TplNode, opts?: { deep?: boolean }) { } return false; } + +export function isPositionSet(tpl: TplNode, viewCtx: ViewCtx) { + // Check if the position is available and set to something other than "auto". + const vtm = viewCtx.variantTplMgr(); + const targetVariantCombo = vtm.getTargetVariantComboForNode(tpl); + const effectiveExp = vtm + .effectiveVariantSetting(tpl, targetVariantCombo) + .rsh(); + const curPosType = getRshPositionType(effectiveExp); + return curPosType && curPosType !== PositionLayoutType.auto; +}