BBj 26.02 DWC Control Sizing

What Changed?

BBj 26.02 makes DWC controls honor the height they are given. Before 26.02, some controls rendered taller than the height set by the application. The rule for a control’s height is now:

1. A height set on the control, by setSize() or a height style, is honored exactly. Label and input share it.

2. Without a set height, the input is sized by its expanse attribute and the control by its content.

3. A container that stretches its children, a CSS grid or a flex row, stretches the control’s box but not its content. Label, input, and helper text keep their size inside the cell, as in 26.00. Set the container’s alignment to start if the box itself should not stretch.

The Two Sizing Models

DWC supports two ways to lay out a BBj window.

Pixel layout. Controls are created with x, y, width, and height. Every control honors the size it is given, as in GUI and BUI. Use this for existing forms and for layouts that must match a design to the pixel.

Content layout. The window is created with the automatic layout flag ($00100000$), and controls are created without a size. Each control sizes to its content and its expanse (xs, s, m, l, xl), and the browser lays them out. Use this for responsive forms.

A control uses one or the other. It either gets an explicit size or an expanse.

Field Height and Expanse

setFieldHeight() on a BBjListEdit or BBjListButton sets the height of the input or button in pixels, matching the GUI/BUI default of 23px. The expanse attribute sizes it from the design tokens. Use one or the other. To size the control by expanse, clear the field height:

listEdit!.setAttribute("field-height", "")

listEdit!.setAttribute("expanse", "m")

listButton!.setAttribute("button-height", "")

listButton!.setAttribute("expanse", "m")

The --dwc-combobox-field-height and --dwc-choicebox-button-height CSS custom properties should override both.

Additional Resources

BBj 26 DWC Design System Changes and the upgrade guide:

https://dwc.style/docs/#/theme-engine/upgrading-to-v26