feat: add Respira icon - #343
Conversation
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 39bb4852ca
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| export { default as Relace, type CompoundedIcon as RelaceProps } from './Relace'; | ||
| export { default as Replicate, type CompoundedIcon as ReplicateProps } from './Replicate'; | ||
| export { default as Replit, type CompoundedIcon as ReplitProps } from './Replit'; | ||
| export { default as Respira, type CompoundedIcon as RespiraProps } from './Respira'; |
There was a problem hiding this comment.
This makes Respira available from the web package, but the React Native package is left out of sync: I checked packages/react-native/src/icons and packages/react-native/src/index.ts, and there is no Respira icon or export. Because the RN package advertises near-identical API coverage and the conversion workflow explicitly detects web icons missing from RN, @lobehub/icons-rn users will not be able to import the newly added icon until the RN conversion/export is added as well.
Useful? React with 👍 / 👎.
|
Added the React Native counterpart for Respira, generated with The only remaining red check is the Vercel preview deploy ("Authorization required to deploy"), which is the standard external-fork gate and needs a maintainer to authorize. Happy to adjust anything else needed for merge. @codex review |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: eb352530bc
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
|
|
||
| const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => { | ||
| return ( | ||
| <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}> |
There was a problem hiding this comment.
When this component is used via <Respira.Avatar />, RNIconAvatar passes color={AVATAR_COLOR} into Mono, but the circles never consume that color or any stroke attributes; in react-native-svg they render as filled black shapes by default. This makes the RN avatar/default mono icon show a black filled blob instead of the web icon's currentColor/white stroked mark.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Good catch, thanks. Fixed in 25b1542: the circles are now wrapped in <G fill="none" stroke={color} strokeWidth={1.7}> and Mono takes a color prop (default #000000), so RNIconAvatar passing AVATAR_COLOR (#fff) renders a white stroked mark instead of a black fill. Now matches the web Mono.
|
|
||
| const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => { | ||
| return ( | ||
| <Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}> |
There was a problem hiding this comment.
For <Respira.Color /> and Combine type="color", this drops the web icon's fill="none", brand stroke={COLOR_PRIMARY}, and stroke width, so the RN circles render as default filled black circles rather than the emerald outlined symbol. Importing COLOR_PRIMARY and applying the same fill/stroke settings keeps the RN package in parity with the web package.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Fixed in 25b1542: Color now imports COLOR_PRIMARY and renders <G fill="none" stroke={COLOR_PRIMARY} strokeWidth={1.7}>, so the RN color icon shows the emerald outline instead of default-filled black circles, matching the web Color.
|
Both Codex P2s addressed in 25b1542 (RN Heads-up on the root cause for whenever it's useful: the |
|
Quick bump — is there anything else needed on my end for merge, or is the Vercel preview-deploy authorization ("Authorization required to deploy") the only remaining blocker? That one needs a maintainer to approve from your side. Also still happy to open the stroke-aware |
|
bump: both review points are addressed and CI is green here and on #343. on #343 the only red mark is the Vercel preview asking for maintainer authorization on fork deploys, which i cannot grant from my side. @canisminor1990 when you have a minute, could you authorize or dismiss that preview so the Respira icon can land? #352 fixes the RN converter for stroked icons generally, so other outline-style brand icons benefit too. |
Adds the Respira icon following the existing conventions: Mono, Color, Avatar, Text, TextColor, Combine, index.ts, style.ts, index.md, plus registration in src/icons.ts and src/toc.json. Respira lets AI agents edit live WordPress sites through MCP. https://respira.press
21ec784 to
ee97e3a
Compare
|
i have rebased this on current i also want to correct something i said earlier, because i was wrong and it probably wasted your time. i kept pointing at the red Vercel check as the blocker. it is not. #348, #322 and #299 all merged carrying the identical the real difference was that this PR had grown to 20 files across two packages, including hand-edited generated React Native output. that is not a rubber stamp, and it should not have been bundled in here. the merged icon PRs contain no RN files at all, so it was never needed for this to land. the RN side is preserved on a branch and depends on #352, which fixes the @canisminor1990 this should be a straightforward one now whenever you next sweep the icon queue. |
1 participant
Summary
Adds the Respira icon. Respira lets AI agents (Claude, ChatGPT, Cursor, Codex) safely edit live WordPress sites across 16 page builders through MCP — https://respira.press
What's included
Follows the existing icon conventions (
Mono,Color,Avatar,Text,TextColor,Combine,index.ts,style.ts,index.md) and is registered insrc/icons.ts:currentColorand brand emerald#10B981)currentColor(themeable)currentColor) and for WordPress in the brand greenBrand assets and guidelines: https://www.respira.press/brand
Happy to adjust naming, colors, or crop the wordmark
viewBoxto taste.