Overview - @builder.io/sdks

7 days30 days

Latest CI Pipeline Executions

Fuzzy

Succeeded
main
ced8349c fix[gen1][symbol]: ENG-13693 Editor flickers when using symbol with slot (#4849) ## Description Blocks you drop into a Slot are not stored as normal children. They live on the parent Symbol block under `symbol.data.<slotName>`, which you can see in `Slot.tsx`: `<BuilderBlocks dataPath={`symbol.data.${name}`} blocks={context.state[name] || []} />` `Symbol.tsx` builds the React key for its nested BuilderComponent from a hash of that same symbol.data object. So every keystroke changed the slot content, which changed the hash, which changed the key. React then threw away the whole symbol subtree and rebuilt it. This leads to the flickering in the editor when we try to update content. **Fix:** Leave block arrays out of the key while editing. Slot content renders through `BuilderBlocks` and already updates in place when the `data` prop changes, so the remount was not buying us anything. Live rendering keeps the exact key it has today, so nothing changes for published pages. **Link to JIRA ticket (if applicable):** https://builder-io.atlassian.net/browse/ENG-13693 **Screenshot/Clip** Bug: https://clips.agent-native.com/r/XujJySpqNeDH Fix: https://clips.agent-native.com/r/1kFnRc088Uj3  --- > [!NOTE] > **Low Risk** > Editor-only React key change with production parity preserved and regression tests; no auth, data, or API surface changes. > > **Overview** > Fixes Visual Editor flicker when inline-editing blocks inside a Symbol **Slot** by changing how the nested `BuilderComponent` React key is derived **only while `Builder.isEditing`**. > > Slot blocks are stored on `symbol.data.<slotName>`, and hashing that full `data` object used to change the key on every keystroke and remount the Symbol subtree (breaking the selected node and the inline edit UI). **`omitBlockValues`** now strips keys whose values are Builder element arrays from the hash input in edit mode; slot UI still updates in place via `BuilderBlocks`. **Published / non-editing** behavior is unchanged—slot content remains in the key hash as before. > > Adds **`symbol-slot-remount.test.tsx`** to lock in editor vs production remount behavior and a patch **changeset** for `@builder.io/react`. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit b8f148822e00a293fce4af95b656ba3612cbf7a4. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> 
by Aishwarya ...