@primer/react 38.30.1-rc.bce2a87c7 → 38.31.0-rc.2630f104b

package/dist/experimental/UnderlinePanels/UnderlinePanels.js

@@ -1,262 +1,185 @@
-import { c } from 'react-compiler-runtime';
-import React, { useState, useRef, useMemo, Children, isValidElement, cloneElement, createContext, useContext } from 'react';
-import { TabContainerElement } from '@github/tab-container-element';
-import { createComponent } from '../../utils/create-component.js';
-import { UnderlineWrapper, UnderlineItemList, UnderlineItem } from '../../internal/components/UnderlineTabbedInterface.js';
-import { invariant } from '../../utils/invariant.js';
-import { useResizeObserver } from '../../hooks/useResizeObserver.js';
-import useIsomorphicLayoutEffect from '../../utils/useIsomorphicLayoutEffect.js';
-import classes from './UnderlinePanels.module.css.js';
-import { clsx } from 'clsx';
-import { isSlot } from '../../utils/is-slot.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useId } from '../../hooks/useId.js';
-
-const TabContainerComponent = createComponent(TabContainerElement, 'tab-container');
-
-// Carries flags that affect every Tab's rendering but that don't belong on the
-// consumer-facing Tab API. Passing them via context (instead of cloneElement)
-// keeps each Tab element's props referentially stable across UnderlinePanels
-// re-renders, so React.memo(Tab) can skip work when an unrelated piece of
-// state changes.
-
-const UnderlinePanelsContext = /*#__PURE__*/createContext({
-  iconsVisible: true,
-  loadingCounters: undefined
+import useIsomorphicLayoutEffect from "../../utils/useIsomorphicLayoutEffect.js";
+import { useResizeObserver } from "../../hooks/useResizeObserver.js";
+import { useId as useId$1 } from "../../hooks/useId.js";
+import { invariant } from "../../utils/invariant.js";
+import { isSlot } from "../../utils/is-slot.js";
+import { createComponent } from "../../utils/create-component.js";
+import { UnderlineItem, UnderlineItemList, UnderlineWrapper } from "../../internal/components/UnderlineTabbedInterface.js";
+import UnderlinePanels_module_css_default from "./UnderlinePanels.module.css.js";
+import { c } from "react-compiler-runtime";
+import { clsx } from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, { Children, cloneElement, createContext, isValidElement, useContext, useMemo, useRef, useState } from "react";
+import { TabContainerElement } from "@github/tab-container-element";
+//#region src/experimental/UnderlinePanels/UnderlinePanels.tsx
+const TabContainerComponent = createComponent(TabContainerElement, "tab-container");
+const UnderlinePanelsContext = /*#__PURE__*/ createContext({
+	iconsVisible: true,
+	loadingCounters: void 0
 });
-const UnderlinePanels = ({
-  'aria-label': ariaLabel,
-  'aria-labelledby': ariaLabelledBy,
-  children,
-  loadingCounters,
-  className,
-  ...props
-}) => {
-  const [iconsVisible, setIconsVisible] = useState(true);
-  const wrapperRef = useRef(null);
-  const listRef = 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(props.id);
-  const [tabs_0, tabPanels_0, tabsHaveIcons_0] = useMemo(() => {
-    // Walk children, clone each Tab with a generated id, and each Panel with a
-    // matching aria-labelledby. Derive in render so we never ship a
-    // "before-the-effect-ran" empty-tablist frame and so that re-renders of
-    // UnderlinePanels don't churn through an extra commit cycle.
-    //
-    // iconsVisible / loadingCounters are NOT baked into the cloned Tab
-    // elements — they flow through UnderlinePanelsContext, so this memo's deps
-    // can stay tight ([children, parentId]) and Tab elements stay
-    // referentially stable across resize-driven iconsVisible toggles.
-    let tabIndex = 0;
-    let panelIndex = 0;
-    const childrenWithProps = Children.map(children, child => {
-      if (/*#__PURE__*/isValidElement(child) && (child.type === Tab || isSlot(child, Tab))) {
-        return /*#__PURE__*/cloneElement(child, {
-          id: `${parentId}-tab-${tabIndex++}`
-        });
-      }
-      if (/*#__PURE__*/isValidElement(child) && (child.type === Panel || isSlot(child, Panel))) {
-        const childPanel = child;
-        return /*#__PURE__*/cloneElement(childPanel, {
-          'aria-labelledby': `${parentId}-tab-${panelIndex++}`
-        });
-      }
-      return child;
-    });
-    const tabs = [];
-    const tabPanels = [];
-    for (const child_0 of Children.toArray(childrenWithProps)) {
-      if (! /*#__PURE__*/isValidElement(child_0)) continue;
-      if (child_0.type === Tab || isSlot(child_0, Tab)) tabs.push(child_0);else if (child_0.type === Panel || isSlot(child_0, Panel)) tabPanels.push(child_0);
-    }
-    const tabsHaveIcons = tabs.some(tab => /*#__PURE__*/React.isValidElement(tab) && tab.props.icon);
-    return [tabs, tabPanels, tabsHaveIcons];
-  }, [children, parentId]);
-  const contextValue = useMemo(() => ({
-    iconsVisible,
-    loadingCounters
-  }), [iconsVisible, loadingCounters]);
-
-  // Mirror iconsVisible into a ref so the list observer below can read it
-  // without being re-created on every toggle (re-creating the observer
-  // would re-trigger its initial callback and churn extra work).
-  const iconsVisibleRef = useRef(iconsVisible);
-  useIsomorphicLayoutEffect(() => {
-    iconsVisibleRef.current = iconsVisible;
-  }, [iconsVisible]);
-
-  // The list's natural width (icons + labels), kept in sync via a
-  // ResizeObserver on the list — never read in render, so updates don't
-  // cause commits. Only refreshed while icons are visible: when icons are
-  // hidden the list is at its compressed width, which is not the value we
-  // want to compare against. The ResizeObserver fires synchronously on
-  // observe, which seeds the ref on mount for free.
-  const listWidthRef = useRef(0);
-  useResizeObserver(entries => {
-    if (!tabsHaveIcons_0) return;
-    if (!iconsVisibleRef.current) return;
-    listWidthRef.current = entries[0].contentRect.width;
-  }, listRef, []);
-
-  // when the wrapper resizes, check if the icons should be visible
-  // by comparing the wrapper width to the list width
-  useResizeObserver(resizeObserverEntries => {
-    if (!tabsHaveIcons_0) {
-      return;
-    }
-    const wrapperWidth = resizeObserverEntries[0].contentRect.width;
-    setIconsVisible(wrapperWidth > listWidthRef.current);
-  }, wrapperRef, []);
-  if (process.env.NODE_ENV !== "production") {
-    const selectedTabs = tabs_0.filter(tab_0 => {
-      const ariaSelected = /*#__PURE__*/React.isValidElement(tab_0) && tab_0.props['aria-selected'];
-      return ariaSelected === true || ariaSelected === 'true';
-    });
-    !(selectedTabs.length <= 1) ? process.env.NODE_ENV !== "production" ? invariant(false, 'Only one tab can be selected at a time.') : invariant(false) : void 0;
-    !(tabs_0.length === tabPanels_0.length) ? process.env.NODE_ENV !== "production" ? invariant(false, `The number of tabs and panels must be equal. Counted ${tabs_0.length} tabs and ${tabPanels_0.length} panels.`) : invariant(false) : void 0;
-  }
-  return /*#__PURE__*/jsx(UnderlinePanelsContext.Provider, {
-    value: contextValue,
-    children: /*#__PURE__*/jsxs(TabContainerComponent, {
-      children: [/*#__PURE__*/jsx(UnderlineWrapper, {
-        ref: wrapperRef,
-        slot: "tablist-wrapper",
-        "data-icons-visible": iconsVisible,
-        className: clsx(className, classes.StyledUnderlineWrapper),
-        ...props,
-        children: /*#__PURE__*/jsx(UnderlineItemList, {
-          ref: listRef,
-          "aria-label": ariaLabel,
-          "aria-labelledby": ariaLabelledBy,
-          role: "tablist",
-          children: tabs_0
-        })
-      }), tabPanels_0]
-    })
-  });
+const UnderlinePanels = ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children, loadingCounters, className, ...props }) => {
+	const [iconsVisible, setIconsVisible] = useState(true);
+	const wrapperRef = useRef(null);
+	const listRef = useRef(null);
+	const parentId = useId$1(props.id);
+	const [tabs_0, tabPanels_0, tabsHaveIcons_0] = useMemo(() => {
+		let tabIndex = 0;
+		let panelIndex = 0;
+		const childrenWithProps = Children.map(children, (child) => {
+			if (/*#__PURE__*/ isValidElement(child) && (child.type === Tab || isSlot(child, Tab))) return /*#__PURE__*/ cloneElement(child, { id: `${parentId}-tab-${tabIndex++}` });
+			if (/*#__PURE__*/ isValidElement(child) && (child.type === Panel || isSlot(child, Panel))) return /*#__PURE__*/ cloneElement(child, { "aria-labelledby": `${parentId}-tab-${panelIndex++}` });
+			return child;
+		});
+		const tabs = [];
+		const tabPanels = [];
+		for (const child_0 of Children.toArray(childrenWithProps)) {
+			if (!/*#__PURE__*/ isValidElement(child_0)) continue;
+			if (child_0.type === Tab || isSlot(child_0, Tab)) tabs.push(child_0);
+			else if (child_0.type === Panel || isSlot(child_0, Panel)) tabPanels.push(child_0);
+		}
+		return [
+			tabs,
+			tabPanels,
+			tabs.some((tab) => /*#__PURE__*/ React.isValidElement(tab) && tab.props.icon)
+		];
+	}, [children, parentId]);
+	const contextValue = useMemo(() => ({
+		iconsVisible,
+		loadingCounters
+	}), [iconsVisible, loadingCounters]);
+	const iconsVisibleRef = useRef(iconsVisible);
+	useIsomorphicLayoutEffect(() => {
+		iconsVisibleRef.current = iconsVisible;
+	}, [iconsVisible]);
+	const listWidthRef = useRef(0);
+	useResizeObserver((entries) => {
+		if (!tabsHaveIcons_0) return;
+		if (!iconsVisibleRef.current) return;
+		listWidthRef.current = entries[0].contentRect.width;
+	}, listRef, []);
+	useResizeObserver((resizeObserverEntries) => {
+		if (!tabsHaveIcons_0) return;
+		const wrapperWidth = resizeObserverEntries[0].contentRect.width;
+		setIconsVisible(wrapperWidth > listWidthRef.current);
+	}, wrapperRef, []);
+	!(tabs_0.filter((tab_0) => {
+		const ariaSelected = /*#__PURE__*/ React.isValidElement(tab_0) && tab_0.props["aria-selected"];
+		return ariaSelected === true || ariaSelected === "true";
+	}).length <= 1) && invariant(false, "Only one tab can be selected at a time.");
+	!(tabs_0.length === tabPanels_0.length) && invariant(false, `The number of tabs and panels must be equal. Counted ${tabs_0.length} tabs and ${tabPanels_0.length} panels.`);
+	return /*#__PURE__*/ jsx(UnderlinePanelsContext.Provider, {
+		value: contextValue,
+		children: /*#__PURE__*/ jsxs(TabContainerComponent, { children: [/*#__PURE__*/ jsx(UnderlineWrapper, {
+			ref: wrapperRef,
+			slot: "tablist-wrapper",
+			"data-icons-visible": iconsVisible,
+			className: clsx(className, UnderlinePanels_module_css_default.StyledUnderlineWrapper),
+			...props,
+			children: /*#__PURE__*/ jsx(UnderlineItemList, {
+				ref: listRef,
+				"aria-label": ariaLabel,
+				"aria-labelledby": ariaLabelledBy,
+				role: "tablist",
+				children: tabs_0
+			})
+		}), tabPanels_0] })
+	});
 };
 UnderlinePanels.displayName = "UnderlinePanels";
-const TabImpl = t0 => {
-  const $ = c(15);
-  let ariaSelected;
-  let onSelect;
-  let props;
-  if ($[0] !== t0) {
-    ({
-      "aria-selected": ariaSelected,
-      onSelect,
-      ...props
-    } = t0);
-    $[0] = t0;
-    $[1] = ariaSelected;
-    $[2] = onSelect;
-    $[3] = props;
-  } else {
-    ariaSelected = $[1];
-    onSelect = $[2];
-    props = $[3];
-  }
-  const {
-    loadingCounters
-  } = useContext(UnderlinePanelsContext);
-  let t1;
-  if ($[4] !== onSelect) {
-    t1 = event => {
-      if (!event.defaultPrevented && typeof onSelect === "function") {
-        onSelect(event);
-      }
-    };
-    $[4] = onSelect;
-    $[5] = t1;
-  } else {
-    t1 = $[5];
-  }
-  const clickHandler = t1;
-  let t2;
-  if ($[6] !== onSelect) {
-    t2 = event_0 => {
-      if ((event_0.key === " " || event_0.key === "Enter") && !event_0.defaultPrevented && typeof onSelect === "function") {
-        onSelect(event_0);
-      }
-    };
-    $[6] = onSelect;
-    $[7] = t2;
-  } else {
-    t2 = $[7];
-  }
-  const keyDownHandler = t2;
-  const t3 = ariaSelected ? 0 : -1;
-  let t4;
-  if ($[8] !== ariaSelected || $[9] !== clickHandler || $[10] !== keyDownHandler || $[11] !== loadingCounters || $[12] !== props || $[13] !== t3) {
-    t4 = /*#__PURE__*/jsx(UnderlineItem, {
-      as: "button",
-      role: "tab",
-      tabIndex: t3,
-      "aria-selected": ariaSelected,
-      type: "button",
-      onClick: clickHandler,
-      onKeyDown: keyDownHandler,
-      loadingCounters: loadingCounters,
-      ...props
-    });
-    $[8] = ariaSelected;
-    $[9] = clickHandler;
-    $[10] = keyDownHandler;
-    $[11] = loadingCounters;
-    $[12] = props;
-    $[13] = t3;
-    $[14] = t4;
-  } else {
-    t4 = $[14];
-  }
-  return t4;
+const TabImpl = (t0) => {
+	const $ = c(15);
+	let ariaSelected;
+	let onSelect;
+	let props;
+	if ($[0] !== t0) {
+		({"aria-selected": ariaSelected, onSelect, ...props} = t0);
+		$[0] = t0;
+		$[1] = ariaSelected;
+		$[2] = onSelect;
+		$[3] = props;
+	} else {
+		ariaSelected = $[1];
+		onSelect = $[2];
+		props = $[3];
+	}
+	const { loadingCounters } = useContext(UnderlinePanelsContext);
+	let t1;
+	if ($[4] !== onSelect) {
+		t1 = (event) => {
+			if (!event.defaultPrevented && typeof onSelect === "function") onSelect(event);
+		};
+		$[4] = onSelect;
+		$[5] = t1;
+	} else t1 = $[5];
+	const clickHandler = t1;
+	let t2;
+	if ($[6] !== onSelect) {
+		t2 = (event_0) => {
+			if ((event_0.key === " " || event_0.key === "Enter") && !event_0.defaultPrevented && typeof onSelect === "function") onSelect(event_0);
+		};
+		$[6] = onSelect;
+		$[7] = t2;
+	} else t2 = $[7];
+	const keyDownHandler = t2;
+	const t3 = ariaSelected ? 0 : -1;
+	let t4;
+	if ($[8] !== ariaSelected || $[9] !== clickHandler || $[10] !== keyDownHandler || $[11] !== loadingCounters || $[12] !== props || $[13] !== t3) {
+		t4 = /*#__PURE__*/ jsx(UnderlineItem, {
+			as: "button",
+			role: "tab",
+			tabIndex: t3,
+			"aria-selected": ariaSelected,
+			type: "button",
+			onClick: clickHandler,
+			onKeyDown: keyDownHandler,
+			loadingCounters,
+			...props
+		});
+		$[8] = ariaSelected;
+		$[9] = clickHandler;
+		$[10] = keyDownHandler;
+		$[11] = loadingCounters;
+		$[12] = props;
+		$[13] = t3;
+		$[14] = t4;
+	} else t4 = $[14];
+	return t4;
 };
-
-// Memoized so that UnderlinePanels re-rendering (e.g. when iconsVisible flips)
-// only re-renders Tabs whose own props actually changed. iconsVisible and
-// loadingCounters reach Tab via UnderlinePanelsContext, so Tabs still react
-// to those changes through context propagation.
-TabImpl.displayName = 'UnderlinePanels.Tab';
-const Tab = /*#__PURE__*/React.memo(TabImpl);
-Tab.displayName = 'UnderlinePanels.Tab';
-const Panel = t0 => {
-  const $ = c(6);
-  let children;
-  let rest;
-  if ($[0] !== t0) {
-    ({
-      children,
-      ...rest
-    } = t0);
-    $[0] = t0;
-    $[1] = children;
-    $[2] = rest;
-  } else {
-    children = $[1];
-    rest = $[2];
-  }
-  let t1;
-  if ($[3] !== children || $[4] !== rest) {
-    t1 = /*#__PURE__*/jsx("div", {
-      role: "tabpanel",
-      ...rest,
-      children: children
-    });
-    $[3] = children;
-    $[4] = rest;
-    $[5] = t1;
-  } else {
-    t1 = $[5];
-  }
-  return t1;
+TabImpl.displayName = "UnderlinePanels.Tab";
+const Tab = /*#__PURE__*/ React.memo(TabImpl);
+Tab.displayName = "UnderlinePanels.Tab";
+const Panel = (t0) => {
+	const $ = c(6);
+	let children;
+	let rest;
+	if ($[0] !== t0) {
+		({children, ...rest} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = rest;
+	} else {
+		children = $[1];
+		rest = $[2];
+	}
+	let t1;
+	if ($[3] !== children || $[4] !== rest) {
+		t1 = /*#__PURE__*/ jsx("div", {
+			role: "tabpanel",
+			...rest,
+			children
+		});
+		$[3] = children;
+		$[4] = rest;
+		$[5] = t1;
+	} else t1 = $[5];
+	return t1;
 };
-Panel.displayName = 'UnderlinePanels.Panel';
+Panel.displayName = "UnderlinePanels.Panel";
 var UnderlinePanels_default = Object.assign(UnderlinePanels, {
-  Panel,
-  Tab
+	Panel,
+	Tab
 });
-Tab.__SLOT__ = Symbol('UnderlinePanels.Tab');
-Panel.__SLOT__ = Symbol('UnderlinePanels.Panel');
-
+Tab.__SLOT__ = Symbol("UnderlinePanels.Tab");
+Panel.__SLOT__ = Symbol("UnderlinePanels.Panel");
+//#endregion
 export { UnderlinePanels_default as default };

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

@@ -1,5 +1,5 @@
-import './UnderlinePanels-162f9aed.css';
-
-var classes = {"StyledUnderlineWrapper":"prc-UnderlinePanels-StyledUnderlineWrapper-aiLna"};
-
-export { classes as default };
+import "./UnderlinePanels-162f9aed.css";
+//#region src/experimental/UnderlinePanels/UnderlinePanels.module.css.js
+var UnderlinePanels_module_css_default = { "StyledUnderlineWrapper": "prc-UnderlinePanels-StyledUnderlineWrapper-aiLna" };
+//#endregion
+export { UnderlinePanels_module_css_default as default };

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

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

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

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

package/dist/experimental/index.d.ts

@@ -1,53 +1,53 @@
-/**
- * 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 { Card } from '../Card';
-export type { CardProps, CardIconProps, CardImageProps, CardHeadingProps, CardDescriptionProps, CardActionProps, CardMetadataProps, } from '../Card';
-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';
-export { InlineMessage } from '../InlineMessage';
-export type { InlineMessageProps } from '../InlineMessage';
-export { PageHeader } from '../PageHeader';
-export type { PageHeaderProps, TitleProps, TitleProps as PageHeaderTitleProps, ActionsProps as PageHeaderActionsProps, } 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 } from '../Skeleton';
-export type { SkeletonBoxProps } from '../Skeleton';
-export { SkeletonText } from '../SkeletonText';
-export type { SkeletonTextProps } from '../SkeletonText';
-export { SkeletonAvatar } from '../SkeletonAvatar';
-export type { SkeletonAvatarProps } from '../SkeletonAvatar';
-export { FeatureFlags, DefaultFeatureFlags, useFeatureFlag } from '../FeatureFlags';
-export type { FeatureFlagsProps } from '../FeatureFlags';
-export { FilteredActionList, FilteredActionListLoadingTypes } from '../FilteredActionList';
-export type { FilteredActionListProps, FilteredActionListInputProps } from '../FilteredActionList';
-export { IssueLabel } from './IssueLabel';
-export type { IssueLabelProps } from './IssueLabel';
-export * from '../KeybindingHint';
-export * from './Tabs';
-export { TopicTag } from '../TopicTag';
-export type { TopicTagProps, TopicTagGroupProps } from '../TopicTag';
-//# sourceMappingURL=index.d.ts.map
+import { KeybindingHintProps } from "../KeybindingHint/props.js";
+import { KeybindingHint } from "../KeybindingHint/KeybindingHint.js";
+import { getAccessibleKeybindingHintString } from "../KeybindingHint/utils.js";
+import { Tooltip, TooltipProps } from "../TooltipV2/Tooltip.js";
+import { ButtonBaseProps } from "../Button/types.js";
+import { ButtonBase } from "../Button/ButtonBase.js";
+import { Dialog, DialogButtonProps, DialogHeaderProps, DialogHeight, DialogProps, DialogWidth } from "../Dialog/Dialog.js";
+import { SlotConfig, useSlots } from "../hooks/useSlots.js";
+import { NavList, NavListDividerProps, NavListGroupProps, NavListItemProps, NavListLeadingVisualProps, NavListProps, NavListSubNavProps, NavListTrailingVisualProps } from "../NavList/NavList.js";
+import { FilteredActionListLoadingTypes } from "../FilteredActionList/constants.js";
+import { FilteredActionListProps } from "../FilteredActionList/FilteredActionList.js";
+import { FilteredActionListInputProps } from "../FilteredActionList/FilteredActionListInput.js";
+import { FilteredActionList } from "../FilteredActionList/index.js";
+import { ObjectPaths } from "../DataTable/utils.js";
+import { UniqueRow } from "../DataTable/row.js";
+import { CellAlignment, Column, ColumnWidth, createColumnHelper } from "../DataTable/column.js";
+import { ActionBarButtonProps, ActionBarMenuItemProps, ActionBarMenuProps, ActionBarProps } from "../ActionBar/ActionBar.js";
+import { ActionBar } from "../ActionBar/index.js";
+import { StackItemProps, StackProps } from "../Stack/Stack.js";
+import { Stack } from "../Stack/index.js";
+import { ActionsProps, PageHeader, PageHeaderProps, TitleProps } from "../PageHeader/PageHeader.js";
+import { SkeletonBox, SkeletonBoxProps } from "../Skeleton/SkeletonBox.js";
+import { BlankslateProps } from "../Blankslate/Blankslate.js";
+import { Blankslate as BlankslateContainer } from "../Blankslate/index.js";
+import { CardActionProps as ActionProps, CardDescriptionProps as DescriptionProps, CardHeadingProps as HeadingProps, CardIconProps as IconProps, CardImageProps as ImageProps, CardMetadataProps as MetadataProps, CardProps } from "../Card/Card.js";
+import { Card } from "../Card/index.js";
+import { DataTable, DataTableProps } from "../DataTable/DataTable.js";
+import { TableActionsProps, TableBodyProps, TableCellProps, TableContainerProps, TableHeadProps, TableHeaderProps, TableProps, TableRowProps, TableSubtitleProps, TableTitleProps } from "../DataTable/Table.js";
+import { Table } from "../DataTable/index.js";
+import { InlineMessage, InlineMessageProps } from "../InlineMessage/InlineMessage.js";
+import { Hidden, HiddenProps } from "../Hidden/Hidden.js";
+import { useOverflow } from "../hooks/useOverflow.js";
+import { SelectPanel, SelectPanelMessageProps, SelectPanelProps, SelectPanelSecondaryActionProps } from "./SelectPanel2/SelectPanel.js";
+import { ScrollableRegion, ScrollableRegionProps } from "../ScrollableRegion/ScrollableRegion.js";
+import { Announce, AnnounceProps } from "../live-region/Announce.js";
+import { AriaAlert, AriaAlertProps } from "../live-region/AriaAlert.js";
+import { AriaStatus, AriaStatusProps } from "../live-region/AriaStatus.js";
+import _default, { PanelProps, TabProps as TabProps$1, UnderlinePanelsProps } from "./UnderlinePanels/UnderlinePanels.js";
+import { SkeletonText, SkeletonTextProps } from "../SkeletonText/SkeletonText.js";
+import { SkeletonAvatar, SkeletonAvatarProps } from "../SkeletonAvatar/SkeletonAvatar.js";
+import { FeatureFlags, FeatureFlagsProps } from "../FeatureFlags/FeatureFlags.js";
+import { useFeatureFlag } from "../FeatureFlags/useFeatureFlag.js";
+import { DefaultFeatureFlags } from "../FeatureFlags/DefaultFeatureFlags.js";
+import { IssueLabel, IssueLabelProps } from "./IssueLabel/IssueLabel.js";
+import { TabListProps, TabPanelProps, TabProps, TabsProps } from "./Tabs/types.js";
+import { Tabs } from "./Tabs/Tabs.js";
+import { useTab } from "./Tabs/useTab.js";
+import { useTabList } from "./Tabs/useTabList.js";
+import { useTabPanel } from "./Tabs/useTabPanel.js";
+import { TopicTagProps } from "../TopicTag/TopicTag.js";
+import { TopicTagGroupProps } from "../TopicTag/TopicTagGroup.js";
+import { TopicTag } from "../TopicTag/index.js";
+export { ActionBar, type ActionBarButtonProps, type ActionBarMenuItemProps, type ActionBarMenuProps, type ActionBarProps, Announce, type AnnounceProps, AriaAlert, type AriaAlertProps, AriaStatus, type AriaStatusProps, BlankslateContainer as Blankslate, type BlankslateProps, ButtonBase, type ButtonBaseProps, Card, type ActionProps as CardActionProps, type DescriptionProps as CardDescriptionProps, type HeadingProps as CardHeadingProps, type IconProps as CardIconProps, type ImageProps as CardImageProps, type MetadataProps as CardMetadataProps, type CardProps, type CellAlignment, type Column, type ColumnWidth, DataTable, type DataTableProps, DefaultFeatureFlags, Dialog, type DialogButtonProps, type DialogHeaderProps, type DialogHeight, type DialogProps, type DialogWidth, FeatureFlags, type FeatureFlagsProps, FilteredActionList, type FilteredActionListInputProps, FilteredActionListLoadingTypes, type FilteredActionListProps, Hidden, type HiddenProps, InlineMessage, type InlineMessageProps, IssueLabel, type IssueLabelProps, KeybindingHint, type KeybindingHintProps, NavList, type NavListDividerProps, type NavListGroupProps, type NavListItemProps, type NavListLeadingVisualProps, type NavListProps, type NavListSubNavProps, type NavListTrailingVisualProps, type ObjectPaths, PageHeader, type ActionsProps as PageHeaderActionsProps, type PageHeaderProps, type TitleProps as PageHeaderTitleProps, ScrollableRegion, type ScrollableRegionProps, SelectPanel, type SelectPanelMessageProps, type SelectPanelProps, type SelectPanelSecondaryActionProps, SkeletonAvatar, type SkeletonAvatarProps, SkeletonBox, type SkeletonBoxProps, SkeletonText, type SkeletonTextProps, SlotConfig, Stack, type StackItemProps, type StackProps, type TabListProps, type TabPanelProps, type TabProps, Table, type TableActionsProps, type TableBodyProps, type TableCellProps, type TableContainerProps, type TableHeadProps, type TableHeaderProps, type TableProps, type TableRowProps, type TableSubtitleProps, type TableTitleProps, Tabs, type TabsProps, type TitleProps, Tooltip, type TooltipProps, TopicTag, type TopicTagGroupProps, type TopicTagProps, _default as UnderlinePanels, type PanelProps as UnderlinePanelsPanelProps, type UnderlinePanelsProps, type TabProps$1 as UnderlinePanelsTabProps, type UniqueRow, createColumnHelper, getAccessibleKeybindingHintString, useFeatureFlag, useOverflow, useSlots, useTab, useTabList, useTabPanel };