Merge branch 'release' into gh-pages

* release: (98 commits)
  Prep for Release v2.0.1
  2.0.1
  CHANGELOG typo
  Prep for Release v2.0.0
  added a note about transparent colors
  remove sentence in chakra doc
  removing useFilterBar and useMultiSelect hooks from sidebar
  re-enabling useCloseDropDown
  v2 logo and reference to v1.7.3
  remove older npm script
  removing MultiSelect, MultiSelectGroup and FilterBar from the docs
  Updating documentation and links to better reference the v2 update
  package-lock
  prettier
  updated Color Style Guide and tweaked SocialMediaLinks
  adding a few missing keys to the useNYPLTheme hook
  adjusting stories for SocialMediaLinks
  default color for Template component
  snapshots
  package-lock
  ...

.github/workflows/gh-pages.yml

@@ -30,7 +30,7 @@ jobs:
       - name: Build Storybook
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
-        run: npm run prebuild:storybook && npm run build-storybook:v1
+        run: npm run prebuild:storybook && npm run build-storybook:v2
 
       - name: Deploy
         uses: JamesIves/github-pages-deploy-action@releases/v3

.github/workflows/static.yml

@@ -36,7 +36,7 @@ jobs:
       - name: Build Storybook
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
-        run: npm run prebuild:storybook && npm run build-storybook:v1
+        run: npm run prebuild:storybook && npm run build-storybook:v2
       - name: Setup Pages
         uses: actions/configure-pages@v3
       - name: Upload artifact

.gitignore

@@ -9,4 +9,5 @@ lib
 dist
 .vscode
 .eslintcache
-coverage
+coverage
+.idea

.storybook/preview-body.html

@@ -91,14 +91,14 @@
         table.storybook-colors-example)) {
     border: none;
   }
-  .sb-show-main
+  /* .sb-show-main
     :where(table.storybook-colors-example:not(.sb-anchor, .sb-unstyled, .sb-unstyled
         table.storybook-colors-example))
     tr
     td,
   .sb-show-main table.storybook-colors-example td > span:first-of-type {
     color: unset;
-  }
+  } */
   .sb-show-main
     :where(table.storybook-colors-example:not(.sb-anchor, .sb-unstyled, .sb-unstyled
         table.storybook-colors-example))

CHAKRA_MIGRATION_GUIDE.md

@@ -1,11 +1,13 @@
 # Chakra Migration Guide
 
-The first Reservoir Design System (DS) version that includes the Chakra UI library is version `0.25.0`. This guide is meant for those who are using a version less than `0.25.0` and want to migrate to a version greater than or equal to `0.25.0`. If you're importing the latest DS version, this guide will also help!
+The first Reservoir Design System (DS) version that includes the Chakra UI library is version `0.25.0`. This guide is meant for those who are using a version less than `0.25.0` and want to migrate to a version greater than or equal to `0.25.0`.
+
+If you are using a DS version greater than 1.0, this guide does not apply.
 
 If you would rather read documentation on the Design System's internal use of Chakra, check the Storybook documentation page. The following two links have the same information but in different formats for your reading preference:
 
 - [MDX format](/src/docs/Chakra.stories.mdx)
-- [Storybook page](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/chakra-ui--docs)
+- [Storybook page](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/chakra-ui--docs)
 
 | Table of Contents |                                                       |
 | ----------------- | ----------------------------------------------------- |

CHANGELOG.md

@@ -8,6 +8,36 @@ Currently, this repo is in Prerelease. When it is released, this project will ad
 
 ## Prerelease
 
+## 2.0.1 (September 28, 2023)
+
+_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`.
+
+## 2.0.0 (September 28, 2023)
+
+### Breaking Changes
+
+- This update introduces a number of visual breaking changes related to typography styles.
+- Removes the `FilterBar` and `MultiSelect` components.
+- Removes the `useFilterBar` and `useMultiSelect` hooks.
+
+### Adds
+
+- Adds the `isUnderlined` prop to the `Link` component.
+- Adds the `"standalone"` variant to the `Link` component.
+- Adds `NYPL Patterns` to the `Links 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"` variant `hover` 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`, and `SkipNavigation` components to implement the `Typo2023` link patterns.
+
 ## 1.7.3 (September 13, 2023)
 
 ### Updates

README.md

@@ -8,8 +8,9 @@ The Reservoir Design System (DS) is NYPL’s open-source extensible React librar
 
 Storybook documentation
 
-- [Production - deployed to Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/welcome--docs)
+- [V2 Production - deployed to Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/welcome--docs)
 - [Development/QA - deployed to Vercel](https://nypl-design-system.vercel.app/?path=/docs/welcome--docs)
+- [V1 Production - deployed to Vercel](https://nypl-design-system-git-reservoir-v173-nypl.vercel.app/)
 
 | Table of Contents |                                                                                     |
 | ----------------- | ----------------------------------------------------------------------------------- |
@@ -138,28 +139,32 @@ The list of re-exported Chakra components can be found in the main [index.ts](/s
 Find more information about the Design System's internal use of Chakra to create and refactor components in the Storybook documentation page. The following two links have the same information but in different formats for your reading preference:
 
 - [MDX format](/src/docs/Chakra.stories.mdx)
-- [Storybook page](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/chakra-ui--docs)
+- [Storybook page](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/chakra-ui--docs)
 
 Chakra was integrated into the Design System in version `0.25.0`. For those looking to update to a version greater than or equal `0.25.0`, check out our [Chakra Migration Guide](/CHAKRA_MIGRATION_GUIDE.md).
 
 ## Storybook
 
-The Reservoir Design System leverages Storybook to document all the React components and style guidelines. The Storybook documentation can be found [here](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/welcome--docs). For your convenience, the Reservoir Design System components have been organized into logical categories based on both form and function. Please refer to the COMPONENTS section in the Storybook sidebar.
+The Reservoir Design System leverages Storybook to document all the React components and style guidelines. The Storybook documentation for version 2.x can be found [on Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/welcome--docs). For your convenience, the Reservoir Design System components have been organized into logical categories based on both form and function. Please refer to the COMPONENTS section in the Storybook sidebar.
 
 ### Documentation Instances
 
-There are currently two main instances of the Reservoir Design System Storybook documentation. There are also "preview" sites that are used to quickly and easily view pull request changes.
+There are currently three main instances of the Reservoir Design System Storybook documentation. There are also "preview" sites that are used to quickly and easily view pull request changes.
 
 **Production**
 
-The production Storybook documentation is deployed to [Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/welcome--docs). This is the main instance we use to share the latest stable release of the Reservoir Design System. This documentation site is deployed through [Github Actions](/.github/workflows/gh-pages.yml) only on merges to the `release` branch.
+The production Storybook documentation for DS version 2.x is deployed to [Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/welcome--docs). This is the main instance we use to share the latest stable release of the Reservoir Design System. This documentation site is deployed through [Github Actions](/.github/workflows/gh-pages.yml) only on merges to the `release` and `gh-pages` branches.
 
 As of July, 2021, the Github Pages production site gets deployed every two weeks on the same schedule as npm releases.
 
 **Development**
 
 The development Storybook documentation is deployed to [Vercel](https://nypl-design-system.vercel.app/?path=/docs/welcome--docs). This development site has all the working updates that get merged to the `development` branch. This means that this site is constantly being updated as pull requests are being merged in. This site is used to see the lastest changes during a working sprint before a production release is made.
 
+**Version 1.x**
+
+The Storybook documentation for DS version 1.x is deployed to [Vercel](https://nypl-design-system-git-reservoir-v173-nypl.vercel.app/). If you are using a DS version less than 2.0, this is the Storybook documentation you should be referencing. While the DS team will continue to support version 1.x, we will not be adding new features or components to this version. We highly recommend updating to version 2.x for design update and bug fixes.
+
 **Preview Sites**
 
 Preview Storybook documentation sites are deployed to Vercel on every commit push to every branch in this repository. They follow a pattern such as `nypl-design-system-[hash]-nypl.vercel.app` where `[hash]` is a random hash created by Vercel. This means that the URL varies and that those instances are eventually shut off. They are not meant to be used as long-term sites but rather for reviewing working changes within the team.
@@ -191,13 +196,13 @@ To help consuming application developers understand which version of the DS is r
 
 _Make sure not to commit the directory created from the following process_.
 
-There should be no need to run the static Storybook instance while actively developing -- it's used exclusively for building out the `gh-pages` environment and deploying it to [Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v1/?path=/docs/welcome--docs). In the event that you do run the static Storybook npm script, run:
+There should be no need to run the static Storybook instance while actively developing -- it's used exclusively for building out the `gh-pages` environment and deploying it to [Github Pages](https://nypl.github.io/nypl-design-system/reservoir/v2/?path=/docs/welcome--docs). In the event that you do run the static Storybook npm script, run:
 
 ```sh
-$ npm run build-storybook:v1
+$ npm run build-storybook:v2
 ```
 
-You can then view `/reservoir/v1/index.html` in your browser. _Make sure not to commit this directory_.
+You can then view `/reservoir/v2/index.html` in your browser. _Make sure not to commit this directory_.
 
 ## Accessibility
 

TYPESCRIPT.md

@@ -40,15 +40,15 @@ Component usage in a consuming application that uses Typescript:
 // No errors:
 <Heading
   id="h1"
-  level="one"
+  level="h1"
   text="Heading with secondary size"
   size="secondary"
 />
 
 // This will throw an error. "superLargeSize" is not a value declared in the `HeadingSizes` type set.
 <Heading
   id="h1"
-  level="one"
+  level="h1"
   text="Heading with bad size value"
   displaySize="superLargeSize"
 />

example/index.tsx

@@ -6,7 +6,7 @@ import { Heading } from "../src/index";
 const App = () => {
   return (
     <div>
-      <Heading level="one">NYPL</Heading>
+      <Heading level="h1">NYPL</Heading>
     </div>
   );
 };