Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: web components | shadow dom - tooltip support #1039

Closed
wants to merge 2 commits into from

Conversation

danielbarion
Copy link
Member

@danielbarion danielbarion commented Jun 13, 2023

closes #1029

PS: I'm first trying to make it work, after that, we can refine the solution.

@danielbarion danielbarion changed the title feat: web components support feat: web components | shadow dom support Jun 13, 2023
@danielbarion danielbarion changed the title feat: web components | shadow dom support feat: web components | shadow dom - tooltip support Jun 13, 2023
@@ -8,7 +8,7 @@ import styles from './styles.module.css'

function App() {
const [anchorId, setAnchorId] = useState('button')
const [isDarkOpen, setIsDarkOpen] = useState(false)
const [isDarkOpen, setIsDarkOpen] = useState(true)
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had to set the default state to open to have the access to the shadow dom element

root.appendChild(style)
}
}
})
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was not able to convert the CSS modules to text, so, I had to copy our current styles and export it as string to inject inside of shadow dom

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm able to do it on: #1041

root.addEventListener(event, listener)
} else {
ref.current?.addEventListener(event, listener)
}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is on WIP, but didn't worked yet

@danielbarion
Copy link
Member Author

Try to update this PR as the following gets merged: #1041

@danielbarion
Copy link
Member Author

I tried again but I was not able to make it work as expected on shadow DOM, so, I'll close this PR and we are accepting new PRs related to this issue.

Thanks All!

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

Successfully merging this pull request may close these issues.

[BUG] ReactTooltip isn't being rendered in Shadow DOM mode
1 participant