engineering/tpmjs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2.0k

fix: resolve ESLint errors and apply formatting

Browse source 
- Remove onClick handler from Switch label (accessibility fix)
- Fix React Hook conditional usage in useControlled
- Remove unnecessary isControlled dependency from useCallback
- Apply Biome formatting (template literals, className simplification)
- Fix playground Checkbox/Switch onChange usage

All CI checks should now pass: lint, type-check, format-check, build.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ajax Davis 2025-11-27 02:29:18 +10:00
parent 535717e34f
commit c521c4a1e1
3 changed files with 32 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

12
packages/ui/src/Switch/Switch.tsx
View file

@ -178,13 +178,6 @@ export const Switch = forwardRef<HTMLButtonElement, SwitchProps>(
labelPosition === 'left' ? 'mr-2' : 'ml-2',
(disabled || loading) && 'cursor-not-allowed opacity-50'
)}
onClick={(e) => {
// Prevent label from triggering button click (button handles it)
e.preventDefault();
if (!disabled && !loading) {
handleClick();
}
}}
>
{label}
</label>
@ -192,10 +185,7 @@ export const Switch = forwardRef<HTMLButtonElement, SwitchProps>(
return (
<div
className={cn(
'inline-flex items-center',
(disabled || loading) && 'cursor-not-allowed'
)}
className={cn('inline-flex items-center', (disabled || loading) && 'cursor-not-allowed')}
>
{labelPosition === 'left' && labelElement}
{switchButton}

36
packages/ui/src/system/useControlled.ts
View file

@ -48,31 +48,27 @@ export function useControlled<T>({
// Use controlled value if provided, otherwise use internal state
const value = isControlled ? controlled : valueState;
// Track previous controlled state for dev warning
const prevControlledRef = useRef(isControlled);
// Dev warning for switching between controlled and uncontrolled
if (process.env.NODE_ENV !== 'production') {
// biome-ignore lint/correctness/useHookAtTopLevel: dev-only warning
useRef(() => {
if (isControlled !== (controlled !== undefined)) {
console.error(
`Warning: A component (\`${name}\`) is changing from ${
isControlled ? 'controlled' : 'uncontrolled'
} to ${isControlled ? 'uncontrolled' : 'controlled'}. ` +
'Components should not switch from controlled to uncontrolled (or vice versa). ' +
'Decide between using a controlled or uncontrolled component for the lifetime of the component.'
);
}
});
if (prevControlledRef.current !== (controlled !== undefined)) {
console.error(
`Warning: A component (\`${name}\`) is changing from ${
prevControlledRef.current ? 'controlled' : 'uncontrolled'
} to ${prevControlledRef.current ? 'uncontrolled' : 'controlled'}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled component for the lifetime of the component.`
);
}
prevControlledRef.current = controlled !== undefined;
}
// Callback to update the value
const setValueIfUncontrolled = useCallback(
(newValue: T) => {
if (!isControlled) {
setValue(newValue);
}
},
[isControlled]
);
const setValueIfUncontrolled = useCallback((newValue: T) => {
if (!isControlled) {
setValue(newValue);
}
}, []);
return [value as T, setValueIfUncontrolled];
}