function MainComponent({ input, onInputChange, onButtonClick, onClear, onCalculate, onTaxIncluded, onTaxExcluded, taxRate, onTaxRateChange, result, error, onChatGptRequest, loading, chatGptResult }) { return /*#__PURE__*/ React.createElement("div", { className: "p-4 max-w-[400px] mx-auto border border-gray-300 rounded", __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { name: "input", value: input, onChange: onInputChange, className: "w-full p-2 border border-gray-400 rounded font-roboto", placeholder: "Enter calculation", "aria-label": "Calculator Input", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-red-500 font-roboto", __source: { fileName: "", lineNumber: 29, columnNumber: 17 }, __self: this }, error), result && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-green-500 font-roboto", __source: { fileName: "", lineNumber: 30, columnNumber: 18 }, __self: this }, result), loading && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-blue-500 font-roboto", __source: { fileName: "", lineNumber: 31, columnNumber: 19 }, __self: this }, "Loading..."), chatGptResult && /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-purple-500 font-roboto", __source: { fileName: "", lineNumber: 32, columnNumber: 25 }, __self: this }, chatGptResult), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-4 gap-2 mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, [ 7, 8, 9, 4, 5, 6, 1, 2, 3, 0 ].map((num)=>/*#__PURE__*/ React.createElement("button", { key: num, className: "p-2 bg-gray-200 rounded font-roboto", onClick: ()=>onButtonClick(num.toString()), __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, num)), [ '+', '-', '*', '/' ].map((op)=>/*#__PURE__*/ React.createElement("button", { key: op, className: "p-2 bg-gray-200 rounded font-roboto", onClick: ()=>onButtonClick(op), __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, op))), /*#__PURE__*/ React.createElement("button", { className: "w-full p-2 mb-2 bg-red-500 text-white rounded font-roboto", onClick: onClear, __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, "Clear"), /*#__PURE__*/ React.createElement("button", { className: "w-full p-2 mb-2 bg-blue-500 text-white rounded font-roboto", onClick: onCalculate, __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this }, "Calculate"), /*#__PURE__*/ React.createElement("button", { className: "w-full p-2 mb-2 bg-yellow-500 text-white rounded font-roboto", onClick: onChatGptRequest, __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, "ChatGPT"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 62, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { name: "taxRate", value: taxRate, onChange: onTaxRateChange, className: "w-full p-2 border border-gray-400 rounded font-roboto", placeholder: "Enter tax rate (%)", "aria-label": "Tax Rate Input", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "w-full p-2 mb-2 bg-green-500 text-white rounded font-roboto", onClick: onTaxIncluded, __source: { fileName: "", lineNumber: 72, columnNumber: 7 }, __self: this }, "Tax Included"), /*#__PURE__*/ React.createElement("button", { className: "w-full p-2 mb-2 bg-green-500 text-white rounded font-roboto", onClick: onTaxExcluded, __source: { fileName: "", lineNumber: 75, columnNumber: 7 }, __self: this }, "Tax Excluded")); } function StoryComponent() { const [input1, setInput1] = React.useState(''); const [input2, setInput2] = React.useState('12+8'); const [input3, setInput3] = React.useState('10/0'); const [taxRate1, setTaxRate1] = React.useState(''); const [taxRate2, setTaxRate2] = React.useState('10'); const [taxRate3, setTaxRate3] = React.useState('10'); const [result1, setResult1] = React.useState(''); const [result2, setResult2] = React.useState('20'); const [result3, setResult3] = React.useState(''); const [error1, setError1] = React.useState(''); const [error2, setError2] = React.useState(''); const [error3, setError3] = React.useState('Error: Division by zero'); const [loading1, setLoading1] = React.useState(false); const [loading2, setLoading2] = React.useState(false); const [loading3, setLoading3] = React.useState(false); const [chatGptResult1, setChatGptResult1] = React.useState(''); const [chatGptResult2, setChatGptResult2] = React.useState(''); const [chatGptResult3, setChatGptResult3] = React.useState(''); const handleInputChange = (setInput)=>(e)=>setInput(e.target.value); const handleTaxRateChange = (setTaxRate)=>(e)=>setTaxRate(e.target.value); const handleButtonClick = (setInput, input)=>(value)=>setInput(input + value); const handleClear = (setInput, setResult, setError)=>()=>{ setInput(''); setResult(''); setError(''); }; const handleCalculate = (input, setResult, setError)=>()=>{ try { if (eval(input) === Infinity) throw new Error("Division by zero"); setResult(eval(input).toString()); setError(''); } catch (e) { setError(`Error: ${e.message}`); } }; const handleTaxIncluded = (input, taxRate, setResult)=>()=>{ const calcResult = eval(input); const taxIncluded = calcResult + calcResult * parseFloat(taxRate) / 100; setResult(taxIncluded.toString()); }; const handleTaxExcluded = (input, taxRate, setResult)=>()=>{ const calcResult = eval(input); const taxExcluded = calcResult / (1 + parseFloat(taxRate) / 100); setResult(taxExcluded.toString()); }; const handleChatGptRequest = (input, setLoading, setChatGptResult, setError)=>async ()=>{ setLoading(true); try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: input } ], system_prompt: 'Explain this calculation' }) }); const data = await response.json(); setChatGptResult(data.choices[0].message.content); setLoading(false); } catch (e) { setError(`Error: ${e.message}`); setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 157, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { input: input1, onInputChange: handleInputChange(setInput1), onButtonClick: handleButtonClick(setInput1, input1), onClear: handleClear(setInput1, setResult1, setError1), onCalculate: handleCalculate(input1, setResult1, setError1), onTaxIncluded: handleTaxIncluded(input1, taxRate1, setResult1), onTaxExcluded: handleTaxExcluded(input1, taxRate1, setResult1), taxRate: taxRate1, onTaxRateChange: handleTaxRateChange(setTaxRate1), result: result1, error: error1, onChatGptRequest: handleChatGptRequest(input1, setLoading1, setChatGptResult1, setError1), loading: loading1, chatGptResult: chatGptResult1, __source: { fileName: "", lineNumber: 158, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { input: input2, onInputChange: handleInputChange(setInput2), onButtonClick: handleButtonClick(setInput2, input2), onClear: handleClear(setInput2, setResult2, setError2), onCalculate: handleCalculate(input2, setResult2, setError2), onTaxIncluded: handleTaxIncluded(input2, taxRate2, setResult2), onTaxExcluded: handleTaxExcluded(input2, taxRate2, setResult2), taxRate: taxRate2, onTaxRateChange: handleTaxRateChange(setTaxRate2), result: result2, error: error2, onChatGptRequest: handleChatGptRequest(input2, setLoading2, setChatGptResult2, setError2), loading: loading2, chatGptResult: chatGptResult2, __source: { fileName: "", lineNumber: 174, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { input: input3, onInputChange: handleInputChange(setInput3), onButtonClick: handleButtonClick(setInput3, input3), onClear: handleClear(setInput3, setResult3, setError3), onCalculate: handleCalculate(input3, setResult3, setError3), onTaxIncluded: handleTaxIncluded(input3, taxRate3, setResult3), onTaxExcluded: handleTaxExcluded(input3, taxRate3, setResult3), taxRate: taxRate3, onTaxRateChange: handleTaxRateChange(setTaxRate3), result: result3, error: error3, onChatGptRequest: handleChatGptRequest(input3, setLoading3, setChatGptResult3, setError3), loading: loading3, chatGptResult: chatGptResult3, __source: { fileName: "", lineNumber: 190, columnNumber: 7 }, __self: this })); }