dev #551

Merged
ysCha merged 2 commits from dev into dev-deploy 2026-01-06 13:47:04 +09:00
3 changed files with 75 additions and 8 deletions

View File

@ -1,4 +1,4 @@
import React, { useState, useRef, useEffect, forwardRef } from 'react'
import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from 'react'
import { createCalculator } from '@/util/calc-utils'
import '@/styles/calc.scss'
@ -294,9 +294,11 @@ export const CalculatorInput = forwardRef(
} else {
calculator.currentOperand = filteredValue
setHasOperation(false)
// onChange
onChange(filteredValue)
}
onChange(filteredValue)
//onChange(filteredValue)
}
}

View File

@ -452,7 +452,16 @@ export const Orientation = forwardRef((props, ref) => {
className="input-origin block"
value={inputCompasDeg}
readOnly={!hasAnglePassivity}
onChange={(value) => setInputCompasDeg(value)}
onChange={(value) => {
// Convert to number and ensure it's within -180 to 180 range
const numValue = parseInt(value, 10);
if (!isNaN(numValue)) {
const clampedValue = Math.min(180, Math.max(-180, numValue));
setInputCompasDeg(String(clampedValue));
} else {
setInputCompasDeg(value);
}
}}
options={{
allowNegative: true,
allowDecimal: false

View File

@ -11,9 +11,44 @@ export default function OuterLineWall({ props }) {
const { length1, setLength1, length1Ref, arrow1, setArrow1 } = props
const resetCalculatorValue = () => {
// 1. 0
setLength1(0);
if (length1Ref.current) {
// 2. input UI
length1Ref.current.focus();
length1Ref.current.value = '';
// 3. UI
setTimeout(() => {
const acButton = document.querySelector('.keypad-btn.ac, .btn-ac') ||
Array.from(document.querySelectorAll('button')).find(el => el.textContent === 'AC');
if (acButton) {
acButton.click();
} else {
// input Enter/Escape
length1Ref.current.dispatchEvent(new Event('input', { bubbles: true }));
}
// ()
length1Ref.current.focus();
}, 10);
}
}
//
useEffect(() => {
const handleKeyDown = (e) => {
if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
//
setTimeout(() => {
resetCalculatorValue();
}, 0);
return;
}
//
const keypadVisible = document.querySelector('.keypad-container')
@ -88,37 +123,58 @@ export default function OuterLineWall({ props }) {
}}
/>
</div>
<button className="reset-btn" onClick={() => setLength1(0)}></button>
<button
className="reset-btn"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
resetCalculatorValue()
}}
></button>
</div>
<div className="outline-form">
<span>{getMessage('modal.cover.outline.arrow')}</span>
<div className="grid-direction">
<button
className={`direction up ${arrow1 === '↑' ? 'act' : ''}`}
onClick={() => {
onClick={(e) => {
setArrow1('↑')
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp' }))
e.preventDefault();
e.stopPropagation();
resetCalculatorValue()
}}
></button>
<button
className={`direction down ${arrow1 === '↓' ? 'act' : ''}`}
onClick={() => {
onClick={(e) => {
setArrow1('↓')
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
e.preventDefault();
e.stopPropagation();
resetCalculatorValue()
}}
></button>
<button
className={`direction left ${arrow1 === '←' ? 'act' : ''}`}
onClick={() => {
onClick={(e) => {
setArrow1('←')
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))
e.preventDefault();
e.stopPropagation();
resetCalculatorValue()
}}
></button>
<button
className={`direction right ${arrow1 === '→' ? 'act' : ''}`}
onClick={() => {
onClick={(e) => {
setArrow1('→')
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight' }))
e.preventDefault();
e.stopPropagation();
resetCalculatorValue()
}}
></button>
</div>