@primer/react 38.0.0-rc.389f01088 → 38.0.0-rc.5

package/lib/experimental/UnderlinePanels/UnderlinePanels.js

@@ -1,218 +0,0 @@
-'use strict';
-
-var reactCompilerRuntime = require('react-compiler-runtime');
-var React = require('react');
-var tabContainerElement = require('../../node_modules/@github/tab-container-element/dist/tab-container-element.js');
-require('../../node_modules/@github/tab-container-element/dist/tab-container-element-define.js');
-var createComponent = require('../../utils/create-component.js');
-var UnderlineTabbedInterface = require('../../internal/components/UnderlineTabbedInterface.js');
-var invariant = require('../../utils/invariant.js');
-var defaultSxProp = require('../../utils/defaultSxProp.js');
-var useResizeObserver = require('../../hooks/useResizeObserver.js');
-var useIsomorphicLayoutEffect = require('../../utils/useIsomorphicLayoutEffect.js');
-var UnderlinePanels_module = require('./UnderlinePanels.module.css.js');
-var clsx = require('clsx');
-var jsxRuntime = require('react/jsx-runtime');
-var useId = require('../../hooks/useId.js');
-var Box = require('../../Box/Box.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const TabContainerComponent = createComponent.createComponent(tabContainerElement.TabContainerElement, 'tab-container');
-const UnderlinePanels = ({
-  'aria-label': ariaLabel,
-  'aria-labelledby': ariaLabelledBy,
-  children,
-  loadingCounters,
-  sx: sxProp = defaultSxProp.defaultSxProp,
-  className,
-  ...props
-}) => {
-  const [iconsVisible, setIconsVisible] = React.useState(true);
-  const wrapperRef = React.useRef(null);
-  const listRef = React.useRef(null);
-  // We need to always call useId() because React Hooks must be
-  // called in the exact same order in every component render
-  const parentId = useId.useId(props.id);
-  const [tabs, setTabs] = React.useState([]);
-  const [tabPanels, setTabPanels] = React.useState([]);
-
-  // Make sure we have fresh prop data whenever the tabs or panels are updated (keep aria-selected current)
-  React.useEffect(() => {
-    // Loop through the chidren, if it's a tab, then add id="{id}-tab-{index}"
-    // If it's a panel, then add aria-labelledby="{id}-tab-{index}"
-    let tabIndex = 0;
-    let panelIndex = 0;
-    const childrenWithProps = React.Children.map(children, child => {
-      if (/*#__PURE__*/React.isValidElement(child) && child.type === Tab) {
-        return /*#__PURE__*/React.cloneElement(child, {
-          id: `${parentId}-tab-${tabIndex++}`,
-          loadingCounters,
-          iconsVisible
-        });
-      }
-      if (/*#__PURE__*/React.isValidElement(child) && child.type === Panel) {
-        return /*#__PURE__*/React.cloneElement(child, {
-          'aria-labelledby': `${parentId}-tab-${panelIndex++}`
-        });
-      }
-      return child;
-    });
-    const newTabs = React.Children.toArray(childrenWithProps).filter(child_0 => {
-      return /*#__PURE__*/React.isValidElement(child_0) && child_0.type === Tab;
-    });
-    const newTabPanels = React.Children.toArray(childrenWithProps).filter(child_1 => /*#__PURE__*/React.isValidElement(child_1) && child_1.type === Panel);
-    setTabs(newTabs);
-    setTabPanels(newTabPanels);
-  }, [children, parentId, loadingCounters, iconsVisible]);
-  const tabsHaveIcons = tabs.some(tab => /*#__PURE__*/React__default.default.isValidElement(tab) && tab.props.icon);
-
-  // this is a workaround to get the list's width on the first render
-  const [listWidth, setListWidth] = React.useState(0);
-  useIsomorphicLayoutEffect(() => {
-    var _listRef$current$getB, _listRef$current;
-    if (!tabsHaveIcons) {
-      return;
-    }
-    setListWidth((_listRef$current$getB = (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : _listRef$current.getBoundingClientRect().width) !== null && _listRef$current$getB !== void 0 ? _listRef$current$getB : 0);
-  }, [tabsHaveIcons]);
-
-  // when the wrapper resizes, check if the icons should be visible
-  // by comparing the wrapper width to the list width
-  useResizeObserver.useResizeObserver(resizeObserverEntries => {
-    if (!tabsHaveIcons) {
-      return;
-    }
-    const wrapperWidth = resizeObserverEntries[0].contentRect.width;
-    setIconsVisible(wrapperWidth > listWidth);
-  }, wrapperRef, []);
-  if (process.env.NODE_ENV !== "production") {
-    const selectedTabs = tabs.filter(tab_0 => {
-      const ariaSelected = /*#__PURE__*/React__default.default.isValidElement(tab_0) && tab_0.props['aria-selected'];
-      return ariaSelected === true || ariaSelected === 'true';
-    });
-    !(selectedTabs.length <= 1) ? process.env.NODE_ENV !== "production" ? invariant.invariant(false, 'Only one tab can be selected at a time.') : invariant.invariant(false) : void 0;
-    !(tabs.length === tabPanels.length) ? process.env.NODE_ENV !== "production" ? invariant.invariant(false, `The number of tabs and panels must be equal. Counted ${tabs.length} tabs and ${tabPanels.length} panels.`) : invariant.invariant(false) : void 0;
-  }
-  return /*#__PURE__*/jsxRuntime.jsxs(TabContainerComponent, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(UnderlineTabbedInterface.UnderlineWrapper, {
-      ref: wrapperRef,
-      slot: "tablist-wrapper",
-      "data-icons-visible": iconsVisible,
-      sx: sxProp,
-      className: clsx.clsx(className, UnderlinePanels_module.StyledUnderlineWrapper),
-      ...props,
-      children: /*#__PURE__*/jsxRuntime.jsx(UnderlineTabbedInterface.UnderlineItemList, {
-        ref: listRef,
-        "aria-label": ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        role: "tablist",
-        children: tabs
-      })
-    }), tabPanels]
-  });
-};
-UnderlinePanels.displayName = "UnderlinePanels";
-const Tab = t0 => {
-  const $ = reactCompilerRuntime.c(16);
-  let ariaSelected;
-  let onSelect;
-  let props;
-  let t1;
-  if ($[0] !== t0) {
-    ({
-      "aria-selected": ariaSelected,
-      sx: t1,
-      onSelect,
-      ...props
-    } = t0);
-    $[0] = t0;
-    $[1] = ariaSelected;
-    $[2] = onSelect;
-    $[3] = props;
-    $[4] = t1;
-  } else {
-    ariaSelected = $[1];
-    onSelect = $[2];
-    props = $[3];
-    t1 = $[4];
-  }
-  const sxProp = t1 === undefined ? defaultSxProp.defaultSxProp : t1;
-  let t2;
-  if ($[5] !== onSelect) {
-    t2 = event => {
-      if (!event.defaultPrevented && typeof onSelect === "function") {
-        onSelect(event);
-      }
-    };
-    $[5] = onSelect;
-    $[6] = t2;
-  } else {
-    t2 = $[6];
-  }
-  const clickHandler = t2;
-  let t3;
-  if ($[7] !== onSelect) {
-    t3 = event_0 => {
-      if ((event_0.key === " " || event_0.key === "Enter") && !event_0.defaultPrevented && typeof onSelect === "function") {
-        onSelect(event_0);
-      }
-    };
-    $[7] = onSelect;
-    $[8] = t3;
-  } else {
-    t3 = $[8];
-  }
-  const keyDownHandler = t3;
-  const t4 = ariaSelected ? 0 : -1;
-  let t5;
-  if ($[9] !== ariaSelected || $[10] !== clickHandler || $[11] !== keyDownHandler || $[12] !== props || $[13] !== sxProp || $[14] !== t4) {
-    t5 = /*#__PURE__*/jsxRuntime.jsx(UnderlineTabbedInterface.UnderlineItem, {
-      as: "button",
-      role: "tab",
-      tabIndex: t4,
-      "aria-selected": ariaSelected,
-      sx: sxProp,
-      type: "button",
-      onClick: clickHandler,
-      onKeyDown: keyDownHandler,
-      ...props
-    });
-    $[9] = ariaSelected;
-    $[10] = clickHandler;
-    $[11] = keyDownHandler;
-    $[12] = props;
-    $[13] = sxProp;
-    $[14] = t4;
-    $[15] = t5;
-  } else {
-    t5 = $[15];
-  }
-  return t5;
-};
-Tab.displayName = 'UnderlinePanels.Tab';
-const Panel = props => {
-  const $ = reactCompilerRuntime.c(2);
-  let t0;
-  if ($[0] !== props) {
-    t0 = /*#__PURE__*/jsxRuntime.jsx(Box, {
-      as: "div",
-      role: "tabpanel",
-      ...props
-    });
-    $[0] = props;
-    $[1] = t0;
-  } else {
-    t0 = $[1];
-  }
-  return t0;
-};
-Panel.displayName = 'UnderlinePanels.Panel';
-var UnderlinePanels$1 = Object.assign(UnderlinePanels, {
-  Panel,
-  Tab
-});
-
-module.exports = UnderlinePanels$1;

package/lib/experimental/UnderlinePanels/UnderlinePanels.module.css.js

@@ -1,7 +0,0 @@
-'use strict';
-
-require('./UnderlinePanels-e4b325b9.css');
-
-var classes = {"StyledUnderlineWrapper":"prc-UnderlinePanels-StyledUnderlineWrapper-DusUj"};
-
-module.exports = classes;

package/lib/experimental/UnderlinePanels/index.d.ts

@@ -1,4 +0,0 @@
-import UnderlinePanels from './UnderlinePanels';
-export { UnderlinePanels };
-export type { UnderlinePanelsProps, TabProps as UnderlinePanelsTabProps, PanelProps as UnderlinePanelsPanelProps, } from './UnderlinePanels';
-//# sourceMappingURL=index.d.ts.map

package/lib/experimental/hooks/index.d.ts

@@ -1,3 +0,0 @@
-export * from '../../hooks/useSlots';
-export { useOverflow } from '../../hooks/useOverflow';
-//# sourceMappingURL=index.d.ts.map

package/lib/experimental/index.d.ts

@@ -1,44 +0,0 @@
-/**
- * This is the place where we keep components that are not part of the public
- * api yet (not in main bundle). We don't recommend using it in production.
- *
- * But, they are published on npm and you can import them for experimentation/feedback.
- * example: import {ActionList} from '@primer/react/drafts
- */
-export { Blankslate } from '../Blankslate';
-export type { BlankslateProps } from '../Blankslate';
-export { ButtonBase } from '../Button';
-export type { ButtonBaseProps } from '../Button';
-export { Banner } from '../Banner';
-export type { BannerProps } from '../Banner';
-export { DataTable, Table, createColumnHelper } from '../DataTable';
-export type { DataTableProps, TableProps, TableHeadProps, TableBodyProps, TableRowProps, TableHeaderProps, TableCellProps, TableContainerProps, TableTitleProps, TableSubtitleProps, TableActionsProps, Column, CellAlignment, ColumnWidth, UniqueRow, ObjectPaths, } from '../DataTable';
-export * from '../Dialog/Dialog';
-export { InlineMessage } from '../InlineMessage';
-export type { InlineMessageProps } from '../InlineMessage';
-export * from '../PageHeader';
-export * from '../Hidden';
-export * from './hooks';
-export { NavList } from '../NavList';
-export type { NavListProps, NavListItemProps, NavListSubNavProps, NavListGroupProps, NavListLeadingVisualProps, NavListTrailingVisualProps, NavListDividerProps, } from '../NavList';
-export * from './SelectPanel2';
-export { Tooltip } from '../TooltipV2';
-export type { TooltipProps } from '../TooltipV2';
-export * from '../ActionBar';
-export { ScrollableRegion } from '../ScrollableRegion';
-export type { ScrollableRegionProps } from '../ScrollableRegion';
-export { Stack } from '../Stack';
-export type { StackProps, StackItemProps } from '../Stack';
-export { Announce, AriaStatus, AriaAlert } from '../live-region';
-export type { AnnounceProps, AriaStatusProps, AriaAlertProps } from '../live-region';
-export { UnderlinePanels } from './UnderlinePanels';
-export type { UnderlinePanelsProps, UnderlinePanelsTabProps, UnderlinePanelsPanelProps } from './UnderlinePanels';
-export { SkeletonBox, SkeletonText, SkeletonAvatar } from './Skeleton';
-export { FeatureFlags, DefaultFeatureFlags, useFeatureFlag } from '../FeatureFlags';
-export type { FeatureFlagsProps } from '../FeatureFlags';
-export { FilteredActionList } from '../FilteredActionList';
-export type { FilteredActionListProps } from '../FilteredActionList';
-export { IssueLabel } from './IssueLabel';
-export type { IssueLabelProps } from './IssueLabel';
-export * from '../KeybindingHint';
-//# sourceMappingURL=index.d.ts.map

package/lib/experimental/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/experimental/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAC,UAAU,EAAC,MAAM,eAAe,CAAA;AACxC,YAAY,EAAC,eAAe,EAAC,MAAM,eAAe,CAAA;AAElD,OAAO,EAAC,UAAU,EAAC,MAAM,WAAW,CAAA;AACpC,YAAY,EAAC,eAAe,EAAC,MAAM,WAAW,CAAA;AAE9C,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAA;AAChC,YAAY,EAAC,WAAW,EAAC,MAAM,WAAW,CAAA;AAE1C,OAAO,EAAC,SAAS,EAAE,KAAK,EAAE,kBAAkB,EAAC,MAAM,cAAc,CAAA;AACjE,YAAY,EACV,cAAc,EACd,UAAU,EACV,cAAc,EACd,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,mBAAmB,EACnB,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,MAAM,EACN,aAAa,EACb,WAAW,EACX,SAAS,EACT,WAAW,GACZ,MAAM,cAAc,CAAA;AAErB,cAAc,kBAAkB,CAAA;AAEhC,OAAO,EAAC,aAAa,EAAC,MAAM,kBAAkB,CAAA;AAC9C,YAAY,EAAC,kBAAkB,EAAC,MAAM,kBAAkB,CAAA;AAExD,cAAc,eAAe,CAAA;AAE7B,cAAc,WAAW,CAAA;AAEzB,cAAc,SAAS,CAAA;AAEvB,OAAO,EAAC,OAAO,EAAC,MAAM,YAAY,CAAA;AAClC,YAAY,EACV,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,yBAAyB,EACzB,0BAA0B,EAC1B,mBAAmB,GACpB,MAAM,YAAY,CAAA;AACnB,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EAAC,OAAO,EAAC,MAAM,cAAc,CAAA;AACpC,YAAY,EAAC,YAAY,EAAC,MAAM,cAAc,CAAA;AAC9C,cAAc,cAAc,CAAA;AAE5B,OAAO,EAAC,gBAAgB,EAAC,MAAM,qBAAqB,CAAA;AACpD,YAAY,EAAC,qBAAqB,EAAC,MAAM,qBAAqB,CAAA;AAE9D,OAAO,EAAC,KAAK,EAAC,MAAM,UAAU,CAAA;AAC9B,YAAY,EAAC,UAAU,EAAE,cAAc,EAAC,MAAM,UAAU,CAAA;AAExD,OAAO,EAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAA;AAC9D,YAAY,EAAC,aAAa,EAAE,eAAe,EAAE,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElF,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAA;AACjD,YAAY,EAAC,oBAAoB,EAAE,uBAAuB,EAAE,yBAAyB,EAAC,MAAM,mBAAmB,CAAA;AAE/G,OAAO,EAAC,WAAW,EAAE,YAAY,EAAE,cAAc,EAAC,MAAM,YAAY,CAAA;AACpE,OAAO,EAAC,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAC,MAAM,iBAAiB,CAAA;AACjF,YAAY,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAA;AAEtD,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAA;AACxD,YAAY,EAAC,uBAAuB,EAAC,MAAM,uBAAuB,CAAA;AAClE,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,YAAY,EAAC,eAAe,EAAC,MAAM,cAAc,CAAA;AAEjD,cAAc,mBAAmB,CAAA"}

package/lib/experimental/index.js

@@ -1,69 +0,0 @@
-"use client";
-'use strict';
-
-var index = require('../Blankslate/index.js');
-var index$1 = require('../Banner/index.js');
-var index$2 = require('../DataTable/index.js');
-var Dialog = require('../Dialog/Dialog.js');
-var index$4 = require('../ActionBar/index.js');
-var index$3 = require('../Stack/index.js');
-var ButtonBase = require('../Button/ButtonBase.js');
-var DataTable = require('../DataTable/DataTable.js');
-var column = require('../DataTable/column.js');
-var InlineMessage = require('../InlineMessage/InlineMessage.js');
-var NavList = require('../NavList/NavList.js');
-var Tooltip = require('../TooltipV2/Tooltip.js');
-var ScrollableRegion = require('../ScrollableRegion/ScrollableRegion.js');
-var Announce = require('../live-region/Announce.js');
-var AriaStatus = require('../live-region/AriaStatus.js');
-var AriaAlert = require('../live-region/AriaAlert.js');
-var UnderlinePanels = require('./UnderlinePanels/UnderlinePanels.js');
-var SkeletonBox = require('../Skeleton/SkeletonBox.js');
-var SkeletonText = require('./Skeleton/SkeletonText.js');
-var SkeletonAvatar = require('./Skeleton/SkeletonAvatar.js');
-var FeatureFlags = require('../FeatureFlags/FeatureFlags.js');
-var DefaultFeatureFlags = require('../FeatureFlags/DefaultFeatureFlags.js');
-var useFeatureFlag = require('../FeatureFlags/useFeatureFlag.js');
-var FilteredActionListEntry = require('../FilteredActionList/FilteredActionListEntry.js');
-var IssueLabel = require('./IssueLabel/IssueLabel.js');
-var PageHeader = require('../PageHeader/PageHeader.js');
-var Hidden = require('../Hidden/Hidden.js');
-var useOverflow = require('../hooks/useOverflow.js');
-var useSlots = require('../hooks/useSlots.js');
-var SelectPanel = require('./SelectPanel2/SelectPanel.js');
-var KeybindingHint = require('../KeybindingHint/KeybindingHint.js');
-
-
-
-exports.Blankslate = index.Blankslate;
-exports.Banner = index$1.Banner;
-exports.Table = index$2.Table;
-exports.Dialog = Dialog.Dialog;
-exports.ActionBar = index$4.default;
-exports.Stack = index$3.Stack;
-exports.ButtonBase = ButtonBase.ButtonBase;
-exports.DataTable = DataTable.DataTable;
-exports.createColumnHelper = column.createColumnHelper;
-exports.InlineMessage = InlineMessage.InlineMessage;
-exports.NavList = NavList.NavList;
-exports.Tooltip = Tooltip.Tooltip;
-exports.ScrollableRegion = ScrollableRegion.ScrollableRegion;
-exports.Announce = Announce.Announce;
-exports.AriaStatus = AriaStatus.AriaStatus;
-exports.AriaAlert = AriaAlert.AriaAlert;
-exports.UnderlinePanels = UnderlinePanels;
-exports.SkeletonBox = SkeletonBox.SkeletonBox;
-exports.SkeletonText = SkeletonText.SkeletonText;
-exports.SkeletonAvatar = SkeletonAvatar.SkeletonAvatar;
-exports.FeatureFlags = FeatureFlags.FeatureFlags;
-exports.DefaultFeatureFlags = DefaultFeatureFlags.DefaultFeatureFlags;
-exports.useFeatureFlag = useFeatureFlag.useFeatureFlag;
-exports.FilteredActionList = FilteredActionListEntry.FilteredActionList;
-exports.IssueLabel = IssueLabel.IssueLabel;
-exports.PageHeader = PageHeader.PageHeader;
-exports.Hidden = Hidden.Hidden;
-exports.useOverflow = useOverflow.useOverflow;
-exports.useSlots = useSlots.useSlots;
-exports.SelectPanel = SelectPanel.SelectPanel;
-exports.KeybindingHint = KeybindingHint.KeybindingHint;
-exports.getAccessibleKeybindingHintString = KeybindingHint.getAccessibleKeybindingHintString;

package/lib/hooks/index.d.ts

@@ -1,19 +0,0 @@
-export { useOnOutsideClick } from './useOnOutsideClick';
-export type { UseOnOutsideClickSettings, TouchOrMouseEvent } from './useOnOutsideClick';
-export { useProvidedRefOrCreate } from './useProvidedRefOrCreate';
-export { useOnEscapePress } from './useOnEscapePress';
-export { useOpenAndCloseFocus } from './useOpenAndCloseFocus';
-export type { UseOpenAndCloseFocusSettings } from './useOpenAndCloseFocus';
-export type { AnchoredPositionHookSettings } from './useAnchoredPosition';
-export { useAnchoredPosition } from './useAnchoredPosition';
-export { useOverlay } from './useOverlay';
-export type { UseOverlaySettings } from './useOverlay';
-export { useRenderForcingRef } from './useRenderForcingRef';
-export { useProvidedStateOrCreate } from './useProvidedStateOrCreate';
-export { useMenuInitialFocus } from './useMenuInitialFocus';
-export { useMenuKeyboardNavigation } from './useMenuKeyboardNavigation';
-export { useMnemonics } from './useMnemonics';
-export { useRefObjectAsForwardedRef } from './useRefObjectAsForwardedRef';
-export { useId } from './useId';
-export { useIsMacOS } from './useIsMacOS';
-//# sourceMappingURL=index.d.ts.map

package/lib/hooks/useAnchoredPosition.d.ts

@@ -1,23 +0,0 @@
-import React from 'react';
-import type { AnchorPosition, PositionSettings } from '@primer/behaviors';
-export interface AnchoredPositionHookSettings extends Partial<PositionSettings> {
-    floatingElementRef?: React.RefObject<Element>;
-    anchorElementRef?: React.RefObject<Element>;
-    pinPosition?: boolean;
-    onPositionChange?: (position: AnchorPosition | undefined) => void;
-}
-/**
- * Calculates the top and left values for an absolutely-positioned floating element
- * to be anchored to some anchor element. Returns refs for the floating element
- * and the anchor element, along with the position.
- * @param settings Settings for calculating the anchored position.
- * @param dependencies Dependencies to determine when to re-calculate the position.
- * @returns An object of {top: number, left: number} to absolutely-position the
- * floating element.
- */
-export declare function useAnchoredPosition(settings?: AnchoredPositionHookSettings, dependencies?: React.DependencyList): {
-    floatingElementRef: React.RefObject<Element>;
-    anchorElementRef: React.RefObject<Element>;
-    position: AnchorPosition | undefined;
-};
-//# sourceMappingURL=useAnchoredPosition.d.ts.map

package/lib/hooks/useAnchoredPosition.js

@@ -1,93 +0,0 @@
-'use strict';
-
-var React = require('react');
-var behaviors = require('@primer/behaviors');
-var useProvidedRefOrCreate = require('./useProvidedRefOrCreate.js');
-var useResizeObserver = require('./useResizeObserver.js');
-var useIsomorphicLayoutEffect = require('../utils/useIsomorphicLayoutEffect.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-/**
- * Calculates the top and left values for an absolutely-positioned floating element
- * to be anchored to some anchor element. Returns refs for the floating element
- * and the anchor element, along with the position.
- * @param settings Settings for calculating the anchored position.
- * @param dependencies Dependencies to determine when to re-calculate the position.
- * @returns An object of {top: number, left: number} to absolutely-position the
- * floating element.
- */
-function useAnchoredPosition(settings, dependencies = []) {
-  const floatingElementRef = useProvidedRefOrCreate.useProvidedRefOrCreate(settings === null || settings === void 0 ? void 0 : settings.floatingElementRef);
-  const anchorElementRef = useProvidedRefOrCreate.useProvidedRefOrCreate(settings === null || settings === void 0 ? void 0 : settings.anchorElementRef);
-  const savedOnPositionChange = React__default.default.useRef(settings === null || settings === void 0 ? void 0 : settings.onPositionChange);
-  const [position, setPosition] = React__default.default.useState(undefined);
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  const [_, setPrevHeight] = React__default.default.useState(undefined);
-  const topPositionChanged = (prevPosition, newPosition) => {
-    return prevPosition && ['outside-top', 'inside-top'].includes(prevPosition.anchorSide) && (
-    // either the anchor changed or the element is trying to shrink in height
-    prevPosition.anchorSide !== newPosition.anchorSide || prevPosition.top < newPosition.top);
-  };
-  const updateElementHeight = () => {
-    let heightUpdated = false;
-    setPrevHeight(prevHeight => {
-      var _floatingElementRef$c, _floatingElementRef$c2;
-      // if the element is trying to shrink in height, restore to old height to prevent it from jumping
-      if (prevHeight && prevHeight > ((_floatingElementRef$c = (_floatingElementRef$c2 = floatingElementRef.current) === null || _floatingElementRef$c2 === void 0 ? void 0 : _floatingElementRef$c2.clientHeight) !== null && _floatingElementRef$c !== void 0 ? _floatingElementRef$c : 0)) {
-        requestAnimationFrame(() => {
-          floatingElementRef.current.style.height = `${prevHeight}px`;
-        });
-        heightUpdated = true;
-      }
-      return prevHeight;
-    });
-    return heightUpdated;
-  };
-  const updatePosition = React__default.default.useCallback(() => {
-    var _floatingElementRef$c5;
-    if (floatingElementRef.current instanceof Element && anchorElementRef.current instanceof Element) {
-      const newPosition = behaviors.getAnchoredPosition(floatingElementRef.current, anchorElementRef.current, settings);
-      setPosition(prev => {
-        if (settings !== null && settings !== void 0 && settings.pinPosition && topPositionChanged(prev, newPosition)) {
-          var _anchorElementRef$cur, _anchorElementRef$cur2, _floatingElementRef$c3, _floatingElementRef$c4;
-          const anchorTop = (_anchorElementRef$cur = (_anchorElementRef$cur2 = anchorElementRef.current) === null || _anchorElementRef$cur2 === void 0 ? void 0 : _anchorElementRef$cur2.getBoundingClientRect().top) !== null && _anchorElementRef$cur !== void 0 ? _anchorElementRef$cur : 0;
-          const elementStillFitsOnTop = anchorTop > ((_floatingElementRef$c3 = (_floatingElementRef$c4 = floatingElementRef.current) === null || _floatingElementRef$c4 === void 0 ? void 0 : _floatingElementRef$c4.clientHeight) !== null && _floatingElementRef$c3 !== void 0 ? _floatingElementRef$c3 : 0);
-          if (elementStillFitsOnTop && updateElementHeight()) {
-            return prev;
-          }
-        }
-        if (prev && prev.anchorSide === newPosition.anchorSide) {
-          var _savedOnPositionChang;
-          // if the position hasn't changed, don't update
-          (_savedOnPositionChang = savedOnPositionChange.current) === null || _savedOnPositionChang === void 0 ? void 0 : _savedOnPositionChang.call(savedOnPositionChange, newPosition);
-        }
-        return newPosition;
-      });
-    } else {
-      var _savedOnPositionChang2;
-      setPosition(undefined);
-      (_savedOnPositionChang2 = savedOnPositionChange.current) === null || _savedOnPositionChang2 === void 0 ? void 0 : _savedOnPositionChang2.call(savedOnPositionChange, undefined);
-    }
-    setPrevHeight((_floatingElementRef$c5 = floatingElementRef.current) === null || _floatingElementRef$c5 === void 0 ? void 0 : _floatingElementRef$c5.clientHeight);
-  },
-  // eslint-disable-next-line react-compiler/react-compiler
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [floatingElementRef, anchorElementRef, ...dependencies]);
-  useIsomorphicLayoutEffect(() => {
-    savedOnPositionChange.current = settings === null || settings === void 0 ? void 0 : settings.onPositionChange;
-  }, [settings === null || settings === void 0 ? void 0 : settings.onPositionChange]);
-  useIsomorphicLayoutEffect(updatePosition, [updatePosition]);
-  useResizeObserver.useResizeObserver(updatePosition); // watches for changes in window size
-  useResizeObserver.useResizeObserver(updatePosition, floatingElementRef); // watches for changes in floating element size
-
-  return {
-    floatingElementRef,
-    anchorElementRef,
-    position
-  };
-}
-
-exports.useAnchoredPosition = useAnchoredPosition;

package/lib/hooks/useControllableState.d.ts

@@ -1,35 +0,0 @@
-import React from 'react';
-type ControllableStateOptions<T> = {
-    /**
-     * A unique name for the state value.
-     */
-    name?: string;
-    /**
-     * The default value used for the state. This will be
-     * the fallback value used if `value` is not defined.
-     * */
-    defaultValue: T | (() => T);
-    /**
-     * A controlled value. Omitting this means that the state is uncontrolled.
-     */
-    value?: T;
-    /**
-     * An optional function that is called when the value of the state changes.
-     * This is useful for communicating to parents of controlled components
-     * that the value is requesting to be changed.
-     */
-    onChange?: (value: T) => void;
-};
-/**
- * This custom hook simplifies the behavior of a component if it has state that
- * can be both controlled and uncontrolled. It functions identical to a
- * useState() hook and provides [state, setState] for you to use. You can use
- * the `onChange` argument to allow updates to the `state` to be communicated to
- * owners of controlled components.
- *
- * Note: This hook will warn if a component is switching from controlled to
- * uncontrolled, or vice-versa.
- */
-export declare function useControllableState<T>({ name, defaultValue, value, onChange, }: ControllableStateOptions<T>): [T, React.Dispatch<React.SetStateAction<T>>];
-export {};
-//# sourceMappingURL=useControllableState.d.ts.map

package/lib/hooks/useControllableState.js

@@ -1,66 +0,0 @@
-'use strict';
-
-var React = require('react');
-var warning = require('../utils/warning.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-/**
- * This custom hook simplifies the behavior of a component if it has state that
- * can be both controlled and uncontrolled. It functions identical to a
- * useState() hook and provides [state, setState] for you to use. You can use
- * the `onChange` argument to allow updates to the `state` to be communicated to
- * owners of controlled components.
- *
- * Note: This hook will warn if a component is switching from controlled to
- * uncontrolled, or vice-versa.
- */
-function useControllableState({
-  name = 'custom',
-  defaultValue,
-  value,
-  onChange
-}) {
-  const [state, internalSetState] = React__default.default.useState(value !== null && value !== void 0 ? value : defaultValue);
-  const controlled = React__default.default.useRef(null);
-  const stableOnChange = React__default.default.useRef(onChange);
-  React__default.default.useEffect(() => {
-    stableOnChange.current = onChange;
-  });
-  if (controlled.current === null) {
-    controlled.current = value !== undefined;
-  }
-  const setState = React__default.default.useCallback(stateOrUpdater => {
-    var _stableOnChange$curre;
-    const value_0 = typeof stateOrUpdater === 'function' ?
-    // @ts-ignore stateOrUpdater is a function
-    stateOrUpdater(state) : stateOrUpdater;
-    if (controlled.current === false) {
-      internalSetState(value_0);
-    }
-    (_stableOnChange$curre = stableOnChange.current) === null || _stableOnChange$curre === void 0 ? void 0 : _stableOnChange$curre.call(stableOnChange, value_0);
-  }, [state]);
-  React__default.default.useEffect(() => {
-    const controlledValue = value !== undefined;
-
-    // Uncontrolled -> Controlled
-    // If the component prop is uncontrolled, the prop value should be undefined
-    if (controlled.current === false && controlledValue) {
-      process.env.NODE_ENV !== "production" ? warning.warning(true, 'A component is changing an uncontrolled %s component to be controlled. ' + 'This is likely caused by the value changing to a defined value ' + 'from undefined. Decide between using a controlled or uncontrolled ' + 'value for the lifetime of the component. ' + 'More info: https://reactjs.org/link/controlled-components', name) : void 0;
-    }
-
-    // Controlled -> Uncontrolled
-    // If the component prop is controlled, the prop value should be defined
-    if (controlled.current === true && !controlledValue) {
-      process.env.NODE_ENV !== "production" ? warning.warning(true, 'A component is changing a controlled %s component to be uncontrolled. ' + 'This is likely caused by the value changing to an undefined value ' + 'from a defined one. Decide between using a controlled or ' + 'uncontrolled value for the lifetime of the component. ' + 'More info: https://reactjs.org/link/controlled-components', name) : void 0;
-    }
-  }, [name, value]);
-  if (controlled.current === true) {
-    return [value, setState];
-  }
-  return [state, setState];
-}
-
-exports.useControllableState = useControllableState;

package/lib/hooks/useDetails.d.ts

@@ -1,17 +0,0 @@
-type UseDetailsParameters = {
-    ref?: React.RefObject<HTMLDetailsElement>;
-    closeOnOutsideClick?: boolean;
-    defaultOpen?: boolean;
-    onClickOutside?: (event: MouseEvent) => void;
-};
-declare function useDetails({ ref, closeOnOutsideClick, defaultOpen, onClickOutside }: UseDetailsParameters): {
-    open: boolean | undefined;
-    setOpen: import("react").Dispatch<import("react").SetStateAction<boolean | undefined>>;
-    getDetailsProps: () => {
-        onToggle: (e: React.SyntheticEvent<HTMLElement, Event>) => void;
-        open: boolean | undefined;
-        ref: import("react").RefObject<HTMLDetailsElement>;
-    };
-};
-export default useDetails;
-//# sourceMappingURL=useDetails.d.ts.map