Code Component that intercepts a Collection List's internal render function to filter items — works in Preview/Published but not in Canvas.
I've built a Code Component that connects to a native Collection List placed off-page (via ControlType.ComponentInstance), intercepts its internal render-prop function (collection, paginationInfo, loadMore) => {...} to filter the array before rendering, and lets Framer paint the filtered result using the real connected design (native Product Card, unchanged).
This works perfectly in Preview and Published — filtering, favorites, layout, everything. But it never shows any content in the Canvas editor (the connected instance renders as empty/0-size there), even after fully restarting Framer to rule out caching.
I've confirmed that simple ComponentInstance connections (wrapping a single connected element without touching its internals — e.g. a 3D-rotation effect applied to a whole connected Collection List) do render fine in Canvas. The problem seems specific to intercepting the Collection List's own internal item-rendering function to filter which items get passed through.
Questions:
Is there a documented/supported way to filter a connected Collection List's items from a Code Component and have it also preview correctly in the Canvas?
Do first-party Framer components (like Slider) or community Collection-List-filtering components have privileged access to something not exposed via the public Code Component API, or is there a public technique I'm missing?
Any pointers appreciated — happy to share code if useful.
Code Component that intercepts a Collection List's internal render function to filter items — works in Preview/Published but not in Canvas.
I've built a Code Component that connects to a native Collection List placed off-page (via ControlType.ComponentInstance), intercepts its internal render-prop function (collection, paginationInfo, loadMore) => {...} to filter the array before rendering, and lets Framer paint the filtered result using the real connected design (native Product Card, unchanged).
This works perfectly in Preview and Published — filtering, favorites, layout, everything. But it never shows any content in the Canvas editor (the connected instance renders as empty/0-size there), even after fully restarting Framer to rule out caching.
I've confirmed that simple ComponentInstance connections (wrapping a single connected element without touching its internals — e.g. a 3D-rotation effect applied to a whole connected Collection List) do render fine in Canvas. The problem seems specific to intercepting the Collection List's own internal item-rendering function to filter which items get passed through.
Questions:
Is there a documented/supported way to filter a connected Collection List's items from a Code Component and have it also preview correctly in the Canvas?
Do first-party Framer components (like Slider) or community Collection-List-filtering components have privileged access to something not exposed via the public Code Component API, or is there a public technique I'm missing?
Any pointers appreciated — happy to share code if useful.