Files
openmonetis/components/calculadora/calculator.tsx
Felipe Coutinho 5bb5693baf feat(calculadora): adicionar dialog arrastável e seleção de valor
- Calculadora agora é arrastável via drag handle no header
- Novo callback onSelectValue permite inserir valor no campo de lançamento
- Ajustado subtitle de categorias e estilo do collapse na sidebar
- Atualizado snapshot drizzle

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-06 13:22:31 +00:00

83 lines
1.7 KiB
TypeScript

"use client";
import { CalculatorKeypad } from "@/components/calculadora/calculator-keypad";
import { Button } from "@/components/ui/button";
import { useCalculatorKeyboard } from "@/hooks/use-calculator-keyboard";
import { useCalculatorState } from "@/hooks/use-calculator-state";
import { CalculatorDisplay } from "./calculator-display";
type CalculatorProps = {
isOpen?: boolean;
onSelectValue?: (value: string) => void;
};
export default function Calculator({
isOpen = true,
onSelectValue,
}: CalculatorProps) {
const {
display,
operator,
expression,
history,
resultText,
copied,
buttons,
inputDigit,
inputDecimal,
setNextOperator,
evaluate,
deleteLastDigit,
reset,
applyPercent,
copyToClipboard,
pasteFromClipboard,
} = useCalculatorState();
useCalculatorKeyboard({
isOpen,
canCopy: Boolean(resultText),
onCopy: copyToClipboard,
onPaste: pasteFromClipboard,
inputDigit,
inputDecimal,
setNextOperator,
evaluate,
deleteLastDigit,
reset,
applyPercent,
});
const canUseValue = onSelectValue && display !== "Erro" && display !== "0";
const handleSelectValue = () => {
if (!onSelectValue) return;
const numericValue = Math.abs(Number(display)).toFixed(2);
onSelectValue(numericValue);
};
return (
<div className="space-y-4">
<CalculatorDisplay
history={history}
expression={expression}
resultText={resultText}
copied={copied}
onCopy={copyToClipboard}
/>
<CalculatorKeypad buttons={buttons} activeOperator={operator} />
{onSelectValue && (
<Button
type="button"
variant="default"
className="w-full"
disabled={!canUseValue}
onClick={handleSelectValue}
>
Usar valor
</Button>
)}
</div>
);
}