Releases: NYPL/nypl-design-system
Releases · NYPL/nypl-design-system
v3.0.0 React 18 / Chakra 2.8
Adds
- Adds
5%
and10%
opacities for the semantic colors in the color pallette. - Adds the
Menu
component. - Adds the
MultiSelect
v2 component. - Adds the
useMultiSelect
hook.
Updates
- Updates the repo to use Node 18.
- Updates to React 18 and Chakra 2.8.
- Updates the
StatusBadge
component to add thetype
prop. - Updates the
StatusBadge
component to change the UI styles. - Updates the base
Modal
component to use theuseDSHeading
hook internally to render a DS Heading for theheadingText
prop. - Updates the
Heading
component to use native Chakra responsive styles to handle the font sizes of the component's internalheading
,overline
andsubtitle
elements. This also resolves the flashing font size bug that is most noticeable on slower internet connections. - Updates the
Text
component to use native Chakra responsive styles for the font sizes of thesubtitle1
andsubtitle2
variants. - Updates the
NewsletterSignup
component to follow NYPL recommendations and use more direct language for the email field error message. - Updates the default export to include
FocusLock
,useStyleConfig
, anduseMultiStyleConfig
from Chakra UI. - Updates the default export to include the test helper "MatchMedia".
- Updates the
Accordion
component to include theariaLabel
andbuttonInteractionRef
props. - Updates the
Tabs
component to use horizontal scrolling and arrow buttons step through tabs in mobile view.
Fixes
- Removes console warnings from the
CheckboxGroup
component when a non-Checkbox
component is passed as a child. - Fixes the responsive styles related to the image in the
FeaturedContent
component.
Breaking Changes
- Removes the
NewsletterSignup
andSocialMediaLinks
components. - Updates the
TagSet
component to allow for more properties in the tag data object. TheonClick
function now returns the entire data object in the callback argument instead of just the tag label. - Updates the
Link
component to follow Chakra's patterns for usage with application framework routing systems, as well as a general refactor. Usage with Next.js has been updated.
v2.1.6
Updates
- Updates focus ring color in
Notification
andBreadcrumbs
to match color of text. - Updates the
StatusBadge
styles so that if an icon is passed, the icon and text line up with one another
Fixes
- Fixes a styling issue on the range
DatePicker
for the month and year types
where the in-range selected date values did not have the correct DS colors. - Fixes the desktop font size for the
"heading5"
variant in theHeading
component.
v2.1.5
Adds
- Adds the
"navigationMoreVert"
option (vertical ellipsis) to theIcon
component.
Updates
- Updates
Tabs
to be scrollable when the width of the tab set is greater than the viewport. - Updates the required comment field so it cannot be submitted when empty for the
FeedbackBox
component. - Updates the
Heading
component to use a custom@media query
method to handle the responsivefont-size
styles. - Updates the
Text
component to use native Chakra responsive styles for the font sizes of thesubtitle1
andsubtitle2
variants.
Fixes
- Fixes the focus ring style for the open button in the
FeedbackBox
component. - Forcibly focuses on the open button when the
FeedbackBox
form is closed to ensure focus is not lost.
v2.1.4
Adds
- Adds optional
placeholder
andplaceholderTo
props to theDatePicker
component. - Adds the
"actionDelete"
,"actionHome"
,"actionLockClosed"
,
"actionPayment"
,"communicationCall"
,"communicationChatBubble"
, and"communicationEmail"
options to theIcon
component.
Updates
- Updates the
DatePicker
'sinitialDate
andinitialDateTo
props to accept
an empty string.
Fixes
- Fixes bug where month and year
Datepicker
calendars were rendering
vertically rather than horizontally.
v2.1.3
Adds
- Adds the
hasVisitedStyles
prop toLink
which is used to include or omit the visited state styles. Default value is true. - Adds the
useDSHeading
hook to render a default H2 heading or a custom heading element. - Adds the
sizeBasedOn
prop to theImage
component. - Adds the
isDarkBackgroundImage
prop to theHero
component.
Updates
- Removes
disabled
variant fromLink
theme file, as it isn't being used. - Updates the
font-weight
to"regular"
for thesubtitle1
andsubtitle2
text styles. - Updates the
"digitalCollectionsBlack"
variant of theLogo
component to use NYPL color design tokens. - Updates the following components to accept
JSX.Element
type values into their"title"
prop:List
,NewsletterSignup
, - Updates the following components to accept
JSX.Element
type values into their"headingText"
prop:AlphabetFilter
,AudioPlayer
,ComponentWrapper
,SearchBar
,VideoPlayer
- Updates the
Notification
component to acceptJSX.Element
type values into its"notificationHeading"
prop. - Updates the
StructuredContent
component to acceptJSX.Element
type values into its"headingText"
and"calloutText"
props. - Updates the
FeaturedContent
component by adjusting the spacing in the"fullScreen"
variant to better align the component text content with the page text content. - Updates the
"campaign"
variant of theHero
component to improve the spacing around the component. - Updates the
Card
component so that it accepts theimageProps.isLazy
prop and passes it to its internalImage
component.
Fixes
- Adds z-index on hover to the
SearchBar
's select icon so it no longer disappears. - Adds z-index to the
DatePicker
's calendar container so that the helper text does not shift when the calendar opens.
v2.1.2
Adds
- Adds the
sizeBasedOn
prop to theLogo
component. - Added the
autoComplete
prop to theTextInput
component for setting the "autocomplete" attribute manually.
Updates
- Updates max version for Chakra UI to
1.8.9
for minor bug fixes. - Updates the layout for the
"campaign"
variant of theHero
component to have consistent padding on its left and right sides. - Updates the
getSectionColors
function to also return dark mode color variants. - Updates the
NewsletterSignup
component'snewsletterSignupType
prop to render proper dark mode variant colors.
v2.1.1
Adds
- Adds a changelog to the story pages for the
Heading
component.
Updates
- Updates the
Heading
component to set thearia-roledescription
value as"subtitle"
(a more familiar and recognizable value) for theoverline
element. - Updates the
FeedbackBox
andNewsletterSignup
components to set thetabindex
on the internal elements to"-1"
. - Updates
DatePicker
'sTextInput
to always have anaria-label
attribute that tells screen reader users how to access the calendar. - Updates Storybook to
v7.5.1
.
Fixes
- Fixes a bug in the
Hero
component where custom background colors were not rendering properly in dark mode for the"campaign"
and"tertiary"
variants.
Deprecates
- Deprecates the
"secondary"
and"fiftyFifty"
variants of theHero
component.
v2.1.0
Adds
- Adds the
ComponentChangelogTable
component. - Adds a changelog to the story pages for the
DatePicker
,FeedbackBox
,Hero
,Slider
, andTextInput
components. - Adds the
FeaturedContent
component. - Adds the
NewsletterSignup
component.
Updates
- Temporarily renaming
FilterBar
,MultiSelect
,MultiSelectGroup
,useMultiSelect
, anduseFilterBar
Storybook page files so they don't show up in the Storybook sidebar. - Updates the
Slider
component to use appropriatearia-label
values for the slider thumbs and text input fields. - Updates
TextInput
so it no longer incorrectly overwrites thearia-describedby
value to undefined when part of theDatePicker
component. - Updates
DatePicker
so that focus remains on input after value is changed. - Updates the
FeedbackBox
component to remove the underline on the component'sPrivacy Policy
link. - Updates
DatePicker
to pass aadditionalHelperTextIds
to itsTextInput
if needed so that thearia-describedby
value can be associated with all relevanthelperText
s.
Fixes
- Fixes an issue with
backgroundColor
andforegroundColor
props not prioritizing the passed design token values for theHero
component.
v2.0.1
NOTE: Version number 2.0.0
was previously released in 2019 and is marked as deprecated in npm. The first stable relase for Reservoir v2 is 2.0.1
.
v2.0.0
Breaking Changes
- This update introduces a number of visual breaking changes related to typography styles.
- Removes the
FilterBar
andMultiSelect
components. - Removes the
useFilterBar
anduseMultiSelect
hooks.
Adds
- Adds the
isUnderlined
prop to theLink
component. - Adds the
"standalone"
variant to theLink
component. - Adds
NYPL Patterns
to theLinks Accessibility Guide
. - Adds the
SocialMediaLinks
component.
Updates
- Updates underline styles of the
Link
component. - Updates the hex value for the
Link Primary
color style. - Updates the
Link
component so that non-button variants change color once visited. - Updates the
Link
component to explicitly assign the text color for the"buttonPrimary"
varianthover
state. - Updates all components that render text to use the
Typo2023
color scheme. - Updates the base styles to use the
Typo2023
styles. - Updates all components to implement the
Typo2023
styles. - Updates the
Breadcrumbs
,Card
,Heading
,Pagination
, andSkipNavigation
components to implement theTypo2023
link patterns.