braid-design-system 31.17.0 → 31.17.2

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # braid-design-system
 
+## 31.17.2
+
+### Patch Changes
+
+- Update `@vanilla-extract/css` dependency ([#1158](https://github.com/seek-oss/braid-design-system/pull/1158))
+
+  This fixes a type error that was occurring with typescript versions >=4.5.0
+
+- **Heading**: Nested icons inherit text colour ([#1153](https://github.com/seek-oss/braid-design-system/pull/1153))
+
+  When using icons inside of a `Heading`, the default `tone` was always `neutral`, rather than inheriting the colour of the nearest component.
+
+  For example, when an icon was used inside of a `TextLink` within a `Heading`:
+
+  ```jsx
+  <Heading level="1">
+    Title with{' '}
+    <TextLink>
+      link <IconArrow />
+    </TextLink>
+  </Heading>
+  // => Previously, IconArrow was the heading text colour
+  // `neutral`, now inherits the `link` colour.
+  ```
+
+  or equally, when an icon was used inside of a `Secondary` component within a `Heading`:
+
+  ```jsx
+  <Heading level="1">
+    Title with{' '}
+    <Secondary>
+      secondary <IconArrow />
+    </Secondary>
+  </Heading>
+  // => Previously, IconArrow was the heading text colour
+  // `neutral`, now inherits the `secondary` colour.
+  ```
+
+## 31.17.1
+
+### Patch Changes
+
+- Fixes an issue with a missing dependency ([#1143](https://github.com/seek-oss/braid-design-system/pull/1143))
+
 ## 31.17.0
 
 ### Minor Changes

package/codemod/dist/wrapper.js

@@ -36319,9 +36319,9 @@ var require_set_array_umd = __commonJS({
   }
 });
 
-// ../../../node_modules/.pnpm/@jridgewell+sourcemap-codec@1.4.13/node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.umd.js
+// ../../../node_modules/.pnpm/@jridgewell+sourcemap-codec@1.4.14/node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.umd.js
 var require_sourcemap_codec_umd = __commonJS({
-  "../../../node_modules/.pnpm/@jridgewell+sourcemap-codec@1.4.13/node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.umd.js"(exports2, module2) {
+  "../../../node_modules/.pnpm/@jridgewell+sourcemap-codec@1.4.14/node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.umd.js"(exports2, module2) {
     (function(global2, factory) {
       typeof exports2 === "object" && typeof module2 !== "undefined" ? factory(exports2) : typeof define === "function" && define.amd ? define(["exports"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2.sourcemapCodec = {}));
     })(exports2, function(exports3) {
@@ -36485,16 +36485,26 @@ var require_sourcemap_codec_umd = __commonJS({
   }
 });
 
-// ../../../node_modules/.pnpm/@jridgewell+resolve-uri@3.0.7/node_modules/@jridgewell/resolve-uri/dist/resolve-uri.umd.js
+// ../../../node_modules/.pnpm/@jridgewell+resolve-uri@3.1.0/node_modules/@jridgewell/resolve-uri/dist/resolve-uri.umd.js
 var require_resolve_uri_umd = __commonJS({
-  "../../../node_modules/.pnpm/@jridgewell+resolve-uri@3.0.7/node_modules/@jridgewell/resolve-uri/dist/resolve-uri.umd.js"(exports2, module2) {
+  "../../../node_modules/.pnpm/@jridgewell+resolve-uri@3.1.0/node_modules/@jridgewell/resolve-uri/dist/resolve-uri.umd.js"(exports2, module2) {
     (function(global2, factory) {
       typeof exports2 === "object" && typeof module2 !== "undefined" ? module2.exports = factory() : typeof define === "function" && define.amd ? define(factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, global2.resolveURI = factory());
     })(exports2, function() {
       "use strict";
       const schemeRegex = /^[\w+.-]+:\/\//;
-      const urlRegex = /^([\w+.-]+:)\/\/([^@/#?]*@)?([^:/#?]*)(:\d+)?(\/[^#?]*)?/;
-      const fileRegex = /^file:(?:\/\/((?![a-z]:)[^/]*)?)?(\/?.*)/i;
+      const urlRegex = /^([\w+.-]+:)\/\/([^@/#?]*@)?([^:/#?]*)(:\d+)?(\/[^#?]*)?(\?[^#]*)?(#.*)?/;
+      const fileRegex = /^file:(?:\/\/((?![a-z]:)[^/#?]*)?)?(\/?[^#?]*)(\?[^#]*)?(#.*)?/i;
+      var UrlType;
+      (function(UrlType2) {
+        UrlType2[UrlType2["Empty"] = 1] = "Empty";
+        UrlType2[UrlType2["Hash"] = 2] = "Hash";
+        UrlType2[UrlType2["Query"] = 3] = "Query";
+        UrlType2[UrlType2["RelativePath"] = 4] = "RelativePath";
+        UrlType2[UrlType2["AbsolutePath"] = 5] = "AbsolutePath";
+        UrlType2[UrlType2["SchemeRelative"] = 6] = "SchemeRelative";
+        UrlType2[UrlType2["Absolute"] = 7] = "Absolute";
+      })(UrlType || (UrlType = {}));
       function isAbsoluteUrl(input) {
         return schemeRegex.test(input);
       }
@@ -36507,35 +36517,42 @@ var require_resolve_uri_umd = __commonJS({
       function isFileUrl(input) {
         return input.startsWith("file:");
       }
+      function isRelative(input) {
+        return /^[.?#]/.test(input);
+      }
       function parseAbsoluteUrl(input) {
         const match = urlRegex.exec(input);
-        return makeUrl(match[1], match[2] || "", match[3], match[4] || "", match[5] || "/");
+        return makeUrl(match[1], match[2] || "", match[3], match[4] || "", match[5] || "/", match[6] || "", match[7] || "");
       }
       function parseFileUrl(input) {
         const match = fileRegex.exec(input);
         const path = match[2];
-        return makeUrl("file:", "", match[1] || "", "", isAbsolutePath(path) ? path : "/" + path);
+        return makeUrl("file:", "", match[1] || "", "", isAbsolutePath(path) ? path : "/" + path, match[3] || "", match[4] || "");
       }
-      function makeUrl(scheme, user, host, port, path) {
+      function makeUrl(scheme, user, host, port, path, query, hash) {
         return {
           scheme,
           user,
           host,
           port,
           path,
-          relativePath: false
+          query,
+          hash,
+          type: UrlType.Absolute
         };
       }
       function parseUrl(input) {
         if (isSchemeRelativeUrl(input)) {
           const url2 = parseAbsoluteUrl("http:" + input);
           url2.scheme = "";
+          url2.type = UrlType.SchemeRelative;
           return url2;
         }
         if (isAbsolutePath(input)) {
           const url2 = parseAbsoluteUrl("http://foo.com" + input);
           url2.scheme = "";
           url2.host = "";
+          url2.type = UrlType.AbsolutePath;
           return url2;
         }
         if (isFileUrl(input))
@@ -36545,7 +36562,7 @@ var require_resolve_uri_umd = __commonJS({
         const url = parseAbsoluteUrl("http://foo.com/" + input);
         url.scheme = "";
         url.host = "";
-        url.relativePath = true;
+        url.type = input ? input.startsWith("?") ? UrlType.Query : input.startsWith("#") ? UrlType.Hash : UrlType.RelativePath : UrlType.Empty;
         return url;
       }
       function stripPathFilename(path) {
@@ -36555,18 +36572,15 @@ var require_resolve_uri_umd = __commonJS({
         return path.slice(0, index + 1);
       }
       function mergePaths(url, base) {
-        if (!url.relativePath)
-          return;
-        normalizePath(base);
+        normalizePath(base, base.type);
         if (url.path === "/") {
           url.path = base.path;
         } else {
           url.path = stripPathFilename(base.path) + url.path;
         }
-        url.relativePath = base.relativePath;
       }
-      function normalizePath(url) {
-        const { relativePath } = url;
+      function normalizePath(url, type2) {
+        const rel = type2 <= UrlType.RelativePath;
         const pieces = url.path.split("/");
         let pointer = 1;
         let positive = 0;
@@ -36585,7 +36599,7 @@ var require_resolve_uri_umd = __commonJS({
               addTrailingSlash = true;
               positive--;
               pointer--;
-            } else if (relativePath) {
+            } else if (rel) {
               pieces[pointer++] = piece;
             }
             continue;
@@ -36606,36 +36620,57 @@ var require_resolve_uri_umd = __commonJS({
         if (!input && !base)
           return "";
         const url = parseUrl(input);
-        if (base && !url.scheme) {
+        let inputType = url.type;
+        if (base && inputType !== UrlType.Absolute) {
           const baseUrl = parseUrl(base);
-          url.scheme = baseUrl.scheme;
-          if (!url.host) {
-            url.user = baseUrl.user;
-            url.host = baseUrl.host;
-            url.port = baseUrl.port;
-          }
-          mergePaths(url, baseUrl);
-        }
-        normalizePath(url);
-        if (url.relativePath) {
-          const path = url.path.slice(1);
-          if (!path)
-            return ".";
-          const keepRelative = (base || input).startsWith(".");
-          return !keepRelative || path.startsWith(".") ? path : "./" + path;
-        }
-        if (!url.scheme && !url.host)
-          return url.path;
-        return `${url.scheme}//${url.user}${url.host}${url.port}${url.path}`;
+          const baseType = baseUrl.type;
+          switch (inputType) {
+            case UrlType.Empty:
+              url.hash = baseUrl.hash;
+            case UrlType.Hash:
+              url.query = baseUrl.query;
+            case UrlType.Query:
+            case UrlType.RelativePath:
+              mergePaths(url, baseUrl);
+            case UrlType.AbsolutePath:
+              url.user = baseUrl.user;
+              url.host = baseUrl.host;
+              url.port = baseUrl.port;
+            case UrlType.SchemeRelative:
+              url.scheme = baseUrl.scheme;
+          }
+          if (baseType > inputType)
+            inputType = baseType;
+        }
+        normalizePath(url, inputType);
+        const queryHash = url.query + url.hash;
+        switch (inputType) {
+          case UrlType.Hash:
+          case UrlType.Query:
+            return queryHash;
+          case UrlType.RelativePath: {
+            const path = url.path.slice(1);
+            if (!path)
+              return queryHash || ".";
+            if (isRelative(base || input) && !isRelative(path)) {
+              return "./" + path + queryHash;
+            }
+            return path + queryHash;
+          }
+          case UrlType.AbsolutePath:
+            return url.path + queryHash;
+          default:
+            return url.scheme + "//" + url.user + url.host + url.port + url.path + queryHash;
+        }
       }
       return resolve;
     });
   }
 });
 
-// ../../../node_modules/.pnpm/@jridgewell+trace-mapping@0.3.13/node_modules/@jridgewell/trace-mapping/dist/trace-mapping.umd.js
+// ../../../node_modules/.pnpm/@jridgewell+trace-mapping@0.3.16/node_modules/@jridgewell/trace-mapping/dist/trace-mapping.umd.js
 var require_trace_mapping_umd = __commonJS({
-  "../../../node_modules/.pnpm/@jridgewell+trace-mapping@0.3.13/node_modules/@jridgewell/trace-mapping/dist/trace-mapping.umd.js"(exports2, module2) {
+  "../../../node_modules/.pnpm/@jridgewell+trace-mapping@0.3.16/node_modules/@jridgewell/trace-mapping/dist/trace-mapping.umd.js"(exports2, module2) {
     (function(global2, factory) {
       typeof exports2 === "object" && typeof module2 !== "undefined" ? factory(exports2, require_sourcemap_codec_umd(), require_resolve_uri_umd()) : typeof define === "function" && define.amd ? define(["exports", "@jridgewell/sourcemap-codec", "@jridgewell/resolve-uri"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2.traceMapping = {}, global2.sourcemapCodec, global2.resolveURI));
     })(exports2, function(exports3, sourcemapCodec, resolveUri) {
@@ -36871,11 +36906,13 @@ var require_trace_mapping_umd = __commonJS({
       const COL_GTR_EQ_ZERO = "`column` must be greater than or equal to 0 (columns start at column 0)";
       const LEAST_UPPER_BOUND = -1;
       const GREATEST_LOWER_BOUND = 1;
+      const ALL_BOUND = 0;
       exports3.encodedMappings = void 0;
       exports3.decodedMappings = void 0;
       exports3.traceSegment = void 0;
       exports3.originalPositionFor = void 0;
       exports3.generatedPositionFor = void 0;
+      exports3.allGeneratedPositionsFor = void 0;
       exports3.eachMapping = void 0;
       exports3.sourceContentFor = void 0;
       exports3.presortedDecodedMap = void 0;
@@ -36883,9 +36920,6 @@ var require_trace_mapping_umd = __commonJS({
       exports3.encodedMap = void 0;
       class TraceMap {
         constructor(map, mapUrl) {
-          this._decodedMemo = memoizedState();
-          this._bySources = void 0;
-          this._bySourceMemos = void 0;
           const isString = typeof map === "string";
           if (!isString && map._decodedMemo)
             return map;
@@ -36907,6 +36941,9 @@ var require_trace_mapping_umd = __commonJS({
             this._encoded = void 0;
             this._decoded = maybeSort(mappings, isString);
           }
+          this._decodedMemo = memoizedState();
+          this._bySources = void 0;
+          this._bySourceMemos = void 0;
         }
       }
       (() => {
@@ -36921,7 +36958,9 @@ var require_trace_mapping_umd = __commonJS({
           const decoded = exports3.decodedMappings(map);
           if (line >= decoded.length)
             return null;
-          return traceSegmentInternal(decoded[line], map._decodedMemo, line, column, GREATEST_LOWER_BOUND);
+          const segments = decoded[line];
+          const index = traceSegmentInternal(segments, map._decodedMemo, line, column, GREATEST_LOWER_BOUND);
+          return index === -1 ? null : segments[index];
         };
         exports3.originalPositionFor = (map, { line, column, bias }) => {
           line--;
@@ -36932,35 +36971,21 @@ var require_trace_mapping_umd = __commonJS({
           const decoded = exports3.decodedMappings(map);
           if (line >= decoded.length)
             return OMapping(null, null, null, null);
-          const segment = traceSegmentInternal(decoded[line], map._decodedMemo, line, column, bias || GREATEST_LOWER_BOUND);
-          if (segment == null)
+          const segments = decoded[line];
+          const index = traceSegmentInternal(segments, map._decodedMemo, line, column, bias || GREATEST_LOWER_BOUND);
+          if (index === -1)
             return OMapping(null, null, null, null);
-          if (segment.length == 1)
+          const segment = segments[index];
+          if (segment.length === 1)
             return OMapping(null, null, null, null);
           const { names, resolvedSources } = map;
           return OMapping(resolvedSources[segment[SOURCES_INDEX]], segment[SOURCE_LINE] + 1, segment[SOURCE_COLUMN], segment.length === 5 ? names[segment[NAMES_INDEX]] : null);
         };
+        exports3.allGeneratedPositionsFor = (map, { source, line, column }) => {
+          return generatedPosition(map, source, line, column, ALL_BOUND);
+        };
         exports3.generatedPositionFor = (map, { source, line, column, bias }) => {
-          line--;
-          if (line < 0)
-            throw new Error(LINE_GTR_ZERO);
-          if (column < 0)
-            throw new Error(COL_GTR_EQ_ZERO);
-          const { sources, resolvedSources } = map;
-          let sourceIndex = sources.indexOf(source);
-          if (sourceIndex === -1)
-            sourceIndex = resolvedSources.indexOf(source);
-          if (sourceIndex === -1)
-            return GMapping(null, null);
-          const generated = map._bySources || (map._bySources = buildBySources(exports3.decodedMappings(map), map._bySourceMemos = sources.map(memoizedState)));
-          const memos = map._bySourceMemos;
-          const segments = generated[sourceIndex][line];
-          if (segments == null)
-            return GMapping(null, null);
-          const segment = traceSegmentInternal(segments, memos[sourceIndex], line, column, bias || GREATEST_LOWER_BOUND);
-          if (segment == null)
-            return GMapping(null, null);
-          return GMapping(segment[REV_GENERATED_LINE] + 1, segment[REV_GENERATED_COLUMN]);
+          return generatedPosition(map, source, line, column, bias || GREATEST_LOWER_BOUND);
         };
         exports3.eachMapping = (map, cb2) => {
           const decoded = exports3.decodedMappings(map);
@@ -37003,35 +37028,53 @@ var require_trace_mapping_umd = __commonJS({
           return index === -1 ? null : sourcesContent[index];
         };
         exports3.presortedDecodedMap = (map, mapUrl) => {
-          const clone = Object.assign({}, map);
-          clone.mappings = [];
-          const tracer = new TraceMap(clone, mapUrl);
+          const tracer = new TraceMap(clone(map, []), mapUrl);
           tracer._decoded = map.mappings;
           return tracer;
         };
         exports3.decodedMap = (map) => {
-          return {
-            version: 3,
-            file: map.file,
-            names: map.names,
-            sourceRoot: map.sourceRoot,
-            sources: map.sources,
-            sourcesContent: map.sourcesContent,
-            mappings: exports3.decodedMappings(map)
-          };
+          return clone(map, exports3.decodedMappings(map));
         };
         exports3.encodedMap = (map) => {
-          return {
-            version: 3,
-            file: map.file,
-            names: map.names,
-            sourceRoot: map.sourceRoot,
-            sources: map.sources,
-            sourcesContent: map.sourcesContent,
-            mappings: exports3.encodedMappings(map)
-          };
+          return clone(map, exports3.encodedMappings(map));
         };
+        function generatedPosition(map, source, line, column, bias) {
+          line--;
+          if (line < 0)
+            throw new Error(LINE_GTR_ZERO);
+          if (column < 0)
+            throw new Error(COL_GTR_EQ_ZERO);
+          const { sources, resolvedSources } = map;
+          let sourceIndex = sources.indexOf(source);
+          if (sourceIndex === -1)
+            sourceIndex = resolvedSources.indexOf(source);
+          if (sourceIndex === -1)
+            return bias === ALL_BOUND ? [] : GMapping(null, null);
+          const generated = map._bySources || (map._bySources = buildBySources(exports3.decodedMappings(map), map._bySourceMemos = sources.map(memoizedState)));
+          const segments = generated[sourceIndex][line];
+          if (segments == null)
+            return bias === ALL_BOUND ? [] : GMapping(null, null);
+          const memo = map._bySourceMemos[sourceIndex];
+          if (bias === ALL_BOUND)
+            return sliceGeneratedPositions(segments, memo, line, column);
+          const index = traceSegmentInternal(segments, memo, line, column, bias);
+          if (index === -1)
+            return GMapping(null, null);
+          const segment = segments[index];
+          return GMapping(segment[REV_GENERATED_LINE] + 1, segment[REV_GENERATED_COLUMN]);
+        }
       })();
+      function clone(map, mappings) {
+        return {
+          version: map.version,
+          file: map.file,
+          names: map.names,
+          sourceRoot: map.sourceRoot,
+          sources: map.sources,
+          sourcesContent: map.sourcesContent,
+          mappings
+        };
+      }
       function OMapping(source, line, column, name) {
         return { source, line, column, name };
       }
@@ -37045,8 +37088,23 @@ var require_trace_mapping_umd = __commonJS({
         } else if (bias === LEAST_UPPER_BOUND)
           index++;
         if (index === -1 || index === segments.length)
-          return null;
-        return segments[index];
+          return -1;
+        return index;
+      }
+      function sliceGeneratedPositions(segments, memo, line, column) {
+        let min = traceSegmentInternal(segments, memo, line, column, GREATEST_LOWER_BOUND);
+        if (min === -1)
+          return [];
+        const matchedColumn = found ? column : segments[min][COLUMN];
+        if (!found)
+          min = lowerBound(segments, matchedColumn, min);
+        const max = upperBound(segments, matchedColumn, min);
+        const result = [];
+        for (; min <= max; min++) {
+          const segment = segments[min];
+          result.push(GMapping(segment[REV_GENERATED_LINE] + 1, segment[REV_GENERATED_COLUMN]));
+        }
+        return result;
       }
       exports3.AnyMap = AnyMap;
       exports3.GREATEST_LOWER_BOUND = GREATEST_LOWER_BOUND;

package/css/globalHeadingStyle.docs.tsx

@@ -1,7 +1,7 @@
 import dedent from 'dedent';
 import React from 'react';
 import { Alert, Stack, Strong, Text, TextLink } from '../lib/components';
-import { globalHeadingStyle } from '../lib/hooks/typography';
+import { globalHeadingStyle } from '../lib/css/globalTypographyStyles';
 import source from '../lib/utils/source.macro';
 import Code from '../../../site/src/App/Code/Code';
 import { CssDoc } from '../../../site/src/types';

package/css/globalTextStyle.docs.tsx

@@ -1,7 +1,7 @@
 import dedent from 'dedent';
 import React from 'react';
 import { Alert, Stack, Strong, Text, TextLink } from '../lib/components';
-import { globalTextStyle } from '../lib/hooks/typography';
+import { globalTextStyle } from '../lib/css/globalTypographyStyles';
 import source from '../lib/utils/source.macro';
 import Code from '../../../site/src/App/Code/Code';
 import { CssDoc } from '../../../site/src/types';

package/css/index.ts

@@ -3,7 +3,10 @@ import { atoms as internalAtoms, Atoms } from '../lib/css/atoms/atoms';
 import { colorModeStyle } from '../lib/css/colorModeStyle';
 import { responsiveStyle } from '../lib/css/responsiveStyle';
 import { breakpoints } from '../lib/css/breakpoints';
-import { globalHeadingStyle, globalTextStyle } from '../lib/hooks/typography';
+import {
+  globalHeadingStyle,
+  globalTextStyle,
+} from '../lib/css/globalTypographyStyles';
 import type { Breakpoint } from '../lib/css/breakpoints';
 
 const {

package/lib/components/Accordion/Accordion.docs.tsx

@@ -35,7 +35,7 @@ const docs: ComponentDocs = {
   accessibility: (
     <Text>
       Follows the{' '}
-      <TextLink href="https://www.w3.org/TR/wai-aria-practices/#disclosure">
+      <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/">
         WAI-ARIA Disclosure Pattern.
       </TextLink>
     </Text>

package/lib/components/Alert/Alert.docs.tsx

@@ -33,7 +33,7 @@ const docs: ComponentDocs = {
   accessibility: (
     <Text>
       Follows the{' '}
-      <TextLink href="https://www.w3.org/TR/wai-aria-practices/#alert">
+      <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/alert/">
         WAI-ARIA Alert Pattern
       </TextLink>
       , announcing messages with a{' '}

package/lib/components/Autosuggest/Autosuggest.tsx

@@ -26,7 +26,8 @@ import {
 } from '../private/Field/Field';
 import { ButtonIcon } from '../ButtonIcon/ButtonIcon';
 import { IconClear } from '../icons';
-import { touchableText, useText } from '../../hooks/typography';
+import { textStyles } from '../../css/typography';
+import { touchableText } from '../../css/typography.css';
 import { getNextIndex } from '../private/getNextIndex';
 import { normalizeKey } from '../private/normalizeKey';
 import { ClearField } from '../private/Field/ClearField';
@@ -202,7 +203,7 @@ function GroupHeading({ children }: GroupHeadingProps) {
       className={[
         styles.groupHeading,
         touchableText.xsmall,
-        useText({
+        textStyles({
           size: 'xsmall',
           baseline: false,
           weight: 'strong',

package/lib/components/Box/ColoredBox.tsx

@@ -8,7 +8,7 @@ import {
 } from './BackgroundContext';
 import { BoxBackgroundVariant, BoxProps } from './Box';
 import { Background, BoxShadow } from '../../css/atoms/atomicProperties';
-import * as typographyStyles from '../../hooks/typography/typography.css';
+import * as typographyStyles from '../../css/typography.css';
 
 export interface ColoredBoxProps extends BoxProps {
   component: NonNullable<BoxProps['component']>;

package/lib/components/BraidPortal/BraidPortal.tsx

@@ -13,7 +13,7 @@ export const BraidPortal = ({ children, container }: BraidPortalProps) => {
   const { vanillaTheme } = useBraidTheme();
 
   return createPortal(
-    <TextContext.Provider value={false}>
+    <TextContext.Provider value={null}>
       <VanillaThemeContainer theme={vanillaTheme} setDefaultTextTones>
         {children}
       </VanillaThemeContainer>

package/lib/components/BraidProvider/VanillaThemeContainer.tsx

@@ -1,6 +1,6 @@
 import React, { ReactNode } from 'react';
 
-import * as typographyStyles from '../../hooks/typography/typography.css';
+import * as typographyStyles from '../../css/typography.css';
 
 interface Props {
   children: ReactNode;

package/lib/components/Button/Button.tsx

@@ -8,7 +8,7 @@ import React, {
   ReactElement,
   cloneElement,
 } from 'react';
-import { touchableText } from '../../hooks/typography';
+import { touchableText } from '../../css/typography.css';
 import { Box, BoxBackgroundVariant, BoxProps } from '../Box/Box';
 import buildDataAttributes, {
   DataAttributeMap,

package/lib/components/ButtonIcon/ButtonIcon.docs.tsx

@@ -39,7 +39,7 @@ const docs: ComponentDocs = {
     <>
       <Text>
         Follows the{' '}
-        <TextLink href="https://www.w3.org/TR/wai-aria-practices/#button">
+        <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/button/">
           WAI-ARIA Button Pattern
         </TextLink>
         .

package/lib/components/Checkbox/Checkbox.docs.tsx

@@ -34,7 +34,7 @@ const docs: ComponentDocs = {
   accessibility: (
     <Text>
       Follows the{' '}
-      <TextLink href="https://www.w3.org/TR/wai-aria-practices/#checkbox">
+      <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/">
         WAI-ARIA Checkbox Pattern
       </TextLink>
       , supporting both dual-state and tri-state specifications.

package/lib/components/Dialog/Dialog.docs.tsx

@@ -41,7 +41,7 @@ const docs: ComponentDocs = {
     <>
       <Text>
         Follows the{' '}
-        <TextLink href="https://www.w3.org/TR/wai-aria-practices-1.2/#dialog_modal">
+        <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/dialogmodal/">
           WAI-ARIA Dialog (Modal) Pattern.
         </TextLink>
       </Text>

package/lib/components/Disclosure/Disclosure.docs.tsx

@@ -19,7 +19,7 @@ const docs: ComponentDocs = {
   accessibility: (
     <Text>
       Follows the{' '}
-      <TextLink href="https://www.w3.org/TR/wai-aria-practices/#disclosure">
+      <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/">
         WAI-ARIA Disclosure Pattern.
       </TextLink>
     </Text>

package/lib/components/Drawer/Drawer.docs.tsx

@@ -53,7 +53,7 @@ const docs: ComponentDocs = {
     <>
       <Text>
         Follows the{' '}
-        <TextLink href="https://www.w3.org/TR/wai-aria-practices-1.2/#dialog_modal">
+        <TextLink href="https://www.w3.org/WAI/ARIA/apg/patterns/dialogmodal/">
           WAI-ARIA Dialog (Modal) Pattern.
         </TextLink>
       </Text>

package/lib/components/Heading/Heading.docs.tsx

@@ -1,8 +1,7 @@
 import React from 'react';
 import source from '../../utils/source.macro';
 import { ComponentDocs } from '../../../../../site/src/types';
-import { Box, Heading, Stack, Text, Strong } from '../';
-import { TextLink } from '../TextLink/TextLink';
+import { Box, Heading, Stack, Text, Strong, TextLink } from '../';
 
 const docs: ComponentDocs = {
   category: 'Content',