From 6972f38013b52e6aa5543d9e3769076f377c0519 Mon Sep 17 00:00:00 2001
From: toshusai <toshusai.net@gmail.com>
Date: Thu, 19 Oct 2023 13:00:34 +0900
Subject: [PATCH] refactor: fix build

---
 .../@charcoal-ui/react/Popover/index.page.tsx | 51 +++++++++----------
 1 file changed, 25 insertions(+), 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
index ae2324b3b..08cd84ef9 100644
--- 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={[
           {