Responsive UI - v8.1
JackHenry.dev
Learn how to develop with Jack Henry's digital banking platform to innovate faster and deliver top-notch experiences.
Digital Toolkit
Integrate with Jack Henry's plugin framework, authentication framework, admin API, and consumer API.
Enterprise Solutions
Integrate with Jack Henry's SilverLake, CIF 20/20, and Core Director banking cores.
SymXchange
Integrate with Jack Henry's Symitar credit union core.
Payments
Embed check deposits, ACH transactions, bill payments, card issuing and processing, and real-time payments.
Design Guidelines
Create stunning products with this set of visual guidelines
Light Mode ✓
Always display this site using light mode.
Dark Mode ✓
Always display this site using dark mode.
Device Setting ✓
Display this site using this device's light / dark mode setting.

Current Release

Current Release
This is an archived copy of the site for version 8.1. You can access the current version of this site here.
Gray Laptop on Table Top - Photo by Pixabay: https://www.pexels.com/photo/gray-laptop-on-table-top-459654/
Check out the latest release of Responsive UI, use a template to get started, and reference sample applications to start building with Responsive UI today.
Current release version
The current Responsive UI release version is 8.1. The current Responsive UI package version is 8.1.1.
One-time upgrades required
  • Angular components: You must follow this set of one-time upgrade instructions if you’ve been importing the jharesponsive package until now.
  • Web components: You must follow this set of one-time upgrade instructions if you’ve been importing the rui-wc package until now.

Prerequisites for loading the 8.x release

Release notes

  • All third-party supporting CSS files have been moved out to their own respective GitHub repos. These supporting CSS files are deprecated in v8.1 of the controls, and will be removed in v9 of the @jkhy/responsive-ui-wc package. You can begin using these packages now by updating your package.json to include the following packages:

    • “@jkhy/responsive-ui-prime-ng”: “16.2.0”,
    • “@jkhy/responsive-ui-ag-grid”: “29.0.0”,
    • “@jkhy/responsive-ui-angular-split”: “15.0.0”,
    • “@jkhy/responsive-ui-jodit”: “3.24.5”,
    • “@jkhy/responsive-ui-material-design”: “15.2.9”,
    • “@jkhy/responsive-ui-ngx-bootstrap”: “10.2.0”,

    Then update your apps bundles to include the new CSS paths:

    • “node_modules/@jkhy/responsive-ui-ag-grid/rui-third-party-ag-grid.css”,
    • “node_modules/@jkhy/responsive-ui-angular-split/rui-third-party-angular-split.css”,
    • “node_modules/@jkhy/responsive-ui-jodit/rui-third-party-jodit.css”,
    • “node_modules/@jkhy/responsive-ui-material-design/rui-third-party-material-design.css”,
    • “node_modules/@jkhy/responsive-ui-ngx-bootstrap/rui-third-party-ngx-bootstrap.css”,
    • “node_modules/@jkhy/responsive-ui-prime-ng/rui-third-party-prime-ng.css”,

    You can access these repos directly by vising the Code Repositories section of the Development page.

  • Added new rui/jha-checkbox component to replace PrimeNG checkbox. Visit the updated checkbox documentation for details.

  • rui-button and it’s dropdown, split, toggle alternatives have been updated to clip and ellipsis the label if a button width is set and the label is too long to fit. In the past, the label would overflow the button element.

  • Added new isMenuDisplayed/jhaIsMenuDisplayed properties to the rui/jha-popup-button components to allow the opening and closing of the menu programmatically.

  • Added a new slot to the rui-form-field component to allow for a custom label. To use, create a new label with slot="custom-field-label".

  • Added a new slot to the rui-subheader and rui-record-detail-subheader components to allow the addition of an rui-info-tooltip.

  • Updated jha-app routing logic to allow relative links using path location strategy

  • Updated jha-tile logic to allow for relative path routing links

  • Updated jha-button-group to allow number values in addition to string values

  • Updated CSS to resolve issue related to long labels in right-aligned button submenu cases

  • Updated logic to show correct nav button/mega-menu state when initial display state is set to collapsed and nav items are loaded after view init

  • Added support for isHidden/jhaIsHidden for the rui/jha-nav and rui/jha-header components

  • Corrected jhaClick event for jha-breadcrumb-menu-option

  • Emit jhaClick event for jha-breadcrumb component

  • Corrected action button styling for form fields with a disabled input

  • Updated highlight CSS to correct styling on mat-chip-list with .rui(jha)-form-input-highlighted class

  • Updated spacing/padding for clickable headers in mega menu group components

  • Updated rui-header-right to resolve JS error when displayLightDarkModeSelector is set to false

  • Resolved active nav/header state issue for applications using full Angular approach and hash location strategy

  • Updated logic to toggle focus on expand/collapse button in display block when expanding or collapsing

  • Upgrade lit-html/lit-element to newer lit package in @jkhy/responsive-ui-wc

  • Upgraded packages to use Angular (16.2.x) and PrimeNG (16.2.x)

Previous releases

You can find a list of archives of this documentation site for previous releases here.

Note that:

  • Enhancements are only added to the next upcoming release that we’re working towards. Enhancements will not be added to previous releases.
  • Bug fixes will be provided for previous releases that were published up to one year prior to the date of the bug report.
    • After that you’ll need to move to a more current release.
  • For now, all prior releases will remain available for installation from the npm server and will not be removed.
  • We’ll keep archived copies of the Responsive UI site available for the last three calendar years.
Support options
Have questions on this topic?
Join the Responsive UI team in Microsoft Teams to connect with the community.
See something in this page that needs to change?
Send us feedback on this page.
Last updated Thu Oct 12 2023