Skip to content

Commit

Permalink
[dapp-kit] fix edge case where the theme style element breaks when us…
Browse files Browse the repository at this point in the history
…ed in Next apps (#17801)

## Description 

If you render a `style` tag outside of the `body` element in canary
versions of React, you get a breaking error informing you to specify a
precedence/href prop. This PR adds those props which should fix
#17794

## Test plan 
- Tested manually with a Next 14.2.3 app
-
https://sui-typescript-docs-git-wrobertson-dappkitstylefix-mysten-labs.vercel.app/dapp-kit/wallet-components/ConnectButton
still works

---

## Release notes

Check each box that your changes affect. If none of the boxes relate to
your changes, release notes aren't required.

For each box you select, include information after the relevant heading
that describes the impact of your changes that a user might notice and
any actions they must take to implement updates.

- [ ] Protocol: 
- [ ] Nodes (Validators and Full nodes): 
- [ ] Indexer: 
- [ ] JSON-RPC: 
- [ ] GraphQL: 
- [ ] CLI: 
- [ ] Rust SDK:
  • Loading branch information
williamrobertson13 authored May 17, 2024
1 parent eeb19db commit 3f8b08d
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 2 deletions.
5 changes: 5 additions & 0 deletions .changeset/green-penguins-attack.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@mysten/dapp-kit': patch
---

Fix broken theme style tag in canary versions of React when the provider is placed outside of the body tag
4 changes: 4 additions & 0 deletions sdk/dapp-kit/src/components/styling/InjectedThemeStyles.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,10 @@ export function InjectedThemeStyles({ theme }: InjectedThemeStylesProps) {

return (
<style
// @ts-expect-error The precedence prop hasn't made it to the stable release of React, but we
// don't want this to break in frameworks like Next which use the latest canary build.
precedence="default"
href="mysten-dapp-kit-theme"
dangerouslySetInnerHTML={{
__html: themeStyles,
}}
Expand Down
2 changes: 0 additions & 2 deletions sdk/deepbook/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,6 @@
"clean": "rm -rf tsconfig.tsbuildinfo ./dist",
"build": "build-package",
"prepublishOnly": "pnpm build",
"dev": "ts-node src/deepbook_sdk.ts",
"bfs": "ts-node src/bfs.ts",
"prettier:check": "prettier -c --ignore-unknown .",
"prettier:fix": "prettier -w --ignore-unknown .",
"eslint:check": "eslint --max-warnings=0 .",
Expand Down

0 comments on commit 3f8b08d

Please sign in to comment.