Release Notes
Every published release of @tansuk/rott-ui, newest first.
Versions follow semantic versioning. While the library is
in 0.x, a minor bump may carry breaking changes; a patch bump never
does. Breaking changes are always listed first, with the migration step next to
them.
0.9.0
Button prop contract. Two props that the public surface declared but the renderer ignored, and one size token that was not the size it claimed to be. Both defects were silent: the code type-checked, rendered, and warned about nothing while producing the wrong style.
Breaking changes
size="full" is now relative to its container, not a fixed width.
It previously resolved to a fixed 342px, scaled from a 390pt reference device,
with no parent width anywhere in the path — so it tracked the screen rather than
the container and overflowed any parent narrower than the reference content box.
It now resolves to 100% of the parent.
On a full-width page the two are the same pixels, so page-level buttons are unchanged. Only nested cases move — which were the broken ones.
// Was: a fixed 342, spilling out of the card's padding.
// Now: fills the card's content box.
<Item paddingHorizontal={24}>
<Button size="full">Continue</Button>
</Item>
If a call site deliberately relied on full being a fixed width, pass it
explicitly:
<Button size="full" width={342}>Continue</Button>
xl and xxl are distinct sizes.
They previously shared a branch with full and the default, making all four
indistinguishable. They now resolve their widths from sizeToPercentage, the
same table every other component uses, and carry their own heights.
| Size | Width | Height |
|---|---|---|
xs | 85.5 | 36 |
sm | 114 | 40 |
md | 171 | 48 |
lg | 228 | 56 |
xl | 85% of parent | 64 |
xxl | 92.5% of parent | 72 |
full | 100% of parent | 56 |
xs through lg remain fixed widths, expressed against a 390pt reference
device and scaled to the actual screen width.
Percentage widths need a parent with a resolved width. Inside a parent that
sizes to its content — a column with alignItems: center and no width, for
instance — a percentage resolves against that shrunken box. The old fixed width
was indifferent to this; the new one is not.
A button with no size prop is now full width.
The default is {height: 'lg'}, which previously fell through to the same fixed
342px. It now resolves to 100% of the parent, with an unchanged height of
56.
Fixed
-
borderWidthandborderColorare honored on every variant. (#8) Both props were declared on the public surface but never read — the border was derived solely from the variant name, so a caller passing them got no warning and no effect. Explicit props now win, with the*-outlineborder kept as the fallback when neither is passed.This matters for controls whose fill is fixed by a brand guideline. The border is then the only thing separating the control from the page, and WCAG 2.1 SC 1.4.11 asks for at least 3:1 contrast on that boundary. A white button on a near-white page previously shipped with no border at all.
<Button backgroundColor="#FFFFFF" color="#1F1F1F" borderWidth={1} borderColor="#747775">
Sign in with Google
</Button> -
Non-outline variants no longer carry a hardcoded white border colour. (#8)
borderColordefaulted to'white'on every non-outline variant. It was invisible only becauseborderWidthhappened to be undefined, and it silently overwrote any colour a caller supplied. The default is now unset.If you were relying on that white edge by passing only
borderWidth, passborderColor="white"explicitly — an unset colour renders in React Native's default black. -
size="full"no longer overflows padded parents. (#9) See the breaking-change note above.
Documentation
- The Button page documents the border props, the full size table, and which widths are fixed versus parent-relative.
- Corrected: the props table gave the
sizedefault as'md'; it is{height: 'lg'}.xxlwas missing from the documented sizes entirely. - This release notes page.
Still open
Both issues expose wider gaps that are not closed by this release:
commonUiStylePropertiesmaps only the fiveborder*Radiusprops. The remaining 14 border props declared onCommonUiProps— widths and colours — still have no path to a style on components other than Button.- The fixed
342reference-device width remains hardcoded inNotification,ActionMenu,ActionMenuHeader, andToggleInput.
Earlier releases
Releases up to and including 0.8.0 predate this page, and only v0.6.0,
v0.5.2 and v0.4.1 carry git tags — 0.7.0 and 0.8.0 were published to npm
without one, so there is no commit range to link for them. Every published
version is listed on
npm.
Summarised from the commits that carried each version bump:
0.8.0—leftIcon/rightIconslots across all input types (amountInput,ibanInput,dateInput,selectInput,checkBoxInput,toggleInput); optional-callback guards soDateInput,SelectInputandToggleInputno longer throw when their handler is omitted.0.7.0—rott.configandIconruntime-resolution fixes;RottProvidermerges config intothemeConfigdeterministically per render.0.6.0and earlier — see the tags.
Tagging resumes with this release.