npm - @primer/react - Versions diffs - 38.1.0-rc.b5ef6a423 → 38.1.0-rc.c5ea35a01 - Mend

@primer/react 38.1.0-rc.b5ef6a423 → 38.1.0-rc.c5ea35a01

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 (74) hide show

package/README.md +16 -11
package/dist/ActionBar/ActionBar.js +308 -148
package/dist/ActionMenu/ActionMenu.js +1 -1
package/dist/Autocomplete/AutocompleteInput.d.ts.map +1 -1
package/dist/Autocomplete/AutocompleteInput.js +0 -1
package/dist/Autocomplete/AutocompleteMenu.js +334 -124
package/dist/Avatar/Avatar.js +31 -23
package/dist/Banner/Banner.d.ts.map +1 -1
package/dist/Banner/Banner.js +0 -1
package/dist/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
package/dist/Breadcrumbs/Breadcrumbs.js +1 -0
package/dist/Button/ButtonBase.d.ts.map +1 -1
package/dist/Button/ButtonBase.js +0 -1
package/dist/Checkbox/Checkbox.d.ts.map +1 -1
package/dist/DataTable/Pagination.js +296 -87
package/dist/Dialog/Dialog.js +1 -1
package/dist/FilteredActionList/useAnnouncements.d.ts.map +1 -1
package/dist/FilteredActionList/useAnnouncements.js +1 -0
package/dist/Heading/Heading.d.ts.map +1 -1
package/dist/Heading/Heading.js +0 -1
package/dist/LabelGroup/LabelGroup.d.ts.map +1 -1
package/dist/LabelGroup/LabelGroup.js +1 -0
package/dist/Link/Link.d.ts.map +1 -1
package/dist/Link/Link.js +0 -1
package/dist/Portal/Portal.d.ts.map +1 -1
package/dist/Portal/Portal.js +0 -1
package/dist/SelectPanel/SelectPanel.d.ts.map +1 -1
package/dist/SelectPanel/SelectPanel.js +0 -1
package/dist/SkeletonAvatar/SkeletonAvatar.js +31 -23
package/dist/ThemeProvider.d.ts.map +1 -1
package/dist/ThemeProvider.js +1 -0
package/dist/ToggleSwitch/ToggleSwitch.d.ts.map +1 -1
package/dist/Token/IssueLabelToken.js +280 -57
package/dist/Token/_RemoveTokenButton.d.ts +1 -1
package/dist/Token/_RemoveTokenButton.d.ts.map +1 -1
package/dist/Token/_RemoveTokenButton.js +4 -3
package/dist/TooltipV2/Tooltip.d.ts.map +1 -1
package/dist/TooltipV2/Tooltip.js +28 -25
package/dist/TreeView/TreeView.d.ts.map +1 -1
package/dist/TreeView/TreeView.js +5 -1
package/dist/UnderlineNav/UnderlineNav.d.ts.map +1 -1
package/dist/UnderlineNav/UnderlineNav.js +0 -1
package/dist/deprecated/utils/create-slots.d.ts.map +1 -1
package/dist/experimental/SelectPanel2/SelectPanel.d.ts.map +1 -1
package/dist/experimental/SelectPanel2/SelectPanel.js +4 -2
package/dist/hooks/useAnchoredPosition.d.ts.map +1 -1
package/dist/hooks/useAnchoredPosition.js +0 -1
package/dist/hooks/useControllableState.d.ts.map +1 -1
package/dist/hooks/useControllableState.js +2 -0
package/dist/hooks/useFocusTrap.d.ts.map +1 -1
package/dist/hooks/useFocusTrap.js +0 -1
package/dist/hooks/useFocusZone.d.ts.map +1 -1
package/dist/hooks/useFocusZone.js +0 -1
package/dist/hooks/useIsMacOS.d.ts.map +1 -1
package/dist/hooks/useIsMacOS.js +3 -1
package/dist/hooks/useMedia.d.ts.map +1 -1
package/dist/hooks/useMedia.js +12 -27
package/dist/hooks/useMenuInitialFocus.d.ts.map +1 -1
package/dist/hooks/useMenuInitialFocus.js +0 -1
package/dist/hooks/useOnEscapePress.d.ts.map +1 -1
package/dist/hooks/useOnEscapePress.js +0 -1
package/dist/hooks/useRenderForcingRef.d.ts.map +1 -1
package/dist/hooks/useRenderForcingRef.js +37 -7
package/dist/hooks/useResizeObserver.d.ts.map +1 -1
package/dist/hooks/useResizeObserver.js +0 -1
package/dist/hooks/useSafeTimeout.d.ts.map +1 -1
package/dist/hooks/useSafeTimeout.js +0 -1
package/dist/hooks/useScrollFlash.d.ts.map +1 -1
package/dist/internal/components/ValidationAnimationContainer.d.ts.map +1 -1
package/dist/internal/hooks/useFocus.d.ts.map +1 -1
package/dist/internal/hooks/useMergedRefs.d.ts.map +1 -1
package/dist/internal/hooks/useMergedRefs.js +0 -1
package/generated/components.json +2 -2
package/package.json +3 -3

package/README.md CHANGED Viewed

@@ -28,20 +28,19 @@ To install `@primer/react` in your project, you will need to run the following
 command using [npm](https://www.npmjs.com/):
 ```bash
-npm install -S @primer/react @primer/primitives styled-components@5.x
+npm install -S @primer/react @primer/primitives
 ```
 If you prefer [Yarn](https://yarnpkg.com/), use the following command instead:
 ```bash
-yarn add @primer/react @primer/primitives styled-components@5.x
+yarn add @primer/react @primer/primitives
 ```
-This command will install three packages in your project:
+This command will install two packages in your project:
 - `@primer/react`: used to import and use all the components from Primer
 - `@primer/primitives`: used to include the design tokens from Primer
-- `styled-components`: used to style components
 To learn more about how to use `@primer/react`, visit our documentation site at:
 [primer.style](https://primer.style).
@@ -59,26 +58,32 @@ function App() {
 ```
 At the root of your application, you'll also want to include our
-`ThemeProvider` and `BaseStyles` components along with styles from the
+`BaseStyles` component along with styles from the
 `@primer/primitives` package. For example:
 ```tsx
 // Import each of the themes you would like to use, by default we are including
 // the light theme below
 import '@primer/primitives/dist/css/functional/themes/light.css'
-import {BaseStyles, ThemeProvider} from '@primer/react'
+import {BaseStyles} from '@primer/react'
 function RootLayout() {
   return (
-    <ThemeProvider>
-      <BaseStyles>
-        <App />
-      </BaseStyles>
-    </ThemeProvider>
+    <BaseStyles>
+      <App />
+    </BaseStyles>
   )
 }
 ```
+In addition, you will need to add the following attributes to your `html` element:
+```html
+<html data-light-theme="light" data-dark-theme="dark" data-color-mode="auto">
+  <!-- ... -->
+</html>
+```
 ## 📖 Documentation
 The documentation for `@primer/react` lives at [primer.style](https://primer.style). There, you'll find detailed documentation on getting started, all of the components, our theme, our principles, and more.

package/dist/ActionBar/ActionBar.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { c } from 'react-compiler-runtime';
-import React, { forwardRef, useRef, useState, useCallback, useId } from 'react';
+import React, { forwardRef, useRef, useState, useId } from 'react';
 import { KebabHorizontalIcon } from '@primer/octicons-react';
 import { ActionList } from '../ActionList/index.js';
 import useIsomorphicLayoutEffect from '../utils/useIsomorphicLayoutEffect.js';
@@ -10,7 +10,7 @@ import { IconButton } from '../Button/IconButton.js';
 import { useFocusZone } from '../hooks/useFocusZone.js';
 import styles from './ActionBar.module.css.js';
 import { clsx } from 'clsx';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRefObjectAsForwardedRef } from '../hooks/useRefObjectAsForwardedRef.js';
 import { FocusKeys } from '@primer/behaviors';
 import { ActionMenu } from '../ActionMenu/ActionMenu.js';
@@ -86,176 +86,330 @@ const getMenuItems = (navWidth, moreMenuWidth, childRegistry, hasActiveMenu, gap
   }
 };
 const ActionBar = props => {
+  const $ = c(43);
   const {
-    size = 'medium',
+    size: t0,
     children,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledBy,
-    flush = false,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    flush: t1,
     className,
-    gap = 'condensed'
+    gap: t2
   } = props;
-  // We derive the numeric gap from computed style so layout math stays in sync with CSS
+  const size = t0 === undefined ? "medium" : t0;
+  const flush = t1 === undefined ? false : t1;
+  const gap = t2 === undefined ? "condensed" : t2;
   const listRef = useRef(null);
   const [computedGap, setComputedGap] = useState(ACTIONBAR_ITEM_GAP);
-  const [childRegistry, setChildRegistry] = useState(() => new Map());
-  const registerChild = useCallback((id, childProps) => setChildRegistry(prev => new Map(prev).set(id, childProps)), []);
-  const unregisterChild = useCallback(id_0 => setChildRegistry(prev_0 => new Map(prev_0).set(id_0, null)), []);
-  const [menuItemIds, setMenuItemIds] = useState(() => new Set());
+  const [childRegistry, setChildRegistry] = useState(_temp);
+  let t3;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = (id, childProps) => setChildRegistry(prev => new Map(prev).set(id, childProps));
+    $[0] = t3;
+  } else {
+    t3 = $[0];
+  }
+  const registerChild = t3;
+  let t4;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = id_0 => setChildRegistry(prev_0 => new Map(prev_0).set(id_0, null));
+    $[1] = t4;
+  } else {
+    t4 = $[1];
+  }
+  const unregisterChild = t4;
+  const [menuItemIds, setMenuItemIds] = useState(_temp2);
   const navRef = useRef(null);
-  // measure gap after first render & whenever gap scale changes
-  useIsomorphicLayoutEffect(() => {
-    if (!listRef.current) return;
-    const g = window.getComputedStyle(listRef.current).gap;
-    const parsed = parseFloat(g);
-    if (!Number.isNaN(parsed)) setComputedGap(parsed);
-  }, [gap]);
+  let t5;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = () => {
+      if (!listRef.current) {
+        return;
+      }
+      const g = window.getComputedStyle(listRef.current).gap;
+      const parsed = parseFloat(g);
+      if (!Number.isNaN(parsed)) {
+        setComputedGap(parsed);
+      }
+    };
+    $[2] = t5;
+  } else {
+    t5 = $[2];
+  }
+  let t6;
+  if ($[3] !== gap) {
+    t6 = [gap];
+    $[3] = gap;
+    $[4] = t6;
+  } else {
+    t6 = $[4];
+  }
+  useIsomorphicLayoutEffect(t5, t6);
   const moreMenuRef = useRef(null);
   const moreMenuBtnRef = useRef(null);
   const containerRef = React.useRef(null);
-  useResizeObserver(resizeObserverEntries => {
-    var _moreMenuRef$current$, _moreMenuRef$current;
-    const navWidth = resizeObserverEntries[0].contentRect.width;
-    const moreMenuWidth = (_moreMenuRef$current$ = (_moreMenuRef$current = moreMenuRef.current) === null || _moreMenuRef$current === void 0 ? void 0 : _moreMenuRef$current.getBoundingClientRect().width) !== null && _moreMenuRef$current$ !== void 0 ? _moreMenuRef$current$ : 0;
-    const hasActiveMenu = menuItemIds.size > 0;
-    if (navWidth > 0) {
-      const newMenuItemIds = getMenuItems(navWidth, moreMenuWidth, childRegistry, hasActiveMenu, computedGap);
-      if (newMenuItemIds) setMenuItemIds(newMenuItemIds);
-    }
-  }, navRef);
-  const isVisibleChild = useCallback(id_1 => {
-    return !menuItemIds.has(id_1);
-  }, [menuItemIds]);
+  let t7;
+  if ($[5] !== childRegistry || $[6] !== computedGap || $[7] !== menuItemIds.size) {
+    t7 = resizeObserverEntries => {
+      var _moreMenuRef$current$, _moreMenuRef$current;
+      const navWidth = resizeObserverEntries[0].contentRect.width;
+      const moreMenuWidth = (_moreMenuRef$current$ = (_moreMenuRef$current = moreMenuRef.current) === null || _moreMenuRef$current === void 0 ? void 0 : _moreMenuRef$current.getBoundingClientRect().width) !== null && _moreMenuRef$current$ !== void 0 ? _moreMenuRef$current$ : 0;
+      const hasActiveMenu = menuItemIds.size > 0;
+      if (navWidth > 0) {
+        const newMenuItemIds = getMenuItems(navWidth, moreMenuWidth, childRegistry, hasActiveMenu, computedGap);
+        if (newMenuItemIds) {
+          setMenuItemIds(newMenuItemIds);
+        }
+      }
+    };
+    $[5] = childRegistry;
+    $[6] = computedGap;
+    $[7] = menuItemIds.size;
+    $[8] = t7;
+  } else {
+    t7 = $[8];
+  }
+  useResizeObserver(t7, navRef);
+  let t8;
+  if ($[9] !== menuItemIds) {
+    t8 = id_1 => !menuItemIds.has(id_1);
+    $[9] = menuItemIds;
+    $[10] = t8;
+  } else {
+    t8 = $[10];
+  }
+  const isVisibleChild = t8;
   const [isWidgetOpen, setIsWidgetOpen] = useState(false);
-  const closeOverlay = React.useCallback(() => {
-    setIsWidgetOpen(false);
-  }, [setIsWidgetOpen]);
-  const focusOnMoreMenuBtn = React.useCallback(() => {
-    var _moreMenuBtnRef$curre;
-    (_moreMenuBtnRef$curre = moreMenuBtnRef.current) === null || _moreMenuBtnRef$curre === void 0 ? void 0 : _moreMenuBtnRef$curre.focus();
-  }, []);
-  useOnEscapePress(event => {
-    if (isWidgetOpen) {
-      event.preventDefault();
-      closeOverlay();
-      focusOnMoreMenuBtn();
-    }
-  }, [isWidgetOpen]);
-  useOnOutsideClick({
-    onClickOutside: closeOverlay,
-    containerRef,
-    ignoreClickRefs: [moreMenuBtnRef]
-  });
-  useFocusZone({
-    containerRef: listRef,
-    bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
-    focusOutBehavior: 'wrap'
-  });
-  const groupedItems = React.useMemo(() => {
-    const groupedItemsMap = new Map();
+  let t9;
+  if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+    t9 = () => {
+      setIsWidgetOpen(false);
+    };
+    $[11] = t9;
+  } else {
+    t9 = $[11];
+  }
+  const closeOverlay = t9;
+  let t10;
+  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+    t10 = () => {
+      var _moreMenuBtnRef$curre;
+      (_moreMenuBtnRef$curre = moreMenuBtnRef.current) === null || _moreMenuBtnRef$curre === void 0 ? void 0 : _moreMenuBtnRef$curre.focus();
+    };
+    $[12] = t10;
+  } else {
+    t10 = $[12];
+  }
+  const focusOnMoreMenuBtn = t10;
+  let t11;
+  let t12;
+  if ($[13] !== isWidgetOpen) {
+    t11 = event => {
+      if (isWidgetOpen) {
+        event.preventDefault();
+        closeOverlay();
+        focusOnMoreMenuBtn();
+      }
+    };
+    t12 = [isWidgetOpen];
+    $[13] = isWidgetOpen;
+    $[14] = t11;
+    $[15] = t12;
+  } else {
+    t11 = $[14];
+    t12 = $[15];
+  }
+  useOnEscapePress(t11, t12);
+  let t13;
+  if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+    t13 = {
+      onClickOutside: closeOverlay,
+      containerRef,
+      ignoreClickRefs: [moreMenuBtnRef]
+    };
+    $[16] = t13;
+  } else {
+    t13 = $[16];
+  }
+  useOnOutsideClick(t13);
+  let t14;
+  if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+    t14 = {
+      containerRef: listRef,
+      bindKeys: FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd,
+      focusOutBehavior: "wrap"
+    };
+    $[17] = t14;
+  } else {
+    t14 = $[17];
+  }
+  useFocusZone(t14);
+  let groupedItemsMap;
+  if ($[18] !== childRegistry) {
+    groupedItemsMap = new Map();
     for (const [key, childProps_0] of childRegistry) {
-      if ((childProps_0 === null || childProps_0 === void 0 ? void 0 : childProps_0.type) === 'action' && childProps_0.groupId) {
+      if ((childProps_0 === null || childProps_0 === void 0 ? void 0 : childProps_0.type) === "action" && childProps_0.groupId) {
         const existingGroup = groupedItemsMap.get(childProps_0.groupId) || [];
         existingGroup.push([key, childProps_0]);
         groupedItemsMap.set(childProps_0.groupId, existingGroup);
       }
     }
-    return groupedItemsMap;
-  }, [childRegistry]);
-  return /*#__PURE__*/jsx(ActionBarContext.Provider, {
-    value: {
+    $[18] = childRegistry;
+    $[19] = groupedItemsMap;
+  } else {
+    groupedItemsMap = $[19];
+  }
+  const groupedItems = groupedItemsMap;
+  let t15;
+  if ($[20] !== isVisibleChild || $[21] !== size) {
+    t15 = {
       size,
       registerChild,
       unregisterChild,
       isVisibleChild
-    },
-    children: /*#__PURE__*/jsx("div", {
+    };
+    $[20] = isVisibleChild;
+    $[21] = size;
+    $[22] = t15;
+  } else {
+    t15 = $[22];
+  }
+  let t16;
+  if ($[23] !== className) {
+    t16 = clsx(className, styles.Nav);
+    $[23] = className;
+    $[24] = t16;
+  } else {
+    t16 = $[24];
+  }
+  let t17;
+  if ($[25] !== ariaLabel || $[26] !== childRegistry || $[27] !== groupedItems || $[28] !== menuItemIds) {
+    t17 = menuItemIds.size > 0 && /*#__PURE__*/jsxs(ActionMenu, {
+      children: [/*#__PURE__*/jsx(ActionMenu.Anchor, {
+        children: /*#__PURE__*/jsx(IconButton, {
+          variant: "invisible",
+          "aria-label": `More ${ariaLabel} items`,
+          icon: KebabHorizontalIcon
+        })
+      }), /*#__PURE__*/jsx(ActionMenu.Overlay, {
+        children: /*#__PURE__*/jsx(ActionList, {
+          children: Array.from(menuItemIds).map(id_2 => {
+            const menuItem = childRegistry.get(id_2);
+            if (!menuItem) {
+              return null;
+            }
+            if (menuItem.type === "divider") {
+              return /*#__PURE__*/jsx(ActionList.Divider, {}, id_2);
+            } else {
+              if (menuItem.type === "action") {
+                const {
+                  onClick,
+                  icon: Icon,
+                  label,
+                  disabled
+                } = menuItem;
+                return /*#__PURE__*/jsxs(ActionList.Item, {
+                  onClick: event_0 => {
+                    closeOverlay();
+                    focusOnMoreMenuBtn();
+                    typeof onClick === "function" && onClick(event_0);
+                  },
+                  disabled: disabled,
+                  children: [/*#__PURE__*/jsx(ActionList.LeadingVisual, {
+                    children: /*#__PURE__*/jsx(Icon, {})
+                  }), label]
+                }, label);
+              }
+            }
+            const groupedMenuItems = groupedItems.get(id_2) || [];
+            if (menuItem.type === "group") {
+              return /*#__PURE__*/jsx(React.Fragment, {
+                children: groupedMenuItems.map(t18 => {
+                  const [key_0, childProps_1] = t18;
+                  if (childProps_1.type === "action") {
+                    const {
+                      onClick: onClick_0,
+                      icon: Icon_0,
+                      label: label_0,
+                      disabled: disabled_0
+                    } = childProps_1;
+                    return /*#__PURE__*/jsxs(ActionList.Item, {
+                      onSelect: event_1 => {
+                        closeOverlay();
+                        focusOnMoreMenuBtn();
+                        typeof onClick_0 === "function" && onClick_0(event_1);
+                      },
+                      disabled: disabled_0,
+                      children: [/*#__PURE__*/jsx(ActionList.LeadingVisual, {
+                        children: /*#__PURE__*/jsx(Icon_0, {})
+                      }), label_0]
+                    }, key_0);
+                  }
+                  return null;
+                })
+              }, id_2);
+            }
+          })
+        })
+      })]
+    });
+    $[25] = ariaLabel;
+    $[26] = childRegistry;
+    $[27] = groupedItems;
+    $[28] = menuItemIds;
+    $[29] = t17;
+  } else {
+    t17 = $[29];
+  }
+  let t18;
+  if ($[30] !== ariaLabel || $[31] !== ariaLabelledBy || $[32] !== children || $[33] !== gap || $[34] !== t17) {
+    t18 = /*#__PURE__*/jsxs("div", {
+      ref: listRef,
+      role: "toolbar",
+      className: styles.List,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "data-gap": gap,
+      children: [children, t17]
+    });
+    $[30] = ariaLabel;
+    $[31] = ariaLabelledBy;
+    $[32] = children;
+    $[33] = gap;
+    $[34] = t17;
+    $[35] = t18;
+  } else {
+    t18 = $[35];
+  }
+  let t19;
+  if ($[36] !== flush || $[37] !== t16 || $[38] !== t18) {
+    t19 = /*#__PURE__*/jsx("div", {
       ref: navRef,
-      className: clsx(className, styles.Nav),
+      className: t16,
       "data-flush": flush,
-      children: /*#__PURE__*/jsxs("div", {
-        ref: listRef,
-        role: "toolbar",
-        className: styles.List,
-        "aria-label": ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        "data-gap": gap,
-        children: [children, menuItemIds.size > 0 && /*#__PURE__*/jsxs(ActionMenu, {
-          children: [/*#__PURE__*/jsx(ActionMenu.Anchor, {
-            children: /*#__PURE__*/jsx(IconButton, {
-              variant: "invisible",
-              "aria-label": `More ${ariaLabel} items`,
-              icon: KebabHorizontalIcon
-            })
-          }), /*#__PURE__*/jsx(ActionMenu.Overlay, {
-            children: /*#__PURE__*/jsx(ActionList, {
-              children: Array.from(menuItemIds).map(id_2 => {
-                const menuItem = childRegistry.get(id_2);
-                if (!menuItem) return null;
-                if (menuItem.type === 'divider') {
-                  return /*#__PURE__*/jsx(ActionList.Divider, {}, id_2);
-                } else if (menuItem.type === 'action') {
-                  const {
-                    onClick,
-                    icon: Icon,
-                    label,
-                    disabled
-                  } = menuItem;
-                  return /*#__PURE__*/jsxs(ActionList.Item, {
-                    // eslint-disable-next-line primer-react/prefer-action-list-item-onselect
-                    onClick: event_0 => {
-                      closeOverlay();
-                      focusOnMoreMenuBtn();
-                      typeof onClick === 'function' && onClick(event_0);
-                    },
-                    disabled: disabled,
-                    children: [/*#__PURE__*/jsx(ActionList.LeadingVisual, {
-                      children: /*#__PURE__*/jsx(Icon, {})
-                    }), label]
-                  }, label);
-                }
-                // Use the memoized map instead of filtering each time
-                const groupedMenuItems = groupedItems.get(id_2) || [];
-                // If we ever add additional types, this condition will be necessary
-                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-                if (menuItem.type === 'group') {
-                  return /*#__PURE__*/jsx(React.Fragment, {
-                    children: groupedMenuItems.map(([key_0, childProps_1]) => {
-                      if (childProps_1.type === 'action') {
-                        const {
-                          onClick: onClick_0,
-                          icon: Icon_0,
-                          label: label_0,
-                          disabled: disabled_0
-                        } = childProps_1;
-                        return /*#__PURE__*/jsxs(ActionList.Item, {
-                          onSelect: event_1 => {
-                            closeOverlay();
-                            focusOnMoreMenuBtn();
-                            typeof onClick_0 === 'function' && onClick_0(event_1);
-                          },
-                          disabled: disabled_0,
-                          children: [/*#__PURE__*/jsx(ActionList.LeadingVisual, {
-                            children: /*#__PURE__*/jsx(Icon_0, {})
-                          }), label_0]
-                        }, key_0);
-                      }
-                      return null;
-                    })
-                  }, id_2);
-                }
-              })
-            })
-          })]
-        })]
-      })
-    })
-  });
+      children: t18
+    });
+    $[36] = flush;
+    $[37] = t16;
+    $[38] = t18;
+    $[39] = t19;
+  } else {
+    t19 = $[39];
+  }
+  let t20;
+  if ($[40] !== t15 || $[41] !== t19) {
+    t20 = /*#__PURE__*/jsx(ActionBarContext.Provider, {
+      value: t15,
+      children: t19
+    });
+    $[40] = t15;
+    $[41] = t19;
+    $[42] = t20;
+  } else {
+    t20 = $[42];
+  }
+  return t20;
 };
-ActionBar.displayName = "ActionBar";
 const ActionBarIconButton = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
   const $ = c(28);
   let disabled;
@@ -531,5 +685,11 @@ const VerticalDivider = () => {
   }
   return t2;
 };
+function _temp() {
+  return new Map();
+}
+function _temp2() {
+  return new Set();
+}
 export { ActionBar, ActionBarGroup, ActionBarIconButton, VerticalDivider };

package/dist/ActionMenu/ActionMenu.js CHANGED Viewed

@@ -83,7 +83,7 @@ const Menu = ({
       // tooltip trigger
       const anchorChildren = child.props.children;
       if (anchorChildren.type === MenuButton || isSlot(anchorChildren, MenuButton)) {
-        // eslint-disable-next-line react-compiler/react-compiler
+        // eslint-disable-next-line react-hooks/immutability
         renderAnchor = anchorProps => {
           // We need to attach the anchor props to the tooltip trigger (ActionMenu.Button's grandchild) not the tooltip itself.
           const triggerButton = /*#__PURE__*/React.cloneElement(anchorChildren, mergeAnchorHandlers({

package/dist/Autocomplete/AutocompleteInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AutocompleteInput.d.ts","sourceRoot":"","sources":["../../src/Autocomplete/AutocompleteInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqD,MAAM,OAAO,CAAA;AACzE,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,OAAO,SAAS,MAAM,cAAc,CAAA;AAEpC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAGlD,KAAK,8BAA8B,GAAG;IAEpC,EAAE,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAA;IAEtD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAID,QAAA,MAAM,iBAAiB,~~EAkKlB~~,8BAA8B,CAAC,OAAO,SAAS,EAAE,8BAA8B,CAAC,CAAA;AAIrF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,iBAAiB,CAAC,CAAA;AAC7E,eAAe,iBAAiB,CAAA"}
1	+ {"version":3,"file":"AutocompleteInput.d.ts","sourceRoot":"","sources":["../../src/Autocomplete/AutocompleteInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqD,MAAM,OAAO,CAAA;AACzE,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,OAAO,SAAS,MAAM,cAAc,CAAA;AAEpC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAGlD,KAAK,8BAA8B,GAAG;IAEpC,EAAE,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAA;IAEtD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAID,QAAA,MAAM,iBAAiB,EAiKlB,8BAA8B,CAAC,OAAO,SAAS,EAAE,8BAA8B,CAAC,CAAA;AAIrF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,iBAAiB,CAAC,CAAA;AAC7E,eAAe,iBAAiB,CAAA"}

package/dist/Autocomplete/AutocompleteInput.js CHANGED Viewed

@@ -115,7 +115,6 @@ const AutocompleteInput = /*#__PURE__*/React.forwardRef(({
     }
     // calling this useEffect when `highlightRemainingText` changes breaks backspace functionality
-    // eslint-disable-next-line react-compiler/react-compiler
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [autocompleteSuggestion, inputValue, inputRef, isMenuDirectlyActivated]);
   useEffect(() => {