@primer/react 38.30.1-rc.0d136c1b7 → 38.30.1-rc.34724960c

package/dist/ActionList/LinkItem.d.ts

@@ -1,22 +1,19 @@
-import type React from 'react';
-import type { WithSlotMarker } from '../utils/types/Slots';
-import type { ActionListItemProps } from './shared';
+import { ActionListItemProps } from "./shared.js";
+import React from "react";
+
+//#region src/ActionList/LinkItem.d.ts
 type LinkProps = {
-    download?: string;
-    href?: string;
-    hrefLang?: string;
-    media?: string;
-    ping?: string;
-    rel?: string;
-    target?: string;
-    type?: string;
-    referrerPolicy?: React.AnchorHTMLAttributes<HTMLAnchorElement>['referrerPolicy'];
-    className?: string;
+  download?: string;
+  href?: string;
+  hrefLang?: string;
+  media?: string;
+  ping?: string;
+  rel?: string;
+  target?: string;
+  type?: string;
+  referrerPolicy?: React.AnchorHTMLAttributes<HTMLAnchorElement>['referrerPolicy'];
+  className?: string;
 };
-export type ActionListLinkItemProps = Pick<ActionListItemProps, 'active' | 'children' | 'inactiveText' | 'variant' | 'size'> & LinkProps;
-declare const LinkItemComponent: <As extends React.ElementType = "a">(props: import("../utils/modern-polymorphic").DistributiveOmit<React.ComponentPropsWithRef<React.ElementType extends As ? "a" : As> & Pick<ActionListItemProps, "active" | "children" | "inactiveText" | "size" | "variant"> & LinkProps, "as"> & {
-    as?: As | undefined;
-} & React.RefAttributes<unknown>) => React.ReactNode;
-export declare const LinkItem: WithSlotMarker<typeof LinkItemComponent>;
-export {};
-//# sourceMappingURL=LinkItem.d.ts.map
+type ActionListLinkItemProps = Pick<ActionListItemProps, 'active' | 'children' | 'inactiveText' | 'variant' | 'size'> & LinkProps;
+//#endregion
+export { ActionListLinkItemProps };

package/dist/ActionList/LinkItem.js

@@ -1,60 +1,40 @@
-import { Item } from './Item.js';
-import { fixedForwardRef } from '../utils/modern-polymorphic.js';
-import { jsx } from 'react/jsx-runtime';
-import Link from '../Link/Link.js';
-
-const LinkItemComponent = fixedForwardRef(({
-  active,
-  inactiveText,
-  variant,
-  size,
-  as: Component,
-  className,
-  ...props
-}, forwardedRef) => {
-  return /*#__PURE__*/jsx(Item, {
-    className: className,
-    active: active,
-    inactiveText: inactiveText,
-    "data-inactive": inactiveText ? true : undefined,
-    variant: variant,
-    size: size,
-    _PrivateItemWrapper: ({
-      children,
-      onClick,
-      ...rest
-    }) => {
-      const clickHandler = event => {
-        onClick && onClick(event);
-        props.onClick && props.onClick(event);
-      };
-      if (inactiveText) {
-        return /*#__PURE__*/jsx("span", {
-          ...rest,
-          children: children
-        });
-      }
-
-      // Type safety for the polymorphic `as` prop is enforced at the
-      // LinkItem boundary via fixedForwardRef. Internally we widen
-      // Link's type so TypeScript doesn't re-check the generic
-      // constraint across two polymorphic layers.
-      const InternalLink = Link;
-      return /*#__PURE__*/jsx(InternalLink, {
-        as: Component,
-        ...rest,
-        ...props,
-        onClick: clickHandler,
-        ref: forwardedRef,
-        children: children
-      });
-    },
-    children: props.children
-  });
+import { fixedForwardRef } from "../utils/modern-polymorphic.js";
+import { Item } from "./Item.js";
+import Link from "../Link/Link.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/ActionList/LinkItem.tsx
+const LinkItemComponent = fixedForwardRef(({ active, inactiveText, variant, size, as: Component, className, ...props }, forwardedRef) => {
+	return /*#__PURE__*/ jsx(Item, {
+		className,
+		active,
+		inactiveText,
+		"data-inactive": inactiveText ? true : void 0,
+		variant,
+		size,
+		_PrivateItemWrapper: ({ children, onClick, ...rest }) => {
+			const clickHandler = (event) => {
+				onClick && onClick(event);
+				props.onClick && props.onClick(event);
+			};
+			if (inactiveText) return /*#__PURE__*/ jsx("span", {
+				...rest,
+				children
+			});
+			return /*#__PURE__*/ jsx(Link, {
+				as: Component,
+				...rest,
+				...props,
+				onClick: clickHandler,
+				ref: forwardedRef,
+				children
+			});
+		},
+		children: props.children
+	});
 });
 const LinkItem = Object.assign(LinkItemComponent, {
-  displayName: 'ActionList.LinkItem',
-  __SLOT__: Symbol('ActionList.LinkItem')
+	displayName: "ActionList.LinkItem",
+	__SLOT__: Symbol("ActionList.LinkItem")
 });
-
+//#endregion
 export { LinkItem };

package/dist/ActionList/List.js

@@ -1,219 +1,177 @@
-import { c } from 'react-compiler-runtime';
-import React from 'react';
-import { fixedForwardRef } from '../utils/modern-polymorphic.js';
-import { ActionListContainerContext } from './ActionListContainerContext.js';
-import { useSlots } from '../hooks/useSlots.js';
-import { Heading } from './Heading.js';
-import { useId } from '../hooks/useId.js';
-import { ListContext } from './shared.js';
-import { useFocusZone } from '../hooks/useFocusZone.js';
-import { clsx } from 'clsx';
-import classes from './ActionList.module.css.js';
-import useIsomorphicLayoutEffect from '../utils/useIsomorphicLayoutEffect.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useProvidedRefOrCreate } from '../hooks/useProvidedRefOrCreate.js';
-import { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
-import { FocusKeys } from '@primer/behaviors';
-
+import { useProvidedRefOrCreate } from "../hooks/useProvidedRefOrCreate.js";
+import useIsomorphicLayoutEffect from "../utils/useIsomorphicLayoutEffect.js";
+import { useId as useId$1 } from "../hooks/useId.js";
+import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
+import { fixedForwardRef } from "../utils/modern-polymorphic.js";
+import { useSlots } from "../hooks/useSlots.js";
+import { FocusKeys, useFocusZone } from "../hooks/useFocusZone.js";
+import { ActionListContainerContext } from "./ActionListContainerContext.js";
+import { ListContext } from "./shared.js";
+import { Heading } from "./Heading.js";
+import ActionList_module_css_default from "./ActionList.module.css.js";
+import { c } from "react-compiler-runtime";
+import { clsx } from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+import React from "react";
+//#region src/ActionList/List.tsx
 const UnwrappedList = (props, forwardedRef) => {
-  var _slots$heading$props$;
-  const $ = c(40);
-  let className;
-  let restProps;
-  let role;
-  let selectionVariant;
-  let t0;
-  let t1;
-  let t2;
-  let t3;
-  if ($[0] !== props) {
-    ({
-      as: t0,
-      variant: t1,
-      selectionVariant,
-      showDividers: t2,
-      role,
-      disableFocusZone: t3,
-      className,
-      ...restProps
-    } = props);
-    $[0] = props;
-    $[1] = className;
-    $[2] = restProps;
-    $[3] = role;
-    $[4] = selectionVariant;
-    $[5] = t0;
-    $[6] = t1;
-    $[7] = t2;
-    $[8] = t3;
-  } else {
-    className = $[1];
-    restProps = $[2];
-    role = $[3];
-    selectionVariant = $[4];
-    t0 = $[5];
-    t1 = $[6];
-    t2 = $[7];
-    t3 = $[8];
-  }
-  const Component = t0 === undefined ? "ul" : t0;
-  const variant = t1 === undefined ? "inset" : t1;
-  const showDividers = t2 === undefined ? false : t2;
-  const disableFocusZone = t3 === undefined ? false : t3;
-  let t4;
-  if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-    t4 = {
-      heading: Heading
-    };
-    $[9] = t4;
-  } else {
-    t4 = $[9];
-  }
-  const [slots, childrenWithoutSlots] = useSlots(restProps.children, t4);
-  const headingId = useId();
-  const {
-    listRole: listRoleFromContainer,
-    listLabelledBy,
-    selectionVariant: containerSelectionVariant,
-    enableFocusZone: enableFocusZoneFromContainer,
-    container
-  } = React.useContext(ActionListContainerContext);
-  const ariaLabelledBy = slots.heading ? (_slots$heading$props$ = slots.heading.props.id) !== null && _slots$heading$props$ !== void 0 ? _slots$heading$props$ : headingId : listLabelledBy;
-  const listRole = role || listRoleFromContainer;
-  const listRef = useProvidedRefOrCreate(forwardedRef);
-  const itemGapEnabled = useFeatureFlag("primer_react_action_list_item_gap") && container === "NavList";
-  let enableFocusZone = false;
-  if (enableFocusZoneFromContainer !== undefined) {
-    enableFocusZone = enableFocusZoneFromContainer;
-  } else {
-    if (listRole && !disableFocusZone) {
-      let t5;
-      if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-        t5 = ["menu", "menubar", "listbox"];
-        $[10] = t5;
-      } else {
-        t5 = $[10];
-      }
-      enableFocusZone = t5.includes(listRole);
-    }
-  }
-  const t5 = !enableFocusZone;
-  const t6 = listRole === "menu" || container === "SelectPanel" || container === "FilteredActionList" ? "wrap" : undefined;
-  let t7;
-  if ($[11] !== listRef || $[12] !== t5 || $[13] !== t6) {
-    t7 = {
-      disabled: t5,
-      containerRef: listRef,
-      bindKeys: FocusKeys.ArrowVertical | FocusKeys.HomeAndEnd | FocusKeys.PageUpDown,
-      focusOutBehavior: t6
-    };
-    $[11] = listRef;
-    $[12] = t5;
-    $[13] = t6;
-    $[14] = t7;
-  } else {
-    t7 = $[14];
-  }
-  useFocusZone(t7);
-  const t8 = selectionVariant || containerSelectionVariant;
-  let t9;
-  if ($[15] !== headingId || $[16] !== listRole || $[17] !== showDividers || $[18] !== t8 || $[19] !== variant) {
-    t9 = {
-      variant,
-      selectionVariant: t8,
-      showDividers,
-      role: listRole,
-      headingId
-    };
-    $[15] = headingId;
-    $[16] = listRole;
-    $[17] = showDividers;
-    $[18] = t8;
-    $[19] = variant;
-    $[20] = t9;
-  } else {
-    t9 = $[20];
-  }
-  const listContextValue = t9;
-  let t10;
-  if ($[21] !== listRef) {
-    t10 = () => {
-      const list = listRef.current;
-      if (!list) {
-        return;
-      }
-      const hasMixed = list.querySelector("[data-has-description=\"true\"]") !== null && list.querySelector("[data-has-description=\"false\"]") !== null;
-      const current = list.getAttribute("data-mixed-descriptions");
-      if (hasMixed && current !== "true") {
-        list.setAttribute("data-mixed-descriptions", "true");
-      } else {
-        if (!hasMixed && current !== null) {
-          list.removeAttribute("data-mixed-descriptions");
-        }
-      }
-    };
-    $[21] = listRef;
-    $[22] = t10;
-  } else {
-    t10 = $[22];
-  }
-  useIsomorphicLayoutEffect(t10);
-  const t11 = slots.heading;
-  let t12;
-  if ($[23] !== className) {
-    t12 = clsx(classes.ActionList, className);
-    $[23] = className;
-    $[24] = t12;
-  } else {
-    t12 = $[24];
-  }
-  const t13 = itemGapEnabled ? "" : undefined;
-  let t14;
-  if ($[25] !== Component || $[26] !== ariaLabelledBy || $[27] !== childrenWithoutSlots || $[28] !== listRef || $[29] !== listRole || $[30] !== restProps || $[31] !== showDividers || $[32] !== t12 || $[33] !== t13 || $[34] !== variant) {
-    t14 = /*#__PURE__*/jsx(Component, {
-      className: t12,
-      role: listRole,
-      "aria-labelledby": ariaLabelledBy,
-      ref: listRef,
-      "data-component": "ActionList",
-      "data-dividers": showDividers,
-      "data-variant": variant,
-      "data-item-gap": t13,
-      ...restProps,
-      children: childrenWithoutSlots
-    });
-    $[25] = Component;
-    $[26] = ariaLabelledBy;
-    $[27] = childrenWithoutSlots;
-    $[28] = listRef;
-    $[29] = listRole;
-    $[30] = restProps;
-    $[31] = showDividers;
-    $[32] = t12;
-    $[33] = t13;
-    $[34] = variant;
-    $[35] = t14;
-  } else {
-    t14 = $[35];
-  }
-  let t15;
-  if ($[36] !== listContextValue || $[37] !== slots.heading || $[38] !== t14) {
-    t15 = /*#__PURE__*/jsxs(ListContext.Provider, {
-      value: listContextValue,
-      children: [t11, t14]
-    });
-    $[36] = listContextValue;
-    $[37] = slots.heading;
-    $[38] = t14;
-    $[39] = t15;
-  } else {
-    t15 = $[39];
-  }
-  return t15;
+	var _slots$heading$props$;
+	const $ = c(40);
+	let className;
+	let restProps;
+	let role;
+	let selectionVariant;
+	let t0;
+	let t1;
+	let t2;
+	let t3;
+	if ($[0] !== props) {
+		({as: t0, variant: t1, selectionVariant, showDividers: t2, role, disableFocusZone: t3, className, ...restProps} = props);
+		$[0] = props;
+		$[1] = className;
+		$[2] = restProps;
+		$[3] = role;
+		$[4] = selectionVariant;
+		$[5] = t0;
+		$[6] = t1;
+		$[7] = t2;
+		$[8] = t3;
+	} else {
+		className = $[1];
+		restProps = $[2];
+		role = $[3];
+		selectionVariant = $[4];
+		t0 = $[5];
+		t1 = $[6];
+		t2 = $[7];
+		t3 = $[8];
+	}
+	const Component = t0 === void 0 ? "ul" : t0;
+	const variant = t1 === void 0 ? "inset" : t1;
+	const showDividers = t2 === void 0 ? false : t2;
+	const disableFocusZone = t3 === void 0 ? false : t3;
+	let t4;
+	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = { heading: Heading };
+		$[9] = t4;
+	} else t4 = $[9];
+	const [slots, childrenWithoutSlots] = useSlots(restProps.children, t4);
+	const headingId = useId$1();
+	const { listRole: listRoleFromContainer, listLabelledBy, selectionVariant: containerSelectionVariant, enableFocusZone: enableFocusZoneFromContainer, container } = React.useContext(ActionListContainerContext);
+	const ariaLabelledBy = slots.heading ? (_slots$heading$props$ = slots.heading.props.id) !== null && _slots$heading$props$ !== void 0 ? _slots$heading$props$ : headingId : listLabelledBy;
+	const listRole = role || listRoleFromContainer;
+	const listRef = useProvidedRefOrCreate(forwardedRef);
+	const itemGapEnabled = useFeatureFlag("primer_react_action_list_item_gap") && container === "NavList";
+	let enableFocusZone = false;
+	if (enableFocusZoneFromContainer !== void 0) enableFocusZone = enableFocusZoneFromContainer;
+	else if (listRole && !disableFocusZone) {
+		let t5;
+		if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+			t5 = [
+				"menu",
+				"menubar",
+				"listbox"
+			];
+			$[10] = t5;
+		} else t5 = $[10];
+		enableFocusZone = t5.includes(listRole);
+	}
+	const t5 = !enableFocusZone;
+	const t6 = listRole === "menu" || container === "SelectPanel" || container === "FilteredActionList" ? "wrap" : void 0;
+	let t7;
+	if ($[11] !== listRef || $[12] !== t5 || $[13] !== t6) {
+		t7 = {
+			disabled: t5,
+			containerRef: listRef,
+			bindKeys: FocusKeys.ArrowVertical | FocusKeys.HomeAndEnd | FocusKeys.PageUpDown,
+			focusOutBehavior: t6
+		};
+		$[11] = listRef;
+		$[12] = t5;
+		$[13] = t6;
+		$[14] = t7;
+	} else t7 = $[14];
+	useFocusZone(t7);
+	const t8 = selectionVariant || containerSelectionVariant;
+	let t9;
+	if ($[15] !== headingId || $[16] !== listRole || $[17] !== showDividers || $[18] !== t8 || $[19] !== variant) {
+		t9 = {
+			variant,
+			selectionVariant: t8,
+			showDividers,
+			role: listRole,
+			headingId
+		};
+		$[15] = headingId;
+		$[16] = listRole;
+		$[17] = showDividers;
+		$[18] = t8;
+		$[19] = variant;
+		$[20] = t9;
+	} else t9 = $[20];
+	const listContextValue = t9;
+	let t10;
+	if ($[21] !== listRef) {
+		t10 = () => {
+			const list = listRef.current;
+			if (!list) return;
+			const hasMixed = list.querySelector("[data-has-description=\"true\"]") !== null && list.querySelector("[data-has-description=\"false\"]") !== null;
+			const current = list.getAttribute("data-mixed-descriptions");
+			if (hasMixed && current !== "true") list.setAttribute("data-mixed-descriptions", "true");
+			else if (!hasMixed && current !== null) list.removeAttribute("data-mixed-descriptions");
+		};
+		$[21] = listRef;
+		$[22] = t10;
+	} else t10 = $[22];
+	useIsomorphicLayoutEffect(t10);
+	const t11 = slots.heading;
+	let t12;
+	if ($[23] !== className) {
+		t12 = clsx(ActionList_module_css_default.ActionList, className);
+		$[23] = className;
+		$[24] = t12;
+	} else t12 = $[24];
+	const t13 = itemGapEnabled ? "" : void 0;
+	let t14;
+	if ($[25] !== Component || $[26] !== ariaLabelledBy || $[27] !== childrenWithoutSlots || $[28] !== listRef || $[29] !== listRole || $[30] !== restProps || $[31] !== showDividers || $[32] !== t12 || $[33] !== t13 || $[34] !== variant) {
+		t14 = /*#__PURE__*/ jsx(Component, {
+			className: t12,
+			role: listRole,
+			"aria-labelledby": ariaLabelledBy,
+			ref: listRef,
+			"data-component": "ActionList",
+			"data-dividers": showDividers,
+			"data-variant": variant,
+			"data-item-gap": t13,
+			...restProps,
+			children: childrenWithoutSlots
+		});
+		$[25] = Component;
+		$[26] = ariaLabelledBy;
+		$[27] = childrenWithoutSlots;
+		$[28] = listRef;
+		$[29] = listRole;
+		$[30] = restProps;
+		$[31] = showDividers;
+		$[32] = t12;
+		$[33] = t13;
+		$[34] = variant;
+		$[35] = t14;
+	} else t14 = $[35];
+	let t15;
+	if ($[36] !== listContextValue || $[37] !== slots.heading || $[38] !== t14) {
+		t15 = /*#__PURE__*/ jsxs(ListContext.Provider, {
+			value: listContextValue,
+			children: [t11, t14]
+		});
+		$[36] = listContextValue;
+		$[37] = slots.heading;
+		$[38] = t14;
+		$[39] = t15;
+	} else t15 = $[39];
+	return t15;
 };
 const List = fixedForwardRef(UnwrappedList);
-Object.assign(List, {
-  displayName: 'ActionList'
-});
-
+Object.assign(List, { displayName: "ActionList" });
+//#endregion
 export { List };