fix: import lodash methods directly

src/blocks/HeaderSlider/schema.ts

@@ -1,4 +1,4 @@
-import _ from 'lodash';
+import omit from 'lodash/omit';
 
 import {HeaderProperties, SliderProps} from '../../schema/validators/blocks';
 import {BlockBaseProps} from '../../schema/validators/common';
@@ -9,7 +9,7 @@ export const HeaderSliderBlock = {
         required: ['items'],
         properties: {
             ...BlockBaseProps,
-            ..._.omit(SliderProps, ['loadable', 'children']),
+            ...omit(SliderProps, ['loadable', 'children']),
             items: {
                 type: 'array',
                 items: {

src/blocks/Info/schema.ts

@@ -1,4 +1,4 @@
-import _ from 'lodash';
+import omit from 'lodash/omit';
 
 import {
     BaseProps,
@@ -12,7 +12,7 @@ import {ContentBase} from '../../sub-blocks/Content/schema';
 
 const ContentProps = {
     additionalProperties: false,
-    properties: _.omit(ContentBase, ['size', 'colSizes', 'theme']),
+    properties: omit(ContentBase, ['size', 'colSizes', 'theme']),
 };
 
 export const InfoBlock = {

src/blocks/Media/schema.ts

@@ -1,4 +1,4 @@
-import {omit} from 'lodash';
+import omit from 'lodash/omit';
 
 import {
     AnimatableProps,

src/blocks/Questions/schema.ts

@@ -1,10 +1,10 @@
-import _ from 'lodash';
+import omit from 'lodash/omit';
 
 import {BlockBaseProps, LinkProps} from '../../schema/validators/common';
 import {filteredArray} from '../../schema/validators/utils';
 import {ContentBase} from '../../sub-blocks/Content/schema';
 
-const QuestionsBlockContentProps = _.omit(ContentBase, ['size', 'theme']);
+const QuestionsBlockContentProps = omit(ContentBase, ['size', 'theme']);
 
 export const QuestionsBlock = {
     'questions-block': {

src/blocks/Slider/Slider.tsx

@@ -8,7 +8,9 @@ import React, {
     useState,
 } from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
+import get from 'lodash/get';
+import noop from 'lodash/noop';
 import SlickSlider, {Settings} from 'react-slick';
 
 import Anchor from '../../components/Anchor/Anchor';
@@ -113,12 +115,12 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const onResize = useCallback(
-        _.debounce(() => {
+        debounce(() => {
             if (!slider) {
                 return;
             }
 
-            const newBreakpoint = _.get(slider, 'state.breakpoint') || BREAKPOINTS.xl;
+            const newBreakpoint = get(slider, 'state.breakpoint') || BREAKPOINTS.xl;
 
             if (newBreakpoint !== breakpoint) {
                 setBreakpoint(newBreakpoint);
@@ -343,7 +345,7 @@ export const SliderBlock = (props: WithChildren<SliderProps>) => {
         };
 
         return (
-            <OutsideClick onOutsideClick={isMobile ? unsetFocus : _.noop}>
+            <OutsideClick onOutsideClick={isMobile ? unsetFocus : noop}>
                 <SlickSlider {...settings}>{disclosedChildren}</SlickSlider>
                 <div className={b('footer')}>
                     {renderDisclaimer()}

src/blocks/Slider/utils.ts

@@ -1,4 +1,4 @@
-import _ from 'lodash';
+import pickBy from 'lodash/pickBy';
 
 import {BREAKPOINTS} from '../../constants';
 
@@ -38,7 +38,7 @@ export function getSlidesToShowWithDefaults({
 
     return {
         ...DEFAULT_SLIDE_BREAKPOINTS,
-        ..._.pickBy(result, (value) => !isNaN(value)),
+        ...pickBy(result, (value) => !isNaN(value)),
         sm: !mobileFullscreen && contentLength > 1 ? DEFAULT_SLIDE_BREAKPOINTS.sm : 1,
     };
 }

src/blocks/Tabs/schema.ts

@@ -1,4 +1,4 @@
-import _ from 'lodash';
+import omit from 'lodash/omit';
 
 import {ImageProps} from '../../components/Image/schema';
 import {
@@ -15,7 +15,7 @@ import {
 import {filteredArray} from '../../schema/validators/utils';
 import {ContentBase} from '../../sub-blocks/Content/schema';
 
-const TabsItemContentProps = _.omit(ContentBase, ['size', 'colSizes', 'centered', 'theme']);
+const TabsItemContentProps = omit(ContentBase, ['size', 'colSizes', 'centered', 'theme']);
 
 export const tabsItem = {
     type: 'object',

src/components/BalancedMasonry/BalancedMasonry.tsx

@@ -1,6 +1,8 @@
 import React, {ReactNode, useCallback, useContext, useEffect, useRef, useState} from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
+import first from 'lodash/first';
+import minBy from 'lodash/minBy';
 
 import {SSRContext} from '../../context/ssrContext';
 import {QAProps, WithChildren} from '../../models';
@@ -31,7 +33,7 @@ const BalancedMasonry = (props: WithChildren<BalancedMasonryProps>) => {
         );
 
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        let [, result] = _.first(breakpoints)!;
+        let [, result] = first(breakpoints)!;
 
         if (isServer) {
             return result;
@@ -54,7 +56,7 @@ const BalancedMasonry = (props: WithChildren<BalancedMasonryProps>) => {
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const balanceColumns = useCallback(
-        _.debounce(() => {
+        debounce(() => {
             if (!containerRef.current) {
                 return;
             }
@@ -74,7 +76,7 @@ const BalancedMasonry = (props: WithChildren<BalancedMasonryProps>) => {
                     continue;
                 }
 
-                const minColumn = _.minBy(columnsMeta, 'height') || {id: 0, height: 0};
+                const minColumn = minBy(columnsMeta, 'height') || {id: 0, height: 0};
                 const {id: columnId} = minColumn;
 
                 localColumns[columnId].push(children[i]);

src/components/BalancedMasonry/__tests__/BalancedMasonry.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import {render, screen, waitFor} from '@testing-library/react';
-import {omit} from 'lodash';
+import omit from 'lodash/omit';
 
 import {testCustomClassName} from '../../../../test-utils/shared/common';
 import {CardBase} from '../../../components';

src/components/FullWidthBackground/FullWidthBackground.tsx

@@ -1,6 +1,6 @@
 import React, {CSSProperties, Component, PropsWithChildren, createRef} from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 
 import {BREAKPOINTS} from '../../constants';
 import {ClassNameProps} from '../../models';
@@ -24,7 +24,7 @@ export default class FullWidthBackground extends Component<
 > {
     private ref = createRef<HTMLDivElement>();
 
-    private setBg = _.debounce(() => {
+    private setBg = debounce(() => {
         if (this.ref && this.ref.current) {
             const bg = this.ref.current;
             const width = document.documentElement.clientWidth || document.body.clientWidth;

src/components/Map/GoogleMap.tsx

@@ -1,6 +1,6 @@
 import React, {useContext, useEffect, useMemo, useRef, useState} from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 
 import {LocaleContext} from '../../context/localeContext/localeContext';
 import {MapsContext} from '../../context/mapsContext/mapsContext';
@@ -43,7 +43,7 @@ const GoogleMap: React.FC<GMapProps> = (props) => {
     );
 
     useEffect(() => {
-        const updateSize = _.debounce(() => {
+        const updateSize = debounce(() => {
             if (ref.current) {
                 setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));
             }

src/components/Map/YMap/YandexMap.tsx

@@ -1,7 +1,7 @@
 import React, {useCallback, useContext, useEffect, useRef, useState} from 'react';
 
 import {Spin} from '@gravity-ui/uikit';
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 
 import {LocaleContext} from '../../../context/localeContext/localeContext';
 import {MapsContext} from '../../../context/mapsContext/mapsContext';
@@ -69,7 +69,7 @@ const YandexMap: React.FC<YMapProps> = (props) => {
     }, [apiKey, lang, scriptSrc, containerId, zoom, nonce, attemptsIndex, setLoading]);
 
     useEffect(() => {
-        const updateSize = _.debounce(() => {
+        const updateSize = debounce(() => {
             if (ref.current) {
                 setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));
             }

src/components/Media/Image/Image.tsx

@@ -1,6 +1,6 @@
 import React, {useEffect, useState} from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 import {Interpolation, animated, config, useSpring} from 'react-spring';
 
 import SliderBlock from '../../../blocks/Slider/Slider';
@@ -62,7 +62,7 @@ const Image = (props: ImageAllProps) => {
     useEffect(() => {
         if (parallax) {
             const handleScroll = () => setScrollY(window.scrollY);
-            const debouncedHandler = _.debounce(handleScroll, 5);
+            const debouncedHandler = debounce(handleScroll, 5);
 
             window.addEventListener('scroll', debouncedHandler, {passive: true});
             return () => window.removeEventListener('scroll', debouncedHandler);

src/components/OverflowScroller/OverflowScroller.tsx

@@ -1,6 +1,6 @@
 import React, {PropsWithChildren, createRef} from 'react';
 
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 
 import {ToggleArrow} from '..';
 import {block} from '../../utils';
@@ -91,7 +91,7 @@ export default class OverflowScroller extends React.Component<
     }
 
     // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp
-    private checkOverflow = _.debounce(() => {
+    private checkOverflow = debounce(() => {
         if (
             this.containerRef &&
             this.containerRef.current &&

src/components/ReactPlayer/ReactPlayer.tsx

@@ -10,7 +10,7 @@ import React, {
 } from 'react';
 
 import {Icon} from '@gravity-ui/uikit';
-import _ from 'lodash';
+import debounce from 'lodash/debounce';
 import ReactPlayer from 'react-player';
 
 import {MetrikaContext} from '../../context/metrikaContext';
@@ -161,7 +161,7 @@ export const ReactPlayerBlock = React.forwardRef<ReactPlayerBlockHandler, ReactP
         }, [elapsedTime, playerRef, started]);
 
         useEffect(() => {
-            const updateSize = _.debounce(() => {
+            const updateSize = debounce(() => {
                 if (ref.current) {
                     // We need to get parent's width does not equal 0
                     const parentElement = getParentElement(ref.current);

src/containers/PageConstructor/components/ConstructorBlock/ConstructorBlock.tsx

@@ -1,6 +1,6 @@
 import React, {useMemo} from 'react';
 
-import _ from 'lodash';
+import pick from 'lodash/pick';
 
 import BlockBase from '../../../../components/BlockBase/BlockBase';
 import {BlockDecoration} from '../../../../customization/BlockDecoration';
@@ -26,7 +26,7 @@ export const ConstructorBlock: React.FC<WithChildren<ConstructorBlockProps>> = (
 }) => {
     const {type, indent} = data;
     const blockBaseProps = useMemo(
-        () => _.pick(data, ['anchor', 'visible', 'resetPaddings']),
+        () => pick(data, ['anchor', 'visible', 'resetPaddings']),
         [data],
     );
 

src/containers/PageConstructor/components/ConstructorBlocks/ConstructorBlocks.tsx

@@ -1,6 +1,6 @@
 import React, {Fragment, ReactElement, useContext} from 'react';
 
-import _ from 'lodash';
+import get from 'lodash/get';
 
 import {InnerContext} from '../../../../context/innerContext';
 import {BlockDecoration} from '../../../../customization/BlockDecoration';
@@ -44,7 +44,7 @@ export const ConstructorBlocks: React.FC<ConstructorBlocksProps> = ({items}) =>
 
         if ('loadable' in item && item.loadable) {
             const {source, serviceId, params} = item.loadable as LoadableProps;
-            const config = _.get(loadables, source);
+            const config = get(loadables, source);
 
             if (!config) {
                 return null;

src/editor/components/BlockForm/BlockForm.tsx

@@ -1,7 +1,8 @@
 import React, {Fragment, memo, useMemo} from 'react';
 
 import {DynamicField, SimpleVerticalAccordeon, Spec} from '@gravity-ui/dynamic-forms';
-import _ from 'lodash';
+import isEqual from 'lodash/isEqual';
+import noop from 'lodash/noop';
 import {Form as FinalForm, FormSpy} from 'react-final-form';
 
 import {Block, ConstructorBlock} from '../../../models';
@@ -46,13 +47,13 @@ export const BlockForm = memo(
         }
 
         return (
-            <FinalForm initialValues={initialValues} onSubmit={_.noop}>
+            <FinalForm initialValues={initialValues} onSubmit={noop}>
                 {() => (
                     <Fragment>
                         <FormSpy
                             onChange={({values}) => {
                                 // fix for FormSpy onChange called twice without content changes
-                                if (!_.isEqual(values.content, prevContent)) {
+                                if (!isEqual(values.content, prevContent)) {
                                     onChange({type, ...values.content});
                                 }
                             }}

src/editor/components/PagePropsForm/PagePropsForm.tsx

@@ -1,7 +1,7 @@
 import React, {memo, useMemo} from 'react';
 
 import {DynamicField, Spec} from '@gravity-ui/dynamic-forms';
-import _ from 'lodash';
+import noop from 'lodash/noop';
 import {Form as FinalForm, FormSpy} from 'react-final-form';
 
 import {PageContent} from '../../../models';
@@ -21,7 +21,7 @@ export const PagePropsForm = memo(({data: content, spec, onChange}: PagePropsFor
     const initialValues = useMemo(() => ({content}), []);
 
     return (
-        <FinalForm initialValues={initialValues} onSubmit={_.noop}>
+        <FinalForm initialValues={initialValues} onSubmit={noop}>
             {() => (
                 <div>
                     <FormSpy

src/editor/containers/Form/Form.tsx

@@ -1,7 +1,6 @@
 import React, {Fragment, memo} from 'react';
 
 import {Tabs, TabsProps} from '@gravity-ui/uikit';
-import _ from 'lodash';
 
 import {Block, PageContent} from '../../../models';
 import {block, getBlockKey} from '../../../utils';

src/editor/containers/__stories__/utils.ts

@@ -1,12 +1,12 @@
-import _ from 'lodash';
+import isEqual from 'lodash/isEqual';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const memoizeLast = (fn: (...args: any[]) => any) => {
     let cacheKey: Parameters<typeof fn>;
     let cacheResult: ReturnType<typeof fn>;
 
     return (...params: Parameters<typeof fn>) => {
-        if (!_.isEqual(params, cacheKey)) {
+        if (!isEqual(params, cacheKey)) {
             try {
                 const result = fn(...params);
 

src/editor/dynamic-forms-custom/components/OneOfCustom/OneOfCustom.tsx

@@ -12,7 +12,7 @@ import {
     transformArrOut,
 } from '@gravity-ui/dynamic-forms';
 import Ajv from 'ajv';
-import _ from 'lodash';
+import isEmpty from 'lodash/isEmpty';
 
 import {block} from '../../../../utils';
 import {getSpecTypeDefaultValue, useOneOf} from '../../hooks/useOneOf';
@@ -36,7 +36,7 @@ const getOneOfCustomSpecDefaultType = (spec: ObjectSpec) =>
 // dynamic-forms pass {} as default value for required properties of all types
 // this function replaces {} with default value accordingly to selected OneOf option spec type
 const getControllerDefautValue = (value: FieldValue, valueSpecType?: SpecTypes) => {
-    const isDefaultValue = typeof value === 'object' && _.isEmpty(value);
+    const isDefaultValue = typeof value === 'object' && isEmpty(value);
     const defaultValue = valueSpecType ? getSpecTypeDefaultValue(valueSpecType) : undefined;
 
     return isDefaultValue ? (defaultValue as FieldValue) : value;

src/editor/dynamic-forms-custom/config.ts

@@ -1,10 +1,10 @@
 import {DynamicFormConfig, dynamicConfig as libConfig} from '@gravity-ui/dynamic-forms';
-import _ from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
 
 import {OneOfCustom} from './components/OneOfCustom/OneOfCustom';
 
 const getDynamicConfig = () => {
-    const dynamicConfig: DynamicFormConfig = _.cloneDeep(libConfig);
+    const dynamicConfig: DynamicFormConfig = cloneDeep(libConfig);
 
     dynamicConfig.object.inputs['oneof_custom'] = {Component: OneOfCustom, independent: true};