Site Core Ui Ownership

Site core may provide reusable domain-neutral UI components that render semantic HTML through JSX, along with shared behavior, data loading, routing, accessibility helpers, and other infrastructure. Part sites may provide reusable domain UI through the same headless JSX approach. Core and part-site components must not define or import component appearance styles; consuming sites and themes supply appearance through semantic classes. Core build infrastructure CSS remains permitted. Keep SVG shapes and site- or theme-specific visuals outside site core. Put site-specific UI in the owning site, theme-specific UI and SVGs in the owning theme, and reusable domain UI in the appropriate part site. Import and render an owned SVG component directly where it is used. If several themes need the same visual, each theme may own a copy. Do not add a site-core icon registry or select visual components by string names.

Correct

import VercelMark from '../parts/svg/vercelMark.jsx'

export default () => <VercelMark />
import ProductCard from 'products/site/productCard.jsx'

export default ({ product }) => <ProductCard product={product} />

Incorrect

import VercelMark from 'site/pageParts/svg/vercelMark.jsx'
const icons = { vercelMark: VercelMark }

export default ({ name }) => icons[name]

Fix

Keep reusable domain-neutral headless JSX in site core and reusable domain JSX in part sites. Move component appearance styles into the consuming site or theme, and keep SVG shapes and site- or theme-specific visuals in their owner.