@primer/react 38.34.0-rc.f86dc8614 → 38.35.0-rc.f27c5cca1

package/dist/Link/Link.js

@@ -8,74 +8,74 @@ import { jsx } from "react/jsx-runtime";
 import React from "react";
 //#region src/Link/Link.tsx
 const UnwrappedLink = (props, ref) => {
-	const $ = c(19);
+	const $ = c(17);
 	let className;
-	let hoverColor;
 	let inline;
 	let muted;
 	let restProps;
 	let t0;
 	if ($[0] !== props) {
-		({as: t0, className, inline, muted, hoverColor, ...restProps} = props);
+		const { as: t1, className: t2, inline: t3, muted: t4, hoverColor: _hoverColor, ...t5 } = props;
+		t0 = t1;
+		className = t2;
+		inline = t3;
+		muted = t4;
+		restProps = t5;
 		$[0] = props;
 		$[1] = className;
-		$[2] = hoverColor;
-		$[3] = inline;
-		$[4] = muted;
-		$[5] = restProps;
-		$[6] = t0;
+		$[2] = inline;
+		$[3] = muted;
+		$[4] = restProps;
+		$[5] = t0;
 	} else {
 		className = $[1];
-		hoverColor = $[2];
-		inline = $[3];
-		muted = $[4];
-		restProps = $[5];
-		t0 = $[6];
+		inline = $[2];
+		muted = $[3];
+		restProps = $[4];
+		t0 = $[5];
 	}
 	const Component = t0 === void 0 ? "a" : t0;
 	const innerRef = React.useRef(null);
 	const mergedRef = useMergedRefs(ref, innerRef);
 	let t1;
 	let t2;
-	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
 		t1 = () => {
 			if (innerRef.current && !(innerRef.current instanceof HTMLButtonElement) && !(innerRef.current instanceof HTMLAnchorElement)) console.error("Error: Found `Link` component that renders an inaccessible element", innerRef.current, "Please ensure `Link` always renders as <a> or <button>");
 		};
 		t2 = [innerRef];
-		$[7] = t1;
-		$[8] = t2;
+		$[6] = t1;
+		$[7] = t2;
 	} else {
-		t1 = $[7];
-		t2 = $[8];
+		t1 = $[6];
+		t2 = $[7];
 	}
 	useDevOnlyEffect(t1, t2);
 	let t3;
-	if ($[9] !== className) {
+	if ($[8] !== className) {
 		t3 = clsx(className, Link_module_css_default.Link);
-		$[9] = className;
-		$[10] = t3;
-	} else t3 = $[10];
+		$[8] = className;
+		$[9] = t3;
+	} else t3 = $[9];
 	const t4 = mergedRef;
 	let t5;
-	if ($[11] !== Component || $[12] !== hoverColor || $[13] !== inline || $[14] !== muted || $[15] !== restProps || $[16] !== t3 || $[17] !== t4) {
+	if ($[10] !== Component || $[11] !== inline || $[12] !== muted || $[13] !== restProps || $[14] !== t3 || $[15] !== t4) {
 		t5 = /*#__PURE__*/ jsx(Component, {
 			className: t3,
 			"data-component": "Link",
 			"data-muted": muted,
 			"data-inline": inline,
-			"data-hover-color": hoverColor,
 			...restProps,
 			ref: t4
 		});
-		$[11] = Component;
-		$[12] = hoverColor;
-		$[13] = inline;
-		$[14] = muted;
-		$[15] = restProps;
-		$[16] = t3;
-		$[17] = t4;
-		$[18] = t5;
-	} else t5 = $[18];
+		$[10] = Component;
+		$[11] = inline;
+		$[12] = muted;
+		$[13] = restProps;
+		$[14] = t3;
+		$[15] = t4;
+		$[16] = t5;
+	} else t5 = $[16];
 	return t5;
 };
 const LinkComponent = fixedForwardRef(UnwrappedLink);

package/dist/Overlay/Overlay.js

@@ -1,8 +1,8 @@
 import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import useIsomorphicLayoutEffect from "../utils/useIsomorphicLayoutEffect.js";
 import { useOverlay } from "../hooks/useOverlay.js";
-import Portal_default from "../Portal/index.js";
 import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
+import Portal_default from "../Portal/index.js";
 import Overlay_module_css_default from "./Overlay.module.css.js";
 import { clsx } from "clsx";
 import { jsx } from "react/jsx-runtime";

package/dist/PageHeader/PageHeader.js

@@ -1,6 +1,8 @@
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
 import { useProvidedRefOrCreate } from "../hooks/useProvidedRefOrCreate.js";
 import { warning } from "../utils/warning.js";
 import { isSlot } from "../utils/is-slot.js";
+import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
 import { isResponsiveValue } from "../hooks/useResponsiveValue.js";
 import { getResponsiveAttributes } from "../internal/utils/getResponsiveAttributes.js";
 import Heading from "../Heading/Heading.js";
@@ -10,7 +12,7 @@ import PageHeader_module_css_default from "./PageHeader.module.css.js";
 import { c } from "react-compiler-runtime";
 import { clsx } from "clsx";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import React, { useEffect } from "react";
+import React, { useEffect, useRef } from "react";
 import { ArrowLeftIcon } from "@primer/octicons-react";
 //#region src/PageHeader/PageHeader.tsx
 const hiddenOnRegularAndWide = {
@@ -27,7 +29,12 @@ const Root = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 	const $ = c(17);
 	const { children, className, as: t1, "aria-label": ariaLabel, role, hasBorder } = t0;
 	const BaseComponent = t1 === void 0 ? "div" : t1;
-	const rootRef = useProvidedRefOrCreate(forwardedRef);
+	const mergedRefEnabled = useFeatureFlag("primer_react_merged_forwarded_refs");
+	const rootRef = useRef(null);
+	const mergedRef = useMergedRefs(rootRef, forwardedRef);
+	const providedOrCreatedRef = useProvidedRefOrCreate(forwardedRef);
+	const readRef = mergedRefEnabled ? rootRef : providedOrCreatedRef;
+	const appliedRef = mergedRefEnabled ? mergedRef : providedOrCreatedRef;
 	const hoistChildState = (nodes) => {
 		const result = { hasNavigation: false };
 		for (const child of React.Children.toArray(nodes)) {
@@ -54,12 +61,12 @@ const Root = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 	const isInteractive = _temp;
 	let t2;
 	let t3;
-	if ($[0] !== children || $[1] !== rootRef) {
+	if ($[0] !== children || $[1] !== readRef) {
 		t2 = function validateInteractiveElementsInTitle() {
 			let hasContextArea = false;
 			let hasLeadingAction = false;
-			if (!rootRef.current || rootRef.current.children.length <= 0) return;
-			const titleArea = Array.from(rootRef.current.children).find(_temp2);
+			if (!readRef.current || readRef.current.children.length <= 0) return;
+			const titleArea = Array.from(readRef.current.children).find(_temp2);
 			if (!titleArea) return;
 			for (const child_1 of React.Children.toArray(children)) {
 				if (/*#__PURE__*/ React.isValidElement(child_1) && (child_1.type === ContextArea || isSlot(child_1, ContextArea))) hasContextArea = true;
@@ -67,9 +74,9 @@ const Root = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 			}
 			warning(Array.from(titleArea.childNodes).some((child_2) => child_2 instanceof HTMLElement && isInteractive(child_2) || Array.from(child_2.childNodes).some((child_3) => child_3 instanceof HTMLElement && isInteractive(child_3))) && (hasContextArea || hasLeadingAction), "When PageHeader.ContextArea or PageHeader.LeadingAction is present, we recommended not to include any interactive items in the PageHeader.TitleArea to make sure the focus order is logical.");
 		};
-		t3 = [children, rootRef];
+		t3 = [children, readRef];
 		$[0] = children;
-		$[1] = rootRef;
+		$[1] = readRef;
 		$[2] = t2;
 		$[3] = t3;
 	} else {
@@ -89,9 +96,9 @@ const Root = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 	const t8 = getResponsiveAttributes("title-size-variant", titleVariant);
 	const t9 = getNavHiddenDataAttributes(navigationHidden);
 	let t10;
-	if ($[6] !== BaseComponent || $[7] !== ariaLabel || $[8] !== children || $[9] !== role || $[10] !== rootRef || $[11] !== t4 || $[12] !== t6 || $[13] !== t7 || $[14] !== t8 || $[15] !== t9) {
+	if ($[6] !== BaseComponent || $[7] !== appliedRef || $[8] !== ariaLabel || $[9] !== children || $[10] !== role || $[11] !== t4 || $[12] !== t6 || $[13] !== t7 || $[14] !== t8 || $[15] !== t9) {
 		t10 = /*#__PURE__*/ jsx(BaseComponent, {
-			ref: rootRef,
+			ref: appliedRef,
 			className: t4,
 			"data-component": t5,
 			"data-has-border": t6,
@@ -103,10 +110,10 @@ const Root = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 			children
 		});
 		$[6] = BaseComponent;
-		$[7] = ariaLabel;
-		$[8] = children;
-		$[9] = role;
-		$[10] = rootRef;
+		$[7] = appliedRef;
+		$[8] = ariaLabel;
+		$[9] = children;
+		$[10] = role;
 		$[11] = t4;
 		$[12] = t6;
 		$[13] = t7;
@@ -295,7 +302,9 @@ const TitleArea = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 	const { children, className, hidden: t1, variant: t2 } = t0;
 	const hidden = t1 === void 0 ? false : t1;
 	const variant = t2 === void 0 ? "medium" : t2;
-	const titleAreaRef = useProvidedRefOrCreate(forwardedRef);
+	const mergedRefEnabled = useFeatureFlag("primer_react_merged_forwarded_refs");
+	const providedOrCreatedRef = useProvidedRefOrCreate(forwardedRef);
+	const appliedRef = mergedRefEnabled ? forwardedRef : providedOrCreatedRef;
 	let t3;
 	if ($[0] !== className) {
 		t3 = clsx(PageHeader_module_css_default.TitleArea, className);
@@ -315,20 +324,20 @@ const TitleArea = /*#__PURE__*/ React.forwardRef((t0, forwardedRef) => {
 		$[5] = t5;
 	} else t5 = $[5];
 	let t6;
-	if ($[6] !== children || $[7] !== t3 || $[8] !== t4 || $[9] !== t5 || $[10] !== titleAreaRef) {
+	if ($[6] !== appliedRef || $[7] !== children || $[8] !== t3 || $[9] !== t4 || $[10] !== t5) {
 		t6 = /*#__PURE__*/ jsx("div", {
 			className: t3,
-			ref: titleAreaRef,
+			ref: appliedRef,
 			"data-component": "TitleArea",
 			...t4,
 			...t5,
 			children
 		});
-		$[6] = children;
-		$[7] = t3;
-		$[8] = t4;
-		$[9] = t5;
-		$[10] = titleAreaRef;
+		$[6] = appliedRef;
+		$[7] = children;
+		$[8] = t3;
+		$[9] = t4;
+		$[10] = t5;
 		$[11] = t6;
 	} else t6 = $[11];
 	return t6;

package/dist/Popover/Popover.d.ts

@@ -16,6 +16,7 @@ type PopoverContentProps = {
   height?: 'small' | 'large' | 'medium' | 'auto' | 'xlarge' | 'fit-content';
   overflow?: 'auto' | 'hidden' | 'scroll' | 'visible';
   onClickOutside?: (event: MouseEvent | TouchEvent) => void;
+  onEscape?: (event: KeyboardEvent) => void;
   ignoreClickRefs?: React.RefObject<HTMLElement>[];
 } & HTMLProps<HTMLDivElement>;
 declare const _default: React.ForwardRefExoticComponent<Omit<PopoverProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {

package/dist/Popover/Popover.js

@@ -1,4 +1,5 @@
 import { useOnOutsideClick } from "../hooks/useOnOutsideClick.js";
+import { useOnEscapePress } from "../hooks/useOnEscapePress.js";
 import Popover_module_css_default from "./Popover.module.css.js";
 import { c } from "react-compiler-runtime";
 import { clsx } from "clsx";
@@ -6,8 +7,10 @@ import { jsx } from "react/jsx-runtime";
 import React, { useRef } from "react";
 //#region src/Popover/Popover.tsx
 const EMPTY_IGNORE_CLICK_REFS = [];
+const PopoverContext = /*#__PURE__*/ React.createContext(false);
 const Popover = /*#__PURE__*/ React.forwardRef(function Popover(t0, forwardRef) {
-	const $ = c(15);
+	var _open;
+	const $ = c(18);
 	let className;
 	let open;
 	let props;
@@ -29,102 +32,136 @@ const Popover = /*#__PURE__*/ React.forwardRef(function Popover(t0, forwardRef)
 		t1 = $[5];
 	}
 	const caret = t1 === void 0 ? "top" : t1;
-	const t2 = open ? "" : void 0;
-	const t3 = relative ? "" : void 0;
-	let t4;
+	const t2 = (_open = open) !== null && _open !== void 0 ? _open : false;
+	const t3 = open ? "" : void 0;
+	const t4 = relative ? "" : void 0;
+	let t5;
 	if ($[6] !== className) {
-		t4 = clsx(className, Popover_module_css_default.Popover);
+		t5 = clsx(className, Popover_module_css_default.Popover);
 		$[6] = className;
-		$[7] = t4;
-	} else t4 = $[7];
-	let t5;
-	if ($[8] !== caret || $[9] !== forwardRef || $[10] !== props || $[11] !== t2 || $[12] !== t3 || $[13] !== t4) {
-		t5 = /*#__PURE__*/ jsx("div", {
+		$[7] = t5;
+	} else t5 = $[7];
+	let t6;
+	if ($[8] !== caret || $[9] !== forwardRef || $[10] !== props || $[11] !== t3 || $[12] !== t4 || $[13] !== t5) {
+		t6 = /*#__PURE__*/ jsx("div", {
 			...props,
 			ref: forwardRef,
 			"data-component": "Popover",
-			"data-open": t2,
-			"data-relative": t3,
+			"data-open": t3,
+			"data-relative": t4,
 			"data-caret": caret,
-			className: t4
+			className: t5
 		});
 		$[8] = caret;
 		$[9] = forwardRef;
 		$[10] = props;
-		$[11] = t2;
-		$[12] = t3;
-		$[13] = t4;
-		$[14] = t5;
-	} else t5 = $[14];
-	return t5;
+		$[11] = t3;
+		$[12] = t4;
+		$[13] = t5;
+		$[14] = t6;
+	} else t6 = $[14];
+	let t7;
+	if ($[15] !== t2 || $[16] !== t6) {
+		t7 = /*#__PURE__*/ jsx(PopoverContext.Provider, {
+			value: t2,
+			children: t6
+		});
+		$[15] = t2;
+		$[16] = t6;
+		$[17] = t7;
+	} else t7 = $[17];
+	return t7;
 });
 Popover.displayName = "Popover";
 const PopoverContent = (t0) => {
 	var _onClickOutside, _ignoreClickRefs;
-	const $ = c(17);
+	const $ = c(22);
 	let className;
 	let ignoreClickRefs;
 	let onClickOutside;
+	let onEscape;
 	let props;
 	let t1;
 	let t2;
 	if ($[0] !== t0) {
-		({className, width: t1, height: t2, onClickOutside, ignoreClickRefs, ...props} = t0);
+		({className, width: t1, height: t2, onClickOutside, onEscape, ignoreClickRefs, ...props} = t0);
 		$[0] = t0;
 		$[1] = className;
 		$[2] = ignoreClickRefs;
 		$[3] = onClickOutside;
-		$[4] = props;
-		$[5] = t1;
-		$[6] = t2;
+		$[4] = onEscape;
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
 	} else {
 		className = $[1];
 		ignoreClickRefs = $[2];
 		onClickOutside = $[3];
-		props = $[4];
-		t1 = $[5];
-		t2 = $[6];
+		onEscape = $[4];
+		props = $[5];
+		t1 = $[6];
+		t2 = $[7];
 	}
 	const width = t1 === void 0 ? "small" : t1;
 	const height = t2 === void 0 ? "fit-content" : t2;
 	const divRef = useRef(null);
+	const open = React.useContext(PopoverContext);
 	const outsideClickHandler = (_onClickOutside = onClickOutside) !== null && _onClickOutside !== void 0 ? _onClickOutside : _temp;
 	const t3 = (_ignoreClickRefs = ignoreClickRefs) !== null && _ignoreClickRefs !== void 0 ? _ignoreClickRefs : EMPTY_IGNORE_CLICK_REFS;
 	let t4;
-	if ($[7] !== outsideClickHandler || $[8] !== t3) {
+	if ($[8] !== outsideClickHandler || $[9] !== t3) {
 		t4 = {
 			onClickOutside: outsideClickHandler,
 			containerRef: divRef,
 			ignoreClickRefs: t3
 		};
-		$[7] = outsideClickHandler;
-		$[8] = t3;
-		$[9] = t4;
-	} else t4 = $[9];
+		$[8] = outsideClickHandler;
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
 	useOnOutsideClick(t4);
 	let t5;
-	if ($[10] !== className) {
-		t5 = clsx(className, Popover_module_css_default.PopoverContent);
-		$[10] = className;
-		$[11] = t5;
-	} else t5 = $[11];
 	let t6;
-	if ($[12] !== height || $[13] !== props || $[14] !== t5 || $[15] !== width) {
-		t6 = /*#__PURE__*/ jsx("div", {
+	if ($[11] !== onEscape || $[12] !== open) {
+		t5 = (event) => {
+			if (open && onEscape) {
+				onEscape(event);
+				event.preventDefault();
+			}
+		};
+		t6 = [open, onEscape];
+		$[11] = onEscape;
+		$[12] = open;
+		$[13] = t5;
+		$[14] = t6;
+	} else {
+		t5 = $[13];
+		t6 = $[14];
+	}
+	useOnEscapePress(t5, t6);
+	let t7;
+	if ($[15] !== className) {
+		t7 = clsx(className, Popover_module_css_default.PopoverContent);
+		$[15] = className;
+		$[16] = t7;
+	} else t7 = $[16];
+	let t8;
+	if ($[17] !== height || $[18] !== props || $[19] !== t7 || $[20] !== width) {
+		t8 = /*#__PURE__*/ jsx("div", {
 			ref: divRef,
 			"data-component": "Popover.Content",
 			"data-width": width,
 			"data-height": height,
-			className: t5,
+			className: t7,
 			...props
 		});
-		$[12] = height;
-		$[13] = props;
-		$[14] = t5;
-		$[15] = width;
-		$[16] = t6;
-	} else t6 = $[16];
-	return t6;
+		$[17] = height;
+		$[18] = props;
+		$[19] = t7;
+		$[20] = width;
+		$[21] = t8;
+	} else t8 = $[21];
+	return t8;
 };
 PopoverContent.displayName = "Popover.Content";
 var Popover_default = Object.assign(Popover, { Content: PopoverContent });

package/dist/Radio/Radio.js

@@ -48,7 +48,7 @@ const Radio = /*#__PURE__*/ React.forwardRef((t0, ref) => {
 	let t2;
 	if ($[10] !== onChange || $[11] !== radioGroupContext) {
 		t2 = (e) => {
-			!(radioGroupContext === null || radioGroupContext === void 0) && radioGroupContext.onChange && radioGroupContext.onChange(e);
+			radioGroupContext !== null && radioGroupContext !== void 0 && radioGroupContext.onChange && radioGroupContext.onChange(e);
 			onChange && onChange(e);
 		};
 		$[10] = onChange;

package/dist/SegmentedControl/{SegmentedControl-a004561f.css → SegmentedControl-de65527b.css}

@@ -1,2 +1,2 @@
-.prc-SegmentedControl-SegmentedControl-lqIXp{--segmented-control-icon-width:32px;background-color:var(--controlTrack-bgColor-rest,#e6eaef);border:var(--borderWidth-thin,.0625rem) solid var(--controlTrack-borderColor-rest,transparent);border-radius:var(--borderRadius-medium,.375rem);display:inline-flex;font-size:var(--text-body-size-medium,.875rem);height:32px;margin:0;padding:0}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-narrow=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-narrow=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}@media (min-width:48rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}@media (min-width:87.5rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-wide=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=true]:not([data-full-width-wide=true]),.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-wide=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-narrow=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-narrow=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}@media (min-width:48rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-regular=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-regular=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}@media (min-width:87.5rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-wide=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-wide=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}.prc-SegmentedControl-SegmentedControl-lqIXp:where([data-size=small]){font-size:var(--text-body-size-small,.75rem);height:28px}.prc-SegmentedControl-DropdownContainer-ZaPMn{display:none}.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant=dropdown]{display:block}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-narrow=dropdown]{display:block}}@media (min-width:48rem){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-regular=dropdown]{display:block}}@media (min-width:87.5rem){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-wide=dropdown]{display:block}}.prc-SegmentedControl-Item-tSCQh{display:block;flex-grow:1;margin-bottom:-1px;margin-top:-1px;position:relative}.prc-SegmentedControl-Item-tSCQh:not(:last-child){margin-right:1px}.prc-SegmentedControl-Item-tSCQh:not(:last-child):after{background-color:var(--borderColor-default,#d1d9e0);bottom:var(--base-size-8,.5rem);content:"";position:absolute;right:calc(var(--base-size-2,.125rem)*-1);top:var(--base-size-8,.5rem);width:1px}.prc-SegmentedControl-Item-tSCQh:not(:last-child):has(+[data-selected]):after,.prc-SegmentedControl-Item-tSCQh:not(:last-child):where([data-selected]):after{background-color:transparent}.prc-SegmentedControl-Item-tSCQh:first-child{margin-left:-1px}.prc-SegmentedControl-Item-tSCQh:last-child{margin-right:-1px}.prc-SegmentedControl-Item-tSCQh .prc-SegmentedControl-Counter-GmZOI{align-items:center;display:flex;margin-inline-start:var(--base-size-8,.5rem)}.prc-SegmentedControl-Button-E48xz{--segmented-control-button-inner-padding:12px;--segmented-control-button-bg-inset:4px;--segmented-control-outer-radius:var(--borderRadius-medium,0.375rem);background-color:transparent;border-color:transparent;border-radius:var(--segmented-control-outer-radius);border-width:0;color:currentColor;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:var(--base-text-weight-normal,400);height:100%;padding:var(--segmented-control-button-bg-inset);width:100%}.prc-SegmentedControl-Button-E48xz svg{fill:var(--fgColor-muted,#59636e);color:var(--fgColor-muted,#59636e)}.prc-SegmentedControl-Button-E48xz:focus:not(:disabled){box-shadow:none;outline:var(--base-size-2,.125rem) solid var(--fgColor-accent,#0969da);outline-offset:-1px}.prc-SegmentedControl-Button-E48xz:focus:not(:disabled):not(:focus-visible){outline:1px solid transparent}.prc-SegmentedControl-Button-E48xz:focus-visible:not(:disabled){box-shadow:none;outline:var(--base-size-2,.125rem) solid var(--fgColor-accent,#0969da);outline-offset:-1px}.prc-SegmentedControl-Button-E48xz:focus:focus-visible:not(:last-child):after{width:0}.prc-SegmentedControl-Button-E48xz[aria-disabled=true]:not([aria-current=true]){background-color:transparent;color:var(--fgColor-disabled,#818b98);cursor:not-allowed}.prc-SegmentedControl-Button-E48xz[aria-disabled=true]:not([aria-current=true]) svg{fill:var(--fgColor-disabled,#818b98);color:var(--fgColor-disabled,#818b98)}@media (pointer:coarse){.prc-SegmentedControl-Button-E48xz:before{content:"";left:0;min-height:44px;position:absolute;right:0;top:50%;transform:translateY(-50%)}}.prc-SegmentedControl-IconButton-tlzDE{width:var(--segmented-control-icon-width,32px)}.prc-SegmentedControl-Content-1COlk{align-items:center;border-color:transparent;border-radius:calc(var(--segmented-control-outer-radius) - var(--segmented-control-button-bg-inset)/2);border-style:solid;border-width:var(--borderWidth-thin,.0625rem);display:flex;height:100%;justify-content:center;padding-left:calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));padding-right:calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset))}.prc-SegmentedControl-Button-E48xz[aria-current=true]{font-weight:var(--base-text-weight-semibold,600);padding:0}.prc-SegmentedControl-Button-E48xz[aria-current=true] .prc-SegmentedControl-Content-1COlk{background-color:var(--controlKnob-bgColor-rest,#fff);border-color:var(--controlKnob-borderColor-rest,#d1d9e0);border-radius:var(--segmented-control-outer-radius);padding-left:var(--segmented-control-button-inner-padding);padding-right:var(--segmented-control-button-inner-padding)}.prc-SegmentedControl-Button-E48xz:not([aria-current=true],[aria-disabled=true]):hover .prc-SegmentedControl-Content-1COlk{background-color:var(--controlTrack-bgColor-hover,#e0e6eb)}.prc-SegmentedControl-Button-E48xz:not([aria-current=true],[aria-disabled=true]):active .prc-SegmentedControl-Content-1COlk{background-color:var(--controlTrack-bgColor-active,#dae0e7)}.prc-SegmentedControl-Text-7S2y2:after{content:attr(data-text);display:block;font-weight:var(--base-text-weight-semibold,600);height:0;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none;visibility:hidden}.prc-SegmentedControl-LeadingIcon-74n5s{margin-right:var(--base-size-4,.25rem)}
-/*# sourceMappingURL=SegmentedControl-a004561f.css.map */
+.prc-SegmentedControl-SegmentedControl-lqIXp{--segmented-control-icon-width:32px;background-color:var(--controlTrack-bgColor-rest,#e6eaef);border:var(--borderWidth-thin,.0625rem) solid var(--controlTrack-borderColor-rest,transparent);border-radius:var(--borderRadius-medium,.375rem);display:inline-flex;font-size:var(--text-body-size-medium,.875rem);height:32px;margin:0;padding:0}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-narrow=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-narrow=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}@media (min-width:48rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}@media (min-width:87.5rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-wide=true]{display:flex;width:100%;--segmented-control-icon-width:100%}.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-regular=true]:not([data-full-width-wide=true]),.prc-SegmentedControl-SegmentedControl-lqIXp[data-full-width-wide=false]{display:inline-flex;width:auto;--segmented-control-icon-width:32px}}.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-narrow=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-narrow=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}@media (min-width:48rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-regular=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-regular=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}@media (min-width:87.5rem){.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-wide=dropdown],.prc-SegmentedControl-SegmentedControl-lqIXp[data-variant-wide=hideLabels] .prc-SegmentedControl-Text-7S2y2{display:none}}.prc-SegmentedControl-SegmentedControl-lqIXp:where([data-size=small]){font-size:var(--text-body-size-small,.75rem);height:28px}.prc-SegmentedControl-DropdownContainer-ZaPMn{display:none}.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant=dropdown]{display:block}@media (max-width:calc(48rem - 0.02px)){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-narrow=dropdown]{display:block}}@media (min-width:48rem){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-regular=dropdown]{display:block}}@media (min-width:87.5rem){.prc-SegmentedControl-DropdownContainer-ZaPMn[data-variant-wide=dropdown]{display:block}}.prc-SegmentedControl-Item-tSCQh{display:block;flex-grow:1;margin-bottom:-1px;margin-top:-1px;position:relative}.prc-SegmentedControl-Item-tSCQh:not(:last-child){margin-right:1px}.prc-SegmentedControl-Item-tSCQh:not(:last-child):after{background-color:var(--borderColor-default,#d1d9e0);bottom:var(--base-size-8,.5rem);content:"";position:absolute;right:calc(var(--base-size-2,.125rem)*-1);top:var(--base-size-8,.5rem);width:1px}.prc-SegmentedControl-Item-tSCQh:not(:last-child):has(+[data-selected]):after,.prc-SegmentedControl-Item-tSCQh:not(:last-child):where([data-selected]):after{background-color:transparent}.prc-SegmentedControl-Item-tSCQh:first-child{margin-left:-1px}.prc-SegmentedControl-Item-tSCQh:last-child{margin-right:-1px}.prc-SegmentedControl-Item-tSCQh .prc-SegmentedControl-Counter-GmZOI{align-items:center;display:flex;margin-inline-start:var(--base-size-8,.5rem)}.prc-SegmentedControl-Button-E48xz{--segmented-control-button-inner-padding:12px;--segmented-control-button-bg-inset:4px;--segmented-control-outer-radius:var(--borderRadius-medium,0.375rem);background-color:transparent;border-color:transparent;border-radius:var(--segmented-control-outer-radius);border-width:0;color:currentColor;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:var(--base-text-weight-normal,400);height:100%;padding:var(--segmented-control-button-bg-inset);width:100%}.prc-SegmentedControl-Button-E48xz svg{fill:var(--fgColor-muted,#59636e);color:var(--fgColor-muted,#59636e)}.prc-SegmentedControl-Button-E48xz:focus:not(:disabled){box-shadow:none;outline:var(--base-size-2,.125rem) solid var(--fgColor-accent,#0969da);outline-offset:-1px}.prc-SegmentedControl-Button-E48xz:focus:not(:disabled):not(:focus-visible){outline:1px solid transparent}.prc-SegmentedControl-Button-E48xz:focus-visible:not(:disabled){box-shadow:none;outline:var(--base-size-2,.125rem) solid var(--fgColor-accent,#0969da);outline-offset:-1px}.prc-SegmentedControl-Button-E48xz:focus:focus-visible:not(:last-child):after{width:0}.prc-SegmentedControl-Button-E48xz[aria-disabled=true]:not([aria-pressed=true]){background-color:transparent;color:var(--fgColor-disabled,#818b98);cursor:not-allowed}.prc-SegmentedControl-Button-E48xz[aria-disabled=true]:not([aria-pressed=true]) svg{fill:var(--fgColor-disabled,#818b98);color:var(--fgColor-disabled,#818b98)}@media (pointer:coarse){.prc-SegmentedControl-Button-E48xz:before{content:"";left:0;min-height:44px;position:absolute;right:0;top:50%;transform:translateY(-50%)}}.prc-SegmentedControl-IconButton-tlzDE{width:var(--segmented-control-icon-width,32px)}.prc-SegmentedControl-Content-1COlk{align-items:center;border-color:transparent;border-radius:calc(var(--segmented-control-outer-radius) - var(--segmented-control-button-bg-inset)/2);border-style:solid;border-width:var(--borderWidth-thin,.0625rem);display:flex;height:100%;justify-content:center;padding-left:calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));padding-right:calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset))}.prc-SegmentedControl-Button-E48xz[aria-pressed=true]{font-weight:var(--base-text-weight-semibold,600);padding:0}.prc-SegmentedControl-Button-E48xz[aria-pressed=true] .prc-SegmentedControl-Content-1COlk{background-color:var(--controlKnob-bgColor-rest,#fff);border-color:var(--controlKnob-borderColor-rest,#d1d9e0);border-radius:var(--segmented-control-outer-radius);padding-left:var(--segmented-control-button-inner-padding);padding-right:var(--segmented-control-button-inner-padding)}.prc-SegmentedControl-Button-E48xz:not([aria-pressed=true],[aria-disabled=true]):hover .prc-SegmentedControl-Content-1COlk{background-color:var(--controlTrack-bgColor-hover,#e0e6eb)}.prc-SegmentedControl-Button-E48xz:not([aria-pressed=true],[aria-disabled=true]):active .prc-SegmentedControl-Content-1COlk{background-color:var(--controlTrack-bgColor-active,#dae0e7)}.prc-SegmentedControl-Text-7S2y2:after{content:attr(data-text);display:block;font-weight:var(--base-text-weight-semibold,600);height:0;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none;visibility:hidden}.prc-SegmentedControl-LeadingIcon-74n5s{margin-right:var(--base-size-4,.25rem)}
+/*# sourceMappingURL=SegmentedControl-de65527b.css.map */

package/dist/SegmentedControl/{SegmentedControl-a004561f.css.map → SegmentedControl-de65527b.css.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/SegmentedControl/SegmentedControl.module.css.js"],"names":[],"mappings":"AAAA,6CAEE,mCAAoC,CASpC,yDAAkD,CAClD,8FAAuF,CACvF,gDAAyC,CATzC,mBAAoB,CAMpB,8CAAuC,CAHvC,WAAY,CAEZ,QAAS,CADT,SA0HF,CAlHE,mEACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,oEACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CAEA,wCACE,0EACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,2EACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAEA,yBACE,2EACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,4EACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAEA,2BACE,wEACE,YAAa,CACb,UAAW,CAEX,mCACF,CASA,qLACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAQA,2KACE,YACF,CAEA,wCAKE,yLACE,YACF,CACF,CAEA,yBAKE,2LACE,YACF,CACF,CAEA,2BAKE,qLACE,YACF,CACF,CAEA,sEAGE,4CAAsC,CADtC,WAEF,CAGF,8CACE,YAwBF,CArBE,qEACE,aACF,CAEA,wCACE,4EACE,aACF,CACF,CAEA,yBACE,6EACE,aACF,CACF,CAEA,2BACE,0EACE,aACF,CACF,CAGF,iCAEE,aAAc,CAKd,WAAY,CADZ,kBAAmB,CAFnB,eAAgB,CAHhB,iBA6CF,CArCE,kDAEE,gBAkBF,CAhBE,wDAQE,mDAA4C,CAJ5C,+BAA0B,CAE1B,UAAW,CALX,iBAAkB,CAElB,yCAAoC,CADpC,4BAAuB,CAGvB,SAIF,CAGA,6JAEE,4BACF,CAGF,6CAEE,gBACF,CAEA,4CAEE,iBACF,CAEA,qEAGE,kBAAmB,CADnB,YAAa,CADb,4CAGF,CAGF,mCAEE,6CAA8C,CAC9C,uCAAwC,CACxC,oEAA4D,CAW5D,4BAA6B,CAC7B,wBAAyB,CAGzB,mDAAoD,CAFpD,cAAe,CAJf,kBAAmB,CACnB,cAAe,CAJf,mBAAoB,CACpB,iBAAkB,CAClB,8CAA2C,CAL3C,WAAY,CAEZ,gDAAiD,CAHjD,UAmEF,CApDE,uCACE,iCAA0B,CAC1B,kCACF,CAGA,wDAGE,eAAgB,CAFhB,sEAAuD,CACvD,mBAOF,CAHE,4EACE,6BACF,CAIF,gEAGE,eAAgB,CAFhB,sEAAuD,CACvD,mBAEF,CAGA,8EAEE,OACF,CAEA,gFAGE,4BAA6B,CAD7B,qCAA8B,CAD9B,kBAQF,CAJE,oFACE,oCAA6B,CAC7B,qCACF,CAGF,wBACE,0CAME,UAAW,CAFX,MAAO,CACP,eAAgB,CAJhB,iBAAkB,CAElB,OAAQ,CADR,OAAQ,CAKR,0BACF,CACF,CAGF,uCACE,8CACF,CAEA,oCAiBE,kBAAmB,CAVnB,wBAAyB,CASzB,sGAAyG,CARzG,kBAAmB,CACnB,6CAAqC,CARrC,YAAa,CACb,WAAY,CAgBZ,sBAAuB,CAZvB,2GAA4G,CAF5G,4GAeF,CAEA,sDAEE,gDAA6C,CAD7C,SAaF,CAVE,0FAKE,qDAAiD,CACjD,wDAAiD,CAEjD,mDAAoD,CAJpD,0DAA2D,CAF3D,2DAOF,CAIA,2HACE,0DACF,CAEA,4HACE,2DACF,CAGF,uCAOE,uBAAwB,CANxB,aAAc,CAGd,gDAA6C,CAF7C,QAAS,CACT,eAAgB,CAEhB,mBAAoB,CAGpB,wBAAiB,CAAjB,gBAAiB,CAFjB,iBAGF,CAEA,wCACE,sCACF","file":"SegmentedControl-a004561f.css","sourcesContent":[".SegmentedControl {\n  /* TODO: use primitive `control.medium.size` when it is available instead of '32px' */\n  --segmented-control-icon-width: 32px;\n\n  display: inline-flex;\n\n  /* TODO: use primitive `control.{small|medium}.size` when it is available */\n  height: 32px;\n  padding: 0;\n  margin: 0;\n  font-size: var(--text-body-size-medium);\n  background-color: var(--controlTrack-bgColor-rest);\n  border: var(--borderWidth-thin) solid var(--controlTrack-borderColor-rest, transparent);\n  border-radius: var(--borderRadius-medium);\n\n  /* Responsive full-width */\n  &[data-full-width='true'] {\n    display: flex;\n    width: 100%;\n\n    --segmented-control-icon-width: 100%;\n  }\n\n  &[data-full-width='false'] {\n    display: inline-flex;\n    width: auto;\n\n    --segmented-control-icon-width: 32px;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-full-width-narrow='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-narrow='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-full-width-regular='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-regular='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-full-width-wide='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-wide='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n\n    &[data-full-width-regular='true']:not([data-full-width-wide='true']) {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  /* Hide when dropdown variant is active */\n  &[data-variant='dropdown'] {\n    display: none;\n  }\n\n  /* Handle hideLabels variant - hide button text */\n  &[data-variant='hideLabels'] .Text {\n    display: none;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-variant-narrow='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-narrow='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-variant-regular='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-regular='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-variant-wide='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-wide='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  &:where([data-size='small']) {\n    /* TODO: use primitive `control.{small|medium}.size` when it is available */\n    height: 28px;\n    font-size: var(--text-body-size-small);\n  }\n}\n\n.DropdownContainer {\n  display: none;\n\n  /* Show when dropdown variant is active */\n  &[data-variant='dropdown'] {\n    display: block;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-variant-narrow='dropdown'] {\n      display: block;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-variant-regular='dropdown'] {\n      display: block;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-variant-wide='dropdown'] {\n      display: block;\n    }\n  }\n}\n\n.Item {\n  position: relative;\n  display: block;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-top: -1px;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-bottom: -1px;\n  flex-grow: 1;\n\n  &:not(:last-child) {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-right: 1px;\n\n    &::after {\n      position: absolute;\n      top: var(--base-size-8);\n      right: calc(-1 * var(--base-size-2));\n      bottom: var(--base-size-8);\n      width: 1px;\n      content: '';\n      /* stylelint-disable-next-line primer/colors */\n      background-color: var(--borderColor-default);\n    }\n\n    /* stylelint-disable-next-line selector-pseudo-class-disallowed-list -- scoped to CSS Module, audited (github/github-ui#17224) */\n    &:has(+ [data-selected])::after,\n    &:where([data-selected])::after {\n      background-color: transparent;\n    }\n  }\n\n  &:first-child {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-left: -1px;\n  }\n\n  &:last-child {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-right: -1px;\n  }\n\n  .Counter {\n    margin-inline-start: var(--base-size-8);\n    display: flex;\n    align-items: center;\n  }\n}\n\n.Button {\n  /* TODO: use primitive `primer.control.medium.paddingInline.normal` when it is available */\n  --segmented-control-button-inner-padding: 12px;\n  --segmented-control-button-bg-inset: 4px;\n  --segmented-control-outer-radius: var(--borderRadius-medium);\n\n  width: 100%;\n  height: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  padding: var(--segmented-control-button-bg-inset);\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: var(--base-text-weight-normal);\n  color: currentColor;\n  cursor: pointer;\n  background-color: transparent;\n  border-color: transparent;\n  border-width: 0;\n  /* stylelint-disable-next-line primer/borders */\n  border-radius: var(--segmented-control-outer-radius);\n\n  & svg {\n    fill: var(--fgColor-muted);\n    color: var(--fgColor-muted);\n  }\n\n  /* fallback :focus state */\n  &:focus:not(:disabled) {\n    outline: var(--base-size-2) solid var(--fgColor-accent);\n    outline-offset: -1px;\n    box-shadow: none;\n\n    /* remove fallback :focus if :focus-visible is supported */\n    &:not(:focus-visible) {\n      outline: solid 1px transparent;\n    }\n  }\n\n  /* default focus state */\n  &:focus-visible:not(:disabled) {\n    outline: var(--base-size-2) solid var(--fgColor-accent);\n    outline-offset: -1px;\n    box-shadow: none;\n  }\n\n  /* stylelint-disable-next-line selector-max-specificity */\n  &:focus:focus-visible:not(:last-child)::after {\n    /* fixes an issue where the focus outline shows over the pseudo-element */\n    width: 0;\n  }\n\n  &[aria-disabled='true']:not([aria-current='true']) {\n    cursor: not-allowed;\n    color: var(--fgColor-disabled);\n    background-color: transparent;\n\n    & svg {\n      fill: var(--fgColor-disabled);\n      color: var(--fgColor-disabled);\n    }\n  }\n\n  @media (pointer: coarse) {\n    &::before {\n      position: absolute;\n      top: 50%;\n      right: 0;\n      left: 0;\n      min-height: 44px;\n      content: '';\n      transform: translateY(-50%);\n    }\n  }\n}\n\n.IconButton {\n  width: var(--segmented-control-icon-width, 32px);\n}\n\n.Content {\n  display: flex;\n  height: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  padding-right: calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));\n  /* stylelint-disable-next-line primer/spacing */\n  padding-left: calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));\n  border-color: transparent;\n  border-style: solid;\n  border-width: var(--borderWidth-thin);\n\n  /*\n    innerRadius = outerRadius - distance/2\n    https://stackoverflow.com/questions/2932146/math-problem-determine-the-corner-radius-of-an-inner-border-based-on-outer-corn\n  */\n  /* stylelint-disable-next-line primer/borders */\n  border-radius: calc(var(--segmented-control-outer-radius) - var(--segmented-control-button-bg-inset) / 2);\n  align-items: center;\n  justify-content: center;\n}\n\n.Button[aria-current='true'] {\n  padding: 0;\n  font-weight: var(--base-text-weight-semibold);\n\n  .Content {\n    /* stylelint-disable-next-line primer/spacing */\n    padding-right: var(--segmented-control-button-inner-padding);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-left: var(--segmented-control-button-inner-padding);\n    background-color: var(--controlKnob-bgColor-rest);\n    border-color: var(--controlKnob-borderColor-rest);\n    /* stylelint-disable-next-line primer/borders */\n    border-radius: var(--segmented-control-outer-radius);\n  }\n}\n\n.Button:not([aria-current='true'], [aria-disabled='true']) {\n  &:hover .Content {\n    background-color: var(--controlTrack-bgColor-hover);\n  }\n\n  &:active .Content {\n    background-color: var(--controlTrack-bgColor-active);\n  }\n}\n\n.Text::after {\n  display: block;\n  height: 0;\n  overflow: hidden;\n  font-weight: var(--base-text-weight-semibold);\n  pointer-events: none;\n  visibility: hidden;\n  content: attr(data-text);\n  user-select: none;\n}\n\n.LeadingIcon {\n  margin-right: var(--base-size-4);\n}\n"]}
+{"version":3,"sources":["../src/SegmentedControl/SegmentedControl.module.css.js"],"names":[],"mappings":"AAAA,6CAEE,mCAAoC,CASpC,yDAAkD,CAClD,8FAAuF,CACvF,gDAAyC,CATzC,mBAAoB,CAMpB,8CAAuC,CAHvC,WAAY,CAEZ,QAAS,CADT,SA0HF,CAlHE,mEACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,oEACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CAEA,wCACE,0EACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,2EACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAEA,yBACE,2EACE,YAAa,CACb,UAAW,CAEX,mCACF,CAEA,4EACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAEA,2BACE,wEACE,YAAa,CACb,UAAW,CAEX,mCACF,CASA,qLACE,mBAAoB,CACpB,UAAW,CAEX,mCACF,CACF,CAQA,2KACE,YACF,CAEA,wCAKE,yLACE,YACF,CACF,CAEA,yBAKE,2LACE,YACF,CACF,CAEA,2BAKE,qLACE,YACF,CACF,CAEA,sEAGE,4CAAsC,CADtC,WAEF,CAGF,8CACE,YAwBF,CArBE,qEACE,aACF,CAEA,wCACE,4EACE,aACF,CACF,CAEA,yBACE,6EACE,aACF,CACF,CAEA,2BACE,0EACE,aACF,CACF,CAGF,iCAEE,aAAc,CAKd,WAAY,CADZ,kBAAmB,CAFnB,eAAgB,CAHhB,iBA6CF,CArCE,kDAEE,gBAkBF,CAhBE,wDAQE,mDAA4C,CAJ5C,+BAA0B,CAE1B,UAAW,CALX,iBAAkB,CAElB,yCAAoC,CADpC,4BAAuB,CAGvB,SAIF,CAGA,6JAEE,4BACF,CAGF,6CAEE,gBACF,CAEA,4CAEE,iBACF,CAEA,qEAGE,kBAAmB,CADnB,YAAa,CADb,4CAGF,CAGF,mCAEE,6CAA8C,CAC9C,uCAAwC,CACxC,oEAA4D,CAW5D,4BAA6B,CAC7B,wBAAyB,CAGzB,mDAAoD,CAFpD,cAAe,CAJf,kBAAmB,CACnB,cAAe,CAJf,mBAAoB,CACpB,iBAAkB,CAClB,8CAA2C,CAL3C,WAAY,CAEZ,gDAAiD,CAHjD,UAmEF,CApDE,uCACE,iCAA0B,CAC1B,kCACF,CAGA,wDAGE,eAAgB,CAFhB,sEAAuD,CACvD,mBAOF,CAHE,4EACE,6BACF,CAIF,gEAGE,eAAgB,CAFhB,sEAAuD,CACvD,mBAEF,CAGA,8EAEE,OACF,CAEA,gFAGE,4BAA6B,CAD7B,qCAA8B,CAD9B,kBAQF,CAJE,oFACE,oCAA6B,CAC7B,qCACF,CAGF,wBACE,0CAME,UAAW,CAFX,MAAO,CACP,eAAgB,CAJhB,iBAAkB,CAElB,OAAQ,CADR,OAAQ,CAKR,0BACF,CACF,CAGF,uCACE,8CACF,CAEA,oCAiBE,kBAAmB,CAVnB,wBAAyB,CASzB,sGAAyG,CARzG,kBAAmB,CACnB,6CAAqC,CARrC,YAAa,CACb,WAAY,CAgBZ,sBAAuB,CAZvB,2GAA4G,CAF5G,4GAeF,CAEA,sDAEE,gDAA6C,CAD7C,SAaF,CAVE,0FAKE,qDAAiD,CACjD,wDAAiD,CAEjD,mDAAoD,CAJpD,0DAA2D,CAF3D,2DAOF,CAIA,2HACE,0DACF,CAEA,4HACE,2DACF,CAGF,uCAOE,uBAAwB,CANxB,aAAc,CAGd,gDAA6C,CAF7C,QAAS,CACT,eAAgB,CAEhB,mBAAoB,CAGpB,wBAAiB,CAAjB,gBAAiB,CAFjB,iBAGF,CAEA,wCACE,sCACF","file":"SegmentedControl-de65527b.css","sourcesContent":[".SegmentedControl {\n  /* TODO: use primitive `control.medium.size` when it is available instead of '32px' */\n  --segmented-control-icon-width: 32px;\n\n  display: inline-flex;\n\n  /* TODO: use primitive `control.{small|medium}.size` when it is available */\n  height: 32px;\n  padding: 0;\n  margin: 0;\n  font-size: var(--text-body-size-medium);\n  background-color: var(--controlTrack-bgColor-rest);\n  border: var(--borderWidth-thin) solid var(--controlTrack-borderColor-rest, transparent);\n  border-radius: var(--borderRadius-medium);\n\n  /* Responsive full-width */\n  &[data-full-width='true'] {\n    display: flex;\n    width: 100%;\n\n    --segmented-control-icon-width: 100%;\n  }\n\n  &[data-full-width='false'] {\n    display: inline-flex;\n    width: auto;\n\n    --segmented-control-icon-width: 32px;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-full-width-narrow='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-narrow='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-full-width-regular='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-regular='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-full-width-wide='true'] {\n      display: flex;\n      width: 100%;\n\n      --segmented-control-icon-width: 100%;\n    }\n\n    &[data-full-width-wide='false'] {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n\n    &[data-full-width-regular='true']:not([data-full-width-wide='true']) {\n      display: inline-flex;\n      width: auto;\n\n      --segmented-control-icon-width: 32px;\n    }\n  }\n\n  /* Hide when dropdown variant is active */\n  &[data-variant='dropdown'] {\n    display: none;\n  }\n\n  /* Handle hideLabels variant - hide button text */\n  &[data-variant='hideLabels'] .Text {\n    display: none;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-variant-narrow='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-narrow='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-variant-regular='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-regular='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-variant-wide='dropdown'] {\n      display: none;\n    }\n\n    &[data-variant-wide='hideLabels'] .Text {\n      display: none;\n    }\n  }\n\n  &:where([data-size='small']) {\n    /* TODO: use primitive `control.{small|medium}.size` when it is available */\n    height: 28px;\n    font-size: var(--text-body-size-small);\n  }\n}\n\n.DropdownContainer {\n  display: none;\n\n  /* Show when dropdown variant is active */\n  &[data-variant='dropdown'] {\n    display: block;\n  }\n\n  @media (--viewportRange-narrow) {\n    &[data-variant-narrow='dropdown'] {\n      display: block;\n    }\n  }\n\n  @media (--viewportRange-regular) {\n    &[data-variant-regular='dropdown'] {\n      display: block;\n    }\n  }\n\n  @media (--viewportRange-wide) {\n    &[data-variant-wide='dropdown'] {\n      display: block;\n    }\n  }\n}\n\n.Item {\n  position: relative;\n  display: block;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-top: -1px;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-bottom: -1px;\n  flex-grow: 1;\n\n  &:not(:last-child) {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-right: 1px;\n\n    &::after {\n      position: absolute;\n      top: var(--base-size-8);\n      right: calc(-1 * var(--base-size-2));\n      bottom: var(--base-size-8);\n      width: 1px;\n      content: '';\n      /* stylelint-disable-next-line primer/colors */\n      background-color: var(--borderColor-default);\n    }\n\n    /* stylelint-disable-next-line selector-pseudo-class-disallowed-list -- scoped to CSS Module, audited (github/github-ui#17224) */\n    &:has(+ [data-selected])::after,\n    &:where([data-selected])::after {\n      background-color: transparent;\n    }\n  }\n\n  &:first-child {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-left: -1px;\n  }\n\n  &:last-child {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-right: -1px;\n  }\n\n  .Counter {\n    margin-inline-start: var(--base-size-8);\n    display: flex;\n    align-items: center;\n  }\n}\n\n.Button {\n  /* TODO: use primitive `primer.control.medium.paddingInline.normal` when it is available */\n  --segmented-control-button-inner-padding: 12px;\n  --segmented-control-button-bg-inset: 4px;\n  --segmented-control-outer-radius: var(--borderRadius-medium);\n\n  width: 100%;\n  height: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  padding: var(--segmented-control-button-bg-inset);\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: var(--base-text-weight-normal);\n  color: currentColor;\n  cursor: pointer;\n  background-color: transparent;\n  border-color: transparent;\n  border-width: 0;\n  /* stylelint-disable-next-line primer/borders */\n  border-radius: var(--segmented-control-outer-radius);\n\n  & svg {\n    fill: var(--fgColor-muted);\n    color: var(--fgColor-muted);\n  }\n\n  /* fallback :focus state */\n  &:focus:not(:disabled) {\n    outline: var(--base-size-2) solid var(--fgColor-accent);\n    outline-offset: -1px;\n    box-shadow: none;\n\n    /* remove fallback :focus if :focus-visible is supported */\n    &:not(:focus-visible) {\n      outline: solid 1px transparent;\n    }\n  }\n\n  /* default focus state */\n  &:focus-visible:not(:disabled) {\n    outline: var(--base-size-2) solid var(--fgColor-accent);\n    outline-offset: -1px;\n    box-shadow: none;\n  }\n\n  /* stylelint-disable-next-line selector-max-specificity */\n  &:focus:focus-visible:not(:last-child)::after {\n    /* fixes an issue where the focus outline shows over the pseudo-element */\n    width: 0;\n  }\n\n  &[aria-disabled='true']:not([aria-pressed='true']) {\n    cursor: not-allowed;\n    color: var(--fgColor-disabled);\n    background-color: transparent;\n\n    & svg {\n      fill: var(--fgColor-disabled);\n      color: var(--fgColor-disabled);\n    }\n  }\n\n  @media (pointer: coarse) {\n    &::before {\n      position: absolute;\n      top: 50%;\n      right: 0;\n      left: 0;\n      min-height: 44px;\n      content: '';\n      transform: translateY(-50%);\n    }\n  }\n}\n\n.IconButton {\n  width: var(--segmented-control-icon-width, 32px);\n}\n\n.Content {\n  display: flex;\n  height: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  padding-right: calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));\n  /* stylelint-disable-next-line primer/spacing */\n  padding-left: calc(var(--segmented-control-button-inner-padding) - var(--segmented-control-button-bg-inset));\n  border-color: transparent;\n  border-style: solid;\n  border-width: var(--borderWidth-thin);\n\n  /*\n    innerRadius = outerRadius - distance/2\n    https://stackoverflow.com/questions/2932146/math-problem-determine-the-corner-radius-of-an-inner-border-based-on-outer-corn\n  */\n  /* stylelint-disable-next-line primer/borders */\n  border-radius: calc(var(--segmented-control-outer-radius) - var(--segmented-control-button-bg-inset) / 2);\n  align-items: center;\n  justify-content: center;\n}\n\n.Button[aria-pressed='true'] {\n  padding: 0;\n  font-weight: var(--base-text-weight-semibold);\n\n  .Content {\n    /* stylelint-disable-next-line primer/spacing */\n    padding-right: var(--segmented-control-button-inner-padding);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-left: var(--segmented-control-button-inner-padding);\n    background-color: var(--controlKnob-bgColor-rest);\n    border-color: var(--controlKnob-borderColor-rest);\n    /* stylelint-disable-next-line primer/borders */\n    border-radius: var(--segmented-control-outer-radius);\n  }\n}\n\n.Button:not([aria-pressed='true'], [aria-disabled='true']) {\n  &:hover .Content {\n    background-color: var(--controlTrack-bgColor-hover);\n  }\n\n  &:active .Content {\n    background-color: var(--controlTrack-bgColor-active);\n  }\n}\n\n.Text::after {\n  display: block;\n  height: 0;\n  overflow: hidden;\n  font-weight: var(--base-text-weight-semibold);\n  pointer-events: none;\n  visibility: hidden;\n  content: attr(data-text);\n  user-select: none;\n}\n\n.LeadingIcon {\n  margin-right: var(--base-size-4);\n}\n"]}

package/dist/SegmentedControl/SegmentedControl.module.css.js

@@ -1,4 +1,4 @@
-import "./SegmentedControl-a004561f.css";
+import "./SegmentedControl-de65527b.css";
 //#region src/SegmentedControl/SegmentedControl.module.css.js
 var SegmentedControl_module_css_default = {
 	"SegmentedControl": "prc-SegmentedControl-SegmentedControl-lqIXp",

package/dist/SegmentedControl/SegmentedControlButton.js

@@ -126,7 +126,7 @@ const SegmentedControlButton = (t0) => {
 	let t11;
 	if ($[27] !== rest || $[28] !== selected || $[29] !== t10 || $[30] !== t3 || $[31] !== t4) {
 		t11 = /*#__PURE__*/ jsx("button", {
-			"aria-current": selected,
+			"aria-pressed": selected,
 			"aria-disabled": t3,
 			className: t4,
 			type: "button",

package/dist/SegmentedControl/SegmentedControlIconButton.js

@@ -87,7 +87,7 @@ const SegmentedControlIconButton = (t0) => {
 	if ($[20] !== rest || $[21] !== selected || $[22] !== t10 || $[23] !== t5 || $[24] !== t6) {
 		t11 = /*#__PURE__*/ jsx("button", {
 			type: "button",
-			"aria-current": selected,
+			"aria-pressed": selected,
 			"aria-label": t5,
 			"aria-disabled": t6,
 			className: t7,

package/dist/SelectPanel/SelectPanel.js

@@ -2,13 +2,13 @@ import { useProvidedRefOrCreate } from "../hooks/useProvidedRefOrCreate.js";
 import { useProvidedStateOrCreate } from "../hooks/useProvidedStateOrCreate.js";
 import { isAlphabetKey } from "../hooks/useMnemonics.js";
 import { useId as useId$1 } from "../hooks/useId.js";
+import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
 import useSafeTimeout from "../hooks/useSafeTimeout.js";
 import { IconButton } from "../Button/IconButton.js";
 import { LinkButton } from "../Button/LinkButton.js";
 import { ButtonComponent } from "../Button/Button.js";
 import { useResponsiveValue } from "../hooks/useResponsiveValue.js";
 import Heading from "../Heading/Heading.js";
-import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
 import { AnchoredOverlay } from "../AnchoredOverlay/AnchoredOverlay.js";
 import { Banner } from "../Banner/index.js";
 import { useFormControlContext } from "../FormControl/_FormControlContext.js";