feat(builder): unify StylePanel image fields on AssetPicker

Replace the ad-hoc upload/browse/URL blocks in ImageStylePanel, HeroStylePanel
(bgImage + bgVideo), BackgroundSectionStylePanel, NavStylePanel (standalone
Logo imageSrc + Navbar logoImage), MediaStylePanel (Gallery/ContentSlider
array items), and FeaturesEditor (per-feature image) with the shared
AssetPicker component, dropping each panel's duplicated local
showBrowser/browserAssets/handleUpload state and inline asset-browser JSX.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-12 13:00:10 -07:00
parent c50b385661
commit 4674a99ec9
6 changed files with 56 additions and 347 deletions
@@ -16,6 +16,7 @@ import {
smallInputStyle,
sectionGap,
} from './shared';
import { AssetPicker } from '../../../ui/AssetPicker';
/* ---------- NAV / MENU / LOGO ---------- */
export const NavStylePanel: React.FC<StylePanelProps> = ({ selectedId, nodeProps }) => {
@@ -122,8 +123,8 @@ export const NavStylePanel: React.FC<StylePanelProps> = ({ selectedId, nodeProps
{nodeProps.type === 'image' && (
<>
<div style={sectionGap}>
<label style={labelStyle}>Image URL</label>
<input type="text" value={nodeProps.imageSrc || ''} onChange={(e) => setProp('imageSrc', e.target.value)} placeholder="https://..." style={inputStyle} />
<label style={labelStyle}>Logo Image</label>
<AssetPicker value={nodeProps.imageSrc || ''} onChange={(url) => setProp('imageSrc', url)} variant="full" />
</div>
<div style={sectionGap}>
<label style={labelStyle}>Image Width</label>
@@ -147,8 +148,8 @@ export const NavStylePanel: React.FC<StylePanelProps> = ({ selectedId, nodeProps
</div>
{nodeProps.logoImage !== undefined && (
<div style={sectionGap}>
<label style={labelStyle}>Logo Image URL</label>
<input type="text" value={nodeProps.logoImage || ''} onChange={(e) => setProp('logoImage', e.target.value)} placeholder="https://..." style={inputStyle} />
<label style={labelStyle}>Logo Image</label>
<AssetPicker value={nodeProps.logoImage || ''} onChange={(url) => setProp('logoImage', url)} variant="full" />
</div>
)}
{nodeProps.logoUrl !== undefined && (