feat(icons): add flag, repeat, tag and close glyphs

This commit is contained in:
2026-09-01 22:46:57 +10:00
parent 9aba89a2a9
commit 5f610e506b

View File

@@ -15,7 +15,11 @@ export type IconName =
| "projects" | "projects"
| "review" | "review"
| "settings" | "settings"
| "flag"
| "repeat"
| "tag"
| "plus" | "plus"
| "close"
| "chevron"; | "chevron";
type Props = { type Props = {
@@ -227,6 +231,64 @@ export default function Icon({ name, size = 22, color = C.textSecondary, bg = C.
</View> </View>
); );
case "flag":
return (
<View style={box}>
{/* Pole plus a pennant — reads as a priority flag at 20px where a
detailed banner outline would smear into a blob. */}
<View style={{ position: "absolute", left: size * 0.26, top: size * 0.12, width: w, height: size * 0.76, borderRadius: 1, backgroundColor: color }} />
<View
style={{
position: "absolute",
left: size * 0.26 + w,
top: size * 0.14,
width: size * 0.44,
height: size * 0.34,
borderTopRightRadius: 2,
borderBottomRightRadius: 2,
backgroundColor: color,
}}
/>
</View>
);
case "repeat":
return (
<View style={box}>
{/* Two offset bars with opposing arrowheads: a loop, without the
anti-aliasing mush a thin circular arc gets at this size. */}
<View style={{ position: "absolute", left: size * 0.2, top: size * 0.3, width: size * 0.5, height: w, backgroundColor: color }} />
<View style={{ position: "absolute", left: size * 0.62, top: size * 0.3 - size * 0.09 + w / 2, width: size * 0.18, height: size * 0.18, borderRightWidth: w, borderTopWidth: w, borderColor: color, transform: [{ rotate: "45deg" }] }} />
<View style={{ position: "absolute", left: size * 0.3, top: size * 0.66, width: size * 0.5, height: w, backgroundColor: color }} />
<View style={{ position: "absolute", left: size * 0.2, top: size * 0.66 - size * 0.09 + w / 2, width: size * 0.18, height: size * 0.18, borderLeftWidth: w, borderBottomWidth: w, borderColor: color, transform: [{ rotate: "45deg" }] }} />
</View>
);
case "tag":
return (
<View style={[box, s.center]}>
<View
style={{
width: size * 0.6,
height: size * 0.6,
borderWidth: w,
borderColor: color,
borderRadius: 3,
transform: [{ rotate: "45deg" }],
}}
/>
<View style={{ position: "absolute", left: size * 0.3, top: size * 0.3, width: w + 0.6, height: w + 0.6, borderRadius: 999, backgroundColor: color }} />
</View>
);
case "close":
return (
<View style={[box, s.center]}>
<View style={{ position: "absolute", width: size * 0.6, height: w, borderRadius: 2, backgroundColor: color, transform: [{ rotate: "45deg" }] }} />
<View style={{ position: "absolute", width: size * 0.6, height: w, borderRadius: 2, backgroundColor: color, transform: [{ rotate: "-45deg" }] }} />
</View>
);
case "plus": case "plus":
return ( return (
<View style={[box, s.center]}> <View style={[box, s.center]}>