fix(icons): inject missing sprite symbols for newly added icons
The icon sprite was injected once and never updated, so HMR/new glyphs like telegram-fill left <use> refs empty. Append missing symbols on render. Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
This commit is contained in:
committed by
Cursor Agent
co-authored by
Serhii Dziupin
parent
a838f62b41
commit
70f8f2e15b
@@ -30,6 +30,29 @@ function ensureSpriteOnce() {
|
||||
spriteInjected = true
|
||||
}
|
||||
|
||||
/**
|
||||
* Append a single missing symbol. Needed when the sprite was injected before a
|
||||
* newly generated icon landed (HMR / late sprite regenerate) — a one-shot inject
|
||||
* would otherwise leave `<use href="#oc-…"/>` pointing at nothing.
|
||||
*/
|
||||
function ensureSpriteSymbol(name: IconName) {
|
||||
if (typeof document === "undefined") return
|
||||
ensureSpriteOnce()
|
||||
if (document.getElementById(`oc-${name}`)) return
|
||||
|
||||
const content = iconSpriteData[name]
|
||||
if (typeof content !== "string") return
|
||||
|
||||
const sprite = document.getElementById(SPRITE_ID)
|
||||
if (!sprite) return
|
||||
|
||||
const symbol = document.createElementNS("http://www.w3.org/2000/svg", "symbol")
|
||||
symbol.id = `oc-${name}`
|
||||
symbol.setAttribute("viewBox", "0 0 24 24")
|
||||
symbol.innerHTML = content
|
||||
sprite.appendChild(symbol)
|
||||
}
|
||||
|
||||
export interface IconProps extends React.ComponentPropsWithoutRef<"svg"> {
|
||||
name: IconName
|
||||
}
|
||||
@@ -38,7 +61,7 @@ export const Icon = React.memo(({ name, className, ...rest }: IconProps) => {
|
||||
// Inline sprite injection during render – must run before <use> tries
|
||||
// to resolve the #oc-* reference during the same commit.
|
||||
if (typeof document !== "undefined") {
|
||||
ensureSpriteOnce()
|
||||
ensureSpriteSymbol(name)
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user