Сделать булевые пропы по умолчанию falsy

[andres-kovalev]

Мотивация: для булевых пропов в JSX предусмотрен особый синтаксис, который выглядит настолько удобным, что нет причин им не пользоваться. Просто сравните: <Input readonly={true} > и <Input readonly />

Что делать: Не добавлять булевые пропы на поведение по умолчанию, а наоборот - для особых вариантов поведения. Если состояние, для которого существует булевый проп должно быть состоянием по умолчанию - скорее всего смысл пропа надо инвертировать. Например, я хочу добавить возможно контролировать видимость кнопки. Если я добавлю проп visible, это будет равносильно заявлению "я хочу добавить возможность сделать кнопку видимой". Но ведь кнопка итак по умолчанию видна. Правильно сформулированное требование будет выглядеть так: "я хочу добавить возможность скрывать кнопку". Из такого требования уже понятно, что нужно добавить проп hidden. Таким образом, мы инвертировали смысл пропа, чтобы компонентом было удобнее пользоваться:

<Button>Видимая кнопка</Button>
<Button hidden>Скрытая кнопка</Button> </>

вместо

<Button>Видимая кнопка</Button>
<Button visible>Тоже видимая кнопка</Button>
<Button visible={false}>Скрытая кнопка</Button>

[inomdzhon]

Копипастну вопрос/ответ из лс:

А что вы будете делать в кейсах, когда дизайнер скажет что теперь какое-то св-во должно по умолчанию не применяться? Получится ведь, например, noCloseButton = true

(c) @inomdzhon

1. Скорее всего такого быть не должно, или будет очень редко - ведь свойства по умолчанию мы стараемся выводить из здравого смысла. Плюс, если значения по умолчанию поменяется, то сломаются случаи использования без него.
2. Если все-таки произойдет такое, скорее всего оставим как есть, или в крайнем случае переделаем.

(c) @andres-kovalev

[inomdzhon]

По поиску выявил вот такие компоненты, параметры которых по умолчанию true, но есть кейсы, где значение по умолчанию выставляются в коде компонента, их пока не искал.

packages/vkui/src/components/BaseGallery/BaseGallery.tsx:
40: isDraggable: isDraggableProp = true,

packages/vkui/src/components/Button/Button.tsx:
46: stopPropagation = true, не стал бы менять

packages/vkui/src/components/CalendarHeader/CalendarHeader.tsx:
48: prevMonth = true,
49: nextMonth = true,

packages/vkui/src/components/CardScroll/CardScroll.tsx:
22: showArrows = true,
23: withSpaces = true,

packages/vkui/src/components/Chip/Chip.tsx:
46: removable = true, не стал бы менять

packages/vkui/src/components/CustomSelect/CustomSelect.tsx:
223: fixDropdownWidth = true,

packages/vkui/src/components/CustomSelectDropdown/CustomSelectDropdown.tsx:
35: sameWidth = true,
36: forcePortal = true, не стал бы менять

packages/vkui/src/components/DateInput/DateInput.tsx:
118: closeOnChange = true,

packages/vkui/src/components/DateRangeInput/DateRangeInput.tsx:
112: closeOnChange = true,

packages/vkui/src/components/FocusTrap/FocusTrap.tsx:
19: autoFocus = true, менять не нужно, т.к. знакомый API
20: restoreFocus = true | (() => boolean), менять не нужно

packages/vkui/src/components/HorizontalScroll/HorizontalScroll.tsx:
138: showArrows = true,

packages/vkui/src/components/ImageBase/ImageBase.tsx:
79: withBorder = true,

packages/vkui/src/components/ModalPageHeader/ModalPageHeader.tsx:
22: separator = true,

packages/vkui/src/components/PanelHeader/PanelHeader.tsx:
119: separator = true,
120: visor = true,

packages/vkui/src/components/Placeholder/Placeholder.tsx:
44: withPadding = true,

packages/vkui/src/components/PopoutWrapper/PopoutWrapper.tsx:
25: hasMask = true,
26: fixed = true, не стал бы менять

packages/vkui/src/components/Popover/Popover.tsx:
77: restoreFocus = true,

packages/vkui/src/components/Popper/Popper.tsx:
130: forcePortal = true, не стал бы менять

packages/vkui/src/components/RichTooltip/RichTooltip.tsx:
18: arrow = true, не стал бы менять

packages/vkui/src/components/SubnavigationBar/SubnavigationBar.tsx:
29: showArrows = true,

packages/vkui/src/components/Tabbar/Tabbar.tsx:
37: export const Tabbar = ({ children, shadow = true, mode, className, ...restProps }: TabbarProps) => {

packages/vkui/src/components/Tappable/Tappable.tsx:
189: hasHover: _hasHover = true, не стал бы менять
191: hasActive: _hasActive = true, не стал бы менять

packages/vkui/src/components/Textarea/Textarea.tsx:
33: grow = true,

packages/vkui/src/components/Tooltip/Tooltip.tsx:
172: isShown: isShownProp = true, не стал бы менять
181: arrow = true, не стал бы менять

packages/vkui/src/components/Typography/Caption/Caption.tsx:
18: normalize = true,

packages/vkui/src/components/Typography/Footnote/Footnote.tsx:
15: normalize = true,

packages/vkui/src/components/Typography/Headline/Headline.tsx:
25: normalize = true,

packages/vkui/src/components/Typography/Subhead/Subhead.tsx:
21: normalize = true,

packages/vkui/src/components/Typography/Text/Text.tsx:
21: normalize = true,

packages/vkui/src/components/Typography/Title/Title.tsx:
17: normalize = true,

[inomdzhon]

Закрыли в issue #6149