correct work in nextjs app route with plugins

[mmspring13]

Environment

System:

• OS: macOS 14.3
• CPU: (8) arm64 Apple M1
• Memory: 100.84 MB / 16.00 GB
• Shell: 5.9 - /bin/zsh

Binaries:

• Node: 21.6.1 - /opt/homebrew/bin/node
• Yarn: 1.22.1 - /opt/homebrew/bin/yarn
• npm: 10.2.4 - /opt/homebrew/bin/npm

npmPackages:

• next: 14.1.3 => 14.1.3
• styled-components: ^6.1.8 => 6.1.8 `

Reproduction

• you can complete that guide next-styled-component
• connect this plugin rtl-stylis

code like:

'use client'

import React, { useState } from 'react'
import { useServerInsertedHTML } from 'next/navigation'
import rtlPlugin from "stylis-plugin-rtl";
import { ServerStyleSheet, StyleSheetManager } from 'styled-components';

export default function StyledComponentsRegistry({
  children,
}: {
  children: React.ReactNode
}) {

  const [styledComponentsStyleSheet, seet] = useState(() => {
    return new ServerStyleSheet();
  });

  useServerInsertedHTML(() => {
    const styles = styledComponentsStyleSheet.getStyleElement()
    styledComponentsStyleSheet.instance.clearTag()
    return styles
  });

  if (typeof window !== 'undefined') return children;

  return (
    <StyleSheetManager
      sheet={styledComponentsStyleSheet.instance}
      stylisPlugins={[rtlPlugin]}
    >
      {children}
    </StyleSheetManager>
  )
}

Steps to reproduce

yarn build && yarn start
or example bug git-repo

Expected Behavior

same styles in server and client

Actual Behavior

different styles in server and client

problem similar to emotion-2928