@primer/react 38.40.2-rc.fdfbe71e5 → 38.41.0-rc.61d283273

package/dist/experimental/SelectPanel2/SelectPanel.js

@@ -141,7 +141,7 @@ const Panel = ({ title, description, variant: propsVariant, selectionVariant = "
 	let maxHeightValue = heightMap[maxHeight];
 	if (currentVariant === "bottom-sheet") maxHeightValue = "calc(100vh - 64px)";
 	else if (currentVariant === "full-screen") maxHeightValue = "100vh";
-	return /*#__PURE__*/ jsxs(Fragment$1, { children: [Anchor, /*#__PURE__*/ jsx(BaseOverlay, {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [Anchor, /* @__PURE__ */ jsx(BaseOverlay, {
 		as: "dialog",
 		ref: dialogRef,
 		"aria-labelledby": `${panelId}--title`,
@@ -162,7 +162,7 @@ const Panel = ({ title, description, variant: propsVariant, selectionVariant = "
 		onClick: (event) => {
 			if (event.target === event.currentTarget) onClickOutside();
 		},
-		children: internalOpen && /*#__PURE__*/ jsx(Fragment$1, { children: /*#__PURE__*/ jsx(SelectPanelContext.Provider, {
+		children: internalOpen && /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(SelectPanelContext.Provider, {
 			value: {
 				panelId,
 				title,
@@ -174,15 +174,15 @@ const Panel = ({ title, description, variant: propsVariant, selectionVariant = "
 				selectionVariant,
 				moveFocusToList
 			},
-			children: /*#__PURE__*/ jsxs("form", {
+			children: /* @__PURE__ */ jsxs("form", {
 				method: "dialog",
 				onSubmit: onInternalSubmit,
 				className: SelectPanel_module_css_default.Form,
 				children: [
-					(_slots$header = slots.header) !== null && _slots$header !== void 0 ? _slots$header : /*#__PURE__*/ jsx(SelectPanelHeader, {}),
-					/*#__PURE__*/ jsx("div", {
+					(_slots$header = slots.header) !== null && _slots$header !== void 0 ? _slots$header : /* @__PURE__ */ jsx(SelectPanelHeader, {}),
+					/* @__PURE__ */ jsx("div", {
 						className: SelectPanel_module_css_default.Container,
-						children: /*#__PURE__*/ jsx(ActionListContainerContext.Provider, {
+						children: /* @__PURE__ */ jsx(ActionListContainerContext.Provider, {
 							value: {
 								container: "SelectPanel",
 								listRole: "listbox",
@@ -208,12 +208,12 @@ const SelectPanelButton = /*#__PURE__*/ React.forwardRef((props, anchorRef) => {
 		const label = document.querySelector(`[for='${inputProps.id}']`);
 		if (label !== null && label !== void 0 && label.textContent) setLabelText(label.textContent);
 	}, [inputProps.id]);
-	if (labelText) return /*#__PURE__*/ jsx(ButtonComponent, {
+	if (labelText) return /* @__PURE__ */ jsx(ButtonComponent, {
 		ref: anchorRef,
 		"aria-label": `${anchorRef.current.textContent}, ${labelText}`,
 		...inputProps
 	});
-	else return /*#__PURE__*/ jsx(ButtonComponent, {
+	else return /* @__PURE__ */ jsx(ButtonComponent, {
 		ref: anchorRef,
 		...props
 	});
@@ -222,44 +222,44 @@ SelectPanelButton.__SLOT__ = Symbol("SelectPanel.Button");
 const SelectPanelHeader = ({ children, onBack, className, ...props }) => {
 	const [slots, childrenWithoutSlots] = useSlots(children, { searchInput: SelectPanelSearchInput });
 	const { title, description, panelId, onCancel, onClearSelection } = React.useContext(SelectPanelContext);
-	return /*#__PURE__*/ jsxs("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		className: clsx(SelectPanel_module_css_default.Header, className),
 		...props,
 		children: [
-			/*#__PURE__*/ jsxs("div", {
+			/* @__PURE__ */ jsxs("div", {
 				className: SelectPanel_module_css_default.HeaderContent,
 				"data-description": description ? true : void 0,
 				"data-search-input": slots.searchInput ? true : void 0,
-				children: [/*#__PURE__*/ jsxs("div", {
+				children: [/* @__PURE__ */ jsxs("div", {
 					className: SelectPanel_module_css_default.FlexBox,
-					children: [onBack ? /*#__PURE__*/ jsx(IconButton, {
+					children: [onBack ? /* @__PURE__ */ jsx(IconButton, {
 						type: "button",
 						variant: "invisible",
 						icon: ArrowLeftIcon,
 						"aria-label": "Back",
 						onClick: () => onBack()
-					}) : null, /*#__PURE__*/ jsxs("div", {
+					}) : null, /* @__PURE__ */ jsxs("div", {
 						className: SelectPanel_module_css_default.TitleWrapper,
 						"data-description": description ? true : void 0,
 						"data-on-back": onBack ? true : void 0,
-						children: [/*#__PURE__*/ jsx(Heading, {
+						children: [/* @__PURE__ */ jsx(Heading, {
 							as: "h1",
 							id: `${panelId}--title`,
 							className: SelectPanel_module_css_default.Title,
 							children: title
-						}), description ? /*#__PURE__*/ jsx("span", {
+						}), description ? /* @__PURE__ */ jsx("span", {
 							id: `${panelId}--description`,
 							className: SelectPanel_module_css_default.Description,
 							children: description
 						}) : null]
 					})]
-				}), /*#__PURE__*/ jsxs("div", { children: [onClearSelection ? /*#__PURE__*/ jsx(IconButton, {
+				}), /* @__PURE__ */ jsxs("div", { children: [onClearSelection ? /* @__PURE__ */ jsx(IconButton, {
 					type: "button",
 					variant: "invisible",
 					icon: FilterRemoveIcon,
 					"aria-label": "Clear selection",
 					onClick: onClearSelection
-				}) : null, /*#__PURE__*/ jsx(IconButton, {
+				}) : null, /* @__PURE__ */ jsx(IconButton, {
 					type: "button",
 					variant: "invisible",
 					icon: XIcon,
@@ -272,7 +272,6 @@ const SelectPanelHeader = ({ children, onBack, className, ...props }) => {
 		]
 	});
 };
-SelectPanelHeader.displayName = "SelectPanelHeader";
 SelectPanelHeader.__SLOT__ = Symbol("SelectPanel.Header");
 const SelectPanelSearchInput = ({ onChange: propsOnChange, onKeyDown: propsOnKeyDown, className, ...props }) => {
 	const inputRef = /*#__PURE__*/ React.createRef();
@@ -288,12 +287,12 @@ const SelectPanelSearchInput = ({ onChange: propsOnChange, onKeyDown: propsOnKey
 		}
 		if (typeof propsOnKeyDown === "function") propsOnKeyDown(event);
 	};
-	return /*#__PURE__*/ jsx(TextInput_default, {
+	return /* @__PURE__ */ jsx(TextInput_default, {
 		ref: inputRef,
 		block: true,
 		leadingVisual: SearchIcon,
 		placeholder: "Search",
-		trailingAction: /*#__PURE__*/ jsx(TextInput_default.Action, {
+		trailingAction: /* @__PURE__ */ jsx(TextInput_default.Action, {
 			icon: XCircleFillIcon,
 			"aria-label": "Clear",
 			tooltipDirection: "w",
@@ -312,7 +311,6 @@ const SelectPanelSearchInput = ({ onChange: propsOnChange, onKeyDown: propsOnKey
 		...props
 	});
 };
-SelectPanelSearchInput.displayName = "SelectPanelSearchInput";
 SelectPanelSearchInput.__SLOT__ = Symbol("SelectPanel.SearchInput");
 const FooterContext = /*#__PURE__*/ React.createContext(false);
 const SelectPanelFooter = ({ ...props }) => {
@@ -320,23 +318,23 @@ const SelectPanelFooter = ({ ...props }) => {
 	const hidePrimaryActions = selectionVariant === "instant";
 	const buttonSize = useResponsiveValue(responsiveButtonSizes, "small");
 	if (hidePrimaryActions && !props.children) return null;
-	return /*#__PURE__*/ jsx(FooterContext.Provider, {
+	return /* @__PURE__ */ jsx(FooterContext.Provider, {
 		value: true,
-		children: /*#__PURE__*/ jsxs("div", {
+		children: /* @__PURE__ */ jsxs("div", {
 			className: SelectPanel_module_css_default.Footer,
 			"data-hide-primary-actions": hidePrimaryActions || void 0,
-			children: [/*#__PURE__*/ jsx("div", {
+			children: [/* @__PURE__ */ jsx("div", {
 				className: SelectPanel_module_css_default.FooterContent,
 				"data-hide-primary-actions": hidePrimaryActions || void 0,
 				children: props.children
-			}), hidePrimaryActions ? null : /*#__PURE__*/ jsxs("div", {
+			}), hidePrimaryActions ? null : /* @__PURE__ */ jsxs("div", {
 				className: SelectPanel_module_css_default.FooterActions,
-				children: [/*#__PURE__*/ jsx(ButtonComponent, {
+				children: [/* @__PURE__ */ jsx(ButtonComponent, {
 					type: "button",
 					size: buttonSize,
 					onClick: () => onCancel(),
 					children: "Cancel"
-				}), /*#__PURE__*/ jsx(ButtonComponent, {
+				}), /* @__PURE__ */ jsx(ButtonComponent, {
 					type: "submit",
 					size: buttonSize,
 					variant: "primary",
@@ -346,21 +344,19 @@ const SelectPanelFooter = ({ ...props }) => {
 		})
 	});
 };
-SelectPanelFooter.displayName = "SelectPanelFooter";
 SelectPanelFooter.__SLOT__ = Symbol("SelectPanel.Footer");
 const SecondaryButton = (props) => {
 	const size = useResponsiveValue(responsiveButtonSizes, "small");
-	return /*#__PURE__*/ jsx(ButtonComponent, {
+	return /* @__PURE__ */ jsx(ButtonComponent, {
 		type: "button",
 		size,
 		block: true,
 		...props
 	});
 };
-SecondaryButton.displayName = "SecondaryButton";
 const SecondaryLink = ({ className, ...props }) => {
 	const size = useResponsiveValue(responsiveButtonSizes, "small");
-	return /*#__PURE__*/ jsx(ButtonComponent, {
+	return /* @__PURE__ */ jsx(ButtonComponent, {
 		as: Link,
 		size,
 		variant: "invisible",
@@ -370,68 +366,65 @@ const SecondaryLink = ({ className, ...props }) => {
 		children: props.children
 	});
 };
-SecondaryLink.displayName = "SecondaryLink";
 const SecondaryCheckbox = ({ id, children, className, ...props }) => {
 	const checkboxId = useId$1(id);
 	const { selectionVariant } = React.useContext(SelectPanelContext);
 	selectionVariant === "instant" && invariant(false, "Sorry! SelectPanel.SecondaryAction with variant=\"checkbox\" is not allowed inside selectionVariant=\"instant\"");
-	return /*#__PURE__*/ jsxs("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		className: SelectPanel_module_css_default.SecondaryCheckbox,
-		children: [/*#__PURE__*/ jsx(Checkbox, {
+		children: [/* @__PURE__ */ jsx(Checkbox, {
 			id: checkboxId,
 			className: clsx(SelectPanel_module_css_default.Checkbox, className),
 			...props
-		}), /*#__PURE__*/ jsx(InputLabel, {
+		}), /* @__PURE__ */ jsx(InputLabel, {
 			htmlFor: checkboxId,
 			className: SelectPanel_module_css_default.SmallText,
 			children
 		})]
 	});
 };
-SecondaryCheckbox.displayName = "SecondaryCheckbox";
 const SelectPanelSecondaryAction = ({ variant, ...props }) => {
 	!React.useContext(FooterContext) && invariant(false, "SelectPanel.SecondaryAction is only allowed inside SelectPanel.Footer");
-	if (variant === "button") return /*#__PURE__*/ jsx(SecondaryButton, { ...props });
-	else if (variant === "link") return /*#__PURE__*/ jsx(SecondaryLink, { ...props });
-	else if (variant === "checkbox") return /*#__PURE__*/ jsx(SecondaryCheckbox, { ...props });
+	if (variant === "button") return /* @__PURE__ */ jsx(SecondaryButton, { ...props });
+	else if (variant === "link") return /* @__PURE__ */ jsx(SecondaryLink, { ...props });
+	else if (variant === "checkbox") return /* @__PURE__ */ jsx(SecondaryCheckbox, { ...props });
 };
 const SelectPanelLoading = ({ children = "Fetching items..." }) => {
-	return /*#__PURE__*/ jsxs(AriaStatus, {
+	return /* @__PURE__ */ jsxs(AriaStatus, {
 		announceOnShow: true,
 		className: SelectPanel_module_css_default.SelectPanelLoading,
-		children: [/*#__PURE__*/ jsx(Spinner, {
+		children: [/* @__PURE__ */ jsx(Spinner, {
 			size: "medium",
 			srText: null
-		}), /*#__PURE__*/ jsx("span", {
+		}), /* @__PURE__ */ jsx("span", {
 			className: SelectPanel_module_css_default.LoadingText,
 			children
 		})]
 	});
 };
-SelectPanelLoading.displayName = "SelectPanelLoading";
 const SelectPanelMessage = ({ variant = "warning", size = variant === "empty" ? "full" : "inline", title, children }) => {
 	const MessageWrapper = variant === "empty" ? "div" : AriaStatus;
-	if (size === "full") return /*#__PURE__*/ jsxs(MessageWrapper, {
+	if (size === "full") return /* @__PURE__ */ jsxs(MessageWrapper, {
 		className: SelectPanel_module_css_default.MessageFull,
 		children: [
-			variant !== "empty" ? /*#__PURE__*/ jsx(Octicon, {
+			variant !== "empty" ? /* @__PURE__ */ jsx(Octicon, {
 				icon: AlertIcon,
 				className: clsx(SelectPanel_module_css_default.Octicon, variant === "error" ? SelectPanel_module_css_default.Error : void 0, variant === "warning" ? SelectPanel_module_css_default.Warning : void 0)
 			}) : null,
-			/*#__PURE__*/ jsx("span", {
+			/* @__PURE__ */ jsx("span", {
 				className: SelectPanel_module_css_default.MessageTitle,
 				children: title
 			}),
-			/*#__PURE__*/ jsx("span", {
+			/* @__PURE__ */ jsx("span", {
 				className: SelectPanel_module_css_default.MessageContent,
 				children
 			})
 		]
 	});
-	else return /*#__PURE__*/ jsxs(MessageWrapper, {
+	else return /* @__PURE__ */ jsxs(MessageWrapper, {
 		className: SelectPanel_module_css_default.MessageInline,
 		"data-variant": variant,
-		children: [/*#__PURE__*/ jsx(AlertIcon, { size: 16 }), /*#__PURE__*/ jsx("div", { children })]
+		children: [/* @__PURE__ */ jsx(AlertIcon, { size: 16 }), /* @__PURE__ */ jsx("div", { children })]
 	});
 };
 const SelectPanel = Object.assign(Panel, {

package/dist/experimental/Tabs/Tabs.js

@@ -77,7 +77,7 @@ function Tabs(props) {
 	useIsomorphicLayoutEffect(t3, t4);
 	let t5;
 	if ($[12] !== children || $[13] !== contextValue) {
-		t5 = /*#__PURE__*/ jsx(TabsContext.Provider, {
+		t5 = /* @__PURE__ */ jsx(TabsContext.Provider, {
 			value: contextValue,
 			children
 		});

package/dist/experimental/UnderlinePanels/UnderlinePanels.js

@@ -128,19 +128,19 @@ const UnderlinePanels = ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabel
 		const providedValue = controlledValue !== null && controlledValue !== void 0 ? controlledValue : defaultValue;
 		warning(providedValue !== void 0 && tabValues.length > 0 && !tabValues.includes(providedValue), `UnderlinePanels: the selected value "${providedValue}" does not match any tab, so the first tab is selected instead. Provide a \`value\`/\`defaultValue\` that matches a \`UnderlinePanels.Tab\` \`value\`.`);
 	}
-	return /*#__PURE__*/ jsx(UnderlinePanelsContext.Provider, {
+	return /* @__PURE__ */ jsx(UnderlinePanelsContext.Provider, {
 		value: contextValue,
-		children: /*#__PURE__*/ jsxs(Tabs, {
+		children: /* @__PURE__ */ jsxs(Tabs, {
 			id: parentId,
 			value: effectiveValue,
 			activationMode,
 			onValueChange: ({ value }) => handleValueChange(value),
-			children: [/*#__PURE__*/ jsx(UnderlineWrapper, {
+			children: [/* @__PURE__ */ jsx(UnderlineWrapper, {
 				ref: wrapperRef,
 				"data-icons-visible": iconsVisible,
 				className: clsx(className, UnderlinePanels_module_css_default.StyledUnderlineWrapper),
 				...props,
-				children: /*#__PURE__*/ jsx(UnderlineItemList, {
+				children: /* @__PURE__ */ jsx(UnderlineItemList, {
 					ref: listRef,
 					role: tabListProps.role,
 					"aria-label": tabListProps["aria-label"],
@@ -153,12 +153,11 @@ const UnderlinePanels = ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabel
 		})
 	});
 };
-UnderlinePanels.displayName = "UnderlinePanels";
 const TabImpl = ({ onSelect, value, ...itemProps }) => {
 	const { loadingCounters } = useContext(UnderlinePanelsContext);
 	const { tabProps } = useTab({ value: value !== null && value !== void 0 ? value : "" });
 	const { onKeyDown: tabOnKeyDown, onMouseDown: tabOnMouseDown, onFocus: tabOnFocus, ...restTabProps } = tabProps;
-	return /*#__PURE__*/ jsx(UnderlineItem, {
+	return /* @__PURE__ */ jsx(UnderlineItem, {
 		as: "button",
 		...itemProps,
 		...restTabProps,
@@ -175,19 +174,17 @@ const TabImpl = ({ onSelect, value, ...itemProps }) => {
 		loadingCounters
 	});
 };
-TabImpl.displayName = "TabImpl";
 TabImpl.displayName = "UnderlinePanels.Tab";
 const Tab = /*#__PURE__*/ React.memo(TabImpl);
 Tab.displayName = "UnderlinePanels.Tab";
 const PanelImpl = ({ children, value, ...panelRest }) => {
 	const { tabPanelProps } = useTabPanel({ value: value !== null && value !== void 0 ? value : "" });
-	return /*#__PURE__*/ jsx("div", {
+	return /* @__PURE__ */ jsx("div", {
 		...panelRest,
 		...tabPanelProps,
 		children
 	});
 };
-PanelImpl.displayName = "PanelImpl";
 PanelImpl.displayName = "UnderlinePanels.Panel";
 const Panel = PanelImpl;
 Panel.displayName = "UnderlinePanels.Panel";

package/dist/experimental/index.js

@@ -3,10 +3,10 @@ import { Announce } from "../live-region/Announce.js";
 import { AriaAlert } from "../live-region/AriaAlert.js";
 import { AriaStatus } from "../live-region/AriaStatus.js";
 import { useSlots } from "../hooks/useSlots.js";
-import { ButtonBase } from "../Button/ButtonBase.js";
 import { DefaultFeatureFlags } from "../FeatureFlags/DefaultFeatureFlags.js";
 import { FeatureFlags } from "../FeatureFlags/FeatureFlags.js";
 import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
+import { ButtonBase } from "../Button/ButtonBase.js";
 import { KeybindingHint } from "../KeybindingHint/KeybindingHint.js";
 import { getAccessibleKeybindingHintString } from "../KeybindingHint/utils.js";
 import { Tooltip } from "../TooltipV2/Tooltip.js";

package/dist/hooks/useMergedRefs.js

@@ -64,18 +64,6 @@ function useMergedRefs(refA, refB) {
 	} else t0 = $[2];
 	return t0;
 }
-/**
-* React 19 supports callback refs that can return a cleanup function. If a cleanup function is returned, the
-* cleanup is called on unmount **instead** of setting the ref to null.
-*/
-/**
-* Supporting React 18 and 19 while alleviating the need for any hacks or casts in consumers:
-* - `ForwardedRef` from the React 18 `forwardRef` HOC
-* - `React19RefCallback` for callback refs that can return a cleanup function (this is included in `Ref` in React 19
-*   but not in 18)
-* - `Ref` for standard refs from `useRef` or passed in as React 19 prop
-* - `undefined` to allow for easy use of optional `ref` props in React 19
-*/
 function setRef(ref, value) {
 	if (typeof ref === "function") return ref(value);
 	else if (ref) ref.current = value;

package/dist/hooks/useResponsiveValue.js

@@ -6,11 +6,6 @@ const viewportRanges = {
 	wide: "(min-width: 1400px)"
 };
 /**
-* Flattens all possible value types into single union type
-* For example, if `T` is `'none' | 'line' | Responsive<'none' | 'line' | 'filled'>`,
-* `FlattenResponsiveValue<T>` will be `'none' | 'line' | 'filled'`
-*/
-/**
 * Checks if the value is a responsive value.
 * In other words, is it an object with viewport range keys?
 */

package/dist/hooks/useSlots.js

@@ -2,54 +2,6 @@ import { warning } from "../utils/warning.js";
 import { isSlot } from "../utils/is-slot.js";
 import React from "react";
 //#region src/hooks/useSlots.ts
-/**
-* useSlots - Extract slot components from children for SSR-compatible slot APIs.
-*
-* Given a list of children and a config mapping slot names to component types,
-* separates children into two groups: matched slots and the rest.
-*
-*   Config: { leadingVisual: LeadingVisual, description: Description }
-*
-*   Children:             Matching:              Output:
-*   +----------------+                           slots = {
-*   | LeadingVisual  |   -> matches slot 0  -->    leadingVisual: <LeadingVisual />
-*   | "Project name" |   -> no match        -->    description: <Description />
-*   | Description    |   -> matches slot 1  -->  }
-*   | TrailingVisual |   -> no match        -->  rest = ["Project name", <TrailingVisual />]
-*   +----------------+
-*
-* Performance-sensitive: called per item in lists (e.g. 100-item ActionList
-* calls this 101 times per render).
-*
-* Once all slots are filled, remaining children skip matching entirely in
-* production (single integer comparison). In dev, we still scan for duplicates
-* to emit a warning.
-*
-*   Flow per child:
-*
-*   child ──> isValidElement? ──no──> rest[]
-*              |
-*             yes
-*              |
-*              v
-*          all slots filled? ──yes──> rest[] (prod)
-*              |                       |
-*             no                  [dev: check for
-*              |                   duplicate warning]
-*              v
-*          match against unfilled slots
-*              |
-*         found match? ──no──> rest[]
-*              |
-*             yes
-*              |
-*              v
-*          slots[key] = child, slotsFound++
-*
-* Slot config supports two matcher styles:
-*   1. Component reference:  { visual: LeadingVisual }
-*   2. Component + test fn:  { block: [Description, props => props.variant === 'block'] }
-*/
 /** Check if a child element matches a slot config entry, either by direct type comparison or slot symbol. */
 function childMatchesSlot(child, slotValue) {
 	if (Array.isArray(slotValue)) {

package/dist/internal/components/ButtonReset.js

@@ -30,7 +30,7 @@ const Button = (t0) => {
 	} else t1 = $[5];
 	let t2;
 	if ($[6] !== children || $[7] !== rest || $[8] !== t1) {
-		t2 = /*#__PURE__*/ jsx("button", {
+		t2 = /* @__PURE__ */ jsx("button", {
 			className: t1,
 			type: "button",
 			...rest,

package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js

@@ -75,16 +75,16 @@ const CheckboxOrRadioGroup = (t0) => {
 	} else t8 = $[13];
 	let t9;
 	if ($[14] !== isLegendVisible || $[15] !== labelChild || $[16] !== required || $[17] !== requiredMessageId || $[18] !== slots.caption || $[19] !== slots.label || $[20] !== slots.validation) {
-		t9 = labelChild ? /*#__PURE__*/ jsxs("legend", {
+		t9 = labelChild ? /* @__PURE__ */ jsxs("legend", {
 			className: CheckboxOrRadioGroup_module_css_default.GroupLegend,
 			"data-legend-visible": isLegendVisible ? "" : void 0,
 			children: [
 				slots.label,
-				required && /*#__PURE__*/ jsx(VisuallyHidden, { children: ", required" }),
+				required && /* @__PURE__ */ jsx(VisuallyHidden, { children: ", required" }),
 				slots.caption,
-				/*#__PURE__*/ React.isValidElement(slots.validation) && slots.validation.props.children && /*#__PURE__*/ jsx(VisuallyHidden, { children: slots.validation.props.children })
+				/*#__PURE__*/ React.isValidElement(slots.validation) && slots.validation.props.children && /* @__PURE__ */ jsx(VisuallyHidden, { children: slots.validation.props.children })
 			]
-		}) : /*#__PURE__*/ jsxs(Fragment$1, { children: [slots.caption, required && requiredMessageId && /*#__PURE__*/ jsx(VisuallyHidden, {
+		}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [slots.caption, required && requiredMessageId && /* @__PURE__ */ jsx(VisuallyHidden, {
 			id: requiredMessageId,
 			children: "Required"
 		})] });
@@ -124,7 +124,7 @@ const CheckboxOrRadioGroup = (t0) => {
 	} else t11 = $[29];
 	let t12;
 	if ($[30] !== t10 || $[31] !== t11) {
-		t12 = /*#__PURE__*/ jsx("div", {
+		t12 = /* @__PURE__ */ jsx("div", {
 			className: CheckboxOrRadioGroup_module_css_default.Body,
 			...t10,
 			children: t11
@@ -135,7 +135,7 @@ const CheckboxOrRadioGroup = (t0) => {
 	} else t12 = $[32];
 	let t13;
 	if ($[33] !== Component || $[34] !== dataComponentProp || $[35] !== t12 || $[36] !== t6 || $[37] !== t7 || $[38] !== t8 || $[39] !== t9) {
-		t13 = /*#__PURE__*/ jsxs(Component, {
+		t13 = /* @__PURE__ */ jsxs(Component, {
 			"data-component": dataComponentProp,
 			className: t6,
 			"data-validation": t7,
@@ -153,7 +153,7 @@ const CheckboxOrRadioGroup = (t0) => {
 	} else t13 = $[40];
 	let t14;
 	if ($[41] !== labelChild || $[42] !== slots.validation || $[43] !== validationChild) {
-		t14 = validationChild && /*#__PURE__*/ jsx(ValidationAnimationContainer, {
+		t14 = validationChild && /* @__PURE__ */ jsx(ValidationAnimationContainer, {
 			"aria-hidden": Boolean(labelChild),
 			show: true,
 			children: slots.validation
@@ -165,14 +165,14 @@ const CheckboxOrRadioGroup = (t0) => {
 	} else t14 = $[44];
 	let t15;
 	if ($[45] !== t13 || $[46] !== t14) {
-		t15 = /*#__PURE__*/ jsxs("div", { children: [t13, t14] });
+		t15 = /* @__PURE__ */ jsxs("div", { children: [t13, t14] });
 		$[45] = t13;
 		$[46] = t14;
 		$[47] = t15;
 	} else t15 = $[47];
 	let t16;
 	if ($[48] !== t15 || $[49] !== t5) {
-		t16 = /*#__PURE__*/ jsx(CheckboxOrRadioGroupContext.Provider, {
+		t16 = /* @__PURE__ */ jsx(CheckboxOrRadioGroupContext.Provider, {
 			value: t5,
 			children: t15
 		});

package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js

@@ -19,7 +19,7 @@ const CheckboxOrRadioGroupCaption = (t0) => {
 	const t2 = parentName ? `${parentName}.Caption` : void 0;
 	let t3;
 	if ($[2] !== captionId || $[3] !== children || $[4] !== t1 || $[5] !== t2) {
-		t3 = /*#__PURE__*/ jsx(Text_default, {
+		t3 = /* @__PURE__ */ jsx(Text_default, {
 			className: t1,
 			id: captionId,
 			"data-component": t2,

package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.js

@@ -24,13 +24,13 @@ const CheckboxOrRadioGroupLabel = (t0) => {
 	const t6 = parentName ? `${parentName}.Label` : void 0;
 	let t7;
 	if ($[2] !== children || $[3] !== required) {
-		t7 = required ? /*#__PURE__*/ jsxs(Stack, {
+		t7 = required ? /* @__PURE__ */ jsxs(Stack, {
 			direction: "horizontal",
 			gap: "none",
-			children: [/*#__PURE__*/ jsx("div", {
+			children: [/* @__PURE__ */ jsx("div", {
 				className: CheckboxOrRadioGroup_module_css_default.GroupLabelChildren,
 				children
-			}), /*#__PURE__*/ jsx("span", { children: "*" })]
+			}), /* @__PURE__ */ jsx("span", { children: "*" })]
 		}) : children;
 		$[2] = children;
 		$[3] = required;
@@ -38,7 +38,7 @@ const CheckboxOrRadioGroupLabel = (t0) => {
 	} else t7 = $[4];
 	let t8;
 	if ($[5] !== t2 || $[6] !== t3 || $[7] !== t4 || $[8] !== t5 || $[9] !== t6 || $[10] !== t7) {
-		t8 = /*#__PURE__*/ jsx(VisuallyHidden, {
+		t8 = /* @__PURE__ */ jsx(VisuallyHidden, {
 			className: t2,
 			isVisible: t3,
 			title: t4,

package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.js

@@ -12,7 +12,7 @@ const CheckboxOrRadioGroupValidation = (t0) => {
 	const t2 = parentName ? `${parentName}.Validation` : void 0;
 	let t3;
 	if ($[0] !== children || $[1] !== t2 || $[2] !== validationMessageId || $[3] !== variant) {
-		t3 = /*#__PURE__*/ jsx(InputValidation, {
+		t3 = /* @__PURE__ */ jsx(InputValidation, {
 			validationStatus: variant,
 			id: validationMessageId,
 			"data-component": t2,

package/dist/internal/components/ConditionalWrapper.js

@@ -20,7 +20,7 @@ const ConditionalWrapper = (props) => {
 	if (condition) {
 		let t0;
 		if ($[4] !== children || $[5] !== rest) {
-			t0 = /*#__PURE__*/ jsx("div", {
+			t0 = /* @__PURE__ */ jsx("div", {
 				...rest,
 				children
 			});
@@ -32,7 +32,7 @@ const ConditionalWrapper = (props) => {
 	} else {
 		let t0;
 		if ($[7] !== children) {
-			t0 = /*#__PURE__*/ jsx(Fragment, { children });
+			t0 = /* @__PURE__ */ jsx(Fragment, { children });
 			$[7] = children;
 			$[8] = t0;
 		} else t0 = $[8];

package/dist/internal/components/InputLabel.js

@@ -55,9 +55,9 @@ function InputLabel(t0) {
 	let t5;
 	if ($[14] !== children || $[15] !== required || $[16] !== requiredIndicator || $[17] !== requiredText) {
 		var _requiredText;
-		t5 = required || requiredText ? /*#__PURE__*/ jsxs("span", {
+		t5 = required || requiredText ? /* @__PURE__ */ jsxs("span", {
 			className: InputLabel_module_css_default.RequiredText,
-			children: [/*#__PURE__*/ jsx("span", { children }), /*#__PURE__*/ jsx("span", {
+			children: [/* @__PURE__ */ jsx("span", { children }), /* @__PURE__ */ jsx("span", {
 				"aria-hidden": requiredIndicator ? void 0 : true,
 				children: (_requiredText = requiredText) !== null && _requiredText !== void 0 ? _requiredText : "*"
 			})]
@@ -70,7 +70,7 @@ function InputLabel(t0) {
 	} else t5 = $[18];
 	let t6;
 	if ($[19] !== Component || $[20] !== htmlFor || $[21] !== id || $[22] !== props || $[23] !== t2 || $[24] !== t3 || $[25] !== t4 || $[26] !== t5) {
-		t6 = /*#__PURE__*/ jsx(Component, {
+		t6 = /* @__PURE__ */ jsx(Component, {
 			"data-control-disabled": t2,
 			"data-visually-hidden": t3,
 			htmlFor,

package/dist/internal/components/InputValidation.js

@@ -46,11 +46,11 @@ const InputValidation = (t0) => {
 	} else t1 = $[9];
 	let t2;
 	if ($[10] !== IconComponent) {
-		t2 = IconComponent ? /*#__PURE__*/ jsx("span", {
+		t2 = IconComponent ? /* @__PURE__ */ jsx("span", {
 			"aria-hidden": "true",
 			className: InputValidation_module_css_default.ValidationIcon,
 			style: { "--inputValidation-iconSize": 16 },
-			children: /*#__PURE__*/ jsx(IconComponent, {
+			children: /* @__PURE__ */ jsx(IconComponent, {
 				size: 12,
 				fill: "currentColor"
 			})
@@ -65,7 +65,7 @@ const InputValidation = (t0) => {
 	} else t3 = $[12];
 	let t4;
 	if ($[13] !== children || $[14] !== id) {
-		t4 = /*#__PURE__*/ jsx("span", {
+		t4 = /* @__PURE__ */ jsx("span", {
 			id,
 			className: InputValidation_module_css_default.ValidationText,
 			style: t3,
@@ -77,7 +77,7 @@ const InputValidation = (t0) => {
 	} else t4 = $[15];
 	let t5;
 	if ($[16] !== dataComponent || $[17] !== rest || $[18] !== style || $[19] !== t1 || $[20] !== t2 || $[21] !== t4 || $[22] !== validationStatus) {
-		t5 = /*#__PURE__*/ jsxs(Text_default, {
+		t5 = /* @__PURE__ */ jsxs(Text_default, {
 			...rest,
 			className: t1,
 			"data-validation-status": validationStatus,

package/dist/internal/components/OverflowObserverProvider.js

@@ -132,7 +132,7 @@ function OverflowObserverProvider(t0) {
 	useEffect(t7, t8);
 	let t9;
 	if ($[12] !== children || $[13] !== observe) {
-		t9 = /*#__PURE__*/ jsx(OverflowObserverContext.Provider, {
+		t9 = /* @__PURE__ */ jsx(OverflowObserverContext.Provider, {
 			value: observe,
 			children
 		});