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
|
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"> {
|
export interface IconProps extends React.ComponentPropsWithoutRef<"svg"> {
|
||||||
name: IconName
|
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
|
// Inline sprite injection during render – must run before <use> tries
|
||||||
// to resolve the #oc-* reference during the same commit.
|
// to resolve the #oc-* reference during the same commit.
|
||||||
if (typeof document !== "undefined") {
|
if (typeof document !== "undefined") {
|
||||||
ensureSpriteOnce()
|
ensureSpriteSymbol(name)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user