@gravity-ui/blog-constructor 9.1.2 → 10.0.1-alpha.0

package/README.md

@@ -24,7 +24,7 @@ import {BlogPage, BlogConstructorProvider} from '@gravity-ui/blog-constructor';
     <BlogPage
         content={content}
         posts={posts}
-        tags={tags}
+        filters={filters}
         getPosts={handleGetPosts}
         settings={settings}
     />

package/build/cjs/blocks/Feed/Feed.d.ts

@@ -1,2 +1,2 @@
 import { FeedProps } from "../../models/blocks.js";
-export declare const Feed: ({ image, title }: FeedProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Feed: ({ image, title, resetTitleMargin }: FeedProps) => import("react/jsx-runtime").JSX.Element;

package/build/cjs/blocks/Feed/Feed.js

@@ -5,7 +5,6 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const page_constructor_1 = require("@gravity-ui/page-constructor");
-const uikit_1 = require("@gravity-ui/uikit");
 const FeedHeader_1 = require("../../components/FeedHeader/FeedHeader.js");
 const Posts_1 = require("../../components/Posts/Posts.js");
 const PostsError_1 = require("../../components/PostsError/PostsError.js");
@@ -20,9 +19,9 @@ const reducer_1 = require("./reducer.js");
 const CONTAINER_ID = 'blog-cards';
 const PAGE_QUERY = 'page';
 const FIRST_PAGE = 1;
-const Feed = ({ image, title }) => {
+const Feed = ({ image, title, resetTitleMargin }) => {
     var _a;
-    const { posts, totalCount, tags, services, pinnedPost, getPosts, pageCountForShowSupportButtons, } = React.useContext(FeedContext_1.FeedContext);
+    const { posts, totalCount, filters, pinnedPost, getPosts, pageCountForShowSupportButtons } = React.useContext(FeedContext_1.FeedContext);
     const router = React.useContext(RouterContext_1.RouterContext);
     const handleAnalytics = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.ShowMore);
     const additionalAnalyticsEvent = (0, common_2.prepareAnalyticsEvent)({
@@ -62,14 +61,14 @@ const Feed = ({ image, title }) => {
     }, [router]);
     const fetchData = React.useCallback(async ({ page, query }) => {
         if (query && getPosts) {
-            const queryParamsForRequest = (0, common_2.getFeedQueryParams)(Object.assign(Object.assign({}, queryParams), query), page);
+            const queryParamsForRequest = (0, common_2.getFeedQueryParams)(Object.assign(Object.assign({}, queryParams), query), page, filters);
             const data = await getPosts(queryParamsForRequest);
             return data;
         }
         else {
             throw new Error('cant get request');
         }
-    }, [getPosts, queryParams]);
+    }, [getPosts, queryParams, filters]);
     const handleLoad = React.useCallback(async ({ page, query }) => {
         const pageNumber = Number(page || queryParams.page || constants_2.DEFAULT_PAGE);
         handleChangeQueryParams(query);
@@ -143,20 +142,11 @@ const Feed = ({ image, title }) => {
             payload: loadedPostsCount < postCountOnPage,
         });
     }, [currentPage, lastLoadedCount, perPageInQuery, postCountOnPage]);
-    const serviceItems = React.useMemo(() => services === null || services === void 0 ? void 0 : services.map((service) => ({
-        content: service.name,
-        value: `${service.id}`,
-    })), [services]);
-    const tagItems = React.useMemo(() => tags === null || tags === void 0 ? void 0 : tags.map((tag) => ({
-        content: tag.name,
-        value: tag.slug,
-        icon: tag.icon && (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: tag.icon }),
-    })), [tags]);
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(FeedHeader_1.FeedHeader, { verticalOffset: "s", tags: tagItems, services: serviceItems, handleLoadData: handleLoad, queryParams: queryParams, background: {
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(FeedHeader_1.FeedHeader, { verticalOffset: "s", filters: filters, handleLoadData: handleLoad, queryParams: queryParams, background: {
                     fullWidth: true,
                     url: image,
                     disableCompress: true,
-                }, title: title }), errorLoad ? ((0, jsx_runtime_1.jsx)(PostsError_1.PostsError, { onButtonClick: handleOnErrorReload })) : ((0, jsx_runtime_1.jsx)(Posts_1.Posts, { containerId: CONTAINER_ID, currentPage: currentPage, isShowMoreVisible: isShowMoreVisible, errorShowMore: errorShowMore, postCountOnPage: postCountOnPage, perPageInQuery: perPageInQuery, handleShowMore: handleShowMore, handlePageChange: handlePageChange, postsOnPage: postsOnPage, pinnedPostOnPage: pinnedPostOnPage, isFetching: isFetching, queryParams: queryParams, pageCountForShowSupportButtons: pageCountForShowSupportButtons }))] }));
+                }, title: title, resetTitleMargin: resetTitleMargin }), errorLoad ? ((0, jsx_runtime_1.jsx)(PostsError_1.PostsError, { onButtonClick: handleOnErrorReload })) : ((0, jsx_runtime_1.jsx)(Posts_1.Posts, { containerId: CONTAINER_ID, currentPage: currentPage, isShowMoreVisible: isShowMoreVisible, errorShowMore: errorShowMore, postCountOnPage: postCountOnPage, perPageInQuery: perPageInQuery, handleShowMore: handleShowMore, handlePageChange: handlePageChange, postsOnPage: postsOnPage, pinnedPostOnPage: pinnedPostOnPage, isFetching: isFetching, queryParams: queryParams, pageCountForShowSupportButtons: pageCountForShowSupportButtons }))] }));
 };
 exports.Feed = Feed;
 //# sourceMappingURL=Feed.js.map

package/build/cjs/blocks/Feed/Feed.js.map

@@ -1 +1 @@
-{"version":3,"file":"Feed.js","sourceRoot":"../../../../src","sources":["blocks/Feed/Feed.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '@gravity-ui/page-constructor';\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {FeedHeader} from '../../components/FeedHeader/FeedHeader';\nimport {Posts} from '../../components/Posts/Posts';\nimport {PostsError} from '../../components/PostsError/PostsError';\nimport {DefaultGoalIds} from '../../constants';\nimport {FeedContext} from '../../contexts/FeedContext';\nimport {RouterContext} from '../../contexts/RouterContext';\nimport {AnalyticsCounter} from '../../counters/utils';\nimport {FeedProps} from '../../models/blocks';\nimport {DefaultEventNames, FetchArgs, HandleChangeQueryParams} from '../../models/common';\nimport {getFeedQueryParams, prepareAnalyticsEvent, scrollOnPageChange} from '../../utils/common';\nimport {DEFAULT_PAGE, DEFAULT_ROWS_PER_PAGE} from '../constants';\n\nimport {ActionTypes, reducer} from './reducer';\n\nconst CONTAINER_ID = 'blog-cards';\nconst PAGE_QUERY = 'page';\nconst FIRST_PAGE = 1;\n\nexport const Feed = ({image, title}: FeedProps) => {\n    const {\n        posts,\n        totalCount,\n        tags,\n        services,\n        pinnedPost,\n        getPosts,\n        pageCountForShowSupportButtons,\n    } = React.useContext(FeedContext);\n    const router = React.useContext(RouterContext);\n    const handleAnalytics = useAnalytics(DefaultEventNames.ShowMore);\n    const additionalAnalyticsEvent = prepareAnalyticsEvent({\n        name: DefaultGoalIds.showMore,\n        counter: AnalyticsCounter.CrossSite,\n    });\n\n    const [\n        {\n            errorLoad,\n            errorShowMore,\n            isFetching,\n            isShowMoreVisible,\n            lastLoadedCount,\n            postCountOnPage,\n            postsOnPage,\n            pinnedPostOnPage,\n            currentPage,\n            queryParams,\n        },\n        dispatch,\n    ] = React.useReducer(reducer, {\n        errorLoad: false,\n        errorShowMore: false,\n        isFetching: false,\n        isShowMoreVisible: true,\n        lastLoadedCount: posts?.length || 0,\n        postCountOnPage: totalCount || 0,\n        postsOnPage: posts,\n        pinnedPostOnPage: pinnedPost,\n        currentPage: router?.query?.page ? Number(router.query.page) : DEFAULT_PAGE,\n        queryParams: router.query || {},\n    });\n\n    const perPageInQuery = queryParams?.perPage\n        ? Number(queryParams.perPage)\n        : DEFAULT_ROWS_PER_PAGE;\n\n    const pageChange = (value: number) => {\n        dispatch({type: ActionTypes.PageChange, payload: value});\n    };\n\n    const setIsFetching = (value: boolean) => {\n        dispatch({type: ActionTypes.SetIsFetching, payload: value});\n    };\n\n    const setErrorLoad = (value: boolean) => {\n        dispatch({type: ActionTypes.SetErrorLoad, payload: value});\n    };\n\n    const handleChangeQueryParams: HandleChangeQueryParams = React.useCallback(\n        (value) => {\n            dispatch({type: ActionTypes.QueryParamsChange, payload: value});\n\n            const hasFirstPageQuery = Object.keys(value).some(\n                (queryKey) => queryKey === PAGE_QUERY && value[queryKey] === FIRST_PAGE,\n            );\n\n            const result = hasFirstPageQuery\n                ? {\n                      ...value,\n                      [PAGE_QUERY]: null,\n                  }\n                : {\n                      ...value,\n                  };\n\n            router.updateQueryCallback(result);\n        },\n        [router],\n    );\n\n    const fetchData = React.useCallback(\n        async ({page, query}: FetchArgs) => {\n            if (query && getPosts) {\n                const queryParamsForRequest = getFeedQueryParams({...queryParams, ...query}, page);\n                const data = await getPosts(queryParamsForRequest);\n\n                return data;\n            } else {\n                throw new Error('cant get request');\n            }\n        },\n        [getPosts, queryParams],\n    );\n\n    const handleLoad = React.useCallback(\n        async ({page, query}: FetchArgs) => {\n            const pageNumber = Number(page || queryParams.page || DEFAULT_PAGE);\n\n            handleChangeQueryParams(query);\n\n            try {\n                setErrorLoad(false);\n                setIsFetching(true);\n\n                const fetchedData = await fetchData({page: pageNumber, query});\n\n                if (fetchedData) {\n                    dispatch({\n                        type: ActionTypes.SetPosts,\n                        payload: {\n                            posts: fetchedData.posts,\n                            pinnedPost: fetchedData.pinnedPost,\n                            count: fetchedData.count,\n                            page: pageNumber,\n                        },\n                    });\n                }\n            } catch (err) {\n                setErrorLoad(true);\n            }\n\n            scrollOnPageChange(CONTAINER_ID);\n\n            setIsFetching(false);\n        },\n        [fetchData, handleChangeQueryParams, queryParams],\n    );\n\n    const handlePageChange = async (value: number) => {\n        pageChange(value);\n        handleLoad({\n            page: value,\n            query: {...queryParams, page: value},\n        });\n    };\n\n    const handleShowMore = async () => {\n        handleAnalytics(additionalAnalyticsEvent);\n\n        const nextPage = currentPage + 1;\n\n        try {\n            setIsFetching(true);\n            const fetchedData = await fetchData({\n                page: nextPage,\n                query: {\n                    page: nextPage,\n                },\n            });\n\n            handleChangeQueryParams({\n                page: nextPage,\n            });\n\n            if (fetchedData) {\n                dispatch({\n                    type: ActionTypes.SetShowMore,\n                    payload: {\n                        posts: (postsOnPage ?? []).concat(fetchedData.posts),\n                        count: fetchedData.count,\n                        currentPage: nextPage,\n                        lastLoadedCount: fetchedData.posts.length,\n                    },\n                });\n            }\n        } catch (err) {\n            dispatch({type: ActionTypes.SetErrorShowMore, payload: true});\n        }\n\n        setIsFetching(false);\n    };\n\n    const handleOnErrorReload = React.useCallback(() => {\n        handleLoad({page: currentPage, query: queryParams});\n    }, [currentPage, handleLoad, queryParams]);\n\n    React.useEffect(() => {\n        const loadedPostsCount = currentPage * perPageInQuery;\n        dispatch({\n            type: ActionTypes.SetIsShowMoreVisible,\n            payload: loadedPostsCount < postCountOnPage,\n        });\n    }, [currentPage, lastLoadedCount, perPageInQuery, postCountOnPage]);\n\n    const serviceItems = React.useMemo(\n        () =>\n            services?.map((service) => ({\n                content: service.name,\n                value: `${service.id}`,\n            })),\n        [services],\n    );\n\n    const tagItems = React.useMemo(\n        () =>\n            tags?.map((tag) => ({\n                content: tag.name,\n                value: tag.slug,\n                icon: tag.icon && <Icon data={tag.icon} />,\n            })),\n        [tags],\n    );\n\n    return (\n        <div>\n            <FeedHeader\n                verticalOffset=\"s\"\n                tags={tagItems}\n                services={serviceItems}\n                handleLoadData={handleLoad}\n                queryParams={queryParams}\n                background={{\n                    fullWidth: true,\n                    url: image,\n                    disableCompress: true,\n                }}\n                title={title}\n            />\n            {errorLoad ? (\n                <PostsError onButtonClick={handleOnErrorReload} />\n            ) : (\n                <Posts\n                    containerId={CONTAINER_ID}\n                    currentPage={currentPage}\n                    isShowMoreVisible={isShowMoreVisible}\n                    errorShowMore={errorShowMore}\n                    postCountOnPage={postCountOnPage}\n                    perPageInQuery={perPageInQuery}\n                    handleShowMore={handleShowMore}\n                    handlePageChange={handlePageChange}\n                    postsOnPage={postsOnPage}\n                    pinnedPostOnPage={pinnedPostOnPage}\n                    isFetching={isFetching}\n                    queryParams={queryParams}\n                    pageCountForShowSupportButtons={pageCountForShowSupportButtons}\n                />\n            )}\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"Feed.js","sourceRoot":"../../../../src","sources":["blocks/Feed/Feed.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '@gravity-ui/page-constructor';\n\nimport {FeedHeader} from '../../components/FeedHeader/FeedHeader';\nimport {Posts} from '../../components/Posts/Posts';\nimport {PostsError} from '../../components/PostsError/PostsError';\nimport {DefaultGoalIds} from '../../constants';\nimport {FeedContext} from '../../contexts/FeedContext';\nimport {RouterContext} from '../../contexts/RouterContext';\nimport {AnalyticsCounter} from '../../counters/utils';\nimport {FeedProps} from '../../models/blocks';\nimport {DefaultEventNames, FetchArgs, HandleChangeQueryParams} from '../../models/common';\nimport {getFeedQueryParams, prepareAnalyticsEvent, scrollOnPageChange} from '../../utils/common';\nimport {DEFAULT_PAGE, DEFAULT_ROWS_PER_PAGE} from '../constants';\n\nimport {ActionTypes, reducer} from './reducer';\n\nconst CONTAINER_ID = 'blog-cards';\nconst PAGE_QUERY = 'page';\nconst FIRST_PAGE = 1;\n\nexport const Feed = ({image, title, resetTitleMargin}: FeedProps) => {\n    const {posts, totalCount, filters, pinnedPost, getPosts, pageCountForShowSupportButtons} =\n        React.useContext(FeedContext);\n    const router = React.useContext(RouterContext);\n    const handleAnalytics = useAnalytics(DefaultEventNames.ShowMore);\n    const additionalAnalyticsEvent = prepareAnalyticsEvent({\n        name: DefaultGoalIds.showMore,\n        counter: AnalyticsCounter.CrossSite,\n    });\n\n    const [\n        {\n            errorLoad,\n            errorShowMore,\n            isFetching,\n            isShowMoreVisible,\n            lastLoadedCount,\n            postCountOnPage,\n            postsOnPage,\n            pinnedPostOnPage,\n            currentPage,\n            queryParams,\n        },\n        dispatch,\n    ] = React.useReducer(reducer, {\n        errorLoad: false,\n        errorShowMore: false,\n        isFetching: false,\n        isShowMoreVisible: true,\n        lastLoadedCount: posts?.length || 0,\n        postCountOnPage: totalCount || 0,\n        postsOnPage: posts,\n        pinnedPostOnPage: pinnedPost,\n        currentPage: router?.query?.page ? Number(router.query.page) : DEFAULT_PAGE,\n        queryParams: router.query || {},\n    });\n\n    const perPageInQuery = queryParams?.perPage\n        ? Number(queryParams.perPage)\n        : DEFAULT_ROWS_PER_PAGE;\n\n    const pageChange = (value: number) => {\n        dispatch({type: ActionTypes.PageChange, payload: value});\n    };\n\n    const setIsFetching = (value: boolean) => {\n        dispatch({type: ActionTypes.SetIsFetching, payload: value});\n    };\n\n    const setErrorLoad = (value: boolean) => {\n        dispatch({type: ActionTypes.SetErrorLoad, payload: value});\n    };\n\n    const handleChangeQueryParams: HandleChangeQueryParams = React.useCallback(\n        (value) => {\n            dispatch({type: ActionTypes.QueryParamsChange, payload: value});\n\n            const hasFirstPageQuery = Object.keys(value).some(\n                (queryKey) => queryKey === PAGE_QUERY && value[queryKey] === FIRST_PAGE,\n            );\n\n            const result = hasFirstPageQuery\n                ? {\n                      ...value,\n                      [PAGE_QUERY]: null,\n                  }\n                : {\n                      ...value,\n                  };\n\n            router.updateQueryCallback(result);\n        },\n        [router],\n    );\n\n    const fetchData = React.useCallback(\n        async ({page, query}: FetchArgs) => {\n            if (query && getPosts) {\n                const queryParamsForRequest = getFeedQueryParams(\n                    {...queryParams, ...query},\n                    page,\n                    filters,\n                );\n                const data = await getPosts(queryParamsForRequest);\n\n                return data;\n            } else {\n                throw new Error('cant get request');\n            }\n        },\n        [getPosts, queryParams, filters],\n    );\n\n    const handleLoad = React.useCallback(\n        async ({page, query}: FetchArgs) => {\n            const pageNumber = Number(page || queryParams.page || DEFAULT_PAGE);\n\n            handleChangeQueryParams(query);\n\n            try {\n                setErrorLoad(false);\n                setIsFetching(true);\n\n                const fetchedData = await fetchData({page: pageNumber, query});\n\n                if (fetchedData) {\n                    dispatch({\n                        type: ActionTypes.SetPosts,\n                        payload: {\n                            posts: fetchedData.posts,\n                            pinnedPost: fetchedData.pinnedPost,\n                            count: fetchedData.count,\n                            page: pageNumber,\n                        },\n                    });\n                }\n            } catch (err) {\n                setErrorLoad(true);\n            }\n\n            scrollOnPageChange(CONTAINER_ID);\n\n            setIsFetching(false);\n        },\n        [fetchData, handleChangeQueryParams, queryParams],\n    );\n\n    const handlePageChange = async (value: number) => {\n        pageChange(value);\n        handleLoad({\n            page: value,\n            query: {...queryParams, page: value},\n        });\n    };\n\n    const handleShowMore = async () => {\n        handleAnalytics(additionalAnalyticsEvent);\n\n        const nextPage = currentPage + 1;\n\n        try {\n            setIsFetching(true);\n            const fetchedData = await fetchData({\n                page: nextPage,\n                query: {\n                    page: nextPage,\n                },\n            });\n\n            handleChangeQueryParams({\n                page: nextPage,\n            });\n\n            if (fetchedData) {\n                dispatch({\n                    type: ActionTypes.SetShowMore,\n                    payload: {\n                        posts: (postsOnPage ?? []).concat(fetchedData.posts),\n                        count: fetchedData.count,\n                        currentPage: nextPage,\n                        lastLoadedCount: fetchedData.posts.length,\n                    },\n                });\n            }\n        } catch (err) {\n            dispatch({type: ActionTypes.SetErrorShowMore, payload: true});\n        }\n\n        setIsFetching(false);\n    };\n\n    const handleOnErrorReload = React.useCallback(() => {\n        handleLoad({page: currentPage, query: queryParams});\n    }, [currentPage, handleLoad, queryParams]);\n\n    React.useEffect(() => {\n        const loadedPostsCount = currentPage * perPageInQuery;\n        dispatch({\n            type: ActionTypes.SetIsShowMoreVisible,\n            payload: loadedPostsCount < postCountOnPage,\n        });\n    }, [currentPage, lastLoadedCount, perPageInQuery, postCountOnPage]);\n\n    return (\n        <div>\n            <FeedHeader\n                verticalOffset=\"s\"\n                filters={filters}\n                handleLoadData={handleLoad}\n                queryParams={queryParams}\n                background={{\n                    fullWidth: true,\n                    url: image,\n                    disableCompress: true,\n                }}\n                title={title}\n                resetTitleMargin={resetTitleMargin}\n            />\n            {errorLoad ? (\n                <PostsError onButtonClick={handleOnErrorReload} />\n            ) : (\n                <Posts\n                    containerId={CONTAINER_ID}\n                    currentPage={currentPage}\n                    isShowMoreVisible={isShowMoreVisible}\n                    errorShowMore={errorShowMore}\n                    postCountOnPage={postCountOnPage}\n                    perPageInQuery={perPageInQuery}\n                    handleShowMore={handleShowMore}\n                    handlePageChange={handlePageChange}\n                    postsOnPage={postsOnPage}\n                    pinnedPostOnPage={pinnedPostOnPage}\n                    isFetching={isFetching}\n                    queryParams={queryParams}\n                    pageCountForShowSupportButtons={pageCountForShowSupportButtons}\n                />\n            )}\n        </div>\n    );\n};\n"]}

package/build/cjs/components/FeedHeader/FeedHeader.d.ts

@@ -3,5 +3,5 @@ import { ControlsProps } from "./components/Controls/Controls.js";
 type HeaderProps = Pick<HeaderBlockProps, 'background' | 'offset' | 'theme' | 'verticalOffset'>;
 type FeedHeaderProps = HeaderProps & ControlsProps;
 type FeedHeaderContainerProps = FeedHeaderProps & ClassNameProps;
-export declare const FeedHeader: ({ tags, services, handleLoadData, offset, background, theme, verticalOffset, className, queryParams, title, }: FeedHeaderContainerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FeedHeader: ({ filters, handleLoadData, offset, background, theme, verticalOffset, className, queryParams, title, resetTitleMargin, }: FeedHeaderContainerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/build/cjs/components/FeedHeader/FeedHeader.js

@@ -6,13 +6,13 @@ const page_constructor_1 = require("@gravity-ui/page-constructor");
 const cn_1 = require("../../utils/cn.js");
 const Controls_1 = require("./components/Controls/Controls.js");
 const b = (0, cn_1.block)('feed-header');
-const FeedHeader = ({ tags, services, handleLoadData, offset = 'default', background, theme = 'light', verticalOffset = 'l', className, queryParams, title, }) => {
+const FeedHeader = ({ filters, handleLoadData, offset = 'default', background, theme = 'light', verticalOffset = 'l', className, queryParams, title, resetTitleMargin, }) => {
     const backgroundThemed = background && (0, page_constructor_1.getThemedValue)(background, theme);
     return ((0, jsx_runtime_1.jsxs)("header", { className: b('header', { ['has-background']: Boolean(background) }, className), children: [(backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color) ? ((0, jsx_runtime_1.jsx)(page_constructor_1.FullWidthBackground, { style: { backgroundColor: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color }, theme: "rounded" })) : null, (0, jsx_runtime_1.jsxs)(page_constructor_1.Grid, { className: b('content', { offset, theme, 'vertical-offset': verticalOffset }), children: [backgroundThemed ? ((0, jsx_runtime_1.jsx)(page_constructor_1.BackgroundImage, { src: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.url, className: b('background'), imageClassName: b('background-img'), style: {
                             backgroundColor: backgroundThemed.fullWidth
                                 ? ''
                                 : backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color,
-                        }, disableCompress: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.disableCompress })) : null, (0, jsx_runtime_1.jsx)(Controls_1.Controls, { title: title, tags: tags, services: services, handleLoadData: handleLoadData, queryParams: queryParams })] })] }));
+                        }, disableCompress: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.disableCompress })) : null, (0, jsx_runtime_1.jsx)(Controls_1.Controls, { title: title, filters: filters, handleLoadData: handleLoadData, queryParams: queryParams, resetTitleMargin: resetTitleMargin })] })] }));
 };
 exports.FeedHeader = FeedHeader;
 //# sourceMappingURL=FeedHeader.js.map

package/build/cjs/components/FeedHeader/FeedHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeedHeader.js","sourceRoot":"../../../../src","sources":["components/FeedHeader/FeedHeader.tsx"],"names":[],"mappings":";;;;AAAA,mEAMsC;AAGtC,0CAAqC;AAErC,gEAAuE;AAIvE,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,aAAa,CAAC,CAAC;AAQxB,MAAM,UAAU,GAAG,CAAC,EACvB,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,MAAM,GAAG,SAAS,EAClB,UAAU,EACV,KAAK,GAAG,OAAO,EACf,cAAc,GAAG,GAAG,EACpB,SAAS,EACT,WAAW,EACX,KAAK,GACkB,EAAE,EAAE;IAC3B,MAAM,gBAAgB,GAAG,UAAU,IAAI,IAAA,iCAAc,EAAC,UAAU,EAAE,KAAc,CAAC,CAAC;IAElF,OAAO,CACH,oCAAQ,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,EAAC,EAAE,SAAS,CAAC,aAC/E,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK,EAAC,CAAC,CAAC,CACvB,uBAAC,sCAAmB,IAChB,KAAK,EAAE,EAAC,eAAe,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK,EAAC,EACjD,KAAK,EAAC,SAAS,GACjB,CACL,CAAC,CAAC,CAAC,IAAI,EACR,wBAAC,uBAAI,IAAC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAC,CAAC,aAC5E,gBAAgB,CAAC,CAAC,CAAC,CAChB,uBAAC,kCAAe,IACZ,GAAG,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,EAC1B,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,EAC1B,cAAc,EAAE,CAAC,CAAC,gBAAgB,CAAC,EACnC,KAAK,EAAE;4BACH,eAAe,EAAE,gBAAgB,CAAC,SAAS;gCACvC,CAAC,CAAC,EAAE;gCACJ,CAAC,CAAC,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK;yBAChC,EACD,eAAe,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe,GACpD,CACL,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,mBAAQ,IACL,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,GAC1B,IACC,IACF,CACZ,CAAC;AACN,CAAC,CAAC;AA9CW,QAAA,UAAU,cA8CrB","sourcesContent":["import {\n    BackgroundImage,\n    FullWidthBackground,\n    Grid,\n    Theme,\n    getThemedValue,\n} from '@gravity-ui/page-constructor';\n\nimport {ClassNameProps, HeaderBlockProps} from '../../models/common';\nimport {block} from '../../utils/cn';\n\nimport {Controls, ControlsProps} from './components/Controls/Controls';\n\nimport './FeedHeader.scss';\n\nconst b = block('feed-header');\n\ntype HeaderProps = Pick<HeaderBlockProps, 'background' | 'offset' | 'theme' | 'verticalOffset'>;\n\ntype FeedHeaderProps = HeaderProps & ControlsProps;\n\ntype FeedHeaderContainerProps = FeedHeaderProps & ClassNameProps;\n\nexport const FeedHeader = ({\n    tags,\n    services,\n    handleLoadData,\n    offset = 'default',\n    background,\n    theme = 'light',\n    verticalOffset = 'l',\n    className,\n    queryParams,\n    title,\n}: FeedHeaderContainerProps) => {\n    const backgroundThemed = background && getThemedValue(background, theme as Theme);\n\n    return (\n        <header className={b('header', {['has-background']: Boolean(background)}, className)}>\n            {backgroundThemed?.color ? (\n                <FullWidthBackground\n                    style={{backgroundColor: backgroundThemed?.color}}\n                    theme=\"rounded\"\n                />\n            ) : null}\n            <Grid className={b('content', {offset, theme, 'vertical-offset': verticalOffset})}>\n                {backgroundThemed ? (\n                    <BackgroundImage\n                        src={backgroundThemed?.url}\n                        className={b('background')}\n                        imageClassName={b('background-img')}\n                        style={{\n                            backgroundColor: backgroundThemed.fullWidth\n                                ? ''\n                                : backgroundThemed?.color,\n                        }}\n                        disableCompress={backgroundThemed?.disableCompress}\n                    />\n                ) : null}\n                <Controls\n                    title={title}\n                    tags={tags}\n                    services={services}\n                    handleLoadData={handleLoadData}\n                    queryParams={queryParams}\n                />\n            </Grid>\n        </header>\n    );\n};\n"]}
+{"version":3,"file":"FeedHeader.js","sourceRoot":"../../../../src","sources":["components/FeedHeader/FeedHeader.tsx"],"names":[],"mappings":";;;;AAAA,mEAMsC;AAGtC,0CAAqC;AAErC,gEAAuE;AAIvE,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,aAAa,CAAC,CAAC;AAQxB,MAAM,UAAU,GAAG,CAAC,EACvB,OAAO,EACP,cAAc,EACd,MAAM,GAAG,SAAS,EAClB,UAAU,EACV,KAAK,GAAG,OAAO,EACf,cAAc,GAAG,GAAG,EACpB,SAAS,EACT,WAAW,EACX,KAAK,EACL,gBAAgB,GACO,EAAE,EAAE;IAC3B,MAAM,gBAAgB,GAAG,UAAU,IAAI,IAAA,iCAAc,EAAC,UAAU,EAAE,KAAc,CAAC,CAAC;IAElF,OAAO,CACH,oCAAQ,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,EAAC,EAAE,SAAS,CAAC,aAC/E,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK,EAAC,CAAC,CAAC,CACvB,uBAAC,sCAAmB,IAChB,KAAK,EAAE,EAAC,eAAe,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK,EAAC,EACjD,KAAK,EAAC,SAAS,GACjB,CACL,CAAC,CAAC,CAAC,IAAI,EACR,wBAAC,uBAAI,IAAC,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAC,CAAC,aAC5E,gBAAgB,CAAC,CAAC,CAAC,CAChB,uBAAC,kCAAe,IACZ,GAAG,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,EAC1B,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,EAC1B,cAAc,EAAE,CAAC,CAAC,gBAAgB,CAAC,EACnC,KAAK,EAAE;4BACH,eAAe,EAAE,gBAAgB,CAAC,SAAS;gCACvC,CAAC,CAAC,EAAE;gCACJ,CAAC,CAAC,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,KAAK;yBAChC,EACD,eAAe,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe,GACpD,CACL,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,mBAAQ,IACL,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,GACpC,IACC,IACF,CACZ,CAAC;AACN,CAAC,CAAC;AA9CW,QAAA,UAAU,cA8CrB","sourcesContent":["import {\n    BackgroundImage,\n    FullWidthBackground,\n    Grid,\n    Theme,\n    getThemedValue,\n} from '@gravity-ui/page-constructor';\n\nimport {ClassNameProps, HeaderBlockProps} from '../../models/common';\nimport {block} from '../../utils/cn';\n\nimport {Controls, ControlsProps} from './components/Controls/Controls';\n\nimport './FeedHeader.scss';\n\nconst b = block('feed-header');\n\ntype HeaderProps = Pick<HeaderBlockProps, 'background' | 'offset' | 'theme' | 'verticalOffset'>;\n\ntype FeedHeaderProps = HeaderProps & ControlsProps;\n\ntype FeedHeaderContainerProps = FeedHeaderProps & ClassNameProps;\n\nexport const FeedHeader = ({\n    filters,\n    handleLoadData,\n    offset = 'default',\n    background,\n    theme = 'light',\n    verticalOffset = 'l',\n    className,\n    queryParams,\n    title,\n    resetTitleMargin,\n}: FeedHeaderContainerProps) => {\n    const backgroundThemed = background && getThemedValue(background, theme as Theme);\n\n    return (\n        <header className={b('header', {['has-background']: Boolean(background)}, className)}>\n            {backgroundThemed?.color ? (\n                <FullWidthBackground\n                    style={{backgroundColor: backgroundThemed?.color}}\n                    theme=\"rounded\"\n                />\n            ) : null}\n            <Grid className={b('content', {offset, theme, 'vertical-offset': verticalOffset})}>\n                {backgroundThemed ? (\n                    <BackgroundImage\n                        src={backgroundThemed?.url}\n                        className={b('background')}\n                        imageClassName={b('background-img')}\n                        style={{\n                            backgroundColor: backgroundThemed.fullWidth\n                                ? ''\n                                : backgroundThemed?.color,\n                        }}\n                        disableCompress={backgroundThemed?.disableCompress}\n                    />\n                ) : null}\n                <Controls\n                    title={title}\n                    filters={filters}\n                    handleLoadData={handleLoadData}\n                    queryParams={queryParams}\n                    resetTitleMargin={resetTitleMargin}\n                />\n            </Grid>\n        </header>\n    );\n};\n"]}

package/build/cjs/components/FeedHeader/components/Controls/Controls.css

@@ -19,90 +19,9 @@ unpredictable css rules order in build */
   padding-top: 112px;
   padding-bottom: 96px;
 }
-.bc-feed-controls__search {
-  width: 100%;
-  max-width: 100%;
+.bc-feed-controls__header-item_title.bc-feed-controls__header-item_reset-margin {
+  margin: 0;
 }
-.bc-feed-controls__select {
-  width: 100%;
-}
-.bc-feed-controls__popup.bc-feed-controls__popup {
-  max-height: 500px;
-  border-radius: 12px;
-}
-.bc-feed-controls__popup.bc-feed-controls__popup .g-select-list::-webkit-scrollbar {
-  display: none;
-}
-.bc-feed-controls__popup.bc-feed-controls__popup .g-select-list .g-list {
-  max-height: calc(500px - var(--g-text-body-3-line-height) - 12px);
-}
-.bc-feed-controls__popup.bc-feed-controls__popup .g-list__item {
-  margin: 4px;
-  border-radius: 8px;
-}
-
-.bc-feed-controls__popup_isMobile .bc-feed-controls__popup-filter {
-  position: relative;
-  border: none;
-}
-.bc-feed-controls__popup_isMobile .bc-feed-controls__popup-filter::before {
-  content: "";
-  position: absolute;
-  left: 50%;
-  bottom: 0px;
-  border-bottom: 2px solid var(--g-color-line-generic);
-  border-bottom-right-radius: 0;
-  border-bottom-left-radius: 0;
-  width: 100%;
-  height: 2px;
-  transform: translateX(-50%);
-}
-.bc-feed-controls__popup-filter {
-  font-size: var(--g-text-body-2-font-size);
-  line-height: var(--g-text-body-2-line-height);
-  padding: 4px 12px;
-  border: none;
-  border-bottom: 1px solid var(--g-color-line-generic);
-  border-bottom-right-radius: 0;
-  border-bottom-left-radius: 0;
-}
-.bc-feed-controls__select:hover {
-  width: 100%;
-}
-.bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly {
-  --g-button-background-color: var(--pc-monochrome-button-background-color);
-  --g-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
-}
-.bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly, .bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly:link, .bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly:visited, .bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly:active, .bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly:focus {
-  color: var(--pc-monochrome-button-color);
-}
-.bc-feed-controls__saved-only-button_savedOnly.bc-feed-controls__saved-only-button_savedOnly:hover {
-  color: var(--pc-monochrome-button-color);
-}
-
-.bc-feed-controls__saved-only-button_savedOnly:focus {
-  color: var(--g-color-base-background);
-}
-.bc-feed-controls__filter-item {
-  margin-right: 8px;
-  margin-left: 8px;
-  margin-bottom: 12px;
-  min-width: 230px;
-  flex-grow: 1;
-}
-@media (min-width: 577px) {
-  .bc-feed-controls__filter-item {
-    max-width: 240px;
-  }
-}
-.bc-feed-controls__filter-item_width-auto {
-  width: auto;
-  min-width: auto;
-  flex-grow: 0;
-}
-.bc-feed-controls__icon {
-  color: var(--g-color-base-brand);
-}
-.bc-feed-controls__icon_savedOnly {
-  color: var(--g-color-base-background);
+.bc-feed-controls__header-item_filters + .bc-feed-controls__header-item_filters {
+  margin-top: 8px;
 }

package/build/cjs/components/FeedHeader/components/Controls/Controls.d.ts

@@ -1,15 +1,9 @@
-import * as React from 'react';
-import { FetchArgs, Query } from "../../../../models/common.js";
-export type SelectItem = {
-    content: string;
-    value: string;
-    icon?: React.ReactNode;
-};
+import { FetchArgs, FiltersConfig, Query } from "../../../../models/common.js";
 export type ControlsProps = {
     handleLoadData: (props: FetchArgs) => void;
-    tags?: SelectItem[];
-    services?: SelectItem[];
+    filters?: FiltersConfig;
     queryParams: Query;
     title?: string;
+    resetTitleMargin?: boolean;
 };
-export declare const Controls: ({ handleLoadData, tags, services, queryParams, title, }: ControlsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Controls: ({ handleLoadData, filters, queryParams, title, resetTitleMargin, }: ControlsProps) => import("react/jsx-runtime").JSX.Element;

package/build/cjs/components/FeedHeader/components/Controls/Controls.js

@@ -4,102 +4,19 @@ exports.Controls = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
-const icons_1 = require("@gravity-ui/icons");
-const page_constructor_1 = require("@gravity-ui/page-constructor");
 const uikit_1 = require("@gravity-ui/uikit");
-const constants_1 = require("../../../../constants.js");
-const LikesContext_1 = require("../../../../contexts/LikesContext.js");
-const MobileContext_1 = require("../../../../contexts/MobileContext.js");
-const utils_1 = require("../../../../counters/utils.js");
 const i18n_1 = require("../../../../i18n/index.js");
 const common_1 = require("../../../../models/common.js");
 const cn_1 = require("../../../../utils/cn.js");
-const common_2 = require("../../../../utils/common.js");
-const Search_1 = require("../../../Search/Search.js");
-const customRenders_1 = require("./customRenders.js");
+const FilterControl_1 = require("../FilterControl/FilterControl.js");
 const b = (0, cn_1.block)('feed-controls');
-const ICON_SIZE = 16;
 const DEFAULT_PAGE = 1;
-const VIRTUALIZATION_THRESHOLD = 1000;
-const Controls = ({ handleLoadData, tags = [], services = [], queryParams, title = (0, i18n_1.i18n)(i18n_1.Keyset.Title), }) => {
-    const { hasLikes } = React.useContext(LikesContext_1.LikesContext);
-    const handleAnalyticsTag = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.Tag);
-    const handleAnalyticsService = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.Service);
-    const handleAnalyticsSaveOnly = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.SaveOnly);
-    const { savedOnly: savedOnlyInitial, search: searchInitial, tags: tagInitial, services: servicesInitial, } = queryParams || {};
-    const [savedOnly, setSavedOnly] = React.useState(savedOnlyInitial === 'true');
-    const [search, setSearch] = React.useState(searchInitial);
-    const isMobile = React.useContext(MobileContext_1.MobileContext);
-    const handleSavedOnly = () => {
-        handleAnalyticsSaveOnly();
-        setSavedOnly(!savedOnly);
-        handleLoadData({
-            page: DEFAULT_PAGE,
-            query: {
-                savedOnly: savedOnly ? '' : 'true',
-                search: '',
-                tags: '',
-                page: DEFAULT_PAGE,
-                services: '',
-            },
-        });
-    };
-    const handleSearch = React.useCallback((searchValue) => {
-        setSearch(searchValue);
-        handleLoadData({
-            page: DEFAULT_PAGE,
-            query: { search: searchValue, page: DEFAULT_PAGE },
-        });
-    }, [handleLoadData]);
-    const handleTagSelect = (selectedTags) => {
-        const event = (0, common_2.prepareAnalyticsEvent)({
-            name: constants_1.DefaultGoalIds.tag,
-            counter: utils_1.AnalyticsCounter.CrossSite,
-        });
-        handleAnalyticsTag(event, {
-            theme: selectedTags[0],
-        });
-        const isEmptyTag = selectedTags.some((tag) => tag === 'empty');
-        handleLoadData({
-            page: DEFAULT_PAGE,
-            query: {
-                tags: isEmptyTag ? '' : selectedTags[0],
-                page: DEFAULT_PAGE,
-            },
-        });
-    };
-    const handleServicesSelect = (selectedServices) => {
-        const forAnalyticsServices = services.filter((service) => {
-            return selectedServices.includes(service.value);
-        });
-        const servicesAsStringForAnalytics = forAnalyticsServices
-            .map((service) => service.content)
-            .join(',');
-        const event = (0, common_2.prepareAnalyticsEvent)({
-            name: constants_1.DefaultGoalIds.service,
-            counter: utils_1.AnalyticsCounter.CrossSite,
-        });
-        handleAnalyticsService(event, {
-            service: servicesAsStringForAnalytics,
-        });
-        const servicesAsString = selectedServices.join(',');
-        handleLoadData({
-            page: DEFAULT_PAGE,
-            query: { services: servicesAsString, page: DEFAULT_PAGE },
-        });
-    };
-    const tagsItems = React.useMemo(() => [{ value: 'empty', content: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags) }, ...tags], [tags]);
-    const servicesItems = React.useMemo(() => (servicesInitial ? [...servicesInitial.split(',')] : []), [servicesInitial]);
-    return ((0, jsx_runtime_1.jsx)(uikit_1.MobileProvider, { mobile: false, children: (0, jsx_runtime_1.jsxs)("div", { className: b('header'), children: [(0, jsx_runtime_1.jsx)("h1", { className: b('header-item', { title: true }), children: title }), (0, jsx_runtime_1.jsxs)("div", { className: b('header-item', { filters: true }), children: [(0, jsx_runtime_1.jsx)("div", { className: b('filter-item'), children: (0, jsx_runtime_1.jsx)(Search_1.Search, { className: b('search'), placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch }) }), (0, jsx_runtime_1.jsx)("div", { className: b('filter-item'), children: (0, jsx_runtime_1.jsx)(uikit_1.Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: (0, customRenders_1.renderSwitcher)({
-                                    initial: [tagInitial],
-                                    list: tagsItems,
-                                    defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags),
-                                }), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption }) }), services.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: b('filter-item'), children: (0, jsx_runtime_1.jsx)(uikit_1.Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices), renderControl: (0, customRenders_1.renderSwitcher)({
-                                    initial: servicesItems,
-                                    list: services,
-                                    defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices),
-                                    qa: 'service-select',
-                                }), virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption, renderFilter: customRenders_1.renderFilter }) })) : null, hasLikes ? ((0, jsx_runtime_1.jsx)("div", { className: b('filter-item', { 'width-auto': true }), children: (0, jsx_runtime_1.jsxs)(uikit_1.Button, { view: 'outlined', className: b('saved-only-button', { savedOnly }), size: "xl", onClick: handleSavedOnly, selected: savedOnly, children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Bookmark, size: ICON_SIZE, className: b('icon', { savedOnly }) }), (0, i18n_1.i18n)(i18n_1.Keyset.ActionSavedOnly)] }) })) : null] })] }) }));
+const Controls = ({ handleLoadData, filters = [], queryParams, title = (0, i18n_1.i18n)(i18n_1.Keyset.Title), resetTitleMargin, }) => {
+    const handleFilterChange = React.useCallback((query) => handleLoadData({ page: DEFAULT_PAGE, query: Object.assign({ page: DEFAULT_PAGE }, query) }), [handleLoadData]);
+    const rows = (0, common_1.normalizeFiltersToRows)(filters);
+    return ((0, jsx_runtime_1.jsx)(uikit_1.MobileProvider, { mobile: false, children: (0, jsx_runtime_1.jsxs)("div", { className: b('header'), children: [(0, jsx_runtime_1.jsx)("h1", { className: b('header-item', { title: true, 'reset-margin': resetTitleMargin }), children: title }), rows.map((row, rowIndex) => (
+                // eslint-disable-next-line react/no-array-index-key
+                (0, jsx_runtime_1.jsx)("div", { className: b('header-item', { filters: true }), children: row.map((filter) => ((0, jsx_runtime_1.jsx)(FilterControl_1.FilterControl, { filter: filter, initialValue: queryParams === null || queryParams === void 0 ? void 0 : queryParams[filter.queryParamName], onChange: handleFilterChange }, filter.queryParamName))) }, rowIndex)))] }) }));
 };
 exports.Controls = Controls;
 //# sourceMappingURL=Controls.js.map

package/build/cjs/components/FeedHeader/components/Controls/Controls.js.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.js","sourceRoot":"../../../../../../src","sources":["components/FeedHeader/components/Controls/Controls.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Bookmark} from '@gravity-ui/icons';\nimport {useAnalytics} from '@gravity-ui/page-constructor';\nimport {Button, Icon, MobileProvider, Select} from '@gravity-ui/uikit';\n\nimport {DefaultGoalIds} from '../../../../constants';\nimport {LikesContext} from '../../../../contexts/LikesContext';\nimport {MobileContext} from '../../../../contexts/MobileContext';\nimport {AnalyticsCounter} from '../../../../counters/utils';\nimport {Keyset, i18n} from '../../../../i18n';\nimport {DefaultEventNames, FetchArgs, Query} from '../../../../models/common';\nimport {block} from '../../../../utils/cn';\nimport {prepareAnalyticsEvent} from '../../../../utils/common';\nimport {Search} from '../../../Search/Search';\n\nimport {renderFilter, renderOption, renderSwitcher} from './customRenders';\n\nimport './Controls.scss';\n\nconst b = block('feed-controls');\n\nexport type SelectItem = {\n    content: string;\n    value: string;\n    icon?: React.ReactNode;\n};\n\nexport type ControlsProps = {\n    handleLoadData: (props: FetchArgs) => void;\n    tags?: SelectItem[];\n    services?: SelectItem[];\n    queryParams: Query;\n    title?: string;\n};\n\nconst ICON_SIZE = 16;\nconst DEFAULT_PAGE = 1;\nconst VIRTUALIZATION_THRESHOLD = 1000;\n\nexport const Controls = ({\n    handleLoadData,\n    tags = [],\n    services = [],\n    queryParams,\n    title = i18n(Keyset.Title),\n}: ControlsProps) => {\n    const {hasLikes} = React.useContext(LikesContext);\n    const handleAnalyticsTag = useAnalytics(DefaultEventNames.Tag);\n    const handleAnalyticsService = useAnalytics(DefaultEventNames.Service);\n    const handleAnalyticsSaveOnly = useAnalytics(DefaultEventNames.SaveOnly);\n\n    const {\n        savedOnly: savedOnlyInitial,\n        search: searchInitial,\n        tags: tagInitial,\n        services: servicesInitial,\n    } = queryParams || {};\n\n    const [savedOnly, setSavedOnly] = React.useState<boolean>(savedOnlyInitial === 'true');\n    const [search, setSearch] = React.useState<string>(searchInitial as string);\n\n    const isMobile = React.useContext(MobileContext);\n\n    const handleSavedOnly = () => {\n        handleAnalyticsSaveOnly();\n        setSavedOnly(!savedOnly);\n        handleLoadData({\n            page: DEFAULT_PAGE,\n            query: {\n                savedOnly: savedOnly ? '' : 'true',\n                search: '',\n                tags: '',\n                page: DEFAULT_PAGE,\n                services: '',\n            },\n        });\n    };\n\n    const handleSearch = React.useCallback(\n        (searchValue: string) => {\n            setSearch(searchValue);\n\n            handleLoadData({\n                page: DEFAULT_PAGE,\n                query: {search: searchValue, page: DEFAULT_PAGE},\n            });\n        },\n        [handleLoadData],\n    );\n\n    const handleTagSelect = (selectedTags: string[]) => {\n        const event = prepareAnalyticsEvent({\n            name: DefaultGoalIds.tag,\n            counter: AnalyticsCounter.CrossSite,\n        });\n        handleAnalyticsTag(event, {\n            theme: selectedTags[0],\n        });\n\n        const isEmptyTag = selectedTags.some((tag) => tag === 'empty');\n\n        handleLoadData({\n            page: DEFAULT_PAGE,\n            query: {\n                tags: isEmptyTag ? '' : selectedTags[0],\n                page: DEFAULT_PAGE,\n            },\n        });\n    };\n\n    const handleServicesSelect = (selectedServices: string[]) => {\n        const forAnalyticsServices = services.filter((service) => {\n            return selectedServices.includes(service.value);\n        });\n\n        const servicesAsStringForAnalytics = forAnalyticsServices\n            .map((service) => service.content)\n            .join(',');\n\n        const event = prepareAnalyticsEvent({\n            name: DefaultGoalIds.service,\n            counter: AnalyticsCounter.CrossSite,\n        });\n        handleAnalyticsService(event, {\n            service: servicesAsStringForAnalytics,\n        });\n\n        const servicesAsString = selectedServices.join(',');\n\n        handleLoadData({\n            page: DEFAULT_PAGE,\n            query: {services: servicesAsString, page: DEFAULT_PAGE},\n        });\n    };\n\n    const tagsItems = React.useMemo(\n        () => [{value: 'empty', content: i18n(Keyset.AllTags)} as unknown as SelectItem, ...tags],\n        [tags],\n    );\n\n    const servicesItems = React.useMemo(\n        () => (servicesInitial ? [...(servicesInitial as string).split(',')] : []),\n        [servicesInitial],\n    );\n\n    return (\n        <MobileProvider mobile={false}>\n            <div className={b('header')}>\n                <h1 className={b('header-item', {title: true})}>{title}</h1>\n                <div className={b('header-item', {filters: true})}>\n                    <div className={b('filter-item')}>\n                        <Search\n                            className={b('search')}\n                            placeholder={i18n(Keyset.Search)}\n                            initialValue={search && typeof search === 'string' ? search : ''}\n                            onSubmit={handleSearch}\n                        />\n                    </div>\n                    <div className={b('filter-item')}>\n                        <Select\n                            className={b('select')}\n                            size=\"xl\"\n                            options={tagsItems}\n                            defaultValue={[tagInitial] as string[]}\n                            onUpdate={handleTagSelect}\n                            placeholder={i18n(Keyset.AllTags)}\n                            popupClassName={b('popup', {isMobile})}\n                            renderControl={renderSwitcher({\n                                initial: [tagInitial],\n                                list: tagsItems,\n                                defaultLabel: i18n(Keyset.AllTags),\n                            })}\n                            disablePortal\n                            virtualizationThreshold={VIRTUALIZATION_THRESHOLD}\n                            renderOption={renderOption}\n                        />\n                    </div>\n\n                    {services.length > 0 ? (\n                        <div className={b('filter-item')}>\n                            <Select\n                                className={b('select')}\n                                size=\"xl\"\n                                multiple\n                                filterable\n                                hasClear\n                                disablePortal\n                                options={services}\n                                defaultValue={servicesItems}\n                                popupClassName={b('popup', {isMobile})}\n                                onUpdate={handleServicesSelect}\n                                placeholder={i18n(Keyset.AllServices)}\n                                renderControl={renderSwitcher({\n                                    initial: servicesItems,\n                                    list: services,\n                                    defaultLabel: i18n(Keyset.AllServices),\n                                    qa: 'service-select',\n                                })}\n                                virtualizationThreshold={VIRTUALIZATION_THRESHOLD}\n                                renderOption={renderOption}\n                                renderFilter={renderFilter}\n                            />\n                        </div>\n                    ) : null}\n                    {hasLikes ? (\n                        <div className={b('filter-item', {'width-auto': true})}>\n                            <Button\n                                view={'outlined'}\n                                className={b('saved-only-button', {savedOnly})}\n                                size=\"xl\"\n                                onClick={handleSavedOnly}\n                                selected={savedOnly}\n                            >\n                                <Icon\n                                    data={Bookmark}\n                                    size={ICON_SIZE}\n                                    className={b('icon', {savedOnly})}\n                                />\n                                {i18n(Keyset.ActionSavedOnly)}\n                            </Button>\n                        </div>\n                    ) : null}\n                </div>\n            </div>\n        </MobileProvider>\n    );\n};\n"]}
+{"version":3,"file":"Controls.js","sourceRoot":"../../../../../../src","sources":["components/FeedHeader/components/Controls/Controls.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAAiD;AAEjD,oDAA8C;AAC9C,yDAAkG;AAClG,gDAA2C;AAC3C,qEAA6D;AAI7D,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,eAAe,CAAC,CAAC;AAUjC,MAAM,YAAY,GAAG,CAAC,CAAC;AAEhB,MAAM,QAAQ,GAAG,CAAC,EACrB,cAAc,EACd,OAAO,GAAG,EAAE,EACZ,WAAW,EACX,KAAK,GAAG,IAAA,WAAI,EAAC,aAAM,CAAC,KAAK,CAAC,EAC1B,gBAAgB,GACJ,EAAE,EAAE;IAChB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CACxC,CAAC,KAAY,EAAE,EAAE,CACb,cAAc,CAAC,EAAC,IAAI,EAAE,YAAY,EAAE,KAAK,kBAAG,IAAI,EAAE,YAAY,IAAK,KAAK,CAAC,EAAC,CAAC,EAC/E,CAAC,cAAc,CAAC,CACnB,CAAC;IAEF,MAAM,IAAI,GAAG,IAAA,+BAAsB,EAAC,OAAO,CAAC,CAAC;IAE7C,OAAO,CACH,uBAAC,sBAAc,IAAC,MAAM,EAAE,KAAK,YACzB,iCAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,aACvB,+BAAI,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,KAAK,EAAE,IAAI,EAAE,cAAc,EAAE,gBAAgB,EAAC,CAAC,YAC3E,KAAK,GACL,EACJ,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,CAAC;gBACzB,oDAAoD;gBACpD,gCAAoB,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,YAC3D,GAAG,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACjB,uBAAC,6BAAa,IAEV,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,MAAM,CAAC,cAAc,CAAC,EAClD,QAAQ,EAAE,kBAAkB,IAHvB,MAAM,CAAC,cAAc,CAI5B,CACL,CAAC,IARI,QAAQ,CASZ,CACT,CAAC,IACA,GACO,CACpB,CAAC;AACN,CAAC,CAAC;AArCW,QAAA,QAAQ,YAqCnB","sourcesContent":["import * as React from 'react';\n\nimport {MobileProvider} from '@gravity-ui/uikit';\n\nimport {Keyset, i18n} from '../../../../i18n';\nimport {FetchArgs, FiltersConfig, Query, normalizeFiltersToRows} from '../../../../models/common';\nimport {block} from '../../../../utils/cn';\nimport {FilterControl} from '../FilterControl/FilterControl';\n\nimport './Controls.scss';\n\nconst b = block('feed-controls');\n\nexport type ControlsProps = {\n    handleLoadData: (props: FetchArgs) => void;\n    filters?: FiltersConfig;\n    queryParams: Query;\n    title?: string;\n    resetTitleMargin?: boolean;\n};\n\nconst DEFAULT_PAGE = 1;\n\nexport const Controls = ({\n    handleLoadData,\n    filters = [],\n    queryParams,\n    title = i18n(Keyset.Title),\n    resetTitleMargin,\n}: ControlsProps) => {\n    const handleFilterChange = React.useCallback(\n        (query: Query) =>\n            handleLoadData({page: DEFAULT_PAGE, query: {page: DEFAULT_PAGE, ...query}}),\n        [handleLoadData],\n    );\n\n    const rows = normalizeFiltersToRows(filters);\n\n    return (\n        <MobileProvider mobile={false}>\n            <div className={b('header')}>\n                <h1 className={b('header-item', {title: true, 'reset-margin': resetTitleMargin})}>\n                    {title}\n                </h1>\n                {rows.map((row, rowIndex) => (\n                    // eslint-disable-next-line react/no-array-index-key\n                    <div key={rowIndex} className={b('header-item', {filters: true})}>\n                        {row.map((filter) => (\n                            <FilterControl\n                                key={filter.queryParamName}\n                                filter={filter}\n                                initialValue={queryParams?.[filter.queryParamName]}\n                                onChange={handleFilterChange}\n                            />\n                        ))}\n                    </div>\n                ))}\n            </div>\n        </MobileProvider>\n    );\n};\n"]}

package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts

@@ -1,5 +1,4 @@
-import { SelectProps } from '@gravity-ui/uikit';
-import { SelectItem } from "../Controls/Controls.js";
+import { SelectOption, SelectProps } from '@gravity-ui/uikit';
 type RenderControlParameters = Partial<Parameters<Required<SelectProps>['renderControl']>[0]>;
 type TriggerProps = Required<RenderControlParameters>['triggerProps'];
 type A11yKeys = {
@@ -9,7 +8,7 @@ type RenderControlA11yProps = Pick<TriggerProps, A11yKeys>;
 export type CustomSwitcherProps = {
     initial: (string | number | null)[];
     defaultLabel: string;
-    list: SelectItem[];
+    list: SelectOption[];
     controlRef: RenderControlParameters['ref'];
     a11yProps: RenderControlA11yProps;
     qa?: string;

package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomSwitcher.js","sourceRoot":"../../../../../../src","sources":["components/FeedHeader/components/CustomSwitcher/CustomSwitcher.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAAqD;AACrD,6CAA+D;AAE/D,gDAA2C;AAK3C,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,sBAAsB,CAAC,CAAC;AAqBxC,MAAM,SAAS,GAAG,EAAE,CAAC;AAEd,MAAM,cAAc,GAAG,CAAC,EAC3B,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,EAAE,GACgB,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAClC,MAAM,KAAK,GAAG,IAAI;aACb,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAC9C,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEjC,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAClC,MAAM,UAAU,GAAG,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzC,MAAM,gBAAgB,GAAG,IAAA,iBAAS,GAAE,CAAC;IAErC,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,GAAG,EAAE,UAA6C,aAEpF,4DACa,EAAE,EACX,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,EAC9B,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EACxD,SAAS,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,IAC9B,SAAS,uBACI,gBAAgB,IACnC,EACF,gCACI,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,iCAGvD,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,CAAC,IAAI,CAAC,GACrB,EACL,WAAW;gBACR,WAAW,CAAC;oBACR,UAAU,EAAE,GAAG,EAAE,CAAC,uBAAC,YAAI,IAAC,IAAI,EAAE,aAAK,EAAE,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GAAI;iBACjE,CAAC,EACL,UAAU,IAAI,CACX,gCAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,YACxD,UAAU,CAAC,MAAM,GAChB,CACT,EACD,gCAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,CAAC,YACvD,uBAAC,YAAI,IAAC,IAAI,EAAE,mBAAW,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,GAAI,GAC1E,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AA3DW,QAAA,cAAc,kBA2DzB","sourcesContent":["import * as React from 'react';\n\nimport {ChevronDown, Xmark} from '@gravity-ui/icons';\nimport {Icon, SelectProps, useUniqId} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport {SelectItem} from '../Controls/Controls';\n\nimport './CustomSwitcher.scss';\n\nconst b = block('feed-custom-switcher');\n\ntype RenderControlParameters = Partial<Parameters<Required<SelectProps>['renderControl']>[0]>;\ntype TriggerProps = Required<RenderControlParameters>['triggerProps'];\n\ntype A11yKeys = {\n    [K in keyof TriggerProps]-?: K extends `aria-${string}` | 'role' ? K : never;\n}[keyof TriggerProps];\n\ntype RenderControlA11yProps = Pick<TriggerProps, A11yKeys>;\n\nexport type CustomSwitcherProps = {\n    initial: (string | number | null)[];\n    defaultLabel: string;\n    list: SelectItem[];\n    controlRef: RenderControlParameters['ref'];\n    a11yProps: RenderControlA11yProps;\n    qa?: string;\n} & Omit<RenderControlParameters, 'ref'> &\n    Pick<TriggerProps, 'id' | 'disabled' | 'type'>;\n\nconst ICON_SIZE = 12;\n\nexport const CustomSwitcher = ({\n    id,\n    disabled,\n    type,\n    initial,\n    defaultLabel,\n    list,\n    triggerProps,\n    controlRef,\n    renderClear,\n    a11yProps,\n    qa,\n}: CustomSwitcherProps) => {\n    const itemsNames = React.useMemo(() => {\n        const items = list\n            .filter((item) => initial.includes(item.value))\n            .map((item) => item.content);\n\n        return items.length ? items : [defaultLabel];\n    }, [defaultLabel, initial, list]);\n    const hasCounter = itemsNames.length > 1;\n\n    const contentElementId = useUniqId();\n\n    return (\n        <div className={b('custom-switcher')} ref={controlRef as React.LegacyRef<HTMLDivElement>}>\n            {/* eslint-disable-next-line jsx-a11y/role-supports-aria-props */}\n            <button\n                data-qa={qa}\n                id={id}\n                disabled={disabled}\n                type={type}\n                onClick={triggerProps?.onClick}\n                className={b('custom-switcher-element', {overlay: true})}\n                onKeyDown={triggerProps?.onKeyDown}\n                {...a11yProps}\n                aria-labelledby={contentElementId}\n            />\n            <div\n                id={contentElementId}\n                className={b('custom-switcher-element', {content: true})}\n                aria-hidden\n            >\n                {itemsNames?.join(', ')}\n            </div>\n            {renderClear &&\n                renderClear({\n                    renderIcon: () => <Icon data={Xmark} className={b('clear')} />,\n                })}\n            {hasCounter && (\n                <div className={b('custom-switcher-element', {counter: true})}>\n                    {itemsNames.length}\n                </div>\n            )}\n            <div className={b('custom-switcher-element', {arrow: true})}>\n                <Icon data={ChevronDown} size={ICON_SIZE} className={b('switcher-arrow')} />\n            </div>\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"CustomSwitcher.js","sourceRoot":"../../../../../../src","sources":["components/FeedHeader/components/CustomSwitcher/CustomSwitcher.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAAqD;AACrD,6CAA6E;AAE7E,gDAA2C;AAI3C,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,sBAAsB,CAAC,CAAC;AAqBxC,MAAM,SAAS,GAAG,EAAE,CAAC;AAEd,MAAM,cAAc,GAAG,CAAC,EAC3B,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,EAAE,GACgB,EAAE,EAAE;IACtB,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAClC,MAAM,KAAK,GAAG,IAAI;aACb,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAC9C,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEjC,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAClC,MAAM,UAAU,GAAG,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzC,MAAM,gBAAgB,GAAG,IAAA,iBAAS,GAAE,CAAC;IAErC,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,GAAG,EAAE,UAA6C,aAEpF,4DACa,EAAE,EACX,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,EAC9B,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EACxD,SAAS,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,IAC9B,SAAS,uBACI,gBAAgB,IACnC,EACF,gCACI,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,iCAGvD,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,CAAC,IAAI,CAAC,GACrB,EACL,WAAW;gBACR,WAAW,CAAC;oBACR,UAAU,EAAE,GAAG,EAAE,CAAC,uBAAC,YAAI,IAAC,IAAI,EAAE,aAAK,EAAE,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GAAI;iBACjE,CAAC,EACL,UAAU,IAAI,CACX,gCAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,YACxD,UAAU,CAAC,MAAM,GAChB,CACT,EACD,gCAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,CAAC,YACvD,uBAAC,YAAI,IAAC,IAAI,EAAE,mBAAW,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,GAAI,GAC1E,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AA3DW,QAAA,cAAc,kBA2DzB","sourcesContent":["import * as React from 'react';\n\nimport {ChevronDown, Xmark} from '@gravity-ui/icons';\nimport {Icon, SelectOption, SelectProps, useUniqId} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\n\nimport './CustomSwitcher.scss';\n\nconst b = block('feed-custom-switcher');\n\ntype RenderControlParameters = Partial<Parameters<Required<SelectProps>['renderControl']>[0]>;\ntype TriggerProps = Required<RenderControlParameters>['triggerProps'];\n\ntype A11yKeys = {\n    [K in keyof TriggerProps]-?: K extends `aria-${string}` | 'role' ? K : never;\n}[keyof TriggerProps];\n\ntype RenderControlA11yProps = Pick<TriggerProps, A11yKeys>;\n\nexport type CustomSwitcherProps = {\n    initial: (string | number | null)[];\n    defaultLabel: string;\n    list: SelectOption[];\n    controlRef: RenderControlParameters['ref'];\n    a11yProps: RenderControlA11yProps;\n    qa?: string;\n} & Omit<RenderControlParameters, 'ref'> &\n    Pick<TriggerProps, 'id' | 'disabled' | 'type'>;\n\nconst ICON_SIZE = 12;\n\nexport const CustomSwitcher = ({\n    id,\n    disabled,\n    type,\n    initial,\n    defaultLabel,\n    list,\n    triggerProps,\n    controlRef,\n    renderClear,\n    a11yProps,\n    qa,\n}: CustomSwitcherProps) => {\n    const itemsNames = React.useMemo(() => {\n        const items = list\n            .filter((item) => initial.includes(item.value))\n            .map((item) => item.content);\n\n        return items.length ? items : [defaultLabel];\n    }, [defaultLabel, initial, list]);\n    const hasCounter = itemsNames.length > 1;\n\n    const contentElementId = useUniqId();\n\n    return (\n        <div className={b('custom-switcher')} ref={controlRef as React.LegacyRef<HTMLDivElement>}>\n            {/* eslint-disable-next-line jsx-a11y/role-supports-aria-props */}\n            <button\n                data-qa={qa}\n                id={id}\n                disabled={disabled}\n                type={type}\n                onClick={triggerProps?.onClick}\n                className={b('custom-switcher-element', {overlay: true})}\n                onKeyDown={triggerProps?.onKeyDown}\n                {...a11yProps}\n                aria-labelledby={contentElementId}\n            />\n            <div\n                id={contentElementId}\n                className={b('custom-switcher-element', {content: true})}\n                aria-hidden\n            >\n                {itemsNames?.join(', ')}\n            </div>\n            {renderClear &&\n                renderClear({\n                    renderIcon: () => <Icon data={Xmark} className={b('clear')} />,\n                })}\n            {hasCounter && (\n                <div className={b('custom-switcher-element', {counter: true})}>\n                    {itemsNames.length}\n                </div>\n            )}\n            <div className={b('custom-switcher-element', {arrow: true})}>\n                <Icon data={ChevronDown} size={ICON_SIZE} className={b('switcher-arrow')} />\n            </div>\n        </div>\n    );\n};\n"]}

package/build/cjs/components/FeedHeader/components/FilterControl/FilterControl.css

@@ -0,0 +1,19 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.bc-filter-control {
+  margin-right: 8px;
+  margin-left: 8px;
+  margin-bottom: 12px;
+  min-width: 230px;
+  flex-grow: 1;
+}
+@media (min-width: 577px) {
+  .bc-filter-control {
+    max-width: 240px;
+  }
+}
+.bc-filter-control_width-auto {
+  width: auto;
+  min-width: auto;
+  flex-grow: 0;
+}

package/build/cjs/components/FeedHeader/components/FilterControl/FilterControl.d.ts

@@ -0,0 +1,7 @@
+import { FilterConfig, Query } from "../../../../models/common.js";
+export type FilterControlProps = {
+    filter: FilterConfig;
+    initialValue: string | number | null | undefined;
+    onChange: (query: Query) => void;
+};
+export declare const FilterControl: ({ filter, initialValue, onChange }: FilterControlProps) => import("react/jsx-runtime").JSX.Element | null;

package/build/cjs/components/FeedHeader/components/FilterControl/FilterControl.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilterControl = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = tslib_1.__importStar(require("react"));
+const page_constructor_1 = require("@gravity-ui/page-constructor");
+const LikesContext_1 = require("../../../../contexts/LikesContext.js");
+const cn_1 = require("../../../../utils/cn.js");
+const SavedOnlyFilter_1 = require("../SavedOnlyFilter/SavedOnlyFilter.js");
+const SearchFilter_1 = require("../SearchFilter/SearchFilter.js");
+const SelectFilter_1 = require("../SelectFilter/SelectFilter.js");
+const b = (0, cn_1.block)('filter-control');
+const FilterControl = ({ filter, initialValue, onChange }) => {
+    const handleAnalytics = (0, page_constructor_1.useAnalytics)();
+    const { hasLikes } = React.useContext(LikesContext_1.LikesContext);
+    const handleChange = React.useCallback((query) => {
+        if (filter.analyticsEvents) {
+            handleAnalytics(filter.analyticsEvents);
+        }
+        onChange(query);
+    }, [filter.analyticsEvents, handleAnalytics, onChange]);
+    if (filter.type === 'search') {
+        const { queryParamName, placeholder } = filter;
+        return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(SearchFilter_1.SearchFilter, { placeholder: placeholder, initialValue: initialValue, onChange: (value) => handleChange({ [queryParamName]: value }) }) }));
+    }
+    if (filter.type === 'savedOnly') {
+        const { queryParamName } = filter;
+        if (!hasLikes) {
+            return null;
+        }
+        return ((0, jsx_runtime_1.jsx)("div", { className: b({ 'width-auto': true }), children: (0, jsx_runtime_1.jsx)(SavedOnlyFilter_1.SavedOnlyFilter, { initialValue: initialValue === 'true', onChange: (value) => handleChange({ [queryParamName]: value ? 'true' : '', search: '' }) }) }));
+    }
+    const { queryParamName, multiple, filterable, hasClear, placeholder, options, allLabel, qa } = filter;
+    return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(SelectFilter_1.SelectFilter, { multiple: multiple, filterable: filterable, hasClear: hasClear, placeholder: placeholder, options: options, allLabel: allLabel, qa: qa, initialValue: initialValue, onChange: (value) => handleChange({ [queryParamName]: value }) }) }));
+};
+exports.FilterControl = FilterControl;
+//# sourceMappingURL=FilterControl.js.map

package/build/cjs/components/FeedHeader/components/FilterControl/FilterControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterControl.js","sourceRoot":"../../../../../../src","sources":["components/FeedHeader/components/FilterControl/FilterControl.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,mEAA0D;AAE1D,uEAA+D;AAQ/D,gDAA2C;AAC3C,2EAAmE;AACnE,kEAA0D;AAC1D,kEAA0D;AAI1D,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,gBAAgB,CAAC,CAAC;AAQ3B,MAAM,aAAa,GAAG,CAAC,EAAC,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAqB,EAAE,EAAE;IAClF,MAAM,eAAe,GAAG,IAAA,+BAAY,GAAE,CAAC;IACvC,MAAM,EAAC,QAAQ,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,2BAAY,CAAC,CAAC;IAElD,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAClC,CAAC,KAAY,EAAE,EAAE;QACb,IAAI,MAAM,CAAC,eAAe,EAAE,CAAC;YACzB,eAAe,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;QAC5C,CAAC;QACD,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpB,CAAC,EACD,CAAC,MAAM,CAAC,eAAe,EAAE,eAAe,EAAE,QAAQ,CAAC,CACtD,CAAC;IAEF,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC3B,MAAM,EAAC,cAAc,EAAE,WAAW,EAAC,GAAG,MAA4B,CAAC;QACnE,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,2BAAY,IACT,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAkC,EAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,EAAC,CAAC,cAAc,CAAC,EAAE,KAAK,EAAU,CAAC,GACvE,GACA,CACT,CAAC;IACN,CAAC;IAED,IAAI,MAAM,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;QAC9B,MAAM,EAAC,cAAc,EAAC,GAAG,MAA+B,CAAC;QAEzD,IAAI,CAAC,QAAQ,EAAE,CAAC;YACZ,OAAO,IAAI,CAAC;QAChB,CAAC;QAED,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,YAAY,EAAE,IAAI,EAAC,CAAC,YACnC,uBAAC,iCAAe,IACZ,YAAY,EAAE,YAAY,KAAK,MAAM,EACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAChB,YAAY,CAAC,EAAC,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAU,CAAC,GAEhF,GACA,CACT,CAAC;IACN,CAAC;IAED,MAAM,EAAC,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAC,GACtF,MAA4B,CAAC;IAEjC,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,2BAAY,IACT,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAiC,EAC9C,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,EAAE,EACN,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,EAAC,CAAC,cAAc,CAAC,EAAE,KAAK,EAAU,CAAC,GACvE,GACA,CACT,CAAC;AACN,CAAC,CAAC;AAhEW,QAAA,aAAa,iBAgExB","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '@gravity-ui/page-constructor';\n\nimport {LikesContext} from '../../../../contexts/LikesContext';\nimport {\n    FilterConfig,\n    Query,\n    SavedOnlyFilterConfig,\n    SearchFilterConfig,\n    SelectFilterConfig,\n} from '../../../../models/common';\nimport {block} from '../../../../utils/cn';\nimport {SavedOnlyFilter} from '../SavedOnlyFilter/SavedOnlyFilter';\nimport {SearchFilter} from '../SearchFilter/SearchFilter';\nimport {SelectFilter} from '../SelectFilter/SelectFilter';\n\nimport './FilterControl.scss';\n\nconst b = block('filter-control');\n\nexport type FilterControlProps = {\n    filter: FilterConfig;\n    initialValue: string | number | null | undefined;\n    onChange: (query: Query) => void;\n};\n\nexport const FilterControl = ({filter, initialValue, onChange}: FilterControlProps) => {\n    const handleAnalytics = useAnalytics();\n    const {hasLikes} = React.useContext(LikesContext);\n\n    const handleChange = React.useCallback(\n        (query: Query) => {\n            if (filter.analyticsEvents) {\n                handleAnalytics(filter.analyticsEvents);\n            }\n            onChange(query);\n        },\n        [filter.analyticsEvents, handleAnalytics, onChange],\n    );\n\n    if (filter.type === 'search') {\n        const {queryParamName, placeholder} = filter as SearchFilterConfig;\n        return (\n            <div className={b()}>\n                <SearchFilter\n                    placeholder={placeholder}\n                    initialValue={initialValue as string | undefined}\n                    onChange={(value) => handleChange({[queryParamName]: value} as Query)}\n                />\n            </div>\n        );\n    }\n\n    if (filter.type === 'savedOnly') {\n        const {queryParamName} = filter as SavedOnlyFilterConfig;\n\n        if (!hasLikes) {\n            return null;\n        }\n\n        return (\n            <div className={b({'width-auto': true})}>\n                <SavedOnlyFilter\n                    initialValue={initialValue === 'true'}\n                    onChange={(value) =>\n                        handleChange({[queryParamName]: value ? 'true' : '', search: ''} as Query)\n                    }\n                />\n            </div>\n        );\n    }\n\n    const {queryParamName, multiple, filterable, hasClear, placeholder, options, allLabel, qa} =\n        filter as SelectFilterConfig;\n\n    return (\n        <div className={b()}>\n            <SelectFilter\n                multiple={multiple}\n                filterable={filterable}\n                hasClear={hasClear}\n                placeholder={placeholder as string | undefined}\n                options={options}\n                allLabel={allLabel}\n                qa={qa}\n                initialValue={initialValue}\n                onChange={(value) => handleChange({[queryParamName]: value} as Query)}\n            />\n        </div>\n    );\n};\n"]}