@nypl/design-system-react-components 1.5.1 → 1.6.0-vite-rc

package/CHANGELOG.md

@@ -1,1861 +0,0 @@
-# Changelog
-
-All notable changes to this project will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
-Currently, this repo is in Prerelease. When it is released, this project will adhere to [Semantic Versioning](https://semver.org/spec/v2.0.0.html)
-========
-
-## Prerelease
-
-## 1.5.1 (March 23, 2023)
-
-### Updates
-
-- Updates the `Button` component to use a transparent background for the default state of the "secondary" variant.
-- Updates the `Hero` component so that the height of the image in the "campaign" and "fiftyFifty" variants will grow and shrink based on the text content.
-- Updates the `SearchBar` component to include `defaultValue` as a prop in `textInputProps`.
-
-### Removes
-
-- Removes the `Color Mode` docs page from Storybook due to the addition of the `Supporting Dark Mode` docs page.
-
-### Fixes
-
-- Removes the `Slider` component's internal state update function (`setCurrentValue`) from Chakra's own `RangeSlider` component's `onChangeEnd` prop function. This fixes an issue where both Chakra's `onChange` and `onChangeEnd` prop functions were being called regardless of whether they were passed to the DS `Slider` component or not. Since Chakra's `onChange` function will always be called, the internal state function is kept. This ensures that there is no multiple calls or loop of state update calls when using keyboard controls to change the range slider's value.
-
-## 1.5.0 (March 16, 2023)
-
-### Adds
-
-- Adds `brand` as a `breadcrumbsType` to the `Breadcrumbs` component.
-- Adds `dark` color mode support for `background-color` and `color` global styles.
-- Adds `dark` color mode support for the `HelperErrorText` and `StatusBadge` components.
-- Adds `dark` color mode support for the `Button`, `Checkbox`, `DatePicker`, `ProgressIndicator`, `Radio`, `SearchBar`, `Select`, `Slider` and `Toggle` components.
-- Adds `dark` color mode support for the `Card` and `Hero` components.
-- Adds `dark` color mode support for the `Heading` and `List` components.
-- Adds `dark` color mode support for the `Footer`, `Header`, `HorizontalRule` and `Table` components.
-- Adds `dark` color mode support for the `Notification`, `ProgressIndicator`, and `SkeletonLoader` components.
-- Adds `dark` color mode support for the `Breadcrumbs`, `Link Types`, and `Pagination` components.
-- Adds `dark` color mode support for the `Accordion`, `Modal`, `Tabs`, and `Tooltip` components.
-- Adds `dark` color mode support for the `AlphabetFilter`, `AudioPlayer`, and `TagSet` components.
-- Adds `dark` color mode support for the `FeedbackBox` and `StyledList` components.
-- Adds `dark` color mode support for the `FilterBar` and `MultiSelect` components.
-- Adds `Supporting Dark Mode` under the `Development Guide`.
-
-### Updates
-
-- Updates background color values available in Storybook.
-- Updates the hex value for `dark.ui.error.primary`.
-- Updates the `Design Tokens Style Guide` to include more detailed information about the available tokens.
-
-### Deprecates
-
-- Deprecates the `darkMode` prop in the `ProgressIndicator` component.
-
-## 1.4.2 (March 2, 2023)
-
-### Updates
-
-- Updates the `Logo` component to include "black" and "white" variants for `Digital Collections`.
-
-### Fixes
-
-- Updates the `Slider` component's `currentValue` state to use the `useStateWithDependencies` hook.
-
-## 1.4.1 (February 9, 2023)
-
-### Adds
-
-- Adds the `pattern` prop to the `TextInput` component.
-- Adds documentation page "Dynamic Content" to the `Accessibility Guide`.
-- Adds the `isRenderedText` prop to the `HelperErrorText` component.
-
-### Updates
-
-- Adds a third radio button to the `Header` component, separating search options between the Circulating Catalog, Research Catalog, and the NYPL.org website.
-- Temporarily removes the "log in" state from the `Header` component, the feature to read auth cookies, and the patron's name when logged in, and the log out link.
-- Truncate breadcrumb text if beyond 40 characters then add ellipsis at the end. If the breadcrumb text is truncated, the DS `Tooltip` component is used to display the full text in a tooltip when the text is hovered.
-- Updates the `SearchBar`'s `textInputProps` prop to include the following props to pass to the `TextInput` component: `isClearableCallback`, `max`, `maxLength`, `min`, and `pattern`.
-- Updates how the `CheckboxGroup`, `ComponentWrapper`, `DatePicker`, and `RadioGroup` components internally render the `HelperErrorText` component. The update in the `ComponentWrapper` component affects the `AudioPlayer`, `Checkbox`, `Radio`, `SearchBar`, `Select`, `Slider`, `TextInput`, `Toggle`, and `VideoPlayer` DS components, each of which render helper or error text.
-- Updates the `MultiSelect` component so it closes when the "escape" key is pressed.
-- Updates where the focus is set in the `MultiSelect` "dialog" variant after the "Apply" button is clicked.
-- Updates where the focus is set in the `MultiSelect` component after the selected items count button is clicked.
-
-## 1.4.0 (January 26, 2023)
-
-### Adds
-
-- Adds the `MultiSelect`, `MultiSelectGroup`, `FilterBar` component.
-- Adds the `useMultiSelect`, `useFilterBar` hook.
-- Adds the `onChangeEnd` prop in the `Slider` component.
-- Adds `autocomplete` attribute to `TextInput`s with type `"tel"`, `"email"`,
-  and `"url"`.
-- Adds docs for `Links` and `Repetitive Actions` to the `Accessibility Guide`.
-
-### Updates
-
-- Updates the hex value for `ui.gray.xx-dark`, `ui.gray.xxx-dark`,
-  `ui.gray.xxxx-dark`, `dark.ui.bg.page`, `dark.ui.bg.hover`, `dark.ui.bg.active`,
-  `dark.ui.disabled.secondary`, `dark.ui.error.primary`, `dark.ui.error.secondary`,
-  `dark.ui.focus`, `dark.ui.link.primary`, `dark.ui.link.secondary`,
-  `dark.ui.status.primary`, `dark.ui.status.secondary`, `dark.ui.success.primary`,
-  `dark.ui.success.secondary`, `dark.ui.warning.primary`
-  and `dark.ui.warning.secondary`.
-- Updates the layout of the category `RadioGroup` to `column` for the mobile
-  view of the `FeedbackBox` component.
-- Updates the background color for the `"iconOnly"` and `"text"` variants of
-  the `Button` component.
-- Updates the DOM in the header of the `FeedbackBox` component to improve
-  accessibility.
-- Updates the `Link` component to include descriptive text for screen readers
-  in the component's `"external"` variant.
-- Updates the `HelperErrorText` component to set the `ariaLive` default value
-  to `"polite"`.
-- Updates the `Accessibility` details for the `Notification` component.
-- Better docs for the `onSubmit` prop in the `FeedbackBox` component.
-
-### Fixes
-
-- Fixes spacing and alignment issues in the `FeedbackBox` component.
-- Fixes the width of the Privacy Policy link in the `FeedbackBox` component.
-- Fixes issue where `aria-describedby` attribute was not being added to
-  some `TextInput`s.
-
-### Removes
-
-- Removes the `Link` component warning about the deprecated `button` variant.
-  This change is temporary and will be reverted once teams are able to update
-  their `Link`s appropriately.
-- Removes the `arial-label` attribute from the `CheckboxGroup` and `RadioGroup`
-  components for improved accessibility. Using the attribute is redundant with
-  the existing "screen reader only" `<legend>` element.
-
-## 1.3.1 (December 15, 2022)
-
-### Adds
-
-- Adds the optional `isClearableCallback` prop to the `TextInput` component. This prop works with the `isClearable` prop and the passed function is invoked when the "clear" button is clicked. This is most helpful for controlled `TextInput` component implementations.
-
-### Updates
-
-- Updates the background color for the `hover` state in the `secondary` variant of the `Button` component.
-
-### Fixes
-
-- Fixes the z-index value of the SVG icon in the `Select` component so it does not render above other elements on a consuming application's page.
-
-## 1.3.0 (December 8, 2022)
-
-This release is exactly the same as the `1.3.0-rc` release candidate published on December 2, 2022. The `rc` release was reviewed and validated.
-
-## 1.3.0-rc (Release Candidate December 2, 2022)
-
-### Adds
-
-- Adds additional color options to `Icon` component.
-- Adds reusable iconColors and iconNames arrays/types for DRYer, easier-to-update code.
-- Adds the following color options to the color theme object: `ui.bg.page`, `ui.typography.inverse.body`, `ui.typography.inverse.heading`, `dark.ui.typography.inverse.body`, and `dark.ui.typography.inverse.heading`.
-- Adds the `StyledList` component.
-- Adds the `FeedbackBox` component, `useFeedbackBox` component hook, and `useStateWithDependencies` helper hook.
-
-### Updates
-
-- Updates the data displayed on the Colors Style Guide to expand the contrast details for the `ui` and `dark.ui` color.
-- Updates the `md` breakpoint to `"37.5em"`, which is equal to `"600px"`.
-
-### Fixes
-
-- Adds Node environment variable to npm script that Vercel uses to build the site. This patches an error from webpack not building correctly.
-
-## 1.2.2 (November 10, 2022)
-
-### Adds
-
-- Adds an `isClearable` prop to the `TextInput` component. When set to `true`, a close `Button` component will render on top of the input element. Once clicked, any text value in the input field will be cleared and focus will return to the input element.
-- Adds the `isClearable` property to the `textInputProps` prop object in the `SearchBar` component. This allows the `isClearable` prop to be passed to the `TextInput` component to render the close `Button` component.
-
-### Updates
-
-- Updates the `Icon` and `Logo` documentation to include size values in px.
-- Updates the spacing within the `tertiary` variant of the `Hero` component.
-- Updates the `Buttons Style Guide` to extend the information about button sizes.
-- Updates the `viewport` options in Storybook to align with the Reservoir breakpoints.
-
-### Fixes
-
-- Fixes an invalid TOC link on the `Card` component Storybook page.
-- Fixes the sizing of the `errorFilled` and `errorOutline` icons in the `Icon` component.
-- Adds new props to Chakra's `ToolTip` to more forcefully close the DS `ToolTip`. New props include `closeDelay`, `closeOnClick`, `closeOnEsc`, and `closeOnMouseDown`.
-
-### Removes
-
-- Removes the `Button` component warning about the deprecated `link` variant. This change is temporary and will be reverted once teams are able to update their `Button`s appropriately.
-
-## 1.2.1 (October 27, 2022)
-
-### Adds
-
-- Adds the `"buttonPrimary"`, `"buttonSecondary"`, `"buttonPill"`, `"buttonCallout"`, `"buttonNoBrand"`, `"buttonDisabled"` variants for the the `Link` component, set through the `type` prop.
-
-### Deprecates
-
-- Deprecates the `"button"` `type` variant for the `Link` component. Use any of the new `"buttonX"` variants instead.
-
-### Updates
-
-- Updates the `AlphabetFilter` component by adding `aria-label=“Filter by letter"` attribute
-  and removing the `role` attribute on the `<nav>` element.
-- Updates `AlphabetFilter` border color for the `active letter` indicator from
-  `ui.gray.medium` to `ui.gray.dark`.
-- Updates background styles for `Hero` component's `primary` and `campaign` variants.
-- Updates the hover styles for the `Checkbox` and `Radio` components.
-- Improves `TagSet` `"filter"` type accessibility by adding an `aria-label` that includes `"click to remove filter"`, when `isDismissible` is true.
-
-### Fixes
-
-- Updates Storybook npm packages to fix copying documentation and table of contents heading linking.
-
-## 1.2.0 (October 17, 2022)
-
-### Adds
-
-- Adds a variant for `NYCDOE` to the `Logo` component.
-- Adds the `TagSet` component.
-- Adds the `AlphabetFilter` component.
-- Adds the `AudioPlayer` component.
-- Adds the `requiredLabelText` prop to the `TextInput` and `Label` component.
-  This allows customizing the "(Required)" text for other languages.
-
-### Updates
-
-- Updates the `hamburger` SVG for the `Icon` component to allow for color assignments.
-- Updates `ComponentWrapper` prop `descriptionText` type to `string | JSX.Element`.
-
-## 1.1.2 (September 29, 2022)
-
-### Adds
-
-- Adds the `size` prop to the `Button` component. The accepted values are "small",
-  "medium", and "large". The default size value is "medium".
-- Adds the `value` prop to the `Slider` component to programmatically update the
-  values of the `Slider` component.
-- Adds the `value` prop to the `CheckboxGroup` component to programmatically
-  update the values of the `Checkbox`es within it.
-
-### Updates
-
-- Updates the colors for the `secondary` and `iconOnly` variants of the `Button` component.
-- Updates the `Tooltip` component to remove the dropshadow effect.
-- Updates whether the content inside of an `Accordion` is always rendered through the `isAlwaysRendered` prop.
-- Updates the spacing of the icon and text in the `Notification` component.
-- Updates the padding and placement of the links in the `Footer` component.
-- Updates how content in the `Table` component is aligned.
-- Updates the `Button` styles in the `Header`, `Notification`, `SearchBar`, and
-  `Tabs` components based on the new `size` prop.
-- Updates the `content` prop of the `Tooltip` component to accept number values.
-
-### Removals
-
-- Removed the `data-testid` attribute from the `Button` component.
-
-## 1.1.1 (September 19, 2022)
-
-### Adds
-
-- Adds the `text` variant in the `Button` component.
-
-### Fixes
-
-- Fixes a bug where the `defaultValue` for a `TextInput` component was not being passed correctly to the Chakra input element.
-
-### Deprecates
-
-- Deprecates the `link` variant in the `Button` component.
-
-## 1.1.0 (August 30, 2022)
-
-This release is exactly the same as the `1.1.0-rc5` release candidate which was published and reviewed. Minor bug fixes, listed below, were made.
-
-### Fixes
-
-- Fixes how the "footer" area is rendered in the `TemplateAppContainer`.
-- Fixes ARIA labels in the `Footer`.
-
-## 1.1.0-rc5 (Release Candidate August 14, 2022)
-
-### Header Feature
-
-- Adds static `Header` component with login dropdown (functionality to be added later).
-- Implements focus lock in `Login` component in the `Header`'s internal `Login` component.
-- Adds the `SkipNavigation` to the `Header` component.
-- Adds the `SitewideAlerts` component used internally in the `Header` component. This component dynamically fetches and renders NYPL sitewide alerts.
-- Adds login functionality, which includes reading cookie values with new package, js-cookie, making an API call for patron details, and showing a different UI to logged in users.
-- Adds refresh login functionality, which is used when a cookie's accessToken has expired and the server responds to a request for patron details with a 401. It attempts to refresh the token and, if successful, refetches the patron's details.
-- Adds the desktop search form to the `Header` component with the `SearchButton` and `SearchForm` components.
-- Refactors `SearchButton` and `SearchForm` to implement the mobile search form.
-- Adds the mobile navigation menu for the `Header` component with `MobileNav` and `MobileNavButton` components.
-- Adds the mobile login menu for the `Header` component.
-- Adds React context for the `Header`'s patron state data through `HeaderContext` and `HeaderProvider`.
-- Better namespacing for Header-only components.
-- Sets Header Auth links for production and development environments.
-- Adds the `EncoreCatalogLogOutTimer` function to keep track of the patron's current site and when they should be logged out of Encore/Catalog after a timeout period.
-- Uses legacy SVG icons for parity with the existing `Header` component.
-
-### Adds
-
-- Adds `Tooltip` component.
-- Adds the basic `Footer` React component and documentation. Uses "legacy" SVG icons in the `Footer` component for social media icons.
-- Adds @chakra-ui/focus-lock packages to dependencies and peerDependencies.
-- Adds the `useCloseDropDown` hook to manage closing dropdown-like components through clicks outside of it and by pressing the escape key.
-- Adds the `react-ga` package to send Google Analytics events in the `Header` component.
-
-### Updates
-
-- Updates the `onClick` event type for the `Pagination` links `onClick` function.
-- Updates the `Link` component's `onClick` event type.
-- Makes small, clarifying update to `Color Mode` story in Storybook.
-
-### Fixes
-
-- Fixes the styling for the `Image` component in the `Hero` "secondary" variant.
-
-## 1.0.8 (August 11, 2022)
-
-### Adds
-
-- Adds new color values under ui:
-  - `bg.default`, `bg.hover`, `bg.active`, `border.default`, `border.hover`, `typography.heading`, and `typography.body`.
-- Adds new colors values under ui.gray:
-  - `xxxx-dark` and `xxx-dark`.
-- Adds UI fills colors for dark mode in the codebase and also exported in the `useNYPLTheme` hook.
-- Adds an optional `panelMaxHeight` prop to the `Accordion` component that determines the height of the panel and displays a scrollbar if content exceeds it.
-
-### Updates
-
-- Updates color value for `xx-dark`.
-- Updates the style of the TOC on the `Style Guide` pages to match the style of the TOC on the component pages.
-- Updates the `Template` components to use CSS grid instead of flexbox.
-- Updates the `Template` documentation with the new pattern for using individual `Template` components that go above the main `TemplateContent` component.
-- Updates the `Placeholder` component's CSS to better display in the `Template` components.
-- Updates how HTML attributes are passed down in the `Image` component to the HTML `img` element.
-- Updates the `Accordion` so that its panel content only renders when the `Accordion` is open.
-
-## 1.0.7 (July 29, 2022)
-
-### Updates
-
-- Updates border color in the `Description` variant of the `List` component.
-- Updates how options are passed to the `SearchBar` component for its internal `Select` component.
-- Updates how style props are passed to the `Link` component when using with third-party libraries, such as React Router.
-- Updates the layout of the `Image` in the `Hero` "secondary" and "fiftyFifty" variants for mobile and desktop.
-
-## 1.0.6 (July 21, 2022)
-
-### Adds
-
-- Adds the `isLazy` prop to the `Image` component which is set to `false` by default.
-
-### Updates
-
-- Updates the following components to use React's `forwardRef` wrapper function to pass along refs to the correct DOM element. This is for third-party packages and components such as Chakra's `Tooltip` to work correctly.
-  - `Accordion`, `Breadcrumbs`, `Button`, `ButtonGroup`, `Card`, `ComponentWrapper`, `FieldSet`, `Form`, `SimpleGrid`, `Heading`, `HelperErrorText`, `Hero`, `HorizontalRule`, `Icon`, `Image`, `Label`, `List`, `Logo`, `Modal`, `Notification`, `Pagination`, `ProgressIndicator`, `SearchBar`, `SkeletonLoader`, `SkipNavigation`, `Slider`, `StatusBadge`, `StructuredContent`, `Table`, `Tabs`, `Template`, `TemplateAppContainer`, `Text`, `VideoPlayer`.
-- Updates `padding-left` and `padding-right` style properties to `padding-start` and `padding-end`, respectively. Updates `margin-left` and `margin-right` style properties to `margin-start` and `margin-end`, respectively. These changes apply to inline CSS, shorthand Chakra style prop syntax, and Chakra theme file syntax. Note that `margin-start/end` and `padding-start/end` get converted to `margin-inline-start/end` and `padding-inline-start/end` respectively by Chakra UI.
-- Updates the `Icon` component to include variants for legacy versions of `Account` (filled and unfilled), `Facebook`, `Instagram`, `Twitter` and `YouTube`.
-- Updates the `Icon` component to include variants for `Warning` (filled and oultine).
-
-### Removes
-
-- Removes the packages `@mdx-js/react` and `babel-loader` since they are not needed by Storybook.
-
-## 1.0.5 (July 7, 2022)
-
-### Adds
-
-- Exports `ColorCard`.
-
-### Updates
-
-- Updates the `Icon` component to include variants for `actionCheckCircleFilled`, `actionRegistration`, `decorativeEnvelope`, `decorativeLibraryCard` and `decorativeShoppingBag`.
-- Updates the docs for the `Colors` Style Guide to include additional data related to contrast and WCAG compliance.
-- Updates the `Checkbox` and `Radio` components to use `ui.gray.dark` for the default border color.
-- Updates Storybook packages.
-
-### Fixes
-
-- Fixes `useNYPLBreakpoints` hook so it internally controls its own state. This eliminates server/client rendering issues on its initial load.
-
-## 1.0.4 (June 23, 2022)
-
-### Adds
-
-- Adds the `useNYPLBreakpoints` hook. This hook internally uses Chakra's `useMediaQuery` hook to get the current responsive media query breakpoint.
-- Adds `ui.gray.xx-dark` to the color palette.
-- Adds npm packages useful for lazy loading images in the `Image` component.
-- Adds text case styles for `Text` component.
-- Exports `ColorModeScript`, `cookieStorageManager`, `localStorageManager`, `useColorMode`, and `useColorModeValue` from Chakra UI for consuming application usage.
-- Adds a "Color Mode" documentation page in Storybook.
-- Adds `ui.white` as default background color to `Checkbox` and `Radio` components.
-- Adds text case styles for `Heading` component
-
-### Updates
-
-- Updates the `Logo` component to include a variant for `MLN Color`.
-- Updates the `Icon` component to include variants for `Facebook`, `Instagram`, `Tumblr`, `Twitter` and `YouTube`.
-- Updates the `Icon` component to include variants for `Building`, `Exit`, `Locator`, `Power` and `Settings`.
-- Updates to Storybook version 6.5.
-- Explicitly sets the default color mode value to `"light"`.
-- Updates how the `styles.scss` and `resources.scss` files are organized and compiled so that they can be imported in any tech stack.
-- Updates the docs for the `Table` commponent to remove the example that does not include column headers.
-- Updates the `Button`, `Select` and `TextInput` components to use NYPL standard minimum height in mobile viewport.
-- Updates the `SearchBar` component to change how the width of the internal `Select` component is handled.
-
-### Fixes
-
-- Fixes the styles for the sub-labels in the `DatePicker` component.
-
-## 1.0.3 (June 9, 2022)
-
-### Adds
-
-- Adds prop validation for the `TextInput` "number" type for the `min` and `max` props.
-- Adds `min` and `max` prop value validation for the `Slider` component, including in the "range" mode.
-
-### Updates
-
-- Updates the `TemplateAppContainer`'s responsive styles for its sidebar component.
-- Updates how the `Radio`'s label is hidden when the `showLabel` prop is set to "false" to fix the "no label" accessibility issue.
-- Updates the `Logo` component to include new variants for `NYPL Text Only`.
-- Updates the `Card`'s full-click functionality styling for its wrapper element.
-- Updates how the `Card`'s `Image` component is displayed in the mobile view; sizes and aspect ratios are maintained instead of always displaying as 100% width.
-- Updates hover style to add right border color on hover for `Select` element.
-- Updates the `Table` component to be responsive for a mobile viewport.
-- Updates the `Table` component to make the `columnHeaders` prop required.
-
-### Fixes
-
-- Fixes the border color for the `Accordion` button.
-- Fixes a false warning message logged from the `Table` component.
-- Fixes the background color for the `Toggle` button.
-
-## 1.0.2 (June 1, 2022)
-
-### Adds
-
-- Adds `noSpace` prop to the `Heading` component.
-- Adds validation for equal headers and data column to the `Table` component.
-- Adds `className`, `helperTextStyles`, and `showHelperInvalidText` props to the `ComponentWrapper` component.
-
-### Updates
-
-- Updates the `fontSize` and `padding` attributes in the single variant of the `Accordion` component.
-- Updates all QA urls from Tugboat QA to Vercel.
-- Updates the `Logo` component to include new variants for `Apple App Store`, `Clever Badge` and `Google Play`.
-- Pins the Chakra UI "react" and "system" packages to a certain range since Chakra v2 uses React 18 and creates backwards compatibility issues.
-- Updates buttons setup as icon only to get the same hover styles as `secondary` button in the `Button` component.
-- Updates and refactors the `Checkbox`, `Radio`, `Select`, `Slider`, `TextInput` and `Toggle` components to use the `ComponentWrapper` component for similar DOM structure.
-- Updates how `CheckboxGroup` and `RadioGroup` handle `Checkbox` and `Radio` components when `isFullWidth` is true and there is JSX as labels.
-
-### Fixes
-
-- Fixes how `Image`s are rendered with a non-default `aspectRatio` value and with a `caption` value or a `credit` value or both.
-- Fixes the extra margin added by the `SkipNavigation` component.
-- Updates various component implementations in Storybook documentation pages to remove inadvertent console errors and warnings.
-- Fixes sizing in the `Card` component for the "body" and "right" sections when the `isAlignedRightActions` prop is set to `true`.
-- Allows `Button`s in the `ButtonGroup` to manage their own `isDisabled` state.
-- Fixes how the `onChange` prop is set in `Checkbox` so it only gets called once per rendering.
-
-## 1.0.1 (May 31, 2022)
-
-_NOTE_: This version number was previously released in 2019 and is marked as deprecated in npm. The next version bump from `1.0.0` is `1.0.2`.
-
-## 1.0.0 (May 12, 2022)
-
-This is the first stable release of the NYPL Reservoir Design System! We've been looking forward to this moment for over two years.
-
-### Updates
-
-- Updates all links throughout the documentation to point to the new production URLs.
-
-## 0.28.0 (May 9, 2022)
-
-### Adds
-
-- Adds `max`, `maxLength`, `min`, and `onClick` props to the `TextInput` component.
-- Adds the `SkipNavigation` component and adds this component inside the `TemplateAppContainer` component. The `SkipNavigation` component renders accessible links to the main content of a page and accessibility information on NYPL.org.
-- Adds the `ButtonGroup` component for `Button` layout.
-
-### Updates
-
-- Updates how styles are passed down to internal components in `Card`, `Checkbox`, `CheckboxGroup`, `ComponentWrapper`, `DatePicker`, `Hero`, `Notification`, `Pagination`, `Radio`, `RadioGroup`, `SearchBar`, and `Slider`. This is based on removing the `additionalStyles` prop and passing down styles to the `__css` prop.
-- Updates how the `id` is passed in the `DatePicker`'s custom `TextInput` component.
-- Updates how some prop values are passed. Instead of using a Typescript enum object, a Typescript type with the string literal values is used. This still restricts the accepted values for certain props. The enum to string literal type conversion includes the following variables: `AccordionType`, `BreadcrumbsTypes`, `ButtonTypes`, `DatePickerTypes`, `FormGaps` (deleted), `GridGaps`, `HeadingSizes`, `HeadingLevels`, `HeroTypes`, `IconAlign`, `IconTypes`, `IconRotationTypes`, `IconColors`, `IconSizes`, `IconNames`, `LinkTypes`, `ListTypes`, `LogoColors`, `LogoSizes`, `LogoNames`, `NotificationTypes`, `SelectTypes`, `LabelPositions`, `SkeletonLoaderImageRatios`, `StatusBadgeTypes`, `StructuredContentImagePosition`, `TextSizes`, `TextInputTypes`, `TextInputFormats`, `TextInputVariants`, `ToggleSizes`, `VideoPlayerTypes`, `VideoPlayerAspectRatios`, and `LayoutTypes`.
-- Updates the spacing for caption and credit text from `margin-bottom` to `margin-top` in `Image` component
-- Updates how the `DatePicker` and `Slider` components internally use `TextInput`.
-- Updates how the `Pagination` component internally uses `Link`.
-- Updates how the `Tabs` component internally uses `Button`.
-- Updates how images are passed to the `Hero` component. Instead of `imageAlt` and `imageSrc` props, now an object must be passed to the `imageProps` prop.
-- Updates the values for the `name` prop for the `Icon` and `Logo` components.
-- Updates the `Table` component to allow JSX elements to be rendered in the data cells.
-
-### Removals
-
-- Removes the `additionalStyles` attributes from the `Breadcrumbs`, `Button`, `Heading`, `HelperErrorText`, `Icon`, `Link`, `List`, `Logo`, `Select`, `TextInput`, and `Toggle` components.
-- Removes `getVariant` and `getStorybookEnumValues` helper functions.
-- Removes all Typescript enum objects in favor of string literal types.
-- Remove the bottom margin attribute that is applied to the parent element for the `Select` component.
-- Removes the `attributes` prop from: `Button`, `Link`, and `TextInput` components.
-
-## 0.27.0 (April 27, 2022)
-
-### Adds
-
-- Adds two patterns for rendering the updated `Modal` component. This is still an ongoing work-in-progress as the `Modal` gets finalized but it is now using Chakra under-the-hood.
-- Adds `@chakra-ui/storybook-addon` so stories automatically pick up the Chakra-based NYPL theme.
-
-### Updates
-
-- Updates React and React DOM to version 17.
-- Updates Chakra packages `@chakra-ui/react` and `@chakra-ui/system`.
-- Updates the `HelperErrorText` styling to correctly display when used with a `Select` element with a `labelPosition` of inline.
-
-### Removals
-
-- Removes the following packages: `@storybook/addon-queryparams` and `react-router-dom`.
-
-## 0.26.1 (April 22, 2022)
-
-### Updates
-
-- Updates storybook URL from /reservoir/v0_26 to /reservoir/v0.]
-- Updates the `Header`'s bottom navigation links to be underlined and red when hovered.
-
-### Fixes
-
-- Adds updated package-lock file to fix bad installations.
-
-## 0.26.0 (April 22, 2022)
-
-### Adds
-
-- Exports the `useCarouselStyles` and `useWindowSize` hooks and adds documentation for all hooks in Storybook.
-- Adds additional semantic design tokens from `fontWeights` and `fontSizes` to the `useNYPLTheme` hook.
-- Adds a warning if a required `id` prop is not passed to one of the "Form Elements": `Button`, `Checkbox`, `CheckboxGroup`, `DatePicker`, `Fieldset`, `Form`, `Label`, `ProgressIndicator`, `Radio`, `RadioGroup`, `SearchBar`, `Select`, `Slider`, `TextInput`, `Toggle`.
-- Adds the `isRequired` prop to the `Label` component.
-- Adds the `labelPosition` prop to the `Select` component, so that the label can be styled inline with the select input.
-- Adds Chakra's "Style Props" functionality to every Reservoir component. For composed components, such as the `SearchBar` component, these style props are passed to wrapper element. This update also updates the snapshot tests for every component.
-- Adds the functionality to pass all valid HTML attributes to a Reservoir component, such as `data-*` props.
-- Adds semantic design tokens for `spacing` theme object.
-- Adds the `isAlignedRightActions` prop to the `Card` component to render `CardActions` components to the right of the main content area. This only works for the `Card`'s row layout.
-- Adds styles to target native HTML basic elements inside the `StructuredContent` component.
-- Adds `Reservoir` branding to Storybook.
-
-### Changes
-
-- Updates the hex color value for `ui.gray.light-cool`, `ui.disabled.primary` and `section.blogs.primary`.
-- Updates the default background color used in the `Accordion` component.
-- Updates the default background color used in the `Hero` component.
-- Updates the background color used in the `SkeletonLoader` component.
-- Updates the background color used in the `VideoPlayer` component.
-- Updates the background colors used in the `Tabs` component.
-- Updates the colors for "secondary" and "pill" variants of the `Button` component.
-- Updates the color values used in the `disabled` state for the `Checkbox`, `Radio`, `Select`, `Slider`, `TextInput` and `Toggle` components.
-- Updates the `Checkbox` component to use "3px" for the border radius.
-- Makes the id prop required for all "Form Elements".
-- Updates how the `Required` text in the `Label` and `Fieldset` components is displayed. Instead of floating to the right of the label and legend elements, it is now displayed inlined as `(Required)`.
-- Renames the `optReqFlag` prop to `showRequiredLabel` in the `CheckboxGroup`, `Fieldset`, `RadioGroup`, and `Slider` components.
-- Renames the `showOptReqLabel` prop to `showRequiredLabel` in the `DatePicker`, `Select`, and `TextInput` components.
-- Uses the design token "text.caption" variable for the `Notification`'s font size.
-- Updates the styling for the `HelperErrorText` to be consistent for all components that use it
-- Refactors the `Checkbox`, `CheckboxGroup`, `ComponentWrapper`, `DatePicker`, `Fieldset`, `Label`, `Radio`, `RadioGroup`, `Select`, `Slider`, `TextInput`, and `Toggle` to better use the updated `HelperErrorText` styling.
-- Renames the `Card`'s `center` prop to `isCentered` and `border` prop to `isBordered`.
-- Renames the `SkeletonLoader` component's `border` prop to `isBordered`.
-- Refactors the DS `RadioGroup` component so it internally implements Chakra's `RadioGroup` component rather than the `useRadioGroup` hook. The "uncontrolled" version of Chakra's `RadioGroup` is not working and will be investigated in the future. It is recommended to use the controlled component pattern.
-- Updates the `Fieldset` component to render the "Optional"/"Required" text in the `legend` element as pseudo CSS in the `::after` rule.
-- Passes the `isRequired` prop in the `RadioGroup` and `CheckboxGroup` to the `Fieldset` wrapper component.
-- Updates the `focus` styles for the `Radio`, `Select` and `TextInput` components.
-- Updates the references of the `<dl>` element from "Definition" to "Description", as that's the official name in HTML5. This affects the `List` element and its `ListTypes.Description` enum value.
-- Updates styles for `React Datepicker`'s calendar popup in the `DatePicker` component.
-- Updates storybook URL from /storybook-static/ to /reservoir/v0_26.
-- Updates all references to "design system" in the Storybook documentation to include "Reservoir" in the name of the design system.
-- Updates language on the `Welcome` page.
-
-### Removals
-
-- Removes the default `Optional` text displayed in the `Label` and `Fieldset` components.
-- Removes the `optReqFlag` prop in the `Label` component.
-- Removes the default autogenerated id for all components, as well as the `uuid` package.
-- Removes the `HorizontalRule`'s `height` and `width` props from its prop interface in favor of Chakra's style props; the default values are still set for `height` and `width`.
-
-### Fixes
-
-- Fixes how the `Button` component gets rendered inside the `Form` and `FormField` component layout.
-- Fixes how the `Select` component is controlled in the `SearchBar` component.
-
-## 0.25.13 (April 1, 2022)
-
-### Adds
-
-- Adds a `contentId` prop to the `TemplateAppContainer` component and adds an `id` prop to the `TemplateContent` component. The default value of these `id`s are both set to "mainContent" and it will render as an attribute on the `main` HTML element. This is used as the target for the skip navigation link in consuming applications.
-- Adds an `Accessibility Guide` section to Storybook with a "Skip Navigation" page.
-- Adds the `isFullWidth` prop to the `CheckboxGroup` and `RadioGroup` components. This sets the wrapper element to be full width for labels that need to span its container.
-- Adds an optional key – `accordionType` to the `Accordion`'s `contentData` prop, which allows users to switch the background color of the `Accordion`'s button.
-- Created new `LayoutTypes` enum for row and column layouts.
-- Adds the value "Default" to the `IconSizes` enum.
-
-### Changes
-
-- Updates Storybook's sidebar categories and documentation.
-- Updates the `Image`'s caption font size to "12px" (`text.tag`).
-- Updates the `Checkbox`'s and `Radio`'s `labelText` prop to accept strings and JSX Elements.
-- Updates the `Toggle`'s internal styling for the default and small sizes.
-- Updates the `Accordion` button's background color when expanded, adds a border color when hovered over, and adjusts the padding.
-- Updates the `CardImage`'s margin bottom in the row and column layouts for mobile to be the same.
-- Updates the `CardImage` to have width 100% on mobile regardless of size.
-- Updates all the console warnings with consistent NYPL branding prefix label.
-- Renames the `Accordion` prop `contentData` to `accordionData`.
-- Renames the `Breadcrumbs` prop `colorVariant` to `breadcrumbsType`.
-- Renames the `Card` prop `center` to `isCentered`.
-- Updates the `Card` prop `layout` to use the `LayoutTypes` enum instead of `CardLayouts`.
-- Updates the `CheckboxGroup` prop `layout` to use the `LayoutTypes` enum instead of `CheckboxGroupLayoutTypes`.
-- Renames the `Heading` prop `displaySize` to `size.
-- Renames the `HeadingDisplaySizes` enum to `HeadingSizes.
-- Renames the `Hero` prop `image` to `imageComponent`.
-- Renames the `Image` prop `imageSize` to `size`.
-- Renames the `Notification` prop `centered` to `isCentered`.
-- Updates the `RadioGroup` prop `layout` to use the `LayoutTypes` enum instead of `RadioGroupLayoutTypes`.
-- Internal updates to the `SearchBar` component based on updates from the `Select` and `TextInput` components.
-- Renames the `Select` prop `type` to `selectType`.
-- Updates the `SkeletonLoader` prop `layout` to use the `LayoutTypes` enum instead of `SkeletonLoaderLayouts`.
-- Renames the `StructuredContentImage` prop `imageSize` to `size` (this component is based on the `Image` component).
-- Internal updates to the `StructuredContent` component based on updates from the `Image` and `Heading` components.
-- Renames the `Tabs` prop `contentData` to `tabsData`.
-- Renames the `Text` prop `displaySize` to `size`.
-- Renames the `TextInput` prop `variant` to `textInputType`.
-- Updates the `Card` image-related props into one main prop named `imageProps`. This new prop contains the following properties: alt, aspectRatio, caption, component, credit, isAtEnd, size, and src.
-- Updates the `Hero` prop `image` to `imageAlt` and `imageSrc`. Internally, an `Image` component is created.
-- Renames the `Image` component props `imageAspectRatio` to `aspectRatio`, `imageCaption` to `caption`, and `imageCredit` to `credit`.
-- Updates the `StructuredContent` image-related props into one main prop named `imageProps`. This new prop contains the following properties: alt, aspectRatio, caption, component, credit, position, size, and src.
-- Renames the `ToggleSizes.tsx` file to `ToggleTypes.tsx`. Updates the values from `Large` and `Small` to `Default` and `Small`.
-- Minor update to the logic for the `ProgressIndicator` sizing prop and styles.
-
-### Fixes
-
-- Fixes bug where the Next button in `Pagination` would navigate to the previous page.
-- Fixes the alignment of the first link in the `Pagination` component.
-- Fixes the `Breadcrumbs`' SVG arrow icon fill color for the "Blogs" variant.
-- Fixes the margin right value for list items in the `List` component for the inline style.
-- Fixes bug in the `Select` component where the SVG arrow hides when the component is focused.
-- Fixes the extra bottom spacing in the `HeroTypes.Campaign` `Hero` variant for the mobile view.
-- Fixes the `Slider` component so it doesn't cause a stack overflow client-side issue when updating the slider thumbs through the keyboard arrows. The values are now returned through Chakra's `onChange` callback instead of the `onChangeEnd` callback.
-
-### Removals
-
-- Removes the `CardLayouts`, `CheckboxGroupLayoutTypes`, `RadioGroupLayoutTypes`, and `SkeletonLoaderLayouts` enums.
-- Removes the `CardTypes.tsx`,` CheckboxGroupLayoutTypes.tsx`, and `RadioGroupLayoutTypes.tsx` files.
-
-## 0.25.12 (March 18, 2022)
-
-### Adds
-
-- Adds `Education` section colors to the color palette theme object.
-- Adds a `currentPage` prop to the `Pagination` component, a value that updates the selected page programmatically without the user explicitly requesting it.
-
-### Changes
-
-- Removes the margin from the global `.nypl p` CSS rule.
-- Updates the top and bottom margin of the `List`'s `Unordered` and `Ordered` types.
-- Updates the `Notification`'s icons to be decorative by default.
-- Updates the default placeholder value for the `SearchBar`'s `TextInput` component.
-- Updates the `SearchBar`'s `textInputProps` prop object to not require the `placeholder` property.
-- Updates the `Logo` component to include new variants for `FirstBook` and `Open eBooks`.
-- Updates the border and text styles for the `Select` component.
-- Updates the `Breadcrumbs` component to inlcude an `Education` color variant.
-- Updates the `Icon` component to include the `Education` color values.
-- Updates the default font stack to fix a typo that was disabling `sans-serif` in the stack.
-- Removes the `.nypl-ds` CSS class from the base SCSS file, from the `TemplateAppContainer` component, from the Storybook configuration, and from the entire repo.
-- Moves the base styles from the SCSS global file to the Chakra theme global JS object.
-- Updates the label font size for the `Radio` and `Checkbox` components to be "label.default".
-
-### Fixes
-
-- Fixes the styles for the `Slider` to better accomodate the slider thumbs and the width of the container.
-- Updates the alignment of the `Notifications`'s dismissible icon.
-- Fixes the border and padding from the `fieldset` HTML element by removing it.
-- Fixes alignment for long labels in the `Checkbox` and `Radio` components.
-- Fixes the line height for long labels in the `Toggle` component.
-
-## 0.25.11 (March 3, 2022)
-
-### Updates
-
-- Updates the `Logo` component to include new variants for `BPL`, `Clever`, `LPA`, `MLN`, `QPL`, `Schomburg`, `SimplyE` and `Treasures`.
-- Updates font size to "12px" and top margin to "4px" for `HelperErrorText` component.
-- Updates font size to "14px" for `TextInput` component.
-- Adds an `aria-label` attribute to the `Notification` component to use with its `aside` HTML landmark element. Added an "Accessibility" section in the `Notification` Storybook page to note that this component should not be used within a `header` or `footer` HTML landmark element.
-- Updates the `Notification` component to handle link color inside the content area, better styling for centering and the dismissible variation, and updated background color for the "Announcement" and "Warning" types.
-- Updates a log message in the `Icon` component to be more descriptive.
-- Updates the mobile styles for the image in the `StructuredContent` component.
-- Updates the prop type for the "Definition" `List` type so DOM elements can be passed in the definition.
-
-### Fixes
-
-- Updates the bottom margin of the `Select` in the `SearchBar` so that the helper text has standard gap between the main form components and itself.
-- Updates how `TabList` and `TabPanels` are returned in the `Tabs` component so no false log messages are consoled.
-- Updates `List` component styling for inline.
-
-## 0.25.10 (February 22, 2022)
-
-### Adds
-
-- Exports Chakra's `Flex` and `Spacer` components.
-- Adds `TemplateAboveHeader` component in the set of "template" components.
-- Adds the `aboveHeader` prop to the `TemplateAppContainer` component to render a `TemplateAboveHeader` component immediately before the `TemplateHeader` component.
-- Adds the `additionalStyles` prop to the `Select` component.
-
-### Breaking Changes
-
-- Renames the `Form` component's `"spacing"` prop to `"gap"` to be consistent with the `FormRow` and `FormField` components.
-- Renames the `FormSpacing` enum to `FormGaps`.
-
-### Changes
-
-- Passes an `onChange` prop to the `Select` component inside the `SearchBar` through its `selectProps` prop.
-- Adds snapshot tests for the `Tabs` component and better checks to warn the user that the `Tabs` is missing data if data wasn't passed as props or children.
-- Updates the `Form` component to warn developers when a child component in the `FormRow` component _is not_ a `FormField`.
-- Adds an `onSubmit` prop to the `Form` component.
-- Adds the `renderHeaderElement` prop to the `TemplateAppContainer` component. This prop is used to control whether the `TemplateAppContainer` component should render its own `<header>` HTML element through its `header` prop, or let the user pass in their own component that renders the `<header>` HTML element.
-- Updates the `Fieldset` and `RadioGroup` so the `children` prop is declared through `React.PropsWithChildren` rather than in their respective prop interfaces.
-- Adds snapshot tests for the `Accordion` component, as well as `id` props to the components within the `Accordion` so snapshot tests pass.
-- Passes an `id` to the `Icon` in the `Select` component.
-- Adds snapshot tests for the `Select` component.
-
-### Fixes
-
-- Fixes `id` propagation issues in the `SearchBar` component and its children DS components.
-- Fixing `Breadcrumbs` related logging issue with a CSS pseudo-selector and setting the `aria-label` to "Breadcrumbs". Adding an accessibility test that should fail when more than one `Breadcrumbs` component is rendered on a page since that landmark should only be rendered once on a web page.
-- Exports the `FullDateType` interface related to the `DatePicker` component.
-- Fixes and removes bad console logs from the `Pagination` and `List` components.
-- Fixes auto-generated `id`s in the `Tabs` component.
-- Fixes the Figma link for the `Hero` component.
-- Fixes `Card` component bug for passing styles to the `CardHeading` correctly.
-- Fixes the `Table` component so that a custom header text color of white does not visually hide row headers on a white background.
-
-### Updates
-
-- Updates the following packages: multiple `@storybook/...` packages, `autoprefixer`, `eslint-plugin-storybook`, `husky`, `lint-staged`, `semantic-release-slack-bot`, `storybook-addon-designs`.
-- Removed the following packages: `postcss`, `pretty-quick`.
-- Added `@chakra-ui/react`, `@chakra-ui/system`, `@emotion/react`, `@emotion/styled`, and `framer-motion` as "peerDependencies".
-- Updates the node version in Github Action workflows from Node v12 to Node v14.
-- Updates how `/dist/resources.scss` is created through gulp.
-
-## 0.25.9 (February 3, 2022)
-
-### Adds
-
-- Adds the `Logo` component.
-- Adds the `noBrandButtonType` boolean prop to the `SearchBar` component to render the `NoBrand` `Button` variant style.
-- Adds element-specific design tokens for `fontSizes` and `fontWeights`.
-- Adds the `StructuredContent` component.
-- Adds the `additionalImageStyles` and `additionalFigureStyles` props to the `Image` component to specifically target the `img` element's style and the `figure` HTML elements.
-- Adds the `Table` component.
-
-### Breaking Changes
-
-- Completely removes the `CardEdition` and `Input` components and related files and references.
-- Removes all references of the `BEM` CSS pattern.
-- Removes all references to logos from the `Icon` component.
-- Removes passing in text to the `HelperErrorText` component as children. Now, the `text` prop is used to render its text.
-- Renames the `SearchBar`'s `helperErrorText` prop to `helperText` to be consistent with other components.
-
-### Changes
-
-- Updates the `Form`, `HorizontalRule`, `Image` component by removing the native HTML attributes as props. This sets the props allowed to the list of props declared in their own files.
-- Minor change to the `Notification`'s heading component so it adds a proper id to `NotificationHeading`.
-- Updates the `Heading` component to use the DS `Link` component rather than Chakra's `Link` component.
-- Updates the style of links rendered in the `Heading` component so they are styled as standard links. The only exception is for links used in the `Card` component for the _full-click functionality_ feature. Otherwise, links in `Card` headings are styled as standard links.
-- Updates the `SearchBar` component to now be implemented with the `ComponentWrapper` component.
-- Removes the `ButtonTypes.SearchBar` variant style for the `Button` component. The style object is now set and passed directly to the `Button` component in the `SearchBar` component through the `additionalStyles` prop.
-- Renames `additionalStyles` prop to `additionalWrapperStyles` in the `Image` Component.
-- Updates the label text style in the disabled state of the `Toggle` component.
-- Updates the `Card` component so it gives a bottom margin to the `Image` component when the `imageAspectRatio` prop is set to `ImageRatios.Original`.
-- Updates the `TextInput` component to use a white background for `static`, `error` and `focus` states.
-- Updates `Select` component to use a white background for `static`, `error` and `focus` states.
-- Updates the `Template` component to use `s` (16px) spacing on the left and right sides of the main content area.
-- Updates the `HelperErrorText` component to allow HTML to be passed in as a string or HTML.
-- Updates how the `HelperErrorText` component renders text in the following components: `Checkbox`, `CheckboxGroup`, `ComponentWrapper`, `DatePicker`, `Radio`, `RadioGroup`, `SearchBar`, `Select`, `Slider`, `TextInput`, `Toggle`, `VideoPlayer`.
-- Updates the `HorizontalRule` component to use "100%" as the default value for the `width` prop.
-
-### Fixes
-
-- Fixes the styling of custom anchor elements when passed as a child in the `Link` component.
-- Allows the `TemplateAppContainer` and `TemplateFooter` components to use the `renderFooterElement` prop. This is `true` by default so it renders an HTML `footer` element. If a custom footer component that renders its own HTML `<footer>` must be used, then setting `renderFooterElement` to false will not render two nested `footer` elements.
-- Fixes the Storybook `level` prop value for the `Heading` component so it updates the component.
-- Removes wrapper divs around custom image elements used in the `Card` component. Also passes the aspect ratio as `ImageRatios.Original` when the custom image element is passed to the `Card` component.
-
-## 0.25.8 (January 6, 2022)
-
-### Adds
-
-- Adds `embedCode` prop to `VideoPlayer` component.
-- Adds export statements for `ProgressIndicatorSizes` and `ProgressIndicatorTypes` enums to `index.ts`.
-- Adds `ExtraSmall` and `ExtraExtraSmall` size variants to the `Image` component.
-- Adds `ExtraSmall` and `ExtraExtraSmall` size variants for `CardImage` in the `Card` component.
-- Adds `AlertNotificationImportant` icon to `Icon` component.
-- Adds `Toggle` component.
-- Adds `xxxs` (2px) spacing option to DS design tokens.
-- Adds `external` variant to `Link` component.
-
-### Changes
-
-- Changes category for `Table` component from `Basic Elements` to `Page Layout`.
-- Updates the background color for the `Locations` variant in the `Breadcrumbs` component from `section.locations.secondary` to `section.locations.primary`.
-- Updates the `Notification` component to show the `AlertNotificationImportant` icon for the `Standard` variant.
-- Reduces the bottom margin on labels and legends for form components from "16px" to "8px", or "s" to "sx" in Chakra-theme variables.
-- Updates docs for Chakra `Grid` component to use theme object values rather than CSS variables.
-- Updates the spacing in the `Notification` component to improve the alignment of the icon and text elements.
-- Updates the `Notification` component to optionally display/hide the `Icon` in the heading or content area.
-- Updates the `ComponentWrapper` component to allow the internal `HelperErrorText` component to get set in the invalid state. Also added tests for this component.
-
-### Fixes
-
-- Fixes two bugs in the `Slider`: (1) unable to call the `onChange` function when it is not passed, and (2) fixing the default array value for the range slider so it mounts properly.
-- Updates the `Select` component's controlled state so that an initial empty `value` prop is acceptable.
-
-## 0.25.7 (December 20, 2021)
-
-### Fixes
-
-- Removes `<=12.22` from node engine in `package.json` to reduce installation issues.
-
-## 0.25.6 (December 16, 2021)
-
-### Adds
-
-- Adds export statements for `ProgressIndicator` and `Slider` components to `index.ts`.
-- Adds `Blogs` variant to `Breadcrumbs` component.
-- Adds the `placeholder` prop to the `Select` component.
-
-### Changes
-
-- Adds "(Required)" text to the placeholder in the `SearchBar` component when `isRequired` is true.
-
-## 0.25.5 (December 9, 2021)
-
-### Fixes
-
-- Updates the Github Action for the Github Pages deployment to use node 12 instead of the default node 16. This caused issues since we now set the node engine to `<=12.22`.
-
-## 0.25.4 (December 9, 2021)
-
-### Adds
-
-- Adds the `ProgressIndicator` component.
-- Adds documentation for using `NYPL Design Tokens`.
-- Adds the `ActionHelpDefault`, `ActionHelpOutline` and `ActionLaunch` icons to the `Icon` component.
-- Adds the DS `Slider` component based on the Chakra `Slider` and `RangeSlider` components.
-- Adds the `ButtonTypes.NoBrand` variant to the `Button` component.
-- Adds the `additionalStyles` prop to the `Breadcrumbs` component.
-
-### Changes
-
-- Updates the organization of SCSS files by deleting some files and combining others.
-- Updates `@chakra-ui/react` to version 1.7.1 and `@chakra-ui/system` to version 1.8.1.
-- Updates the `TextInput` component to now have `defaultValue` and `step` props.
-- Updates `Latest Version` number for `Image`, `Notification` and `Pagination` components.
-- Removes the Storybook "Knobs" addon.
-- Updates the margin for labels in the `DatePicker` component when it is in the "date range" state.
-- Updates the `DatePicker` component to have proper form spacing when in the "date range" state.
-- Updates the `Tabs` component to comply with linting rules -- no functional or visual changes were made.
-- Removes the `alignText` prop from the `Notification` component. Storybook was incorrectly displaying `alignText` as an available prop.
-
-### Fixes
-
-- Exports components and variables that were initially missed when they were added: `ColorVariants`, `Fieldset`, `IconAlign`, `StatusBadgeTypes`,
-- Fixes `SearchBar` by passing necessary props down to its `TextInput` through the `textInputProps` prop.
-- Fixes `DatePicker` component unit tests.
-- Removes the `showLabel` prop from the `SearchBar` component to prevent confusion. Labels for the `Select` and `TextInput` components are never shown but are added through the `aria-label` attribute.
-
-### Breaking Changes
-
-- Updates the breakpoint CSS variable names by adding the `--nypl` prefix and the SCSS variables by adding the `$nypl` prefix. Updates references throughout the codebase.
-- Changes the `Button`'s `disabled` prop to `isDisabled`.
-- Updates npm packages in `package.json`. Removes `cpy-cli`, `react-uid`, `react-is`, `stylelint` and related packages, and `ts-loader` (already added through TSDX). Updates other packages such as `sass-loader`, `prettier`, `jest`, `jest-axe`, and the majority of Storybook addon packages.
-
-### Deprecates
-
-- Deprecates the `Input` component. The `Input` component will be removed from the NYPL Design System React Library in the first release of January 2022.
-- Deprecates the `CardEdition` component. The `CardEdition` component will be removed from the NYPL Design System React Library in the first release of January 2022.
-
-## 0.25.3 (November 18, 2021)
-
-### Adds
-
-- Adds the `ImageRatios`, `ImageSizes`, and `ImageTypes` enums.
-- Composes the DS `Fieldset` component with Chakra. This always renders a `legend` element as its first child but it can be optionally hidden from the screen.
-- Adds the ability to make an entire `Card` component clickable with Chakra's `LinkBox` and `LinkOverlay` components. Links in the `CardActions` component can still be accessed in this state by clicking with the mouse or tabbing and pressing "enter".
-- Adds new file type SVG files to use in the `Icon` component: Audio, Doc, GenericDoc, Image, PDF, Spreadsheet, Video.
-- Adds `ActionCheckCircle` SVG file to use in the `Icon` component.
-
-### Changes
-
-- Updates the Github Action for the changelog reminder.
-- Updates the `Checkbox` component with an "indeterminate" state through the `isIndeterminate` prop.
-- Updates the `CheckboxGroup` component story with an "indeterminate" state example.
-- Updates the `CheckboxGroup` and `RadioGroup` components to use the `Fieldset` component.
-- Updates the `HelperErrorText` and `TextInput` components with added `additionalStyles` prop.
-- Updates the `Button` Style Guide documentation.
-- Updates the `Iconography` Style Guide story documentation.
-- Updates the `Button` font weight to "regular".
-
-### Fixes
-
-- Fixes nondeterministic unit test in the `DatePicker` component.
-- Version of latest `List` component release in its storybook page.
-- Adds validation to the `height` prop in the `HorizontalRule` so percentage values are not used. If a percentage value is used, the default "2px" value is set.
-- Fixes styling issues for the `Notification` dismissible button.
-- Fixes `SearchBar` mobile styling for the `Select`, `TextInput`, and `Button` components.
-- Fixes `SearchBar` focus flicker when the `Select` component is selected.
-
-### Breaking Changes
-
-- Updates the `Notification` component to fix the custom icon alignment.
-- Adds the `title` prop to the `Icon` component to render a `title` HTML element for accessible SVG icons.
-- Updates the default font size of the `Button` component to `"-1"` (14px) for all variants except the `Link` variant. Removes the `bem` function from internal use and makes it clearer that the `ButtonGroup` Chakra component is exported in the Design System.
-- Updates the `errorText` prop to `invalidText` for the `Checkbox` component.
-- Composes the DS `Pagination` component with Chakra. Removes the BEM-related props and updates the `currentPage` prop to `initialPage`. The current selected page is now kept in state inside the `Pagination` component and returned to the user through `getPageHref` or `onPageChange`. This also adds better aria attributes to the list inside the `Pagination` component.
-- Composes the DS `Image` component with Chakra styling and updates all `Image` references in other DS components. The `attributes` prop and the BEM related props `blockname` and `modifiers` have been removed. Adds the following new props: `additionalStyles`, `component`, `imageAspectRatio`, `imageSize`, `imageType`.
-- Composes the DS `Card` component with Chakra. BEM related props `modifiers` and `blockname` have been removed. Replaces the `CardImageRatios` with `ImageRatios`. Removes the `CardImageSizes` enum.
-- Composes the DS `DatePicker` component with Chakra. Adds more tests, documentation, and examples. This component now uses the `Fieldset` component for the date range type, and better `Form` components for layout. Prop name changes: `dateRange` is now `isDateRange` and `required` is now `isRequired`. BEM related props `modifiers` and `blockname` have been removed. The "Required"/"Optional" text in the date range legend can now be hidden with the `showOptReqLabel` prop.
-- Composes the DS `SkeletonLoader` with Chakra's `Skeleton` component. BEM related prop `modifiers` has been removed. Chakra's default `Skeleton` styles have been updated with NYPL's theme.
-- Removes deprecated CSS variables. Now the DS repo only uses the CSS variables exposed by Chakra that contain the `--nypl` prefix.
-
-## 0.25.2 (October 28, 2021)
-
-### Adds
-
-- Adds custom `useCarouselStyles` hook for the `Tabs` mobile carousel functionality.
-- Adds custom NYPL-theme radii values to use within Chakra, mostly for border radius values.
-- Adds the `showHelperInvalidText` prop to form components to control displaying or hiding the content in the `HelperErrorText` component.
-- Adds `useNYPLTheme` hook for consuming applications to use NYPL DS values.
-- Adds the DS `ComponentWrapper` helper component for internal use.
-- Adds `useWindowSize` hook for responsive styles and functionality.
-- Adds Chakra Migration Guide for version `0.25.0` and greater.
-
-### Changes
-
-- Updates the CSS vars name prefix to use `nypl`.
-- Updates documentation in the README and updates the issue contribution template.
-- Updates the following components to use the `showHelperInvalidText` prop: `Checkbox`, `CheckboxGroup`, `DatePicker`, `Radio`, `RadioGroup`, `SearchBar`, `Select`, `TextInput`, `VideoPlayer`.
-
-### Breaking Changes
-
-- Composes the DS `Notification` component with Chakra components. Removes the `NotificationHeading` and `NotificationContent` components as exports and are only used internally in `Notification`. Instead of children component, `Notification` accepts the heading and content values through the `notificationHeading` and `notificationContent` props, respectively.
-- Composes the DS `HelperErrorText` component with Chakra. BEM related props `modifiers` and `blockname` have been removed. The `isError` prop has been renamed to `isInvalid`.
-- Composes the DS `VideoPlayer` component with Chakra. BEM related prop `modifiers` has been removed.
-- Composes the DS `HorizontalRule` component with Chakra. BEM related prop `modifiers` has been removed, as well as the `attributes` prop.
-- Composes the DS `List` component with Chakra. BEM related props `modifiers` and `blockname` have been removed. The `noStyling` prop is now used for the no list style variant style.
-
-## 0.25.1 (October 14, 2021)
-
-### Adds
-
-- Updates the `Accordion` component to internally use Chakra components.
-- Adds DS `SimpleGrid` component composed from Chakra's `Simplegrid` component.
-- Adds DS `Text` component composed from Chakra's `Text` component.
-- Update the NYPL Colors with updated color names and values.
-- Composes the DS `TextInput` component from Chakra's `Input` and `Textarea` components.
-- Composes the DS `Select` component from Chakra's `Select` component.
-- Composes the DS `Hero` component from Chakra's component.
-- Composes the DS `CheckboxGroup` component from Chakra's `CheckboxGroup` component.
-- Composes the DS "Template" components (`Template`, `TemplateHeader`, `TemplateBreakout`, `TemplateContent`, `TemplateContentPrimary`, `TemplateContentSidebar`, `TemplateFooter`) from Chakra's `Box` component for page layouts through children components.
-- Composes the DS `TemplateAppContainer` component from Chakra's `Box` component for page layouts through props.
-- Composes the DS `Link` component with Chakra component and fixes the `Button` type.
-- Exports Chakra's `Grid` and `GridItem` components.
-- Composes the DS `Label` component with Chakra component and updates the font size.
-- Composes the DS `StatusBadge` component from Chakra's component.
-- Composes the DS `Forms` component using DS and Chakra components.
-- Composes the DS `Icon` component with Chakra's `Icon` component. Added new props for `Icon` sizing, alignment, name, and rotation.
-- Composes the DS `SearchBar` component from DS `Select`, `TextInput`, `Button`, and `HelperErrorText` components.
-- Composes the DS `Breadcrumbs` component from Chakra's `Breadcumb`, `BreadcrumbItem` and `BreadcrumbLink` components.
-
-### Changes
-
-- Updates spacing values to use NYPL spacing rather than "em"s.
-- Updates the `SkeletonLoaderLayouts` enum values from `Horizontal` and `Vertical` to `Row` and `Column`, respectively.
-- Updates the `CardLayouts` enum values from `Horizontal` and `Vertical` to `Row` and `Column`, respectively.
-- Updates font size of the `legend` element used in `CheckboxGroup`, `DatePicker` and `RadioGroup`.
-- Updates the radius values through Chakra's theme object.
-
-## 0.25.0 (September 30, 2021)
-
-### Breaking Changes
-
-- Renames `HeadingDisplaySizes.tsx` to `HeadingTypes.tsx`.
-
-### Adds
-
-- Integrates Chakra-UI into the codebase.
-- Moved SCSS and CSS variable styles into a custom NYPL theme to extend Chakra's base theme.
-- Adds `DSProvider` component to use the NYPL theme in consuming applications.
-- Exports Chakra's `Box`, `Center`, `Circle`, `Square`, `Stack`, `HStack`, and `VStack` components.
-- Composes the DS `Button` component from Chakra's `Button` component.
-- Composes the DS `Heading` component from Chakra's `Heading` component.
-- Composes the DS `Tabs` component from Chakra's `Tabs`, `TabList`, `Tab`, `TabPanels`, and `TabPanel` components.
-- Composes the DS `Radio` component from Chakra's `Radio` component.
-- Composes the DS `RadioGroup` component from Chakra's `RadioGroup` component.
-- Composes the DS `Checkbox` component from Chakra's `Checkbox` component.
-- Updates the `errorText` prop name to `invalidText`.
-
-### Removes
-
-- Removes the `color-classes` SCSS mixin.
-
-### Changes
-
-- Updates the development preview URL from the Netlify link to the Tugboat QA link.
-
-## 0.24.1
-
-### Adds
-
-- Adds `FormSpacing` enum to DS exports.
-- Adds `utility_account_filled`, `utility_account_unfilled`, `utility_hamburger` and `utility_search` icons to `Icon` component.
-
-### Changes
-
-- Updates `General Guidelines` for `Buttons Style Guide`.
-
-### Fixes
-
-- Fixes left padding on `Card` when `imageAtEnd` and `border` are both `true`.
-
-## 0.24.0
-
-### Breaking Changes
-
-- Renames original `Card` components to be `CardEdition`.
-
-### Adds
-
-- Adds the `DatePicker` component.
-- Adds new `Card` component.
-- Adds `spacing` prop to `Form` component to allow for spacing variations.
-- Adds Style Guide `Forms`
-
-### Changes
-
-- Exports `VideoPlayerAspectRatios`.
-- Adds additional props for the `DatePicker` component based on its TAD Addendum section.
-- Adds Tugboat QA configuration for PR preview deployments to replace Netlify.
-- Updates the `DatePicker`, `TextInput`, `Select`, and `Label` components to pass an optional `showOptReqLabel` prop to conditionally render "Required"/"Optional" in the label text.
-
-### Fixes
-
-- Fixes Accordion FAQ Storybook example rendering bug.
-
-## 0.23.4
-
-### Adds
-
-- Adds TSDX as the bootstrapping tool to add opinionated configurations.
-- Adds an `/example/` directory through TSDX with an small playground app.
-- Snapshot testing through `react-test-renderer` and Jest.
-- Typescript documentation file to be use as a development guide.
-- Typescript documentation for `enum` variables in the TYPESCRIPT file.
-- Adds `SkeletonLoaderLayouts` and `SkeletonLoaderImageRatios` enums to DS exports.
-- Adds heading, description and helper text to `VideoPlayer` component.
-- Adds `@storybook/addons-jest` plugin to display Jest/React Testing Library unit tests in a Storybook tab.
-
-### Changes
-
-- Updates Style Guide `Spacing`.
-- Updates `Hero` component to include `Campaign` variant.
-- Updates `Hero` stories to use MDX format.
-- Updated warnings for too few or too many option children for the `Select` component.
-- Updates the README to include information on the production, development, and "preview" Storybook documentation instances.
-- Removes a custom SCSS breakpoint in `_Breadcrumbs.scss` in favor of mobile-first style rules.
-- Replaces Mocha, Chai, Sinon, and Enzyme for Jest and React Testing Library for unit testing.
-- Replaces webpack with rollup through TSDX.
-- Updates npm scripts to use TSDX for internal commands.
-- Replaces lodash with own functions.
-- Minor updates to Github Actions.
-- Adds PostCSS/autoprefixer to Rollup workflow instead of the default scss minifier.
-
-### Fixes
-
-- Fixes the `bem` utility function so that it doesn't crash Storybook whenever the `modifiers` Controls prop option is empty.
-
-## 0.23.3
-
-### Fixes
-
-- Removes the `storybook-static` directory from `.gitignore` so that the Github Actions deploy job can work properly.
-
-## 0.23.2
-
-### Adds
-
-- Adds `Form` component.
-- Adds `Notification` component.
-- Adds Style Guide `Buttons`.
-- Adds `VideoPlayer` component.
-- Adds the ability to render a `textarea` element from the `TextInput` component.
-
-### Changes
-
-- Updates stories for the `List` component to use MDX format.
-- Updates stories for the `Pagination` component to use MDX format.
-- Updates how children are rendered in the `List` component. Direct children `li`, `dt`, and `dd` elements can still be passed, but specific data structures can be passed to the `listItems` prop to render the appropriate children element.
-- Updates to the contributing documentation, pull request template, and the README.
-- Changes `DisplaySizes` to `HeadingDisplaySizes`.
-- Changes `Skeleton Loader` to be configurable via props.
-- Changes `Button` to use `16px` for left/right padding for buttons with text; icon only buttons still use `8px` left/right padding.
-- Changes `TextInput` label text to `font-weight: 500`.
-
-## 0.23.1
-
-### Adds
-
-- Adds CSS vars for `font-weight`
-- Adds `displaySize` prop to `Heading`
-- Adds Style Guide `Iconography`
-- Adds new SVGs to be used with the `Icon` component. Among the new SVGs are: Error solid, Error outlined, Speaker Notes.
-- Adds ability to change the color of an SVG icon with classes such as: `ui-black` (default), `ui-white`, `brand-primary` (red), `section-research-secondary` (turquoise).
-- Adds `helperText` and `errorText` props to `Checkbox`
-- Adds `helperText` and `errorText` props to `Radio`
-- Adds `errorText`, `helperText`, `labelText`, `required` and `showLabel` props to `Select`
-
-### Changes
-
-- Updates content in Style Guide `Typography`
-- Updates content in Style Guide `Breakpoints`
-- Changes `Link` story from `.tsx` to `.mdx`.
-
-### Deprecates
-
-- Deprecates `ariaLabel`, `helperTextId`, `isRequired` and `labelId` props in `Select`
-
-## 0.23.0
-
-### Breaking Changes
-
-- Removes `breakout` CSS from `Breadcrumbs`. To retain previous behavior, `Breadcrumbs` component should be a child of a `.content-header` element.
-- Removes `breakout` CSS from `Hero Secondary`. To retain previous behavior, `Hero` component should be a child of a `.content-header` element.
-
-### Adds
-
-- Adds `HorizontalRule` component
-- Adds new `short` class for `Placeholder`
-- Adds `Style Guide` category to Storybook sidebar
-
-### Changes
-
-- Changes `Breadcrumbs` story from `.tsx` to `.mdx`
-- Changes `Heading` story from `.tsx` to `.mdx`
-- Changes suggested DOM structure in `Template` Story
-
-## 0.22.2
-
-### Changes
-
-- Adds documentation on layout bidirectionality
-- Changes `Pagination` to hide pagination UI when there are 0 or 1 pages.
-
-## 0.22.1
-
-### Changes
-
-- Removes `color-classes` and `css-vars` mixins from `_03-mixins.scss`
-- Adds `color-classes` and `css-vars` mixins to `styles.scss`
-- Changes order of CSS `@import` rules in `styles.scss`
-- Adds quotes around `black` and `white` in `$colors` object in `_colors-utility.scss`
-
-## 0.22.0
-
-### Breaking Changes
-
-- Removes `--ui-success` CSS variable and adds `--ui-success-primary` and `--ui-success-secondary`
-- Removes `checkboxId` prop from `Checkbox` component and employs `id` in its place.
-- Removes `defaultChecked` prop from `Checkbox` component.
-- Removed `labelOptions` prop from `Checkbox` component and employs `labelText` in its place.
-
-### Changes
-
-- Added: Definition List component.
-- Changed: Separate Checkbox into its own component.
-- Changed: Separate Radio button into its own component.
-- Adds `Tertiary` state to Hero component
-- Changes `Brand` and `Utility` color values to match Figma main file
-- Changes `Radio` styles to use SASS vars in place of CSS vars
-- Adds `TextInput` component to handle email, hidden, number, password, text, textarea, tel and url input types
-- Adds default width and padding to `StatusBadge` component.
-- Hides pagination when there are 0 or 1 pages.
-
-### BugFixes
-
-- Fixed layout bug for layouts that include a right sidebar column and DOM structure.
-
-## 0.21.2
-
-### Changes
-
-- Adds `getPageHref` to `Pagination`
-
-## 0.21.1
-
-### Changes
-
-- `Accordion`: Adds `fixed-height` modifier and `defaultOpen` prop
-- `List` defaults to grey bullets instead of black
-- Adds margins inside the default columns of `Card`
-
-### BugFixes
-
-- Breadcrumbs now show up in light colours
-- Template reflow and breakpoints now happen at the same time
-- Fixes release github action
-
-## 0.21.0
-
-### Breaking Changes
-
-- Removes `statusBadgeText` prop in StatusBadge to allow text to be inside component
-
-### Changes
-
-- Add `method` and `action` to `SearchBar` `<form>`
-
-### Bugfixes
-
-- Add the `attributes` property to the `SearchBar` `<form>`
-- Adds focus outline to the `Accordion` component so it appears when it is tabbed.
-
-## 0.20.2
-
-### Changes
-
-- Exports mixins in a `resources.scss` file that can be used by consumers.
-
-### Bugfixes
-
-- `Link` with class `button` has white text color
-
-## 0.20.1
-
-### Bugfixes
-
-- Fixes `Pagination` when there are fewer than 4 pages
-- Adds `StatusBadge` component to `design-system-react-components` package
-
-## 0.20.0
-
-### Changes
-
-- `Select`: selectedOption holds the selected value, instead of just the default.
-- `Hero`: `Hero.Secondary` now changes background color based on NYPL site section
-- `Hero`: All props are now optional
-- `Input`: added onChange prop to explicitly allow it to be used as a controlled component
-- Uses stricter linters and more Prettier configs.
-
-### Breaking Changes
-
-- Removed `SectionTitle`
-- Scopes all element selects to the `.nypl-ds` class
-
-## 0.19.1
-
-### Breaking Changes
-
-- Accordion: Accordion input styling affects only direct children
-- Checkbox: Allows checkbox to be used as a controlled component or uncontrolled component.
-
-## 0.19.0
-
-### Breaking Changes
-
-- Updates `Pagination` component to match new design.
-
-## 0.18.7
-
-### Changes
-
-- Adds actual `StatusBadge` component with props for setting levels [RENO-1882](https://jira.nypl.org/browse/RENO-1882)
-
-## 0.18.6
-
-### Changes
-
-- Updates `Hero`'s primary option to have a larger top/bottom padding on the inner content via [Reno-1670](https://jira.nypl.org/browse/RENO-1670)
-
-## 0.18.5
-
-### Changes
-
-- Converts the Accordion component to open and close through CSS rather than through Javascript.
-
-## 0.18.4
-
-### Changes
-
-- Updates the `Input` component to conditionally render an `id` attribute if an `id` prop value is passed to it.
-
-## 0.18.3
-
-### Changes
-
-- Add `overflow: hidden` to `.no-scroll` styling on `<body>` for modal to prevent scroll element for content behind modal being displayed
-
-## 0.18.2
-
-### Changes
-
-- Updates Accordion sets so that first item in list doesn't have `-1px` top margin
-
-## 0.18.1
-
-### Breaking Changes
-
-- For `Input` components that use the `.input-group` class, on mobile those input elements are now stacked on top of each other rather than side-to-side.
-
-### Updates
-
-- Updates the `Input` component to allow it to render a "hidden" input type.
-
-## 0.18.0
-
-### Breaking Changes
-
-- Removes type, color, and line-height declarations from `body` tags and moves them to the `.nypl-ds` namespace
-
-## 0.17.4
-
-### Changes
-
-- Moves footer outside of `.nypl-ds` namespace on Template story
-
-## 0.17.3
-
-### Adds
-
-- `SkeletonLoader` component for loading screens
-
-## 0.17.2
-
-### Adds
-
-- `selectedOption` to `Pagination` story
-
-## 0.17.1
-
-### Adds
-
-- `FiftyFifty` Hero type styling
-
-## 0.17.0
-
-### Breaking Changes
-
-- Sets up the default `font-size` value in the `.nypl-ds` namespace.
-
-## 0.16.1
-
-### Adds
-
-- Styling for `Accordion` sets
-
-### Changes
-
-- `className`s within `Accordion` for content
-- Hover stylings for `Accordion`
-
-## 0.16.0
-
-### Breaking Changes
-
-- Removes the padding on the `breakout` mixin
-- Removes the padding on the `wrapper` mixin at the `xl` breakpoint
-
-## 0.15.1
-
-### Removes
-
-- `arrow_xsmall` and `search_small` icons
-
-## 0.15.0
-
-### Breaking Changes
-
-- Fixes a bug in which content was not centered within `Button` when button was made larger than the text content
-
-### Removes
-
-- Additional `Button` CSS that was no longer used after Button API refactor in 0.13.0
-- Deprecates `SearchResultItem`
-
-## 0.14.0
-
-### Breaking Changes
-
-- `Image` now has an `alt` prop instead of an `altText` prop
-- Removes `isDecorative` property in favor of an empty `alt`
-
-### Adds
-
-- Adds HTML `<img>` props to the `Image` component
-
-## 0.13.0
-
-### Breaking Changes
-
-- Removes all icon props from `Button`. Button now uses `Icon` as a child
-- Removes `ButtonIconPositions`
-
-### Changes
-
-- Makes `Button`'s `onClick` property optional
-
-## 0.12.0
-
-### Breaking Changes
-
-- Moves box-sizing declarations to a `.nypl-ds` namespace. All future "global" CSS settings will move to exist under this namespace.
-
-### Adds
-
-- Universal focus styling
-
-## 0.11.5
-
-### Changes
-
-- Updates the margin on action-links from `xxs` to `xs`
-
-## 0.11.4
-
-### Changes
-
-- Removes the `description` tag from the `<span>` element wrapping svg icons (#360)
-
-## 0.11.3
-
-### Changes
-
-- `Icon` now accepts children for custom icons
-
-## 0.11.2
-
-### Adds
-
-- Status Badge component as stories
-
-## 0.11.1
-
-### Changes
-
-- DS bundle is now compiled for es5 instead of es6 to accommodate for IE11 and the arrow functions we're using in DS
-
-## 0.11.0
-
-## Breaking Changes
-
-- Removes options from the `Pagination` component
-
-## 0.10.4
-
-### Changes
-
-- Updates the `Link` component's `linkType` prop to `type`, implements `React.forwardRef` to use with other libraries, and updates the stories.
-
-## 0.10.3
-
-### Changes
-
-- Updates the `Icon` component's `name` prop to allow for `LogoNames` enum types.
-
-### Adds
-
-- Adds a "negative" NYPL logo to be used on non-white backgrounds.
-
-## 0.10.2
-
-### Changes
-
-- Updates the formatting of svg file names to use underscores
-
-## 0.10.1
-
-### Changes
-
-- Updates the `Input` element to allow props and attributes to be able to render input elements of type "radio".
-
-## 0.10.0
-
-### Removes
-
-- Deprecates `SectionName` in favor of the stories under `Colors—Brand`
-
-## 0.9.3
-
-### Adds
-
-- SVGs for NYPL full logo lockup, Queens Public Library Logo, and Brooklyn Public Library Logo
-
-## 0.9.2
-
-### Adds
-
-- CSS to style [React Autosuggest](https://github.com/moroshko/react-autosuggest/)
-
-## 0.9.1
-
-### Changes
-
-- `Breadcrumbs`'s background color now reflects the app's globally applied section modifier, such as `.nypl--locations`. It recognizes these for `--locations`, `--whats-on`, `--research`, and `--books-and-more`.
-
-## 0.9.0
-
-### Breaking Changes
-
-- Removes `$color-spotlight`, `$color-your-interests`, `$color-support`, and `$color-help`
-- Removes all `$nypl-` prefixed Sass variables
-- `$color-success` is now `--ui-success`.
-- Breakpoint variables are now prefixed with `breakpoint`.
-- Type sizing variables are now prefixed with `font-size`.
-- Typeface variables are now prefixed with `typeface`.
-- Removes `--font-size-1p5`, which was originally added as certain designs call out `20px` for headings and others at `18px`. Figma documentation refers to `18px` only as of [0.1.1](https://www.figma.com/file/qShodlfNCJHb8n03IFyApM/Master?node-id=10975%3A16).
-
-### Adds
-
-- Exposes color and typography constants as CSS variables
-- Adds Section colors for `--section-research-library-lpa`, `--section-research-library-schomburg`, and `--section-research-library-schwartzman`
-
-### Removes
-
-- Letterspacing property on all body copy
-
-## 0.8.0
-
-### Removes
-
-- `width: 100%` on svgs
-
-## 0.7.2
-
-### Adds
-
-- Adds icons for `accessibility_full`, `accessibility_partial`, `clock`, `check`, and `close`
-
-### Changes
-
-- Updates the `download` icon to Google Material Design's icon.
-
-## 0.7.1
-
-### Changes
-
-- Updated the Select component to take in a ref using ForwardRef and also a `name` prop.
-
-## 0.7.0
-
-### Breaking Changes
-
-- `FormDropDown` and `Dropdown` are now `Select`
-- `Textfield` has been retired in favor of `Input`
-- `Input` type is now controlled via an enum defined in `InputTypes` instead of a string
-- Changes `referenceId` to `htmlFor` on `Label`
-- Deprecates `DateRangeForm`, `BodyText`, `SearchPromo`, `Container`, and `RNHeaderWithSearch`
-- `Button` now accepts an `onClick` instead of a `callback`
-- In the `ButtonTypes` enum, `Filled` and `Outline` have been changed to `Primary` and `Secondary`, respectively
-- `Accordion` now accepts `accordionLabel` and `labelId` instead of `buttonOpts` properties
-- Removes project-specific styles for now deprecated `EditionCard`
-- Removes project-specific styles of `.search-results-list` and `.form-item--radios`
-- `UnorderedList` is now `List`, with an enum to control whether is it ordered or unordered
-- `Input` `id` is no longer prepended with `input-`
-- `Button` `id` is no longer prepended with `btn-`
-- `SearchBar` no longer has props for `selectChangeHandler`, `selectBlurHandler`, or `searchChangeHandler`.
-- `Input` offers `ariaLabel` and `ariaLabelledby` props in favor of `labelId` and `helperTextId`
-- Removes `headingAttributes?: {}` from `SectionTitle`
-
-### Adds
-
-- Adds `aria-live` and `aria-atomic` to `HelperErrorText` in its errored state
-- Adds "Optional", "Required", or empty string inside `Label` for forms
-- Adds `IconNames` enum to make `allSVGs` array globally accessible
-- Adds `width: 100%` globally to SVGs
-- `Card` now constrains items in its `image` column to the column width
-- Adds the `forwardRef` implementation to the `Input` component
-- Adds `disabled` prop to `Input` and `Button` components
-- Adds `disabled` styling to `Button.Primary`
-- Adds `className?: string;` as additional props to all components
-- Adds `attributes?: { [key: string]: string }; ` to `Input`, `Button`, `Select`, `Link`, and `Image`
-- Adds `justify-content: center` for `Button` with icon to adjust for mobile
-
-### Changes
-
-- Fixes bug in former `FormDropdown` (now `Select`) where the select value would not change if `selectedOption` were passed
-- `Link`'s scss now references `$ui-link-primary` instead of `$nypl-blue-regular`
-- Changes `Select`'s SCSS to use the updated styling from Filament Group
-- `Image` is wrapped in `figure` when `imageCaption` or `imageCredit` is passed to `Image`
-- Adds `viewport` properties to any SVG files that were missing it
-
-### Removes
-
-- Removes `HelperErrorTextOptions`
-
-## 0.6.0
-
-### Breaking Changes
-
-- Removes `RNSectionTitle`
-
-### Changes
-
-- Updates `$nypl-blue-regular` from #0071ce to #0576d3
-- `$nypl-blue-regular` is now extended with `$ui-link-primary`
-
-## [0.5.0]
-
-### Breaking Changes
-
-- `EditionCard` is now `Card`
-- Buttons from black by default to blue
-
-### Adds
-
-- Icon for audiobook
-- Changes the line-height values on some of the heading mixins
-
-## [0.4.1]
-
-### Changes
-
-- Makes all IDs optional
-
-## [0.4.0]
-
-### Breaking Changes
-
-- Concatenates `BasicLink`, `UnderlineLink`, and `IconLink` into `Link` with `LinkTypes` enum
-- Moves styles into their corresponding component folders
-- Moves base styles into the react-components package
-- Deprecates `@nypl/design-system-styles`
-
-### Changes
-
-- Moves tests into their corresponding component folders
-- Flattens component structure to export as one package.
-- Exports `Icon`
-
-## [0.3.7]
-
-- Fixed `dist` script so it clears the folder
-- Added `viewBox` to `arrow` icon
-
-## [0.3.6]
-
-- added `Template` stories
-- fixed `Accordion` buttons
-- added `viewBox` to `arrow-xsmall` icon
-
-## [0.3.5]
-
-- Move `Placeholder`, `Modal`, `SectionName` and `Container` from `/00-base` into top-level `/components`
-- Fix Storybook errors for Headings with Bold and Headings with Link.
-- Move `Headings/*` from `/02-molecules` into top-level `/components`
-- Inlined icons inside `react-components`
-- No longer publishing `@nypl/design-system-icons` package
-
-## [0.3.4]
-
-- Exported `searchValue` and `selectedField` in `RNHeaderWithSearch`
-
-## [0.3.3]
-
-- Added `blockName` handling to `DateRangeForm`
-
-## [0.3.1]
-
-- Exports `SectionName` and `Image`
-
-## [0.3.0]
-
-### Breaking Changes
-
-- Edition Card no longer accepts strings for links and descriptions
-
-### Changed
-
-- Added `iconName` as an optional prop in `IconLink`
-
-## [0.2.1] - 2020-04-23
-
-### Removed
-
-- `HeaderWithImageRight` component and corresponding story
-
-## [0.2.0] - 2020-04-13
-
-### Changed
-
-- Reworks `HeaderWithImageRight` into `Hero`, which accepts values from an enum to display different kinds of heros based on [this documentation page](https://www.figma.com/file/qShodlfNCJHb8n03IFyApM/Master?node-id=10968%3A5314)
-
-## [0.1.1]
-
-### Changed
-
-- `Textfield` id is no longer duplicated
-- `Dropdown` now applies `bem` `blockName`
-- `Pagination` now passes in `blockName` into `Dropdown`
-
-## [0.1.0]
-
-### Breaking Changes
-
-- Large classes now have `Opts` inteface that allows for the component to be built over multiple steps. This affects:
-  - `HelperErrorText`
-  - `Label`
-  - `TextField`
-  - `Button`
-- Deprecated `SearchResultsList`, `IconLinkList` and `EditionsList` in favor of `UnorderedList`
-- `type` in `Button` now corresponds to html button types. `buttonType` in button corresponds to the visual categories of buttons (eg: `filled`, `outline`)
-- `subtitle` in `SearchResultsItem` changed to `subtitleContent` to take a JSX
-- `Label` and `Button` only accept children when called directly
-
-### Added:
-
-- `Checkbox`
-- `DateRangeForm`
-- `Input`
-- `Accordion`
-- `UnorderedList`
-- # `Modal`
-
-## [0.0.17] - 2020-03-17
-
-- Changelog update
-
-## [0.0.16]
-
-- `HeaderImgRight` accepts elements
-
-## [0.0.15] - 2020-03-3
-
-### Changed
-
-- `Button` component accepts content to render from its `content` prop or its `children` prop.
-
-## [0.0.14] - 2020-02-18
-
-### Changed
-
-- `EditionCard` `EditionInfo` fields accept elements
-- `EditionCard` `ReadOnline` and `Download` fields accept elements
-
-### [0.0.14] - 2020-02-18
-
-- added `noLinkElement` to `EditionCard` to receive an element
-
-## [0.0.11] — 2020-01-23
-
-### Added
-
-- `EditionsList`
-
-## [0.0.10] - 2020-01-14
-
-### Added
-
-- `Dropdown` which controls `FormDropdown` and its corresponding `Label`
-- `Label`
-- `HelperErrorText`
-- `Pagination`
-- `EditionCard` component
-- `SearchResultItem` component that uses `EditionCard`
-- `RN Header With Search`
-- a story for `RN Section Title`, which is just a collection of styles
-- `SearchResultsList` component
-
-### Changed
-
-- added `iconModifiers` to `Button`
-- `buttonId` in `Button` is now required
-- refactored `FormDropdown` to not include its own `label`
-- `RN Header With Search`
-- a story for `RN Section Title`, which is just a collection of styles
-- `Link` -> `BasicLink` for clarity
-- Bugfixes in `UnderlineLink` and `IconLink`
-- Added stories for `BasicLink`
-- `Link` missing URL error message
-- Consolidated `Heading` and `PageTitle`
-- `Heading` now only takes a single span
-- Added ResearchNow specific `SearchBar` error state
-- A11Y changes for `SearchBar` and `HeaderWithSearch`
-- Added stories for AT-79, AT-264 and AT-3
-- `selectedOption` added to `FormDropdown` stores selected state
-
-## [0.0.7] - 2020-01-03
-
-### Added
-
-- A webpack file in order to build and distribute a compiled version of the react components. Does not replace the /lib folder usage, but the main file is now pointing to `/dist/design-system-react-components.min.js`.
-
-## [0.0.6] - 2019-12-31
-
-### Added
-
-- `Image` for 2:1 ratio
-- `PageTitle`
-- `Header with Image Right`
-- `FormDropdown`
-- `SearchPromo`
-
-### Changed
-
-- Moved heading-related atoms from `01-atoms/Text` into `01-atoms/Text/Heading`
-- Updated `Searchbar` component to include Parameters
-- Changed `Breadcrumb` export from `Breadcrumbs`
-
-## [0.0.5] - 2019-12-06
-
-### Changed
-
-- `Icon` import
-
-## [0.0.4] - 2019-12-06
-
-### Added
-
-- `Body text` component for plain-text elements
-- `UnderlineLink` and `IconLink` for links
-- `Icon` component that uses the `design-system-icons` package.
-- `SectionTitle` and `Heading` for heading components
-- `IconLink-List`for the list of subject links
-- `Button` and `TextField` for the searchbar
-- `SearchBar` component
-
-### Changed
-
-- `Breadcrumb` now shows icon in mobile view
-
-## [0.0.3] - 2019-11-15
-
-### Changed
-
-- Changed `Breadcrumb` to `Breadcrumbs` to match Twig
-- Changed the Breadcrumbs props to accept components
-
-## [0.0.2] - 2019-11-13
-
-### Added
-
-- Started a change log
-- Added the Breadcrumb React Component
-
-### Changed
-
-- Changed folder structure to match Twig
-
-## [0.0.1] - 2019-11-13
-
-- Published as a test