Slot slider
Aşağıdaki alan düzeyi katalog tabloları İngilizce kalır — düzenleyici, API ve MCP’nin kullandığı makine tasarım şemasıyla birebir uyumludur.
Decoration and visibility use Dekorasyon ve görünürlük (BlockShell).
Repeats slot slides. slideSizeSection, animationSection, and currentSection are editor-only and have no storage path. Slide width is layout.slideSizeByBreakpoint. align is start or center (layout.align). controls.arrows, controls.counter, and controls.dots add chrome (layout.controls). Playback, neighbor, and pose keys are grouped under playback, neighbors, and poses.
Fields
slidesEditor
Editor-only control — does not persist its own value.
Visual editor for carousel slides. Does not persist its own value — writes slides.
// Writes:
slides: [{ id: string, content: [], panel: [] }]slides
Carousel slides; each slide has a stable id (for ops paths like slides[id=…]), nested blocks in content, and an optional panel slot for side-panel title and CTA.
slides: [{ id: string, content: [], panel: [] }]arrayBinding
Whole-value {{var:id}} or {{bind:id}} selecting an array or entry[] source. VariableArrayTemplateBlock repeats its slot per item. SlotSliderBlock repeats its first slide per item, with {{var:item.*}} and the row index, and keeps static slides when this is empty. Nested paths like {{var:parent.field}} work when that field is array-like.
arrayBinding: "{{var:hits}}"animationSection
Editor section for playback and transition. Stored as autoPlay, transition, and transitionDuration.
slideSizeSection
Slide Size Section.
currentSection
Editor section for the slide in view. Pose values are stored on currentPose (translate, rotate, scale, opacity, blur).
previousSection
Editor section for the previous neighbor. Pose values are stored on prevPose.
nextSection
Editor section for the next neighbor. Pose values are stored on nextPose.
layout
slideSizeByBreakpoint
Per-breakpoint slide size. Stored at layout.slideSizeByBreakpoint. set and remove accept that path or the flat key.
align
start keeps a narrow slide on the leading edge. center places it in the viewport. Stored at layout.align.
layout: {
align: "start" | "center"
}controls
Optional chrome. arrows, counter (1 / N), and dots. Stored at layout.controls.
layout: {
controls: { arrows?: boolean, counter?: boolean, dots?: boolean }
}<details><summary>Default props</summary>
{
"shell": {
"visibility": {
"authVisibility": "all",
"routeLockVisibility": "all",
"roleVisibility": [],
"entryActionVisibility": "all",
"queryPageVisibility": "all",
"hideWhenEmpty": ""
},
"anchor": {
"anchorId": "",
"anchorKey": ""
},
"spacing": {
"padding": {
"value": "none",
"enabled": false
},
"margin": {
"enabled": false
}
},
"box": {
"enabled": false
},
"background": {
"enabled": false,
"width": "page",
"kind": "solid",
"solid": {
"color": {
"light": "",
"dark": ""
}
},
"gradient": {
"angle": 180,
"type": "linear",
"colors": [
{
"light": "",
"dark": "",
"offset": 50
},
{
"light": "",
"dark": "",
"offset": 50
}
],
"color1Light": "",
"color1Dark": "",
"color2Light": "",
"color2Dark": ""
},
"image": {
"src": "",
"mode": "cover",
"repeatSize": 100,
"position": "center"
},
"motion": {
"enabled": false,
"directionDeg": 0,
"speed": 20,
"rotateDegPerSec": 0,
"animationMode": "particle"
},
"video": {
"src": "",
"source": "file",
"youtubeUrl": "",
"fit": "cover",
"loop": true,
"repeatSize": 100
},
"particles": {
"shape": "circle",
"svgSrc": "",
"colorMode": "solid",
"colorLight": "#ffffff88",
"colorDark": "#ffffff66",
"size": 12,
"jitter": 0.2,
"count": 40,
"lifetimeSec": 4,
"speed": 40,
"animType": "fade",
"fromSide": "left",
"toSide": "right"
},
"grid": {
"style": "cells",
"motionDirectionDeg": 0,
"motionSpeed": 0,
"rotateDegPerSec": 0,
"hoverGrowLimitPct": 50,
"hoverRotateLimitDeg": 0,
"reactionTimeSec": 1,
"hoverGrow": true,
"hoverRotate": false,
"hoverColor": false,
"hoverColorLight": "#ffffff55",
"hoverColorDark": "#ffffff33",
"reactionSpeed": 1
},
"backdrop": {
"enabled": false,
"blurPx": 0,
"brightness": 1,
"contrast": 1,
"saturate": 1,
"grayscale": 0,
"sepia": 0,
"hueRotateDeg": 0
}
},
"pointerEvents": "auto",
"effects": {
"enabled": false,
"opacity": 1,
"blurPx": 0,
"brightness": 1,
"contrast": 1,
"saturate": 1,
"grayscale": 0,
"sepia": 0,
"hueRotateDeg": 0,
"dropShadowOffsetX": 0,
"dropShadowOffsetY": 0,
"dropShadowBlur": 0,
"dropShadowColorLight": "",
"dropShadowColorDark": "",
"mixBlendMode": "normal"
},
"animation": {
"scroll": {
"enabled": false,
"type": "fadeIn",
"duration": 600,
"delay": 0
},
"tilt": {
"enabled": false,
"intensity": 12
},
"wander": {
"enabled": false,
"speed": 40,
"jitter": 40,
"turnRadius": 50,
"turnSmoothness": 40,
"limits": "parent"
},
"transform": {
"enabled": false,
"rotateX": 0,
"rotateY": 0,
"rotateZ": 0,
"translateX": 0,
"translateY": 0,
"translateZ": 0,
"scale": 1
}
}
},
"appearance": {
"border": {
"enabled": false,
"style": "solid",
"colorLight": "",
"colorDark": ""
},
"shadow": {
"enabled": false,
"valueLight": "",
"valueDark": ""
}
},
"slides": [
{
"id": "slide-default",
"content": []
}
],
"content": {
"playback": {
"transition": "slide",
"transitionDuration": 400,
"transitionEasing": "ease",
"autoPlay": false,
"autoPlayContinuous": false,
"autoPlayInterval": 6000
}
},
"neighbors": {
"showPrevSlides": true,
"prevRepeat": false,
"showPrevCount": 1,
"prevExtrapolation": {
"translateXMultiplier": 1,
"translateYMultiplier": 1,
"translateZMultiplier": 1,
"scaleMultiplier": 1,
"opacityMultiplier": 1,
"blurMultiplier": 1
},
"showNextSlides": true,
"nextRepeat": false,
"showNextCount": 1,
"nextExtrapolation": {
"translateXMultiplier": 1,
"translateYMultiplier": 1,
"translateZMultiplier": 1,
"scaleMultiplier": 1,
"opacityMultiplier": 1,
"blurMultiplier": 1
}
},
"poses": {
"currentPose": {
"opacity": 1,
"scaleX": 1,
"scaleY": 1
},
"prevPose": {
"opacity": 0.7,
"scaleX": 0.9,
"scaleY": 0.9,
"translateX": -60,
"blurPx": 0
},
"nextPose": {
"opacity": 0.7,
"scaleX": 0.9,
"scaleY": 0.9,
"translateX": 60,
"blurPx": 0
},
"restPose": {
"opacity": 0
}
}
}</details>