Releases · agriculturegovau/agds-next

Update TableRow’s onClick to disable firing the row function when clicking on a label element.
Add pointer cursor for clickable rows in fixed tables.
Fix TableRow’s selected and hover styles not getting applied when an incorrect tableLayout is set.

Build

Remove sharp and puppeteer dependencies.
Update node version to 22.15.1.

Released packages

"@ag.ds-next/react": "1.29.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

13 May 06:46

stowball

@ag.ds-next/[email protected]

9d538f9

AgDS Beta v1.28.0 release

Updates

App layout

Scale and transition Menu, Close and Dropdown icons on hover.

Button

Hide icons when loading.
Scale and transition iconAfter and iconBefore on hover.

Call to action

Scale and transition icon on hover.

Conditional field container

Initial release of component.

Date picker

Update react-day-picker dependency to support React 19.
Fix hover styles not appearing on some dates.
Scale and transition button icons on hover.

Date picker next

Update react-day-picker dependency to support React 19.
Fix hover styles not appearing on some dates.
Scale and transition button icons on hover.

Date range picker

Update react-day-picker dependency to support React 19.
Fix bug where aria-selected was added to dates between selected ranges.
Changing the end date will now attempt to focus on the current end date on the calendar.
Scale and transition button icons on hover.

Date range picker next

Update react-day-picker dependency to support React 19.
Fix bug where aria-selected was added to dates between selected ranges.
Changing the end date will now attempt to focus on the current end date on the calendar.
Scale and transition button icons on hover.

Details

Scale and transition chevron on hover.

Direction link

Scale and transition icons on hover.

Dropdown menu

Scale and transition chevron on hover.

Feature link list

Scale and transition chevron on hover.

Filter sidebar

Scale and transition CollapsingSideBar chevron on hover.

Icon

Add new CodeIcon.
Update documentation to include more information and guidance on usage, sizes and
positioning.

Main nav

Scale and transition Menu, Close and Dropdown icons on hover.

Pagination

Scale and transition icons on hover.

Progress indicator

Scale and transition CollapsingSideBar chevron on hover.

Section alert

Update description and “Do” guidance.

Side nav

Scale and transition CollapsingSideBar chevron on hover.
Vertically align nested sub-level chevron to text.

Table

Scale and transition sortable icons on hover.

Build

Add React 19 as an allowed peer dependency.
Update prism-react-renderer.

Other docs

Fix various React and deprecation warnings throughout examples.
Remove roadmap page.
Update conditional reveal pattern page and example code.
Add relatedPatterns link section to patterns page.
Update section alert guidance in Patterns > Messaging.

Example site

Update conditional reveal pattern.

yourgov

Update conditional reveal pattern.
Fix error for staff with no training when filtering by trainingCompleted.

Released packages

"@ag.ds-next/react": "1.28.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

22 Apr 06:28

stowball

@ag.ds-next/[email protected]

38a591b

AgDS Beta v1.27.0 release

Updates

Accordion

Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

App layout

AppLayoutSidebar: Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

Card

Add footer and header props to provide better control of rendering footers and headers.
Add footerOutside prop to render footers outside the visible card.
Fix card layout so the heights stretch and match when in flex/grid lists.
Fix CardLink not applying focus ring when clickable is false.
Fix CardLink to only take up the full card when clickable is true.

Checkbox

Fix input not scrolling into view when receiving focus.
Make screen reader virtual cursor match visible control.

Core

Add useTransitionHeight hook to allow transitioning the height and display of content.

Divider with text

Initial release of component.

Drawer

Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

File upload

Update the download type for existing and uploaded files to also support strings.
Update rejected files’ SectionAlert tone to 'errorHigh'.

Filter sidebar

Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

Icon

Revert WarningIcon to previous version to fix missing path.

Progress indicator

Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

Radio

Fix input not scrolling into view when receiving focus.
Make screen reader virtual cursor match visible control.

Section alert

Add Info and various “Progress” tones.
Add High, Medium and Low variants to appropriate tones.
Map legacy success, error and warning tones to successHigh, errorHigh and warningHigh respectively.

Side nav

Remove react-spring and use native CSS transitions to fix React 19/Strict mode issues.

Table

Add onClick prop to TableRow.
Add background prop to TableRow.
Fix invalid not overriding striped background.

Build

Add exports field to support importing in Node ESM environments and add ESM build for bundlers.
Move facepaint to a normal dependency.
Update dependencies.

Other docs

Update all SectionAlert tones to tones with emphasis.

yourgov

Update all SectionAlert tones to tones with emphasis.

Released packages

"@ag.ds-next/react": "1.27.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

21 Mar 00:22

stowball

@ag.ds-next/[email protected]

e61c129

AgDS Beta v1.26.0 release

Updates

Accordion

Fix all act/state warnings in tests.

AG branding

Update all theme colours to be consistent, 6 character hex codes.

App layout

AppLayoutFooter: Add maxWidth='container|containerLg' prop.
AppLayoutSidebarNav: Update to cater for additional native mouse events on links and buttons.

Autocomplete

Fix all act/state warnings in tests.

Box

Hide internal hash URLs for print media.

Button

Add TypeScript support for native onMouseEnter, onMouseLeave, onMouseOut and onMouseOver events to BaseButton.
Use exactColor to improve visuals when printing.
docs: Add guidance about customising loadingLabel.

Callout

docs: Remove callout in control group as we no longer support this pattern.

Combobox

Fix all act/state warnings in tests.

Content

Add maxWidth='container|containerLg' prop to all content components.

Core

Add new 'containerLg' maxWidth token.
Allow maxWidth prop to pick from maxWidth tokens.
Add TypeScript support for native onClick, onMouseEnter, onMouseLeave, onMouseOut and onMouseOver events to LinkProps.
Add new exactColor print pack.
Add new hideHref print pack to prevent a link’s href from being appended when printed.
Update all theme colours to be consistent, 6 character hex codes.

Date picker

Add superseded announcement.
Add aria-expanded attribute to button.
Make the example date more relevant.
Fix Escape keydown listener so it doesn’t close a parent Drawer.
Fix all act/state warnings in tests.

Date picker next

Initial release of component.

Date range picker

Add superseded announcement.
Add aria-expanded attribute to button.
Make the example date more relevant.
Fix 2nd calendar dropdown updating to the wrong calendar.
Fix Escape keydown listener so it doesn’t close a parent Drawer.
Fix all act/state warnings in tests.

Date range picker next

Initial release of component.

Drawer

Remove deprecated, internal onDismiss prop on DrawerDialog.
Change deprecation warnings to not appear in production environments.
Fix all act/state warnings in tests.
docs: Add DatePickerNext to form example.

Dropdown menu

Add event argument to onClick function prop.
Fix all act/state warnings in tests.

File input

Fix button click not firing when ref is passed.
Fix focus management.

File upload

Hide existing file URLs for print media.
Add download support for uploaded and existing files.

Footer

Add maxWidth='container|containerLg' prop.

Global alert

Use exactColor to improve visuals when printing.
Change deprecation warnings to not appear in production environments.

Header

Add maxWidth='container|containerLg' prop.

Icon

Add new icons: ArchiveIcon, BusinessIcon, ClockIcon, EmailOpenIcon, FlagFilledIcon, FlagIcon, GripIcon, HistoryIcon, MoveLeftIcon, MoveRightIcon, ProgressNotRequiredIcon, RotateLeftIcon, RotateRightIcon,
StarFilledIcon, StarIcon, TimerIcon, ZoomInIcon and ZoomOutIcon.
Minify icons: AlertFilledIcon, AlertIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpDownIcon, ArrowUpIcon, AvatarIcon,
CalendarIcon, ChartBarIcon, ChartLineIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, CloseIcon, CopyIcon, DeleteIcon, DownloadIcon, EditIcon, EmailIcon, ExitIcon, ExternalLinkIcon, FacebookIcon, FactoryIcon, FileIcon, FilterIcon, HelpIcon, HomeIcon, InboxIcon, InfoFilledIcon, InfoIcon, InstagramIcon, LinkedInIcon, MenuIcon, MinusIcon, PauseIcon, PlayIcon, PlusIcon, PrintIcon, ProgressDoingIcon, SearchIcon, SuccessFilledIcon, ThumbsDownIcon, ThumbsUpIcon, TwitterIcon, UploadIcon, WarningIcon, WebsiteIcon and XIcon.

Indicator dot

Use exactColor to improve visuals when printing.

List

docs: Fix examples.

Loading

Announce 'fullscreen' LoadingBlanket assertively.
Use exactColor to improve visuals when printing.

Main nav

Add maxWidth='container|containerLg' prop.
Update MainNavList to cater for additional native mouse events on links and buttons.

Modal

Remove deprecated, internal onDismiss prop on ModalDialog.
Change deprecation warnings to not appear in production environments.
Fix all act/state warnings in tests.

Notification badge

Use exactColor to improve visuals when printing.

Page alert

Change deprecation warnings to not appear in production environments.
Use exactColor to improve visuals when printing.

Pagination

Hide URLs for print media.

Password input

Fix all act/state warnings in tests.

Search input

Fix all act/state warnings in tests.

Section alert

Change deprecation warnings to not appear in production environments.

Side nav

Fix all act/state warnings in tests.

Status badge

Update to match design and remove the unnecessary whitespace that was being added below.
Remove emphasis from icon announcement.

Switch

Use exactColor to improve visuals when printing.

Table

Add onMouseEnter, onMouseLeave, onMouseOut and onMouseOver props.
Update onClick to match BaseButton’s signature.

Tabs

Use exactColor to improve visuals when printing.
Fix all act/state warnings in tests.

Task list

Add new 'notRequired' status.

Time input

Fix all act/state warnings in tests.

Time picker

Fix all act/state warnings in tests.

Toggle button

Initial release of component.

Other docs

Make packs available for use in code snippets and playroom.
patterns: Fixed Card link in Search filters page.
Remove unused react-simple-code-editor.
Update Storybook to version 8, update NextJS and Playroom to latest minor version.

Build

Dependency updates.

yourgov

Updated release of complex example application to showcase various patterns.

Released packages

"@ag.ds-next/react": "1.26.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

09 Dec 03:53

stowball

@ag.ds-next/[email protected]

73ef00c

AgDS Beta v1.25.0 release

Updates

App layout

Ensure focus ring is not cut off by the screen edge and sibling links.
Add aria attributes to mobile menu button to improve state announcement.
AppLayoutHeader: Wrap accountDetails when space is limited.
docs: Explain in more detail the reasons for choosing each sub-level items option.

Autocomplete

Announce loading and error states to screen readers.
docs: Improve ‘Do’ and ‘Don’t’ guidance.
docs: Improve Invalid guidance and example.

Avatar

Add colour section to docs, showcasing dark and light palette variants.

Box

Improve performance by separating style props and memoising.

Breadcrumbs

Update accessible name for collapsible (…) button to be more descriptive.
docs: Improve guidance around correct usage of breadcrumbs.

Button

Improve appearance and experience for high contrast users.

Callout

docs: Add title section with link to semantic headings.
docs: Change conditionally revealed guidance to within-accordion, rather than within-radio. Add Colour section to indicate palette options.

Card

docs: Add ‘Do’ item relating to wrapping cards in a list.
docs: Include colour section, and ensure lists are marked up semantically.

Checkbox

Add explicit for/id association between input and label to improve accessibility.
Change focus ring to use :focus instead of :focus-visible.
Improve appearance and experience for high contrast users.

Combobox

Improve performance of option rendering, filtering and string matching.
Announce loading and error states to screen readers.
Prevent iOS ‘Done’ button from closing dropdown.
Fix announcement of options iOS VoiceOver.
Fix accessing options in Android TalkBack.
Simplify required now its Field allows undefined.
ComboboxMulti: Enable iOS screen reader users to delete individual selections.
ComboboxMulti: Correctly announce selection and removal of items.
ComboboxMulti: Prevent users from being able to focus the chip to remove it - removal only available from the (x) button.
docs: Improve Invalid guidance and example.

Date picker

Update calendar to satisfy ARIA pattern.
Make hover, selected and today cells visible in high contrast mode.
Internally support and transform ISO date strings when set as value.
Disable autocomplete on calendar navigation dropdown.
Simplify required now its Field allows undefined.

Date range picker

Update calendar to satisfy ARIA pattern.
Make hover, selected and today cells visible in high contrast mode.
Add stable ids to the from and to inputs.
Disable autocomplete on calendar navigation dropdown.
Internally support and transform ISO date strings when set as value.
docs: Update example error messages to be specific to the invalid inputs.
docs: Fix toInvalid checks and inputChange events in examples.

Details

Fix iOS VoiceOver not announcing the expanded state.
Make the (i) icon announced to screen readers.
docs: Improve ‘Do’ and Don’t guidance.

Drawer

Improve appearance and experience for high contrast users.

Dropdown menu

docs: Update badge examples to announce text similar to as it appears visually.

Feature link list

Initial release of component.

Field

Allow required to be undefined.
Update useScrollToField hook to also find elements by name.

File input

Change to hybrid, custom implementation for consistent visual and screen reader announcement.
Simplify required now its Field allows undefined.
docs: Add accept example and enhance hint guidance.

File upload

Announce adding and removing files.
Announce file size, accepted files, invalid message and optional state when focusing Select file(s) button.
Add focus ring to Select file(s) button.
Add buttonRef prop and attach it to Select file(s) button.
Simplify required now its Field allows undefined.

Global alert

Improve appearance and experience for high contrast users.

Header

Add aria attributes to mobile menu button to improve state announcement.

Icon

Create LicenceBusinessIcon, LicenceIcon, LockIcon, PermitIcon, UnlockIcon, UsersIcon, WalletIcon and XIcon.
Add id as allowed prop.
docs: Improve usage guidance.

Link list

docs: Improve ‘Do’ and Don’t guidance.

Main nav

Set aria-expanded to match mobile menu open state.
Wrap secondaryItems when space is limited.

Modal

Fix appearance on small screens.
Improve appearance and experience for high contrast users.

Notification badge

Improve appearance and experience for high contrast users.

Page alert

Make title default to H2 instead of H3.
Update focusOnUpdate to not focus on any falsey value.
docs: Improve customising the title guidance.

Pagination

Announce itemRangeText to screen readers.
Announce the hidden pages represented by ellipses.
Ensure focus is returned to the correct page number button when the Previous button is added and removed.
docs: Update Items per page to a working example.

Password input

docs: Improve ‘Do’ and Don’t guidance.

Progress indicator

Improve appearance and experience for high contrast users.
Only set active step when path matches exactly or has a sub-step.

Prose

Apply bodyText maxWidth token to lists.

Radio

Add explicit for/id association between input and label to improve accessibility.
Change focus ring to use :focus instead of :focus-visible.
Improve appearance and experience for high contrast users.

Search input

Simplify required now its Field allows undefined.
docs: Improve guidance/examples to include a search landmark.

Section alert

Add role and aria-label to improve announcements across screen readers.
Update focusOnUpdate to not focus on any falsey value.

Select

Simplify required now its Field allows undefined.
Add TypeScript support for autocomplete.

Side nav

Use responsive column widths to contain example.
docs: Improve Don’t guidance.

Sub nav

Improve appearance and experience for high contrast users.

Summary list

Prevent action column from shrinking.
docs: Update examples to have unique Action content.

Switch

Add required aria-checked attribute and add support for aria-controls.

Table

Correctly label table wrappers when headings are used instead of captions.
Fix scrolling shadows not responding to changes in table heights.
TableCell: Add support for id prop.
docs: Update guidance and examples of sortable tables to match ARIA pattern.
docs/storybook: Change indeterminate select-all checkbox to always select all items rather than deselect when some are selected.
docs: Fix alignment of cells.
docs: Improve ‘Do’ guidance.

Tabs

Improve appearance and experience for high contrast users.

Updates

App layout

AppLayoutSidebar: Fix background colour for items.

Date picker

Add allowedDateFormats prop. Make preferred dateFormat the first to parse.

Date range picker

Add allowedDateFormats prop. Make preferred dateFormat the first to parse.

Dropdown menu

Prevent closed dropdowns from creating horizontal scroll in some circumstances.

Filter sidebar

Standardise heading and wayfinding structure at all breakpoints.
Hardcode title to "Filters" at all breakpoints.
activeFiltersCount now renders at all breakpoints.
onClearFilters now renders a Clear filters button at all breakpoints.
Deprecate aria-label and title props. They’re now unused.

Icon

Add new ScrollbarArrowLeftIcon and ScrollbarArrowRightIcon.

Progress indicator

Standardise heading and wayfinding structure at all breakpoints.
Make title and subTitle render consistently at all breakpoints.
Fix Level 2 items from incorrectly adding isActive and label attributes.

Side nav

Standardise heading and wayfinding structure at all breakpoints.
The title is now used for the small-screen expandable variant.
Deprecate collapseTitle prop. It is now unused.

Table

TableWrapper: Update to use an accessible, custom scrollbar with edge shadows that is labelled by the caption.
TableHeaderSortable: Add display prop.

Task list

Change visual order of items to Title, Label and Message.
Update wording from “steps” to “tasks”.

Build

Use relative imports within components.

General

Use the correct CSS syntax for ::before and ::after pseudo-elements.

Docs and examples

docs/storybook: Update deprecated component and prop uses through examples
playroom: Fix AppLayout boilerplate sidebar links & icons
docs: Various bug fixes and improvements.

Released packages

"@ag.ds-next/react": "1.24.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

18 Jul 00:55

stowball

@ag.ds-next/[email protected]

20fbb68

AgDS Beta v1.23.1 release

Updates

App layout

AppLayoutSidebar: Fix level two items not inheriting body background.

Checkbox

Use useId from core, rather than React for backwards compatibility.

Control group

Use useId from core, rather than React for backwards compatibility.

Pagination

PaginationButtons: Use useId from core, rather than React for backwards compatibility.

Radio

Use useId from core, rather than React for backwards compatibility.

Released packages

"@ag.ds-next/react": "1.23.1"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

10 Jul 06:17

stowball

@ag.ds-next/[email protected]

27b5193

AgDS Beta v1.23.0 release

Updates

App layout

Add co-branding to the AppLayoutHeader via secondHref, secondLogo, and dividerPosition props.
Add sub-level support for AppLayoutSidebar navigation items with accompanying always and whenActive strategies for making them visible.
Fix AppLayoutHeader divider width.

Button

Add form prop from native button props to allow submit buttons to be connected from outside a form.

Checkbox

Fix required to set aria-required.
Add name support.

Combobox

Combobox multi: Allow backspace to remove selected items when the popover is open.

Control group

Fix passing required to Checkbox and Radio children.
Add automatic & custom name suppport.

Date picker

Reduce the size of and horizontally centre the calendar when the screen size is less than 375px.

Footer

Add borderColor prop to Footer.
Add color prop to FooterDivider.

Header

Fix spacing on desktop.
Fix divider not being hidden when wrapping to a second line.

Main nav

Add focusMode prop.
Add borderColor prop to MainNav and MainNavBottomBar.
Deprecate MainNavBottomBar.
Fix mobile dialog menu not closing when you press the active link.
Use correct ARIA labels for menu button & dialog. Remove other incorrect ARIA properties.

Modal

Make the Close button’s visual and reading order identical.

Radio

Fix required to set aria-required.
Add name support.

Side nav

Add always and whenActive strategies for making sub-level items visible. The new default will be whenActive as always should be used
sparingly and when only a small number of navigation items exist.

Table

Fix textAlign support in TableHeaderSortable.

Build

Add 'use client' to entrypoints so they can be imported and used directly from server components

Docs/Storybook

Drawer: Add examples of creating an accessible form within a drawer.
Header: Update co-branding example.
Pagination: Fix “Items per page” section not showing correct page number.

Released packages

"@ag.ds-next/react": "1.23.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

06 Jun 06:54

stowball

@ag.ds-next/[email protected]

defdc86

AgDS Beta v1.22.0 release

Updates

App layout

Add background and palette support to AppLayoutFooter, AppLayoutHeader & AppLayoutSidebar.
Fix AppLayoutSidebar not closing on item press.

Box

Deprecate focus prop in favour of new focusRingFor prop to enable a focus ring when the element is keyboard focused (focusRingFor="keyboard") and programmatically focused (focusRingFor="all").
Add breakWords prop to let words break across multiple lines where necessary.
Add alignSelf CSS prop.
Add justifySelf CSS prop.
Add 'start' and 'end' as valid alignItems values.
Document all style props.

Button

Add alignSelf CSS prop from Box.
Add focusRingFor prop to allow programmatic focus, e.g. via a link, to render the focus ring. This is available for Button and ButtonLink.

Core

Add new useFocus hook to allow an element to be focused when it’s mounted and updated.

Drawer

Add elementToFocusOnClose prop to allow custom element to be focused when the drawer closes.

File upload

New implementation of error handling: new UI and unaccepted files no longer trigger the invalid state.
When using multiple, duplicate files aren’t selected.
maxFiles now uses the total files being uploaded, not just current selection.

Grouped fields

Remove unused required prop.

Header

Support second logo with link for co-branding.

Icon

Prevent icons from shrinking smaller than their intended size.

List

Add BoxProps to allowed types for ListItem.

Page alert

Add focusOnMount prop to focus the alert as soon as it’s rendered to the page.
Add focusOnUpdate prop for to focus the alert when content updates.
Add focusRingFor="all" to improve accessibility for programmatically focused alerts.

Section alert

Add focusOnMount prop to focus the alert as soon as it’s rendered to the page.
Add focusOnUpdate prop for to focus the alert when content updates.
Add focusRingFor="all" to improve accessibility for programmatically focused alerts.
Ensure Close button is always aligned to the top.

Summary list

Increase gap between SummaryListItemTerm and SummaryListItemDescription to show a clearer separation.

Table

Add invalid prop to TableRow component to visually indicate a row with error.
Docs: Fix example header alignment.

Task list

Make doneRecently status count towards stepsCompleted.

Text

Remove unnecessary margin reset CSS.

"@ag.ds-next/react": "1.22.0"

Full changelog

Aside from the complete release notes on the @ag.ds-next website, you can also view the verbose change log in the related PR for this release.

Assets 2

Releases: agriculturegovau/agds-next

AgDS v1.30.0 release

Updates

Docs

Uh oh!

AgDS Beta v1.29.0 release

Updates

Build

Released packages

Full changelog

Uh oh!

AgDS Beta v1.28.0 release

Updates

Build

Other docs

Released packages

Full changelog

Uh oh!

AgDS Beta v1.27.0 release

Updates