Releases: incluud/accessible-astro-components
Releases · incluud/accessible-astro-components
v5.0.1
Features
- layout: add hidden attribute styling to improve accessibility #125 (Mark Teekman)
Bug Fixes
- button: refactor CSS structure so hover styles are correctly applied #125 (Mark Teekman)
- link: refactor CSS structure so hover styles are correctly applied #125 (Mark Teekman)
- notification: refactor CSS structure so accent variant styles are correctly applied #125 (Mark Teekman)
- fieldset: refactor CSS to improve styling for invalid fieldsets #125 (Mark Teekman)
- input: refactor CSS to enhance styling for invalid input states #125 (Mark Teekman)
- textarea: refactor CSS to improve styling for invalid textarea states #125 (Mark Teekman)
- forms: update CSS selectors for better targeting #125 (Mark Teekman)
- notification: adjust icon positioning for improved alignment #125 (Mark Teekman)
v5.0.0
Forms, Primitives & Enhanced Design System
This major release introduces essential form components, primitive elements, and a comprehensive design system to provide a solid foundation for accessible web development.
⚠️ Breaking Changes
- components: Version 5.0.0 introduces new design system tokens and may require updates to existing implementations (Mark Teekman)
- styles: Comprehensive style system reorganization may affect custom styling implementations (Mark Teekman)
✨ Features
- Button: Add versatile Button component with customizable variants, sizes, and animations for improved user interaction #108 #123 (Mark Teekman)
- Heading: Introduce Heading primitive component for versatile heading levels with responsive typography #114 #123 (Mark Teekman)
- Link: Add Link component for internal and external navigation with accessibility features and hideIcon prop #115 #123 (Mark Teekman)
- Forms: Introduce comprehensive Forms suite including Form, Input, Textarea, Checkbox, Radio, and Fieldset components with validation and accessibility features #94 #123 (Mark Teekman)
- Card: Add full-height option, improved image handling, and Heading component integration #123 (Mark Teekman)
- AccordionItem: Add Heading component integration and improved heading props for better accessibility #123 (Mark Teekman)
- Modal: Integrate Heading component for enhanced accessibility and customizable heading properties #123 (Mark Teekman)
- Notification: Add accent variant support and selectable root element for greater customization #123 (Mark Teekman)
- Animations: Extend animation options to include 'nudge' animation for Badge, Button, and Link components #123 (Mark Teekman)
- Design System: Implement comprehensive design system with animations, colors, elevation, font, forms, layout, space, and utility styles #123 (Mark Teekman)
🐛 Bug Fixes
- Heading: Make level and size props optional for improved flexibility #123 (Mark Teekman)
- Link: Simplify external link logic for improved clarity and maintainability #123 (Mark Teekman)
- Tabs: Improve tab navigation accessibility by updating tabindex and aria-selected attributes #121 #123 (Mark Teekman)
- Components: Update default heading sizes and enhance accessibility across Form and Textarea components #123 (Mark Teekman)
- Notification: Update background color with fallback color for better compatibility #123 (Mark Teekman)
♿ Code Refactoring
- Modal: Enhance accessibility by updating aria attributes, improving trigger element handling, and removing focus-visible outline from close button #117 #118 #123 (Mark Teekman)
- Avatar: Enhance accessibility by updating alt text and aria-labels for better screen reader support #116 #123 (Mark Teekman)
- Notification: Replace
<aside>with<div>for correct accessibility, update ARIA role documentation, and add element prop for semantic HTML support #119 #120 #123 (Mark Teekman) - Card: Update default image URL since fakeimg.pl doesn't work anymore #112 #123 (Mark Teekman)
- Form: Implement secure regex pattern validation to enhance form input security and prevent ReDoS attacks #123 (Mark Teekman)
- SkipLink: Remove transition and focus-visible outline for improved accessibility #123 (Mark Teekman)
- Components: Remove unused CSS styles and fallback colors for cleaner code maintenance #123 (Mark Teekman)
📚 Documentation
- README: Expand component list with new additions and acknowledgments #123 (Mark Teekman)
🔧 Chores
- Package: Bump version to 5.0.0 for major updates and improvements #123 (Mark Teekman)
- Types: Add comprehensive type definitions for Button, Heading, Link, and form components #123 (Mark Teekman)
v4.1.3
Code Refactoring
- components: optimize CSS selectors using :where() for improved specificity and maintainability across components #113 (Mark Teekman)
- components: simplify CSS selectors in Card and Modal components by removing :where() to prevent unwanted behavior #113 (Mark Teekman)
Chores
- update package description and bump version to 4.1.3 for accessible-astro-components #113 (Mark Teekman)
v4.1.2
Bug Fixes
- types: update Badge component size prop documentation to use shorthand values ('sm', 'md', 'lg') #111 (Mark Teekman)
- notification: add fallback styles for inline and block sizes to improve compatibility across browsers #111 (Mark Teekman)
Code Refactoring
- components: flatten CSS structure for selectors and properties across Accordion, Avatar, Badge, Card, Modal, and Notification components #111 (Mark Teekman)
- Badge: remove unnecessary flex properties from circular badge styles for cleaner CSS #111 (Mark Teekman)
Chores
- bump version to 4.1.2 for accessible-astro-components #111 (Mark Teekman)
Commits
v4.1.1
Code Refactoring
- DarkMode: add children prop in TypeScript interface to prevent error for custom slot elements and enhance prop documentation #109 (Mark Teekman)
- Card: enhance image handling by adding support for Astro Image component and improving prop documentation #107 #109 (Mark Teekman)
- Badge: update animation types and enhance CSS utility classes for improved hover animation effects #109 (Mark Teekman)
- Badge: clamp animation intensity and enhance CSS variables for improved animation control #109 (Mark Teekman)
- Badge:
⚠️ breaking, changedbounceanimation tobouncingto prevent Tailwind conflict
Chores
- bump version to 4.1.1 for accessible-astro-components #109 (Mark Teekman)
v4.1.0
Features
- Badge: Add new Badge component with customizable styling and accessibility features #103 (Mark Teekman)
- Badge: Enhance with improved styling, interactivity, and hover/focus states #103 (Mark Teekman)
- Badge: Add pill style option and simplify pulse animation #103 (Mark Teekman)
- Badge: Add label prop for screen reader accessibility #103 (Mark Teekman)
- Avatar: Implement accessible Avatar component with type system, sizing options, and fallbacks #104 (Mark Teekman)
- AvatarGroup: Add component with condensed and grid display modes #104 (Mark Teekman)
- Notification: Update icon selector for better compatibility #103 (Mark Teekman)
Bug Fixes
- Avatar: Improve styling for initials with title/subtitle #104 (Mark Teekman)
- Avatar: Adjust subtitle margin calculation for better spacing #104 (Mark Teekman)
- Avatar: Remove unnecessary margin adjustment for subtitle #106 (Mark Teekman)
Documentation
- Types: Update TypeScript definitions for all components including Avatar and Badge #104 (Mark Teekman)
- Types: Enhance prop documentation with notes on additional HTML attributes #106 (Mark Teekman)
- Update README with information about new Avatar components #104 (Mark Teekman)
Code Refactoring
- Project Structure: Reorganize components and update import paths #103 (Mark Teekman)
- Types: Move types directory to src and update import paths #103 (Mark Teekman)
- Accessibility: Standardize on
.sr-onlyclass for visually hidden content #103 (Mark Teekman) - Badge: Update to use sm/md/lg sizing system and improve accessibility documentation #104 (Mark Teekman)
- Styling: Centralize color system and update components to use CSS variables #104 (Mark Teekman)
- Components: Update all components to follow prop ordering convention and add rest props #104 (Mark Teekman)
- Avatar: Encapsulate size logic in a dedicated function for improved readability #106 (Mark Teekman)
- Avatar: Enhance image loading performance with lazy loading and improve font sizing with clamp #106 (Mark Teekman)
- Components: Implement CodeRabbit suggestions for various improvements #104 (Mark Teekman)
- Components: Update to improve prop typing and enhance accessibility #106 (Mark Teekman)
Chores
- Version: Bump to 4.1.0 for new Avatar and Badge components #106 (Mark Teekman)
v4.0.3
Commits
- 4f5cf9b: Bump to v4.0.3 (@peterpadberg)
- eceaa78: Fix skiplink in ts dict (@peterpadberg)
- 2483d5b: Fix package version in lock file (@peterpadberg)
v4.0.2
Bug Fixes
- breadcrumbs: make
ariaLabelprop optional and align with type definitions #100 (Mark Teekman) - breadcrumbsitem: improve icon alignment for custom separators #100 (Mark Teekman)
- card: enhance component structure with proper empty states and footer handling #100 (Mark Teekman)
- notification: use correct icon targeting in CSS #100 (Mark Teekman)
- tabspanel: add some default spacing between tab panel content #100 (Mark Teekman)
- tabstab: add more padding to tab buttons #100 (Mark Teekman)
Documentation
- readme: update README projects description #100 (Mark Teekman)
- 87df982: Update README.md #99 (Denis Paris)
Chores
- packages: add Astro as a dependency for better TypeScript support #100 (Mark Teekman)
- release: bump version #100 (Mark Teekman)
v4.0.1
Bug fixes
- fix: rename
SkipLinkstoSkipLinkin exports and bump version to 4.0.1 (@markteekman)
v4.0.0
Customizability, Robustness & Modern Web
This major release focuses on making components more robust, customizable, and performant while improving accessibility and internationalization support. We also moved the package to our new Incluud organisation as part of the effort to streamline our development processes and enhance collaboration within the community. This transition allows us to better manage contributions, improve project visibility, and ensure a more cohesive approach to future updates and features.
🎯 Key Highlights
- Modernized CSS architecture with logical properties and modern selectors
- Enhanced accessibility and internationalization support
- Improved performance through better browser APIs
- Improved TypeScript support
⚠️ Breaking Changes
- Removed
is:global()styles to prevent style creep #90 - Simplified class names and introduced
:where()for lower specificity - Switched to logical properties for better RTL support
- Migrated to HSL colors with
light-dark()functions - Reduced client-side JavaScript in favor of browser APIs
- Renamed
SkipLinkstoSkipLink
🎨 Design System Updates
- Standardized component styling with consistent tokens
- Improved dark mode support with
light-dark()color system - Added
prefers-reduced-motionsupport - Enhanced focus states and keyboard navigation
✨ New Features
- Added
Videocomponent with YouTube embed support - Universal
classprop support for all components - Improved i18n support through customizable text props
- Enhanced slot system for better component composition
🔄 Component Updates
Accessibility & UX
Accordion: Added proper heading structure supportBreadcrumbs: Added icon-only support with screen reader textCard: Now uses<article>instead of<div>SkipLink: Added translatable text supportNotification: Switched to semantic<aside>with ARIA live regions
Enhanced Customization
Accordion: Added chevron variant with configurable positioningAccordion: Addedopenprop for an initial open state for an itemBreadcrumbs: Added customizable separatorsCard: Added meta information slotDarkMode: Added support for custom iconsModal: Improved styling and interaction patternsNotification: Added Starlight-inspired color schemesPagination: Enhanced styling options
📚 Documentation
- New documentation site at Accessible Astro Docs #75
- Added migration guide from v3 to v4
- Improved component examples and usage guidelines