Skip to main content

Design kit 2.0.0-49

Published: Jul 11, 2025

This library version corresponds with the following code package versions:

  • jh-core: 2.0.0-beta.4
  • jh-icons: 2.0.0-beta.4
  • jh-ui: 2.0.0-beta.4

Added

  • Added typography composite parts as Figma variables
  • Added jh-input-password component
  • Added jh-input-search component
  • Added jh-input-text-area component
  • Added jh-table component
  • Added jh-image component to handle placing images and controlling their aspect ratios
  • Added collection of utility variables that includes slot colors
  • Added size variants to jh-slot to allow for placement flexibility

Input

  • Added variants to base input in Figma
  • Added character count to input-search

Changed

  • Merged Foundations and Components libraries into new Design kit library
  • Renamed jh-placeholder to jh-slot to better align with its representation in code
  • Restyled jh-slot to stand out against real UI styling and eliminate nested iconography
  • Redesigned component page layouts
  • Standardized component property order based on adjusted guidelines
  • Renamed color/azure to color/blue
  • Updated all grades of color/gray to use more neutral values
  • Changed string-based font-weight variable values (ex., Regular) to number-based versions (ex., 400)

Badge

  • Changed non-count width from fixed width to min width to align with code and be consistent with count variant

Card

  • Set medium as default size to align with code
  • Replaced placeholders with default text styling layouts
  • Changed slotted content from element/ to slots/
  • Prefixed instance swap properties that represent slots with slot/

Checkbox

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/

Checkbox group

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Broke out number of checkboxes into property-driven variants
  • Made orientations discrete layouts; removed orientation property

Icon

  • Prefixed instance swap property that represents slot with slot/
  • Replaced default icon with circle

Input

  • Set defaults for input slots
  • Changed element/ prefix to elements/
  • Replaced left and right slots with slot component
  • Prefixed instance swap property that represents slot with slot/

List group

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Moved label element to part of main variant
  • Created parent-level properties to control label
  • Made the label hidden by default

List item

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Replaced the following variant properties with comparable boolean properties: showLeft, showMetadata, showRight; subsequently eliminated all related variants
  • Removed each of the slot wrappers
  • Updated the left and right slots with new slot component
  • Prefixed instance swap property that represents slot with slots/
  • Updated the default slot with new default list group layout
  • Removed “slot” from name of default slot layer

Notification

  • Changed _base/ elements to use elements/ prefix
  • Changed action button elements to publish
  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Combined custom action button appearances into the same component set; added appearance property to element
  • Combined custom dismiss button appearances into the same component set; added appearance property to element
  • Broke out number of action buttons into property-driven variants
  • Removed appearance variants for action slot layout
  • Set button appearances directly on custom buttons within main variants

Radio group

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Broke out number of radios into property-driven variants
  • Made orientations discrete layouts; removed orientation property

Switch

  • Changed thumb from circle shape to frame with rounded corners

Tag

  • Changed _base/ elements to use elements/ prefix

Tag group

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/
  • Moved alignment property from slot layout to variant to better align with code
  • Adjusted slot styling to accommodate alignment property changes
  • Broke out number of tags into property-driven variants
  • Added description and link to documentation

Toast

  • Changed slotted content from element/ to slots/
  • Prefixed instance swap property that represents slot with slot/

Removed

  • Removed discrete Foundations and Components libraries
  • Removed type property from jh-input; replaced by discrete input type components
  • Removed jh-aspect-ratio utility component; replaced by jh-image
  • Removed italic font variables:
    • font/body/regular-italic/1/font-family
    • font/body/regular-italic/1/font-style
    • font/body/regular-italic/1/font-size
    • font/body/regular-italic/1/font-weight
    • font/body/regular-italic/1/line-height
    • font/body/regular-italic/2/font-family
    • font/body/regular-italic/2/font-style
    • font/body/regular-italic/2/font-size
    • font/body/regular-italic/2/font-weight
    • font/body/regular-italic/2/line-height
    • font/body/medium-italic/1/font-family
    • font/body/medium-italic/1/font-style
    • font/body/medium-italic/1/font-size
    • font/body/medium-italic/1/font-weight
    • font/body/medium-italic/1/line-height
    • font/body/medium-italic/2/font-family
    • font/body/medium-italic/2/font-style
    • font/body/medium-italic/2/font-size
    • font/body/medium-italic/2/font-weight
    • font/body/medium-italic/2/line-height
    • font/body/bold-italic/1/font-family
    • font/body/bold-italic/1/font-style
    • font/body/bold-italic/1/font-size
    • font/body/bold-italic/1/font-weight
    • font/body/bold-italic/1/line-height
    • font/body/bold-italic/2/font-family
    • font/body/bold-italic/2/font-style
    • font/body/bold-italic/2/font-size
    • font/body/bold-italic/2/font-weight
    • font/body/bold-italic/2/line-height
  • Removed italic font styles:
    • font/body/regular/1
    • font/body/regular/2
    • font/body/medium/1
    • font/body/medium/2
    • font/body/bold/1
    • font/body/bold/2
  • Removed variables for select global color families:
    • color/lime
    • color/blue
    • color/rose
  • Removed menu-default-slot nested instance properties

Tag group

  • Removed alignment=end slot layout variant
  • Removed nested instance properties from variant and default slot layout