fix(ui): keep Button labels on one line (whiteSpace: nowrap)

In flex rows (e.g. the add-item/add-section buttons next to a 'Ze šablony…' select on OfferDetail/OrderConfirmationModal/InvoiceDetail), flexbox shrank a button below its text width and wrapped the label onto two lines, making the button tall. The kit Button now defaults to whiteSpace: nowrap (merged with any caller sx, still overridable), so labels stay single-line app-wide.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
BOHA
2026-06-07 13:08:36 +02:00
parent 4062029939
commit 9278d48a6d

View File

@@ -5,8 +5,22 @@ import type { ElementType } from "react";
* Accepts `component` + any extra props the component requires
* (e.g. `component={RouterLink} to="/foo"` or `component="a" href="…"`).
*/
export default function Button<C extends ElementType = "button">(
props: ButtonProps<C, { component?: C }>,
) {
return <MuiButton variant="contained" color="primary" {...props} />;
export default function Button<C extends ElementType = "button">({
sx,
...props
}: ButtonProps<C, { component?: C }>) {
return (
<MuiButton
variant="contained"
color="primary"
{...props}
// Keep labels on one line — flex layouts otherwise shrink a button and
// wrap its text onto two lines, making the button tall. Callers can still
// override via their own sx.
sx={[
{ whiteSpace: "nowrap" },
...(Array.isArray(sx) ? sx : sx ? [sx] : []),
]}
/>
);
}