feat(FormItem): Add noPaddings prop to allow to disable paddings (#5600)

VKCOM · Aug 11, 2023 · fdf9a83 · fdf9a83
1 parent 38ae149
commit fdf9a83
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/packages/vkui/src/components/FormItem/FormItem.module.css b/packages/vkui/src/components/FormItem/FormItem.module.css
@@ -1,5 +1,8 @@
 .FormItem {
   display: block;
+}
+
+.FormItem--withPadding {
   padding: var(--vkui--size_form_item_padding_vertical--regular)
     var(--vkui--size_base_padding_horizontal--regular);
 }

diff --git a/packages/vkui/src/components/FormItem/FormItem.tsx b/packages/vkui/src/components/FormItem/FormItem.tsx
@@ -37,6 +37,11 @@ export interface FormItemProps
    * Режим `indent` предназначен для визуального отступа
    */
   removable?: boolean | 'indent';
+  /**
+   * Удаляет внешние отступы вокруг компонента
+   * @since 5.8.0
+   */
+  noPadding?: boolean;
 }
 
 /**
@@ -55,6 +60,7 @@ export const FormItem = ({
   className,
   htmlFor,
   bottomId,
+  noPadding,
   ...restProps
 }: FormItemProps) => {
   const rootEl = useExternRef(getRootRef);
@@ -90,6 +96,7 @@ export const FormItem = ({
       ref={rootEl}
       className={classNames(
         styles['FormItem'],
+        !noPadding && styles['FormItem--withPadding'],
         'vkuiInternalFormItem',
         status !== 'default' &&
           {