@@ -254,11 +254,13 @@ export function Form ({
{error && setError(undefined)} dismissible>{error}}
{storageKeyPrefix
? React.Children.map(children, (child) => {
- // if child has a type it's a dom element
+ // if child has a type that's a string, it's a dom element and can't get a prop
if (child) {
- return React.cloneElement(child, {
- storageKeyPrefix
- })
+ let childProps = {}
+ if (typeof child.type !== 'string') {
+ childProps = { storageKeyPrefix }
+ }
+ return React.cloneElement(child, childProps)
}
})
: children}
diff --git a/components/text.js b/components/text.js
index a67cafa5..80495d12 100644
--- a/components/text.js
+++ b/components/text.js
@@ -2,14 +2,15 @@ import styles from './text.module.css'
import ReactMarkdown from 'react-markdown'
import gfm from 'remark-gfm'
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'
-/* Use `…/dist/cjs/…` if you’re not in ESM! */
import { atomDark } from 'react-syntax-highlighter/dist/cjs/styles/prism'
import mention from '../lib/remark-mention'
import sub from '../lib/remark-sub'
import remarkDirective from 'remark-directive'
import { visit } from 'unist-util-visit'
import reactStringReplace from 'react-string-replace'
-import { useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
+import GithubSlugger from 'github-slugger'
+import Link from '../svgs/link.svg'
function myRemarkPlugin () {
return (tree) => {
@@ -28,19 +29,41 @@ function myRemarkPlugin () {
}
}
-export default function Text ({ topLevel, nofollow, children }) {
+function Heading ({ h, slugger, noFragments, topLevel, children, node, ...props }) {
+ const id = noFragments
+ ? undefined
+ : slugger.slug(children.reduce(
+ (acc, cur) => {
+ if (typeof cur !== 'string') {
+ return acc
+ }
+ return acc + cur.replace(/[^\w\-\s]+/gi, '')
+ }, ''))
+
+ return (
+