scoobie 14.1.4 → 14.1.5

package/README.md

@@ -345,8 +345,7 @@ export const MyFirstInlineCode = () => (
 
 Render an internal link with the same opinions as our [MdxProvider](#mdxprovider):
 
-- Internal links use client-side navigation with smooth scrolling via [react-router-hash-link],
-  and pass through the `v` URL parameter for UI version switching
+- Internal links pass through the `v` URL parameter for UI version switching
 
 Unlike [SmartTextLink](#smarttextlink), this is not bound to a parent [Text] as it has no underlying [TextLink].
 It can be used to make complex components navigable rather than just sections of text.
@@ -399,8 +398,7 @@ export const Component = () => (
 
 Render all underlying links as follows:
 
-- Internal links use client-side navigation with smooth scrolling via [react-router-hash-link],
-  and pass through the `v` URL parameter for UI version switching
+- Internal links pass through the `v` URL parameter for UI version switching
 - External links open in a new tab
 - Links with a [`download` attribute] prompt the user with a file download
 
@@ -429,7 +427,6 @@ Render a text link with the same opinions as our [MdxProvider](#mdxprovider):
 
 - External links open in a new tab and have an [IconNewWindow] suffix
 
-[react-router-hash-link]: https://github.com/rafrex/react-router-hash-link
 [iconnewwindow]: https://seek-oss.github.io/braid-design-system/components/IconNewWindow
 
 ```tsx

package/package.json

@@ -4,13 +4,12 @@
   "license": "MIT",
   "main": "src/index.ts",
   "sideEffects": false,
-  "version": "14.1.4",
+  "version": "14.1.5",
   "dependencies": {
     "@capsizecss/core": "^3.0.0",
     "@mdx-js/loader": "^1.6.22",
     "@mdx-js/react": "^1.6.22",
     "@types/mdx-js__react": "^1.5.5",
-    "@types/react-router-hash-link": "^2.4.1",
     "@vanilla-extract/css": "^1.2.3",
     "@vanilla-extract/css-utils": "^0.1.1",
     "babel-loader": "^9.0.0",
@@ -21,7 +20,6 @@
     "polished": "^4.1.3",
     "prism-react-renderer": "1.3.5",
     "react-keyed-flatten-children": "^1.3.0",
-    "react-router-hash-link": "^2.4.3",
     "refractor": "^3.4.0",
     "remark-slug": "^6.1.0",
     "svgo": "^3.0.0",

package/src/components/InternalLink.tsx

@@ -1,17 +1,13 @@
 import clsx, { ClassValue } from 'clsx';
 import React, { ComponentProps, forwardRef } from 'react';
-import { useLocation } from 'react-router-dom';
-import { NavHashLink } from 'react-router-hash-link';
+import { NavLink, useLocation } from 'react-router-dom';
 
 import { parseInternalHref } from '../private/url';
 
 import * as styles from './InternalLink.css';
 
 interface Props
-  extends Omit<
-    ComponentProps<typeof NavHashLink>,
-    'className' | 'scroll' | 'smooth' | 'to'
-  > {
+  extends Omit<ComponentProps<typeof NavLink>, 'className' | 'to'> {
   className?: ClassValue | ((isActive: boolean) => ClassValue);
   href: string;
   reset?: boolean;
@@ -20,28 +16,17 @@ interface Props
 
 export const InternalLink = forwardRef<HTMLAnchorElement, Props>(
   ({ className, href, reset = true, state, ...restProps }, ref) => {
-    const scroll = (element: Element) =>
-      setTimeout(() => {
-        // Scroll to the header's `Stack` element so we don't cut off the heading
-        (element.parentElement ?? element).scrollIntoView({
-          behavior: 'smooth',
-        });
-      });
-
     const location = useLocation();
 
     const to = { ...parseInternalHref(href, location), state };
 
     return (
-      <NavHashLink
+      <NavLink
         {...restProps}
         className={(prop) => {
           // The boolean prop was introduced in React Router v5.3 as a bridge to
           // v6, then v6 decided to break the function signature anyway 🙃.
-          const isActive =
-            typeof prop === 'boolean'
-              ? prop
-              : (prop as { isActive: boolean }).isActive;
+          const isActive = typeof prop === 'boolean' ? prop : prop.isActive;
 
           return clsx(
             reset ? styles.reset : null,
@@ -49,8 +34,6 @@ export const InternalLink = forwardRef<HTMLAnchorElement, Props>(
           );
         }}
         ref={ref}
-        scroll={scroll}
-        smooth
         to={to}
       />
     );