@@ -25,13 +25,10 @@ interface BoardInputProps {
2525// Tooltip component
2626function Tooltip ( { children, content } : { children : React . ReactNode ; content : string } ) {
2727 const [ show , setShow ] = useState ( false )
28-
28+
2929 return (
3030 < div className = "relative inline-block" >
31- < div
32- onMouseEnter = { ( ) => setShow ( true ) }
33- onMouseLeave = { ( ) => setShow ( false ) }
34- >
31+ < div onMouseEnter = { ( ) => setShow ( true ) } onMouseLeave = { ( ) => setShow ( false ) } >
3532 { children }
3633 </ div >
3734 < AnimatePresence >
@@ -40,11 +37,11 @@ function Tooltip({ children, content }: { children: React.ReactNode; content: st
4037 initial = { { opacity : 0 , y : - 10 } }
4138 animate = { { opacity : 1 , y : 0 } }
4239 exit = { { opacity : 0 , y : - 10 } }
43- className = "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 w-64 rounded-lg bg-neutral-900 p-3 text-xs text-white shadow-lg z-50 "
40+ className = "absolute bottom-full left-1/2 z-50 mb-2 w-64 -translate-x-1/2 rounded-lg bg-neutral-900 p-3 text-xs text-white shadow-lg"
4441 >
4542 < div className = "relative" >
4643 { content }
47- < div className = "absolute top-full left-1/2 -translate-x-1/2 w-0 h-0 border-l-[6px] border-r-[6px] border-t-[6px] border-l-transparent border-r-transparent border-t-neutral-900" />
44+ < div className = "absolute left-1/2 top-full h-0 w-0 -translate-x-1/2 border-l-[6px] border-r-[6px] border-t-[6px] border-l-transparent border-r-transparent border-t-neutral-900" />
4845 </ div >
4946 </ motion . div >
5047 ) }
@@ -56,8 +53,18 @@ function Tooltip({ children, content }: { children: React.ReactNode; content: st
5653// Info icon component
5754function InfoIcon ( ) {
5855 return (
59- < svg className = "w-4 h-4 text-neutral-400 hover:text-neutral-600 transition-colors" fill = "none" viewBox = "0 0 24 24" stroke = "currentColor" >
60- < path strokeLinecap = "round" strokeLinejoin = "round" strokeWidth = { 2 } d = "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
56+ < svg
57+ className = "h-4 w-4 text-neutral-400 transition-colors hover:text-neutral-600"
58+ fill = "none"
59+ viewBox = "0 0 24 24"
60+ stroke = "currentColor"
61+ >
62+ < path
63+ strokeLinecap = "round"
64+ strokeLinejoin = "round"
65+ strokeWidth = { 2 }
66+ d = "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
67+ />
6168 </ svg >
6269 )
6370}
@@ -76,7 +83,7 @@ export default function BoardInputEnhanced({
7683 const [ widthValue , setWidthValue ] = useState ( boardWidth . toString ( ) )
7784 const [ heightValue , setHeightValue ] = useState ( boardHeight . toString ( ) )
7885 const [ kerfValue , setKerfValue ] = useState ( kerf . toString ( ) )
79-
86+
8087 // Optimizer mode: 'standard', 'two-columns', 'advanced' - Default to 'two-columns'
8188 const [ optimizerMode , setOptimizerMode ] = useState < 'standard' | 'two-columns' | 'advanced' > (
8289 useAdvancedOptimizer ? 'advanced' : 'two-columns'
@@ -98,7 +105,7 @@ export default function BoardInputEnhanced({
98105 // Handle optimizer mode changes
99106 const handleOptimizerModeChange = ( mode : 'standard' | 'two-columns' | 'advanced' ) => {
100107 setOptimizerMode ( mode )
101-
108+
102109 switch ( mode ) {
103110 case 'standard' :
104111 onChange ( { forceTwoColumns : false , useAdvancedOptimizer : false } )
@@ -119,7 +126,7 @@ export default function BoardInputEnhanced({
119126 { /* Board dimensions */ }
120127 < div className = "space-y-3" >
121128 < div >
122- < div className = "flex items-center gap-2 mb-1 " >
129+ < div className = "mb-1 flex items-center gap-2" >
123130 < label className = "text-xs text-neutral-500" > Largeur</ label >
124131 < Tooltip content = "Largeur de la planche en millimètres. Standard: 1220, 1500, 1830, 2440mm" >
125132 < InfoIcon />
@@ -151,7 +158,7 @@ export default function BoardInputEnhanced({
151158 </ div >
152159
153160 < div >
154- < div className = "flex items-center gap-2 mb-1 " >
161+ < div className = "mb-1 flex items-center gap-2" >
155162 < label className = "text-xs text-neutral-500" > Longueur</ label >
156163 < Tooltip content = "Longueur de la planche en millimètres. Standard: 2440, 2750, 3050, 5000mm" >
157164 < InfoIcon />
@@ -183,7 +190,7 @@ export default function BoardInputEnhanced({
183190 </ div >
184191
185192 < div >
186- < div className = "flex items-center gap-2 mb-1 " >
193+ < div className = "mb-1 flex items-center gap-2" >
187194 < label className = "text-xs text-neutral-500" > Trait de scie</ label >
188195 < Tooltip content = "Épaisseur du trait de scie (kerf) en mm. Typique: 2-4mm pour scie circulaire, 0.5-1mm pour laser" >
189196 < InfoIcon />
@@ -217,15 +224,15 @@ export default function BoardInputEnhanced({
217224
218225 { /* Optimizer mode selection - Compact */ }
219226 < div className = "space-y-3 border-t border-neutral-100 pt-3" >
220- < div className = "flex items-center gap-2 mb -2" >
227+ < div className = "mb-2 flex items-center gap-2" >
221228 < label className = "text-xs font-medium text-neutral-600" > Mode d'optimisation</ label >
222229 </ div >
223-
230+
224231 < div className = "flex gap-2" >
225232 < motion . label
226- className = { `flex-1 cursor-pointer p-2 rounded-lg border transition-all text-center ${
227- optimizerMode === 'standard'
228- ? 'border-blue-400 bg-blue-50'
233+ className = { `flex-1 cursor-pointer rounded-lg border p-2 text-center transition-all ${
234+ optimizerMode === 'standard'
235+ ? 'border-blue-400 bg-blue-50'
229236 : 'border-neutral-200 hover:border-neutral-300'
230237 } `}
231238 whileTap = { { scale : 0.98 } }
@@ -239,15 +246,15 @@ export default function BoardInputEnhanced({
239246 < Tooltip content = "Algorithme de placement libre. Utilise plusieurs planches si nécessaire pour placer toutes les pièces." >
240247 < div >
241248 < div className = "text-xs font-medium text-neutral-900" > Standard</ div >
242- < div className = "text-[10px] text-neutral-500 mt-0.5 " > Placement libre</ div >
249+ < div className = "mt-0.5 text-[10px] text-neutral-500" > Placement libre</ div >
243250 </ div >
244251 </ Tooltip >
245252 </ motion . label >
246253
247254 < motion . label
248- className = { `flex-1 cursor-pointer p-2 rounded-lg border transition-all text-center ${
249- optimizerMode === 'two-columns'
250- ? 'border-blue-400 bg-blue-50'
255+ className = { `flex-1 cursor-pointer rounded-lg border p-2 text-center transition-all ${
256+ optimizerMode === 'two-columns'
257+ ? 'border-blue-400 bg-blue-50'
251258 : 'border-neutral-200 hover:border-neutral-300'
252259 } `}
253260 whileTap = { { scale : 0.98 } }
@@ -261,15 +268,15 @@ export default function BoardInputEnhanced({
261268 < Tooltip content = "Force 2 colonnes verticales pour simplifier la découpe. Idéal pour découpe manuelle." >
262269 < div >
263270 < div className = "text-xs font-medium text-neutral-900" > 2 colonnes</ div >
264- < div className = "text-[10px] text-neutral-500 mt-0.5 " > Découpe simple</ div >
271+ < div className = "mt-0.5 text-[10px] text-neutral-500" > Découpe simple</ div >
265272 </ div >
266273 </ Tooltip >
267274 </ motion . label >
268275
269276 < motion . label
270- className = { `flex-1 cursor-pointer p-2 rounded-lg border transition-all text-center ${
271- optimizerMode === 'advanced'
272- ? 'border-blue-400 bg-blue-50'
277+ className = { `flex-1 cursor-pointer rounded-lg border p-2 text-center transition-all ${
278+ optimizerMode === 'advanced'
279+ ? 'border-blue-400 bg-blue-50'
273280 : 'border-neutral-200 hover:border-neutral-300'
274281 } `}
275282 whileTap = { { scale : 0.98 } }
@@ -284,9 +291,11 @@ export default function BoardInputEnhanced({
284291 < div >
285292 < div className = "flex items-center justify-center gap-1" >
286293 < div className = "text-xs font-medium text-neutral-900" > Avancé</ div >
287- < span className = "text-[9px] px-1 py-0 bg-amber-100 text-amber-700 rounded font-medium" > BETA</ span >
294+ < span className = "rounded bg-amber-100 px-1 py-0 text-[9px] font-medium text-amber-700" >
295+ BETA
296+ </ span >
288297 </ div >
289- < div className = "text-[10px] text-neutral-500 mt-0.5 " > Multi-colonnes</ div >
298+ < div className = "mt-0.5 text-[10px] text-neutral-500" > Multi-colonnes</ div >
290299 </ div >
291300 </ Tooltip >
292301 </ motion . label >
@@ -295,7 +304,7 @@ export default function BoardInputEnhanced({
295304
296305 { /* Objective selection */ }
297306 < div className = "space-y-3 border-t border-neutral-100 pt-3" >
298- < div className = "flex items-center gap-2 mb-1 " >
307+ < div className = "mb-1 flex items-center gap-2" >
299308 < label className = "text-xs font-medium text-neutral-600" > Objectif prioritaire</ label >
300309 < Tooltip content = "Définit ce que l'algorithme cherche à optimiser en priorité" >
301310 < InfoIcon />
@@ -315,7 +324,7 @@ export default function BoardInputEnhanced({
315324 { /* Rotation option */ }
316325 < div className = "space-y-3 border-t border-neutral-100 pt-3" >
317326 < motion . label
318- className = "group flex cursor-pointer items-center justify-between p-3 rounded-lg border border-neutral-200 hover:border-neutral-300 transition-all "
327+ className = "group flex cursor-pointer items-center justify-between rounded-lg border border-neutral-200 p-3 transition-all hover:border-neutral-300"
319328 whileTap = { { scale : 0.98 } }
320329 >
321330 < div className = "flex items-center gap-3" >
@@ -327,15 +336,16 @@ export default function BoardInputEnhanced({
327336 />
328337 < div >
329338 < div className = "text-sm font-medium text-neutral-700" > Autoriser rotation 90°</ div >
330- < div className = "text-xs text-neutral-500" > Les pièces peuvent être tournées pour mieux s'adapter</ div >
339+ < div className = "text-xs text-neutral-500" >
340+ Les pièces peuvent être tournées pour mieux s'adapter
341+ </ div >
331342 </ div >
332343 </ div >
333344 < Tooltip content = "Permet aux pièces d'être pivotées de 90° pour optimiser le placement. Améliore généralement l'utilisation de +5-15%" >
334345 < InfoIcon />
335346 </ Tooltip >
336347 </ motion . label >
337348 </ div >
338-
339349 </ div >
340350 )
341- }
351+ }
0 commit comments