npm - @primer/react-brand - Versions diffs - 0.68.0-rc.5bd56cbb → 0.68.0-rc.b6d410ef - Mend

@primer/react-brand 0.68.0-rc.5bd56cbb → 0.68.0-rc.b6d410ef

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (476) hide show

package/esm/ActionMenu/ActionMenu.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionMenu.d.ts","sourceRoot":"","sources":["../../src/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAQZ,iBAAiB,EAGjB,YAAY,EAEb,MAAM,OAAO,CAAA;AACd,OAAO,EAAS,WAAW,EAAgC,MAAM,KAAK,CAAA;AAMtE,OAAO,EAA6B,KAAK,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAG5E,OAAO,EAAY,KAAK,gBAAgB,EAAY,MAAM,mBAAmB,CAAA;AAC7E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAEnD;;GAEG;AACH,OAAO,+GAA+G,CAAA;AAuBtH,eAAO,MAAM,sBAAsB,EAU9B,gBAAgB,CAAC,MAAM,CAAC,EAAE,CAAA;AAE/B,eAAO,MAAM,eAAe,8BAA+B,CAAA;AAE3D,eAAO,MAAM,qBAAqB,sCAAuC,CAAA;AACzE,MAAM,MAAM,qBAAqB,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1E,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE9D,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EACJ,YAAY,CAAC,qBAAqB,CAAC,GACnC,YAAY,CAAC,sBAAsB,CAAC,GACpC,KAAK,CAAC,YAAY,CAAC,qBAAqB,CAAC,GAAG,YAAY,CAAC,sBAAsB,CAAC,CAAC,CAAA;IACrF;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAA;IACpC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC/B;;OAEG;IACH,IAAI,CAAC,EAAE,eAAe,CAAA;IAItB,QAAQ,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAA;IACnC;;;;OAIG;IACH,IAAI,CAAC,EAAE,qBAAqB,CAAA;CAC7B,GAAG,SAAS,CAAC,cAAc,CAAC,CAAA;AAE7B,KAAK,qBAAqB,GAAG;IAC3B,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,GAAG,SAAS,CAAC,CAAC,CAAA;CAC5E,CAAA;AAID,eAAO,MAAM,oBAAoB,QAAO,qBAEvC,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAIxD,CAAA;AAgMD,KAAK,qBAAqB,GAAG,iBAAiB,CAC5C,SAAS,CAAC,iBAAiB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,IAAI,GAAG,UAAU,GAAG,SAAS,CAAC,CAClH,GAAG;IACF,EAAE,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAA;IAC3B,IAAI,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAA;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,KAAK,CAAC,EAAE,qBAAqB,CAAA;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,CAAA;IACrC,aAAa,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,eAAe,CAAC,CAAA;CAClD,CAAA;~~AAkFD~~,KAAK,uBAAuB,GAAG;IAC7B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,GAAG,IAAI,CAAA;CAC5D,GAAG,iBAAiB,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAA;AAErD,KAAK,yBAAyB,GAAG,uBAAuB,GAAG;IACzD,EAAE,EAAE,GAAG,CAAA;CACR,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,MAAM,uBAAuB,GAAG,IAAI,CAAC,CAAA;AAGlF,KAAK,0BAA0B,GAAG,uBAAuB,GAAG;IAC1D,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,MAAM,uBAAuB,GAAG,IAAI,CAAC,CAAA;AAoI9E,KAAK,sBAAsB,GAAG,iBAAiB,CAC7C,SAAS,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,CACrE,GAAG;IACF,YAAY,EAAE,MAAM,CAAA;IACpB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAkBD;;;GAGG;AACH,eAAO,MAAM,UAAU;~~IAjhBrB~~;;OAEG;cAEC,YAAY,CAAC,qBAAqB,CAAC,GACnC,YAAY,CAAC,sBAAsB,CAAC,GACpC,KAAK,CAAC,YAAY,CAAC,qBAAqB,CAAC,GAAG,YAAY,CAAC,sBAAsB,CAAC,CAAC;IACrF;;OAEG;eACQ,OAAO;IAClB;;OAEG;WACI,OAAO;IACd;;;OAGG;eACQ,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI;IACrC;;;;OAIG;uBACgB,QAAQ,GAAG,MAAM;IACpC;;OAEG;oBACa,MAAM;IACtB;;OAEG;oBACa,OAAO,GAAG,KAAK;IAC/B;;OAEG;WACI,eAAe;eAIX,gBAAgB,CAAC,MAAM,CAAC;IACnC;;;;OAIG;WACI,qBAAqB;;+IAiCzB,eAAe;;;~~8IAoTjB~~,yBAAyB,GAAG,0BAA0B;;;;;;;;;CAkJvD,CAAA"}
1	+ {"version":3,"file":"ActionMenu.d.ts","sourceRoot":"","sources":["../../src/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"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"}

package/esm/ActionMenu/ActionMenu.js CHANGED Viewed

@@ -147,7 +147,6 @@ var O = {
 		href: n,
 		className: e(d["ActionMenu__innerButton--split-button"], d[`ActionMenu__innerButton--${h}`], d[`ActionMenu__innerButton--${u}`], c && d["ActionMenu__innerButton--disabled"]),
 		variant: h,
-		hasArrow: !1,
 		"aria-disabled": c,
 		"data-testid": s || O.button,
 		size: u,
@@ -161,7 +160,6 @@ var O = {
 		as: "button",
 		className: d["ActionMenu__innerButton--split-button"],
 		variant: h,
-		hasArrow: !1,
 		"aria-haspopup": "true",
 		"aria-label": "Menu",
 		size: u,
@@ -169,12 +167,11 @@ var O = {
 		onClick: p,
 		disabled: c,
 		...g,
-		children: /* @__PURE__ */ w(i, {})
+		children: /* @__PURE__ */ w(i, { className: d["ActionMenu__inner-button-dropdown-icon"] })
 	})]
 }) : /* @__PURE__ */ w(a, {
 	ref: _,
 	className: e(d.ActionMenu__button, d[`ActionMenu__button--${u}`], o),
-	hasArrow: !1,
 	"aria-haspopup": "true",
 	"aria-expanded": l ? "true" : "false",
 	disabled: c,

package/esm/ActionMenu/ActionMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionMenu.js","names":[],"sources":["../../src/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, {\n Children,\n isValidElement,\n cloneElement,\n useRef,\n useCallback,\n useState,\n useEffect,\n PropsWithChildren,\n forwardRef,\n memo,\n ReactElement,\n useMemo,\n} from 'react'\nimport {Button, ButtonProps, Text, ThemeProvider, useTheme} from '../'\nimport {useAnchoredPosition} from '../hooks/useAnchoredPosition'\nimport {useOnClickOutside} from '../hooks/useOnClickOutside'\nimport {useKeyboardEscape} from '../hooks/useKeyboardEscape'\n\nimport {clsx} from 'clsx'\nimport {CheckIcon, ChevronDownIcon, type Icon} from '@primer/octicons-react'\nimport {useId} from '../hooks/useId'\n\nimport {FocusKeys, type PositionSettings, focusZone} from '@primer/behaviors'\nimport type {BaseProps} from '../component-helpers'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './ActionMenu.module.css'\n\nconst testIds = {\n root: 'ActionMenu',\n get button() {\n return `${this.root}-button`\n },\n get overlay() {\n return `${this.root}-overlay`\n },\n get list() {\n return `${this.root}-list`\n },\n get item() {\n return `${this.root}-list-item`\n },\n}\n\n// primer behaviors doesn't export these values, recreating manually\n// https://github.com/primer/behaviors/blob/main/src/anchored-position.ts#L5\nexport const actionMenuOverlaySides = [\n 'inside-top',\n 'inside-bottom',\n 'inside-left',\n 'inside-right',\n 'inside-center',\n 'outside-top',\n 'outside-bottom',\n 'outside-left',\n 'outside-right',\n] as PositionSettings['side'][]\n\nexport const ActionMenuSizes = ['small', 'medium'] as const\n\nexport const ActionMenuButtonModes = ['default', 'split-button'] as const\nexport type ActionMenuButtonModes = (typeof ActionMenuButtonModes)[number]\n\nexport type ActionMenuSizes = (typeof ActionMenuSizes)[number]\n\nexport type ActionMenuProps = {\n /\n The content of the ActionMenu. Must be an ActionMenu.Button and an ActionMenu.Overlay\n /\n children:\n \| ReactElement<ActionMenuButtonProps>\n \| ReactElement<ActionMenuOverlayProps>\n \| Array<ReactElement<ActionMenuButtonProps> \| ReactElement<ActionMenuOverlayProps>>\n /\n Determines whether the ActionMenu is disabled\n /\n disabled?: boolean\n /\n Determines whether the ActionMenu is open by default\n /\n open?: boolean\n /\n Callback that is called when an item is selected.\n * The value of the selected item is passed as an argument.\n /\n onSelect?: (newValue: string) => void\n /\n The selection variant of the ActionMenu.\n * - `single`: Only one item can be selected at a time. Menu items as a menuitemradio.\n * - `none`: No items can be selected. Menu items as a menuitem.\n /\n selectionVariant?: 'single' \| 'none'\n /\n Test id for the ActionMenu\n /\n 'data-testid'?: string\n /\n Horizontal alignment of the menu relative to the bottom of the button\n /\n menuAlignment?: 'start' \| 'end'\n /\n Size configuratin of the ActionMenu\n /\n size?: ActionMenuSizes\n /\n * Side the menu overlay appears\n /\n menuSide?: PositionSettings['side']\n /\n Alternative behavior for the button and menu items\n * - `default`: The button and menu items behave as a standard button and menu item.\n * - `split-button`: The button behaves as a split button, and the menu items behave as links.\n /\n mode?: ActionMenuButtonModes\n} & BaseProps<HTMLDivElement>\n\ntype ActionMenuContextType = {\n size?: ActionMenuSizes\n setSize?: React.Dispatch<React.SetStateAction<ActionMenuSizes \| undefined>>\n}\n\nconst ActionMenuContext = React.createContext<ActionMenuContextType>({})\n\nexport const useActionMenuContext = (): ActionMenuContextType => {\n return React.useContext(ActionMenuContext)\n}\n\nexport const ActionMenuProvider: React.FC<ActionMenuProps> = ({size, children}) => {\n const [currentSize, setSize] = useState(size)\n\n return <ActionMenuContext.Provider value={{size: currentSize, setSize}}>{children}</ActionMenuContext.Provider>\n}\n\nconst _ActionMenuRoot = memo(\n ({\n id,\n children,\n 'data-testid': testId,\n disabled,\n open = false,\n selectionVariant = 'none',\n menuAlignment = 'end',\n size = 'medium',\n menuSide,\n onSelect,\n mode = 'default',\n }: ActionMenuProps) => {\n const [showMenu, setShowMenu] = useState(open)\n const floatingElementRef = useRef<HTMLUListElement>(null)\n const anchorElementRef = useRef<HTMLButtonElement>(null)\n const instanceId = useId(id)\n\n useOnClickOutside(floatingElementRef, () => setShowMenu(false), anchorElementRef)\n\n const closeMenuCallback = useCallback(() => {\n setShowMenu(false)\n }, [])\n\n useKeyboardEscape(closeMenuCallback)\n\n const toggleMenu = useCallback(() => {\n setShowMenu(!showMenu)\n }, [showMenu])\n\n const handleOnSelect = useCallback(\n (newValue: string) => {\n if (onSelect) onSelect(newValue)\n toggleMenu()\n },\n [onSelect, toggleMenu],\n )\n\n const handleItemSelection = useCallback(\n (newValue: string) => {\n handleOnSelect(newValue)\n toggleMenu()\n anchorElementRef.current?.focus()\n },\n [handleOnSelect, toggleMenu, anchorElementRef],\n )\n\n useEffect(() => {\n if (showMenu && floatingElementRef.current) {\n const floatingElement = floatingElementRef.current\n const isSplitLayout = mode === 'split-button'\n const splitLayoutFilter = isSplitLayout ? element => element.tagName === 'A' : undefined\n\n focusZone(floatingElementRef.current, {\n bindKeys: FocusKeys.ArrowVertical,\n focusableElementFilter: splitLayoutFilter,\n focusInStrategy: isSplitLayout ? 'first' : undefined,\n })\n\n // enter selects item\n floatingElement.addEventListener('keydown', event => {\n if (event.key === 'Enter') {\n const target = event.target as HTMLElement\n\n // Get the proper element containing the data-value\n const targetElement = target.tagName === 'A' ? target.closest('li') : target\n\n if (!targetElement \|\| targetElement.getAttribute('aria-disabled') === 'true') return\n\n const value = targetElement.getAttribute('data-value')\n if (value) {\n handleOnSelect(value)\n setShowMenu(false)\n setTimeout(() => {\n anchorElementRef.current?.focus()\n }, 10)\n }\n }\n })\n\n const targetSelector = isSplitLayout ? 'a' : 'li'\n\n // focusses first item\n const firstItem = floatingElementRef.current.querySelector(targetSelector)\n if (firstItem) {\n setTimeout(() => {\n firstItem.focus()\n }, 10)\n }\n\n const lastItem =\n floatingElement.querySelectorAll(targetSelector)[floatingElement.querySelectorAll(targetSelector).length - 1]\n lastItem.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'ArrowDown') {\n keyboardEvent.preventDefault()\n firstItem?.focus()\n }\n })\n\n firstItem?.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'ArrowUp') {\n keyboardEvent.preventDefault()\n lastItem.focus()\n }\n })\n\n //on escape refocus\n floatingElement.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'Escape') {\n anchorElementRef.current?.focus()\n }\n })\n }\n }, [showMenu, floatingElementRef, mode, handleItemSelection, toggleMenu, handleOnSelect])\n\n // Calculate the position of the menu\n const {position} = useAnchoredPosition(\n {\n floatingElementRef,\n anchorElementRef,\n align: menuAlignment,\n allowOutOfBounds: true,\n side: menuSide,\n },\n [showMenu],\n )\n\n const {Button: SelectButton, Overlay: SelectOverlay} = Children.toArray(children).reduce<{\n Button?: ReactElement<ActionMenuButtonProps>\n Overlay?: ReactElement<ActionMenuOverlayProps>\n }>((acc, child) => {\n if (isValidElement<ActionMenuButtonProps>(child) && child.type === ActionMenuButton) {\n acc.Button = cloneElement(child, {\n onClick: toggleMenu,\n ref: anchorElementRef as React.RefObject<HTMLButtonElement>,\n className: clsx(child.props.className, styles[`ActionMenu__button--${mode}`], showMenu),\n menuOpen: showMenu,\n disabled,\n id: `${instanceId}-button`,\n size,\n _mode: mode,\n })\n } else if (isValidElement<ActionMenuOverlayProps>(child) && child.type === ActionMenuOverlay) {\n acc.Overlay = cloneElement(child, {\n ref: floatingElementRef as React.RefObject<HTMLUListElement>,\n className: clsx(\n styles.ActionMenu__menu,\n position && styles['ActionMenu__menu--visible'],\n position && styles[`ActionMenu__menu--pos-${position.anchorSide}`],\n styles[`ActionMenu__menu--${size}`],\n mode === 'split-button' && 'ActionMenu__menu--split',\n ),\n style: {\n top: `${position?.top ?? 0}px`,\n left: `${position?.left ?? 0}px`,\n },\n id: `${instanceId}-menu`,\n children: Children.map(child.props.children, item => {\n if (isValidElement<ActionMenuItemBaseProps>(item)) {\n return cloneElement(item, {\n handler: handleItemSelection,\n type: mode === 'split-button' ? 'link' : selectionVariant,\n })\n }\n return item\n }),\n })\n }\n return acc\n }, {})\n\n return (\n <ActionMenuProvider size={size}>\n <div\n id={instanceId}\n className={clsx(styles.ActionMenu, disabled && styles['ActionMenu--disabled'])}\n data-testid={testId \|\| testIds.root}\n >\n {SelectButton}\n {showMenu ? SelectOverlay : null}\n </div>\n </ActionMenuProvider>\n )\n },\n)\n\ntype ActionMenuButtonProps = PropsWithChildren<\n BaseProps<HTMLButtonElement> & Pick<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' \| 'disabled' \| 'onClick'>\n> & {\n as?: ButtonProps<'a'>['as']\n href?: ButtonProps<'a'>['href']\n menuOpen?: boolean\n 'data-testid'?: string\n size?: ActionMenuSizes\n _mode?: ActionMenuButtonModes\n variant?: ButtonProps<'a'>['variant']\n leadingVisual?: ButtonProps<'a'>['leadingVisual']\n}\n\nconst ActionMenuButton = forwardRef<HTMLButtonElement, ActionMenuButtonProps>(\n (\n {\n as,\n href,\n children,\n className,\n 'data-testid': testId,\n disabled,\n menuOpen,\n size,\n _mode = 'default',\n onClick,\n leadingVisual,\n variant = 'primary',\n ...props\n },\n ref,\n ) => {\n if (_mode === 'split-button') {\n return (\n <div className={clsx(styles.ActionMenu__button, styles[`ActionMenu__button--${size}`], className)}>\n <Button\n as={as}\n href={href}\n className={clsx(\n styles['ActionMenu__innerButton--split-button'],\n styles[`ActionMenu__innerButton--${variant}`],\n styles[`ActionMenu__innerButton--${size}`],\n disabled && styles['ActionMenu__innerButton--disabled'],\n )}\n variant={variant}\n hasArrow={false}\n aria-disabled={disabled}\n data-testid={testId \|\| testIds.button}\n size={size}\n leadingVisual={leadingVisual}\n >\n <span className={styles['ActionMenu__button-text']}>{children}</span>\n </Button>\n <Button\n ref={ref}\n as=\"button\"\n className={styles['ActionMenu__innerButton--split-button']}\n variant={variant}\n hasArrow={false}\n aria-haspopup=\"true\"\n aria-label=\"Menu\"\n size={size}\n aria-expanded={menuOpen ? 'true' : 'false'}\n onClick={onClick}\n disabled={disabled}\n {...props}\n >\n <ChevronDownIcon />\n </Button>\n </div>\n )\n }\n\n return (\n <Button\n ref={ref}\n className={clsx(styles.ActionMenu__button, styles[`ActionMenu__button--${size}`], className)}\n hasArrow={false}\n aria-haspopup=\"true\"\n aria-expanded={menuOpen ? 'true' : 'false'}\n disabled={disabled}\n data-testid={testId \|\| testIds.button}\n size={size}\n trailingVisual={<ChevronDownIcon />}\n onClick={onClick}\n {...props}\n >\n <span className={styles['ActionMenu__button-text']}>{children}</span>\n </Button>\n )\n },\n)\n\ntype ActionMenuItemBaseProps = {\n handler?: (newValue: string) => void\n type?: 'none' \| 'single' \| 'link'\n disabled?: boolean\n size?: ActionMenuSizes\n leadingVisual?: React.ReactElement \| React.ReactNode \| Icon\n} & PropsWithChildren<React.HTMLProps<HTMLLIElement>>\n\ntype ActionMenuItemAnchorProps = ActionMenuItemBaseProps & {\n as: 'a'\n} & Omit<React.HTMLProps<HTMLAnchorElement>, keyof ActionMenuItemBaseProps \| 'as'>\n\n// Type for when 'as' is not set or is anything other than 'a'\ntype ActionMenuItemDefaultProps = ActionMenuItemBaseProps & {\n as?: string\n value?: string\n selected?: boolean\n} & Omit<React.HTMLProps<HTMLLIElement>, keyof ActionMenuItemBaseProps \| 'as'>\n\nconst roleTypeMap = {\n none: 'menuitem',\n single: 'menuitemradio',\n link: 'menuitem',\n}\n\nconst ActionMenuItem = ({\n as,\n children,\n className,\n disabled,\n handler,\n selected,\n type,\n value,\n onClick,\n onKeyDown,\n leadingVisual: LeadingVisual,\n ...props\n}: ActionMenuItemAnchorProps \| ActionMenuItemDefaultProps) => {\n const {size} = useActionMenuContext()\n\n const handleClick = useCallback(\n (e: React.MouseEvent<HTMLLIElement>) => {\n onClick?.(e)\n\n if (!disabled) {\n handler?.(String(value))\n }\n },\n [handler, value, disabled, onClick],\n )\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLLIElement>) => {\n onKeyDown?.(e)\n\n if (!disabled && e.key === 'Enter') {\n handler?.(String(value))\n }\n },\n [handler, value, disabled, onKeyDown],\n )\n\n const liProps = useMemo<React.HTMLProps<HTMLLIElement> & {'data-value': unknown}>(\n () => ({\n className: clsx(\n styles.ActionMenu__item,\n type === 'single' && styles[`ActionMenu__item--selection-type-${type}`],\n size && styles[`ActionMenu__item--${size}`],\n className,\n ),\n role: roleTypeMap[type \|\| 'single'],\n 'aria-disabled': disabled,\n tabIndex: -1,\n 'data-value': value,\n ...props,\n }),\n [props, type, size, className, disabled, value],\n )\n\n const contents = useMemo(\n () => (\n <>\n {React.isValidElement<{width?: number; height?: number}>(LeadingVisual)\n ? React.cloneElement(LeadingVisual, {\n width: LeadingVisual.props.width \|\| 20,\n height: LeadingVisual.props.width \|\| 20,\n })\n : null}\n {type === 'single' && (\n <span className={styles['ActionMenu__item-leadingVisual']}>\n {selected && (\n <CheckIcon\n className={clsx(styles['ActionMenu__item-icon'], disabled && styles['ActionMenu__item-icon--disabled'])}\n size={16}\n />\n )}\n </span>\n )}\n\n <span className={styles['ActionMenu__item-text']}>\n <Text\n variant={disabled ? 'muted' : 'default'}\n size={size === 'medium' ? '200' : '100'}\n className={clsx(disabled && styles['ActionMenu__item-content--disabled'])}\n >\n {children}\n </Text>\n </span>\n </>\n ),\n [LeadingVisual, children, selected, disabled, size, type],\n )\n\n if (as === 'a') {\n return (\n <li\n // This role will be overridden by the role prop in `liProps`. It's just here to keep the linter happy\n role=\"menuitem\"\n {...liProps}\n // Intentionally not calling handle[Click/KeyDown] here so as to not call the handler\n onClick={onClick}\n onKeyDown={onKeyDown}\n >\n <a\n className={clsx(styles['ActionMenu__item-anchor'], disabled && styles['ActionMenu__item--disabled'])}\n href={props.href}\n >\n {contents}\n </a>\n </li>\n )\n }\n\n return (\n // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n <li\n // This role will be overridden by the role prop in `liProps`. It's just here to keep the linter happy\n role=\"menuitem\"\n {...liProps}\n aria-checked={type === 'none' ? undefined : selected ? 'true' : 'false'}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n >\n {contents}\n </li>\n )\n}\n\ntype ActionMenuOverlayProps = PropsWithChildren<\n BaseProps<HTMLUListElement> & React.HTMLAttributes<HTMLUListElement>\n> & {\n 'aria-label': string\n id?: string\n 'data-testid'?: string\n menuOpen?: boolean\n style?: React.CSSProperties\n}\n\nconst ActionMenuOverlay = forwardRef<HTMLUListElement, ActionMenuOverlayProps>(\n ({children, className, 'data-testid': testId, menuOpen, ...rest}, ref) => {\n const {colorMode: defaultColorMode} = useTheme()\n\n const colorMode = className?.includes('ActionMenu__menu--split') ? 'light' : defaultColorMode\n\n return (\n <ThemeProvider colorMode={colorMode}>\n <ul ref={ref} className={clsx(className)} role=\"menu\" data-testid={testId \|\| testIds.list} {...rest}>\n {children}\n </ul>\n </ThemeProvider>\n )\n },\n)\n\n/\n Use ActionMenu to display a list of actions or selections that expand through a trigger button.\n * @see https://primer.style/brand/components/ActionMenu\n */\nexport const ActionMenu = Object.assign(_ActionMenuRoot, {\n Button: ActionMenuButton,\n Item: ActionMenuItem,\n Overlay: ActionMenuOverlay,\n testIds,\n})\n"],"mappings":"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"}
1	+ {"version":3,"file":"ActionMenu.js","names":[],"sources":["../../src/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, {\n Children,\n isValidElement,\n cloneElement,\n useRef,\n useCallback,\n useState,\n useEffect,\n PropsWithChildren,\n forwardRef,\n memo,\n ReactElement,\n useMemo,\n} from 'react'\nimport {Button, ButtonProps, Text, ThemeProvider, useTheme} from '../'\nimport {useAnchoredPosition} from '../hooks/useAnchoredPosition'\nimport {useOnClickOutside} from '../hooks/useOnClickOutside'\nimport {useKeyboardEscape} from '../hooks/useKeyboardEscape'\n\nimport {clsx} from 'clsx'\nimport {CheckIcon, ChevronDownIcon, type Icon} from '@primer/octicons-react'\nimport {useId} from '../hooks/useId'\n\nimport {FocusKeys, type PositionSettings, focusZone} from '@primer/behaviors'\nimport type {BaseProps} from '../component-helpers'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './ActionMenu.module.css'\n\nconst testIds = {\n root: 'ActionMenu',\n get button() {\n return `${this.root}-button`\n },\n get overlay() {\n return `${this.root}-overlay`\n },\n get list() {\n return `${this.root}-list`\n },\n get item() {\n return `${this.root}-list-item`\n },\n}\n\n// primer behaviors doesn't export these values, recreating manually\n// https://github.com/primer/behaviors/blob/main/src/anchored-position.ts#L5\nexport const actionMenuOverlaySides = [\n 'inside-top',\n 'inside-bottom',\n 'inside-left',\n 'inside-right',\n 'inside-center',\n 'outside-top',\n 'outside-bottom',\n 'outside-left',\n 'outside-right',\n] as PositionSettings['side'][]\n\nexport const ActionMenuSizes = ['small', 'medium'] as const\n\nexport const ActionMenuButtonModes = ['default', 'split-button'] as const\nexport type ActionMenuButtonModes = (typeof ActionMenuButtonModes)[number]\n\nexport type ActionMenuSizes = (typeof ActionMenuSizes)[number]\n\nexport type ActionMenuProps = {\n /\n The content of the ActionMenu. Must be an ActionMenu.Button and an ActionMenu.Overlay\n /\n children:\n \| ReactElement<ActionMenuButtonProps>\n \| ReactElement<ActionMenuOverlayProps>\n \| Array<ReactElement<ActionMenuButtonProps> \| ReactElement<ActionMenuOverlayProps>>\n /\n Determines whether the ActionMenu is disabled\n /\n disabled?: boolean\n /\n Determines whether the ActionMenu is open by default\n /\n open?: boolean\n /\n Callback that is called when an item is selected.\n * The value of the selected item is passed as an argument.\n /\n onSelect?: (newValue: string) => void\n /\n The selection variant of the ActionMenu.\n * - `single`: Only one item can be selected at a time. Menu items as a menuitemradio.\n * - `none`: No items can be selected. Menu items as a menuitem.\n /\n selectionVariant?: 'single' \| 'none'\n /\n Test id for the ActionMenu\n /\n 'data-testid'?: string\n /\n Horizontal alignment of the menu relative to the bottom of the button\n /\n menuAlignment?: 'start' \| 'end'\n /\n Size configuratin of the ActionMenu\n /\n size?: ActionMenuSizes\n /\n * Side the menu overlay appears\n /\n menuSide?: PositionSettings['side']\n /\n Alternative behavior for the button and menu items\n * - `default`: The button and menu items behave as a standard button and menu item.\n * - `split-button`: The button behaves as a split button, and the menu items behave as links.\n /\n mode?: ActionMenuButtonModes\n} & BaseProps<HTMLDivElement>\n\ntype ActionMenuContextType = {\n size?: ActionMenuSizes\n setSize?: React.Dispatch<React.SetStateAction<ActionMenuSizes \| undefined>>\n}\n\nconst ActionMenuContext = React.createContext<ActionMenuContextType>({})\n\nexport const useActionMenuContext = (): ActionMenuContextType => {\n return React.useContext(ActionMenuContext)\n}\n\nexport const ActionMenuProvider: React.FC<ActionMenuProps> = ({size, children}) => {\n const [currentSize, setSize] = useState(size)\n\n return <ActionMenuContext.Provider value={{size: currentSize, setSize}}>{children}</ActionMenuContext.Provider>\n}\n\nconst _ActionMenuRoot = memo(\n ({\n id,\n children,\n 'data-testid': testId,\n disabled,\n open = false,\n selectionVariant = 'none',\n menuAlignment = 'end',\n size = 'medium',\n menuSide,\n onSelect,\n mode = 'default',\n }: ActionMenuProps) => {\n const [showMenu, setShowMenu] = useState(open)\n const floatingElementRef = useRef<HTMLUListElement>(null)\n const anchorElementRef = useRef<HTMLButtonElement>(null)\n const instanceId = useId(id)\n\n useOnClickOutside(floatingElementRef, () => setShowMenu(false), anchorElementRef)\n\n const closeMenuCallback = useCallback(() => {\n setShowMenu(false)\n }, [])\n\n useKeyboardEscape(closeMenuCallback)\n\n const toggleMenu = useCallback(() => {\n setShowMenu(!showMenu)\n }, [showMenu])\n\n const handleOnSelect = useCallback(\n (newValue: string) => {\n if (onSelect) onSelect(newValue)\n toggleMenu()\n },\n [onSelect, toggleMenu],\n )\n\n const handleItemSelection = useCallback(\n (newValue: string) => {\n handleOnSelect(newValue)\n toggleMenu()\n anchorElementRef.current?.focus()\n },\n [handleOnSelect, toggleMenu, anchorElementRef],\n )\n\n useEffect(() => {\n if (showMenu && floatingElementRef.current) {\n const floatingElement = floatingElementRef.current\n const isSplitLayout = mode === 'split-button'\n const splitLayoutFilter = isSplitLayout ? element => element.tagName === 'A' : undefined\n\n focusZone(floatingElementRef.current, {\n bindKeys: FocusKeys.ArrowVertical,\n focusableElementFilter: splitLayoutFilter,\n focusInStrategy: isSplitLayout ? 'first' : undefined,\n })\n\n // enter selects item\n floatingElement.addEventListener('keydown', event => {\n if (event.key === 'Enter') {\n const target = event.target as HTMLElement\n\n // Get the proper element containing the data-value\n const targetElement = target.tagName === 'A' ? target.closest('li') : target\n\n if (!targetElement \|\| targetElement.getAttribute('aria-disabled') === 'true') return\n\n const value = targetElement.getAttribute('data-value')\n if (value) {\n handleOnSelect(value)\n setShowMenu(false)\n setTimeout(() => {\n anchorElementRef.current?.focus()\n }, 10)\n }\n }\n })\n\n const targetSelector = isSplitLayout ? 'a' : 'li'\n\n // focusses first item\n const firstItem = floatingElementRef.current.querySelector(targetSelector)\n if (firstItem) {\n setTimeout(() => {\n firstItem.focus()\n }, 10)\n }\n\n const lastItem =\n floatingElement.querySelectorAll(targetSelector)[floatingElement.querySelectorAll(targetSelector).length - 1]\n lastItem.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'ArrowDown') {\n keyboardEvent.preventDefault()\n firstItem?.focus()\n }\n })\n\n firstItem?.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'ArrowUp') {\n keyboardEvent.preventDefault()\n lastItem.focus()\n }\n })\n\n //on escape refocus\n floatingElement.addEventListener('keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent\n if (keyboardEvent.key === 'Escape') {\n anchorElementRef.current?.focus()\n }\n })\n }\n }, [showMenu, floatingElementRef, mode, handleItemSelection, toggleMenu, handleOnSelect])\n\n // Calculate the position of the menu\n const {position} = useAnchoredPosition(\n {\n floatingElementRef,\n anchorElementRef,\n align: menuAlignment,\n allowOutOfBounds: true,\n side: menuSide,\n },\n [showMenu],\n )\n\n const {Button: SelectButton, Overlay: SelectOverlay} = Children.toArray(children).reduce<{\n Button?: ReactElement<ActionMenuButtonProps>\n Overlay?: ReactElement<ActionMenuOverlayProps>\n }>((acc, child) => {\n if (isValidElement<ActionMenuButtonProps>(child) && child.type === ActionMenuButton) {\n acc.Button = cloneElement(child, {\n onClick: toggleMenu,\n ref: anchorElementRef as React.RefObject<HTMLButtonElement>,\n className: clsx(child.props.className, styles[`ActionMenu__button--${mode}`], showMenu),\n menuOpen: showMenu,\n disabled,\n id: `${instanceId}-button`,\n size,\n _mode: mode,\n })\n } else if (isValidElement<ActionMenuOverlayProps>(child) && child.type === ActionMenuOverlay) {\n acc.Overlay = cloneElement(child, {\n ref: floatingElementRef as React.RefObject<HTMLUListElement>,\n className: clsx(\n styles.ActionMenu__menu,\n position && styles['ActionMenu__menu--visible'],\n position && styles[`ActionMenu__menu--pos-${position.anchorSide}`],\n styles[`ActionMenu__menu--${size}`],\n mode === 'split-button' && 'ActionMenu__menu--split',\n ),\n style: {\n top: `${position?.top ?? 0}px`,\n left: `${position?.left ?? 0}px`,\n },\n id: `${instanceId}-menu`,\n children: Children.map(child.props.children, item => {\n if (isValidElement<ActionMenuItemBaseProps>(item)) {\n return cloneElement(item, {\n handler: handleItemSelection,\n type: mode === 'split-button' ? 'link' : selectionVariant,\n })\n }\n return item\n }),\n })\n }\n return acc\n }, {})\n\n return (\n <ActionMenuProvider size={size}>\n <div\n id={instanceId}\n className={clsx(styles.ActionMenu, disabled && styles['ActionMenu--disabled'])}\n data-testid={testId \|\| testIds.root}\n >\n {SelectButton}\n {showMenu ? SelectOverlay : null}\n </div>\n </ActionMenuProvider>\n )\n },\n)\n\ntype ActionMenuButtonProps = PropsWithChildren<\n BaseProps<HTMLButtonElement> & Pick<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' \| 'disabled' \| 'onClick'>\n> & {\n as?: ButtonProps<'a'>['as']\n href?: ButtonProps<'a'>['href']\n menuOpen?: boolean\n 'data-testid'?: string\n size?: ActionMenuSizes\n _mode?: ActionMenuButtonModes\n variant?: ButtonProps<'a'>['variant']\n leadingVisual?: ButtonProps<'a'>['leadingVisual']\n}\n\nconst ActionMenuButton = forwardRef<HTMLButtonElement, ActionMenuButtonProps>(\n (\n {\n as,\n href,\n children,\n className,\n 'data-testid': testId,\n disabled,\n menuOpen,\n size,\n _mode = 'default',\n onClick,\n leadingVisual,\n variant = 'primary',\n ...props\n },\n ref,\n ) => {\n if (_mode === 'split-button') {\n return (\n <div className={clsx(styles.ActionMenu__button, styles[`ActionMenu__button--${size}`], className)}>\n <Button\n as={as}\n href={href}\n className={clsx(\n styles['ActionMenu__innerButton--split-button'],\n styles[`ActionMenu__innerButton--${variant}`],\n styles[`ActionMenu__innerButton--${size}`],\n disabled && styles['ActionMenu__innerButton--disabled'],\n )}\n variant={variant}\n aria-disabled={disabled}\n data-testid={testId \|\| testIds.button}\n size={size}\n leadingVisual={leadingVisual}\n >\n <span className={styles['ActionMenu__button-text']}>{children}</span>\n </Button>\n <Button\n ref={ref}\n as=\"button\"\n className={styles['ActionMenu__innerButton--split-button']}\n variant={variant}\n aria-haspopup=\"true\"\n aria-label=\"Menu\"\n size={size}\n aria-expanded={menuOpen ? 'true' : 'false'}\n onClick={onClick}\n disabled={disabled}\n {...props}\n >\n <ChevronDownIcon className={styles['ActionMenu__inner-button-dropdown-icon']} />\n </Button>\n </div>\n )\n }\n\n return (\n <Button\n ref={ref}\n className={clsx(styles.ActionMenu__button, styles[`ActionMenu__button--${size}`], className)}\n aria-haspopup=\"true\"\n aria-expanded={menuOpen ? 'true' : 'false'}\n disabled={disabled}\n data-testid={testId \|\| testIds.button}\n size={size}\n trailingVisual={<ChevronDownIcon />}\n onClick={onClick}\n {...props}\n >\n <span className={styles['ActionMenu__button-text']}>{children}</span>\n </Button>\n )\n },\n)\n\ntype ActionMenuItemBaseProps = {\n handler?: (newValue: string) => void\n type?: 'none' \| 'single' \| 'link'\n disabled?: boolean\n size?: ActionMenuSizes\n leadingVisual?: React.ReactElement \| React.ReactNode \| Icon\n} & PropsWithChildren<React.HTMLProps<HTMLLIElement>>\n\ntype ActionMenuItemAnchorProps = ActionMenuItemBaseProps & {\n as: 'a'\n} & Omit<React.HTMLProps<HTMLAnchorElement>, keyof ActionMenuItemBaseProps \| 'as'>\n\n// Type for when 'as' is not set or is anything other than 'a'\ntype ActionMenuItemDefaultProps = ActionMenuItemBaseProps & {\n as?: string\n value?: string\n selected?: boolean\n} & Omit<React.HTMLProps<HTMLLIElement>, keyof ActionMenuItemBaseProps \| 'as'>\n\nconst roleTypeMap = {\n none: 'menuitem',\n single: 'menuitemradio',\n link: 'menuitem',\n}\n\nconst ActionMenuItem = ({\n as,\n children,\n className,\n disabled,\n handler,\n selected,\n type,\n value,\n onClick,\n onKeyDown,\n leadingVisual: LeadingVisual,\n ...props\n}: ActionMenuItemAnchorProps \| ActionMenuItemDefaultProps) => {\n const {size} = useActionMenuContext()\n\n const handleClick = useCallback(\n (e: React.MouseEvent<HTMLLIElement>) => {\n onClick?.(e)\n\n if (!disabled) {\n handler?.(String(value))\n }\n },\n [handler, value, disabled, onClick],\n )\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLLIElement>) => {\n onKeyDown?.(e)\n\n if (!disabled && e.key === 'Enter') {\n handler?.(String(value))\n }\n },\n [handler, value, disabled, onKeyDown],\n )\n\n const liProps = useMemo<React.HTMLProps<HTMLLIElement> & {'data-value': unknown}>(\n () => ({\n className: clsx(\n styles.ActionMenu__item,\n type === 'single' && styles[`ActionMenu__item--selection-type-${type}`],\n size && styles[`ActionMenu__item--${size}`],\n className,\n ),\n role: roleTypeMap[type \|\| 'single'],\n 'aria-disabled': disabled,\n tabIndex: -1,\n 'data-value': value,\n ...props,\n }),\n [props, type, size, className, disabled, value],\n )\n\n const contents = useMemo(\n () => (\n <>\n {React.isValidElement<{width?: number; height?: number}>(LeadingVisual)\n ? React.cloneElement(LeadingVisual, {\n width: LeadingVisual.props.width \|\| 20,\n height: LeadingVisual.props.width \|\| 20,\n })\n : null}\n {type === 'single' && (\n <span className={styles['ActionMenu__item-leadingVisual']}>\n {selected && (\n <CheckIcon\n className={clsx(styles['ActionMenu__item-icon'], disabled && styles['ActionMenu__item-icon--disabled'])}\n size={16}\n />\n )}\n </span>\n )}\n\n <span className={styles['ActionMenu__item-text']}>\n <Text\n variant={disabled ? 'muted' : 'default'}\n size={size === 'medium' ? '200' : '100'}\n className={clsx(disabled && styles['ActionMenu__item-content--disabled'])}\n >\n {children}\n </Text>\n </span>\n </>\n ),\n [LeadingVisual, children, selected, disabled, size, type],\n )\n\n if (as === 'a') {\n return (\n <li\n // This role will be overridden by the role prop in `liProps`. It's just here to keep the linter happy\n role=\"menuitem\"\n {...liProps}\n // Intentionally not calling handle[Click/KeyDown] here so as to not call the handler\n onClick={onClick}\n onKeyDown={onKeyDown}\n >\n <a\n className={clsx(styles['ActionMenu__item-anchor'], disabled && styles['ActionMenu__item--disabled'])}\n href={props.href}\n >\n {contents}\n </a>\n </li>\n )\n }\n\n return (\n // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n <li\n // This role will be overridden by the role prop in `liProps`. It's just here to keep the linter happy\n role=\"menuitem\"\n {...liProps}\n aria-checked={type === 'none' ? undefined : selected ? 'true' : 'false'}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n >\n {contents}\n </li>\n )\n}\n\ntype ActionMenuOverlayProps = PropsWithChildren<\n BaseProps<HTMLUListElement> & React.HTMLAttributes<HTMLUListElement>\n> & {\n 'aria-label': string\n id?: string\n 'data-testid'?: string\n menuOpen?: boolean\n style?: React.CSSProperties\n}\n\nconst ActionMenuOverlay = forwardRef<HTMLUListElement, ActionMenuOverlayProps>(\n ({children, className, 'data-testid': testId, menuOpen, ...rest}, ref) => {\n const {colorMode: defaultColorMode} = useTheme()\n\n const colorMode = className?.includes('ActionMenu__menu--split') ? 'light' : defaultColorMode\n\n return (\n <ThemeProvider colorMode={colorMode}>\n <ul ref={ref} className={clsx(className)} role=\"menu\" data-testid={testId \|\| testIds.list} {...rest}>\n {children}\n </ul>\n </ThemeProvider>\n )\n },\n)\n\n/\n Use ActionMenu to display a list of actions or selections that expand through a trigger button.\n * @see https://primer.style/brand/components/ActionMenu\n */\nexport const ActionMenu = Object.assign(_ActionMenuRoot, {\n Button: ActionMenuButton,\n Item: ActionMenuItem,\n Overlay: ActionMenuOverlay,\n testIds,\n})\n"],"mappings":"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"}

package/esm/ActionMenu/ActionMenu.module-BAeHTqHw.css ADDED Viewed

@@ -0,0 +1 @@

+ .Primer_Brand__ActionMenu-module__ActionMenu___xLxGU{--focus-outline-width:3px;position:relative}.Primer_Brand__ActionMenu-module__ActionMenu--disabled___UsizV{cursor:not-allowed}.Primer_Brand__ActionMenu-module__ActionMenu__button___vFLAF{height:auto}.Primer_Brand__ActionMenu-module__ActionMenu__button--default___heDoV{--brand-borderRadius-medium:var(--brand-borderRadius-full)}.Primer_Brand__ActionMenu-module__ActionMenu__button--small___UAUPB{padding:calc(var(--base-size-4) / 2) var(--base-size-12)}.Primer_Brand__ActionMenu-module__ActionMenu__button--medium___n5ovs{padding:calc(var(--base-size-8) + 2px) var(--base-size-28)}.Primer_Brand__ActionMenu-module__ActionMenu__button___vFLAF>span:first-of-type{max-width:200px;overflow:hidden}.Primer_Brand__ActionMenu-module__ActionMenu__button--split-button___2Grop{border-radius:var(--brand-borderRadius-medium);border:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);background-color:var(--brand-color-canvas-default);padding:0;display:inline-flex}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:first-child,.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:first-child:hover{z-index:1;border-top-right-radius:0;border-bottom-right-radius:0;position:relative}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:first-child:before,.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:hover:first-child:before{content:"";top:calc(var(--base-size-2) / -2);right:calc(var(--base-size-2) * -1);width:var(--brand-borderWidth-thin);height:calc(100% + var(--base-size-2));background-color:var(--brand-color-border-muted);position:absolute}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--subtle___9VQgI.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:before{top:calc(var(--base-size-2) * -1);height:calc(100% + var(--base-size-4))}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--subtle___9VQgI.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:active:first-child:before{width:0}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--medium___C2bJi.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc,.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:last-child{padding:var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal)}.Primer_Brand__ActionMenu-module__ActionMenu__inner-button-dropdown-icon___IGvTk{vertical-align:middle!important}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc:last-child{z-index:0;border-top-left-radius:0;border-bottom-left-radius:0;position:relative}.Primer_Brand__ActionMenu-module__ActionMenu__innerButton--disabled___WrkOb{cursor:not-allowed;pointer-events:none}.Primer_Brand__ActionMenu-module__ActionMenu__menu___BEldF{z-index:100;padding:var(--base-size-12);visibility:hidden;background-color:var(--brand-color-canvas-default);border:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);border-radius:var(--brand-borderRadius-large);min-width:min-content;max-height:460px;position:absolute;overflow-y:auto;box-shadow:0 100px 80px #00000003,0 41px 33px #00000005,0 22px 17px #00000005,0 12px 10px #00000008,0 6px 5px #0000000a,0 2px 2px #00000012}.Primer_Brand__ActionMenu-module__ActionMenu__menu--small___xbb8m{padding:var(--base-size-8)}.Primer_Brand__ActionMenu-module__ActionMenu__menu--medium___3QqgD{padding:var(--base-size-12)}.Primer_Brand__ActionMenu-module__ActionMenu__menu--visible___QzhaX{visibility:visible}.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-bottom___KAAm0{animation:.189s var(--brand-animation-easing-glide) 0s 1 normal none running Primer_Brand__ActionMenu-module__overlay-appear-outside-bottom___egiij}.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-top___4TZek{animation:.189s var(--brand-animation-easing-glide) 0s 1 normal none running Primer_Brand__ActionMenu-module__overlay-appear-outside-top____Ko4E}@keyframes Primer_Brand__ActionMenu-module__overlay-appear-outside-bottom___egiij{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes Primer_Brand__ActionMenu-module__overlay-appear-outside-top____Ko4E{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.Primer_Brand__ActionMenu-module__ActionMenu__menu--medium___3QqgD.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-bottom___KAAm0{margin-block-start:var(--base-size-8)}.Primer_Brand__ActionMenu-module__ActionMenu__menu--medium___3QqgD.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-top___4TZek{margin-block-start:calc(var(--base-size-8) * -1)}.Primer_Brand__ActionMenu-module__ActionMenu__menu--small___xbb8m.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-bottom___KAAm0{margin-block-start:var(--base-size-4)}.Primer_Brand__ActionMenu-module__ActionMenu__menu--small___xbb8m.Primer_Brand__ActionMenu-module__ActionMenu__menu--pos-outside-top___4TZek{margin-block-start:calc(var(--base-size-4) * -1)}.Primer_Brand__ActionMenu-module__ActionMenu__menu___BEldF::-webkit-scrollbar{width:var(--base-size-12)}.Primer_Brand__ActionMenu-module__ActionMenu__menu___BEldF::-webkit-scrollbar-track{border-left:1px solid var(--brand-color-border-muted);border-top-right-radius:var(--brand-borderRadius-large);border-bottom-right-radius:var(--brand-borderRadius-large)}.Primer_Brand__ActionMenu-module__ActionMenu__menu___BEldF::-webkit-scrollbar-thumb{border-radius:var(--brand-borderRadius-medium);border:1px solid var(--brand-color-border-default);background-color:var(--brand-ActionMenu-color-scrollbar-thumb-bg)}.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4{border-radius:var(--brand-borderRadius-medium);flex:1 0 auto;grid-template-columns:min-content 1fr;grid-template-areas:"leadingVisual text";align-items:center;list-style:none;display:grid}.Primer_Brand__ActionMenu-module__ActionMenu__item-anchor___dX7CI{grid-template-columns:subgrid;grid-template-rows:subgrid;grid-gap:var(--base-size-8);align-items:center;gap:var(--base-size-8);color:var(--brand-color-text-default);grid-area:1/1/-1/-1;-webkit-text-decoration:none;text-decoration:none;display:grid}.Primer_Brand__ActionMenu-module__ActionMenu__item-anchor--disabled___Lx1Az{pointer-events:none;cursor:not-allowed}.Primer_Brand__ActionMenu-module__ActionMenu__item-anchor___dX7CI:focus-visible{box-shadow:none;outline:none}.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4:has(.Primer_Brand__ActionMenu-module__ActionMenu__item-anchor___dX7CI:focus-visible){box-shadow:0 0 0 var(--focus-outline-width) var(--brand-color-focus);outline:none;transition:none}.Primer_Brand__ActionMenu-module__ActionMenu__item--medium___YWN8M{padding:var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal);min-height:var(--brand-control-medium-size)}.Primer_Brand__ActionMenu-module__ActionMenu__item--medium___YWN8M:has(.Primer_Brand__ActionMenu-module__ActionMenu__item-anchor___dX7CI){padding:0}.Primer_Brand__ActionMenu-module__ActionMenu__item--medium___YWN8M .Primer_Brand__ActionMenu-module__ActionMenu__item-anchor___dX7CI{padding:var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal)}.Primer_Brand__ActionMenu-module__ActionMenu__item--small___MOwms{padding:var(--base-size-8) var(--brand-control-small-paddingInline-condensed)}.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4[aria-disabled=true]{cursor:not-allowed}.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4:hover:not(.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4[aria-disabled=true]){cursor:pointer;background-color:var(--brand-ActionMenu-color-item-hover)}.Primer_Brand__ActionMenu-module__ActionMenu__item--selection-type-single___Us_p_{padding-right:var(--base-size-48)}.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4:focus-visible{box-shadow:0 0 0 var(--focus-outline-width) var(--brand-color-focus);outline:none;transition:none}.Primer_Brand__ActionMenu-module__ActionMenu__item-leadingVisual___WSTdj{min-width:var(--base-size-16);margin-right:var(--brand-control-medium-gap);color:var(--brand-color-text-default);pointer-events:none;grid-area:leadingVisual;display:flex}.Primer_Brand__ActionMenu-module__ActionMenu__item-text___agGYz{grid-area:text;width:max-content;display:grid}.Primer_Brand__ActionMenu-module__ActionMenu__item-text___agGYz>span{line-height:var(--brand-control-medium-lineBoxHeight)}.Primer_Brand__ActionMenu-module__ActionMenu__item-icon___2a7ve{fill:var(--brand-color-text-default)}.Primer_Brand__ActionMenu-module__ActionMenu__item-content--disabled___rRo6_{color:var(--base-color-scale-gray-3)}.Primer_Brand__ActionMenu-module__ActionMenu__item-icon--disabled___BjIIo{fill:var(--base-color-scale-gray-3)}@media (forced-colors:active){.Primer_Brand__ActionMenu-module__ActionMenu__item___2FZw4:focus-visible{outline:var(--brand-borderWidth-thick) solid Highlight;outline-offset:var(--base-size-2)}}@media (prefers-reduced-motion:reduce){.Primer_Brand__ActionMenu-module__ActionMenu___xLxGU,.Primer_Brand__ActionMenu-module__ActionMenu___xLxGU:before,.Primer_Brand__ActionMenu-module__ActionMenu___xLxGU:after,.Primer_Brand__ActionMenu-module__ActionMenu___xLxGU *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

package/esm/ActionMenu/ActionMenu.module.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import './ActionMenu.module-Km0HNn_2.css';var e = {
+import './ActionMenu.module-BAeHTqHw.css';var e = {
 	ActionMenu: "Primer_Brand__ActionMenu-module__ActionMenu___xLxGU",
 	"ActionMenu--disabled": "Primer_Brand__ActionMenu-module__ActionMenu--disabled___UsizV",
 	ActionMenu__button: "Primer_Brand__ActionMenu-module__ActionMenu__button___vFLAF",
@@ -9,6 +9,7 @@ import './ActionMenu.module-Km0HNn_2.css';var e = {
 	"ActionMenu__innerButton--split-button": "Primer_Brand__ActionMenu-module__ActionMenu__innerButton--split-button___JwpBc",
 	"ActionMenu__innerButton--subtle": "Primer_Brand__ActionMenu-module__ActionMenu__innerButton--subtle___9VQgI",
 	"ActionMenu__innerButton--medium": "Primer_Brand__ActionMenu-module__ActionMenu__innerButton--medium___C2bJi",
+	"ActionMenu__inner-button-dropdown-icon": "Primer_Brand__ActionMenu-module__ActionMenu__inner-button-dropdown-icon___IGvTk",
 	"ActionMenu__innerButton--disabled": "Primer_Brand__ActionMenu-module__ActionMenu__innerButton--disabled___WrkOb",
 	ActionMenu__menu: "Primer_Brand__ActionMenu-module__ActionMenu__menu___BEldF",
 	"ActionMenu__menu--small": "Primer_Brand__ActionMenu-module__ActionMenu__menu--small___xbb8m",

package/esm/ActionMenu/ActionMenu.module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionMenu.module.js","names":[],"sources":["../../src/ActionMenu/ActionMenu.module.css"],"sourcesContent":[".ActionMenu {\n --focus-outline-width: 3px;\n position: relative;\n}\n\n.ActionMenu--disabled {\n cursor: not-allowed;\n}\n\n.ActionMenu__button {\n height: auto;\n}\n\n.ActionMenu__button--default {\n /* avoid specificity issues /\n --brand-borderRadius-medium: var(--brand-borderRadius-full);\n}\n\n.ActionMenu__button--small {\n padding: calc(var(--base-size-4) / 2) var(--base-size-12);\n}\n\n.ActionMenu__button--medium {\n padding: calc(var(--base-size-8) + 2px) var(--base-size-28);\n}\n\n.ActionMenu__button > span:first-of-type {\n max-width: 200px;\n overflow: hidden;\n}\n\n.ActionMenu__button--split-button {\n display: inline-flex;\n padding: 0;\n border-radius: var(--brand-borderRadius-medium);\n border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n background-color: var(--brand-color-canvas-default);\n}\n\n.ActionMenu__innerButton--split-button:first-child,\n.ActionMenu__innerButton--split-button:first-child:hover {\n position: relative;\n z-index: 1;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.ActionMenu__innerButton--split-button:first-child::before,\n.ActionMenu__innerButton--split-button:hover:first-child::before {\n content: '';\n position: absolute;\n top: calc(var(--base-size-2) / -2);\n right: calc(var(--base-size-2) -1);\n width: var(--brand-borderWidth-thin);\n height: calc(100% + var(--base-size-2));\n background-color: var(--brand-color-border-muted);\n}\n\n.ActionMenu__innerButton--subtle.ActionMenu__innerButton--split-button::before {\n top: calc(var(--base-size-2) * -1);\n height: calc(100% + var(--base-size-4));\n}\n\n.ActionMenu__innerButton--subtle.ActionMenu__innerButton--split-button:active:first-child::before {\n width: 0;\n}\n\n.ActionMenu__innerButton--medium.ActionMenu__innerButton--split-button,\n.ActionMenu__innerButton--split-button:last-child {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal); /* Override the default button padding /\n}\n\n.ActionMenu__innerButton--split-button:last-child {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n position: relative;\n z-index: 0;\n}\n\n.ActionMenu__innerButton--disabled {\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.ActionMenu__menu {\n position: absolute;\n z-index: 100;\n padding: var(--base-size-12);\n min-width: min-content;\n visibility: hidden;\n background-color: var(--brand-color-canvas-default);\n border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n border-radius: var(--brand-borderRadius-large);\n max-height: 460px;\n overflow-y: auto;\n box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.01), 0px 41px 33px rgba(0, 0, 0, 0.02), 0px 22px 17px rgba(0, 0, 0, 0.02),\n 0px 12px 10px rgba(0, 0, 0, 0.03), 0px 6px 5px rgba(0, 0, 0, 0.04), 0px 2px 2px rgba(0, 0, 0, 0.07);\n}\n\n.ActionMenu__menu--small {\n padding: var(--base-size-8);\n}\n\n.ActionMenu__menu--medium {\n padding: var(--base-size-12);\n}\n\n.ActionMenu__menu--visible {\n visibility: visible;\n}\n\n.ActionMenu__menu--pos-outside-bottom {\n animation: 189ms var(--brand-animation-easing-glide) 0s 1 normal none running overlay-appear-outside-bottom;\n}\n\n.ActionMenu__menu--pos-outside-top {\n animation: 189ms var(--brand-animation-easing-glide) 0s 1 normal none running overlay-appear-outside-top;\n}\n\n@keyframes overlay-appear-outside-bottom {\n 0% {\n opacity: 0;\n transform: translateY(-10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes overlay-appear-outside-top {\n 0% {\n opacity: 0;\n transform: translateY(10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.ActionMenu__menu--medium.ActionMenu__menu--pos-outside-bottom {\n margin-block-start: var(--base-size-8);\n}\n\n.ActionMenu__menu--medium.ActionMenu__menu--pos-outside-top {\n margin-block-start: calc(var(--base-size-8) -1);\n}\n\n.ActionMenu__menu--small.ActionMenu__menu--pos-outside-bottom {\n margin-block-start: var(--base-size-4);\n}\n\n.ActionMenu__menu--small.ActionMenu__menu--pos-outside-top {\n margin-block-start: calc(var(--base-size-4) * -1);\n}\n\n.ActionMenu__menu::-webkit-scrollbar {\n width: var(--base-size-12);\n}\n\n.ActionMenu__menu::-webkit-scrollbar-track {\n border-left: 1px solid var(--brand-color-border-muted);\n border-top-right-radius: var(--brand-borderRadius-large);\n border-bottom-right-radius: var(--brand-borderRadius-large);\n}\n\n.ActionMenu__menu::-webkit-scrollbar-thumb {\n border-radius: var(--brand-borderRadius-medium);\n border: 1px solid var(--brand-color-border-default);\n background-color: var(--brand-ActionMenu-color-scrollbar-thumb-bg);\n}\n\n.ActionMenu__item {\n flex: 1 0 auto;\n display: grid;\n align-items: center;\n grid-template-areas: 'leadingVisual text';\n grid-template-columns: min-content 1fr;\n list-style: none;\n border-radius: var(--brand-borderRadius-medium);\n}\n\n.ActionMenu__item-anchor {\n display: grid;\n grid-template-columns: subgrid;\n grid-template-rows: subgrid;\n grid-column: 1 / -1;\n grid-row: 1 / -1;\n align-items: center;\n gap: var(--base-size-8);\n text-decoration: none;\n color: var(--brand-color-text-default);\n}\n\n.ActionMenu__item-anchor--disabled {\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.ActionMenu__item-anchor:focus-visible {\n outline: none;\n box-shadow: none;\n}\n\n.ActionMenu__item:has(.ActionMenu__item-anchor:focus-visible) {\n outline: none;\n box-shadow: 0 0 0 var(--focus-outline-width) var(--brand-color-focus);\n transition: none;\n}\n\n.ActionMenu__item--medium {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal);\n min-height: var(--brand-control-medium-size);\n}\n\n.ActionMenu__item--medium:has(.ActionMenu__item-anchor) {\n padding: 0;\n}\n\n.ActionMenu__item--medium .ActionMenu__item-anchor {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal);\n}\n\n.ActionMenu__item--small {\n padding: var(--base-size-8) var(--brand-control-small-paddingInline-condensed);\n}\n\n.ActionMenu__item[aria-disabled='true'] {\n cursor: not-allowed;\n}\n\n.ActionMenu__item:hover:not(.ActionMenu__item[aria-disabled='true']) {\n cursor: pointer;\n background-color: var(--brand-ActionMenu-color-item-hover);\n}\n\n.ActionMenu__item--selection-type-single {\n padding-right: var(--base-size-48);\n}\n\n.ActionMenu__item:focus-visible {\n outline: none;\n box-shadow: 0 0 0 var(--focus-outline-width) var(--brand-color-focus);\n transition: none;\n}\n\n.ActionMenu__item-leadingVisual {\n display: flex;\n min-width: var(--base-size-16);\n margin-right: var(--brand-control-medium-gap);\n color: var(--brand-color-text-default);\n pointer-events: none;\n grid-area: leadingVisual / leadingVisual;\n}\n\n.ActionMenu__item-text {\n grid-area: text / text;\n /* display grid collapses the text line box height for optical alignment /\n display: grid;\n width: max-content;\n}\n\n.ActionMenu__item-text > span {\n line-height: var(--brand-control-medium-lineBoxHeight);\n}\n\n.ActionMenu__item-icon {\n fill: var(--brand-color-text-default);\n}\n\n.ActionMenu__item-content--disabled {\n color: var(--base-color-scale-gray-3);\n}\n\n.ActionMenu__item-icon--disabled {\n fill: var(--base-color-scale-gray-3);\n}\n\n@media (forced-colors: active) {\n .ActionMenu__item:focus-visible {\n outline: var(--brand-borderWidth-thick) solid Highlight;\n outline-offset: var(--base-size-2);\n }\n}\n\n/ Remove all animations, transitions and smooth scroll for people that prefer not to see them /\n@media (prefers-reduced-motion: reduce) {\n .ActionMenu,\n .ActionMenu::before,\n .ActionMenu::after,\n .ActionMenu {\n animation: none !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"ActionMenu.module.js","names":[],"sources":["../../src/ActionMenu/ActionMenu.module.css"],"sourcesContent":[".ActionMenu {\n --focus-outline-width: 3px;\n position: relative;\n}\n\n.ActionMenu--disabled {\n cursor: not-allowed;\n}\n\n.ActionMenu__button {\n height: auto;\n}\n\n.ActionMenu__button--default {\n /* avoid specificity issues /\n --brand-borderRadius-medium: var(--brand-borderRadius-full);\n}\n\n.ActionMenu__button--small {\n padding: calc(var(--base-size-4) / 2) var(--base-size-12);\n}\n\n.ActionMenu__button--medium {\n padding: calc(var(--base-size-8) + 2px) var(--base-size-28);\n}\n\n.ActionMenu__button > span:first-of-type {\n max-width: 200px;\n overflow: hidden;\n}\n\n.ActionMenu__button--split-button {\n display: inline-flex;\n padding: 0;\n border-radius: var(--brand-borderRadius-medium);\n border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n background-color: var(--brand-color-canvas-default);\n}\n\n.ActionMenu__innerButton--split-button:first-child,\n.ActionMenu__innerButton--split-button:first-child:hover {\n position: relative;\n z-index: 1;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.ActionMenu__innerButton--split-button:first-child::before,\n.ActionMenu__innerButton--split-button:hover:first-child::before {\n content: '';\n position: absolute;\n top: calc(var(--base-size-2) / -2);\n right: calc(var(--base-size-2) -1);\n width: var(--brand-borderWidth-thin);\n height: calc(100% + var(--base-size-2));\n background-color: var(--brand-color-border-muted);\n}\n\n.ActionMenu__innerButton--subtle.ActionMenu__innerButton--split-button::before {\n top: calc(var(--base-size-2) * -1);\n height: calc(100% + var(--base-size-4));\n}\n\n.ActionMenu__innerButton--subtle.ActionMenu__innerButton--split-button:active:first-child::before {\n width: 0;\n}\n\n.ActionMenu__innerButton--medium.ActionMenu__innerButton--split-button,\n.ActionMenu__innerButton--split-button:last-child {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal); /* Override the default button padding /\n}\n\n.ActionMenu__inner-button-dropdown-icon {\n vertical-align: middle !important;\n}\n\n.ActionMenu__innerButton--split-button:last-child {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n position: relative;\n z-index: 0;\n}\n\n.ActionMenu__innerButton--disabled {\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.ActionMenu__menu {\n position: absolute;\n z-index: 100;\n padding: var(--base-size-12);\n min-width: min-content;\n visibility: hidden;\n background-color: var(--brand-color-canvas-default);\n border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n border-radius: var(--brand-borderRadius-large);\n max-height: 460px;\n overflow-y: auto;\n box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.01), 0px 41px 33px rgba(0, 0, 0, 0.02), 0px 22px 17px rgba(0, 0, 0, 0.02),\n 0px 12px 10px rgba(0, 0, 0, 0.03), 0px 6px 5px rgba(0, 0, 0, 0.04), 0px 2px 2px rgba(0, 0, 0, 0.07);\n}\n\n.ActionMenu__menu--small {\n padding: var(--base-size-8);\n}\n\n.ActionMenu__menu--medium {\n padding: var(--base-size-12);\n}\n\n.ActionMenu__menu--visible {\n visibility: visible;\n}\n\n.ActionMenu__menu--pos-outside-bottom {\n animation: 189ms var(--brand-animation-easing-glide) 0s 1 normal none running overlay-appear-outside-bottom;\n}\n\n.ActionMenu__menu--pos-outside-top {\n animation: 189ms var(--brand-animation-easing-glide) 0s 1 normal none running overlay-appear-outside-top;\n}\n\n@keyframes overlay-appear-outside-bottom {\n 0% {\n opacity: 0;\n transform: translateY(-10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes overlay-appear-outside-top {\n 0% {\n opacity: 0;\n transform: translateY(10px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.ActionMenu__menu--medium.ActionMenu__menu--pos-outside-bottom {\n margin-block-start: var(--base-size-8);\n}\n\n.ActionMenu__menu--medium.ActionMenu__menu--pos-outside-top {\n margin-block-start: calc(var(--base-size-8) -1);\n}\n\n.ActionMenu__menu--small.ActionMenu__menu--pos-outside-bottom {\n margin-block-start: var(--base-size-4);\n}\n\n.ActionMenu__menu--small.ActionMenu__menu--pos-outside-top {\n margin-block-start: calc(var(--base-size-4) * -1);\n}\n\n.ActionMenu__menu::-webkit-scrollbar {\n width: var(--base-size-12);\n}\n\n.ActionMenu__menu::-webkit-scrollbar-track {\n border-left: 1px solid var(--brand-color-border-muted);\n border-top-right-radius: var(--brand-borderRadius-large);\n border-bottom-right-radius: var(--brand-borderRadius-large);\n}\n\n.ActionMenu__menu::-webkit-scrollbar-thumb {\n border-radius: var(--brand-borderRadius-medium);\n border: 1px solid var(--brand-color-border-default);\n background-color: var(--brand-ActionMenu-color-scrollbar-thumb-bg);\n}\n\n.ActionMenu__item {\n flex: 1 0 auto;\n display: grid;\n align-items: center;\n grid-template-areas: 'leadingVisual text';\n grid-template-columns: min-content 1fr;\n list-style: none;\n border-radius: var(--brand-borderRadius-medium);\n}\n\n.ActionMenu__item-anchor {\n display: grid;\n grid-template-columns: subgrid;\n grid-template-rows: subgrid;\n grid-column: 1 / -1;\n grid-row: 1 / -1;\n align-items: center;\n gap: var(--base-size-8);\n text-decoration: none;\n color: var(--brand-color-text-default);\n}\n\n.ActionMenu__item-anchor--disabled {\n pointer-events: none;\n cursor: not-allowed;\n}\n\n.ActionMenu__item-anchor:focus-visible {\n outline: none;\n box-shadow: none;\n}\n\n.ActionMenu__item:has(.ActionMenu__item-anchor:focus-visible) {\n outline: none;\n box-shadow: 0 0 0 var(--focus-outline-width) var(--brand-color-focus);\n transition: none;\n}\n\n.ActionMenu__item--medium {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal);\n min-height: var(--brand-control-medium-size);\n}\n\n.ActionMenu__item--medium:has(.ActionMenu__item-anchor) {\n padding: 0;\n}\n\n.ActionMenu__item--medium .ActionMenu__item-anchor {\n padding: var(--brand-control-medium-paddingBlock-condensed) var(--brand-control-medium-paddingInline-normal);\n}\n\n.ActionMenu__item--small {\n padding: var(--base-size-8) var(--brand-control-small-paddingInline-condensed);\n}\n\n.ActionMenu__item[aria-disabled='true'] {\n cursor: not-allowed;\n}\n\n.ActionMenu__item:hover:not(.ActionMenu__item[aria-disabled='true']) {\n cursor: pointer;\n background-color: var(--brand-ActionMenu-color-item-hover);\n}\n\n.ActionMenu__item--selection-type-single {\n padding-right: var(--base-size-48);\n}\n\n.ActionMenu__item:focus-visible {\n outline: none;\n box-shadow: 0 0 0 var(--focus-outline-width) var(--brand-color-focus);\n transition: none;\n}\n\n.ActionMenu__item-leadingVisual {\n display: flex;\n min-width: var(--base-size-16);\n margin-right: var(--brand-control-medium-gap);\n color: var(--brand-color-text-default);\n pointer-events: none;\n grid-area: leadingVisual / leadingVisual;\n}\n\n.ActionMenu__item-text {\n grid-area: text / text;\n /* display grid collapses the text line box height for optical alignment /\n display: grid;\n width: max-content;\n}\n\n.ActionMenu__item-text > span {\n line-height: var(--brand-control-medium-lineBoxHeight);\n}\n\n.ActionMenu__item-icon {\n fill: var(--brand-color-text-default);\n}\n\n.ActionMenu__item-content--disabled {\n color: var(--base-color-scale-gray-3);\n}\n\n.ActionMenu__item-icon--disabled {\n fill: var(--base-color-scale-gray-3);\n}\n\n@media (forced-colors: active) {\n .ActionMenu__item:focus-visible {\n outline: var(--brand-borderWidth-thick) solid Highlight;\n outline-offset: var(--base-size-2);\n }\n}\n\n/ Remove all animations, transitions and smooth scroll for people that prefer not to see them /\n@media (prefers-reduced-motion: reduce) {\n .ActionMenu,\n .ActionMenu::before,\n .ActionMenu::after,\n .ActionMenu {\n animation: none !important;\n transition: none !important;\n scroll-behavior: auto !important;\n }\n}\n"],"mappings":""}

package/esm/AnchorNav/AnchorNav.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnchorNav.d.ts","sourceRoot":"","sources":["../../src/AnchorNav/AnchorNav.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0D,MAAM,OAAO,CAAA;AAI9E,OAAO,EAAS,eAAe,EAAO,MAAM,KAAK,CAAA;AAKjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAEnD;;GAEG;AACH,OAAO,8GAA8G,CAAA;AAwBrH,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IACpD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC3B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAA;AAEzC,iBAAS,aAAa,CAAC,EAAC,QAAQ,EAAE,oBAA4B,EAAE,eAAuB,EAAE,GAAG,IAAI,EAAC,EAAE,cAAc,2CAiOhH;AAED,KAAK,gCAAgC,GAAG;IACtC;;OAEG;IACH,UAAU,EAAE,OAAO,GAAG,QAAQ,CAAA;CAC/B,CAAA;AAED,KAAK,kBAAkB,GAAG,SAAS,CAAC,iBAAiB,CAAC,GAAG;IACvD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,mBAAmB,CAAC,EAAE,gCAAgC,CAAA;IACtD,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,sBAAsB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;CACrD,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAA;AAE/D,iBAAS,WAAW,CAAC,EACnB,SAAmB,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,kBAAkB,EAClB,oBAAoB,EACpB,mBAA4C,EAC5C,sBAAsB,EACtB,GAAG,IAAI,EACR,EAAE,kBAAkB,2CAuEpB;AAED,KAAK,oBAAoB,GAAG;IAC1B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;CACb,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,GAC7D,eAAe,CAAA;AAEjB,iBAAS,UAAU,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAqB,EAAE,IAAc,EAAE,GAAG,IAAI,EAAC,EAAE,oBAAoB,~~2CAezG~~;AAED,iBAAS,mBAAmB,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAqB,EAAE,IAAc,EAAE,GAAG,IAAI,EAAC,EAAE,oBAAoB,~~2CAelH~~;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;CAKpB,CAAA"}
1	+ {"version":3,"file":"AnchorNav.d.ts","sourceRoot":"","sources":["../../src/AnchorNav/AnchorNav.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0D,MAAM,OAAO,CAAA;AAI9E,OAAO,EAAS,eAAe,EAAO,MAAM,KAAK,CAAA;AAKjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAEnD;;GAEG;AACH,OAAO,8GAA8G,CAAA;AAwBrH,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IACpD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC3B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAA;AAEzC,iBAAS,aAAa,CAAC,EAAC,QAAQ,EAAE,oBAA4B,EAAE,eAAuB,EAAE,GAAG,IAAI,EAAC,EAAE,cAAc,2CAiOhH;AAED,KAAK,gCAAgC,GAAG;IACtC;;OAEG;IACH,UAAU,EAAE,OAAO,GAAG,QAAQ,CAAA;CAC/B,CAAA;AAED,KAAK,kBAAkB,GAAG,SAAS,CAAC,iBAAiB,CAAC,GAAG;IACvD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,mBAAmB,CAAC,EAAE,gCAAgC,CAAA;IACtD,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,sBAAsB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;CACrD,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAA;AAE/D,iBAAS,WAAW,CAAC,EACnB,SAAmB,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,kBAAkB,EAClB,oBAAoB,EACpB,mBAA4C,EAC5C,sBAAsB,EACtB,GAAG,IAAI,EACR,EAAE,kBAAkB,2CAuEpB;AAED,KAAK,oBAAoB,GAAG;IAC1B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;CACb,GAAG,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC,GAC7D,eAAe,CAAA;AAEjB,iBAAS,UAAU,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAqB,EAAE,IAAc,EAAE,GAAG,IAAI,EAAC,EAAE,oBAAoB,2CAczG;AAED,iBAAS,mBAAmB,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAqB,EAAE,IAAc,EAAE,GAAG,IAAI,EAAC,EAAE,oBAAoB,2CAclH;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;CAKpB,CAAA"}

package/esm/AnchorNav/AnchorNav.js CHANGED Viewed

@@ -193,7 +193,6 @@ function x({ children: t, href: n, variant: r = "secondary", size: i = "small",
 		variant: r,
 		className: e(c["AnchorNav-action"]),
 		href: n,
-		hasArrow: !1,
 		"data-testid": v.action,
 		size: i,
 		...o,
@@ -206,7 +205,6 @@ function S({ children: t, href: n, variant: r = "secondary", size: i = "small",
 		variant: r,
 		className: e(c["AnchorNav-action"]),
 		href: n,
-		hasArrow: !1,
 		"data-testid": v.secondaryAction,
 		size: i,
 		...o,

package/esm/AnchorNav/AnchorNav.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnchorNav.js","names":[],"sources":["../../src/AnchorNav/AnchorNav.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'\nimport {ChevronDownIcon, ChevronUpIcon} from '@primer/octicons-react'\nimport {useId} from '../hooks/useId'\n\nimport {Button, ButtonBaseProps, Text} from '../'\nimport {useWindowSize} from '../hooks/useWindowSize'\nimport {useKeyboardEscape} from '../hooks/useKeyboardEscape'\nimport {useExpandedMenu} from './useExpandedMenu'\n\nimport type {BaseProps} from '../component-helpers'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './AnchorNav.module.css'\n\nconst testIds = {\n root: 'AnchorNav',\n get menuButton() {\n return `${this.root}-menu-button`\n },\n get menuLinks() {\n return `${this.root}-menu-links`\n },\n get action() {\n return `${this.root}-action`\n },\n get secondaryAction() {\n return `${this.root}-secondary-action`\n },\n get navSpacer() {\n return `${this.root}-nav-spacer`\n },\n}\n\nexport type AnchorNavProps = BaseProps<HTMLElement> & {\n /\n Accepts all of `AnchorNav.Item` and `AnchorNav.Action` child components.\n /\n children: React.ReactNode[]\n /\n Enable the idle state background color, which is transparent by default.\n /\n enableDefaultBgColor?: boolean\n /\n When true, the anchor nav will hide until it is sticky.\n /\n hideUntilSticky?: boolean\n} & React.ComponentPropsWithoutRef<'nav'>\n\nfunction AnchorNavBase({children, enableDefaultBgColor = false, hideUntilSticky = false, ...rest}: AnchorNavProps) {\n const [menuOpen, setMenuOpen] = useState(false)\n const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n const [currentActiveNavItem, setCurrentActiveNavItem] = useState<string \| null>()\n const [intersectionEntry, setIntersectionEntry] = useState<IntersectionObserverEntry>()\n const [initialYOffset, setInitialYOffset] = useState<undefined \| number>()\n const [navShouldFix, setNavShouldFix] = useState<boolean>(false)\n const [navHeight, setNavHeight] = useState<number>(0)\n\n const wrapperRef = useRef<HTMLDivElement \| null>(null)\n const rootRef = useRef<HTMLElement \| null>(null)\n const linkContainerRef = useRef<HTMLDivElement \| null>(null)\n const innerContainerRef = useRef<HTMLDivElement \| null>(null)\n\n const {isLarge} = useWindowSize()\n const idForLinkContainer = useId()\n\n const closeMenuCallback = useCallback(() => setMenuOpen(false), [setMenuOpen])\n const toggleMenuCallback = useCallback(() => setMenuOpen(!menuOpen), [menuOpen])\n\n const ValidChildren = useMemo(\n () =>\n React.Children.toArray(children).filter(\n (child: React.ReactNode): boolean => React.isValidElement(child) && typeof child.type !== 'string',\n ),\n [children],\n )\n\n useEffect(() => {\n if (initialYOffset === undefined && intersectionEntry) {\n setInitialYOffset(intersectionEntry.boundingClientRect.y + window.scrollY)\n }\n }, [initialYOffset, intersectionEntry])\n\n const handleIntersectionUpdate = ([nextEntry]: IntersectionObserverEntry[]): void => {\n setIntersectionEntry(nextEntry)\n }\n\n useKeyboardEscape(closeMenuCallback)\n useExpandedMenu(menuOpen, linkContainerRef, innerContainerRef, !isLarge, closeMenuCallback)\n\n useEffect(() => {\n if (wrapperRef.current) {\n const height = wrapperRef.current.offsetHeight\n setNavHeight(height)\n }\n }, [isLarge])\n\n useEffect(() => {\n const queryResult = window.matchMedia('(prefers-reduced-motion: reduce)')\n\n setPrefersReducedMotion(queryResult.matches)\n }, [])\n\n useEffect(() => {\n const handler = () => {\n if (initialYOffset) {\n const isPastInitialYOffset = window.pageYOffset > initialYOffset\n setNavShouldFix(isPastInitialYOffset)\n }\n }\n // eslint-disable-next-line github/prefer-observers\n window.addEventListener('scroll', handler)\n return () => {\n window.removeEventListener('scroll', handler)\n }\n }, [initialYOffset])\n\n useEffect(() => {\n const node = hideUntilSticky ? wrapperRef.current : rootRef.current\n\n const supportsIntersectionObserver = !!window.IntersectionObserver\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!supportsIntersectionObserver \|\| !node) return\n\n const topOfWindow = '0px 0px -100%'\n const observerParams = {threshold: 0, root: null, rootMargin: topOfWindow}\n const observer = new IntersectionObserver(handleIntersectionUpdate, observerParams)\n\n observer.observe(node)\n\n return () => observer.disconnect()\n }, [hideUntilSticky])\n\n const handleMenuToggle = useCallback(\n event => {\n event?.preventDefault()\n toggleMenuCallback()\n },\n [toggleMenuCallback],\n )\n\n const handleUpdateToCurrentActiveNavItem = useCallback(\n (id: string \| null) => {\n setCurrentActiveNavItem(id)\n },\n [setCurrentActiveNavItem],\n )\n\n const numLinks = ValidChildren.filter(child => React.isValidElement(child) && child.type === NavLinkBase).length\n const Links = ValidChildren.map((child, index) => {\n if (React.isValidElement<AnchorNavLinkProps>(child) && child.type === NavLinkBase) {\n const defaultProps: AnchorNavLinkProps = {\n href: child.props.href,\n toggleMenuCallback,\n prefersReducedMotion,\n updateCurrentActiveNav: handleUpdateToCurrentActiveNavItem,\n alignment: numLinks < 4 ? 'start' : 'center',\n }\n return React.cloneElement(child, {\n isActive: index === 0,\n ...defaultProps,\n })\n }\n\n return null\n })\n .filter(Boolean)\n .slice(0, 5)\n\n const Action = ValidChildren.reduce<React.ReactElement<AnchorNavActionProps>[]>((acc, child) => {\n if (React.isValidElement<AnchorNavActionProps>(child) && child.type === ActionBase) {\n acc.push(React.cloneElement(child))\n }\n return acc\n }, [])\n\n const SecondaryAction = ValidChildren.reduce<React.ReactElement<AnchorNavActionProps>[]>((acc, child) => {\n if (React.isValidElement<AnchorNavActionProps>(child) && child.type === SecondaryActionBase) {\n acc.push(React.cloneElement(child))\n }\n return acc\n }, [])\n\n const hasLargerSizeActions =\n Action.some(action => action.props.size && action.props.size !== 'small') \|\|\n SecondaryAction.some(action => action.props.size && action.props.size !== 'small')\n\n / On page load, the rootMargin positions and/or thresholds of the IntersectionObserver\n * may not be met depending on the position of the AnchorNav on the page.\n * The following useEffect ensures that the first link always marked as the active link, until\n * the observer kicks in. Without this, the active link is undefined.\n /\n useEffect(() => {\n if (!currentActiveNavItem && Links.length > 0) {\n setCurrentActiveNavItem(Links[0]?.props.children as string)\n }\n }, [currentActiveNavItem, Links])\n\n const hasTwoActions = Action.length > 0 && SecondaryAction.length > 0\n\n return (\n <div ref={wrapperRef}>\n <nav\n ref={rootRef}\n aria-label=\"Anchored navigation\"\n data-sticky={navShouldFix.toString()}\n className={clsx(\n styles.AnchorNav,\n hideUntilSticky && styles['AnchorNav--hide-until-sticky'],\n navShouldFix && styles['AnchorNav--stuck'],\n menuOpen && styles['AnchorNav--expanded'],\n enableDefaultBgColor && styles['AnchorNav--with-default-background-color'],\n )}\n {...rest}\n >\n <div\n ref={innerContainerRef}\n className={clsx(\n styles['AnchorNav-inner-container'],\n menuOpen && styles['AnchorNav-inner-container--expanded'],\n )}\n >\n <button\n onClick={handleMenuToggle}\n className={clsx(styles['AnchorNav-menu-button'])}\n aria-expanded={menuOpen}\n aria-controls={idForLinkContainer}\n data-testid={testIds.menuButton}\n >\n {menuOpen ? (\n <ChevronUpIcon size={16} className={styles['AnchorNav-menu-button-arrow']} fill=\"currentcolor\" />\n ) : (\n <ChevronDownIcon size={16} className={styles['AnchorNav-menu-button-arrow']} fill=\"currentcolor\" />\n )}\n <span className=\"visually-hidden\">Anchor navigation menu. Currently selected: </span>\n <Text as=\"span\" className={clsx(styles['AnchorNav-link-label'])}>\n {currentActiveNavItem}\n </Text>\n </button>\n {/Replace with unique ids and test ids /}\n <div\n id={idForLinkContainer}\n data-testid={testIds.menuLinks}\n className={styles['AnchorNav-link-container']}\n ref={linkContainerRef}\n >\n {Links}\n </div>\n <span\n data-forward-focus=\"true\"\n className={clsx(\n styles['AnchorNav__actionsContainer'],\n hasLargerSizeActions && styles['AnchorNav__actionsContainer--no-offset'],\n hasTwoActions && styles['AnchorNav__actionsContainer--multiple'],\n )}\n >\n {Action.length && SecondaryAction.length && React.isValidElement<AnchorNavActionProps>(Action[0])\n ? React.cloneElement(Action[0], {\n variant: 'primary',\n })\n : Action}\n {SecondaryAction}\n </span>\n </div>\n <span\n className={clsx(menuOpen && styles['AnchorNav-overlay--expanded'])}\n onClick={closeMenuCallback}\n aria-hidden\n />\n </nav>\n {navShouldFix && <div style={{height: navHeight}} aria-hidden=\"true\" data-testid={testIds.navSpacer} />}\n </div>\n )\n}\n\ntype AnchorNavLinkIntersectionOptions = {\n /*\n The area of the element that should trigger the next linked section to be highlighted.\n /\n rootMargin: 'start' \| 'middle'\n}\n\ntype AnchorNavLinkProps = BaseProps<HTMLAnchorElement> & {\n /\n Optional text alignment for the link. Defaults to 'start' if there are less than 4 links, otherwise 'center'.\n /\n alignment?: 'start' \| 'center'\n /\n Required path or location for the anchor to link to.\n /\n href: string\n /\n Optional boolean to indicate if the link is the current active link.\n * Typically doesn't need to be sset unless custom animation is being used.\n /\n isActive?: boolean // internal prop, not exposed in docs\n toggleMenuCallback?: () => void // internal prop, not exposed in docs\n intersectionOptions?: AnchorNavLinkIntersectionOptions // internal prop, not exposed in docs\n prefersReducedMotion?: boolean // internal prop, not exposed in docs\n updateCurrentActiveNav?: (id: string \| null) => void // internal prop, not exposed in docs\n} & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>\n\nfunction NavLinkBase({\n alignment = 'start',\n children,\n href,\n isActive,\n toggleMenuCallback,\n prefersReducedMotion,\n intersectionOptions = {rootMargin: 'middle'},\n updateCurrentActiveNav,\n ...rest\n}: AnchorNavLinkProps) {\n const {isLarge} = useWindowSize()\n const [intersectionEntry, setIntersectionEntry] = useState<IntersectionObserverEntry>()\n\n const isAnchor = /^#/.test(href)\n const anchoredContentIsVisible = !!intersectionEntry?.isIntersecting\n\n const handleIntersectionUpdate = ([nextEntry]: IntersectionObserverEntry[]): void => {\n setIntersectionEntry(nextEntry)\n }\n\n useEffect(() => {\n const node = document.querySelector(isAnchor ? href : `#${href}`)\n\n const supportsIntersectionObserver = !!window.IntersectionObserver\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!supportsIntersectionObserver \|\| !node) return\n\n const rootMarginTop = '0px'\n const rootMarginCenter = '-50% 0% -50% 0%'\n\n const rootMargin = intersectionOptions.rootMargin === 'start' ? rootMarginTop : rootMarginCenter\n\n const observerParams = {threshold: intersectionOptions.rootMargin === 'start' ? 0.4 : 0, root: null, rootMargin}\n\n const observer = new IntersectionObserver(handleIntersectionUpdate, observerParams)\n\n observer.observe(node)\n\n return () => observer.disconnect()\n }, [href, intersectionOptions.rootMargin, isAnchor])\n\n // updates root AnchorNav to notify of active section\n useEffect(() => {\n if (anchoredContentIsVisible && updateCurrentActiveNav && typeof children === 'string') {\n updateCurrentActiveNav(children)\n }\n }, [anchoredContentIsVisible, children, updateCurrentActiveNav])\n\n const handleClick = useCallback(() => {\n if (toggleMenuCallback && !isLarge) {\n toggleMenuCallback()\n }\n }, [isLarge, toggleMenuCallback])\n\n return (\n <a\n className={clsx(\n styles['AnchorNav-link'],\n styles[`AnchorNav-link--${alignment}`],\n anchoredContentIsVisible && styles['AnchorNav-link--is-active'],\n )}\n href={isAnchor ? href : `#${href}`}\n aria-current={anchoredContentIsVisible && 'true'}\n data-first={isActive}\n data-active={anchoredContentIsVisible ? 'true' : 'false'}\n onClick={handleClick}\n {...rest}\n >\n <Text\n as=\"span\"\n className={clsx(\n styles['AnchorNav-link-label'],\n anchoredContentIsVisible && styles['AnchorNav-link-label--is-active'],\n )}\n >\n {children}\n </Text>\n </a>\n )\n}\n\ntype AnchorNavActionProps = {\n /\n Required path or location for the action button to link to.\n /\n href: string\n} & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> &\n ButtonBaseProps\n\nfunction ActionBase({children, href, variant = 'secondary', size = 'small', ...rest}: AnchorNavActionProps) {\n return (\n <Button\n as=\"a\"\n variant={variant}\n className={clsx(styles['AnchorNav-action'])}\n href={href}\n hasArrow={false}\n data-testid={testIds.action}\n size={size}\n {...rest}\n >\n {children}\n </Button>\n )\n}\n\nfunction SecondaryActionBase({children, href, variant = 'secondary', size = 'small', ...rest}: AnchorNavActionProps) {\n return (\n <Button\n as=\"a\"\n variant={variant}\n className={clsx(styles['AnchorNav-action'])}\n href={href}\n hasArrow={false}\n data-testid={testIds.secondaryAction}\n size={size}\n {...rest}\n >\n {children}\n </Button>\n )\n}\n\n/\n AnchorNav allows users to navigate to different sections of a page.\n * @see https://primer.style/brand/components/AnchorNav\n */\nexport const AnchorNav = Object.assign(AnchorNavBase, {\n Link: NavLinkBase,\n Action: ActionBase,\n SecondaryAction: SecondaryActionBase,\n testIds,\n})\n"],"mappings":";;;;;;;;;;;;;AAoBA,IAAM,IAAU;CACd,MAAM;CACN,IAAI,aAAa;AACf,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,YAAY;AACd,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,SAAS;AACX,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,kBAAkB;AACpB,SAAO,GAAG,KAAK,KAAK;;CAEtB,IAAI,YAAY;AACd,SAAO,GAAG,KAAK,KAAK;;CAEvB;AAiBD,SAAS,EAAc,EAAC,aAAU,0BAAuB,IAAO,qBAAkB,IAAO,GAAG,KAAuB;CACjH,IAAM,CAAC,GAAU,KAAe,EAAS,GAAM,EACzC,CAAC,GAAsB,MAA2B,EAAS,GAAM,EACjE,CAAC,GAAsB,KAA2B,GAAyB,EAC3E,CAAC,GAAmB,KAAwB,GAAqC,EACjF,CAAC,GAAgB,KAAqB,GAA8B,EACpE,CAAC,GAAc,KAAmB,EAAkB,GAAM,EAC1D,CAAC,GAAW,KAAgB,EAAiB,EAAE,EAE/C,IAAa,EAA8B,KAAK,EAChD,IAAU,EAA2B,KAAK,EAC1C,IAAmB,EAA8B,KAAK,EACtD,IAAoB,EAA8B,KAAK,EAEvD,EAAC,eAAW,GAAe,EAC3B,IAAqB,GAAO,EAE5B,IAAoB,QAAkB,EAAY,GAAM,EAAE,CAAC,EAAY,CAAC,EACxE,IAAqB,QAAkB,EAAY,CAAC,EAAS,EAAE,CAAC,EAAS,CAAC,EAE1E,IAAgB,QAElB,EAAM,SAAS,QAAQ,EAAS,CAAC,QAC9B,MAAoC,EAAM,eAAe,EAAM,IAAI,OAAO,EAAM,QAAS,SAC3F,EACH,CAAC,EAAS,CACX;AAED,SAAgB;AACd,EAAI,MAAmB,KAAA,KAAa,KAClC,EAAkB,EAAkB,mBAAmB,IAAI,OAAO,QAAQ;IAE3E,CAAC,GAAgB,EAAkB,CAAC;CAEvC,IAAM,KAA4B,CAAC,OAAkD;AACnF,IAAqB,EAAU;;AAiCjC,CA9BA,EAAkB,EAAkB,EACpC,EAAgB,GAAU,GAAkB,GAAmB,CAAC,GAAS,EAAkB,EAE3F,QAAgB;AACd,MAAI,EAAW,SAAS;GACtB,IAAM,IAAS,EAAW,QAAQ;AAClC,KAAa,EAAO;;IAErB,CAAC,EAAQ,CAAC,EAEb,QAAgB;AAGd,KAFoB,OAAO,WAAW,mCAEd,CAAY,QAAQ;IAC3C,EAAE,CAAC,EAEN,QAAgB;EACd,IAAM,UAAgB;AACpB,GAAI,KAEF,EAD6B,OAAO,cAAc,EACb;;AAKzC,SADA,OAAO,iBAAiB,UAAU,EAAQ,QAC7B;AACX,UAAO,oBAAoB,UAAU,EAAQ;;IAE9C,CAAC,EAAe,CAAC,EAEpB,QAAgB;EACd,IAAM,IAAO,IAAkB,EAAW,UAAU,EAAQ;AAK5D,MAAI,CAHmC,OAAO,wBAGT,CAAC,EAAM;EAI5C,IAAM,IAAW,IAAI,qBAAqB,GAA0B;GAD5C,WAAW;GAAG,MAAM;GAAM,YAAY;GACM,CAAe;AAInF,SAFA,EAAS,QAAQ,EAAK,QAET,EAAS,YAAY;IACjC,CAAC,EAAgB,CAAC;CAErB,IAAM,IAAmB,GACvB,MAAS;AAEP,EADA,GAAO,gBAAgB,EACvB,GAAoB;IAEtB,CAAC,EAAmB,CACrB,EAEK,IAAqC,GACxC,MAAsB;AACrB,IAAwB,EAAG;IAE7B,CAAC,EAAwB,CAC1B,EAEK,IAAW,EAAc,QAAO,MAAS,EAAM,eAAe,EAAM,IAAI,EAAM,SAAS,EAAY,CAAC,QACpG,IAAQ,EAAc,KAAK,GAAO,MAAU;AAChD,MAAI,EAAM,eAAmC,EAAM,IAAI,EAAM,SAAS,GAAa;GACjF,IAAM,IAAmC;IACvC,MAAM,EAAM,MAAM;IAClB;IACA;IACA,wBAAwB;IACxB,WAAW,IAAW,IAAI,UAAU;IACrC;AACD,UAAO,EAAM,aAAa,GAAO;IAC/B,UAAU,MAAU;IACpB,GAAG;IACJ,CAAC;;AAGJ,SAAO;GACP,CACC,OAAO,QAAQ,CACf,MAAM,GAAG,EAAE,EAER,IAAS,EAAc,QAAoD,GAAK,OAChF,EAAM,eAAqC,EAAM,IAAI,EAAM,SAAS,KACtE,EAAI,KAAK,EAAM,aAAa,EAAM,CAAC,EAE9B,IACN,EAAE,CAAC,EAEA,IAAkB,EAAc,QAAoD,GAAK,OACzF,EAAM,eAAqC,EAAM,IAAI,EAAM,SAAS,KACtE,EAAI,KAAK,EAAM,aAAa,EAAM,CAAC,EAE9B,IACN,EAAE,CAAC,EAEA,KACJ,EAAO,MAAK,MAAU,EAAO,MAAM,QAAQ,EAAO,MAAM,SAAS,QAAQ,IACzE,EAAgB,MAAK,MAAU,EAAO,MAAM,QAAQ,EAAO,MAAM,SAAS,QAAQ;AAOpF,SAAgB;AACd,EAAI,CAAC,KAAwB,EAAM,SAAS,KAC1C,EAAwB,EAAM,IAAI,MAAM,SAAmB;IAE5D,CAAC,GAAsB,EAAM,CAAC;CAEjC,IAAM,KAAgB,EAAO,SAAS,KAAK,EAAgB,SAAS;AAEpE,QACE,kBAAC,OAAD;EAAK,KAAK;YAAV,CACE,kBAAC,OAAD;GACE,KAAK;GACL,cAAW;GACX,eAAa,EAAa,UAAU;GACpC,WAAW,EACT,EAAO,WACP,KAAmB,EAAO,iCAC1B,KAAgB,EAAO,qBACvB,KAAY,EAAO,wBACnB,KAAwB,EAAO,4CAChC;GACD,GAAI;aAXN,CAaE,kBAAC,OAAD;IACE,KAAK;IACL,WAAW,EACT,EAAO,8BACP,KAAY,EAAO,uCACpB;cALH;KAOE,kBAAC,UAAD;MACE,SAAS;MACT,WAAW,EAAK,EAAO,yBAAyB;MAChD,iBAAe;MACf,iBAAe;MACf,eAAa,EAAQ;gBALvB;OAQI,EADD,IACE,IAEA,GAFD;QAAe,MAAM;QAAI,WAAW,EAAO;QAAgC,MAAK;QAAiB,CAEE;OAErG,kBAAC,QAAD;QAAM,WAAU;kBAAkB;QAAmD,CAAA;OACrF,kBAAC,GAAD;QAAM,IAAG;QAAO,WAAW,EAAK,EAAO,wBAAwB;kBAC5D;QACI,CAAA;OACA;;KAET,kBAAC,OAAD;MACE,IAAI;MACJ,eAAa,EAAQ;MACrB,WAAW,EAAO;MAClB,KAAK;gBAEJ;MACG,CAAA;KACN,kBAAC,QAAD;MACE,sBAAmB;MACnB,WAAW,EACT,EAAO,6BACP,MAAwB,EAAO,2CAC/B,MAAiB,EAAO,yCACzB;gBANH,CAQG,EAAO,UAAU,EAAgB,UAAU,EAAM,eAAqC,EAAO,GAAG,GAC7F,EAAM,aAAa,EAAO,IAAI,EAC5B,SAAS,WACV,CAAC,GACF,GACH,EACI;;KACH;OACN,kBAAC,QAAD;IACE,WAAW,EAAK,KAAY,EAAO,+BAA+B;IAClE,SAAS;IACT,eAAA;IACA,CAAA,CACE;MACL,KAAgB,kBAAC,OAAD;GAAK,OAAO,EAAC,QAAQ,GAAU;GAAE,eAAY;GAAO,eAAa,EAAQ;GAAa,CAAA,CACnG;;;AA+BV,SAAS,EAAY,EACnB,eAAY,SACZ,aACA,SACA,aACA,uBACA,yBACA,yBAAsB,EAAC,YAAY,UAAS,EAC5C,2BACA,GAAG,KACkB;CACrB,IAAM,EAAC,eAAW,GAAe,EAC3B,CAAC,GAAmB,KAAwB,GAAqC,EAEjF,IAAW,KAAK,KAAK,EAAK,EAC1B,IAA2B,CAAC,CAAC,GAAmB,gBAEhD,KAA4B,CAAC,OAAkD;AACnF,IAAqB,EAAU;;AA0BjC,CAvBA,QAAgB;EACd,IAAM,IAAO,SAAS,cAAc,IAAW,IAAO,IAAI,IAAO;AAKjE,MAAI,CAHmC,OAAO,wBAGT,CAAC,EAAM;EAK5C,IAAM,IAAa,EAAoB,eAAe,UAAU,QAAgB,mBAE1E,IAAiB;GAAC,WAAW,EAAoB,eAAe,UAAU,KAAM;GAAG,MAAM;GAAM;GAAW,EAE1G,IAAW,IAAI,qBAAqB,GAA0B,EAAe;AAInF,SAFA,EAAS,QAAQ,EAAK,QAET,EAAS,YAAY;IACjC;EAAC;EAAM,EAAoB;EAAY;EAAS,CAAC,EAGpD,QAAgB;AACd,EAAI,KAA4B,KAA0B,OAAO,KAAa,YAC5E,EAAuB,EAAS;IAEjC;EAAC;EAA0B;EAAU;EAAuB,CAAC;CAEhE,IAAM,IAAc,QAAkB;AACpC,EAAI,KAAsB,CAAC,KACzB,GAAoB;IAErB,CAAC,GAAS,EAAmB,CAAC;AAEjC,QACE,kBAAC,KAAD;EACE,WAAW,EACT,EAAO,mBACP,EAAO,mBAAmB,MAC1B,KAA4B,EAAO,6BACpC;EACD,MAAM,IAAW,IAAO,IAAI;EAC5B,gBAAc,KAA4B;EAC1C,cAAY;EACZ,eAAa,IAA2B,SAAS;EACjD,SAAS;EACT,GAAI;YAEJ,kBAAC,GAAD;GACE,IAAG;GACH,WAAW,EACT,EAAO,yBACP,KAA4B,EAAO,mCACpC;GAEA;GACI,CAAA;EACL,CAAA;;AAYR,SAAS,EAAW,EAAC,aAAU,SAAM,aAAU,aAAa,UAAO,SAAS,GAAG,KAA6B;AAC1G,QACE,kBAAC,GAAD;EACE,IAAG;EACM;EACT,WAAW,EAAK,EAAO,oBAAoB;EACrC;EACN,UAAU;EACV,eAAa,EAAQ;EACf;EACN,GAAI;EAEH;EACM,CAAA;;AAIb,SAAS,EAAoB,EAAC,aAAU,SAAM,aAAU,aAAa,UAAO,SAAS,GAAG,KAA6B;AACnH,QACE,kBAAC,GAAD;EACE,IAAG;EACM;EACT,WAAW,EAAK,EAAO,oBAAoB;EACrC;EACN,UAAU;EACV,eAAa,EAAQ;EACf;EACN,GAAI;EAEH;EACM,CAAA;;AAQb,IAAa,IAAY,OAAO,OAAO,GAAe;CACpD,MAAM;CACN,QAAQ;CACR,iBAAiB;CACjB;CACD,CAAC"}
1	+ {"version":3,"file":"AnchorNav.js","names":[],"sources":["../../src/AnchorNav/AnchorNav.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'\nimport {ChevronDownIcon, ChevronUpIcon} from '@primer/octicons-react'\nimport {useId} from '../hooks/useId'\n\nimport {Button, ButtonBaseProps, Text} from '../'\nimport {useWindowSize} from '../hooks/useWindowSize'\nimport {useKeyboardEscape} from '../hooks/useKeyboardEscape'\nimport {useExpandedMenu} from './useExpandedMenu'\n\nimport type {BaseProps} from '../component-helpers'\n\n/*\n Design tokens\n /\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes.css'\n\n/* * Main Stylesheet (as a CSS Module) /\nimport styles from './AnchorNav.module.css'\n\nconst testIds = {\n root: 'AnchorNav',\n get menuButton() {\n return `${this.root}-menu-button`\n },\n get menuLinks() {\n return `${this.root}-menu-links`\n },\n get action() {\n return `${this.root}-action`\n },\n get secondaryAction() {\n return `${this.root}-secondary-action`\n },\n get navSpacer() {\n return `${this.root}-nav-spacer`\n },\n}\n\nexport type AnchorNavProps = BaseProps<HTMLElement> & {\n /\n Accepts all of `AnchorNav.Item` and `AnchorNav.Action` child components.\n /\n children: React.ReactNode[]\n /\n Enable the idle state background color, which is transparent by default.\n /\n enableDefaultBgColor?: boolean\n /\n When true, the anchor nav will hide until it is sticky.\n /\n hideUntilSticky?: boolean\n} & React.ComponentPropsWithoutRef<'nav'>\n\nfunction AnchorNavBase({children, enableDefaultBgColor = false, hideUntilSticky = false, ...rest}: AnchorNavProps) {\n const [menuOpen, setMenuOpen] = useState(false)\n const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n const [currentActiveNavItem, setCurrentActiveNavItem] = useState<string \| null>()\n const [intersectionEntry, setIntersectionEntry] = useState<IntersectionObserverEntry>()\n const [initialYOffset, setInitialYOffset] = useState<undefined \| number>()\n const [navShouldFix, setNavShouldFix] = useState<boolean>(false)\n const [navHeight, setNavHeight] = useState<number>(0)\n\n const wrapperRef = useRef<HTMLDivElement \| null>(null)\n const rootRef = useRef<HTMLElement \| null>(null)\n const linkContainerRef = useRef<HTMLDivElement \| null>(null)\n const innerContainerRef = useRef<HTMLDivElement \| null>(null)\n\n const {isLarge} = useWindowSize()\n const idForLinkContainer = useId()\n\n const closeMenuCallback = useCallback(() => setMenuOpen(false), [setMenuOpen])\n const toggleMenuCallback = useCallback(() => setMenuOpen(!menuOpen), [menuOpen])\n\n const ValidChildren = useMemo(\n () =>\n React.Children.toArray(children).filter(\n (child: React.ReactNode): boolean => React.isValidElement(child) && typeof child.type !== 'string',\n ),\n [children],\n )\n\n useEffect(() => {\n if (initialYOffset === undefined && intersectionEntry) {\n setInitialYOffset(intersectionEntry.boundingClientRect.y + window.scrollY)\n }\n }, [initialYOffset, intersectionEntry])\n\n const handleIntersectionUpdate = ([nextEntry]: IntersectionObserverEntry[]): void => {\n setIntersectionEntry(nextEntry)\n }\n\n useKeyboardEscape(closeMenuCallback)\n useExpandedMenu(menuOpen, linkContainerRef, innerContainerRef, !isLarge, closeMenuCallback)\n\n useEffect(() => {\n if (wrapperRef.current) {\n const height = wrapperRef.current.offsetHeight\n setNavHeight(height)\n }\n }, [isLarge])\n\n useEffect(() => {\n const queryResult = window.matchMedia('(prefers-reduced-motion: reduce)')\n\n setPrefersReducedMotion(queryResult.matches)\n }, [])\n\n useEffect(() => {\n const handler = () => {\n if (initialYOffset) {\n const isPastInitialYOffset = window.pageYOffset > initialYOffset\n setNavShouldFix(isPastInitialYOffset)\n }\n }\n // eslint-disable-next-line github/prefer-observers\n window.addEventListener('scroll', handler)\n return () => {\n window.removeEventListener('scroll', handler)\n }\n }, [initialYOffset])\n\n useEffect(() => {\n const node = hideUntilSticky ? wrapperRef.current : rootRef.current\n\n const supportsIntersectionObserver = !!window.IntersectionObserver\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!supportsIntersectionObserver \|\| !node) return\n\n const topOfWindow = '0px 0px -100%'\n const observerParams = {threshold: 0, root: null, rootMargin: topOfWindow}\n const observer = new IntersectionObserver(handleIntersectionUpdate, observerParams)\n\n observer.observe(node)\n\n return () => observer.disconnect()\n }, [hideUntilSticky])\n\n const handleMenuToggle = useCallback(\n event => {\n event?.preventDefault()\n toggleMenuCallback()\n },\n [toggleMenuCallback],\n )\n\n const handleUpdateToCurrentActiveNavItem = useCallback(\n (id: string \| null) => {\n setCurrentActiveNavItem(id)\n },\n [setCurrentActiveNavItem],\n )\n\n const numLinks = ValidChildren.filter(child => React.isValidElement(child) && child.type === NavLinkBase).length\n const Links = ValidChildren.map((child, index) => {\n if (React.isValidElement<AnchorNavLinkProps>(child) && child.type === NavLinkBase) {\n const defaultProps: AnchorNavLinkProps = {\n href: child.props.href,\n toggleMenuCallback,\n prefersReducedMotion,\n updateCurrentActiveNav: handleUpdateToCurrentActiveNavItem,\n alignment: numLinks < 4 ? 'start' : 'center',\n }\n return React.cloneElement(child, {\n isActive: index === 0,\n ...defaultProps,\n })\n }\n\n return null\n })\n .filter(Boolean)\n .slice(0, 5)\n\n const Action = ValidChildren.reduce<React.ReactElement<AnchorNavActionProps>[]>((acc, child) => {\n if (React.isValidElement<AnchorNavActionProps>(child) && child.type === ActionBase) {\n acc.push(React.cloneElement(child))\n }\n return acc\n }, [])\n\n const SecondaryAction = ValidChildren.reduce<React.ReactElement<AnchorNavActionProps>[]>((acc, child) => {\n if (React.isValidElement<AnchorNavActionProps>(child) && child.type === SecondaryActionBase) {\n acc.push(React.cloneElement(child))\n }\n return acc\n }, [])\n\n const hasLargerSizeActions =\n Action.some(action => action.props.size && action.props.size !== 'small') \|\|\n SecondaryAction.some(action => action.props.size && action.props.size !== 'small')\n\n / On page load, the rootMargin positions and/or thresholds of the IntersectionObserver\n * may not be met depending on the position of the AnchorNav on the page.\n * The following useEffect ensures that the first link always marked as the active link, until\n * the observer kicks in. Without this, the active link is undefined.\n /\n useEffect(() => {\n if (!currentActiveNavItem && Links.length > 0) {\n setCurrentActiveNavItem(Links[0]?.props.children as string)\n }\n }, [currentActiveNavItem, Links])\n\n const hasTwoActions = Action.length > 0 && SecondaryAction.length > 0\n\n return (\n <div ref={wrapperRef}>\n <nav\n ref={rootRef}\n aria-label=\"Anchored navigation\"\n data-sticky={navShouldFix.toString()}\n className={clsx(\n styles.AnchorNav,\n hideUntilSticky && styles['AnchorNav--hide-until-sticky'],\n navShouldFix && styles['AnchorNav--stuck'],\n menuOpen && styles['AnchorNav--expanded'],\n enableDefaultBgColor && styles['AnchorNav--with-default-background-color'],\n )}\n {...rest}\n >\n <div\n ref={innerContainerRef}\n className={clsx(\n styles['AnchorNav-inner-container'],\n menuOpen && styles['AnchorNav-inner-container--expanded'],\n )}\n >\n <button\n onClick={handleMenuToggle}\n className={clsx(styles['AnchorNav-menu-button'])}\n aria-expanded={menuOpen}\n aria-controls={idForLinkContainer}\n data-testid={testIds.menuButton}\n >\n {menuOpen ? (\n <ChevronUpIcon size={16} className={styles['AnchorNav-menu-button-arrow']} fill=\"currentcolor\" />\n ) : (\n <ChevronDownIcon size={16} className={styles['AnchorNav-menu-button-arrow']} fill=\"currentcolor\" />\n )}\n <span className=\"visually-hidden\">Anchor navigation menu. Currently selected: </span>\n <Text as=\"span\" className={clsx(styles['AnchorNav-link-label'])}>\n {currentActiveNavItem}\n </Text>\n </button>\n {/Replace with unique ids and test ids /}\n <div\n id={idForLinkContainer}\n data-testid={testIds.menuLinks}\n className={styles['AnchorNav-link-container']}\n ref={linkContainerRef}\n >\n {Links}\n </div>\n <span\n data-forward-focus=\"true\"\n className={clsx(\n styles['AnchorNav__actionsContainer'],\n hasLargerSizeActions && styles['AnchorNav__actionsContainer--no-offset'],\n hasTwoActions && styles['AnchorNav__actionsContainer--multiple'],\n )}\n >\n {Action.length && SecondaryAction.length && React.isValidElement<AnchorNavActionProps>(Action[0])\n ? React.cloneElement(Action[0], {\n variant: 'primary',\n })\n : Action}\n {SecondaryAction}\n </span>\n </div>\n <span\n className={clsx(menuOpen && styles['AnchorNav-overlay--expanded'])}\n onClick={closeMenuCallback}\n aria-hidden\n />\n </nav>\n {navShouldFix && <div style={{height: navHeight}} aria-hidden=\"true\" data-testid={testIds.navSpacer} />}\n </div>\n )\n}\n\ntype AnchorNavLinkIntersectionOptions = {\n /*\n The area of the element that should trigger the next linked section to be highlighted.\n /\n rootMargin: 'start' \| 'middle'\n}\n\ntype AnchorNavLinkProps = BaseProps<HTMLAnchorElement> & {\n /\n Optional text alignment for the link. Defaults to 'start' if there are less than 4 links, otherwise 'center'.\n /\n alignment?: 'start' \| 'center'\n /\n Required path or location for the anchor to link to.\n /\n href: string\n /\n Optional boolean to indicate if the link is the current active link.\n * Typically doesn't need to be sset unless custom animation is being used.\n /\n isActive?: boolean // internal prop, not exposed in docs\n toggleMenuCallback?: () => void // internal prop, not exposed in docs\n intersectionOptions?: AnchorNavLinkIntersectionOptions // internal prop, not exposed in docs\n prefersReducedMotion?: boolean // internal prop, not exposed in docs\n updateCurrentActiveNav?: (id: string \| null) => void // internal prop, not exposed in docs\n} & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>\n\nfunction NavLinkBase({\n alignment = 'start',\n children,\n href,\n isActive,\n toggleMenuCallback,\n prefersReducedMotion,\n intersectionOptions = {rootMargin: 'middle'},\n updateCurrentActiveNav,\n ...rest\n}: AnchorNavLinkProps) {\n const {isLarge} = useWindowSize()\n const [intersectionEntry, setIntersectionEntry] = useState<IntersectionObserverEntry>()\n\n const isAnchor = /^#/.test(href)\n const anchoredContentIsVisible = !!intersectionEntry?.isIntersecting\n\n const handleIntersectionUpdate = ([nextEntry]: IntersectionObserverEntry[]): void => {\n setIntersectionEntry(nextEntry)\n }\n\n useEffect(() => {\n const node = document.querySelector(isAnchor ? href : `#${href}`)\n\n const supportsIntersectionObserver = !!window.IntersectionObserver\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!supportsIntersectionObserver \|\| !node) return\n\n const rootMarginTop = '0px'\n const rootMarginCenter = '-50% 0% -50% 0%'\n\n const rootMargin = intersectionOptions.rootMargin === 'start' ? rootMarginTop : rootMarginCenter\n\n const observerParams = {threshold: intersectionOptions.rootMargin === 'start' ? 0.4 : 0, root: null, rootMargin}\n\n const observer = new IntersectionObserver(handleIntersectionUpdate, observerParams)\n\n observer.observe(node)\n\n return () => observer.disconnect()\n }, [href, intersectionOptions.rootMargin, isAnchor])\n\n // updates root AnchorNav to notify of active section\n useEffect(() => {\n if (anchoredContentIsVisible && updateCurrentActiveNav && typeof children === 'string') {\n updateCurrentActiveNav(children)\n }\n }, [anchoredContentIsVisible, children, updateCurrentActiveNav])\n\n const handleClick = useCallback(() => {\n if (toggleMenuCallback && !isLarge) {\n toggleMenuCallback()\n }\n }, [isLarge, toggleMenuCallback])\n\n return (\n <a\n className={clsx(\n styles['AnchorNav-link'],\n styles[`AnchorNav-link--${alignment}`],\n anchoredContentIsVisible && styles['AnchorNav-link--is-active'],\n )}\n href={isAnchor ? href : `#${href}`}\n aria-current={anchoredContentIsVisible && 'true'}\n data-first={isActive}\n data-active={anchoredContentIsVisible ? 'true' : 'false'}\n onClick={handleClick}\n {...rest}\n >\n <Text\n as=\"span\"\n className={clsx(\n styles['AnchorNav-link-label'],\n anchoredContentIsVisible && styles['AnchorNav-link-label--is-active'],\n )}\n >\n {children}\n </Text>\n </a>\n )\n}\n\ntype AnchorNavActionProps = {\n /\n Required path or location for the action button to link to.\n /\n href: string\n} & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> &\n ButtonBaseProps\n\nfunction ActionBase({children, href, variant = 'secondary', size = 'small', ...rest}: AnchorNavActionProps) {\n return (\n <Button\n as=\"a\"\n variant={variant}\n className={clsx(styles['AnchorNav-action'])}\n href={href}\n data-testid={testIds.action}\n size={size}\n {...rest}\n >\n {children}\n </Button>\n )\n}\n\nfunction SecondaryActionBase({children, href, variant = 'secondary', size = 'small', ...rest}: AnchorNavActionProps) {\n return (\n <Button\n as=\"a\"\n variant={variant}\n className={clsx(styles['AnchorNav-action'])}\n href={href}\n data-testid={testIds.secondaryAction}\n size={size}\n {...rest}\n >\n {children}\n </Button>\n )\n}\n\n/\n AnchorNav allows users to navigate to different sections of a page.\n * @see https://primer.style/brand/components/AnchorNav\n */\nexport const AnchorNav = Object.assign(AnchorNavBase, {\n Link: NavLinkBase,\n Action: ActionBase,\n SecondaryAction: SecondaryActionBase,\n testIds,\n})\n"],"mappings":"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"}

package/esm/Button/Button.d.ts CHANGED Viewed

@@ -2,11 +2,11 @@ import React, { ReactElement } from 'react';
 import type { Icon } from '@primer/octicons-react';
 import type { BaseProps } from '../component-helpers';
 import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes.css';
-export declare const ButtonVariants: readonly ["primary", "secondary", "subtle", "accent"];
+export declare const ButtonVariants: readonly ["primary", "secondary", "subtle"];
 export declare const ButtonSizes: readonly ["small", "medium", "large"];
 export declare const defaultButtonVariant: "secondary";
 export declare const defaultButtonSize: "medium";
-type ButtonVariant = (typeof ButtonVariants)[number];
+export type ButtonVariant = (typeof ButtonVariants)[number];
 export type ButtonBaseProps = {
     /**
      * The leading visual appears before the button content
@@ -26,6 +26,7 @@ export type ButtonBaseProps = {
     size?: (typeof ButtonSizes)[number];
     /**
      * A flag to show/hide the arrow icon
+     * @deprecated The hasArrow prop is deprecated and will be removed in a future release.
      */
     hasArrow?: boolean;
     /**
@@ -45,5 +46,4 @@ export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps<Re
         readonly expandableArrow: string;
     };
 };
-export {};
 //# sourceMappingURL=Button.d.ts.map

package/esm/Button/Button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAoC,YAAY,EAAC,MAAM,OAAO,CAAA;AAC5E,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAIhD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,0GAA0G,CAAA;AAGjH,eAAO,MAAM,cAAc,~~uDAAwD~~,CAAA;~~AACnF~~,eAAO,MAAM,WAAW,uCAAwC,CAAA;AAEhE,eAAO,MAAM,oBAAoB,aAAoB,CAAA;AACrD,eAAO,MAAM,iBAAiB,UAAiB,CAAA;AAE/C,~~KAAK~~,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;~~AAEpD~~,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,aAAa,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC;;OAEG;IACH,cAAc,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACpC;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;IACnC~~;;OAEG~~;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;~~AAID~~,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,SAAS,CAAC,CAAC,CAAC,GAAG;IACpE,EAAE,CAAC,EAAE,CAAC,CAAA;CACP,GAAG,eAAe,GACjB,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAA;AAenC,eAAO,MAAM,OAAO,+JAgKnB,CAAA;AAED,eAAO,MAAM,MAAM;;;;;;;CAAoC,CAAA"}
1	+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAoC,YAAY,EAAC,MAAM,OAAO,CAAA;AAC5E,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAIhD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,0GAA0G,CAAA;AAGjH,eAAO,MAAM,cAAc,6CAA8C,CAAA;AACzE,eAAO,MAAM,WAAW,uCAAwC,CAAA;AAEhE,eAAO,MAAM,oBAAoB,aAAoB,CAAA;AACrD,eAAO,MAAM,iBAAiB,UAAiB,CAAA;AAE/C,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE3D,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,aAAa,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC;;OAEG;IACH,cAAc,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACpC;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB;;OAEG;IACH,IAAI,CAAC,EAAE,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;IACnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,SAAS,CAAC,CAAC,CAAC,GAAG;IACpE,EAAE,CAAC,EAAE,CAAC,CAAA;CACP,GAAG,eAAe,GACjB,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAA;AAenC,eAAO,MAAM,OAAO,+JAgKnB,CAAA;AAED,eAAO,MAAM,MAAM;;;;;;;CAAoC,CAAA"}

package/esm/Button/Button.js CHANGED Viewed

@@ -2,7 +2,7 @@ import e from "../node_modules/clsx/dist/clsx.js";
 import { useAnimation as t } from "../animation/useAnimation.js";
 import { Text as n } from "../Text/Text.js";
 import { ExpandableArrow as r } from "../ExpandableArrow/ExpandableArrow.js";
-import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes-Wg6T_h7K.css';/* empty css                                                                                                    */
+import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes-kII0kqk3.css';/* empty css                                                                                                    */
 import i from "./Button.module.js";
 import a, { forwardRef as o, useCallback as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
@@ -10,13 +10,12 @@ import { jsx as c, jsxs as l } from "react/jsx-runtime";
 var u = [
 	"primary",
 	"secondary",
-	"subtle",
-	"accent"
+	"subtle"
 ], d = [
 	"small",
 	"medium",
 	"large"
-], f = u[1], p = d[1], m = ["subtle"], h = {
+], f = u[1], p = d[1], m = {
 	root: "Button",
 	get leadingVisual() {
 		return `${this.root}-leading-visual`;
@@ -27,39 +26,39 @@ var u = [
 	get expandableArrow() {
 		return `${this.root}-expandable-arrow`;
 	}
-}, g = o(({ animate: o, as: u, variant: d = f, size: g = p, hasArrow: _, block: v = !1, className: y, children: b, disabled: x, "aria-disabled": S, onMouseEnter: C, onMouseLeave: w, onFocus: T, onBlur: E, leadingVisual: D, trailingVisual: O, style: k, ...A }, j) => {
-	let [M, N] = a.useState(!1), [P, F] = a.useState(!1), I = u || "button", L = x || S === "true" || typeof S == "boolean" && S === !0, { classes: R, styles: z } = t(o), B = m.includes(d) ? _ !== !1 : !!_, V = s((e) => {
+}, h = o(({ animate: o, as: u, variant: d = f, size: h = p, hasArrow: g, block: _ = !1, className: v, children: y, disabled: b, "aria-disabled": x, onMouseEnter: S, onMouseLeave: C, onFocus: w, onBlur: T, leadingVisual: E, trailingVisual: D, style: O, ...k }, A) => {
+	let [j, M] = a.useState(!1), [N, P] = a.useState(!1), F = u || "button", I = b || x === "true" || typeof x == "boolean" && x === !0, { classes: L, styles: R } = t(o), z = !!g, B = s((e) => {
 		if (a.isValidElement(e)) return e;
 		if (typeof e == "function") return a.createElement(e);
-	}, []), H = V(D), U = V(O), W = s((e) => {
-		L || (N(!0), C?.(e));
-	}, [L, C]), G = s((e) => {
-		L || (N(!1), w?.(e));
-	}, [L, w]), K = s((e) => {
-		L || (F(!0), T?.(e));
-	}, [L, T]), q = s((e) => {
-		L || (F(!1), E?.(e));
-	}, [L, E]);
-	return /* @__PURE__ */ l(I, {
-		ref: j,
-		className: e(i.Button, i[`Button--${d}`], i[`Button--size-${g}`], v && i["Button--block"], L && i["Button--disabled"], R, y),
-		onMouseEnter: W,
-		onMouseLeave: G,
-		onFocus: K,
-		onBlur: q,
-		disabled: L && I === "button" || void 0,
-		"aria-disabled": L && I !== "button" || void 0,
+	}, []), V = B(E), H = B(D), U = s((e) => {
+		I || (M(!0), S?.(e));
+	}, [I, S]), W = s((e) => {
+		I || (M(!1), C?.(e));
+	}, [I, C]), G = s((e) => {
+		I || (P(!0), w?.(e));
+	}, [I, w]), K = s((e) => {
+		I || (P(!1), T?.(e));
+	}, [I, T]);
+	return /* @__PURE__ */ l(F, {
+		ref: A,
+		className: e(i.Button, i[`Button--${d}`], i[`Button--size-${h}`], _ && i["Button--block"], I && i["Button--disabled"], L, v),
+		onMouseEnter: U,
+		onMouseLeave: W,
+		onFocus: G,
+		onBlur: K,
+		disabled: I && F === "button" || void 0,
+		"aria-disabled": I && F !== "button" || void 0,
 		style: {
-			...z,
-			...k
+			...R,
+			...O
 		},
-		...A,
+		...k,
 		children: [
-			a.isValidElement(H) && /* @__PURE__ */ c("span", {
+			a.isValidElement(V) && /* @__PURE__ */ c("span", {
 				className: i["Button__leading-visual"],
-				"data-testid": h.leadingVisual,
-				children: a.cloneElement(H, {
-					className: e(i["Button__icon-visual"], L && i["Button__icon-visual--disabled"]),
+				"data-testid": m.leadingVisual,
+				children: a.cloneElement(V, {
+					className: e(i["Button__icon-visual"], I && i["Button__icon-visual--disabled"]),
 					"aria-hidden": "true",
 					focusable: "false"
 				})
@@ -68,34 +67,34 @@ var u = [
 				className: i.Button__text,
 				children: /* @__PURE__ */ c(n, {
 					as: "span",
-					size: g === "small" ? "100" : g === "medium" ? "200" : "400",
+					size: h === "small" ? "100" : h === "medium" ? "200" : "400",
 					weight: "medium",
-					className: e(i["Button--label"], i[`Button--label-${g}`], i[`Button--label-${d}`], L && i["Button-label--disabled"]),
-					children: b
+					className: e(i["Button--label"], i[`Button--label-${h}`], i[`Button--label-${d}`], I && i["Button-label--disabled"]),
+					children: y
 				})
 			}),
-			!O && B && /* @__PURE__ */ c("span", {
+			!D && z && /* @__PURE__ */ c("span", {
 				className: e(i["Button__trailing-visual"]),
 				children: /* @__PURE__ */ c(r, {
 					hidden: !0,
-					className: e(i["Button-arrow"], L && i["Button-arrow--disabled"]),
-					expanded: !L && (M || P),
-					"data-testid": h.expandableArrow
+					className: e(i["Button-arrow"], I && i["Button-arrow--disabled"]),
+					expanded: !I && (j || N),
+					"data-testid": m.expandableArrow
 				})
 			}),
-			a.isValidElement(U) && /* @__PURE__ */ c("span", {
+			a.isValidElement(H) && /* @__PURE__ */ c("span", {
 				className: e(i["Button__trailing-visual"]),
-				"data-testid": h.trailingVisual,
-				children: a.cloneElement(U, {
-					className: e(i["Button__icon-visual"], L && i["Button__icon-visual--disabled"]),
+				"data-testid": m.trailingVisual,
+				children: a.cloneElement(H, {
+					className: e(i["Button__icon-visual"], I && i["Button__icon-visual--disabled"]),
 					"aria-hidden": "true",
 					focusable: "false"
 				})
 			})
 		]
 	});
-}), _ = Object.assign(g, { testIds: h });
+}), g = Object.assign(h, { testIds: m });
 //#endregion
-export { _ as Button, d as ButtonSizes, u as ButtonVariants, g as _Button, p as defaultButtonSize, f as defaultButtonVariant };
+export { g as Button, d as ButtonSizes, u as ButtonVariants, h as _Button, p as defaultButtonSize, f as defaultButtonVariant };
 //# sourceMappingURL=Button.js.map