@gravity-ui/page-constructor 8.4.1 → 8.5.0-alpha.0

package/build/esm/blocks/FilterBlock/FilterBlock.js

@@ -1,20 +1,46 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { CardLayoutBlock } from "../index.js";
 import { AnimateBlock, Title } from "../../components/index.js";
 import ButtonTabs from "../../components/ButtonTabs/ButtonTabs.js";
 import { ConstructorItem } from "../../containers/PageConstructor/components/ConstructorItem/index.js";
-import { Col, Row } from "../../grid/index.js";
+import { Col, Grid, Row } from "../../gravity-blocks/grid/index.js";
+import { useAnalytics } from "../../gravity-blocks/hooks/index.js";
 import { block, getBlockKey } from "../../utils/index.js";
+import { default as CardLayoutBlock } from "../CardLayout/CardLayout.js";
 import { i18n } from "./i18n/index.js";
 import './FilterBlock.css';
 const b = block('filter-block');
-const FilterBlock = ({ title, description, tags, tagButtonSize, allTag, items, colSizes, centered, animated, }) => {
+const FilterBlock = ({ title, description, tags, tagButtonSize, allTag, items = [], colSizes, centered, animated, }) => {
+    const handleAnalytics = useAnalytics();
     const tabButtons = React.useMemo(() => {
-        const allButton = allTag
-            ? { id: null, title: typeof allTag === 'boolean' ? i18n('label-all-tag') : allTag }
-            : undefined;
-        const otherButtons = tags && tags.map((tag) => ({ id: tag.id, title: tag.label }));
+        let allButton;
+        if (allTag) {
+            if (typeof allTag === 'boolean') {
+                allButton = {
+                    id: null,
+                    title: i18n('label-all-tag'),
+                };
+            }
+            else if (typeof allTag === 'string') {
+                allButton = {
+                    id: null,
+                    title: allTag,
+                };
+            }
+            else if (typeof allTag === 'object') {
+                allButton = {
+                    id: null,
+                    title: allTag.label,
+                    analyticsEvent: allTag.analyticsEvent,
+                };
+            }
+        }
+        const otherButtons = tags &&
+            tags.map((tag) => ({
+                id: tag.id,
+                title: tag.label,
+                analyticsEvent: tag.analyticsEvent,
+            }));
         return [...(allButton ? [allButton] : []), ...(otherButtons ? otherButtons : [])];
     }, [allTag, tags]);
     const [selectedTag, setSelectedTag] = React.useState(tabButtons.length ? tabButtons[0].id : null);
@@ -29,10 +55,17 @@ const FilterBlock = ({ title, description, tags, tagButtonSize, allTag, items, c
             : items;
         return itemsToShow.map((item) => item.card);
     }, [actualTag, items]);
-    return (_jsxs(AnimateBlock, { className: b(), animate: animated, children: [title && (_jsx(Title, { className: b('title', { centered: centered }), title: title, subtitle: description })), tabButtons.length && (_jsx(Row, { children: _jsx(Col, { children: _jsx(ButtonTabs, { className: b('tabs', { centered: centered }), items: tabButtons, activeTab: selectedTag, onSelectTab: setSelectedTag, tabSize: tagButtonSize }) }) })), _jsx(Row, { className: b('block-container'), children: _jsx(CardLayoutBlock, { title: "", colSizes: colSizes, className: b('cards-container'), children: cards.map((card, index) => {
-                        const key = getBlockKey(card, index);
-                        return _jsx(ConstructorItem, { data: card, blockKey: key }, key);
-                    }) }) })] }));
+    const handleSelectTab = React.useCallback((tabId) => {
+        setSelectedTag(tabId);
+        const tabButton = tabButtons.find((tab) => tab.id === tabId);
+        if (tabButton?.analyticsEvent) {
+            handleAnalytics(tabButton.analyticsEvent);
+        }
+    }, [tabButtons, handleAnalytics]);
+    return (_jsx(AnimateBlock, { className: b(), animate: animated, children: _jsxs(Grid, { children: [title && (_jsx(Title, { className: b('title', { centered: centered }), title: title, subtitle: description })), tabButtons.length && (_jsx(Row, { children: _jsx(Col, { children: _jsx(ButtonTabs, { className: b('tabs', { centered: centered }), items: tabButtons, activeTab: selectedTag, onSelectTab: handleSelectTab, tabSize: tagButtonSize }) }) })), _jsx(Row, { className: b('block-container'), children: _jsx(CardLayoutBlock, { title: "", colSizes: colSizes, className: b('cards-container'), children: cards.map((card, index) => {
+                            const key = getBlockKey(card, index);
+                            return _jsx(ConstructorItem, { data: card, blockKey: index }, key);
+                        }) }) })] }) }));
 };
 export default FilterBlock;
 //# sourceMappingURL=FilterBlock.js.map

package/build/esm/blocks/FilterBlock/FilterBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBlock.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/FilterBlock.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {CardLayoutBlock} from '..';\nimport {AnimateBlock, Title} from '../../components';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport {ConstructorItem} from '../../containers/PageConstructor/components/ConstructorItem';\nimport {Col, Row} from '../../grid';\nimport {FilterBlockProps, FilterItem} from '../../models';\nimport {block, getBlockKey} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './FilterBlock.scss';\n\nconst b = block('filter-block');\n\nconst FilterBlock = ({\n    title,\n    description,\n    tags,\n    tagButtonSize,\n    allTag,\n    items,\n    colSizes,\n    centered,\n    animated,\n}: FilterBlockProps) => {\n    const tabButtons = React.useMemo(() => {\n        const allButton: ButtonTabsItemProps | undefined = allTag\n            ? {id: null, title: typeof allTag === 'boolean' ? i18n('label-all-tag') : allTag}\n            : undefined;\n        const otherButtons: ButtonTabsItemProps[] | undefined =\n            tags && tags.map((tag) => ({id: tag.id, title: tag.label}));\n        return [...(allButton ? [allButton] : []), ...(otherButtons ? otherButtons : [])];\n    }, [allTag, tags]);\n\n    const [selectedTag, setSelectedTag] = React.useState(\n        tabButtons.length ? tabButtons[0].id : null,\n    );\n\n    const actualTag: string | null = React.useMemo(() => {\n        return tabButtons.length && !tabButtons.find((tab) => tab.id === selectedTag)\n            ? tabButtons[0].id\n            : selectedTag;\n    }, [tabButtons, selectedTag]);\n\n    const cards = React.useMemo(() => {\n        const itemsToShow: FilterItem[] = actualTag\n            ? items.filter((item) => item.tags.includes(actualTag))\n            : items;\n\n        return itemsToShow.map((item) => item.card);\n    }, [actualTag, items]);\n\n    return (\n        <AnimateBlock className={b()} animate={animated}>\n            {title && (\n                <Title\n                    className={b('title', {centered: centered})}\n                    title={title}\n                    subtitle={description}\n                />\n            )}\n            {tabButtons.length && (\n                <Row>\n                    <Col>\n                        <ButtonTabs\n                            className={b('tabs', {centered: centered})}\n                            items={tabButtons}\n                            activeTab={selectedTag}\n                            onSelectTab={setSelectedTag}\n                            tabSize={tagButtonSize}\n                        />\n                    </Col>\n                </Row>\n            )}\n            <Row className={b('block-container')}>\n                <CardLayoutBlock title=\"\" colSizes={colSizes} className={b('cards-container')}>\n                    {cards.map((card, index) => {\n                        const key = getBlockKey(card, index);\n\n                        return <ConstructorItem data={card} blockKey={key} key={key} />;\n                    })}\n                </CardLayoutBlock>\n            </Row>\n        </AnimateBlock>\n    );\n};\nexport default FilterBlock;\n"]}
+{"version":3,"file":"FilterBlock.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/FilterBlock.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {AnimateBlock, Title} from '../../components';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport {ConstructorItem} from '../../containers/PageConstructor/components/ConstructorItem';\nimport {Col, Grid, Row} from '../../gravity-blocks/grid';\nimport {useAnalytics} from '../../gravity-blocks/hooks';\nimport {FilterBlockProps, FilterItem} from '../../models';\nimport {block, getBlockKey} from '../../utils';\nimport {default as CardLayoutBlock} from '../CardLayout/CardLayout';\n\nimport {i18n} from './i18n';\n\nimport './FilterBlock.scss';\n\nconst b = block('filter-block');\n\nconst FilterBlock = ({\n    title,\n    description,\n    tags,\n    tagButtonSize,\n    allTag,\n    items = [],\n    colSizes,\n    centered,\n    animated,\n}: FilterBlockProps) => {\n    const handleAnalytics = useAnalytics();\n    const tabButtons = React.useMemo(() => {\n        let allButton: ButtonTabsItemProps | undefined;\n        if (allTag) {\n            if (typeof allTag === 'boolean') {\n                allButton = {\n                    id: null,\n                    title: i18n('label-all-tag'),\n                };\n            } else if (typeof allTag === 'string') {\n                allButton = {\n                    id: null,\n                    title: allTag,\n                };\n            } else if (typeof allTag === 'object') {\n                allButton = {\n                    id: null,\n                    title: allTag.label,\n                    analyticsEvent: allTag.analyticsEvent,\n                };\n            }\n        }\n        const otherButtons: ButtonTabsItemProps[] | undefined =\n            tags &&\n            tags.map((tag) => ({\n                id: tag.id,\n                title: tag.label,\n                analyticsEvent: tag.analyticsEvent,\n            }));\n        return [...(allButton ? [allButton] : []), ...(otherButtons ? otherButtons : [])];\n    }, [allTag, tags]);\n\n    const [selectedTag, setSelectedTag] = React.useState(\n        tabButtons.length ? tabButtons[0].id : null,\n    );\n\n    const actualTag: string | null = React.useMemo(() => {\n        return tabButtons.length && !tabButtons.find((tab) => tab.id === selectedTag)\n            ? tabButtons[0].id\n            : selectedTag;\n    }, [tabButtons, selectedTag]);\n\n    const cards = React.useMemo(() => {\n        const itemsToShow: FilterItem[] = actualTag\n            ? items.filter((item) => item.tags.includes(actualTag))\n            : items;\n\n        return itemsToShow.map((item) => item.card);\n    }, [actualTag, items]);\n\n    const handleSelectTab = React.useCallback(\n        (tabId: string | null) => {\n            setSelectedTag(tabId);\n\n            const tabButton = tabButtons.find((tab) => tab.id === tabId);\n            if (tabButton?.analyticsEvent) {\n                handleAnalytics(tabButton.analyticsEvent);\n            }\n        },\n        [tabButtons, handleAnalytics],\n    );\n\n    return (\n        <AnimateBlock className={b()} animate={animated}>\n            <Grid>\n                {title && (\n                    <Title\n                        className={b('title', {centered: centered})}\n                        title={title}\n                        subtitle={description}\n                    />\n                )}\n                {tabButtons.length && (\n                    <Row>\n                        <Col>\n                            <ButtonTabs\n                                className={b('tabs', {centered: centered})}\n                                items={tabButtons}\n                                activeTab={selectedTag}\n                                onSelectTab={handleSelectTab}\n                                tabSize={tagButtonSize}\n                            />\n                        </Col>\n                    </Row>\n                )}\n                <Row className={b('block-container')}>\n                    <CardLayoutBlock title=\"\" colSizes={colSizes} className={b('cards-container')}>\n                        {cards.map((card, index) => {\n                            const key = getBlockKey(card, index);\n                            return <ConstructorItem data={card} blockKey={index} key={key} />;\n                        })}\n                    </CardLayoutBlock>\n                </Row>\n            </Grid>\n        </AnimateBlock>\n    );\n};\nexport default FilterBlock;\n"]}

package/build/esm/blocks/FilterBlock/i18n/index.d.ts

@@ -1,4 +1,12 @@
 export declare const i18n: ((key: "label-all-tag", params?: import("@gravity-ui/i18n").Params) => string) & {
+    Translation: import("react").ComponentType<{
+        children: (props: {
+            t: (key: "label-all-tag", params?: import("@gravity-ui/i18n").Params) => string;
+        }) => React.ReactNode;
+    }>;
+    useTranslation: () => {
+        t: (key: "label-all-tag", params?: import("@gravity-ui/i18n").Params) => string;
+    };
     keysetData: {
         "pc-FilterBlock": Record<"label-all-tag", import("@gravity-ui/i18n").KeyData>;
     };

package/build/esm/blocks/FilterBlock/index.d.ts

@@ -0,0 +1,30 @@
+declare const FilterBlockConfig: {
+    type: string;
+    component: ({ title, description, tags, tagButtonSize, allTag, items, colSizes, centered, animated, }: import("../../index.js").FilterBlockProps) => import("react/jsx-runtime").JSX.Element;
+    schema: {
+        name: string;
+        group: string;
+        inputs: import("../../form-generator-v2/types.js").Fields;
+        default: {
+            allTag: boolean;
+            description: string;
+            items: {
+                card: {
+                    content: {
+                        title: string;
+                        text: string;
+                    };
+                    type: string;
+                };
+                tags: string[];
+            }[];
+            tags: {
+                id: string;
+                label: string;
+            }[];
+            title: string;
+            type: string;
+        };
+    };
+};
+export default FilterBlockConfig;

package/build/esm/blocks/FilterBlock/index.js

@@ -0,0 +1,97 @@
+import { generateFormFieldsFromAjvSchema } from "../../form-generator-v2/utils/generateFormFieldsFromAjv.js";
+import FilterBlock from "./FilterBlock.js";
+import { FilterProps } from "./schema.js";
+const FilterBlockConfig = {
+    type: '@gravity-ui/page-constructor/filter-block',
+    component: FilterBlock,
+    schema: {
+        name: 'Filter Block',
+        group: '@gravity-ui/page-constructor/Blocks',
+        // TODO: change to custom block schema
+        inputs: generateFormFieldsFromAjvSchema(FilterProps),
+        default: {
+            allTag: true,
+            description: 'Three cards in a row on the desktop, two cards in a row on a tablet, one card in a row on a mobile phone.',
+            items: [
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 1',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['one'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 2',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['two'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 3',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['three'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 4',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['one'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 5',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['two'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 6',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['three'],
+                },
+            ],
+            tags: [
+                {
+                    id: 'one',
+                    label: 'First very long label',
+                },
+                {
+                    id: 'two',
+                    label: 'Second very long label',
+                },
+                {
+                    id: 'three',
+                    label: 'Third very long label',
+                },
+            ],
+            title: 'Card Layout',
+            type: 'filter-block',
+        },
+    },
+};
+export default FilterBlockConfig;
+//# sourceMappingURL=index.js.map

package/build/esm/blocks/FilterBlock/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,+BAA+B,EAAC,mEAAgE;AAExG,OAAO,WAAW,yBAAsB;AACxC,OAAO,EAAC,WAAW,EAAC,oBAAiB;AAErC,MAAM,iBAAiB,GAAG;IACtB,IAAI,EAAE,2CAA2C;IACjD,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE;QACJ,IAAI,EAAE,cAAc;QACpB,KAAK,EAAE,qCAAqC;QAC5C,sCAAsC;QACtC,MAAM,EAAE,+BAA+B,CAAC,WAA4C,CAAC;QACrF,OAAO,EAAE;YACL,MAAM,EAAE,IAAI;YACZ,WAAW,EACP,2GAA2G;YAC/G,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,OAAO,CAAC;iBAClB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,OAAO,CAAC;iBAClB;aACJ;YACD,IAAI,EAAE;gBACF;oBACI,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,uBAAuB;iBACjC;gBACD;oBACI,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,wBAAwB;iBAClC;gBACD;oBACI,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,uBAAuB;iBACjC;aACJ;YACD,KAAK,EAAE,aAAa;YACpB,IAAI,EAAE,cAAc;SACvB;KACJ;CACJ,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import {JSONSchemaType} from 'ajv';\n\nimport {generateFormFieldsFromAjvSchema} from '../../form-generator-v2/utils/generateFormFieldsFromAjv';\n\nimport FilterBlock from './FilterBlock';\nimport {FilterProps} from './schema';\n\nconst FilterBlockConfig = {\n    type: '@gravity-ui/page-constructor/filter-block',\n    component: FilterBlock,\n    schema: {\n        name: 'Filter Block',\n        group: '@gravity-ui/page-constructor/Blocks',\n        // TODO: change to custom block schema\n        inputs: generateFormFieldsFromAjvSchema(FilterProps as unknown as JSONSchemaType<{}>),\n        default: {\n            allTag: true,\n            description:\n                'Three cards in a row on the desktop, two cards in a row on a tablet, one card in a row on a mobile phone.',\n            items: [\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 1',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['one'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 2',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['two'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 3',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['three'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 4',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['one'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 5',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['two'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 6',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['three'],\n                },\n            ],\n            tags: [\n                {\n                    id: 'one',\n                    label: 'First very long label',\n                },\n                {\n                    id: 'two',\n                    label: 'Second very long label',\n                },\n                {\n                    id: 'three',\n                    label: 'Third very long label',\n                },\n            ],\n            title: 'Card Layout',\n            type: 'filter-block',\n        },\n    },\n};\n\nexport default FilterBlockConfig;\n"]}

package/build/esm/blocks/FilterBlock/index_deprecated.d.ts

@@ -0,0 +1,31 @@
+declare const FilterBlockConfig: {
+    type: string;
+    component: ({ title, description, tags, tagButtonSize, allTag, items, colSizes, centered, animated, }: import("../../index.js").FilterBlockProps) => import("react/jsx-runtime").JSX.Element;
+    schema: {
+        name: string;
+        group: string;
+        hidden: boolean;
+        inputs: import("../../form-generator-v2/types.js").Fields;
+        default: {
+            allTag: boolean;
+            description: string;
+            items: {
+                card: {
+                    content: {
+                        title: string;
+                        text: string;
+                    };
+                    type: string;
+                };
+                tags: string[];
+            }[];
+            tags: {
+                id: string;
+                label: string;
+            }[];
+            title: string;
+            type: string;
+        };
+    };
+};
+export default FilterBlockConfig;

package/build/esm/blocks/FilterBlock/index_deprecated.js

@@ -0,0 +1,97 @@
+import { generateFormFieldsFromAjvSchema } from "../../form-generator-v2/utils/generateFormFieldsFromAjv.js";
+import FilterBlock from "./FilterBlock.js";
+import { FilterProps } from "./schema.js";
+const FilterBlockConfig = {
+    type: 'filter-block',
+    component: FilterBlock,
+    schema: {
+        name: 'Filter Block',
+        group: '@deprecated',
+        hidden: true,
+        inputs: generateFormFieldsFromAjvSchema(FilterProps),
+        default: {
+            allTag: true,
+            description: 'Three cards in a row on the desktop, two cards in a row on a tablet, one card in a row on a mobile phone.',
+            items: [
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 1',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['one'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 2',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['two'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 3',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['three'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 4',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['one'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 5',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['two'],
+                },
+                {
+                    card: {
+                        content: {
+                            title: 'Layout Item 6',
+                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+                        },
+                        type: 'layout-item',
+                    },
+                    tags: ['three'],
+                },
+            ],
+            tags: [
+                {
+                    id: 'one',
+                    label: 'First very long label',
+                },
+                {
+                    id: 'two',
+                    label: 'Second very long label',
+                },
+                {
+                    id: 'three',
+                    label: 'Third very long label',
+                },
+            ],
+            title: 'Card Layout',
+            type: 'filter-block',
+        },
+    },
+};
+export default FilterBlockConfig;
+//# sourceMappingURL=index_deprecated.js.map

package/build/esm/blocks/FilterBlock/index_deprecated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index_deprecated.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/index_deprecated.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,+BAA+B,EAAC,mEAAgE;AAExG,OAAO,WAAW,yBAAsB;AACxC,OAAO,EAAC,WAAW,EAAC,oBAAiB;AAErC,MAAM,iBAAiB,GAAG;IACtB,IAAI,EAAE,cAAc;IACpB,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE;QACJ,IAAI,EAAE,cAAc;QACpB,KAAK,EAAE,aAAa;QACpB,MAAM,EAAE,IAAI;QACZ,MAAM,EAAE,+BAA+B,CAAC,WAA4C,CAAC;QACrF,OAAO,EAAE;YACL,MAAM,EAAE,IAAI;YACZ,WAAW,EACP,2GAA2G;YAC/G,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,OAAO,CAAC;iBAClB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,KAAK,CAAC;iBAChB;gBACD;oBACI,IAAI,EAAE;wBACF,OAAO,EAAE;4BACL,KAAK,EAAE,eAAe;4BACtB,IAAI,EAAE,6HAA6H;yBACtI;wBACD,IAAI,EAAE,aAAa;qBACtB;oBACD,IAAI,EAAE,CAAC,OAAO,CAAC;iBAClB;aACJ;YACD,IAAI,EAAE;gBACF;oBACI,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,uBAAuB;iBACjC;gBACD;oBACI,EAAE,EAAE,KAAK;oBACT,KAAK,EAAE,wBAAwB;iBAClC;gBACD;oBACI,EAAE,EAAE,OAAO;oBACX,KAAK,EAAE,uBAAuB;iBACjC;aACJ;YACD,KAAK,EAAE,aAAa;YACpB,IAAI,EAAE,cAAc;SACvB;KACJ;CACJ,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import {JSONSchemaType} from 'ajv';\n\nimport {generateFormFieldsFromAjvSchema} from '../../form-generator-v2/utils/generateFormFieldsFromAjv';\n\nimport FilterBlock from './FilterBlock';\nimport {FilterProps} from './schema';\n\nconst FilterBlockConfig = {\n    type: 'filter-block',\n    component: FilterBlock,\n    schema: {\n        name: 'Filter Block',\n        group: '@deprecated',\n        hidden: true,\n        inputs: generateFormFieldsFromAjvSchema(FilterProps as unknown as JSONSchemaType<{}>),\n        default: {\n            allTag: true,\n            description:\n                'Three cards in a row on the desktop, two cards in a row on a tablet, one card in a row on a mobile phone.',\n            items: [\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 1',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['one'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 2',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['two'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 3',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['three'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 4',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['one'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 5',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['two'],\n                },\n                {\n                    card: {\n                        content: {\n                            title: 'Layout Item 6',\n                            text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',\n                        },\n                        type: 'layout-item',\n                    },\n                    tags: ['three'],\n                },\n            ],\n            tags: [\n                {\n                    id: 'one',\n                    label: 'First very long label',\n                },\n                {\n                    id: 'two',\n                    label: 'Second very long label',\n                },\n                {\n                    id: 'three',\n                    label: 'Third very long label',\n                },\n            ],\n            title: 'Card Layout',\n            type: 'filter-block',\n        },\n    },\n};\n\nexport default FilterBlockConfig;\n"]}

package/build/esm/blocks/FilterBlock/schema.d.ts

@@ -1,4 +1,5 @@
 export declare const FilterTagProps: {
+    type: string;
     additionalProperties: boolean;
     required: string[];
     properties: {
@@ -8,6 +9,43 @@ export declare const FilterTagProps: {
         label: {
             type: string;
         };
+        analyticsEvent: {
+            type: string;
+            additionalProperties: {
+                type: string;
+            };
+            required: string[];
+            properties: {
+                name: {
+                    type: string;
+                };
+                type: {
+                    type: string;
+                };
+                counters: {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: never[];
+                    properties: {
+                        include: {
+                            type: string;
+                            items: {
+                                type: string;
+                            };
+                        };
+                        exclude: {
+                            type: string;
+                            items: {
+                                type: string;
+                            };
+                        };
+                    };
+                };
+                context: {
+                    type: string;
+                };
+            };
+        };
     };
 };
 export declare const FilterItemProps: {
@@ -30,10 +68,60 @@ export declare const FilterProps: {
     required: string[];
     properties: {
         allTag: {
-            oneOf: {
+            oneOf: ({
                 type: string;
                 optionName: string;
-            }[];
+            } | {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    id: {
+                        type: string;
+                    };
+                    label: {
+                        type: string;
+                    };
+                    analyticsEvent: {
+                        type: string;
+                        additionalProperties: {
+                            type: string;
+                        };
+                        required: string[];
+                        properties: {
+                            name: {
+                                type: string;
+                            };
+                            type: {
+                                type: string;
+                            };
+                            counters: {
+                                type: string;
+                                additionalProperties: boolean;
+                                required: never[];
+                                properties: {
+                                    include: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                    exclude: {
+                                        type: string;
+                                        items: {
+                                            type: string;
+                                        };
+                                    };
+                                };
+                            };
+                            context: {
+                                type: string;
+                            };
+                        };
+                    };
+                };
+                optionName?: undefined;
+            })[];
         };
         colSizes: {
             type: string;
@@ -236,10 +324,60 @@ export declare const FilterBlock: {
         required: string[];
         properties: {
             allTag: {
-                oneOf: {
+                oneOf: ({
                     type: string;
                     optionName: string;
-                }[];
+                } | {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        id: {
+                            type: string;
+                        };
+                        label: {
+                            type: string;
+                        };
+                        analyticsEvent: {
+                            type: string;
+                            additionalProperties: {
+                                type: string;
+                            };
+                            required: string[];
+                            properties: {
+                                name: {
+                                    type: string;
+                                };
+                                type: {
+                                    type: string;
+                                };
+                                counters: {
+                                    type: string;
+                                    additionalProperties: boolean;
+                                    required: never[];
+                                    properties: {
+                                        include: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                        };
+                                        exclude: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                        };
+                                    };
+                                };
+                                context: {
+                                    type: string;
+                                };
+                            };
+                        };
+                    };
+                    optionName?: undefined;
+                })[];
             };
             colSizes: {
                 type: string;

package/build/esm/blocks/FilterBlock/schema.js

@@ -1,6 +1,8 @@
-import { AnimatableProps, BlockBaseProps, BlockHeaderProps, containerSizesObject, } from "../../schema/validators/common.js";
-import { filteredArray } from "../../schema/validators/utils.js";
+import { AnimatableProps, BlockBaseProps, BlockHeaderProps, containerSizesObject, } from "../../gravity-blocks/schema/validators/common.js";
+import { AnalyticsEventSchema } from "../../gravity-blocks/schema/validators/event.js";
+import { filteredArray } from "../../gravity-blocks/schema/validators/utils.js";
 export const FilterTagProps = {
+    type: 'object',
     additionalProperties: false,
     required: ['id', 'label'],
     properties: {
@@ -10,6 +12,7 @@ export const FilterTagProps = {
         label: {
             type: 'string',
         },
+        analyticsEvent: AnalyticsEventSchema,
     },
 };
 export const FilterItemProps = {
@@ -42,6 +45,9 @@ export const FilterProps = {
                     type: 'string',
                     optionName: 'cutom',
                 },
+                {
+                    ...FilterTagProps,
+                },
             ],
         },
         colSizes: containerSizesObject,

package/build/esm/blocks/FilterBlock/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,oBAAoB,GACvB,0CAAuC;AACxC,OAAO,EAAC,aAAa,EAAC,yCAAsC;AAE5D,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC;IACzB,UAAU,EAAE;QACR,EAAE,EAAE;YACA,IAAI,EAAE,QAAQ;SACjB;QACD,KAAK,EAAE;YACH,IAAI,EAAE,QAAQ;SACjB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC3B,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE;QACR,IAAI,EAAE;YACF,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;aACjB;SACJ;QACD,IAAI,EAAE,EAAC,IAAI,EAAE,yBAAyB,EAAC;KAC1C;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC;IAC3B,UAAU,EAAE;QACR,GAAG,cAAc;QACjB,GAAG,eAAe;QAClB,GAAG,gBAAgB;QACnB,MAAM,EAAE;YACJ,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,SAAS;oBACf,UAAU,EAAE,MAAM;iBACrB;gBACD;oBACI,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,OAAO;iBACtB;aACJ;SACJ;QACD,QAAQ,EAAE,oBAAoB;QAC9B,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC;QACnC,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC;QACrC,aAAa,EAAE;YACX,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC;SAC9B;QACD,QAAQ,EAAE,EAAC,IAAI,EAAE,SAAS,EAAC;KAC9B;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,cAAc,EAAE,WAAW;CAC9B,CAAC","sourcesContent":["import {\n    AnimatableProps,\n    BlockBaseProps,\n    BlockHeaderProps,\n    containerSizesObject,\n} from '../../schema/validators/common';\nimport {filteredArray} from '../../schema/validators/utils';\n\nexport const FilterTagProps = {\n    additionalProperties: false,\n    required: ['id', 'label'],\n    properties: {\n        id: {\n            type: 'string',\n        },\n        label: {\n            type: 'string',\n        },\n    },\n};\n\nexport const FilterItemProps = {\n    additionalProperties: false,\n    required: ['tags', 'card'],\n    properties: {\n        tags: {\n            type: 'array',\n            items: {\n                type: 'string',\n            },\n        },\n        card: {$ref: 'self#/definitions/cards'},\n    },\n};\n\nexport const FilterProps = {\n    additionalProperties: false,\n    required: ['tags', 'items'],\n    properties: {\n        ...BlockBaseProps,\n        ...AnimatableProps,\n        ...BlockHeaderProps,\n        allTag: {\n            oneOf: [\n                {\n                    type: 'boolean',\n                    optionName: 'auto',\n                },\n                {\n                    type: 'string',\n                    optionName: 'cutom',\n                },\n            ],\n        },\n        colSizes: containerSizesObject,\n        tags: filteredArray(FilterTagProps),\n        items: filteredArray(FilterItemProps),\n        tagButtonSize: {\n            type: 'string',\n            enum: ['s', 'm', 'l', 'xl'],\n        },\n        centered: {type: 'boolean'},\n    },\n};\n\nexport const FilterBlock = {\n    'filter-block': FilterProps,\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/FilterBlock/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,oBAAoB,GACvB,yDAAsD;AACvD,OAAO,EAAC,oBAAoB,EAAC,wDAAqD;AAClF,OAAO,EAAC,aAAa,EAAC,wDAAqD;AAE3E,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,IAAI,EAAE,QAAQ;IACd,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC;IACzB,UAAU,EAAE;QACR,EAAE,EAAE;YACA,IAAI,EAAE,QAAQ;SACjB;QACD,KAAK,EAAE;YACH,IAAI,EAAE,QAAQ;SACjB;QACD,cAAc,EAAE,oBAAoB;KACvC;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;IAC3B,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE;QACR,IAAI,EAAE;YACF,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;aACjB;SACJ;QACD,IAAI,EAAE,EAAC,IAAI,EAAE,yBAAyB,EAAC;KAC1C;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC;IAC3B,UAAU,EAAE;QACR,GAAG,cAAc;QACjB,GAAG,eAAe;QAClB,GAAG,gBAAgB;QACnB,MAAM,EAAE;YACJ,KAAK,EAAE;gBACH;oBACI,IAAI,EAAE,SAAS;oBACf,UAAU,EAAE,MAAM;iBACrB;gBACD;oBACI,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,OAAO;iBACtB;gBACD;oBACI,GAAG,cAAc;iBACpB;aACJ;SACJ;QACD,QAAQ,EAAE,oBAAoB;QAC9B,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC;QACnC,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC;QACrC,aAAa,EAAE;YACX,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC;SAC9B;QACD,QAAQ,EAAE,EAAC,IAAI,EAAE,SAAS,EAAC;KAC9B;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,cAAc,EAAE,WAAW;CAC9B,CAAC","sourcesContent":["import {\n    AnimatableProps,\n    BlockBaseProps,\n    BlockHeaderProps,\n    containerSizesObject,\n} from '../../gravity-blocks/schema/validators/common';\nimport {AnalyticsEventSchema} from '../../gravity-blocks/schema/validators/event';\nimport {filteredArray} from '../../gravity-blocks/schema/validators/utils';\n\nexport const FilterTagProps = {\n    type: 'object',\n    additionalProperties: false,\n    required: ['id', 'label'],\n    properties: {\n        id: {\n            type: 'string',\n        },\n        label: {\n            type: 'string',\n        },\n        analyticsEvent: AnalyticsEventSchema,\n    },\n};\n\nexport const FilterItemProps = {\n    additionalProperties: false,\n    required: ['tags', 'card'],\n    properties: {\n        tags: {\n            type: 'array',\n            items: {\n                type: 'string',\n            },\n        },\n        card: {$ref: 'self#/definitions/cards'},\n    },\n};\n\nexport const FilterProps = {\n    additionalProperties: false,\n    required: ['tags', 'items'],\n    properties: {\n        ...BlockBaseProps,\n        ...AnimatableProps,\n        ...BlockHeaderProps,\n        allTag: {\n            oneOf: [\n                {\n                    type: 'boolean',\n                    optionName: 'auto',\n                },\n                {\n                    type: 'string',\n                    optionName: 'cutom',\n                },\n                {\n                    ...FilterTagProps,\n                },\n            ],\n        },\n        colSizes: containerSizesObject,\n        tags: filteredArray(FilterTagProps),\n        items: filteredArray(FilterItemProps),\n        tagButtonSize: {\n            type: 'string',\n            enum: ['s', 'm', 'l', 'xl'],\n        },\n        centered: {type: 'boolean'},\n    },\n};\n\nexport const FilterBlock = {\n    'filter-block': FilterProps,\n};\n"]}

package/build/esm/blocks/FoldableList/FoldableList.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { Col, Row } from "../../grid/index.js";
+import { Col, Row } from "../../gravity-blocks/grid/index.js";
 import { Content } from "../../sub-blocks/index.js";
 import { block } from "../../utils/index.js";
 import { FoldableListBlockItem } from "./FoldableListBlockItem/FoldableListBlockItem.js";