@primer/react 38.29.1-rc.42909d47c → 38.30.0-rc.5c4b3e004

package/CHANGELOG.md

@@ -1,6 +1,30 @@
 # @primer/react
 
-## 38.29.1
+## 38.30.0
+
+### Minor Changes
+
+- [#8031](https://github.com/primer/react/pull/8031) [`cb79351`](https://github.com/primer/react/commit/cb79351f29b9a1aea7bacf890eca97a5c9d97590) Thanks [@janmaarten-a11y](https://github.com/janmaarten-a11y)! - Add a `NavList.Heading` slot that names the navigation region. It renders an `h2`
+  by default (configurable to `h3` via `as`), supports a `visuallyHidden` variant,
+  labels the `nav` landmark via `aria-labelledby`, and makes `NavList.Group`
+  headings default to one level deeper (`h3`, or `h4` under an `h3` heading) for a
+  correct heading hierarchy.
+
+- [#7991](https://github.com/primer/react/pull/7991) [`b906268`](https://github.com/primer/react/commit/b906268b7ebe8d684d8b5e9b1c4e9b528a5dd67a) Thanks [@llastflowers](https://github.com/llastflowers)! - Add data-component attributes and associated tests for:
+
+  Radio
+  RadioGroup
+  RelativeTime
+  ScrollableRegion
+  SegmentedControl
+  Select
+  SideNav
+  SkeletonBox
+  SkeletonAvatar
+  SkeletonText
+  Spinner
+
+- [#8026](https://github.com/primer/react/pull/8026) [`73a45df`](https://github.com/primer/react/commit/73a45dfe11c3a297e4f2f8317caa4a535a70ce80) Thanks [@TylerJDev](https://github.com/TylerJDev)! - SelectPanel: Add `cssAnchorPositioningSettings` prop to customize CSS anchor positioning behavior
 
 ### Patch Changes
 

package/dist/NavList/NavList-b50d982b.css

@@ -0,0 +1,2 @@
+.prc-NavList-Heading--JQMj{margin-block-end:var(--base-size-8,.5rem);margin-inline-start:calc(var(--control-medium-paddingInline-condensed,.5rem) + var(--base-size-8,.5rem))}.prc-NavList-GroupHeading-mN50z>a{color:var(--fgColor-default,#1f2328);text-decoration:inherit}.prc-NavList-GroupHeading-mN50z>a:hover{-webkit-text-decoration:underline;text-decoration:underline}
+/*# sourceMappingURL=NavList-b50d982b.css.map */

package/dist/NavList/NavList-b50d982b.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/NavList/NavList.module.css.js"],"names":[],"mappings":"AAAA,2BACE,yCAAoC,CAEpC,wGACF,CAEA,kCACE,oCAA6B,CAC7B,uBACF,CAEA,wCACE,iCAA0B,CAA1B,yBACF","file":"NavList-b50d982b.css","sourcesContent":[".Heading {\n  margin-block-end: var(--base-size-8);\n  /* stylelint-disable-next-line primer/spacing */\n  margin-inline-start: calc(var(--control-medium-paddingInline-condensed) + var(--base-size-8));\n}\n\n.GroupHeading > a {\n  color: var(--fgColor-default);\n  text-decoration: inherit;\n}\n\n.GroupHeading > a:hover {\n  text-decoration: underline;\n}\n"]}

package/dist/NavList/NavList.d.ts

@@ -3,9 +3,17 @@ import type { ForwardRefComponent as PolymorphicForwardRefComponent } from '../u
 import React from 'react';
 import type { ActionListTrailingActionProps, ActionListDividerProps, ActionListLeadingVisualProps, ActionListTrailingVisualProps, ActionListGroupHeadingProps } from '../ActionList';
 import { type PolymorphicProps } from '../utils/modern-polymorphic';
+import type { FCWithSlotMarker } from '../utils/types/Slots';
+type NavListHeadingLevels = 'h2' | 'h3';
 export type NavListProps = {
     children: React.ReactNode;
 } & React.ComponentProps<'nav'>;
+export type NavListHeadingProps = {
+    /** Semantic heading level for the NavList. Also sets the default level for child group headings, which render one level deeper. */
+    as?: NavListHeadingLevels;
+    /** Visually hide the heading while keeping it available to assistive technology. */
+    visuallyHidden?: boolean;
+} & React.ComponentPropsWithoutRef<'h2'>;
 export type NavListItemProps<As extends React.ElementType = React.ElementType> = PolymorphicProps<As, 'a', {
     children: React.ReactNode;
     defaultOpen?: boolean;
@@ -40,7 +48,8 @@ export type NavListGroupExpandProps = {
 export declare const GroupExpand: React.ForwardRefExoticComponent<NavListGroupExpandProps & React.RefAttributes<HTMLButtonElement>>;
 export type NavListGroupHeadingProps = ActionListGroupHeadingProps;
 export declare const NavList: React.ForwardRefExoticComponent<Omit<NavListProps, "ref"> & React.RefAttributes<HTMLElement>> & {
-    Description: import("..").FCWithSlotMarker<React.PropsWithChildren<import("..").ActionListDescriptionProps>>;
+    Description: FCWithSlotMarker<React.PropsWithChildren<import("..").ActionListDescriptionProps>>;
+    Heading: FCWithSlotMarker<NavListHeadingProps>;
     Item: (<As extends React.ElementType = "a">(props: import("../utils/modern-polymorphic").DistributiveOmit<React.ComponentPropsWithRef<React.ElementType extends As ? "a" : As> & {
         children: React.ReactNode;
         defaultOpen?: boolean;
@@ -53,10 +62,10 @@ export declare const NavList: React.ForwardRefExoticComponent<Omit<NavListProps,
         displayName: string;
     };
     SubNav: PolymorphicForwardRefComponent<"ul", NavListSubNavProps>;
-    LeadingVisual: import("..").FCWithSlotMarker<React.PropsWithChildren<import("../ActionList/Visuals").VisualProps>>;
-    TrailingVisual: import("..").FCWithSlotMarker<React.PropsWithChildren<import("../ActionList/Visuals").VisualProps>>;
+    LeadingVisual: FCWithSlotMarker<React.PropsWithChildren<import("../ActionList/Visuals").VisualProps>>;
+    TrailingVisual: FCWithSlotMarker<React.PropsWithChildren<import("../ActionList/Visuals").VisualProps>>;
     TrailingAction: PolymorphicForwardRefComponent<"a" | "button", ActionListTrailingActionProps>;
-    Divider: import("..").FCWithSlotMarker<React.PropsWithChildren<ActionListDividerProps>>;
+    Divider: FCWithSlotMarker<React.PropsWithChildren<ActionListDividerProps>>;
     Group: React.FC<NavListGroupProps>;
     GroupExpand: React.ForwardRefExoticComponent<NavListGroupExpandProps & React.RefAttributes<HTMLButtonElement>>;
     GroupHeading: React.FC<ActionListGroupHeadingProps>;

package/dist/NavList/NavList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../src/NavList/NavList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4B,KAAK,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAC3E,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAC/F,OAAO,KAAuB,MAAM,OAAO,CAAA;AAE3C,OAAO,KAAK,EACV,6BAA6B,EAC7B,sBAAsB,EACtB,4BAA4B,EAC5B,6BAA6B,EAC7B,2BAA2B,EAC5B,MAAM,eAAe,CAAA;AAUtB,OAAO,EAAkB,KAAK,gBAAgB,EAAC,MAAM,6BAA6B,CAAA;AAKlF,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAqB/B,MAAM,MAAM,gBAAgB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,gBAAgB,CAC/F,EAAE,EACF,GAAG,EACH;IACE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAA;IAC5F,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CACF,CAAA;AAkJD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAwCD,MAAM,MAAM,yBAAyB,GAAG,4BAA4B,CAAA;AASpE,MAAM,MAAM,0BAA0B,GAAG,6BAA6B,CAAA;AAStE,MAAM,MAAM,mBAAmB,GAAG,sBAAsB,CAAA;AAQxD,MAAM,MAAM,0BAA0B,GAAG,6BAA6B,CAAA;AAStE,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,GAAG;IACpE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAqBD,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,cAAc,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;IAC9B,aAAa,CAAC,EAAE,IAAI,CAAA;IACpB,cAAc,CAAC,EAAE,6BAA6B,CAAA;IAC9C,0BAA0B,CAAC,EAAE,MAAM,CAAA;CACpC,GAAG,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,CAAA;AAEtC,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,SAAS,EAAE,CAAA;IAClB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,KAAK,CAAC,SAAS,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,WAAW,mGAgFvB,CAAA;AAKD,MAAM,MAAM,wBAAwB,GAAG,2BAA2B,CAAA;AAqBlE,eAAO,MAAM,OAAO;;YA7WjB,EAAE,SAAS,KAAK,CAAC,WAAW;kBATjB,KAAK,CAAC,SAAS;sBACX,OAAO;eACd,MAAM;yBACI,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO;uBAC7E,MAAM;;;;;;;;;;;;;;CA6XvB,CAAA"}
+{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../src/NavList/NavList.tsx"],"names":[],"mappings":"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"}

package/dist/NavList/NavList.js

@@ -12,65 +12,210 @@ import navListClasses from './NavList.module.css.js';
 import { flushSync } from 'react-dom';
 import { useSlots } from '../hooks/useSlots.js';
 import { fixedForwardRef } from '../utils/modern-polymorphic.js';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import visuallyHiddenClasses from '../_VisuallyHidden.module.css.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import Heading$1 from '../Heading/Heading.js';
+
+// Publishes the resolved numeric level of a NavList.Heading (e.g. 2 for an h2) so
+// NavList.Group/NavList.GroupHeading can default to one level deeper. `null` when
+// there is no NavList.Heading, in which case groups keep their historical h3 default.
+const NavListHeadingLevelContext = /*#__PURE__*/React.createContext(null);
+function headingTagToLevel(as) {
+  return Number.parseInt(as.slice(1), 10);
+}
+function levelToHeadingTag(level) {
+  // Clamp to h4 so group headings never go deeper than the supported hierarchy.
+  const clamped = Math.min(Math.max(level, 1), 4);
+  return `h${clamped}`;
+}
+
+// ----------------------------------------------------------------------------
+// NavList
 
 const Root = /*#__PURE__*/React.forwardRef((t0, ref) => {
-  const $ = c(10);
+  var _heading$props$id, _ariaLabelledby;
+  const $ = c(24);
+  let ariaLabel;
+  let ariaLabelledby;
   let children;
   let props;
   if ($[0] !== t0) {
     ({
       children,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledby,
       ...props
     } = t0);
     $[0] = t0;
-    $[1] = children;
-    $[2] = props;
+    $[1] = ariaLabel;
+    $[2] = ariaLabelledby;
+    $[3] = children;
+    $[4] = props;
   } else {
-    children = $[1];
-    props = $[2];
+    ariaLabel = $[1];
+    ariaLabelledby = $[2];
+    children = $[3];
+    props = $[4];
   }
   let t1;
-  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = {
-      container: "NavList"
+      heading: Heading
     };
-    $[3] = t1;
+    $[5] = t1;
   } else {
-    t1 = $[3];
+    t1 = $[5];
   }
+  const [slots, childrenWithoutHeading] = useSlots(children, t1);
+  const fallbackHeadingId = useId();
+  const heading = slots.heading;
+  const headingId = heading ? (_heading$props$id = heading.props.id) !== null && _heading$props$id !== void 0 ? _heading$props$id : fallbackHeadingId : undefined;
   let t2;
-  if ($[4] !== children) {
-    t2 = /*#__PURE__*/jsx(ActionListContainerContext.Provider, {
-      value: t1,
+  if ($[6] !== heading) {
+    var _heading$props$as;
+    t2 = heading ? headingTagToLevel((_heading$props$as = heading.props.as) !== null && _heading$props$as !== void 0 ? _heading$props$as : "h2") : null;
+    $[6] = heading;
+    $[7] = t2;
+  } else {
+    t2 = $[7];
+  }
+  const headingLevel = t2;
+  const navLabelledby = (_ariaLabelledby = ariaLabelledby) !== null && _ariaLabelledby !== void 0 ? _ariaLabelledby : ariaLabel ? undefined : headingId;
+  let t3;
+  if ($[8] !== heading || $[9] !== headingId) {
+    t3 = heading ? /*#__PURE__*/React.cloneElement(heading, {
+      id: headingId
+    }) : null;
+    $[8] = heading;
+    $[9] = headingId;
+    $[10] = t3;
+  } else {
+    t3 = $[10];
+  }
+  let t4;
+  if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = {
+      container: "NavList"
+    };
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+  let t5;
+  if ($[12] !== childrenWithoutHeading) {
+    t5 = /*#__PURE__*/jsx(ActionListContainerContext.Provider, {
+      value: t4,
       children: /*#__PURE__*/jsx(ActionList, {
-        children: children
+        children: childrenWithoutHeading
       })
     });
-    $[4] = children;
-    $[5] = t2;
+    $[12] = childrenWithoutHeading;
+    $[13] = t5;
   } else {
-    t2 = $[5];
+    t5 = $[13];
   }
-  let t3;
-  if ($[6] !== props || $[7] !== ref || $[8] !== t2) {
-    t3 = /*#__PURE__*/jsx("nav", {
+  let t6;
+  if ($[14] !== headingLevel || $[15] !== t3 || $[16] !== t5) {
+    t6 = /*#__PURE__*/jsxs(NavListHeadingLevelContext.Provider, {
+      value: headingLevel,
+      children: [t3, t5]
+    });
+    $[14] = headingLevel;
+    $[15] = t3;
+    $[16] = t5;
+    $[17] = t6;
+  } else {
+    t6 = $[17];
+  }
+  let t7;
+  if ($[18] !== ariaLabel || $[19] !== navLabelledby || $[20] !== props || $[21] !== ref || $[22] !== t6) {
+    t7 = /*#__PURE__*/jsx("nav", {
       ...props,
+      "aria-label": ariaLabel,
+      "aria-labelledby": navLabelledby,
       ref: ref,
       "data-component": "NavList",
-      children: t2
+      children: t6
     });
-    $[6] = props;
-    $[7] = ref;
-    $[8] = t2;
-    $[9] = t3;
+    $[18] = ariaLabel;
+    $[19] = navLabelledby;
+    $[20] = props;
+    $[21] = ref;
+    $[22] = t6;
+    $[23] = t7;
   } else {
-    t3 = $[9];
+    t7 = $[23];
   }
-  return t3;
+  return t7;
 });
 Root.displayName = 'NavList';
 
+// ----------------------------------------------------------------------------
+// NavList.Heading
+
+const Heading = t0 => {
+  const $ = c(14);
+  let children;
+  let className;
+  let props;
+  let t1;
+  let t2;
+  if ($[0] !== t0) {
+    ({
+      as: t1,
+      visuallyHidden: t2,
+      className,
+      children,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = props;
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    children = $[1];
+    className = $[2];
+    props = $[3];
+    t1 = $[4];
+    t2 = $[5];
+  }
+  const as = t1 === undefined ? "h2" : t1;
+  const visuallyHidden = t2 === undefined ? false : t2;
+  const t3 = visuallyHidden ? visuallyHiddenClasses.InternalVisuallyHidden : navListClasses.Heading;
+  let t4;
+  if ($[6] !== className || $[7] !== t3) {
+    t4 = clsx(t3, className);
+    $[6] = className;
+    $[7] = t3;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  let t5;
+  if ($[9] !== as || $[10] !== children || $[11] !== props || $[12] !== t4) {
+    t5 = /*#__PURE__*/jsx(Heading$1, {
+      as: as,
+      variant: "small",
+      className: t4,
+      "data-component": "NavList.Heading",
+      ...props,
+      children: children
+    });
+    $[9] = as;
+    $[10] = children;
+    $[11] = props;
+    $[12] = t4;
+    $[13] = t5;
+  } else {
+    t5 = $[13];
+  }
+  return t5;
+};
+Heading.displayName = 'NavList.Heading';
+Heading.__SLOT__ = Symbol('NavList.Heading');
+
 // ----------------------------------------------------------------------------
 // NavList.Item
 
@@ -398,7 +543,7 @@ TrailingAction.displayName = 'NavList.TrailingAction';
 // NavList.Group
 
 const Group = t0 => {
-  const $ = c(11);
+  const $ = c(14);
   let children;
   let props;
   let title;
@@ -417,41 +562,52 @@ const Group = t0 => {
     props = $[2];
     title = $[3];
   }
+  const headingLevel = React.useContext(NavListHeadingLevelContext);
   let t1;
-  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = /*#__PURE__*/jsx(ActionList.Divider, {});
-    $[4] = t1;
+  if ($[4] !== headingLevel) {
+    t1 = headingLevel ? levelToHeadingTag(headingLevel + 1) : "h3";
+    $[4] = headingLevel;
+    $[5] = t1;
   } else {
-    t1 = $[4];
+    t1 = $[5];
   }
+  const groupHeadingAs = t1;
   let t2;
-  if ($[5] !== title) {
-    t2 = title ? /*#__PURE__*/jsx(ActionList.GroupHeading, {
-      as: "h3",
-      "data-component": "ActionList.GroupHeading",
-      children: title
-    }) : null;
-    $[5] = title;
+  if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /*#__PURE__*/jsx(ActionList.Divider, {});
     $[6] = t2;
   } else {
     t2 = $[6];
   }
   let t3;
-  if ($[7] !== children || $[8] !== props || $[9] !== t2) {
-    t3 = /*#__PURE__*/jsxs(Fragment, {
-      children: [t1, /*#__PURE__*/jsxs(ActionList.Group, {
+  if ($[7] !== groupHeadingAs || $[8] !== title) {
+    t3 = title ? /*#__PURE__*/jsx(ActionList.GroupHeading, {
+      as: groupHeadingAs,
+      "data-component": "ActionList.GroupHeading",
+      children: title
+    }) : null;
+    $[7] = groupHeadingAs;
+    $[8] = title;
+    $[9] = t3;
+  } else {
+    t3 = $[9];
+  }
+  let t4;
+  if ($[10] !== children || $[11] !== props || $[12] !== t3) {
+    t4 = /*#__PURE__*/jsxs(Fragment, {
+      children: [t2, /*#__PURE__*/jsxs(ActionList.Group, {
         ...props,
-        children: [t2, children]
+        children: [t3, children]
       })]
     });
-    $[7] = children;
-    $[8] = props;
-    $[9] = t2;
-    $[10] = t3;
+    $[10] = children;
+    $[11] = props;
+    $[12] = t3;
+    $[13] = t4;
   } else {
-    t3 = $[10];
+    t4 = $[13];
   }
-  return t3;
+  return t4;
 };
 // ----------------------------------------------------------------------------
 // NavList.GroupExpand
@@ -593,49 +749,60 @@ const GroupExpand = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
  * It was primarily added to allow links in group headings.
  */
 const GroupHeading = t0 => {
-  const $ = c(10);
+  const $ = c(13);
+  let as;
   let className;
   let rest;
-  let t1;
   if ($[0] !== t0) {
     ({
-      as: t1,
+      as,
       className,
       ...rest
     } = t0);
     $[0] = t0;
-    $[1] = className;
-    $[2] = rest;
-    $[3] = t1;
+    $[1] = as;
+    $[2] = className;
+    $[3] = rest;
+  } else {
+    as = $[1];
+    className = $[2];
+    rest = $[3];
+  }
+  const headingLevel = React.useContext(NavListHeadingLevelContext);
+  let t1;
+  if ($[4] !== as || $[5] !== headingLevel) {
+    var _as;
+    t1 = (_as = as) !== null && _as !== void 0 ? _as : headingLevel ? levelToHeadingTag(headingLevel + 1) : "h3";
+    $[4] = as;
+    $[5] = headingLevel;
+    $[6] = t1;
   } else {
-    className = $[1];
-    rest = $[2];
-    t1 = $[3];
+    t1 = $[6];
   }
-  const as = t1 === undefined ? "h3" : t1;
+  const resolvedAs = t1;
   let t2;
-  if ($[4] !== className) {
+  if ($[7] !== className) {
     t2 = clsx(navListClasses.GroupHeading, className);
-    $[4] = className;
-    $[5] = t2;
+    $[7] = className;
+    $[8] = t2;
   } else {
-    t2 = $[5];
+    t2 = $[8];
   }
   let t3;
-  if ($[6] !== as || $[7] !== rest || $[8] !== t2) {
+  if ($[9] !== resolvedAs || $[10] !== rest || $[11] !== t2) {
     t3 = /*#__PURE__*/jsx(ActionList.GroupHeading, {
-      as: as,
+      as: resolvedAs,
       className: t2,
       "data-component": "NavList.GroupHeading",
       headingWrapElement: "li",
       ...rest
     });
-    $[6] = as;
-    $[7] = rest;
-    $[8] = t2;
-    $[9] = t3;
+    $[9] = resolvedAs;
+    $[10] = rest;
+    $[11] = t2;
+    $[12] = t3;
   } else {
-    t3 = $[9];
+    t3 = $[12];
   }
   return t3;
 };
@@ -645,6 +812,7 @@ const GroupHeading = t0 => {
 
 const NavList = Object.assign(Root, {
   Description: ActionList.Description,
+  Heading,
   Item,
   SubNav,
   LeadingVisual,

package/dist/NavList/NavList.module.css.js

@@ -1,5 +1,5 @@
-import './NavList-5dc067e3.css';
+import './NavList-b50d982b.css';
 
-var navListClasses = {"GroupHeading":"prc-NavList-GroupHeading-mN50z"};
+var navListClasses = {"Heading":"prc-NavList-Heading--JQMj","GroupHeading":"prc-NavList-GroupHeading-mN50z"};
 
 export { navListClasses as default };

package/dist/Radio/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,mBAAmB,EAAe,MAAM,OAAO,CAAA;AAChF,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,UAAU,GAAG;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC;;GAEG;AACH,QAAA,MAAM,KAAK,kGA8CV,CAAA;wBAKuB,cAAc,CAAC,OAAO,KAAK,CAAC;AAApD,wBAAoD"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,mBAAmB,EAAe,MAAM,OAAO,CAAA;AAChF,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,UAAU,GAAG;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC;;GAEG;AACH,QAAA,MAAM,KAAK,kGA+CV,CAAA;wBAKuB,cAAc,CAAC,OAAO,KAAK,CAAC;AAApD,wBAAoD"}

package/dist/Radio/Radio.js

@@ -94,7 +94,8 @@ const Radio = /*#__PURE__*/React.forwardRef((t0, ref) => {
       required: required,
       onChange: handleOnChange,
       className: t4,
-      ...rest
+      ...rest,
+      "data-component": "Radio"
     });
     $[15] = checked;
     $[16] = disabled;

package/dist/RadioGroup/RadioGroup.js

@@ -87,6 +87,7 @@ const RadioGroup = t0 => {
   if ($[16] !== children || $[17] !== disabled || $[18] !== rest) {
     t4 = /*#__PURE__*/jsx(CheckboxOrRadioGroup, {
       disabled: disabled,
+      "data-component": "RadioGroup",
       ...rest,
       children: children
     });

package/dist/RelativeTime/RelativeTime.js

@@ -65,6 +65,7 @@ function RelativeTime(t0) {
       ...props,
       date: date,
       "no-title": t1,
+      "data-component": "RelativeTime",
       children: t2
     });
     $[11] = date;

package/dist/ScrollableRegion/ScrollableRegion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,QAAQ,GACT;IACE,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAA;CAC1B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAEL,KAAK,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAA;AAE7E,iBAAS,gBAAgB,CAAC,EACxB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAiBvB;AAED,OAAO,EAAC,gBAAgB,EAAC,CAAA;AACzB,YAAY,EAAC,qBAAqB,EAAC,CAAA"}
+{"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,QAAQ,GACT;IACE,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAA;CAC1B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAEL,KAAK,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAA;AAE7E,iBAAS,gBAAgB,CAAC,EACxB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAuBvB;AAED,OAAO,EAAC,gBAAgB,EAAC,CAAA;AACzB,YAAY,EAAC,qBAAqB,EAAC,CAAA"}

package/dist/ScrollableRegion/ScrollableRegion.js

@@ -66,6 +66,7 @@ function ScrollableRegion(t0) {
       ...regionProps,
       ref: ref,
       className: t2,
+      "data-component": "ScrollableRegion",
       children: children
     });
     $[12] = children;

package/dist/SegmentedControl/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAC7C,OAAO,KAAK,EAAC,2BAA2B,EAAC,MAAM,0BAA0B,CAAA;AAEzE,OAAO,KAAK,EAAC,+BAA+B,EAAC,MAAM,8BAA8B,CAAA;AAIjF,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAEhE,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAA;AAMhF,MAAM,MAAM,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,8BAA8B;IAC9B,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACxG,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAsMD,eAAO,MAAM,gBAAgB;;;CAG3B,CAAA"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAC7C,OAAO,KAAK,EAAC,2BAA2B,EAAC,MAAM,0BAA0B,CAAA;AAEzE,OAAO,KAAK,EAAC,+BAA+B,EAAC,MAAM,8BAA8B,CAAA;AAIjF,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAEhE,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAA;AAMhF,MAAM,MAAM,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,8BAA8B;IAC9B,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACxG,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAuMD,eAAO,MAAM,gBAAgB;;;CAG3B,CAAA"}

package/dist/SegmentedControl/SegmentedControl.js

@@ -226,6 +226,7 @@ const Root = t0 => {
       ...t7,
       "data-size": size,
       ...rest,
+      "data-component": "SegmentedControl",
       children: t8
     });
     $[41] = ariaLabel;

package/dist/SegmentedControl/SegmentedControlButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAMrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,2BAA2B,GAAG;IACxC,+CAA+C;IAC/C,QAAQ,EAAE,MAAM,CAAA;IAChB,oKAAoK;IACpK,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,sKAAsK;IACtK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,iDAAiD;IAEjD,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACrG,wFAAwF;IAExF,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACnG,gHAAgH;IAChH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,QAAA,MAAM,sBAAsB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CAyClG,CAAA;AAED,eAAe,sBAAsB,CAAA"}
+{"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAMrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,2BAA2B,GAAG;IACxC,+CAA+C;IAC/C,QAAQ,EAAE,MAAM,CAAA;IAChB,oKAAoK;IACpK,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,sKAAsK;IACtK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,iDAAiD;IAEjD,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACrG,wFAAwF;IAExF,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACnG,gHAAgH;IAChH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,QAAA,MAAM,sBAAsB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CA6ClG,CAAA;AAED,eAAe,sBAAsB,CAAA"}

package/dist/SegmentedControl/SegmentedControlButton.js

@@ -174,6 +174,7 @@ const SegmentedControlButton = t0 => {
     t12 = /*#__PURE__*/jsx("li", {
       className: t1,
       "data-selected": t2,
+      "data-component": "SegmentedControl.Button",
       children: t11
     });
     $[33] = t11;

package/dist/SegmentedControl/SegmentedControlIconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlIconButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAErD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,+BAA+B,GAAG;IAC5C,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAE1D,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAC3F,8JAA8J;IAC9J,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kKAAkK;IAClK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,eAAO,MAAM,0BAA0B,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,CAiCjH,CAAA;AAID,eAAe,0BAA0B,CAAA"}
+{"version":3,"file":"SegmentedControlIconButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAErD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,+BAA+B,GAAG;IAC5C,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAE1D,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAC3F,8JAA8J;IAC9J,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kKAAkK;IAClK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,eAAO,MAAM,0BAA0B,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,CAqCjH,CAAA;AAID,eAAe,0BAA0B,CAAA"}

package/dist/SegmentedControl/SegmentedControlIconButton.js

@@ -146,6 +146,7 @@ const SegmentedControlIconButton = t0 => {
     t13 = /*#__PURE__*/jsx("li", {
       className: t1,
       "data-selected": t2,
+      "data-component": "SegmentedControl.IconButton",
       children: t12
     });
     $[31] = t1;

package/dist/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,yCAAyC,CAAA;AAE/E,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,UAAU,CAAC,EAC/F,UAAU,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,IAAI,CAC7D,GAAG;IACF,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;;;;eAoE2F,MAAM;;;;AAQlG,wBAIE"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,yCAAyC,CAAA;AAE/E,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,UAAU,CAAC,EAC/F,UAAU,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,IAAI,CAC7D,GAAG;IACF,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;;;;eAqE2F,MAAM;;;;AAQlG,wBAIE"}

package/dist/Select/Select.js

@@ -137,6 +137,7 @@ const Select = /*#__PURE__*/React.forwardRef((t0, ref) => {
       value: "",
       disabled: required,
       hidden: required,
+      "data-component": "Select.Option",
       children: placeholder
     });
     $[15] = placeholder;
@@ -156,6 +157,7 @@ const Select = /*#__PURE__*/React.forwardRef((t0, ref) => {
       className: t4,
       "data-hasplaceholder": t5,
       defaultValue: t6,
+      "data-component": "Select",
       children: [t7, children]
     });
     $[18] = children;
@@ -208,7 +210,8 @@ const Option = props => {
   let t0;
   if ($[0] !== props) {
     t0 = /*#__PURE__*/jsx("option", {
-      ...props
+      ...props,
+      "data-component": "Select.Option"
     });
     $[0] = props;
     $[1] = t0;
@@ -222,7 +225,8 @@ const OptGroup = props => {
   let t0;
   if ($[0] !== props) {
     t0 = /*#__PURE__*/jsx("optgroup", {
-      ...props
+      ...props,
+      "data-component": "Select.OptGroup"
     });
     $[0] = props;
     $[1] = t0;

package/dist/SelectPanel/SelectPanel.d.ts

@@ -63,8 +63,8 @@ type SelectPanelVariantProps = {
     variant: 'modal';
     onCancel: () => void;
 };
-export type SelectPanelProps = SelectPanelBaseProps & Omit<FilteredActionListProps, 'selectionVariant' | 'variant' | 'message'> & Pick<AnchoredOverlayProps, 'open' | 'height' | 'width' | 'align' | 'displayInViewport'> & AnchoredOverlayWrapperAnchorProps & (SelectPanelSingleSelection | SelectPanelMultiSelection) & SelectPanelVariantProps;
-declare function Panel({ open, onOpenChange, renderAnchor, anchorRef: externalAnchorRef, placeholder, placeholderText, inputLabel, selected, title, subtitle, onSelectedChange, filterValue: externalFilterValue, onFilterChange: externalOnFilterChange, items, footer, textInputProps, overlayProps, loading, initialLoadingType, className, height, width, id, message, notice, onCancel, variant, secondaryAction, showSelectedOptionsFirst, disableFullscreenOnNarrow, align, showSelectAll, focusPrependedElements, virtualized, displayInViewport, ...listProps }: SelectPanelProps): JSX.Element;
+export type SelectPanelProps = SelectPanelBaseProps & Omit<FilteredActionListProps, 'selectionVariant' | 'variant' | 'message'> & Pick<AnchoredOverlayProps, 'open' | 'height' | 'width' | 'align' | 'displayInViewport' | 'cssAnchorPositioningSettings'> & AnchoredOverlayWrapperAnchorProps & (SelectPanelSingleSelection | SelectPanelMultiSelection) & SelectPanelVariantProps;
+declare function Panel({ open, onOpenChange, renderAnchor, anchorRef: externalAnchorRef, placeholder, placeholderText, inputLabel, selected, title, subtitle, onSelectedChange, filterValue: externalFilterValue, onFilterChange: externalOnFilterChange, items, footer, textInputProps, overlayProps, loading, initialLoadingType, className, height, width, id, message, notice, onCancel, variant, secondaryAction, showSelectedOptionsFirst, disableFullscreenOnNarrow, align, showSelectAll, focusPrependedElements, virtualized, displayInViewport, cssAnchorPositioningSettings, ...listProps }: SelectPanelProps): JSX.Element;
 declare const SecondaryButton: React.FC<ButtonProps>;
 declare const SecondaryLink: React.FC<LinkButtonProps & ButtonProps>;
 export declare const SelectPanel: typeof Panel & {

package/dist/SelectPanel/SelectPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPanel.d.ts","sourceRoot":"","sources":["../../src/SelectPanel/SelectPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAC1F,OAAO,KAAK,EAAE,EAAoD,KAAK,GAAG,EAAC,MAAM,OAAO,CAAA;AACxF,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,oBAAoB,CAAA;AAE5D,OAAO,KAAK,EAAC,iCAAiC,EAAC,MAAM,oCAAoC,CAAA;AACzF,OAAO,KAAK,EAAC,uBAAuB,EAAC,MAAM,uBAAuB,CAAA;AAGlE,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAE5C,OAAO,KAAK,EAAY,SAAS,EAAC,MAAM,IAAI,CAAA;AAiB5C,OAAO,KAAK,EAAC,WAAW,EAAE,eAAe,EAAC,MAAM,iBAAiB,CAAA;AAkCjE,UAAU,0BAA0B;IAClC,QAAQ,EAAE,SAAS,GAAG,SAAS,CAAA;IAC/B,gBAAgB,EAAE,CAAC,QAAQ,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAA;CAC5D;AAED,UAAU,yBAAyB;IACjC,QAAQ,EAAE,SAAS,EAAE,CAAA;IACrB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,KAAK,IAAI,CAAA;CAClD;AAED,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,UAAU,CAAA;AACvD,MAAM,MAAM,0BAA0B,GAClC,KAAK,CAAC,YAAY,CAAC,OAAO,eAAe,CAAC,GAC1C,KAAK,CAAC,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAE5C,UAAU,oBAAoB;IAG5B,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAExC,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAC3C,YAAY,EAAE,CACZ,IAAI,EAAE,OAAO,EACb,OAAO,EAAE,cAAc,GAAG,kBAAkB,GAAG,eAAe,GAAG,QAAQ,GAAG,WAAW,GAAG,QAAQ,KAC/F,IAAI,CAAA;IACT,eAAe,CAAC,EAAE,0BAA0B,CAAA;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IACpC,kBAAkB,CAAC,EAAE,kBAAkB,CAAA;IACvC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE;QAEP,IAAI,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;QACtC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAAA;KACtC,CAAA;IACD,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,MAAM,CAAA;QAEb,IAAI,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;QACtC,OAAO,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAA;QACtC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAA;QAErC,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;KACjC,CAAA;IACD;;OAEG;IAEH,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACzC,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC;;;;;OAKG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAA;IACnC,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB;;;OAGG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAA;CACjC;AAGD,KAAK,uBAAuB,GAAG;IAAC,OAAO,CAAC,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CAAC,GAAG;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,MAAM,IAAI,CAAA;CAAC,CAAA;AAEvH,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GACjD,IAAI,CAAC,uBAAuB,EAAE,kBAAkB,GAAG,SAAS,GAAG,SAAS,CAAC,GACzE,IAAI,CAAC,oBAAoB,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,mBAAmB,CAAC,GACvF,iCAAiC,GACjC,CAAC,0BAA0B,GAAG,yBAAyB,CAAC,GACxD,uBAAuB,CAAA;AAkCzB,iBAAS,KAAK,CAAC,EACb,IAAI,EACJ,YAAY,EACZ,YAAkC,EAClC,SAAS,EAAE,iBAAiB,EAC5B,WAAW,EACX,eAAgC,EAChC,UAA4B,EAC5B,QAAQ,EACR,KAA0E,EAC1E,QAAQ,EACR,gBAAgB,EAChB,WAAW,EAAE,mBAAmB,EAChC,cAAc,EAAE,sBAAsB,EACtC,KAAK,EACL,MAAM,EACN,cAAc,EACd,YAAY,EACZ,OAAO,EACP,kBAA8B,EAC9B,SAAS,EACT,MAAM,EACN,KAAK,EACL,EAAE,EACF,OAAO,EACP,MAAM,EACN,QAAQ,EACR,OAAoB,EACpB,eAAe,EACf,wBAA+B,EAC/B,yBAAyB,EACzB,KAAK,EACL,aAAqB,EACrB,sBAAsB,EACtB,WAAW,EACX,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CAg1BhC;AAED,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAM1C,CAAA;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,GAAG,WAAW,CAM1D,CAAA;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;CAKtB,CAAA"}
+{"version":3,"file":"SelectPanel.d.ts","sourceRoot":"","sources":["../../src/SelectPanel/SelectPanel.tsx"],"names":[],"mappings":"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"}

package/dist/SelectPanel/SelectPanel.js

@@ -115,6 +115,7 @@ function Panel({
   focusPrependedElements,
   virtualized,
   displayInViewport,
+  cssAnchorPositioningSettings,
   ...listProps
 }) {
   var _listProps$groupMetad;
@@ -708,9 +709,11 @@ function Panel({
       closeButtonProps: closeButtonProps,
       displayInViewport: displayInViewport
       // Modal variant is positioned manually so native CSS anchor positioning must not be used
+      // Other cssAnchorPositioningSettings (e.g. fallbackStrategy) may be passed in and are forwarded here
       ,
       cssAnchorPositioningSettings: {
-        disable: variant === 'modal'
+        ...cssAnchorPositioningSettings,
+        disable: variant === 'modal' || (cssAnchorPositioningSettings === null || cssAnchorPositioningSettings === void 0 ? void 0 : cssAnchorPositioningSettings.disable)
       },
       children: /*#__PURE__*/jsxs("div", {
         className: classes.Wrapper,

package/dist/SideNav.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../src/SideNav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,eAAe,CAAA;AACjD,OAAa,EAAC,KAAK,SAAS,EAAC,MAAM,QAAQ,CAAA;AAC3C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAI5C,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,OAAO,CAAC,EAAE,aAAa,GAAG,QAAQ,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,iBAAS,OAAO,CAAC,EACf,EAAE,EAAE,SAAiB,EACrB,OAAkB,EAClB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,GACxB,EAAE,gBAAgB,qBAkBlB;AAED,KAAK,sBAAsB,GAAG,iBAAiB,CAAC;IAC9C,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;CAC5B,CAAC,GACA,SAAS,CAAA;AAEX,QAAA,MAAM,WAAW;8DAA2D,sBAAsB;;CAUjG,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAEjE,4EAA4E;;;kEAjBA,sBAAsB;;;;AAkBlG,wBAA0D"}
+{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../src/SideNav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,eAAe,CAAA;AACjD,OAAa,EAAC,KAAK,SAAS,EAAC,MAAM,QAAQ,CAAA;AAC3C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAI5C,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,OAAO,CAAC,EAAE,aAAa,GAAG,QAAQ,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,iBAAS,OAAO,CAAC,EACf,EAAE,EAAE,SAAiB,EACrB,OAAkB,EAClB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,GACxB,EAAE,gBAAgB,qBAkBlB;AAED,KAAK,sBAAsB,GAAG,iBAAiB,CAAC;IAC9C,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;CAC5B,CAAC,GACA,SAAS,CAAA;AAEX,QAAA,MAAM,WAAW;8DAA2D,sBAAsB;;CAejG,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAEjE,4EAA4E;;;kEAtBA,sBAAsB;;;;AAuBlG,wBAA0D"}

package/dist/SideNav.js

@@ -18,6 +18,7 @@ function SideNav({
   return /*#__PURE__*/jsx(Component, {
     className: newClassName,
     "aria-label": ariaLabel,
+    "data-component": "SideNav",
     children: children
   });
 }
@@ -40,6 +41,7 @@ const SideNavLink = ({
     "aria-current": isReactRouter || selected ? 'page' : undefined,
     className: newClassName,
     ...rest,
+    "data-component": "SideNav.Link",
     children: children
   });
 };

package/dist/Skeleton/SkeletonBox.d.ts

@@ -9,6 +9,7 @@ export type SkeletonBoxProps = {
     className?: string;
     /** Controls whether and how long to delay rendering the SkeletonBox. Set to 'short' to delay by 300ms, 'long' to delay by 1000ms, or provide a custom number of milliseconds.*/
     delay?: 'short' | 'long' | number;
+    'data-component'?: string;
 } & HTMLProps<HTMLElement>;
 export declare const SkeletonBox: React.ForwardRefExoticComponent<Omit<SkeletonBoxProps, "ref"> & React.RefAttributes<HTMLElement>>;
 //# sourceMappingURL=SkeletonBox.d.ts.map

package/dist/Skeleton/SkeletonBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonBox.d.ts","sourceRoot":"","sources":["../../src/Skeleton/SkeletonBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,EAAC,KAAK,aAAa,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAIxD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC9B,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gLAAgL;IAChL,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;CAClC,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,eAAO,MAAM,WAAW,mGA+BtB,CAAA"}
+{"version":3,"file":"SkeletonBox.d.ts","sourceRoot":"","sources":["../../src/Skeleton/SkeletonBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,EAAC,KAAK,aAAa,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAIxD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC9B,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gLAAgL;IAChL,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;IACjC,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,eAAO,MAAM,WAAW,mGAgCtB,CAAA"}

package/dist/Skeleton/SkeletonBox.js

@@ -5,12 +5,13 @@ import classes from './SkeletonBox.module.css.js';
 import { jsx } from 'react/jsx-runtime';
 
 const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref) {
-  const $ = c(23);
+  const $ = c(25);
   let className;
   let delay;
   let height;
   let props;
   let style;
+  let t1;
   let width;
   if ($[0] !== t0) {
     ({
@@ -19,6 +20,7 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
       className,
       style,
       delay,
+      "data-component": t1,
       ...props
     } = t0);
     $[0] = t0;
@@ -27,20 +29,23 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
     $[3] = height;
     $[4] = props;
     $[5] = style;
-    $[6] = width;
+    $[6] = t1;
+    $[7] = width;
   } else {
     className = $[1];
     delay = $[2];
     height = $[3];
     props = $[4];
     style = $[5];
-    width = $[6];
+    t1 = $[6];
+    width = $[7];
   }
+  const dataComponent = t1 === undefined ? "SkeletonBox" : t1;
   const [isVisible, setIsVisible] = useState(!delay);
-  let t1;
   let t2;
-  if ($[7] !== delay) {
-    t1 = () => {
+  let t3;
+  if ($[8] !== delay) {
+    t2 = () => {
       if (delay) {
         const timeoutId = setTimeout(() => {
           setIsVisible(true);
@@ -48,66 +53,68 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
         return () => clearTimeout(timeoutId);
       }
     };
-    t2 = [delay];
-    $[7] = delay;
-    $[8] = t1;
+    t3 = [delay];
+    $[8] = delay;
     $[9] = t2;
+    $[10] = t3;
   } else {
-    t1 = $[8];
     t2 = $[9];
+    t3 = $[10];
   }
-  useEffect(t1, t2);
+  useEffect(t2, t3);
   if (!isVisible) {
     return null;
   }
-  const t3 = ref;
-  let t4;
-  if ($[10] !== className) {
-    t4 = clsx(className, classes.SkeletonBox);
-    $[10] = className;
-    $[11] = t4;
-  } else {
-    t4 = $[11];
-  }
+  const t4 = ref;
   let t5;
-  if ($[12] !== style) {
-    t5 = style || {};
-    $[12] = style;
-    $[13] = t5;
+  if ($[11] !== className) {
+    t5 = clsx(className, classes.SkeletonBox);
+    $[11] = className;
+    $[12] = t5;
   } else {
-    t5 = $[13];
+    t5 = $[12];
   }
   let t6;
-  if ($[14] !== height || $[15] !== t5 || $[16] !== width) {
-    t6 = {
+  if ($[13] !== style) {
+    t6 = style || {};
+    $[13] = style;
+    $[14] = t6;
+  } else {
+    t6 = $[14];
+  }
+  let t7;
+  if ($[15] !== height || $[16] !== t6 || $[17] !== width) {
+    t7 = {
       height,
       width,
-      ...t5
+      ...t6
     };
-    $[14] = height;
-    $[15] = t5;
-    $[16] = width;
-    $[17] = t6;
+    $[15] = height;
+    $[16] = t6;
+    $[17] = width;
+    $[18] = t7;
   } else {
-    t6 = $[17];
+    t7 = $[18];
   }
-  let t7;
-  if ($[18] !== props || $[19] !== t3 || $[20] !== t4 || $[21] !== t6) {
-    t7 = /*#__PURE__*/jsx("div", {
-      ref: t3,
-      className: t4,
-      style: t6,
-      ...props
+  let t8;
+  if ($[19] !== dataComponent || $[20] !== props || $[21] !== t4 || $[22] !== t5 || $[23] !== t7) {
+    t8 = /*#__PURE__*/jsx("div", {
+      ref: t4,
+      className: t5,
+      style: t7,
+      ...props,
+      "data-component": dataComponent
     });
-    $[18] = props;
-    $[19] = t3;
-    $[20] = t4;
-    $[21] = t6;
-    $[22] = t7;
+    $[19] = dataComponent;
+    $[20] = props;
+    $[21] = t4;
+    $[22] = t5;
+    $[23] = t7;
+    $[24] = t8;
   } else {
-    t7 = $[22];
+    t8 = $[24];
   }
-  return t7;
+  return t8;
 });
 
 export { SkeletonBox };

package/dist/SkeletonText/SkeletonText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonText.d.ts","sourceRoot":"","sources":["../../src/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAKpC,UAAU,iBAAkB,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IACtE,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,GAAG,WAAW,GAAG,YAAY,GAAG,WAAW,GAAG,UAAU,CAAA;IACtH,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EAAC,KAAS,EAAE,QAAQ,EAAE,IAAmB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,qBAsC7G;AAED,OAAO,EAAC,YAAY,EAAC,CAAA;AACrB,YAAY,EAAC,iBAAiB,EAAC,CAAA"}
+{"version":3,"file":"SkeletonText.d.ts","sourceRoot":"","sources":["../../src/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAKpC,UAAU,iBAAkB,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IACtE,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,GAAG,WAAW,GAAG,YAAY,GAAG,WAAW,GAAG,UAAU,CAAA;IACtH,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EAAC,KAAS,EAAE,QAAQ,EAAE,IAAmB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,qBAuC7G;AAED,OAAO,EAAC,YAAY,EAAC,CAAA;AACrB,YAAY,EAAC,iBAAiB,EAAC,CAAA"}

package/dist/SkeletonText/SkeletonText.js

@@ -62,12 +62,12 @@ function SkeletonText(t0) {
     let t5;
     if ($[12] !== rest || $[13] !== size || $[14] !== t3 || $[15] !== t4) {
       t5 = /*#__PURE__*/jsx(SkeletonBox, {
-        "data-component": "SkeletonText",
         "data-text-skeleton-size": size,
         width: "100%",
         className: t3,
         style: t4,
-        ...rest
+        ...rest,
+        "data-component": "SkeletonText"
       });
       $[12] = rest;
       $[13] = size;

package/dist/Spinner/Spinner.js

@@ -191,6 +191,7 @@ function Spinner(t0) {
   if ($[32] !== t14 || $[33] !== t15) {
     t16 = /*#__PURE__*/jsxs("span", {
       className: classes.Box,
+      "data-component": "Spinner",
       children: [t14, t15]
     });
     $[32] = t14;

package/generated/components.json

@@ -4169,6 +4169,46 @@
         }
       ],
       "subcomponents": [
+        {
+          "name": "NavList.Heading",
+          "props": [
+            {
+              "name": "as",
+              "type": "'h2' | 'h3'",
+              "defaultValue": "\"h2\"",
+              "required": false,
+              "description": "Semantic heading level for the NavList. Also sets the default level for child group headings, which render one level deeper (h3 under an h2, h4 under an h3). Constrained to h2/h3 so the hierarchy stays shallow."
+            },
+            {
+              "name": "visuallyHidden",
+              "type": "boolean",
+              "defaultValue": "false",
+              "required": false,
+              "description": "Visually hide the heading while keeping it available to assistive technology and as the accessible name for the `nav` landmark."
+            },
+            {
+              "name": "children",
+              "type": "ReactNode",
+              "required": true,
+              "description": "The text rendered as the NavList's heading."
+            },
+            {
+              "name": "id",
+              "type": "string",
+              "description": "Custom id for the heading element. When set, it is used as the `aria-labelledby` target that names the `nav` landmark; otherwise a generated id is used."
+            },
+            {
+              "name": "className",
+              "type": "string",
+              "description": "Custom CSS class name."
+            },
+            {
+              "name": "style",
+              "type": "React.CSSProperties",
+              "description": "Custom CSS styles."
+            }
+          ]
+        },
         {
           "name": "NavList.Item",
           "props": [
@@ -4315,10 +4355,9 @@
             },
             {
               "name": "as",
-              "description": "Heading level for the group heading. Sets the semantic heading tag.",
+              "description": "Heading level for the group heading. Sets the semantic heading tag. Defaults to one level below a `NavList.Heading` (h3 under an h2, h4 under an h3), or `h3` when there is no `NavList.Heading`.",
               "required": false,
-              "type": "'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'",
-              "defaultValue": "\"h3\""
+              "type": "'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'"
             }
           ]
         },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@primer/react",
   "type": "module",
-  "version": "38.29.1-rc.42909d47c",
+  "version": "38.30.0-rc.5c4b3e004",
   "description": "An implementation of GitHub's Primer Design System using React",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -131,7 +131,7 @@
     "@types/lodash.isempty": "4.4.9",
     "@types/lodash.isobject": "3.0.9",
     "@types/lodash.keyby": "4.6.9",
-    "@types/node": "20.12.11",
+    "@types/node": "26.0.0",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
     "@types/react-is": "18.3.1",

package/dist/NavList/NavList-5dc067e3.css

@@ -1,2 +0,0 @@
-.prc-NavList-GroupHeading-mN50z>a{color:var(--fgColor-default,#1f2328);text-decoration:inherit}.prc-NavList-GroupHeading-mN50z>a:hover{-webkit-text-decoration:underline;text-decoration:underline}
-/*# sourceMappingURL=NavList-5dc067e3.css.map */

package/dist/NavList/NavList-5dc067e3.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/NavList/NavList.module.css.js"],"names":[],"mappings":"AAAA,kCACE,oCAA6B,CAC7B,uBACF,CAEA,wCACE,iCAA0B,CAA1B,yBACF","file":"NavList-5dc067e3.css","sourcesContent":[".GroupHeading > a {\n  color: var(--fgColor-default);\n  text-decoration: inherit;\n}\n\n.GroupHeading > a:hover {\n  text-decoration: underline;\n}\n"]}