# resolveLength

```ts
import { resolveLength } from "@pibbl/core";
```

`resolveLength(value, reference, property, context?)` resolves a public [`Length`](/reference/types/layout/#length) and returns a finite logical
number or `undefined` for `"auto"`. Numeric values must be finite; percentages
need a definite nonnegative reference. Invalid input produces a contextual
`LayoutDiagnostic`.

```ts
const width = resolveLength("50%", 320, "width"); // 160
```

See [Style and draw](/guides/style-and-draw/) for local style usage.

## API details from source

<span id="api-resolveLength"></span>

Resolves a numeric or percentage length; automatic sizing returns undefined.

```ts
resolveLength: (value: Length, reference: number | undefined, property: string, context?: Readonly<LayoutDiagnosticContext>) => number | undefined
```

Related API: [resolveLength](/reference/functions/resolve-length/), [Length](/reference/types/layout/#length), [LayoutDiagnosticContext](/reference/types/layout/#layoutdiagnosticcontext).

### Parameters

- **`value`** — Logical length or percentage to resolve. See [Length](/reference/types/layout/#length).

- **`reference`** — Reference length for percentages, or undefined if unavailable.

- **`property`** — Property name used in diagnostics.

- **`context`** — Component and property context for diagnostic messages. See
[LayoutDiagnosticContext](/reference/types/layout/#layoutdiagnosticcontext) .

### Returns

The resolved logical length, or undefined for an unresolved automatic length.

### See also

[Length](/reference/types/layout/#length)

[LayoutDiagnosticContext](/reference/types/layout/#layoutdiagnosticcontext)

[View source — packages/core/src/lib/style/resolve-length.ts:22](/source/packages/core/src/lib/style/resolve-length-ts/#L22)

## Implementation guidance for agents

Read the [Authoring, signals, and lifecycle companion](/agents/topics/lifecycle/) for ownership, adaptation, failure modes, and verification. [Agent start](/agents/) provides the version-selection workflow.

## Complete minimal examples

- [Box resolution](/minimal-examples/layout/box-helpers/): Resolve padding, percentages, and a constrained box with typed diagnostics. [Plain source](/minimal/layout/box-helpers.ts)
## Documentation version

Documentation built with @pibbl/core 0.0.2, revision 272a94a. ALPHA — NOT FOR PRODUCTION USE.