PROPOSAL: Secondary border outward of the widget (not consuming any extra widget space)

[nank1ro]

The current version of shadcn_ui shows a focused border around focusable widgets when focused.
That border is consuming widget space, so other widgets placed vertically (like a basic Text widget) would not be aligned correctly, see example picture:

Look at the ShadInput and ShadButton, they seems starting from a different x coordinate.
This because they need to leave space for the secondary focused border, which you can see in the image below:

The proposal is to render the secondary border outward, like it is not part of the widget. This means it won't consume any extra widget space. Look at the result when using the outward border.

This behavior is very popular on web, but it's very strange for Flutter devs, because the only way to see widgets one above another is by using Stack or something similar.

The solution has been provided by @mickrich384, so he deserves any credits.

The proposal would be a breaking change, and older UIs may not look exactly the same after this update.
This new behavior would be a 1:1 match to the original shadcn.

The new API proposal would be to add an offset property to ShadBorder, because to inflate the border outward, the padding (which is an EdgeInsets) is not usable, only a double is accepted. This means the padding property would not have any effect on the secondary border.
You can check a PR which implements the new behavior, and the new API change here #367

One downside of the new proposal is that, if you don't add any space (SizedBox, Padding) the border would cover other widgets, like in the image below.

This change would affect all the components that are focusable, which are:

Alert, Button, Calendar, Checkbox, Input, Popover, Radio, Resizable, Select, Switch, Tabs and Tooltip.

Feel free to propose a different API design, it's all questionable.

[nank1ro]

closing with 12 votes in favor of the proposal and 0 against