## Problem
Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.
## Solution
- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code
## How to test
As this is just prop renaming, if it builds it's ok
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## What kind of change does this PR introduce?
Bug fix. Resolves FE-2959.
## What is the current behaviour?
Grouped inputs strip the inner control border with `border-0`, while the
outer `InputGroup` is responsible for the visible outline. After #44703,
grouped form inputs now receive the correct validation attributes, but
the primitive still removes the inner border dimensions entirely. That
keeps the visual layer brittle and can lead to inconsistent error
rendering, especially in light mode where the grouped password field
does not match the Project name input.
The shared `ui-patterns` input wrapper also inherits the generic
`inline-end` button spacing from `InputGroupAddon`, which pushes the
password copy button slightly too far to the right.
## What is the new behaviour?
The shared grouped-input primitive now keeps a transparent inner border
instead of removing border widths entirely. The outer `InputGroup`
continues to own the visible border, focus ring and error treatment, but
the inner control now has stable border metrics and no redundant
dark-mode background override.
The grouped invalid state now also matches the plain input treatment
more closely:
- unfocused error border uses `destructive-400`
- focused error border uses `destructive`
- error background uses `destructive-200`
The `ui-patterns` input wrapper now overrides the inherited `inline-end`
negative margin for its own copy/reveal button addon, so the password
copy button sits in the right place without changing spacing for other
direct `InputGroup` consumers.
| Before | After |
| --- | --- |
| <img width="1338" height="284" alt="CleanShot 2026-04-09 at 13 43
50@2x-91489355-5EEA-4884-BAA2-B93B28F1D7CB"
src="https://github.com/user-attachments/assets/ed40683b-8a87-4deb-8a0f-f892d00894f0"
/>| <img width="1334" height="278" alt="CleanShot 2026-04-09 at 13 41
36@2x-5D7E930B-EDB2-4002-9367-34ACE2DF4DB4"
src="https://github.com/user-attachments/assets/7d9594a4-9988-480e-a809-9f5ed29e8e24"
/> |
| <img width="1336" height="210" alt="CleanShot 2026-04-09 at 14 06
15@2x-05379F74-4CA5-4E6E-9250-CBA2764C1318"
src="https://github.com/user-attachments/assets/25e48cd4-de0a-47f3-9022-d7a3829a0626"
/> | <img width="1334" height="210" alt="CleanShot 2026-04-09 at 14 12
11@2x-11FBC519-D398-4A59-971A-97FBFEF610DE"
src="https://github.com/user-attachments/assets/91c3710c-7773-4286-854d-7b7144db85ab"
/> |
An easy place to test this is the Database password field in the New
Project creation flow. See also the Minimum password length field in
Email (Sign In / Providers).
## Summary
- update `packages/ui/src/components/shadcn/ui/input-group.tsx`
- replace `border-0` on grouped inputs/textareas with transparent
borders
- remove the redundant `dark:bg-transparent`
- keep the inner grouped controls visually neutral so the outer group
owns the rendered border state
- align grouped invalid border and background styling with the plain
input treatment
- update `packages/ui-patterns/src/DataInputs/Input.tsx` so copy/reveal
buttons do not inherit the extra right pull intended for other
`inline-end` addons
## Problem
#44282 introduced a change in design for inputs used outside a form
layout such as search inputs on the project list page
## Solution
Fix padding and spacing
Sorted all imports in all packages, `cms`, `design-system` and
`ui-library` apps by running `pnpm format` on them.
All changes in this PR are done by the script.
* user newer input in api keys
* user newer input in s3 connection settings
* improve input read-only styles
* make API text selectable
* disable text until reveal button tapped
* fix build
* revert change
* fix other cases
* revert hardcoded example
* nice region field
* documentation
* cleanup
* better docs
* colour tweaks
* Consolidate copy to clipboard
* Fix
* Fix some extra clipboard events.
* Fix the tests. Fix a small issue with the copy button.
* Fix
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
strictNullChecks was off for docs, which lets errors slip through and
leads to incorrect required/optional typing on Zod-inferred types. This
PR enables strictNullChecks and fixes all the existing violations.
* Move all components in ui-patterns into src folder. Add exports field for all files.
* Fix all apps to use the new ui-patterns.
* Fix the design-system build.
* Remove all unused rexports from ui-patterns index. Apps should use direct imports instead.
* Change the tailwind content property to include src folder of ui-patterns.
* Remove autoprefixer from the tailwind configs.
* Remove autoprefixer as a dependency.
* Fix the CVA conditions in FormLayout.
