Skip to content
This repository has been archived by the owner on Aug 21, 2023. It is now read-only.

Releases: helpscout/hsds-react

Blue - v0.0.84

03 Jan 16:33
Compare
Choose a tag to compare

Card: Fix autoWordWrap prop use for non-Links

This update resolves the issue with Card when passing in the autoWordWrap
prop for non-Link use. Previously, it would pass the prop into a div
selector, resulting in a warning.

Tests have been added for this update! 🎉

Blue - v0.0.83

15 Dec 18:26
Compare
Choose a tag to compare

CloseButton enhancements and Overflow fixes

screen recording 2017-12-15 at 12 43 pm

This update adds hover, active, and focus CSS styles to the CloseButton.
A storybook example for CloseButton has also been setup to demo these
new styles, as well as the various sizes CloseButton provides.


Overflow enhancement 💪

Also in this update are fixes for Overflow, which was affected when used
with Tags. Overflow has been updated to better handle child components
wrapped with Animate. An additional check is done on mount via a setTimeout,
which can be adjusted, to check and re-adjust the height of Overflow.
This is useful for things wrapped in Animate, as they typically don't exist
in the DOM for the first couple of render cycles.


Tag/Badge enhancements ✨

Lastly, some enhancements were made to the Tag and Badge components,
specifically adding a display prop which enables them to render with
display: block or display: inline-block. For certain UI, this was
useful to ensure consistent UI height. This was spotted when testing out
the ChatList.Item component.

Blue - v0.0.82

15 Dec 01:05
Compare
Choose a tag to compare

Utilities: Expose all of Blue's utils

This update exposes all of Blue's utils, making them available to be
imported and used.

All of the utilities come bundled within a utilities object.

Example

import { smoothScroll } from '@helpscout/blue/utilities'

// Now you can do things with smoothScroll.smoothScrollTo()!

Alternatively, you can do this (which might not be recommended, as it imports all the utils):

import { utilities } from '@helpscout/blue'

const {
  smoothScroll
} = utilities

// Now you can do things with smoothScroll.smoothScrollTo()!

Blue - v0.0.81

14 Dec 21:52
Compare
Choose a tag to compare

Card: Add fullHeight styles

This update adds a new prop to the Card component allowing it to have
full height styles (height: 100%). This is useful for when the Card
is contained within a flex-based element, and you require the Card
to expand the entire height of the parent element.

Text/Heading: Add linkStyle and center styles

This update updates the Text and Heading components with 2 new props:
linkStyle and center. This props apply CSS styles that make the
text look like Links and center-align text (respectively).

Blue - v0.0.80

14 Dec 16:19
Compare
Choose a tag to compare

Modal: Provide delay for CloseButton reposition

This update adds a new prop to Modal, which provides a delayed time before
the CloseButton is repositiioned (if the CloseButton is enabled).

This is necessary for certain situations where content that's injected into
the Modal.Body changes size, from a no-scrollbar state to a scrollbar state.
An example would be media (like images) unfurling during the mount state,
which is hidden via the Animation transition.

This is very edge-case, but it's something that I saw during Beacon
integration.


Testing: Jest/Travis

This update also changes Jest's setting to --runInBand to ensure more reliable and stable tests in Travis. The downside to this is that it slows down the test run a bit 😢

Blue - v0.0.79

13 Dec 21:48
Compare
Choose a tag to compare

Most 🐛 Fixes!

Modal: Can open/close with isOpen prop change

This update fixes PortalWrapper to open/close the composed component
(Modal, Drop) with an isOpen prop change.

Jest tests were added for PortalWrapper, Modal and Drop. Karma tests were
also added for Modal.

Resolves: #164


Input : Allow state to be updated by new value prop

When the input is initialized, the value property of its state is set to the passed value prop. The value prop on the internal state is then only updated via the handleOnChange. This is fine when the user is in control of the input. There may be times however, where we want to update the value on the internal state programatically, such as allowing a picker to inject content, as shown below.

This PR updates the Input component such that the value on the internal state can be updated by passing a new value prop to the component.

Blue - v0.0.78

13 Dec 15:02
Compare
Choose a tag to compare

Modal: Allow reposition CloseButton in sub components

This update adds the positionCloseNode method from Modal as context,
which allows the Modal.Body sub-component to call it on mount.

Typically, this should happen by default. However, there may be cases
where Modal.Body gets injected asynchronously (like transitioning from
loading -> loaded states).

This all fires behind the scenes. No changes are required for users of Modal
😄

Blue - v0.0.77

13 Dec 01:14
Compare
Choose a tag to compare

Modal.Content: To handle null children

This update fixes the Modal.Content sub-component to also
handle null children content. Tests for null were added to
Modal.Content and Modal.

Blue - v0.0.76

12 Dec 23:33
Compare
Choose a tag to compare

Modal: Handle null child

This update accounts for the rare edge case where a child component
of a Modal may be null.

Blue - v0.0.75

12 Dec 22:23
Compare
Choose a tag to compare

Modal and List: Bug Fixes

This update is a follow-up to the Modal.Content sub-component addition.
When implementing the new Modal structure, I discovered by rejecting
non-sub-component children, it causes unexpected issues for wrapper-like
components.

This restriction has been removed for Modal.

It is still highly recommended that you use either Modal.Body or Modal.Content to ensure that the UI looks correct.

There was a CSS bug that was introduced into Lists during the Tag
enhancement, which changed the display from block to flex.

This update fixes this by defaulting to a display of block, but
providing the ability to use flex via a prop.

Follow-up to https://github.com/helpscout/blue/releases/tag/v0.0.73