{ "version": 1, "note": "Platform reference of block types: what exists and how it is configured. Identical for every shop — no shop data here. Settings live in a block section: GET /content-blocks, then PUT /content-blocks/{id}. sections is a replace-set: send the whole list. A 200 does not prove the value took effect — a value outside enum is accepted silently and the default is rendered.", "widgets": [ { "kind": "breadcrumbs", "label": { "ru": "Хлебные крошки", "en": "Breadcrumbs" }, "placement": "page", "render": "slot", "writePath": "props", "schema": null, "choices": {}, "props": null }, { "kind": "pageHeading", "label": { "ru": "Заголовок страницы", "en": "Page heading" }, "placement": "page", "render": "slot", "writePath": "props", "schema": null, "choices": {}, "props": null }, { "kind": "productListing", "label": { "ru": "Товары категории", "en": "Category products" }, "placement": "page", "render": "slot", "writePath": "props.listing", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "categoryId": { "type": "integer", "default": 0 }, "template": { "type": "string", "default": "" }, "showFilter": { "type": "boolean", "default": true }, "limit": { "type": "integer", "default": 24 }, "cardClick": { "type": "string", "default": "link", "enum": [ "link", "modal" ] }, "showQuickViewButton": { "type": "boolean", "default": false }, "modalTpl": { "type": "integer", "default": 0 }, "modalSize": { "type": "string", "default": "std", "enum": [ "small", "std", "full" ] }, "modalNav": { "type": "boolean", "default": true }, "source": { "type": "string", "default": "category", "enum": [ "category", "children", "shop" ] }, "parentProductId": { "type": "integer", "default": 0 } } }, "choices": { "cardClick": [ "link", "modal" ], "modalSize": [ "small", "std", "full" ], "source": [ "category", "children", "shop" ] }, "props": { "categoryId": 0, "template": "", "showFilter": true, "limit": 24, "cardClick": "link", "showQuickViewButton": false, "modalTpl": 0, "modalSize": "std", "modalNav": true, "source": "category", "parentProductId": 0 } }, { "kind": "productCard", "label": { "ru": "Карточка товара", "en": "Product card" }, "placement": "page", "render": "slot", "writePath": "props.card", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "productId": { "type": "integer", "default": 0 } } }, "choices": {}, "props": { "productId": 0 } }, { "kind": "slideshow", "label": { "ru": "Слайд-шоу", "en": "Slideshow" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "aspect": { "type": "string", "default": "16:9" }, "aspectClass": { "type": "string", "default": "aspect-video" }, "controls": { "type": "string", "default": "arrows_dots" }, "showArrows": { "type": "boolean", "default": true }, "showDots": { "type": "boolean", "default": true }, "transition": { "type": "string", "default": "slide" }, "autoplay": { "type": "integer", "default": 0 }, "radius": { "type": "null" }, "caption": { "type": "string", "default": "off" }, "captionStyle": { "type": "object", "default": {} }, "captionClass": { "type": "string", "default": "text-sm sm:text-base" }, "zoom": { "type": "boolean", "default": false }, "hiddenEls": { "type": "array", "default": [] }, "legacy": { "type": "boolean", "default": true } } }, "choices": {}, "props": { "aspect": "16:9", "aspectClass": "aspect-video", "controls": "arrows_dots", "showArrows": true, "showDots": true, "transition": "slide", "autoplay": 0, "caption": "off", "captionStyle": {}, "captionClass": "text-sm sm:text-base", "zoom": false, "hiddenEls": [], "legacy": true } }, { "kind": "reels", "label": { "ru": "Видеолента", "en": "Video strip" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "layout": { "type": "string", "default": "grid", "enum": [ "strip", "grid" ] }, "tileHeight": { "type": "string", "default": "m" }, "tileWidth": { "type": "integer", "default": 172 }, "tileAspect": { "type": "string", "default": "9:16" }, "aspectClass": { "type": "string", "default": "aspect-[9/16]" }, "columns": { "type": "integer", "default": 4 }, "gridClass": { "type": "string", "default": "grid-cols-2 @2xl:grid-cols-4" }, "gap": { "type": "integer", "default": 12 }, "radius": { "type": "null" }, "overflow": { "type": "string", "default": "plusN", "enum": [ "plusN", "scroll" ] }, "drift": { "type": "string", "default": "off", "enum": [ "off", "slow", "mid", "fast" ] }, "preview": { "type": "string", "default": "poster", "enum": [ "poster", "hover" ] }, "showTileCaptions": { "type": "boolean", "default": true }, "showDuration": { "type": "boolean", "default": true }, "autoAdvance": { "type": "boolean", "default": true }, "loopAll": { "type": "boolean", "default": false }, "title": { "type": "object", "default": {} }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "hiddenEls": { "type": "array", "default": [] } } }, "choices": { "layout": [ "strip", "grid" ], "overflow": [ "plusN", "scroll" ], "drift": [ "off", "slow", "mid", "fast" ], "preview": [ "poster", "hover" ], "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "layout": "grid", "tileHeight": "m", "tileWidth": 172, "tileAspect": "9:16", "aspectClass": "aspect-[9/16]", "columns": 4, "gridClass": "grid-cols-2 @2xl:grid-cols-4", "gap": 12, "overflow": "plusN", "drift": "off", "preview": "poster", "showTileCaptions": true, "showDuration": true, "autoAdvance": true, "loopAll": false, "title": {}, "titleTag": "h3", "hiddenEls": [] } }, { "kind": "cards", "label": { "ru": "Карточки", "en": "Cards" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "source": { "type": "string", "default": "manual" }, "productRefs": { "type": "array", "default": [] }, "articlesLimit": { "type": "integer", "default": 4 } } }, "choices": {}, "props": { "source": "manual", "productRefs": [], "articlesLimit": 4 } }, { "kind": "steps", "label": { "ru": "Этапы", "en": "Steps" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "layout": { "type": "string", "default": "grid", "enum": [ "grid", "timeline" ] }, "columns": { "type": "integer", "default": 4 }, "gridClass": { "type": "string", "default": "@2xl:grid-cols-2 @5xl:grid-cols-4" }, "gap": { "type": "integer", "default": 24 }, "marker": { "type": "string", "default": "circle", "enum": [ "circle", "square", "plain", "icon", "none" ] }, "markerSize": { "type": "string", "default": "m" }, "markerClass": { "type": "string", "default": "size-8 text-sm" }, "markerPx": { "type": "integer", "default": 32 }, "markerFill": { "type": "object", "default": { "hex": "" } }, "markerColor": { "type": "object", "default": { "hex": "" } }, "connector": { "type": "boolean", "default": false }, "connectorStyle": { "type": "string", "default": "solid", "enum": [ "solid", "dashed" ] }, "connectorColor": { "type": "object", "default": { "hex": "" } }, "startFrom": { "type": "integer", "default": 1 }, "stepTitle": { "type": "object", "default": {} }, "stepTitleClass": { "type": "string", "default": "text-base" }, "stepText": { "type": "object", "default": {} }, "stepTextClass": { "type": "string", "default": "text-sm" }, "title": { "type": "object", "default": {} }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "hiddenEls": { "type": "array", "default": [] }, "legacy": { "type": "boolean", "default": true } } }, "choices": { "layout": [ "grid", "timeline" ], "marker": [ "circle", "square", "plain", "icon", "none" ], "connectorStyle": [ "solid", "dashed" ], "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "layout": "grid", "columns": 4, "gridClass": "@2xl:grid-cols-2 @5xl:grid-cols-4", "gap": 24, "marker": "circle", "markerSize": "m", "markerClass": "size-8 text-sm", "markerPx": 32, "markerFill": { "hex": "" }, "markerColor": { "hex": "" }, "connector": false, "connectorStyle": "solid", "connectorColor": { "hex": "" }, "startFrom": 1, "stepTitle": {}, "stepTitleClass": "text-base", "stepText": {}, "stepTextClass": "text-sm", "title": {}, "titleTag": "h3", "hiddenEls": [], "legacy": true } }, { "kind": "faq", "label": { "ru": "Вопрос-ответ", "en": "FAQ" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "openMode": { "type": "string", "default": "multi", "enum": [ "multi", "single" ] }, "firstOpen": { "type": "boolean", "default": false }, "icon": { "type": "string", "default": "chevron", "enum": [ "chevron", "plus", "none" ] }, "frame": { "type": "boolean", "default": true }, "bg": { "type": "object", "default": { "hex": "" } }, "dividers": { "type": "boolean", "default": true }, "dividerColor": { "type": "object", "default": { "hex": "" } }, "gap": { "type": "integer", "default": 0 }, "question": { "type": "object", "default": {} }, "questionClass": { "type": "string", "default": "text-base" }, "answer": { "type": "object", "default": {} }, "answerClass": { "type": "string", "default": "text-sm" }, "title": { "type": "object", "default": {} }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "hiddenEls": { "type": "array", "default": [] }, "legacy": { "type": "boolean", "default": true } } }, "choices": { "openMode": [ "multi", "single" ], "icon": [ "chevron", "plus", "none" ], "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "openMode": "multi", "firstOpen": false, "icon": "chevron", "frame": true, "bg": { "hex": "" }, "dividers": true, "dividerColor": { "hex": "" }, "gap": 0, "question": {}, "questionClass": "text-base", "answer": {}, "answerClass": "text-sm", "title": {}, "titleTag": "h3", "hiddenEls": [], "legacy": true } }, { "kind": "features", "label": { "ru": "Преимущества", "en": "Features" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "columns": { "type": "integer", "default": 3 }, "gridClass": { "type": "string", "default": "@2xl:grid-cols-2 @5xl:grid-cols-3" }, "gap": { "type": "integer", "default": 24 }, "align": { "type": "string", "default": "left", "enum": [ "left", "center" ] }, "icon": { "type": "string", "default": "rounded" }, "iconSize": { "type": "string", "default": "m" }, "iconClass": { "type": "string", "default": "size-12 rounded-xl bg-gray-100" }, "iconFill": { "type": "object", "default": { "hex": "" } }, "itemTitle": { "type": "object", "default": {} }, "itemTitleClass": { "type": "string", "default": "text-base" }, "itemText": { "type": "object", "default": {} }, "itemTextClass": { "type": "string", "default": "text-sm" }, "title": { "type": "object", "default": {} }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "hiddenEls": { "type": "array", "default": [] }, "legacy": { "type": "boolean", "default": true } } }, "choices": { "align": [ "left", "center" ], "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "columns": 3, "gridClass": "@2xl:grid-cols-2 @5xl:grid-cols-3", "gap": 24, "align": "left", "icon": "rounded", "iconSize": "m", "iconClass": "size-12 rounded-xl bg-gray-100", "iconFill": { "hex": "" }, "itemTitle": {}, "itemTitleClass": "text-base", "itemText": {}, "itemTextClass": "text-sm", "title": {}, "titleTag": "h3", "hiddenEls": [], "legacy": true } }, { "kind": "cta", "label": { "ru": "Призыв к действию", "en": "Call to action" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "align": { "type": "string", "default": "center" }, "left": { "type": "boolean", "default": false }, "bg": { "type": "object", "default": { "hex": "" } }, "bgCss": { "type": "null" }, "height": { "type": "string", "default": "normal" }, "padClass": { "type": "string", "default": "px-8 py-10 sm:px-12" }, "button": { "type": "null" }, "target": { "type": "null" }, "title": { "type": "object", "default": {} }, "titleClass": { "type": "string", "default": "text-2xl sm:text-3xl" }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "subtitle": { "type": "object", "default": {} }, "subtitleClass": { "type": "string", "default": "text-base" }, "hiddenEls": { "type": "array", "default": [] }, "legacy": { "type": "boolean", "default": true } } }, "choices": { "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "align": "center", "left": false, "bg": { "hex": "" }, "height": "normal", "padClass": "px-8 py-10 sm:px-12", "title": {}, "titleClass": "text-2xl sm:text-3xl", "titleTag": "h3", "subtitle": {}, "subtitleClass": "text-base", "hiddenEls": [], "legacy": true } }, { "kind": "columns", "label": { "ru": "Колонки", "en": "Columns" }, "placement": "page", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "layoutKey": { "type": "string", "default": "2" }, "template": { "type": "string", "default": "1fr 1fr" }, "stack": { "type": "boolean", "default": true }, "vAlign": { "type": "string", "default": "top" }, "vAlignClass": { "type": "string", "default": "items-start" }, "gap": { "type": "integer", "default": 24 }, "title": { "type": "object", "default": {} }, "titleTag": { "type": "string", "default": "h3", "enum": [ "h2", "h3", "p", "div" ] }, "legacy": { "type": "boolean", "default": true } } }, "choices": { "titleTag": [ "h2", "h3", "p", "div" ] }, "props": { "layoutKey": "2", "template": "1fr 1fr", "stack": true, "vAlign": "top", "vAlignClass": "items-start", "gap": 24, "title": {}, "titleTag": "h3", "legacy": true } }, { "kind": "form", "label": { "ru": "Лид-форма", "en": "Lead form" }, "placement": "page", "render": "slot", "writePath": "props.form", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": {} }, "choices": {}, "props": {} }, { "kind": "html", "label": { "ru": "html", "en": "html" }, "placement": "page", "render": "slot", "writePath": "props", "schema": null, "choices": {}, "props": null }, { "kind": "component", "label": { "ru": "Компонент", "en": "Component" }, "placement": "page", "render": "slot", "writePath": "props.component", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "ref": { "type": "integer", "default": 0, "description": "id of the html document (kind=component) whose folder holds the markup: index.html plus a component.json schema of typed parameters. Full area doc: docs/api-areas/components.md." }, "params": { "type": "object", "default": {}, "description": "object {key: value} — values for THIS insertion, by the keys of component.json. The server substitutes {{key}} by the parameter TYPE: text is escaped, html goes through the level-1 sanitiser, image resolves a file_id to a resized URL, link accepts only http(s), a site path, mailto: and tel:. A key that is not in the schema renders as an empty string — there is no raw {{ }}; a missing one falls back to the schema default; a value of the wrong type counts as missing. At most 8 KB. Two sections with the same ref and different params render different content — that is the whole point, and nothing of the markup is stored in the section." } } }, "choices": {}, "props": { "ref": 0, "params": {} } }, { "kind": "siteHeader", "label": { "ru": "Шапка сайта", "en": "Site header" }, "placement": "chrome", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "theme": { "type": "string", "default": "dark", "enum": [ "light", "dark" ], "description": "Light or dark header band." }, "bg": { "type": "object", "default": { "hex": "", "opacity": 100 } }, "bgFill": { "type": "null" }, "width": { "type": "string", "default": "content", "enum": [ "content", "full" ], "description": "`content` — contents sit in the site container, `full` — edge to edge." }, "sticky": { "type": "boolean", "default": false }, "height": { "type": "integer", "default": 64 }, "padX": { "type": "integer", "default": 24 }, "iconSize": { "type": "integer", "default": 24 }, "navShow": { "type": "boolean", "default": true }, "showIcons": { "type": "boolean", "default": true }, "search": { "type": "boolean", "default": true }, "ctaEnabled": { "type": "boolean", "default": true }, "ctaLabel": { "type": "string", "default": "" }, "ctaStyle": { "type": "object", "default": { "kind": "solid", "size": "s", "textColor": "#111827", "bg": "#ffffff", "borderColor": "", "borderWidth": 0, "radius": 999 } }, "ctaPosition": { "type": "string", "default": "after", "enum": [ "before", "after" ] }, "ctaTarget": { "type": "null", "default": null }, "showLogo": { "type": "boolean", "default": true }, "showName": { "type": "boolean", "default": true }, "navAlign": { "type": "string", "default": "center", "enum": [ "start", "center", "end" ] }, "navStyle": { "type": "object", "default": { "size": 14, "weight": "500", "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "radius": 8, "padX": 0, "padY": 0, "gap": 24, "colorActive": { "hex": "", "opacity": 100 }, "weightActive": "600", "underline": "none" } }, "ctaStates": { "type": "object", "default": { "hover": { "text": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 } }, "active": { "text": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 } } } }, "logo": { "type": "object", "default": { "height": 32, "fileId": "", "url": "", "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } } }, "icons": { "type": "object", "default": { "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "badgeBg": { "hex": "", "opacity": 100 }, "badgeColor": { "hex": "", "opacity": 100 }, "avatarRing": { "hex": "", "opacity": 100 }, "avatarRingWidth": 0 } }, "nameText": { "type": "string", "default": "" }, "nameStyle": { "type": "object", "default": { "color": { "hex": "", "opacity": 100 }, "size": 18, "weight": "600" } }, "nameLook": { "type": "null" }, "searchBar": { "type": "object", "default": { "bg": { "hex": "", "opacity": 100 }, "border": { "hex": "", "opacity": 100 }, "borderWidth": 1, "radius": 999, "textColor": { "hex": "", "opacity": 100 }, "iconColor": { "hex": "", "opacity": 100 }, "placeholderColor": { "hex": "", "opacity": 100 }, "height": 40, "buttonShow": true, "buttonLabel": "" } }, "searchMode": { "type": "string", "default": "button", "enum": [ "always", "button" ] }, "searchScope": { "type": "array", "default": [ "products", "categories" ] }, "links": { "type": "null", "default": null }, "tablet": { "type": "object", "default": { "logo": { "fileId": "", "url": "", "height": 32, "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } }, "burger": false, "over": {} } }, "mobile": { "type": "object", "default": { "logo": { "fileId": "", "url": "", "height": 28, "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } }, "burger": true, "over": {} } } } }, "choices": { "theme": [ "light", "dark" ], "width": [ "content", "full" ], "ctaPosition": [ "before", "after" ], "navAlign": [ "start", "center", "end" ], "searchMode": [ "always", "button" ] }, "props": { "theme": "dark", "bg": { "hex": "", "opacity": 100 }, "width": "content", "sticky": false, "height": 64, "padX": 24, "iconSize": 24, "navShow": true, "showIcons": true, "search": true, "ctaEnabled": true, "ctaLabel": "", "ctaStyle": { "kind": "solid", "size": "s", "textColor": "#111827", "bg": "#ffffff", "borderColor": "", "borderWidth": 0, "radius": 999 }, "ctaPosition": "after", "ctaTarget": null, "showLogo": true, "showName": true, "navAlign": "center", "navStyle": { "size": 14, "weight": "500", "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "radius": 8, "padX": 0, "padY": 0, "gap": 24, "colorActive": { "hex": "", "opacity": 100 }, "weightActive": "600", "underline": "none" }, "ctaStates": { "hover": { "text": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 } }, "active": { "text": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 } } }, "logo": { "height": 32, "fileId": "", "url": "", "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } }, "icons": { "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 }, "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "badgeBg": { "hex": "", "opacity": 100 }, "badgeColor": { "hex": "", "opacity": 100 }, "avatarRing": { "hex": "", "opacity": 100 }, "avatarRingWidth": 0 }, "nameText": "", "nameStyle": { "color": { "hex": "", "opacity": 100 }, "size": 18, "weight": "600" }, "searchBar": { "bg": { "hex": "", "opacity": 100 }, "border": { "hex": "", "opacity": 100 }, "borderWidth": 1, "radius": 999, "textColor": { "hex": "", "opacity": 100 }, "iconColor": { "hex": "", "opacity": 100 }, "placeholderColor": { "hex": "", "opacity": 100 }, "height": 40, "buttonShow": true, "buttonLabel": "" }, "searchMode": "button", "searchScope": [ "products", "categories" ], "links": null, "tablet": { "logo": { "fileId": "", "url": "", "height": 32, "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } }, "burger": false, "over": {} }, "mobile": { "logo": { "fileId": "", "url": "", "height": 28, "filters": { "exposure": 0, "contrast": 0, "saturation": 0, "temperature": 0, "tint": 0, "highlights": 0, "shadows": 0, "blend": "normal" } }, "burger": true, "over": {} } } }, { "kind": "siteMenu", "label": { "ru": "Меню категорий", "en": "Category menu" }, "placement": "chrome", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "theme": { "type": "string", "default": "light", "enum": [ "light", "dark" ] }, "bg": { "type": "object", "default": { "hex": "", "opacity": 100 } }, "bgFill": { "type": "null" }, "width": { "type": "string", "default": "content", "enum": [ "content", "full" ] }, "source": { "type": "string", "default": "categories", "enum": [ "categories", "custom" ], "description": "`categories` — items come from the shop sections; `custom` — your own list in `customItems`." }, "customItems": { "type": "array", "default": [], "description": "Your own list of items; used only when `source` is `custom`." }, "kind": { "type": "string", "default": "icons", "enum": [ "icons", "text" ] }, "iconStyle": { "type": "string", "default": "plain", "enum": [ "plain", "card" ], "description": "`plain` — a strip with captions, `card` — cards with section images." }, "labels": { "type": "boolean", "default": true }, "align": { "type": "string", "default": "center", "enum": [ "start", "center", "end" ], "description": "Where items sit in the strip. The human word \"left\" is `start` here." }, "labelStyle": { "type": "object", "default": { "size": 12, "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 } } }, "cardStyle": { "type": "object", "default": { "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "border": { "hex": "", "opacity": 100 }, "borderHover": { "hex": "", "opacity": 100 }, "borderWidth": 1, "radius": 16, "iconBg": { "hex": "", "opacity": 100 }, "iconSize": 80, "iconRadius": 999, "pad": { "top": 20, "right": 16, "bottom": 20, "left": 16 }, "innerGap": 12 } }, "gap": { "type": "integer", "default": 32 }, "blockPad": { "type": "object", "default": { "top": 24, "right": 0, "bottom": 24, "left": 0 } }, "level2": { "type": "boolean", "default": true, "description": "Second level: sub-sections drop down on hover." }, "level3Columns": { "type": "boolean", "default": true, "description": "Third level inside the dropdown, laid out in columns." } } }, "choices": { "theme": [ "light", "dark" ], "width": [ "content", "full" ], "source": [ "categories", "custom" ], "kind": [ "icons", "text" ], "iconStyle": [ "plain", "card" ], "align": [ "start", "center", "end" ] }, "props": { "theme": "light", "bg": { "hex": "", "opacity": 100 }, "width": "content", "source": "categories", "customItems": [], "kind": "icons", "iconStyle": "plain", "labels": true, "align": "center", "labelStyle": { "size": 12, "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 } }, "cardStyle": { "bg": { "hex": "", "opacity": 100 }, "bgHover": { "hex": "", "opacity": 100 }, "border": { "hex": "", "opacity": 100 }, "borderHover": { "hex": "", "opacity": 100 }, "borderWidth": 1, "radius": 16, "iconBg": { "hex": "", "opacity": 100 }, "iconSize": 80, "iconRadius": 999, "pad": { "top": 20, "right": 16, "bottom": 20, "left": 16 }, "innerGap": 12 }, "gap": 32, "blockPad": { "top": 24, "right": 0, "bottom": 24, "left": 0 }, "level2": true, "level3Columns": true } }, { "kind": "siteFooter", "label": { "ru": "Футер сайта", "en": "Site footer" }, "placement": "chrome", "render": "section", "writePath": "props", "schema": { "$schema": "https://json-schema.org/draft/2020-12/schema", "type": "object", "properties": { "variant": { "type": "string", "default": "simple", "enum": [ "simple", "mega" ], "description": "`simple` — a single row, `mega` — columns of links." }, "theme": { "type": "string", "default": "light", "enum": [ "light", "dark" ] }, "bg": { "type": "object", "default": { "hex": "", "opacity": 100 } }, "bgFill": { "type": "null" }, "width": { "type": "string", "default": "content", "enum": [ "content", "full" ] }, "align": { "type": "string", "default": "start", "enum": [ "start", "center", "end" ] }, "linkStyle": { "type": "object", "default": { "size": 14, "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 } } }, "columns": { "type": "null", "default": null, "description": "Footer link columns: a data structure, not text." }, "social": { "type": "null", "default": null }, "payments": { "type": "null", "default": null }, "showSocial": { "type": "boolean", "default": true }, "showPayments": { "type": "boolean", "default": true }, "showCopyright": { "type": "boolean", "default": true } } }, "choices": { "variant": [ "simple", "mega" ], "theme": [ "light", "dark" ], "width": [ "content", "full" ], "align": [ "start", "center", "end" ] }, "props": { "variant": "simple", "theme": "light", "bg": { "hex": "", "opacity": 100 }, "width": "content", "align": "start", "linkStyle": { "size": 14, "color": { "hex": "", "opacity": 100 }, "colorHover": { "hex": "", "opacity": 100 } }, "columns": null, "social": null, "payments": null, "showSocial": true, "showPayments": true, "showCopyright": true } } ], "wrapper": { "note": "Every block on a page is drawn inside a standard wrapper, and the wrapper is configurable through the same section object as the widget itself — these keys sit next to \"kind\" in the section, NOT inside the widget writePath. Send the whole sections list: it is a replace-set. To make a block look unlike the platform: put your own class on the wrapper (props.wrapperClass) and restyle it from your own CSS, or switch off the wrapper setting that is in your way — \"elements\" below lists what the wrapper sets by default, with the file:line that sets it.", "axes": [ { "path": "props.blockWidth", "type": "\"content\" | \"full\"", "description": "Band width. \"content\" fits the site container; \"full\" bleeds to the screen edges — use it for landings and hero strips.", "default": "\"content\"", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "w === 'full' ? 'vz-edge' : null,", "at": "packages/sections/src/SectionBox.tsx:540" } }, { "path": "props.paddingSides", "type": "{ \"top\": px, \"right\": px, \"bottom\": px, \"left\": px }", "description": "Padding of the WRAPPER (the band). Omit an axis to keep the platform default.", "default": "12px vertical, 24px horizontal (0 horizontally when blockWidth is \"full\")", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-box { --vz-px-auto: 24px; --vz-py-auto: 12px; }", "at": "storefront/src/app/globals.css:188" } }, { "path": "props.containerPadding", "type": "{ \"top\": px, \"right\": px, \"bottom\": px, \"left\": px }", "description": "Padding of the CONTENT container inside the band — the inner box, not the band.", "default": "0px", "anchor": { "file": "storefront/src/app/globals.css", "line": "padding-top: var(--vz-ipt, 0px);", "at": "storefront/src/app/globals.css:286" } }, { "path": "props.blockRadius", "type": "px | { \"tl\": px, \"tr\": px, \"br\": px, \"bl\": px }", "description": "Corner rounding of the band; the object form rounds each corner separately. Note the band is SQUARE by default — the 16px rounding you see inside blocks belongs to their own elements, not to the wrapper.", "default": "0px", "anchor": { "file": "storefront/src/app/globals.css", "line": "border-radius: var(--vz-radius, 0px);", "after": "background: var(--vz-bg, transparent);", "until": "}", "at": "storefront/src/app/globals.css:206" } }, { "path": "props.container", "type": "{ \"fill\": …, \"borderTop\": px, \"borderBottom\": px, \"borderColor\": … }", "description": "Band background and hairlines. A background image is a separate media field.", "default": "transparent", "anchor": { "file": "storefront/src/app/globals.css", "line": "background: var(--vz-bg, transparent);", "at": "storefront/src/app/globals.css:203" } }, { "path": "props.contentWidth", "type": "\"content\" | \"full\"", "description": "Width of the content INSIDE the band. \"full\" lets it fill the band; \"content\" keeps it in the shop content width while the background stays wide — a full-bleed banner whose text does not run to the screen edge. (There is no props.innerMax: earlier versions of this reference named one, and nothing ever read it.)", "default": "\"full\" inside a full-bleed band, the shop content width otherwise", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-edge > .vz-inner { max-width: var(--vz-inner-max, none); }", "at": "storefront/src/app/globals.css:295" } }, { "path": "props.overflow", "type": "\"visible\" | \"clip\"", "description": "What happens to content that sticks out of the band. \"visible\" leaves glows, shadows and dropdowns whole; \"clip\" cuts at the edge — use it when the band has a radius and an image inside must round with it. Note that \"clip\" also breaks position: sticky for anything inside the block. ⚠️ The \"html\" widget is the exception: its shadow host clips by DEFAULT (\"clip\"), so a dropdown or a modal in your own markup needs props.overflow:\"visible\" set explicitly — leaving the key out is not the same as \"visible\" there.", "default": "\"visible\" on the band", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "export function wrapperFrameStyle(", "at": "packages/sections/src/SectionBox.tsx:264" } }, { "path": "props.position", "type": "\"static\" | \"sticky\"", "description": "Make the band stick to the top of the viewport. It is applied to the block wrapper itself, which is the only node with room to travel — a sticky element placed inside the block cannot move, because its parent is exactly as tall as the block. Own markup can ask for the same with the vz-sticky key.", "default": "\"static\"", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "export function sectionSticky(", "at": "packages/sections/src/SectionBox.tsx:301" } }, { "path": "props.stickyTop", "type": "px", "description": "Offset from the top for a sticky band — for example a sticky menu sitting under a sticky header.", "default": "0", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "style.top = props?.stickyTop != null ? `${props.stickyTop}px` : 0", "at": "packages/sections/src/SectionBox.tsx:285" } }, { "path": "props.layer", "type": "number", "description": "Z-order of the band; setting it makes the block positioned. Use it when blocks are meant to overlap — a negative top margin pulls a block over its neighbour, and the layer decides which one wins. Left unset, blocks paint in document order and no stacking context is created (one would clip a neighbour’s dropdown).", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "export function wrapperFrameStyle(", "at": "packages/sections/src/SectionBox.tsx:264" } }, { "path": "props.wrapperClass", "type": "string", "description": "YOUR OWN classes on the band — up to 3, separated by spaces. This is the intended way to make a block unique: give the wrapper a class and restyle it from your own CSS (`.my-hero > .vz-inner { max-width: none }`), instead of fighting the platform defaults listed in \"elements\". The classes are appended after the platform ones, so specificity — not order — decides. Each name must match ^[a-zA-Z_][a-zA-Z0-9_-]*$, be at most 48 characters and not start with \"vz-\" (the platform namespace); anything else is dropped before it reaches the markup.", "anchor": { "file": "packages/sections/src/wrapperClass.ts", "line": "export const WRAPPER_CLASS_MAX = 3", "at": "packages/sections/src/wrapperClass.ts:21" } }, { "path": "props.wrapperId", "type": "string", "description": "YOUR OWN id on the band — one name, same rules as wrapperClass. Use it for in-page anchors (#prices) and for your own scripts. Uniqueness across the page is yours to keep: the platform does not check it.", "anchor": { "file": "packages/sections/src/wrapperClass.ts", "line": "export function wrapperIdOf(value: unknown): string | undefined {", "at": "packages/sections/src/wrapperClass.ts:69" } } ], "elements": [ { "selector": ".vz-box", "role": "The band: the outer div of every block. It carries the background, the hairlines, the padding and the block radius, and it is the node that becomes sticky.", "defaults": [ { "property": "display", "value": "block", "note": "a plain
: it fills the width of its parent, no flex or grid of its own", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "'vz-box',", "after": "export function SectionBox({", "at": "packages/sections/src/SectionBox.tsx:538" } }, { "property": "position", "value": "static", "note": "CSS initial — the renderer sets nothing. It becomes relative when the band has a background layer or props.layer, and sticky when props.position is \"sticky\"", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "export function wrapperFrameStyle(", "at": "packages/sections/src/SectionBox.tsx:264" } }, { "property": "overflow", "value": "visible", "note": "CSS initial — the band itself never clips. Shadows, glows and dropdowns leave it whole; props.overflow:\"clip\" is what turns clipping on", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "export function wrapperFrameStyle(", "at": "packages/sections/src/SectionBox.tsx:264" } }, { "property": "padding-block", "value": "12px", "note": "platform air above and below; props.paddingSides overrides it", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-box { --vz-px-auto: 24px; --vz-py-auto: 12px; }", "at": "storefront/src/app/globals.css:188" } }, { "property": "padding-inline", "value": "24px", "when": "blockWidth \"content\"", "note": "a full-bleed band (blockWidth \"full\") gets 0 — it is meant to reach the edge", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-box { --vz-px-auto: 24px; --vz-py-auto: 12px; }", "at": "storefront/src/app/globals.css:188" } }, { "property": "border-radius", "value": "0px", "note": "square by default; the 16px rounding lives on elements INSIDE the block (class .vz-radius), not on the band", "anchor": { "file": "storefront/src/app/globals.css", "line": "border-radius: var(--vz-radius, 0px);", "after": "background: var(--vz-bg, transparent);", "until": "}", "at": "storefront/src/app/globals.css:206" } }, { "property": "background", "value": "transparent", "note": "the page shows through until props.container.fill is set", "anchor": { "file": "storefront/src/app/globals.css", "line": "background: var(--vz-bg, transparent);", "at": "storefront/src/app/globals.css:203" } } ] }, { "selector": ".vz-inner", "role": "The content container: the only child of the band besides the optional background layer. It caps the width of the content and centres it.", "defaults": [ { "property": "display", "value": "block", "note": "a plain
; your own layout (grid, flex) goes inside it", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "className={hasContainerPadding(props) ? 'vz-inner vz-ipad' : 'vz-inner'}", "at": "packages/sections/src/SectionBox.tsx:569" } }, { "property": "max-width", "value": "var(--store-content-max)", "note": "the content width of the shop — this is what keeps text out of the far edges", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-inner { max-width: var(--vz-inner-max, var(--store-content-max)); margin-inline: auto; }", "at": "storefront/src/app/globals.css:279" } }, { "property": "max-width", "value": "none", "when": "inside a full-bleed band (blockWidth \"full\")", "note": "no cap at all, so the content can reach the screen edge; props.contentWidth \"content\" caps it again", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-edge > .vz-inner { max-width: var(--vz-inner-max, none); }", "at": "storefront/src/app/globals.css:295" } }, { "property": "margin-inline", "value": "auto", "note": "centred inside the band", "anchor": { "file": "storefront/src/app/globals.css", "line": ".vz-inner { max-width: var(--vz-inner-max, var(--store-content-max)); margin-inline: auto; }", "at": "storefront/src/app/globals.css:279" } }, { "property": "padding", "value": "0px", "note": "padding here only appears when props.containerPadding is set", "anchor": { "file": "storefront/src/app/globals.css", "line": "padding-top: var(--vz-ipt, 0px);", "at": "storefront/src/app/globals.css:286" } }, { "property": "position", "value": "static", "note": "CSS initial — nothing is set here by default", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "className={hasContainerPadding(props) ? 'vz-inner vz-ipad' : 'vz-inner'}", "at": "packages/sections/src/SectionBox.tsx:569" } }, { "property": "position", "value": "relative", "when": "the band has a background image or overlay", "note": "so the content paints above the background layer; no z-index, so neighbouring dropdowns are not clipped", "anchor": { "file": "packages/sections/src/SectionBox.tsx", "line": "style={background.hasBgLayer ? { position: 'relative' } : undefined}", "at": "packages/sections/src/SectionBox.tsx:570" } } ] } ], "ownDefaults": [ { "kind": "html", "defaults": { "paddingX": 0, "paddingY": 0, "radius": 0 }, "why": "The author owns how this block looks, so the platform adds no padding and no rounding of its own. Set the axes above explicitly if you do want them." }, { "kind": "component", "defaults": { "paddingX": 0, "paddingY": 0, "radius": 0 }, "why": "The author owns how this block looks, so the platform adds no padding and no rounding of its own. Set the axes above explicitly if you do want them." } ], "responsive": "Tablet and mobile overrides live under props.tablet and props.mobile with the same keys (e.g. props.mobile.paddingSides). A layer that is absent falls back to the wider one." }, "structural": [ { "kind": "group", "configurable": false, "label": { "ru": "Группа оформления", "en": "Design group" }, "description": "Container, not a widget: holds `props.widgets` — ids of the widget blocks that make up this group. Renders nothing itself; a page is assembled from groups. What KIND of group it is lives on the block as `group_type`, not inside a section — so reordering widgets never changes what the group means. A group of type `layout` is the page FEED: its list holds other groups plus the body marker (a negative number) marking where the resource template goes. Remove the marker and the page is your groups only.", "fields": { "props.widgets": "number[] — ids of the blocks in this group, in render order. For a `layout` group the list may also contain the body marker -1.", "group_type (on the block, not the section)": "chrome · product · category · news · article · design · layout. The set is open: new types are added in the core registry without a migration.", "HOWTO page skeleton": "A page has four slots — header · feed · body · footer — bound per resource in /design/bindings. Each inherits on its own ladder: page → resource type → shop. A binding with an empty block means \"nothing here\" and stops the inheritance; no binding at all means \"inherit\"." } }, { "kind": "zone", "configurable": false, "label": { "ru": "Зона страницы (устаревает)", "en": "Page zone (deprecated)" }, "description": "DEPRECATED — replaced by the `group` container above and the feed slot; kept while existing shops still carry zone manifests. Container, not a widget: holds `props.refs` — ids of the blocks placed in this zone of the page. Renders nothing itself. To add a block to a page, put its id into refs. The block named `__page:top` also carries `page` — the page settings described in `fields` below.", "fields": { "page.hideSiteHeader": "boolean — hide the ENTIRE top area of the layout: header, menu and anything else placed in that zone. The page then starts with your own markup.", "page.hideSiteFooter": "boolean — hide the ENTIRE bottom area of the layout (footer and anything placed there).", "page.hideSystemBlock": "boolean — hide the ENTIRE technical layer: everything that came with the product or section (product card, product list, breadcrumbs, page heading — the body of the resource-type template plus the resource’s own bundled blocks). Nothing is deleted; unchecking brings it all back.", "HOWTO one-off landing": "Set all three flags to true on an empty page: your markup then owns the whole page and nothing of the platform shows through.", "HOWTO site-wide header": "Do NOT build a custom header inside a landing page — it would appear on that page only and the old one stays everywhere else (two headers on one site). Build it in the LAYOUT, zone `top` (footer — zone `bottom`): layout parts are shared, so it appears on every page of the shop.", "A settings acts on a LAYER, never on one widget": "There is no per-widget switch — e.g. no “hide breadcrumbs”. Breadcrumbs are an ordinary widget and can sit in any layer; they disappear together with the layer that holds them." } }, { "kind": "chromeKit", "configurable": false, "label": { "ru": "Комплект хрома", "en": "Chrome kit" }, "description": "Manifest of the site frame: `props.kit` = {top:[block ids], bottom:[block ids]} — header, menu and footer blocks by zone, in render order. On a page these parts are marked data-vz-kit with this block id; the editable block of each part is the one listed here." }, { "kind": "heading", "configurable": true, "label": { "ru": "Заголовок", "en": "Heading" }, "description": "Legacy section rendered by SectionRenderer, without a widget home of its own. Its fields sit on the section itself, not under props.", "fields": { "text": "Heading text (section.text).", "subtitle": "Optional subtitle below (section.subtitle).", "props.align": "`left` or centered when absent.", "props.level": "`h1` renders the large size; anything else renders the smaller one." } } ], "sectionKeys": [ "__prov", "badge", "cols", "cta", "cta2", "editorKey", "extra", "file", "file_id", "file_ids", "files", "items", "kind", "name", "opaquePayload", "origin", "page", "payloadSchemaVersion", "payloadVersion", "props", "refs", "role", "subtitle", "templateFor", "text", "type", "video", "payload" ] }