function CssInputArea({ name, placeholder, value, onChange }) { return /*#__PURE__*/ React.createElement("textarea", { name: name, className: "w-full h-[200px] bg-gray-100 p-2 border border-gray-300 rounded-md", placeholder: placeholder, value: value, onChange: onChange, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function CssInputAreaStory() { const [cssContent, setCssContent] = React.useState(''); return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(CssInputArea, { name: "css", placeholder: "CSSを入力", value: cssContent, onChange: (e)=>setCssContent(e.target.value), __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function MainComponent() { const [htmlContent, setHtmlContent] = React.useState(''); const [cssContent, setCssContent] = React.useState(''); const [jsContent, setJsContent] = React.useState(''); const iframeRef = React.useRef(null); React.useEffect(()=>{ if (iframeRef.current) { const iframeDocument = iframeRef.current.contentDocument; iframeDocument.open(); iframeDocument.write(` ${htmlContent}

私たちのカフェへようこそ