React Checkbox Pro 1.5.1

React Checkbox Pro 1.5.1: Enhanced Accessibility and Documentation

We're excited to announce the release of React Checkbox Pro 1.5.1! This release focuses on improving accessibility and enhancing our documentation to provide a better developer experience.

🎯 Accessibility Improvements

1. Enhanced Focus Ring

We've updated the focus ring styling to provide better visibility for keyboard navigation. The new focus ring is more prominent and follows modern accessibility guidelines.

// The focus ring is now more visible by default
<Checkbox>
  Accessible Checkbox
</Checkbox>
 
// Custom focus ring styles
<Checkbox
  className="focus:ring-blue-500 focus:ring-offset-2"
>
  Custom Focus Ring
</Checkbox>

Improved ARIA attributes and screen reader announcements for a better experience with assistive technologies.

// Enhanced ARIA labels
<Checkbox
  aria-label="Subscribe to newsletter"
  aria-describedby="newsletter-description"
>
  Subscribe
</Checkbox>
 
// With description
<div>
  <Checkbox id="terms">Accept Terms</Checkbox>
  <p id="terms-description">
    By checking this box, you agree to our terms of service
  </p>
</div>

📚 Documentation Enhancements

1. New Examples and Best Practices

We've added more comprehensive examples showcasing different use cases and implementation patterns.

// Form validation example
function SubscriptionForm() {
  const [error, setError] = useState('')
  
  return (
    <form>
      <Checkbox
        required
        error={error}
        helperText={error}
        onChange={(checked) => {
          setError(checked ? '' : 'This field is required')
        }}
      >
        Subscribe to updates
      </Checkbox>
    </form>
  )
}
 
// Complex group example
function PreferenceGroup() {
  return (
    <CheckboxGroup
       defaultValue={["apple"]}
       onChange={(values) => console.log("Selected fruits:", values)}
    >
      <Checkbox value="apple">Apple</Checkbox>
      <Checkbox value="banana">Banana</Checkbox>
      <Checkbox value="cherry">Cherry</Checkbox>
    </CheckboxGroup>
  )
}

2. Accessibility Guidelines

New documentation section dedicated to accessibility best practices:

Keyboard navigation patterns
Screen reader considerations
Color contrast requirements
Focus management strategies

🚀 Getting Started

To upgrade to version 1.5.1, run:

npm install react-checkbox-pro
 
# or using pnpm
pnpm add react-checkbox-pro
 
# or using bun
bun add react-checkbox-pro

What's Next?

We're continuously working on improving React Checkbox Pro. Our next focus areas include:

More animation options
Additional customization features
Enhanced form library integrations

For detailed documentation and examples, visit our documentation site.

Thank you for using React Checkbox Pro! Your feedback and suggestions are always welcome on our GitHub repository.