Skip to content

fix(solid): remove SVG nesting for toast icons#569

Open
valooford wants to merge 1 commit into
chakra-ui:mainfrom
valooford:fix/solid-toast-icon-nesting
Open

fix(solid): remove SVG nesting for toast icons#569
valooford wants to merge 1 commit into
chakra-ui:mainfrom
valooford:fix/solid-toast-icon-nesting

Conversation

@valooford
Copy link
Copy Markdown

Problem
Toast icon looks cropped in Solid.
image
Reason
Icon is rendered as nested SVGs.
image
Compared to React's single SVG.
image
asChild does the trick in React.

// components/react/src/components/ui/icon.tsx
export const Icon = styled(ark.svg, icon, {
  defaultProps: { asChild: true },
})

// components/solid/src/components/ui/icon.tsx
export const Icon = styled(ark.svg, icon)

After
image
image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant