refactor: fix build

pixiv · Oct 19, 2023 · 6972f38 · 6972f38
1 parent 66dfc2b
commit 6972f38
Showing 1 changed file with 25 additions and 26 deletions.
diff --git a/docs/src/pages/@charcoal-ui/react/Popover/index.page.tsx b/docs/src/pages/@charcoal-ui/react/Popover/index.page.tsx
@@ -8,9 +8,32 @@ import { ApiTable } from '../_components/ApiTable'
 import { apiData } from './apiData'
 import { Button, Popover, PopoverProps, TextField } from '@charcoal-ui/react'
 import { useRef, useState } from 'react'
-import { Placement } from '@charcoal-ui/react/dist/components/Popover'
 import { PreviewsList } from '../_components/PreviewsList'
 
+function PreviewRenderer(props: PopoverProps) {
+  const [isOpen, setIsOpen] = useState(false)
+  const ref = useRef(null)
+  return (
+    <>
+      <Button ref={ref} onClick={() => setIsOpen(true)}>
+        {props.placement}
+      </Button>
+      {isOpen && (
+        <Popover
+          triggerRef={ref}
+          isOpen={isOpen}
+          onClose={() => setIsOpen(false)}
+          placement={props.placement}
+        >
+          <div style={{ padding: 8 }}>
+            <TextField label="text" showLabel assistiveText="assistiveText" />
+          </div>
+        </Popover>
+      )}
+    </>
+  )
+}
+
 const PopoverPage: NextPage<{ src: string }> = (props) => {
   return (
     <ContentRoot>
@@ -24,31 +47,7 @@ const PopoverPage: NextPage<{ src: string }> = (props) => {
 
       <PreviewsList
         renderer={(meta, _, __) => {
-          const [isOpen, setIsOpen] = useState(false)
-          const ref = useRef(null)
-          return (
-            <>
-              <Button ref={ref} onClick={() => setIsOpen(true)}>
-                {meta.props.placement}
-              </Button>
-              {isOpen && (
-                <Popover
-                  triggerRef={ref}
-                  isOpen={isOpen}
-                  onClose={() => setIsOpen(false)}
-                  placement={meta.props.placement as Placement}
-                >
-                  <div style={{ padding: 8 }}>
-                    <TextField
-                      label="text"
-                      showLabel
-                      assistiveText="assistiveText"
-                    />
-                  </div>
-                </Popover>
-              )}
-            </>
-          )
+          return <PreviewRenderer {...meta.props} />
         }}
         sections={[
           {