DXC Logo
Halstack logo
Halstack
Design System
v0.0.0-025d9d7
Overview
Introduction
Component lifecycle
Releases
Principles
Color
Iconography
Layout
Localization
Spacing
Themes
Typography
Utilities
Halstack Provider
Components
Accordion
Alert
Application Layout
Badge
New
Bleed
Box
Deprecated
Breadcrumbs
Experimental
Bulleted List
Button
Card
Checkbox
Chip
Container
Experimental
Contextual Menu
New
Date Input
Dialog
Divider
New
Dropdown
File Input
Flex
Footer
Grid
Header
Heading
Image
Experimental
Inset
Link
Nav Tabs
Number Input
Paginator
Paragraph
Password Input
Progress Bar
Quick Nav
Radio Group
Resultset Table
Select
Sidenav
Slider
Spinner
Status Light
New
Switch
Table
Tabs
Tag
Legacy
Text Input
Textarea
Toggle Group
Typography
Wizard
GitHub

Releases

Access all the major releases of the Halstack React library and see the changelog of every version available.

Major released versions

Every major release of Halstack is collected below:

All the other previous versions, such as Halstack 5 or Halstack 4, are still available on the legacy sites. But remember, these sites are no longer maintained. Consider upgrading if you are currently using one of them.

Next version

To check the latest features under development by the Halstack team, you can access the next version of the documentation through this link. Please note that this version is unstable and may contain minor bugs. For a better experience with Halstack, we recommend, if possible, always using the latest release available.

Release notes

12.2.0

Released on Tuesday, May 21.

🐛 Patches

  • Fixed some weird size behaviors in some input components. 1974
  • Added new logic for resultsetTable to manage sorting and adding/removing rows properly. 1938
  • Fixes Typography bug with invalid HTML tags in as prop. 1765
  • Fix file input delete styles. 1999
  • Fixed resultSet typing for rows. 1997
  • Reverted back Open sans import due to issues with globalStyles. 2000

✨ New features

  • Added Tooltip component. 1968
  • Contextual menu tokens. 1985

12.1.0

Released on Tuesday, April 30.

✨ New features

  • New Component lifecycle page. 1949
  • New status stages included in the site. 1963
  • Updated Storybook version to 8.0. 1960
  • New attribute selectedByDefault for the Contextual Menu items. 1966

🐛 Patches

  • Accessibility fixes for the Date Input component. 1919

12.0.2

Released on Friday, April 19.

🐛 Patches

  • Fixing Textarea verticalGrow as auto. 1958
  • fonts css reverted back and changed the approach to load fonts. 1957

Others

  • Revert "Update Chip specs". 1955
  • Revert "Several fixes in the Chip". 1954

12.0.1

Released on Thursday, April 18.

🐛 Patches

  • Removing uuid library. 1939
  • Dialog popups interaction (Escape). 1935
  • NavTabs overflow and z-index behaviour fixed. 1925
  • Several fixes in the Chip. 1943
  • Update Chip specs. 1947
  • Fonts moved to a stylesheet and added css loader and style loader. 1952

12.0.0

Released on Tuesday, March 26.

💥 Breaking changes

  • Remove BackgroundColorProvider from Halstack. 1774
  • Fix the typo in the Accordion token. 1859
  • Updated tokens for the table. 1851
  • The components' icon prop doesn't support URLs anymore.
  • Updated margin values following the spacing guidelines. 1828

🐛 Patches

  • Prevent File Input duplicates when uploading files. 1762
  • Fixed bug with Checkboxes in Resultset Table. 1773
  • Fixed autoscroll issue in the Dialog component. 1781
  • Fixed margin type in the Footer and Header components. 1785
  • The Select now doesn't crush with an empty array of options and the flag searchable to true. 1787
  • The Slider component has been updated to fix some issues with SSR in NextJS. 1791
  • Fixed aria-readonly typo in RadioGroup. 1801
  • Tab Horizontal Slider Fix. 1795
  • Handle scroll in Number Inputs. 1800
  • Added 100% width underline to NavTab. 1796
  • Fixed bug in TextInputs when scrolling. 1838
  • Update Autosuggest listbox option active state. 1852
  • Fixed popups not working inside Dialog. 1822
  • Changing the footer padding according to Design. 1827
  • Applying the token correctly to the Accordion. 1907

✨ New features

  • New Container component. 1748 1749
  • New Badge component. 1815 1821
  • New StatusLight component. 1804 1823 1848
  • New Contextual Menu component. 1850 1892
  • New Divider component. 1835 1840 1866
  • New Breadcrumbs component. 1828
  • Remodelled icon prop API with support for Material Icons and custom SVGs.
  • Tooltip support in the Select component. 1798
  • New Accessibility testing process. 1856
  • New API documentation for ActionsCell. 1853
  • Added a small footer variant. 1793
  • Added a small table variant. 1832 1831
  • Actions cell added to table and Resultset table. 1836
  • Added option to hide the paginator inside a Resultset table. 1830 1877

Others

  • General site improvements (typos, re-writings, etc). 1758 1759 1760 1768 1775 1776 1750 1790 1906 1920
  • Added Github Bot. 1779
  • Fixed GitHub Bot message format. 1807
  • Added links level limit in Quicknav documentation. 1811
  • Fixing problems with the NavTabs inside the site. 1820
  • Standardize documentation of the compound components. 1905

11.0.0

Released on Tuesday, November 28.

💥 Breaking changes

  • The readonly prop was renamed to readOnly in the Radio Group. #1695
  • Updated Radix's Popover to the latest version available (1.0.7). This fixes the vulnerabilities we used to have when installing Halstack. #1724
  • Halstack has been migrated to Storybook 7 and Chromatic 8 releases (7.5.3 and 8.0.0, respectively). #1724

🐛 Patches

  • Updated captions for all the specification images. #1704
  • Removed the underline in the Nav Tabs component when selecting a tab label. #1705
  • Chip updated to use the focusBorderStyle token #1708
  • Inconsistencies in the Chip component specifications have been resolved. #1712
  • Popover components positioning inside fixed containers has been fixed. #1724
  • The Text Input suggestion's container is now correctly centered. #1724

✨ New features

  • New readOnly property included in missing form components: Checkbox, Date Input, Number Input, Select, Text Input and Textarea. #1684 #1688 #1693 #1696 #1699
  • New design for the Props table of each Halstack component. #1715

10.1.0

Released on Monday, September 25.

🐛 Patches

  • Number Input. The step now works with decimals and more enhancements were made to match the native behaviour. #1667
  • Halstack site maintenance updates. #1662

✨ New features

  • New Image component added. #1677 #1671
  • Added new Usage and Specifications pages of the Grid component. #1678
  • Updating old social media Twitter to new X branding. #1680 #1683
  • Updates to all the READMEs and templates. They now make more sense within the Halstack ecosystem. #1669 #1673
  • Toggle Group. New title prop added. #1661

10.0.0

Released on Monday, July 17.

💥 Breaking changes

  • The component Flex has been subject to some important changes: the value of the property gap has been restricted to follow the Spacing principles, updated typescript comments and new MDN links in its documentation page. #1594
  • Removed padding prop from affected components. The complete list can be checked in this issue #1570
  • Updated Grid's compound component from DxcGrid.GridItem to just DxcGrid.Item. #1652

✨ Minor changes

  • Design and core tokens reviewed. Some colors were updated. #1600
  • Sidenav styles have been reviewed and updated. #1599
  • Several enhancements were made to the Chip component. #1609
  • The name prop of the File Input component has been deprecated. #1638
  • The Main subcomponent of the Application Layout has undergone some changes. #1641

🐛 Patches

  • The Bulleted List component now accepts an URL icon (it was documented but not implemented). #1606
  • Accordion group updates. #1617
  • Nav Tabs code improvements. #1612
  • Paginator fix when the value of the itemsPerPage prop is 0. #1620
  • Radio Group code fixes. #1618
  • Improved responsive behaviour of the Quicknav in the Halstack site. #1611
  • Improved responsive endpoints to fix some visual bugs in the Halstack site. #1622
  • Focus Lock selectors updated. #1615
  • ADA enhacements in Halstack site. #1644

✨ New features

  • New Releases page is now available on the Halstack site. #1603
  • New title attribute to Footer social links. #1646
  • New title prop added to the Button for only-icon scenarios. #1647
  • Improvements to the Halstack documentation site: New GitHub link, UXPin replaces Adobe XD and updated icons for the GitHub quick links at each page footer. #1640

9.1.0

Released on Monday, May 15.

🐛 Patches

  • Sidenav. children prop type changed from string to React.ReactNode. Several styling improvements. #1596
  • Focus Lock issue in Jest fixed. #1595
  • aria-disabled removed from unnecessary components. #1595

✨ New features

  • New Grid component added. #1571 #1582
  • New design for the pages' status tag in the Halstack site. #1591

9.0.1

Released on Tuesday, April 25.

🐛 Patches

  • Remove ts-nocheck from all components and type fixes.
  • Type of both opinionated and advanced theme.
  • Date input. Status changed to Ready.

9.0.0

Released on Monday, March 27.

💥 Breaking changes

  • Opinionated theme review for existing components. #1465 #1478
  • Box. Removed the letterSpacing token. #1521
  • Date input. Tokens changed. #1456
  • Dialog. Removed typography tokens: fontFamily, fontSize and fontWeight. #1504

✨ Minor changes

  • Opinionated theme created for left components. Theme generator updated. Alert, Box, Date input, Dialog, Link, Nav tabs, Progress bar, Tag and Textarea. #1466 #1503
  • Nav tabs. Design tokens added to the component's implementation. #1477
  • Halstack Provider documentation added. #1453
  • Usage and specifications documentation added to the site. App layout, Bleed, Flex, Inset, Nav tabs, Quick nav, Side nav. #1437
  • Date input specs updated in the documentation site. #1456
  • Updated package dependencies and improved user experience in /app. #1528

🐛 Patches

  • Some vulnerabilities resolved. The ones pending are still out of our reach.
  • Autosuggest. Error in option values when special characters are typed fixed. #1443
  • Date input. Selecting the correct year when using a specific format. Improved focus behaviour after a year is selected. #1439
  • Dropdown. Menu size fixed. #1455
  • Dialog. Width overflow fixed. Extra top padding removed. Responsive dialog size fixed. Esc key issue fixed. New focus lock behaviour. #1504
  • File input. File input behaviour inside a form. Select a file after removing it from the file input. #1501 #1507
  • Component's custom icon sizing fixed. #1445
  • Removed unnecessary z-index CSS prop from several components. #1447
  • General documentation site improvements: broken links updated, typos corrected, descriptions and examples improved, etc. #1450 #1462 #1484 #1522 #1523 #1529

8.0.0

Released on Friday, December 30.

💥 Breaking changes

  • Date Input. Remove Material UI from the Date input component. #1367
  • File Input. Change the File Input button size to fitContent. #1372
  • Slider. Changed color for totalLineColor token. #1407
  • Removed the /docs folder.

🐛 Patches

  • Checkbox. Fix the Checkbox tick with sticky positioning. #1366
  • File Input. File item styles are updated to follow the component specifications. #1377
  • Dropdown. Fix the Dropdown options width. #1391
  • Resultset Table. Fix some styles to follow the specifications. #1428
  • Resolved vulnerabilities.

✨ New features

  • Checkbox, File Input, Slider, Switch. Added ref to the components. #1370
  • File Input. Added localization for Delete file action. #1372
  • Theme generator. The theme generator moved from /docs to /website, so it is available on the site and the theme generator's design updated. #1406

7.0.0

Released on Friday, November 4.

💥 Breaking changes

  • QuickNav. Added parent label to sublinks href. So for example, if parent label is overview and sublink is introduction, navigation to the sublink will be to overview-introduction. #1338
  • Table. ResultsetTable. Fix incorrect row height. #1357

🐛 Patches

  • QuickNav. Fix accessibility issues. #1334
  • TextInput. Autosuggest update to avoid inconsistent roles with Radix #1337
  • Select, Radio Group. Fix to prevent disabled Select and Radio Group from sending their value when they are submitted inside a form. #1345
  • Table. Fix incorrect padding in last row item. #1356
  • Paginator . Fix incorrect component margins. #1359
  • TextInput. Fix to prevent Text Input's action from executing form submit when it is clicked. #1365
  • FileInput. Fix File Input to submit its value in forms. #1362

✨ Important information

Accordion, Box, Card, Dialog, Footer, Header. Padding prop is marked as deprecated. It can still be used, but it is recommended to be removed and start using our new layout components. #1335

6.2.2

Released on Thursday, October 13.

🐛 Patches:

  • Switch. Several improvements. #1309
  • Radio Group. Improvements related to accessibility. #1319
  • Slider. Fix in slider marks. #1331
  • Dialog. Content occupies all dialog content. #1333
  • Routing improvements in documentation site.

6.2.1

Released on Thursday, October 13.

🐛 Patches:

  • Internal improvements in some components.
  • Fix website build.

6.2.0

Released on Wednesday, October 5.

✨ Minor changes:

  • Remove material ui from Accordion. #1267
  • Remove material ui from Accordion Group. #1267
  • Remove material ui from Checkbox. #1255
  • Remove material ui from Slider. #1244
  • Remove material ui from Tabs. #1241
  • Alert, Box, Checkbox, Dropdown, Switch, Tag. Update component's fitContent size. #1303

✨ New features:

  • New site deployment. #1282 #1295
  • Tag version and previous documentation sites section added to the site. #1300
  • Autosuggest documentation added to the site. #1311
  • Text Input. Implement Text Input autosuggest using Radix UI popover. #1305

🐛 Patches:

  • Checkbox. Fix disabled Checkbox focus appearance. #1320
  • Several internal bug fixes.

6.1.0

Released on Thursday, September 15.

✨ Minor changes:

  • Upgrade to React 18. #1250
  • Remove material ui from Button. #1199
  • Remove material ui from Progress bar. #1200
  • Remove material ui from Dialog. #1203
  • Remove material ui from Switch. #1207
  • Remove material ui from Header. #1232
  • Remove material ui from Dropdown. #1245
  • Update logo in Header to the correct one. #1232

🐛 Patches:

  • Link. Fix link with icon is not inline with text. #1236
  • Select. Fix onBlur event is executing when disabled. #1249
  • Select. Fix pop over in Firefox. #1249
  • Progress Bar. Fix component is indeterminate or determinate depending on prop showValue instead of value. #1261
  • Slider. Fix component to change slider value to 0 from an external way. #1265
  • Slider. Group title is selected when one option inside of it is selected. #1235
  • Sidenav. Fix sidenav poping in responsive mode. #1247
  • Replaced deprecated keycode for key in several components. #1262

6.0.0

Released on Monday, August 8.

💥 Breaking changes:

  • Bleed and Inset. Prop values are now actual CSS values instead of token names. This is to avoid ambiguity and might change in the future with improvements in the token architecture semantics. #1141 #1139
  • Radio. This component has been removed after being deprecated. Use the Radio group component instead. #1098
  • Progress Bar. overlay property now defaults to false. #1042
  • Wizard. When orientation is vertical, the default width now adapts to the content instead of adjusting to the parent. #987
  • Checkbox and Switch. required property has been removed. Mark your non-required inputs as optional with the optional prop instead of using required. #925
  • Application Layout. Responsive re-design. #821
  • Application Layout. Added header, footer and side nav props. #821
  • Header. This component is now exported as part of the Application Layout component. #1146
  • Footer. This component is now exported as part of the Application Layout component. #1146
  • Sidenav. This component is now exported as part of the Application Layout component. #1146
  • Sidenav. New API for sidenav content. #1146
  • Link. Review API for client-side routing libraries. #822
  • Breakpoint responsive values have changed. #825

✨ New features:

  • Quicknav. New component. #824
  • Typography. New component. #816
  • Paragraph. New component. #816
  • Bulleted List. New component. #817
  • Flex. New component. #815
  • Nav Tabs. New component. #823
  • Select. Add popup edge collision detection and position re-calculation. #1115
  • Add the defaultValue prop to all uncontrolled components. #857
  • Allow internationalization of the hardcoded strings. #929

🐛 Patches:

  • Select. Fix popup overflow when used in container components. #1047
  • Select. Fix z-index conflict with Checkbox. #1086
  • Select. Fix component not passing required error to onBlur callback. #1037
  • Fix vulnerability with dependency "moment". #931

5.0.0

Released on Friday, April 29.

💥 Breaking changes:

  • ThemeProvider changes name to HalstackProvider, in preparation for receiving not just themes, but also additional configuration that applies globally.
  • New component Radio Group. Old Radio component will remain as deprecated during one release before being discontinued.
  • Button and Text Input components don't send the event parameter to the onClick callback prop.
  • Textarea and Text Input components' length prop gets replaced by minLength and maxLength props.
  • onBlur and onChange callback props receive the error parameter as undefined instead of null, when there is no validation error. This change affects Textarea, Select, Date, Text Input, Number Input, and Password components.
  • Functionality change in how input components handle the error prop:
    • null or undefined means there is no error in the input.
    • An empty string also means there is no error, but the component will keep that space in case an error comes up later. This helps avoiding layout shifting and facilitates aligning multiple fields when only some of them have error.
    • Non-empty strings display the error as usual.
  • required property has been removed from checkbox and switch components. Instead of using required, use the new optional property in the optional fields.
  • Changes in the responsive breakpoint values that affect multiple components.
  • Removed deprecated iconSrc from Button, Toggle Group, Footer, Tabs, Wizard, Tag, Accordion, Accordion Group, Dropdown and Link.
  • Removed deprecated prefixIconSrc and suffixIconSrc from Chip.
  • Previously deprecated components are removed in this release.

✨ New features:

  • Added TypeScript definitions to all components' props.
  • Added defaultValue prop to the input components that can be used as uncontrolled.
  • (Experimental) New layout primitive components (stack, row, bleed, inset).
  • (Experimental) New Text component.
  • (Experimental) New List component.

🐛 Patches:

  • Multiple accessibility improvements.
  • Bug fixing.

4.0.0

Released on Wednesday, January 12.

💥 Breaking changes:

  • DxcDateInput. New component. Full re-implementation of DxcDate component. DxcDate component will remain as deprecated during one release before being discontinued.
  • DxcTextInput. New component. Full re-implementation of DxcInput component. DxcInput component will remain as deprecated during one release before being discontinued.
  • DxcFileInput. New component. Full re-implementation of DxcUpload component. DxcUpload component will remain as deprecated during one release before being discontinued.
  • DxcSelect. Full re-implementation. Old version will remain available as deprecated (as V3DxcSelect) during one release before being discontinued.
  • DxcTextarea. Full re-implementation. Old version will remain available as deprecated (as V3DxcTextarea) during one release before being discontinued.

✨ New features:

  • DxcNumberInput. New component.
  • DxcPasswordInput. New component.
  • DxcToggleGroup. Visual re-design.

🐛 Patches:

  • Multiple accessibility improvements.
  • Bug fixing.

3.4.1

Released on Friday, October 22.

  • Fix spinner role attribute.
  • Fix upload file loading indicator.

3.4.0

Released on Thursday, October 21.

  • Tokens review of multiple components.
  • The issue with accordion content overflow has been fixed.
  • Fix opinionated theme regressions.
  • Fix dropdown padding when the caret is hidden. #402

3.3.0

Released on Wednesday, September 15.

  • New DXC Technology branding as default theme
  • Advanced theme tokens first draft

3.2.0

Released on Saturday, May 1.

Minor changes

  • Adding tabIndex to interactive components. #216
  • contentPadding prop added to Card component.

Patches

  • Image becomes optional in the Card component.
  • Fix autocomplete list not showing in the dialog box. #234
  • type=button added when Link renders as a button. #246
  • Fix AccordionGroup when has only one child.
  • Remove the z-index from the Alert component when the mode is inline. #259
  • When a wrong mode is used on the Button, it defaults to "primary". #264
  • A higher z-index is set for ApplicationLayout. #262

3.1.0

Released on Friday, April 16.

Minor changes

  • "type" prop added to button component.

Patches

  • Replace accordion assistive text line break with an ellipsis. #171
  • Avoid throwing errors when the color is not hexadecimal in a theme.
  • Fix themed logo in footer component not being shown.

3.0.0

Released on Thursday, April 8.

New Features

  • SVG icons support:
    • Added icon prop to: button, accordion, chip, dropdown, input text, link, select, tag, tabs, toggle group, wizard.
    • Added logo prop to footer socialLinks.
  • New props in Paginator: itemsPerPageOptions, itemsPerPageFunction and showGoToPage
  • Added itemsPerPageOptions and itemsPerPageFunction props to resultset table.
  • New DxcAccordionGroup component.
  • New design in Tabs component. Added new props: notificationNumber, iconPosition, onTabHover.
  • New design in Accordion and Accordion Group components.

Breaking Changes

  • Theme input properties have new names.
  • ThemeContext.Provider replaced by ThemeProvider.
  • nextFunction, prevFunction, lastFunction and firstFunction replaced by onPageChange in Paginator.

Bug Fixes

  • Fix issue when sidenav is closed in responsive mode and resized to desktop mode.
  • Supporting React 17.
  • onBlur fuction is called when the datePicker is closed.
  • Disabled link working as expected.
  • Fix wizard styles.

2.0.0

Released on Monday, January 4.

New Features

  • Added labelFormatCallback prop to Slider Component, which allows defining custom formatting for the Slider labels.
  • New DxcApplicationLayout component.
  • Added DxcHeader.Dropdown compound component.
  • Added DxcSidenav.Title, DxcSidenav.Subtitle, DxcSidenav.Link compound components.

Breaking Changes

  • Removed the following props from DxcSidenav component (now DxcApplicationLayout takes that responsibility: mode, navContent, pageContent, arrowDistance, displayArrow.

Bug Fixes

  • Fix issue with caretHidden prop in DxcDropdown Component.
  • Remove unnecessary tabsMode prop from DxcTabbedSection Component.
  • Render tbody html tag in DxcTable.
  • Fix issue with DxcResultsetTable not refreshing when there are changes in the resultset.
  • Fix button focus color.

1.2.1

Released on Tuesday, November 17.

Changes:

  • Add new Toggle Group component
  • Fix issue with header component, which was mistakenly rendered as underlined by default.
  • Fix color tokens for secondary buttons where in active and focus state

1.1.1

Released on Wednesday, November 4.

Changes:

  • Fix issue with date picker getting closed when selecting a year or a month.

1.1.0

Released on Monday, October 26.

Changes:

  • Themeable logo in footer and header.
  • New DXC branding in default theme.
  • Fix issue rendering dots in discrete slider when minValue > 0.
  • Fix issue with onDragEnd slider executing handlers more times than required.

Contents

Edit this page on GitHub
Report an issue on GitHub
Previous
Component lifecycle
NextColor