@patternfly/patternfly-doc-core 1.9.1 → 1.11.0

package/dist/server/chunks/PropsTables_PVzRHJNB.mjs

@@ -1,1750 +0,0 @@
-import { c as createComponent, a as createAstro, r as renderComponent, b as renderTemplate } from './astro/server_Cl9jPh4p.mjs';
-import 'kleur/colors';
-import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
-import { c as css, b as createIcon, B as Button, r as getUniqueId, K as KeyTypes, v as BellIcon, I as InfoCircleIcon, d as ExclamationCircleIcon, E as ExclamationTriangleIcon, C as CheckCircleIcon, u as useOUIAProps } from './Button_BKhHR-ak.mjs';
-/* empty css                          */
-import { C as Content, S as Stack, a as StackItem, A as AutoLinkHeader } from './AutoLinkHeader_C2GD0g-K.mjs';
-import { __rest } from 'tslib';
-import { useRef, useEffect, forwardRef, useImperativeHandle, createContext, useState, createRef, Fragment, createElement, cloneElement, useContext } from 'react';
-import { T as TimesIcon, P as Popper, u as useIsomorphicLayoutEffect, e as Tooltip, b as Dropdown, M as MenuToggle, c as DropdownList, D as Divider, d as DropdownItem, a as AngleDownIcon, f as checkStyles, S as StarIcon, g as Checkbox, s as setTabIndex, h as handleArrows } from './angle-down-icon_BO1Ed-9Z.mjs';
-import mergeWith from 'lodash/mergeWith.js';
-/* empty css                          */
-import { createFocusTrap } from 'focus-trap';
-
-/**
- * A `useEffect`-like hook that only triggers when a component unmounts. Does not require a dependency list, as the effect callback will always be kept up to date.
- */
-function useUnmountEffect(effect) {
-    // Always use the latest effect callback so that it can reference the latest props and state.
-    const effectRef = useRef(effect);
-    effectRef.current = effect;
-    // Trigger the effect callback when the component unmounts.
-    useEffect(() => () => {
-        effectRef.current();
-    }, []);
-}
-
-const FocusTrap = forwardRef(function FocusTrap(_a, forwardedRef) {
-    var { active = true, paused = false, focusTrapOptions = {}, preventScrollOnDeactivate = false } = _a, props = __rest(_a, ["active", "paused", "focusTrapOptions", "preventScrollOnDeactivate"]);
-    // Fall back to internal ref if no forwarded ref is provided.
-    const ref = useRef(null);
-    useImperativeHandle(forwardedRef, () => ref.current);
-    // Create focus trap instance after rendering DOM.
-    const focusTrapRef = useRef(null);
-    useEffect(() => {
-        const focusTrap = createFocusTrap(ref.current, Object.assign(Object.assign({}, focusTrapOptions), { returnFocusOnDeactivate: false }));
-        focusTrapRef.current = focusTrap;
-        // Deactivate focus trap on cleanup.
-        return () => {
-            focusTrap.deactivate();
-        };
-    }, []);
-    // Handle activation status based on 'active' prop.
-    useEffect(() => {
-        const focusTrap = focusTrapRef.current;
-        active ? focusTrap === null || focusTrap === void 0 ? void 0 : focusTrap.activate() : focusTrap === null || focusTrap === void 0 ? void 0 : focusTrap.deactivate();
-    }, [active]);
-    // Handle pause status based on 'pause' prop.
-    useEffect(() => {
-        const focusTrap = focusTrapRef.current;
-        paused ? focusTrap === null || focusTrap === void 0 ? void 0 : focusTrap.pause() : focusTrap === null || focusTrap === void 0 ? void 0 : focusTrap.unpause();
-    }, [paused]);
-    // Store the currently active element to restore focus to later.
-    const previousElementRef = useRef(typeof document !== 'undefined' ? document.activeElement : null);
-    // Restore focus to the previously active element on unmount.
-    useUnmountEffect(() => {
-        if (focusTrapOptions.returnFocusOnDeactivate !== false && previousElementRef.current instanceof HTMLElement) {
-            previousElementRef.current.focus({
-                preventScroll: preventScrollOnDeactivate
-            });
-        }
-    });
-    return jsx("div", Object.assign({ ref: ref }, props));
-});
-FocusTrap.displayName = 'FocusTrap';
-
-const styles$4 = {
-  "actionList": "pf-v6-c-action-list",
-  "modifiers": {
-    "icons": "pf-m-icons"
-  }
-};
-
-const ActionList = (_a) => {
-    var { children, isIconList, className } = _a, props = __rest(_a, ["children", "isIconList", "className"]);
-    return (jsx("div", Object.assign({ className: css(styles$4.actionList, isIconList && styles$4.modifiers.icons, className) }, props, { children: children })));
-};
-ActionList.displayName = 'ActionList';
-
-const ActionListItem = (_a) => {
-    var { children, className } = _a, props = __rest(_a, ["children", "className"]);
-    return (jsx("div", Object.assign({ className: css(`${styles$4.actionList}__item`, className) }, props, { children: children })));
-};
-ActionListItem.displayName = 'ActionListItem';
-
-const GripVerticalIconConfig = {
-  name: 'GripVerticalIcon',
-  height: 512,
-  width: 320,
-  svgPath: 'M96 32H32C14.33 32 0 46.33 0 64v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32V64c0-17.67-14.33-32-32-32zm0 160H32c-17.67 0-32 14.33-32 32v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32v-64c0-17.67-14.33-32-32-32zm0 160H32c-17.67 0-32 14.33-32 32v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32v-64c0-17.67-14.33-32-32-32zM288 32h-64c-17.67 0-32 14.33-32 32v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32V64c0-17.67-14.33-32-32-32zm0 160h-64c-17.67 0-32 14.33-32 32v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32v-64c0-17.67-14.33-32-32-32zm0 160h-64c-17.67 0-32 14.33-32 32v64c0 17.67 14.33 32 32 32h64c17.67 0 32-14.33 32-32v-64c0-17.67-14.33-32-32-32z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const GripVerticalIcon = createIcon(GripVerticalIconConfig);
-
-const styles$3 = {
-  "modifiers": {
-    "noPadding": "pf-m-no-padding",
-    "widthAuto": "pf-m-width-auto",
-    "top": "pf-m-top",
-    "topLeft": "pf-m-top-left",
-    "topRight": "pf-m-top-right",
-    "bottom": "pf-m-bottom",
-    "bottomLeft": "pf-m-bottom-left",
-    "bottomRight": "pf-m-bottom-right",
-    "left": "pf-m-left",
-    "leftTop": "pf-m-left-top",
-    "leftBottom": "pf-m-left-bottom",
-    "right": "pf-m-right",
-    "rightTop": "pf-m-right-top",
-    "rightBottom": "pf-m-right-bottom",
-    "danger": "pf-m-danger",
-    "warning": "pf-m-warning",
-    "success": "pf-m-success",
-    "custom": "pf-m-custom",
-    "info": "pf-m-info"
-  },
-  "popover": "pf-v6-c-popover",
-  "popoverArrow": "pf-v6-c-popover__arrow",
-  "popoverBody": "pf-v6-c-popover__body",
-  "popoverClose": "pf-v6-c-popover__close",
-  "popoverContent": "pf-v6-c-popover__content",
-  "popoverFooter": "pf-v6-c-popover__footer",
-  "popoverHeader": "pf-v6-c-popover__header",
-  "popoverTitle": "pf-v6-c-popover__title",
-  "popoverTitleIcon": "pf-v6-c-popover__title-icon",
-  "popoverTitleText": "pf-v6-c-popover__title-text"
-};
-
-const PopoverContext = createContext({});
-
-const PopoverContent = (_a) => {
-    var { className = null, children } = _a, props = __rest(_a, ["className", "children"]);
-    return (jsx("div", Object.assign({ className: css(styles$3.popoverContent, className) }, props, { children: children })));
-};
-PopoverContent.displayName = 'PopoverContent';
-
-const PopoverBody = (_a) => {
-    var { children, id, className } = _a, props = __rest(_a, ["children", "id", "className"]);
-    return (jsx("div", Object.assign({ className: css(styles$3.popoverBody, className), id: id }, props, { children: children })));
-};
-PopoverBody.displayName = 'PopoverBody';
-
-const PopoverHeaderIcon = (_a) => {
-    var { children, className } = _a, props = __rest(_a, ["children", "className"]);
-    return (jsx("span", Object.assign({ className: css(styles$3.popoverTitleIcon, className) }, props, { children: children })));
-};
-PopoverHeaderIcon.displayName = 'PopoverHeaderIcon';
-
-const PopoverHeaderText = (_a) => {
-    var { children, className, headingLevel } = _a, props = __rest(_a, ["children", "className", "headingLevel"]);
-    const HeadingLevel = headingLevel;
-    return (jsx(HeadingLevel, Object.assign({ className: css(styles$3.popoverTitleText, className) }, props, { children: children })));
-};
-PopoverHeaderText.displayName = 'PopoverHeaderText';
-
-const PopoverHeader = (_a) => {
-    var { children, icon, className, titleHeadingLevel = 'h6', alertSeverityVariant, id, alertSeverityScreenReaderText } = _a, props = __rest(_a, ["children", "icon", "className", "titleHeadingLevel", "alertSeverityVariant", "id", "alertSeverityScreenReaderText"]);
-    return (jsx("header", Object.assign({ className: css(styles$3.popoverHeader, className) }, props, { children: jsxs("div", { className: css(styles$3.popoverTitle), id: id, children: [icon && jsx(PopoverHeaderIcon, { children: icon }), jsxs(PopoverHeaderText, { headingLevel: titleHeadingLevel, children: [alertSeverityVariant && alertSeverityScreenReaderText && (jsx("span", { className: "pf-v6-screen-reader", children: alertSeverityScreenReaderText })), children] })] }) })));
-};
-PopoverHeader.displayName = 'PopoverHeader';
-
-const PopoverFooter = (_a) => {
-    var { children, className = '' } = _a, props = __rest(_a, ["children", "className"]);
-    return (jsx("footer", Object.assign({ className: css(styles$3.popoverFooter, className) }, props, { children: children })));
-};
-PopoverFooter.displayName = 'PopoverFooter';
-
-const PopoverCloseButton = (_a) => {
-    var { onClose = () => undefined } = _a, props = __rest(_a, ["onClose"]);
-    return (jsx("div", { className: css(styles$3.popoverClose), children: jsx(Button, Object.assign({ onClick: onClose, variant: "plain", "aria-label": true }, props, { style: { pointerEvents: 'auto' }, icon: jsx(TimesIcon, {}) })) }));
-};
-PopoverCloseButton.displayName = 'PopoverCloseButton';
-
-const PopoverArrow = (_a) => {
-    var { className = '' } = _a, props = __rest(_a, ["className"]);
-    return jsx("div", Object.assign({ className: css(styles$3.popoverArrow, className) }, props));
-};
-PopoverArrow.displayName = 'PopoverArrow';
-
-const c_popover_MaxWidth = {
-  "name": "--pf-v6-c-popover--MaxWidth",
-  "value": "none",
-  "var": "var(--pf-v6-c-popover--MaxWidth)"
-};
-
-const c_popover_MinWidth = {
-  "name": "--pf-v6-c-popover--MinWidth",
-  "value": "auto",
-  "var": "var(--pf-v6-c-popover--MinWidth)"
-};
-
-var PopoverPosition;
-(function (PopoverPosition) {
-    PopoverPosition["auto"] = "auto";
-    PopoverPosition["top"] = "top";
-    PopoverPosition["bottom"] = "bottom";
-    PopoverPosition["left"] = "left";
-    PopoverPosition["right"] = "right";
-    PopoverPosition["topStart"] = "top-start";
-    PopoverPosition["topEnd"] = "top-end";
-    PopoverPosition["bottomStart"] = "bottom-start";
-    PopoverPosition["bottomEnd"] = "bottom-end";
-    PopoverPosition["leftStart"] = "left-start";
-    PopoverPosition["leftEnd"] = "left-end";
-    PopoverPosition["rightStart"] = "right-start";
-    PopoverPosition["rightEnd"] = "right-end";
-})(PopoverPosition || (PopoverPosition = {}));
-const alertStyle = {
-    custom: styles$3.modifiers.custom,
-    info: styles$3.modifiers.info,
-    success: styles$3.modifiers.success,
-    warning: styles$3.modifiers.warning,
-    danger: styles$3.modifiers.danger
-};
-const Popover = (_a) => {
-    var { children, position = 'top', enableFlip = true, className = '', isVisible = null, shouldClose = () => null, shouldOpen = () => null, 'aria-label': ariaLabel = '', bodyContent, headerContent = null, headerComponent = 'h6', headerIcon = null, alertSeverityVariant, alertSeverityScreenReaderText, footerContent = null, appendTo = () => document.body, hideOnOutsideClick = true, onHide = () => null, onHidden = () => null, onShow = () => null, onShown = () => null, onMount = () => null, zIndex = 9999, triggerAction = 'click', minWidth = c_popover_MinWidth && c_popover_MinWidth.value, maxWidth = c_popover_MaxWidth && c_popover_MaxWidth.value, closeBtnAriaLabel = 'Close', showClose = true, distance = 25, flipBehavior = [
-        'top',
-        'bottom',
-        'left',
-        'right',
-        'top-start',
-        'top-end',
-        'bottom-start',
-        'bottom-end',
-        'left-start',
-        'left-end',
-        'right-start',
-        'right-end'
-    ], animationDuration = 300, id, withFocusTrap: propWithFocusTrap, triggerRef, hasNoPadding = false, hasAutoWidth = false, elementToFocus } = _a, rest = __rest(_a, ["children", "position", "enableFlip", "className", "isVisible", "shouldClose", "shouldOpen", 'aria-label', "bodyContent", "headerContent", "headerComponent", "headerIcon", "alertSeverityVariant", "alertSeverityScreenReaderText", "footerContent", "appendTo", "hideOnOutsideClick", "onHide", "onHidden", "onShow", "onShown", "onMount", "zIndex", "triggerAction", "minWidth", "maxWidth", "closeBtnAriaLabel", "showClose", "distance", "flipBehavior", "animationDuration", "id", "withFocusTrap", "triggerRef", "hasNoPadding", "hasAutoWidth", "elementToFocus"]);
-    // could make this a prop in the future (true | false | 'toggle')
-    // const hideOnClick = true;
-    const uniqueId = id || getUniqueId();
-    const triggerManually = isVisible !== null;
-    const [visible, setVisible] = useState(false);
-    const [focusTrapActive, setFocusTrapActive] = useState(Boolean(propWithFocusTrap));
-    const popoverRef = useRef(null);
-    useEffect(() => {
-        onMount();
-    }, []);
-    useEffect(() => {
-        if (triggerManually) {
-            if (isVisible) {
-                show(undefined, true);
-            }
-            else {
-                hide();
-            }
-        }
-    }, [isVisible, triggerManually]);
-    const show = (event, withFocusTrap) => {
-        event && onShow(event);
-        setVisible(true);
-        propWithFocusTrap !== false && withFocusTrap && setFocusTrapActive(true);
-    };
-    const hide = (event) => {
-        event && onHide(event);
-        setVisible(false);
-    };
-    const positionModifiers = {
-        top: styles$3.modifiers.top,
-        bottom: styles$3.modifiers.bottom,
-        left: styles$3.modifiers.left,
-        right: styles$3.modifiers.right,
-        'top-start': styles$3.modifiers.topLeft,
-        'top-end': styles$3.modifiers.topRight,
-        'bottom-start': styles$3.modifiers.bottomLeft,
-        'bottom-end': styles$3.modifiers.bottomRight,
-        'left-start': styles$3.modifiers.leftTop,
-        'left-end': styles$3.modifiers.leftBottom,
-        'right-start': styles$3.modifiers.rightTop,
-        'right-end': styles$3.modifiers.rightBottom
-    };
-    const hasCustomMinWidth = minWidth !== c_popover_MinWidth.value;
-    const hasCustomMaxWidth = maxWidth !== c_popover_MaxWidth.value;
-    const onDocumentKeyDown = (event) => {
-        if (event.key === KeyTypes.Escape && visible) {
-            if (triggerManually) {
-                shouldClose(event, hide);
-            }
-            else {
-                hide(event);
-            }
-        }
-    };
-    const onDocumentClick = (event, triggerElement, popperElement) => {
-        if (hideOnOutsideClick && visible) {
-            const isFromChild = popperElement && popperElement.contains(event.target);
-            const isFromTrigger = triggerElement && triggerElement.contains(event.target);
-            if (isFromChild || isFromTrigger) {
-                // if clicked within the popper or on the trigger, ignore this event
-                return;
-            }
-            if (triggerManually) {
-                shouldClose(event, hide);
-            }
-            else {
-                hide(event);
-            }
-        }
-    };
-    const onTriggerClick = (event) => {
-        if (triggerManually) {
-            if (visible) {
-                shouldClose(event, hide);
-            }
-            else {
-                shouldOpen(event, show);
-            }
-        }
-        else {
-            if (visible) {
-                hide(event);
-            }
-            else {
-                show(event, true);
-            }
-        }
-    };
-    const onContentMouseDown = () => {
-        if (focusTrapActive) {
-            setFocusTrapActive(false);
-        }
-    };
-    const onMouseEnter = (event) => {
-        if (triggerManually) {
-            shouldOpen(event, show);
-        }
-        else {
-            show(event, false);
-        }
-    };
-    const onMouseLeave = (event) => {
-        if (triggerManually) {
-            shouldClose(event, hide);
-        }
-        else {
-            hide(event);
-        }
-    };
-    const onFocus = (event) => {
-        if (triggerManually) {
-            shouldOpen(event, show);
-        }
-        else {
-            show(event, false);
-        }
-    };
-    const onBlur = (event) => {
-        if (triggerManually) {
-            shouldClose(event, hide);
-        }
-        else {
-            hide(event);
-        }
-    };
-    const closePopover = (event) => {
-        event.stopPropagation();
-        if (triggerManually) {
-            shouldClose(event, hide);
-        }
-        else {
-            hide(event);
-        }
-    };
-    const content = (jsxs(FocusTrap, Object.assign({ ref: popoverRef, active: focusTrapActive, focusTrapOptions: {
-            returnFocusOnDeactivate: propWithFocusTrap !== false,
-            clickOutsideDeactivates: true,
-            // FocusTrap's initialFocus can accept false as a value to prevent initial focus.
-            // We want to prevent this in case false is ever passed in.
-            initialFocus: elementToFocus || undefined,
-            checkCanFocusTrap: (containers) => new Promise((resolve) => {
-                const interval = setInterval(() => {
-                    if (containers.every((container) => getComputedStyle(container).visibility !== 'hidden')) {
-                        resolve();
-                        clearInterval(interval);
-                    }
-                }, 10);
-            }),
-            tabbableOptions: { displayCheck: 'none' },
-            fallbackFocus: () => {
-                // If the popover's trigger is focused but scrolled out of view,
-                // FocusTrap will throw an error when the Enter button is used on the trigger.
-                // That is because the Popover is hidden when its trigger is out of view.
-                // Provide a fallback in that case.
-                let node = null;
-                if (document && document.activeElement) {
-                    node = document.activeElement;
-                }
-                return node;
-            }
-        }, preventScrollOnDeactivate: true, className: css(styles$3.popover, alertSeverityVariant && alertStyle[alertSeverityVariant], hasNoPadding && styles$3.modifiers.noPadding, hasAutoWidth && styles$3.modifiers.widthAuto, className), role: "dialog", "aria-modal": "true", "aria-label": headerContent ? undefined : ariaLabel, "aria-labelledby": headerContent ? `popover-${uniqueId}-header` : undefined, "aria-describedby": `popover-${uniqueId}-body`, onMouseDown: onContentMouseDown, style: {
-            minWidth: hasCustomMinWidth ? minWidth : null,
-            maxWidth: hasCustomMaxWidth ? maxWidth : null
-        } }, rest, { children: [jsx(PopoverArrow, {}), jsxs(PopoverContent, { children: [showClose && triggerAction === 'click' && (jsx(PopoverCloseButton, { onClose: closePopover, "aria-label": closeBtnAriaLabel })), headerContent && (jsx(PopoverHeader, { id: `popover-${uniqueId}-header`, icon: headerIcon, alertSeverityVariant: alertSeverityVariant, alertSeverityScreenReaderText: alertSeverityScreenReaderText || `${alertSeverityVariant} alert:`, titleHeadingLevel: headerComponent, children: typeof headerContent === 'function' ? headerContent(hide) : headerContent })), jsx(PopoverBody, { id: `popover-${uniqueId}-body`, children: typeof bodyContent === 'function' ? bodyContent(hide) : bodyContent }), footerContent && (jsx(PopoverFooter, { id: `popover-${uniqueId}-footer`, children: typeof footerContent === 'function' ? footerContent(hide) : footerContent }))] })] })));
-    return (jsx(PopoverContext.Provider, { value: { headerComponent }, children: jsx(Popper, { trigger: children, triggerRef: triggerRef, popper: content, popperRef: popoverRef, minWidth: minWidth, appendTo: appendTo, isVisible: visible, onMouseEnter: triggerAction === 'hover' && onMouseEnter, onMouseLeave: triggerAction === 'hover' && onMouseLeave, onPopperMouseEnter: triggerAction === 'hover' && onMouseEnter, onPopperMouseLeave: triggerAction === 'hover' && onMouseLeave, onFocus: triggerAction === 'hover' && onFocus, onBlur: triggerAction === 'hover' && onBlur, positionModifiers: positionModifiers, distance: distance, placement: position, onTriggerClick: triggerAction === 'click' && onTriggerClick, onDocumentClick: onDocumentClick, onDocumentKeyDown: onDocumentKeyDown, enableFlip: enableFlip, zIndex: zIndex, flipBehavior: flipBehavior, animationDuration: animationDuration, onHidden: onHidden, onShown: onShown, onHide: () => setFocusTrapActive(false) }) }));
-};
-Popover.displayName = 'Popover';
-
-const labelStyles = {
-  "label": "pf-v6-c-label",
-  "labelActions": "pf-v6-c-label__actions",
-  "labelContent": "pf-v6-c-label__content",
-  "labelIcon": "pf-v6-c-label__icon",
-  "labelText": "pf-v6-c-label__text",
-  "modifiers": {
-    "blue": "pf-m-blue",
-    "red": "pf-m-red",
-    "orange": "pf-m-orange",
-    "orangered": "pf-m-orangered",
-    "yellow": "pf-m-yellow",
-    "green": "pf-m-green",
-    "teal": "pf-m-teal",
-    "purple": "pf-m-purple",
-    "success": "pf-m-success",
-    "warning": "pf-m-warning",
-    "danger": "pf-m-danger",
-    "info": "pf-m-info",
-    "custom": "pf-m-custom",
-    "compact": "pf-m-compact",
-    "filled": "pf-m-filled",
-    "outline": "pf-m-outline",
-    "editable": "pf-m-editable",
-    "editableActive": "pf-m-editable-active",
-    "overflow": "pf-m-overflow",
-    "add": "pf-m-add",
-    "clickable": "pf-m-clickable",
-    "disabled": "pf-m-disabled"
-  }
-};
-
-const styles$2 = {
-  "modifiers": {
-    "editable": "pf-m-editable"}
-};
-
-const c_label__text_MaxWidth = {
-  "name": "--pf-v6-c-label__text--MaxWidth"};
-
-const colorStyles = {
-    blue: labelStyles.modifiers.blue,
-    teal: labelStyles.modifiers.teal,
-    green: labelStyles.modifiers.green,
-    orange: labelStyles.modifiers.orange,
-    purple: labelStyles.modifiers.purple,
-    red: labelStyles.modifiers.red,
-    orangered: labelStyles.modifiers.orangered,
-    yellow: labelStyles.modifiers.yellow,
-    grey: ''
-};
-const statusIcons = {
-    success: jsx(CheckCircleIcon, {}),
-    warning: jsx(ExclamationTriangleIcon, {}),
-    danger: jsx(ExclamationCircleIcon, {}),
-    info: jsx(InfoCircleIcon, {}),
-    custom: jsx(BellIcon, {})
-};
-const Label = (_a) => {
-    var { children, className = '', color = 'grey', variant = 'filled', status, isCompact = false, isDisabled = false, isEditable = false, isClickable: isClickableProp = false, editableProps, textMaxWidth, tooltipPosition, icon, onClose, onClick: onLabelClick, onEditCancel, onEditComplete, closeBtn, closeBtnAriaLabel, closeBtnProps, href, render } = _a, props = __rest(_a, ["children", "className", "color", "variant", "status", "isCompact", "isDisabled", "isEditable", "isClickable", "editableProps", "textMaxWidth", "tooltipPosition", "icon", "onClose", "onClick", "onEditCancel", "onEditComplete", "closeBtn", "closeBtnAriaLabel", "closeBtnProps", "href", "render"]);
-    const [isEditableActive, setIsEditableActive] = useState(false);
-    const [currValue, setCurrValue] = useState(children);
-    const editableButtonRef = useRef(undefined);
-    const editableInputRef = useRef(undefined);
-    const isOverflowLabel = variant === 'overflow';
-    const isAddLabel = variant === 'add';
-    const isClickable = isClickableProp || (onLabelClick && !isOverflowLabel && !isAddLabel) || href;
-    let _icon;
-    if (status) {
-        _icon = statusIcons[status];
-    }
-    if (icon) {
-        _icon = icon;
-    }
-    useEffect(() => {
-        document.addEventListener('mousedown', onDocMouseDown);
-        document.addEventListener('keydown', onKeyDown);
-        return () => {
-            document.removeEventListener('mousedown', onDocMouseDown);
-            document.removeEventListener('keydown', onKeyDown);
-        };
-    });
-    useEffect(() => {
-        if (onLabelClick && href) {
-            // eslint-disable-next-line no-console
-            console.warn('Link labels cannot have onClick passed, this results in invalid HTML. Please remove either the href or onClick prop.');
-        }
-        else if (onLabelClick && isEditable) {
-            // eslint-disable-next-line no-console
-            console.warn('Editable labels cannot have onClick passed, clicking starts the label edit process. Please remove either the isEditable or onClick prop.');
-        }
-    }, [onLabelClick, href, isEditable]);
-    const onDocMouseDown = (event) => {
-        if (isEditableActive &&
-            editableInputRef &&
-            editableInputRef.current &&
-            !editableInputRef.current.contains(event.target)) {
-            if (editableInputRef.current.value) {
-                onEditComplete && onEditComplete(event, editableInputRef.current.value);
-            }
-            setIsEditableActive(false);
-        }
-    };
-    const onKeyDown = (event) => {
-        var _a, _b;
-        const key = event.key;
-        if ((!isEditableActive &&
-            (!editableButtonRef ||
-                !editableButtonRef.current ||
-                !editableButtonRef.current.contains(event.target))) ||
-            (isEditableActive &&
-                (!editableInputRef || !editableInputRef.current || !editableInputRef.current.contains(event.target)))) {
-            return;
-        }
-        if (isEditableActive && (key === 'Enter' || key === 'Tab')) {
-            event.preventDefault();
-            event.stopImmediatePropagation();
-            if (editableInputRef.current.value) {
-                onEditComplete && onEditComplete(event, editableInputRef.current.value);
-            }
-            setIsEditableActive(false);
-            (_a = editableButtonRef === null || editableButtonRef === void 0 ? void 0 : editableButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-        if (isEditableActive && key === 'Escape') {
-            event.preventDefault();
-            event.stopImmediatePropagation();
-            // Reset div text to initial children prop - pre-edit
-            if (editableInputRef.current.value) {
-                editableInputRef.current.value = children;
-                onEditCancel && onEditCancel(event, children);
-            }
-            setIsEditableActive(false);
-            (_b = editableButtonRef === null || editableButtonRef === void 0 ? void 0 : editableButtonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-        }
-        if (!isEditableActive && key === 'Enter') {
-            event.preventDefault();
-            event.stopImmediatePropagation();
-            setIsEditableActive(true);
-            // Set cursor position to end of text
-            const el = event.target;
-            const range = document.createRange();
-            const sel = window.getSelection();
-            range.selectNodeContents(el);
-            range.collapse(false);
-            sel.removeAllRanges();
-            sel.addRange(range);
-        }
-    };
-    const isClickableDisabled = (href || onLabelClick) && isDisabled;
-    const defaultCloseButton = (jsx(Button, Object.assign({ type: "button", variant: "plain", hasNoPadding: true, onClick: onClose, "aria-label": closeBtnAriaLabel || `Close ${children}` }, (isClickableDisabled && { isDisabled: true }), closeBtnProps, { icon: jsx(TimesIcon, {}) })));
-    const closeButton = jsx("span", { className: css(labelStyles.labelActions), children: closeBtn || defaultCloseButton });
-    const textRef = createRef();
-    // ref to apply tooltip when rendered is used
-    const componentRef = useRef(undefined);
-    const [isTooltipVisible, setIsTooltipVisible] = useState(false);
-    useIsomorphicLayoutEffect(() => {
-        const currTextRef = isEditable ? editableButtonRef : textRef;
-        if (!isEditableActive) {
-            setIsTooltipVisible(currTextRef.current && currTextRef.current.offsetWidth < currTextRef.current.scrollWidth);
-        }
-    }, [isEditableActive]);
-    const content = (jsxs(Fragment, { children: [_icon && jsx("span", { className: css(labelStyles.labelIcon), children: _icon }), jsx("span", Object.assign({ ref: textRef, className: css(labelStyles.labelText) }, (textMaxWidth && {
-                style: {
-                    [c_label__text_MaxWidth.name]: textMaxWidth
-                }
-            }), { children: children }))] }));
-    useEffect(() => {
-        if (isEditableActive && editableInputRef) {
-            editableInputRef.current && editableInputRef.current.focus();
-        }
-    }, [editableInputRef, isEditableActive]);
-    const updateVal = () => {
-        setCurrValue(editableInputRef.current.value);
-    };
-    let LabelComponentChildElement = 'span';
-    if (href) {
-        LabelComponentChildElement = 'a';
-    }
-    else if (isEditable || (onLabelClick && !isOverflowLabel && !isAddLabel)) {
-        LabelComponentChildElement = 'button';
-    }
-    const clickableLabelProps = {
-        type: 'button',
-        onClick: onLabelClick
-    };
-    const isButton = LabelComponentChildElement === 'button';
-    const labelComponentChildProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ className: css(labelStyles.labelContent, isClickable && labelStyles.modifiers.clickable) }, (isTooltipVisible && { tabIndex: 0 })), (href && { href })), (href && isDisabled && { onClick: (event) => event.preventDefault() })), (isButton && clickableLabelProps)), (isEditable && Object.assign({ ref: editableButtonRef, onClick: (e) => {
-            setIsEditableActive(true);
-            e.stopPropagation();
-        } }, editableProps))), (isClickableDisabled && isButton && { disabled: true })), (isClickableDisabled && href && { tabIndex: -1, 'aria-disabled': true }));
-    let labelComponentChild = (jsx(LabelComponentChildElement, Object.assign({}, labelComponentChildProps, { children: content })));
-    if (render) {
-        labelComponentChild = (jsxs(Fragment, { children: [isTooltipVisible && jsx(Tooltip, { triggerRef: componentRef, content: children, position: tooltipPosition }), render({
-                    className: labelStyles.labelContent,
-                    content,
-                    componentRef
-                })] }));
-    }
-    else if (isTooltipVisible) {
-        labelComponentChild = (jsx(Tooltip, { content: children, position: tooltipPosition, children: labelComponentChild }));
-    }
-    const LabelComponent = (isOverflowLabel ? 'button' : 'span');
-    return (jsxs(LabelComponent, Object.assign({}, props, { className: css(labelStyles.label, isClickableDisabled && labelStyles.modifiers.disabled, colorStyles[color], variant === 'filled' && labelStyles.modifiers.filled, variant === 'outline' && labelStyles.modifiers.outline, status && labelStyles.modifiers[status], isOverflowLabel && labelStyles.modifiers.overflow, isCompact && labelStyles.modifiers.compact, isEditable && styles$2.modifiers.editable, isEditableActive && labelStyles.modifiers.editableActive, isClickable && labelStyles.modifiers.clickable, isAddLabel && labelStyles.modifiers.add, className), onClick: isOverflowLabel || isAddLabel ? onLabelClick : undefined }, (LabelComponent === 'button' && { type: 'button' }), { children: [!isEditableActive && labelComponentChild, !isEditableActive && onClose && closeButton, isEditableActive && (jsx("input", Object.assign({ className: css(labelStyles.labelContent), type: "text", id: "editable-input", ref: editableInputRef, value: currValue, onChange: updateVal }, editableProps)))] })));
-};
-Label.displayName = 'Label';
-
-const EllipsisVIconConfig = {
-  name: 'EllipsisVIcon',
-  height: 512,
-  width: 192,
-  svgPath: 'M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const EllipsisVIcon = createIcon(EllipsisVIconConfig);
-
-const ActionsColumnBase = (_a) => {
-    var { items, isDisabled, rowData, extraData, actionsToggle, popperProps = {
-        position: 'end',
-        direction: 'down'
-    }, innerRef, firstActionItemRef, isOnOpenChangeDisabled = false } = _a, props = __rest(_a, ["items", "isDisabled", "rowData", "extraData", "actionsToggle", "popperProps", "innerRef", "firstActionItemRef", "isOnOpenChangeDisabled"]);
-    const [isOpen, setIsOpen] = useState(false);
-    const onToggle = () => {
-        setIsOpen(!isOpen);
-    };
-    const onActionClick = (event, onClick) => {
-        // Only prevent default if onClick is provided.  This allows href support.
-        if (onClick) {
-            event.preventDefault();
-            // tslint:disable-next-line:no-unused-expression
-            onClick(event, extraData && extraData.rowIndex, rowData, extraData);
-        }
-    };
-    return (jsxs(Fragment, { children: [items
-                .filter((item) => item.isOutsideDropdown)
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                .map((_a, key) => {
-                var { title, itemKey, onClick, isOutsideDropdown } = _a, props = __rest(_a, ["title", "itemKey", "onClick", "isOutsideDropdown"]);
-                return typeof title === 'string' ? (createElement(Button, Object.assign({ onClick: (event) => onActionClick(event, onClick) }, props, { isDisabled: isDisabled, key: itemKey || `outside_dropdown_${key}`, "data-key": itemKey || `outside_dropdown_${key}` }), title)) : (cloneElement(title, Object.assign({ onClick, isDisabled }, props)));
-            }), jsx(Dropdown, Object.assign({ isOpen: isOpen, onOpenChange: !isOnOpenChangeDisabled ? (isOpen) => setIsOpen(isOpen) : undefined, toggle: (toggleRef) => actionsToggle ? (actionsToggle({ onToggle, isOpen, isDisabled, toggleRef })) : (jsx(MenuToggle, { "aria-label": "Kebab toggle", ref: toggleRef, onClick: onToggle, isExpanded: isOpen, isDisabled: isDisabled, variant: "plain", icon: jsx(EllipsisVIcon, {}) })) }, (rowData && rowData.actionProps), { ref: innerRef }, props, { popperProps: popperProps, children: jsx(DropdownList, { children: items
-                        .filter((item) => !item.isOutsideDropdown)
-                        .map((_a, index) => {
-                        var { title, itemKey, onClick, tooltipProps, isSeparator, shouldCloseOnClick = true } = _a, props = __rest(_a, ["title", "itemKey", "onClick", "tooltipProps", "isSeparator", "shouldCloseOnClick"]);
-                        if (isSeparator) {
-                            return jsx(Divider, { "data-key": itemKey || index }, itemKey || index);
-                        }
-                        const item = (createElement(DropdownItem, Object.assign({ onClick: (event) => {
-                                onActionClick(event, onClick);
-                                shouldCloseOnClick && onToggle();
-                            } }, props, { key: itemKey || index, "data-key": itemKey || index, ref: index === 0 ? firstActionItemRef : undefined }), title));
-                        if (tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content) {
-                            return (jsx(Tooltip, Object.assign({}, tooltipProps, { children: item }), itemKey || index));
-                        }
-                        else {
-                            return item;
-                        }
-                    }) }) }))] }));
-};
-const ActionsColumn = forwardRef((props, ref) => (jsx(ActionsColumnBase, Object.assign({}, props, { innerRef: ref }))));
-ActionsColumn.displayName = 'ActionsColumn';
-
-const styles$1 = {
-  "modifiers": {
-    "fixed": "pf-m-fixed",
-    "stickyHeader": "pf-m-sticky-header",
-    "nestedColumnHeader": "pf-m-nested-column-header",
-    "striped": "pf-m-striped",
-    "expandable": "pf-m-expandable",
-    "stripedEven": "pf-m-striped-even",
-    "ghostRow": "pf-m-ghost-row",
-    "hidden": "pf-m-hidden",
-    "hiddenOnSm": "pf-m-hidden-on-sm",
-    "visibleOnSm": "pf-m-visible-on-sm",
-    "hiddenOnMd": "pf-m-hidden-on-md",
-    "visibleOnMd": "pf-m-visible-on-md",
-    "hiddenOnLg": "pf-m-hidden-on-lg",
-    "visibleOnLg": "pf-m-visible-on-lg",
-    "hiddenOnXl": "pf-m-hidden-on-xl",
-    "visibleOnXl": "pf-m-visible-on-xl",
-    "hiddenOn_2xl": "pf-m-hidden-on-2xl",
-    "visibleOn_2xl": "pf-m-visible-on-2xl",
-    "center": "pf-m-center",
-    "help": "pf-m-help",
-    "favorite": "pf-m-favorite",
-    "borderRight": "pf-m-border-right",
-    "borderLeft": "pf-m-border-left",
-    "noBorderRows": "pf-m-no-border-rows",
-    "expanded": "pf-m-expanded",
-    "clickable": "pf-m-clickable",
-    "selected": "pf-m-selected",
-    "firstCellOffsetReset": "pf-m-first-cell-offset-reset",
-    "dragOver": "pf-m-drag-over",
-    "truncate": "pf-m-truncate",
-    "wrap": "pf-m-wrap",
-    "nowrap": "pf-m-nowrap",
-    "fitContent": "pf-m-fit-content",
-    "breakWord": "pf-m-break-word",
-    "standalone": "pf-m-standalone",
-    "favorited": "pf-m-favorited",
-    "noPadding": "pf-m-no-padding",
-    "compact": "pf-m-compact",
-    "borderRow": "pf-m-border-row",
-    "width_10": "pf-m-width-10",
-    "width_15": "pf-m-width-15",
-    "width_20": "pf-m-width-20",
-    "width_25": "pf-m-width-25",
-    "width_30": "pf-m-width-30",
-    "width_35": "pf-m-width-35",
-    "width_40": "pf-m-width-40",
-    "width_45": "pf-m-width-45",
-    "width_50": "pf-m-width-50",
-    "width_60": "pf-m-width-60",
-    "width_70": "pf-m-width-70",
-    "width_80": "pf-m-width-80",
-    "width_90": "pf-m-width-90",
-    "width_100": "pf-m-width-100"
-  },
-  "table": "pf-v6-c-table",
-  "tableAction": "pf-v6-c-table__action",
-  "tableButton": "pf-v6-c-table__button",
-  "tableButtonContent": "pf-v6-c-table__button-content",
-  "tableCheck": "pf-v6-c-table__check",
-  "tableColumnHelp": "pf-v6-c-table__column-help",
-  "tableColumnHelpAction": "pf-v6-c-table__column-help-action",
-  "tableCompoundExpansionToggle": "pf-v6-c-table__compound-expansion-toggle",
-  "tableControlRow": "pf-v6-c-table__control-row",
-  "tableDraggable": "pf-v6-c-table__draggable",
-  "tableExpandableRow": "pf-v6-c-table__expandable-row",
-  "tableFavorite": "pf-v6-c-table__favorite",
-  "tableSort": "pf-v6-c-table__sort",
-  "tableSortIndicator": "pf-v6-c-table__sort-indicator",
-  "tableSubhead": "pf-v6-c-table__subhead",
-  "tableTbody": "pf-v6-c-table__tbody",
-  "tableTd": "pf-v6-c-table__td",
-  "tableText": "pf-v6-c-table__text",
-  "tableTh": "pf-v6-c-table__th",
-  "tableThead": "pf-v6-c-table__thead",
-  "tableToggle": "pf-v6-c-table__toggle",
-  "tableToggleIcon": "pf-v6-c-table__toggle-icon",
-  "tableTr": "pf-v6-c-table__tr"
-};
-
-const CollapseColumn = (_a) => {
-    var { className = '', children = null, isOpen, onToggle } = _a, props = __rest(_a, ["className", "children", "isOpen", "onToggle"]);
-    return (jsxs(Fragment, { children: [isOpen !== undefined && (jsx(Button, Object.assign({ className: css(className, isOpen && styles$1.modifiers.expanded) }, props, { variant: "plain", "aria-label": props['aria-label'] || 'Details', onClick: onToggle, "aria-expanded": isOpen, icon: jsx("div", { className: css(styles$1.tableToggleIcon), children: jsx(AngleDownIcon, {}) }) }))), children] }));
-};
-CollapseColumn.displayName = 'CollapseColumn';
-
-const DraggableCell = (_a) => {
-    var { className, onClick, 'aria-label': ariaLabel, id } = _a, props = __rest(_a, ["className", "onClick", 'aria-label', "id"]);
-    return (jsx(Button, Object.assign({ id: id, variant: "plain", className: className, type: "button", "aria-label": ariaLabel || `Draggable row draggable button`, onClick: onClick }, props, { icon: jsx(GripVerticalIcon, {}) })));
-};
-DraggableCell.displayName = 'DraggableCell';
-
-const inlineStyles = {
-  "modifiers": {
-    "inlineEditable": "pf-m-inline-editable"}
-};
-
-const HelpIconConfig = {
-  name: 'HelpIcon',
-  height: 1024,
-  width: 1024,
-  svgPath: 'M521.3,576 C627.5,576 713.7,502 713.7,413.7 C713.7,325.4 627.6,253.6 521.3,253.6 C366,253.6 334.5,337.7 329.2,407.2 C329.2,414.3 335.2,416 343.5,416 L445,416 C450.5,416 458,415.5 460.8,406.5 C460.8,362.6 582.9,357.1 582.9,413.6 C582.9,441.9 556.2,470.9 521.3,473 C486.4,475.1 447.3,479.8 447.3,521.7 L447.3,553.8 C447.3,570.8 456.1,576 472,576 C487.9,576 521.3,576 521.3,576 M575.3,751.3 L575.3,655.3 C575.313862,651.055109 573.620137,646.982962 570.6,644 C567.638831,640.947672 563.552355,639.247987 559.3,639.29884 L463.3,639.29884 C459.055109,639.286138 454.982962,640.979863 452,644 C448.947672,646.961169 447.247987,651.047645 447.29884,655.3 L447.29884,751.3 C447.286138,755.544891 448.979863,759.617038 452,762.6 C454.961169,765.652328 459.047645,767.352013 463.3,767.30116 L559.3,767.30116 C563.544891,767.313862 567.617038,765.620137 570.6,762.6 C573.659349,759.643612 575.360354,755.553963 575.3,751.3 M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.8,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 M512.1,0 C229.7,0 0,229.8 0,512 C0,794.2 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const HelpIcon = createIcon(HelpIconConfig);
-
-var TableTextVariant;
-(function (TableTextVariant) {
-    TableTextVariant["div"] = "div";
-    TableTextVariant["nav"] = "nav";
-})(TableTextVariant || (TableTextVariant = {}));
-var WrapModifier;
-(function (WrapModifier) {
-    WrapModifier["wrap"] = "wrap";
-    WrapModifier["nowrap"] = "nowrap";
-    WrapModifier["truncate"] = "truncate";
-    WrapModifier["breakWord"] = "breakWord";
-    WrapModifier["fitContent"] = "fitContent";
-})(WrapModifier || (WrapModifier = {}));
-const TableText = (_a) => {
-    var { children = null, className = '', variant = 'span', wrapModifier = null, tooltip: tooltipProp = '', tooltipProps = {}, onMouseEnter: onMouseEnterProp = () => { }, focused = false, tooltipHasDefaultBehavior = false } = _a, props = __rest(_a, ["children", "className", "variant", "wrapModifier", "tooltip", "tooltipProps", "onMouseEnter", "focused", "tooltipHasDefaultBehavior"]);
-    const Component = variant;
-    const textRef = createRef();
-    const [tooltip, setTooltip] = useState(tooltipProp);
-    const onMouseEnter = (event) => {
-        if (event.target.offsetWidth < event.target.scrollWidth) {
-            setTooltip(tooltipProp || event.target.innerText);
-        }
-        else {
-            setTooltip('');
-        }
-        onMouseEnterProp(event);
-    };
-    const onFocus = (element) => {
-        if (element.offsetWidth < element.scrollWidth) {
-            setTooltip(tooltipProp || element.innerText);
-        }
-        else {
-            setTooltip('');
-        }
-    };
-    const text = (jsx(Component, Object.assign({ ref: textRef, onMouseEnter: !tooltipHasDefaultBehavior ? onMouseEnter : undefined, className: css(className, wrapModifier && styles$1.modifiers[wrapModifier], styles$1.tableText) }, props, { children: children })));
-    useEffect(() => {
-        if (!tooltipHasDefaultBehavior) {
-            if (focused) {
-                onFocus(textRef.current);
-            }
-            else {
-                setTooltip('');
-            }
-        }
-    }, [focused, tooltipHasDefaultBehavior]);
-    return tooltip !== '' ? (jsx(Tooltip, Object.assign({ triggerRef: textRef, content: tooltip }, (!tooltipHasDefaultBehavior && { isVisible: true }), tooltipProps, { children: text }))) : (text);
-};
-TableText.displayName = 'TableText';
-
-const HeaderCellInfoWrapper = ({ children, info, className, variant = 'tooltip', popoverProps, tooltipProps, ariaLabel }) => (jsxs("div", { className: css(styles$1.tableColumnHelp, className), children: [typeof children === 'string' ? jsx(TableText, { children: children }) : children, jsx("span", { className: css(styles$1.tableColumnHelpAction), children: variant === 'tooltip' ? (jsx(Tooltip, Object.assign({ content: info }, tooltipProps, { children: jsx(Button, { variant: "plain", hasNoPadding: true, "aria-label": ariaLabel || (typeof info === 'string' && info) || 'More info', icon: jsx(HelpIcon, {}) }) }))) : (jsx(Popover, Object.assign({ bodyContent: info }, popoverProps, { children: jsx(Button, { variant: "plain", hasNoPadding: true, "aria-label": ariaLabel || (typeof info === 'string' && info) || 'More info', icon: jsx(HelpIcon, {}) }) }))) })] }));
-HeaderCellInfoWrapper.displayName = 'HeaderCellInfoWrapper';
-
-const stylesGrid = {
-  "modifiers": {
-    "grid": "pf-m-grid",
-    "expandable": "pf-m-expandable",
-    "expanded": "pf-m-expanded",
-    "selected": "pf-m-selected",
-    "compact": "pf-m-compact",
-    "noPadding": "pf-m-no-padding",
-    "hoverable": "pf-m-hoverable",
-    "nowrap": "pf-m-nowrap",
-    "fitContent": "pf-m-fit-content",
-    "truncate": "pf-m-truncate",
-    "gridMd": "pf-m-grid-md",
-    "gridLg": "pf-m-grid-lg",
-    "gridXl": "pf-m-grid-xl",
-    "grid_2xl": "pf-m-grid-2xl"
-  }};
-
-const treeViewStyles = {
-  "modifiers": {
-    "treeView": "pf-m-tree-view",
-    "noInset": "pf-m-no-inset",
-    "treeViewGrid": "pf-m-tree-view-grid",
-    "borderRight": "pf-m-border-right",
-    "treeViewDetailsExpanded": "pf-m-tree-view-details-expanded",
-    "treeViewGridMd": "pf-m-tree-view-grid-md",
-    "treeViewGridLg": "pf-m-tree-view-grid-lg",
-    "treeViewGridXl": "pf-m-tree-view-grid-xl",
-    "treeViewGrid_2xl": "pf-m-tree-view-grid-2xl"
-  },
-  "tableCheck": "pf-v6-c-table__check",
-  "tableToggle": "pf-v6-c-table__toggle",
-  "tableToggleIcon": "pf-v6-c-table__toggle-icon",
-  "tableTreeViewDetailsToggle": "pf-v6-c-table__tree-view-details-toggle",
-  "tableTreeViewIcon": "pf-v6-c-table__tree-view-icon",
-  "tableTreeViewMain": "pf-v6-c-table__tree-view-main",
-  "tableTreeViewText": "pf-v6-c-table__tree-view-text",
-  "tableTreeViewTitleCell": "pf-v6-c-table__tree-view-title-cell"
-};
-
-var RowSelectVariant;
-(function (RowSelectVariant) {
-    RowSelectVariant["radio"] = "radio";
-    RowSelectVariant["checkbox"] = "checkbox";
-})(RowSelectVariant || (RowSelectVariant = {}));
-const SelectColumn = (_a) => {
-    var { children = null, 
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    className, onSelect = null, selectVariant, tooltip, tooltipProps } = _a, props = __rest(_a, ["children", "className", "onSelect", "selectVariant", "tooltip", "tooltipProps"]);
-    const inputRef = createRef();
-    const content = (jsxs(Fragment, { children: [jsx("label", { children: jsx("input", Object.assign({}, props, { ref: inputRef, type: selectVariant, onChange: onSelect })) }), children] }));
-    return tooltip ? (jsx(Tooltip, Object.assign({ triggerRef: inputRef, content: tooltip }, tooltipProps, { children: content }))) : (content);
-};
-SelectColumn.displayName = 'SelectColumn';
-
-const selectable = (label, { rowIndex, columnIndex, rowData, column, property, tooltip }) => {
-    const { extraParams: { onSelect, selectVariant, allRowsSelected, isHeaderSelectDisabled } } = column;
-    const extraData = {
-        rowIndex,
-        columnIndex,
-        column,
-        property
-    };
-    if (rowData && rowData.hasOwnProperty('parent') && !rowData.showSelect && !rowData.fullWidth) {
-        return {
-            component: 'td',
-            isVisible: true
-        };
-    }
-    const rowId = rowIndex !== undefined ? rowIndex : -1;
-    /**
-     * @param {React.FormEvent} event - React form event
-     */
-    function selectClick(event) {
-        const selected = rowIndex === undefined ? event.currentTarget.checked : rowData && !rowData.selected;
-        // tslint:disable-next-line:no-unused-expression
-        onSelect && onSelect(event, selected, rowId, rowData, extraData);
-    }
-    const customProps = Object.assign(Object.assign(Object.assign({}, (rowId !== -1
-        ? {
-            checked: rowData && !!rowData.selected,
-            'aria-label': `Select row ${rowIndex}`
-        }
-        : {
-            checked: allRowsSelected,
-            'aria-label': 'Select all rows'
-        })), (rowData &&
-        (rowData.disableCheckbox || rowData.disableSelection) && {
-        disabled: true,
-        className: checkStyles.checkInput
-    })), (!rowData && isHeaderSelectDisabled && { disabled: true }));
-    let selectName = 'check-all';
-    if (rowId !== -1 && selectVariant === RowSelectVariant.checkbox) {
-        selectName = `checkrow${rowIndex}`;
-    }
-    else if (rowId !== -1) {
-        selectName = 'radioGroup';
-    }
-    return {
-        className: css(styles$1.tableCheck),
-        component: rowId !== -1 ? 'td' : 'th',
-        isVisible: !rowData || !rowData.fullWidth,
-        children: (jsx(SelectColumn, Object.assign({}, customProps, { selectVariant: selectVariant, onSelect: selectClick, name: selectName, tooltip: tooltip, children: label })))
-    };
-};
-
-const LongArrowAltUpIconConfig = {
-  name: 'LongArrowAltUpIcon',
-  height: 512,
-  width: 256,
-  svgPath: 'M88 166.059V468c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12V166.059h46.059c21.382 0 32.09-25.851 16.971-40.971l-86.059-86.059c-9.373-9.373-24.569-9.373-33.941 0l-86.059 86.059c-15.119 15.119-4.411 40.971 16.971 40.971H88z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const LongArrowAltUpIcon = createIcon(LongArrowAltUpIconConfig);
-
-const LongArrowAltDownIconConfig = {
-  name: 'LongArrowAltDownIcon',
-  height: 512,
-  width: 256,
-  svgPath: 'M168 345.941V44c0-6.627-5.373-12-12-12h-56c-6.627 0-12 5.373-12 12v301.941H41.941c-21.382 0-32.09 25.851-16.971 40.971l86.059 86.059c9.373 9.373 24.569 9.373 33.941 0l86.059-86.059c15.119-15.119 4.411-40.971-16.971-40.971H168z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const LongArrowAltDownIcon = createIcon(LongArrowAltDownIconConfig);
-
-const ArrowsAltVIconConfig = {
-  name: 'ArrowsAltVIcon',
-  height: 512,
-  width: 256,
-  svgPath: 'M214.059 377.941H168V134.059h46.059c21.382 0 32.09-25.851 16.971-40.971L144.971 7.029c-9.373-9.373-24.568-9.373-33.941 0L24.971 93.088c-15.119 15.119-4.411 40.971 16.971 40.971H88v243.882H41.941c-21.382 0-32.09 25.851-16.971 40.971l86.059 86.059c9.373 9.373 24.568 9.373 33.941 0l86.059-86.059c15.12-15.119 4.412-40.971-16.97-40.971z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const ArrowsAltVIcon = createIcon(ArrowsAltVIconConfig);
-
-var SortByDirection;
-(function (SortByDirection) {
-    SortByDirection["asc"] = "asc";
-    SortByDirection["desc"] = "desc";
-})(SortByDirection || (SortByDirection = {}));
-const SortColumn = (_a) => {
-    var { children = null, className = '', isSortedBy = false, onSort = null, sortDirection = '', type = 'button', tooltip, tooltipProps, tooltipHasDefaultBehavior, favoriteButtonProps } = _a, props = __rest(_a, ["children", "className", "isSortedBy", "onSort", "sortDirection", "type", "tooltip", "tooltipProps", "tooltipHasDefaultBehavior", "favoriteButtonProps"]);
-    let SortedByIcon;
-    const [focused, setFocused] = useState(false);
-    if (isSortedBy) {
-        SortedByIcon = sortDirection === SortByDirection.asc ? LongArrowAltUpIcon : LongArrowAltDownIcon;
-    }
-    else {
-        SortedByIcon = ArrowsAltVIcon;
-    }
-    if (favoriteButtonProps) {
-        return (jsxs(ActionList, { isIconList: true, children: [jsx(ActionListItem, { children: jsx(Button, Object.assign({ variant: "plain", icon: jsx(StarIcon, {}) }, favoriteButtonProps)) }), jsx(ActionListItem, { children: jsx(Button, Object.assign({ variant: "plain", icon: jsx("span", { className: css(styles$1.tableSortIndicator), children: jsx(SortedByIcon, {}) }), onClick: (event) => onSort && onSort(event) }, props)) })] }));
-    }
-    return (jsx("button", Object.assign({}, props, { type: type, className: css(className, styles$1.tableButton), onClick: (event) => onSort && onSort(event), onFocus: () => setFocused(true), onBlur: () => setFocused(false), children: jsxs("div", { className: css(className, styles$1.tableButtonContent), children: [jsx(TableText, { tooltip: tooltip, tooltipProps: tooltipProps, tooltipHasDefaultBehavior: tooltipHasDefaultBehavior, focused: focused, children: children }), jsx("span", { className: css(styles$1.tableSortIndicator), children: jsx(SortedByIcon, {}) })] }) })));
-};
-SortColumn.displayName = 'SortColumn';
-
-const sortableFavorites = (sort) => () => {
-    var _a;
-    return sortable(jsx(StarIcon, {}), {
-        columnIndex: sort.columnIndex,
-        className: styles$1.tableFavorite,
-        ariaLabel: (_a = sort.ariaLabel) !== null && _a !== void 0 ? _a : 'Sort favorites',
-        column: {
-            extraParams: {
-                sortBy: sort.sortBy,
-                onSort: sort.onSort,
-                favoriteButtonProps: sort.favoriteButtonProps
-            }
-        },
-        tooltip: sort.tooltip,
-        tooltipProps: sort.tooltipProps,
-        tooltipHasDefaultBehavior: true
-    });
-};
-const sortable = (label, { columnIndex, column, property, className, ariaLabel, tooltip, tooltipProps, tooltipHasDefaultBehavior }) => {
-    const { extraParams: { sortBy, onSort, favoriteButtonProps } } = column;
-    const extraData = {
-        columnIndex,
-        column,
-        property
-    };
-    const isSortedBy = sortBy && columnIndex === sortBy.index;
-    /**
-     * @param {React.MouseEvent} event - React mouse event
-     */
-    function sortClicked(event) {
-        let reversedDirection;
-        if (!isSortedBy) {
-            reversedDirection = sortBy.defaultDirection ? sortBy.defaultDirection : SortByDirection.asc;
-        }
-        else {
-            reversedDirection = sortBy.direction === SortByDirection.asc ? SortByDirection.desc : SortByDirection.asc;
-        }
-        // tslint:disable-next-line:no-unused-expression
-        onSort && onSort(event, columnIndex, reversedDirection, extraData);
-    }
-    return Object.assign(Object.assign({ className: css(styles$1.tableSort, isSortedBy && styles$1.modifiers.selected, className) }, (isSortedBy && { 'aria-sort': `${sortBy.direction}ending` })), { children: (jsx(SortColumn, { isSortedBy: isSortedBy, sortDirection: isSortedBy ? sortBy.direction : '', onSort: sortClicked, "aria-label": ariaLabel, tooltip: tooltip, tooltipProps: tooltipProps, tooltipHasDefaultBehavior: tooltipHasDefaultBehavior, favoriteButtonProps: favoriteButtonProps, children: label })) });
-};
-
-const resolveOrDefault = (resolver, defaultValue, rowData, extraData) => (defaultValue);
-const cellActions = (actions, actionResolver, areActionsDisabled) => (label, { rowData, column, rowIndex, columnIndex, column: { extraParams: { actionsToggle, actionsPopperProps } }, property }) => {
-    const extraData = {
-        rowIndex,
-        columnIndex,
-        column,
-        property
-    };
-    const resolvedActions = resolveOrDefault(actionResolver, actions);
-    const resolvedIsDisabled = resolveOrDefault(areActionsDisabled, rowData && rowData.disableActions);
-    const renderProps = resolvedActions && resolvedActions.length > 0
-        ? {
-            children: (jsx(ActionsColumn, { items: resolvedActions, isDisabled: resolvedIsDisabled, rowData: rowData, extraData: extraData, actionsToggle: actionsToggle, popperProps: actionsPopperProps, children: label }))
-        }
-        : {};
-    return Object.assign({ className: css(styles$1.tableAction), style: { paddingRight: 0 }, isVisible: true }, renderProps);
-};
-
-const camelize = (s) => s.toUpperCase().replace('-', '').replace('_', '');
-const toCamel = (s) => s.replace(/([-_][a-z])/gi, camelize);
-/**
- * @param {string} input - String to capitalize
- */
-function capitalize(input) {
-    return input[0].toUpperCase() + input.substring(1);
-}
-
-const cellWidth = (width) => () => ({
-    className: css(styles$1.modifiers[typeof width === 'number' ? `width_${width}` : `width${capitalize(width)}`])
-});
-
-const collapsible = (value, { rowIndex, columnIndex, rowData, column, property }) => {
-    const { extraParams: { onCollapse, rowLabeledBy = 'simple-node', expandId = 'expand-toggle', allRowsExpanded, collapseAllAriaLabel } } = column;
-    const extraData = {
-        rowIndex,
-        columnIndex,
-        column,
-        property
-    };
-    const rowId = rowIndex !== undefined ? rowIndex : -1;
-    const customProps = Object.assign({}, (rowId !== -1
-        ? {
-            isOpen: rowData === null || rowData === void 0 ? void 0 : rowData.isOpen,
-            'aria-labelledby': `${rowLabeledBy}${rowId} ${expandId}${rowId}`
-        }
-        : {
-            isOpen: allRowsExpanded,
-            'aria-label': collapseAllAriaLabel || 'Expand all rows'
-        }));
-    /**
-     * @param {React.MouseEvent} event - Mouse event
-     */
-    function onToggle(event) {
-        const open = rowData ? !rowData.isOpen : !allRowsExpanded;
-        // tslint:disable-next-line:no-unused-expression
-        onCollapse && onCollapse(event, rowIndex, open, rowData, extraData);
-    }
-    return {
-        className: ((rowData === null || rowData === void 0 ? void 0 : rowData.isOpen) !== undefined || rowId === -1) && css(styles$1.tableToggle),
-        isVisible: !(rowData === null || rowData === void 0 ? void 0 : rowData.fullWidth),
-        children: (jsx(CollapseColumn, Object.assign({ "aria-labelledby": `${rowLabeledBy}${rowId} ${expandId}${rowId}`, onToggle: onToggle, id: expandId + rowId }, customProps, { children: value })))
-    };
-};
-
-const compoundExpand = (value, { rowIndex, columnIndex, rowData, column, property }) => {
-    if (!value) {
-        return null;
-    }
-    const { title, props } = value;
-    const { extraParams: { onExpand, expandId = 'expand-toggle' } } = column;
-    const extraData = {
-        rowIndex,
-        columnIndex,
-        column,
-        property
-    };
-    /**
-     * @param {React.MouseEvent} event - Mouse event
-     */
-    function onToggle(event) {
-        // tslint:disable-next-line:no-unused-expression
-        onExpand && onExpand(event, rowIndex, columnIndex, props.isOpen, rowData, extraData);
-    }
-    return {
-        className: css(styles$1.tableCompoundExpansionToggle, props.isOpen && styles$1.modifiers.expanded),
-        children: props.isOpen !== undefined && (jsx("button", { type: "button", className: css(styles$1.tableButton), onClick: onToggle, "aria-expanded": props.isOpen, "aria-controls": props.ariaControls, id: `${expandId}-${rowIndex}-${columnIndex}`, children: jsx(TableText, { children: title }) }))
-    };
-};
-
-const visibilityModifiers = [
-    'hidden',
-    'hiddenOnSm',
-    'hiddenOnMd',
-    'hiddenOnLg',
-    'hiddenOnXl',
-    'hiddenOn_2xl',
-    'visibleOnSm',
-    'visibleOnMd',
-    'visibleOnLg',
-    'visibleOnXl',
-    'visibleOn_2xl'
-];
-const Visibility = visibilityModifiers
-    .filter((key) => styles$1.modifiers[key])
-    .reduce((acc, curr) => {
-    const key2 = curr.replace('_2xl', '2Xl');
-    acc[key2] = styles$1.modifiers[curr];
-    return acc;
-}, {});
-const classNames = (...classes) => () => ({
-    className: css(...classes)
-});
-
-const info = ({ tooltip, tooltipProps, popover, popoverProps, className, ariaLabel }) => {
-    const infoObj = (value) => ({
-        className: styles$1.modifiers.help,
-        children: tooltip ? (jsx(HeaderCellInfoWrapper, { variant: "tooltip", info: tooltip, tooltipProps: tooltipProps, ariaLabel: ariaLabel, className: className, children: value })) : (jsx(HeaderCellInfoWrapper, { variant: "popover", info: popover, popoverProps: popoverProps, ariaLabel: ariaLabel, className: className, children: value }))
-    });
-    return infoObj;
-};
-
-const FavoritesCell = (_a) => {
-    var { className = '', onFavorite, isFavorited, rowIndex } = _a, props = __rest(_a, ["className", "onFavorite", "isFavorited", "rowIndex"]);
-    const ariaProps = rowIndex === undefined
-        ? {}
-        : {
-            id: `favorites-button-${rowIndex}`,
-            'aria-labelledby': `favorites-button-${rowIndex}`
-        };
-    return (jsx(Button, Object.assign({ variant: "plain", className: className, type: "button", "aria-label": isFavorited ? 'Starred' : 'Not starred', onClick: onFavorite }, ariaProps, props, { icon: jsx(StarIcon, {}) })));
-};
-FavoritesCell.displayName = 'FavoritesCell';
-
-const favoritable = (value, { rowIndex, columnIndex, rowData, column, property }) => {
-    const { extraParams: { onFavorite } } = column;
-    const extraData = {
-        rowIndex,
-        columnIndex,
-        column,
-        property
-    };
-    // this is a child row which should not display the favorites icon
-    if (rowData && rowData.hasOwnProperty('parent') && !rowData.fullWidth) {
-        return {
-            component: 'td',
-            isVisible: true
-        };
-    }
-    /**
-     * @param {React.MouseEvent} event - Mouse event
-     */
-    function favoritesClick(event) {
-        // tslint:disable-next-line:no-unused-expression
-        onFavorite && onFavorite(event, rowData && !rowData.favorited, rowIndex, rowData, extraData);
-    }
-    const additionalProps = rowData.favoritesProps || {};
-    return {
-        className: css(styles$1.tableFavorite, rowData && rowData.favorited && styles$1.modifiers.favorited),
-        isVisible: !rowData || !rowData.fullWidth,
-        children: (jsx(FavoritesCell, Object.assign({ rowIndex: rowIndex, onFavorite: favoritesClick, isFavorited: rowData && rowData.favorited }, additionalProps)))
-    };
-};
-
-const EllipsisHIconConfig = {
-  name: 'EllipsisHIcon',
-  height: 512,
-  width: 512,
-  svgPath: 'M328 256c0 39.8-32.2 72-72 72s-72-32.2-72-72 32.2-72 72-72 72 32.2 72 72zm104-72c-39.8 0-72 32.2-72 72s32.2 72 72 72 72-32.2 72-72-32.2-72-72-72zm-352 0c-39.8 0-72 32.2-72 72s32.2 72 72 72 72-32.2 72-72-32.2-72-72-72z',
-  yOffset: 0,
-  xOffset: 0,
-};
-
-const EllipsisHIcon = createIcon(EllipsisHIconConfig);
-
-const treeRow = (onCollapse, onCheckChange, onToggleRowDetails) => (value, { rowIndex, rowData }) => {
-    const { isExpanded, isDetailsExpanded, 'aria-level': level, 'aria-setsize': setsize, toggleAriaLabel, checkAriaLabel, showDetailsAriaLabel, isChecked, checkboxId, icon } = rowData.props;
-    const content = value.title || value;
-    const text = (jsxs("div", { className: css(treeViewStyles.tableTreeViewText), children: [icon && (jsx("span", { className: css(treeViewStyles.tableTreeViewIcon), children: icon }, "tree-view-text-icon")), jsx("span", { className: styles$1.tableText, children: content }, "table-text")] }, "tree-view-text"));
-    const onChange = (isChecked, event) => {
-        onCheckChange(event, isChecked, rowIndex, content, rowData);
-    };
-    return {
-        component: 'th',
-        className: treeViewStyles.tableTreeViewTitleCell,
-        children: level !== undefined ? (jsxs("div", { className: css(treeViewStyles.tableTreeViewMain), children: [setsize > 0 && (jsx("span", { className: css(treeViewStyles.tableToggle), children: jsx(Button, { variant: "plain", onClick: (event) => onCollapse && onCollapse(event, rowIndex, content, rowData), className: css(isExpanded && styles$1.modifiers.expanded), "aria-expanded": isExpanded, "aria-label": toggleAriaLabel || `${isExpanded ? 'Collapse' : 'Expand'} row ${rowIndex}`, icon: jsx("div", { className: css(treeViewStyles.tableToggleIcon), children: jsx(AngleDownIcon, {}) }) }) }, "table-toggle")), !!onCheckChange && (jsx("span", { className: css(treeViewStyles.tableCheck), children: jsx("label", { htmlFor: checkboxId || `checkbox_${rowIndex}`, children: jsx(Checkbox, { id: checkboxId || `checkbox_${rowIndex}`, "aria-label": checkAriaLabel || `Row ${rowIndex} checkbox`, isChecked: isChecked, onChange: (event, checked) => onChange(checked, event) }) }) }, "table-check")), text, !!onToggleRowDetails && (jsx("span", { className: css(treeViewStyles.tableTreeViewDetailsToggle), children: jsx(Button, { variant: "plain", "aria-expanded": isDetailsExpanded, "aria-label": showDetailsAriaLabel || 'Show row details', onClick: (event) => onToggleRowDetails && onToggleRowDetails(event, rowIndex, content, rowData), icon: jsx("span", { className: `${styles$1.table}__details-toggle-icon`, children: jsx(EllipsisHIcon, {}) }) }) }, "view-details-toggle"))] })) : (text)
-    };
-};
-
-var TableGridBreakpoint;
-(function (TableGridBreakpoint) {
-    TableGridBreakpoint["none"] = "";
-    TableGridBreakpoint["grid"] = "grid";
-    TableGridBreakpoint["gridMd"] = "grid-md";
-    TableGridBreakpoint["gridLg"] = "grid-lg";
-    TableGridBreakpoint["gridXl"] = "grid-xl";
-    TableGridBreakpoint["grid2xl"] = "grid-2xl";
-})(TableGridBreakpoint || (TableGridBreakpoint = {}));
-var TableVariant;
-(function (TableVariant) {
-    TableVariant["compact"] = "compact";
-})(TableVariant || (TableVariant = {}));
-
-const TableContext = createContext({
-    registerSelectableRow: () => { }
-});
-const TableBase = (_a) => {
-    var _b, _c;
-    var { children, className, variant, borders = true, isStickyHeader = false, gridBreakPoint = TableGridBreakpoint.gridMd, 'aria-label': ariaLabel, role = 'grid', innerRef, ouiaId, ouiaSafe = true, isTreeTable = false, isNested = false, isStriped = false, isExpandable = false, hasNoInset = false, 
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    nestedHeaderColumnSpans, selectableRowCaptionText } = _a, props = __rest(_a, ["children", "className", "variant", "borders", "isStickyHeader", "gridBreakPoint", 'aria-label', "role", "innerRef", "ouiaId", "ouiaSafe", "isTreeTable", "isNested", "isStriped", "isExpandable", "hasNoInset", "nestedHeaderColumnSpans", "selectableRowCaptionText"]);
-    const ref = useRef(null);
-    const tableRef = innerRef || ref;
-    const [hasSelectableRows, setHasSelectableRows] = useState(false);
-    const [tableCaption, setTableCaption] = useState();
-    useEffect(() => {
-        document.addEventListener('keydown', handleKeys);
-        // sets up roving tab-index to tree tables only
-        if (tableRef && tableRef.current && tableRef.current.classList.contains('pf-m-tree-view')) {
-            const tbody = tableRef.current.querySelector('tbody');
-            tbody && setTabIndex(Array.from(tbody.querySelectorAll('button, a, input')));
-        }
-        return function cleanup() {
-            document.removeEventListener('keydown', handleKeys);
-        };
-    }, [tableRef, tableRef.current]);
-    useEffect(() => {
-        if (selectableRowCaptionText) {
-            setTableCaption(jsxs("caption", { children: [selectableRowCaptionText, jsx("div", { className: "pf-v6-screen-reader", children: "This table has selectable rows. It can be navigated by row using tab, and each row can be selected using space or enter." })] }));
-        }
-        else {
-            setTableCaption(jsx("caption", { className: "pf-v6-screen-reader", children: "This table has selectable rows. It can be navigated by row using tab, and each row can be selected using space or enter." }));
-        }
-    }, [selectableRowCaptionText]);
-    const ouiaProps = useOUIAProps('Table', ouiaId, ouiaSafe);
-    const grid = (_b = stylesGrid.modifiers) === null || _b === void 0 ? void 0 : _b[toCamel(gridBreakPoint || '').replace(/-?2xl/, '_2xl')];
-    const breakPointPrefix = `treeView${gridBreakPoint.charAt(0).toUpperCase() + gridBreakPoint.slice(1)}`;
-    const treeGrid = (_c = treeViewStyles.modifiers) === null || _c === void 0 ? void 0 : _c[toCamel(breakPointPrefix || '').replace(/-?2xl/, '_2xl')];
-    const handleKeys = (event) => {
-        if (isNested ||
-            !(tableRef && tableRef.current && tableRef.current.classList.contains(treeViewStyles.modifiers.treeView)) || // implements roving tab-index to tree tables only
-            (tableRef && tableRef.current !== event.target.closest(`.${styles$1.table}:not(.pf-m-nested)`))) {
-            return;
-        }
-        const activeElement = document.activeElement;
-        const key = event.key;
-        const rows = Array.from(tableRef.current.querySelectorAll('tbody tr')).filter((el) => !el.classList.contains('pf-m-disabled') && !el.hidden);
-        if (key === KeyTypes.Space || key === KeyTypes.Enter) {
-            activeElement.click();
-            event.preventDefault();
-        }
-        const getFocusableElement = (element) => element.querySelectorAll('button:not(:disabled), input:not(:disabled), a:not(:disabled)')[0];
-        handleArrows(event, rows, (element) => element === activeElement.closest('tr'), getFocusableElement, ['button', 'input', 'a'], undefined, false, true, false);
-    };
-    const registerSelectableRow = () => {
-        !hasSelectableRows && setHasSelectableRows(true);
-    };
-    return (jsx(TableContext.Provider, { value: { registerSelectableRow }, children: jsxs("table", Object.assign({ "aria-label": ariaLabel, role: role, className: css(className, styles$1.table, isTreeTable ? treeGrid : grid, styles$1.modifiers[variant], !borders && styles$1.modifiers.noBorderRows, isStickyHeader && styles$1.modifiers.stickyHeader, isTreeTable && treeViewStyles.modifiers.treeView, isStriped && styles$1.modifiers.striped, isExpandable && styles$1.modifiers.expandable, hasNoInset && treeViewStyles.modifiers.noInset, isNested && 'pf-m-nested'), ref: tableRef }, (isTreeTable && { role: 'treegrid' }), ouiaProps, props, { children: [hasSelectableRows && tableCaption, children] })) }));
-};
-const Table = forwardRef((props, ref) => (jsx(TableBase, Object.assign({}, props, { innerRef: ref }))));
-Table.displayName = 'Table';
-
-const TrBase = (_a) => {
-    var { children, className, isExpanded, isEditable, isHidden = false, isClickable = false, isRowSelected = false, isStriped = false, isBorderRow = false, isControlRow = false, innerRef, ouiaId, ouiaSafe = true, resetOffset = false, onRowClick, isSelectable, 'aria-label': passedAriaLabel } = _a, props = __rest(_a, ["children", "className", "isExpanded", "isEditable", "isHidden", "isClickable", "isRowSelected", "isStriped", "isBorderRow", "isControlRow", "innerRef", "ouiaId", "ouiaSafe", "resetOffset", "onRowClick", "isSelectable", 'aria-label']);
-    const ouiaProps = useOUIAProps('TableRow', ouiaId, ouiaSafe);
-    const [computedAriaLabel, setComputedAriaLabel] = useState('');
-    let onKeyDown = null;
-    if (onRowClick) {
-        onKeyDown = (e) => {
-            if (e.key === 'Enter' || e.key === ' ') {
-                onRowClick(e);
-                e.preventDefault();
-            }
-        };
-    }
-    const rowIsHidden = isHidden || (isExpanded !== undefined && !isExpanded);
-    const { registerSelectableRow } = useContext(TableContext);
-    useEffect(() => {
-        if (isSelectable && !rowIsHidden) {
-            setComputedAriaLabel(`${isRowSelected ? 'Row selected' : ''}`);
-            registerSelectableRow();
-        }
-        else {
-            setComputedAriaLabel(undefined);
-        }
-    }, [isRowSelected, isSelectable, registerSelectableRow, rowIsHidden]);
-    const ariaLabel = passedAriaLabel || computedAriaLabel;
-    return (jsx(Fragment$1, { children: jsx("tr", Object.assign({ className: css(styles$1.tableTr, className, isExpanded !== undefined && styles$1.tableExpandableRow, isExpanded && styles$1.modifiers.expanded, isEditable && inlineStyles.modifiers.inlineEditable, isClickable && styles$1.modifiers.clickable, isRowSelected && styles$1.modifiers.selected, isStriped && styles$1.modifiers.striped, isBorderRow && styles$1.modifiers.borderRow, isControlRow && styles$1.tableControlRow, resetOffset && styles$1.modifiers.firstCellOffsetReset), hidden: rowIsHidden }, (isClickable && { tabIndex: 0 }), { "aria-label": ariaLabel, ref: innerRef }, (onRowClick && { onClick: onRowClick, onKeyDown }), ouiaProps, props, { children: children })) }));
-};
-const Tr = forwardRef((props, ref) => (jsx(TrBase, Object.assign({}, props, { innerRef: ref }))));
-Tr.displayName = 'Tr';
-
-const TheadBase = (_a) => {
-    var { children, className, noWrap = false, innerRef, hasNestedHeader } = _a, props = __rest(_a, ["children", "className", "noWrap", "innerRef", "hasNestedHeader"]);
-    return (jsx("thead", Object.assign({ className: css(styles$1.tableThead, className, noWrap && styles$1.modifiers.nowrap, hasNestedHeader && styles$1.modifiers.nestedColumnHeader), ref: innerRef }, props, { children: children })));
-};
-const Thead = forwardRef((props, ref) => (jsx(TheadBase, Object.assign({}, props, { innerRef: ref }))));
-Thead.displayName = 'Thead';
-
-const TbodyBase = (_a) => {
-    var { children, className, isExpanded, innerRef, isEvenStriped = false, isOddStriped = false } = _a, props = __rest(_a, ["children", "className", "isExpanded", "innerRef", "isEvenStriped", "isOddStriped"]);
-    return (jsx("tbody", Object.assign({ role: "rowgroup", className: css(styles$1.tableTbody, className, isExpanded && styles$1.modifiers.expanded, isOddStriped && styles$1.modifiers.striped, isEvenStriped && styles$1.modifiers.stripedEven), ref: innerRef }, props, { children: children })));
-};
-const Tbody = forwardRef((props, ref) => (jsx(TbodyBase, Object.assign({}, props, { innerRef: ref }))));
-Tbody.displayName = 'Tbody';
-
-const styles = {
-  "modifiers": {
-    "borderRight": "pf-m-border-right",
-    "borderLeft": "pf-m-border-left"},
-  "tableStickyCell": "pf-v6-c-table__sticky-cell"
-};
-
-const accessibleStyles = {
-  "screenReader": "pf-v6-u-screen-reader"};
-
-/**
- * merge-props.js
- *
- * Forked from reactabular-table version 8.14.0
- * https://github.com/reactabular/reactabular/tree/v8.14.0/packages/reactabular-table/src
- */
-/**
- * @param {any} props - Props
- */
-function mergeProps(...props) {
-    const firstProps = props[0];
-    const restProps = props.slice(1);
-    if (!restProps.length) {
-        return mergeWith({}, firstProps);
-    }
-    // Avoid mutating the first prop collection
-    return mergeWith(mergeWith({}, firstProps), ...restProps, (a, b, key) => {
-        if (key === 'children') {
-            if (a && b) {
-                // compose the two
-                return cloneElement(a, {
-                    children: b
-                });
-            }
-            // Children have to be merged in reverse order for Reactabular
-            // logic to work.
-            return Object.assign(Object.assign({}, b), a);
-        }
-        if (key === 'className') {
-            // Process class names through classNames to merge properly
-            // as a string.
-            return css(a, b);
-        }
-        return undefined;
-    });
-}
-
-const c_table__sticky_cell_MinWidth = {
-  "name": "--pf-v6-c-table__sticky-cell--MinWidth"};
-
-const c_table__sticky_cell_InsetInlineStart = {
-  "name": "--pf-v6-c-table__sticky-cell--InsetInlineStart"};
-
-const c_table__sticky_cell_InsetInlineEnd = {
-  "name": "--pf-v6-c-table__sticky-cell--InsetInlineEnd"};
-
-const ThBase = (_a) => {
-    var _b;
-    var { children, className, component = 'th', dataLabel, scope = 'col', textCenter = false, sort = null, modifier, select = null, expand: collapse = null, tooltip = '', tooltipProps, onMouseEnter: onMouseEnterProp = () => { }, width, visibility, innerRef, info: infoProps, isStickyColumn = false, hasRightBorder = false, hasLeftBorder = false, stickyMinWidth = '120px', stickyLeftOffset, stickyRightOffset, isSubheader = false, screenReaderText, 'aria-label': ariaLabel } = _a, props = __rest(_a, ["children", "className", "component", "dataLabel", "scope", "textCenter", "sort", "modifier", "select", "expand", "tooltip", "tooltipProps", "onMouseEnter", "width", "visibility", "innerRef", "info", "isStickyColumn", "hasRightBorder", "hasLeftBorder", "stickyMinWidth", "stickyLeftOffset", "stickyRightOffset", "isSubheader", "screenReaderText", 'aria-label']);
-    if (!children && !screenReaderText && !ariaLabel) {
-        // eslint-disable-next-line no-console
-        console.warn('Th: Table headers must have an accessible name. If the Th is intended to be visually empty, pass in screenReaderText. If the Th contains only non-text, interactive content such as a checkbox or expand toggle, pass in an aria-label.');
-    }
-    const [showTooltip, setShowTooltip] = useState(false);
-    const [truncated, setTruncated] = useState(false);
-    const cellRef = innerRef ? innerRef : createRef();
-    const onMouseEnter = (event) => {
-        if (event.target.offsetWidth < event.target.scrollWidth) {
-            !showTooltip && setShowTooltip(true);
-        }
-        else {
-            showTooltip && setShowTooltip(false);
-        }
-        onMouseEnterProp(event);
-    };
-    let sortParams = null;
-    if (sort) {
-        if (sort.isFavorites) {
-            sortParams = sortableFavorites({
-                onSort: sort.onSort,
-                columnIndex: sort.columnIndex,
-                sortBy: sort.sortBy,
-                tooltip: tooltip,
-                tooltipProps,
-                ariaLabel: sort['aria-label'],
-                favoriteButtonProps: sort.favoriteButtonProps
-            })();
-        }
-        else {
-            sortParams = sortable(children, {
-                columnIndex: sort.columnIndex,
-                column: {
-                    extraParams: {
-                        sortBy: sort.sortBy,
-                        onSort: sort === null || sort === void 0 ? void 0 : sort.onSort
-                    }
-                },
-                tooltip: tooltip,
-                tooltipProps
-            });
-        }
-    }
-    const selectParams = select
-        ? selectable(children, {
-            rowData: {
-                selected: select.isSelected,
-                disableSelection: select === null || select === void 0 ? void 0 : select.isDisabled,
-                props: select === null || select === void 0 ? void 0 : select.props
-            },
-            column: {
-                extraParams: {
-                    onSelect: select === null || select === void 0 ? void 0 : select.onSelect,
-                    selectVariant: 'checkbox',
-                    allRowsSelected: select.isSelected,
-                    isHeaderSelectDisabled: !!select.isHeaderSelectDisabled
-                }
-            },
-            tooltip: tooltip})
-        : null;
-    const collapseParams = collapse
-        ? collapsible(children, {
-            column: {
-                extraParams: {
-                    onCollapse: collapse === null || collapse === void 0 ? void 0 : collapse.onToggle,
-                    allRowsExpanded: !collapse.areAllExpanded,
-                    collapseAllAriaLabel: ''
-                }
-            }
-        })
-        : null;
-    const widthParams = width ? cellWidth(width)() : null;
-    const visibilityParams = visibility
-        ? classNames(...visibility.map((vis) => Visibility[vis]))()
-        : null;
-    let transformedChildren = (sortParams === null || sortParams === void 0 ? void 0 : sortParams.children) || (selectParams === null || selectParams === void 0 ? void 0 : selectParams.children) || (collapseParams === null || collapseParams === void 0 ? void 0 : collapseParams.children) || children;
-    // info can wrap other transformedChildren
-    let infoParams = null;
-    if (infoProps) {
-        infoParams = info(infoProps)(transformedChildren);
-        transformedChildren = infoParams.children;
-    }
-    const merged = mergeProps(sortParams, selectParams, collapseParams, widthParams, visibilityParams, infoParams);
-    const { 
-    // ignore the merged children since we transform them ourselves so we can wrap it with info
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    children: mergedChildren = null, 
-    // selectable adds this but we don't want it
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    isVisible = null, className: mergedClassName = '', component: MergedComponent = component } = merged, mergedProps = __rest(merged, ["children", "isVisible", "className", "component"]);
-    useEffect(() => {
-        setTruncated(cellRef.current.offsetWidth <
-            cellRef.current.scrollWidth);
-    }, [cellRef]);
-    const cell = (jsx(MergedComponent, Object.assign({ tabIndex: sort || select || !truncated ? -1 : 0, onFocus: tooltip !== null ? onMouseEnter : onMouseEnterProp, onBlur: () => setShowTooltip(false), "data-label": dataLabel, onMouseEnter: tooltip !== null ? onMouseEnter : onMouseEnterProp, scope: component === 'th' ? scope : null, ref: cellRef, "aria-label": ariaLabel, className: css(styles$1.tableTh, className, textCenter && styles$1.modifiers.center, isSubheader && styles$1.tableSubhead, isStickyColumn && styles.tableStickyCell, hasRightBorder && styles.modifiers.borderRight, hasLeftBorder && styles.modifiers.borderLeft, modifier && styles$1.modifiers[modifier], ((_b = sort === null || sort === void 0 ? void 0 : sort.favoriteButtonProps) === null || _b === void 0 ? void 0 : _b.favorited) && styles$1.modifiers.favorited, mergedClassName) }, mergedProps, props, (isStickyColumn && {
-        style: Object.assign({ [c_table__sticky_cell_MinWidth.name]: stickyMinWidth ? stickyMinWidth : undefined, [c_table__sticky_cell_InsetInlineStart.name]: stickyLeftOffset ? stickyLeftOffset : 0, [c_table__sticky_cell_InsetInlineEnd.name]: stickyRightOffset ? stickyRightOffset : 0 }, props.style)
-    }), { children: transformedChildren ||
-            (screenReaderText && jsx("span", { className: accessibleStyles.screenReader, children: screenReaderText })) })));
-    const canMakeDefaultTooltip = tooltip === '' ? typeof transformedChildren === 'string' : true;
-    const childControlsTooltip = sortParams || selectParams;
-    return tooltip !== null && canMakeDefaultTooltip && !childControlsTooltip && showTooltip ? (jsxs(Fragment$1, { children: [cell, jsx(Tooltip, Object.assign({ triggerRef: cellRef, content: tooltip || (tooltip === '' && children), isVisible: true }, tooltipProps))] })) : (cell);
-};
-const Th = forwardRef((props, ref) => (jsx(ThBase, Object.assign({}, props, { innerRef: ref }))));
-Th.displayName = 'Th';
-
-const draggable = (value, { rowData }) => {
-    const { id } = rowData;
-    return {
-        className: '',
-        children: jsx(DraggableCell, { id: id })
-    };
-};
-
-const TdBase = (_a) => {
-    var { children, className, isActionCell = false, component = 'td', dataLabel, textCenter = false, modifier, select = null, actions = null, expand = null, treeRow: treeRowProp = null, compoundExpand: compoundExpandProp = null, noPadding, width, visibility, innerRef, favorites = null, draggableRow: draggableRowProp = null, tooltip = '', onMouseEnter: onMouseEnterProp = () => { }, isStickyColumn = false, hasRightBorder = false, hasLeftBorder = false, stickyMinWidth = '120px', stickyLeftOffset, stickyRightOffset } = _a, props = __rest(_a, ["children", "className", "isActionCell", "component", "dataLabel", "textCenter", "modifier", "select", "actions", "expand", "treeRow", "compoundExpand", "noPadding", "width", "visibility", "innerRef", "favorites", "draggableRow", "tooltip", "onMouseEnter", "isStickyColumn", "hasRightBorder", "hasLeftBorder", "stickyMinWidth", "stickyLeftOffset", "stickyRightOffset"]);
-    const [showTooltip, setShowTooltip] = useState(false);
-    const [truncated, setTruncated] = useState(false);
-    const cellRef = innerRef ? innerRef : createRef();
-    const onMouseEnter = (event) => {
-        if (event.target.offsetWidth < event.target.scrollWidth) {
-            !showTooltip && setShowTooltip(true);
-        }
-        else {
-            showTooltip && setShowTooltip(false);
-        }
-        onMouseEnterProp(event);
-    };
-    const selectParams = select
-        ? selectable(children, {
-            rowIndex: select.rowIndex,
-            rowData: {
-                selected: select.isSelected,
-                disableSelection: select === null || select === void 0 ? void 0 : select.isDisabled,
-                props: select === null || select === void 0 ? void 0 : select.props
-            },
-            column: {
-                extraParams: {
-                    onSelect: select === null || select === void 0 ? void 0 : select.onSelect,
-                    selectVariant: select.variant || 'checkbox'
-                }
-            }
-        })
-        : null;
-    const favoriteParams = favorites
-        ? favoritable(null, {
-            rowIndex: favorites === null || favorites === void 0 ? void 0 : favorites.rowIndex,
-            rowData: {
-                favorited: favorites.isFavorited,
-                favoritesProps: favorites === null || favorites === void 0 ? void 0 : favorites.props
-            },
-            column: {
-                extraParams: {
-                    onFavorite: favorites === null || favorites === void 0 ? void 0 : favorites.onFavorite
-                }
-            }
-        })
-        : null;
-    const draggableParams = draggableRowProp !== null
-        ? draggable(null, {
-            rowData: {
-                id: draggableRowProp.id
-            }
-        })
-        : null;
-    const actionParamsFunc = actions ? cellActions(actions.items, null, null) : null;
-    const actionParams = actionParamsFunc
-        ? actionParamsFunc(null, {
-            rowIndex: actions === null || actions === void 0 ? void 0 : actions.rowIndex,
-            rowData: {
-                disableActions: actions === null || actions === void 0 ? void 0 : actions.isDisabled
-            },
-            column: {
-                extraParams: {
-                    dropdownPosition: actions === null || actions === void 0 ? void 0 : actions.dropdownPosition,
-                    dropdownDirection: actions === null || actions === void 0 ? void 0 : actions.dropdownDirection,
-                    menuAppendTo: actions === null || actions === void 0 ? void 0 : actions.menuAppendTo,
-                    actionsToggle: actions === null || actions === void 0 ? void 0 : actions.actionsToggle
-                }
-            }
-        })
-        : null;
-    const expandableParams = expand !== null
-        ? collapsible(null, {
-            rowIndex: expand.rowIndex,
-            columnIndex: expand === null || expand === void 0 ? void 0 : expand.columnIndex,
-            rowData: {
-                isOpen: expand.isExpanded
-            },
-            column: {
-                extraParams: {
-                    onCollapse: expand === null || expand === void 0 ? void 0 : expand.onToggle,
-                    expandId: expand === null || expand === void 0 ? void 0 : expand.expandId
-                }
-            }
-        })
-        : null;
-    const compoundParams = compoundExpandProp !== null
-        ? compoundExpand({
-            title: children,
-            props: {
-                isOpen: compoundExpandProp.isExpanded
-            }
-        }, {
-            rowIndex: compoundExpandProp === null || compoundExpandProp === void 0 ? void 0 : compoundExpandProp.rowIndex,
-            columnIndex: compoundExpandProp === null || compoundExpandProp === void 0 ? void 0 : compoundExpandProp.columnIndex,
-            column: {
-                extraParams: {
-                    onExpand: compoundExpandProp === null || compoundExpandProp === void 0 ? void 0 : compoundExpandProp.onToggle,
-                    expandId: compoundExpandProp === null || compoundExpandProp === void 0 ? void 0 : compoundExpandProp.expandId
-                }
-            }
-        })
-        : null;
-    const widthParams = width ? cellWidth(width)() : null;
-    const visibilityParams = visibility
-        ? classNames(...visibility.map((vis) => Visibility[vis]))()
-        : null;
-    const treeRowParams = treeRowProp !== null
-        ? treeRow(treeRowProp.onCollapse, treeRowProp.onCheckChange, treeRowProp.onToggleRowDetails)({
-            title: children
-        }, {
-            rowIndex: treeRowProp.rowIndex,
-            rowData: {
-                props: treeRowProp.props
-            }
-        })
-        : null;
-    const merged = mergeProps(selectParams, actionParams, expandableParams, compoundParams, widthParams, visibilityParams, favoriteParams, treeRowParams, draggableParams);
-    const { 
-    // selectable adds this but we don't want it
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    isVisible = null, children: mergedChildren = null, className: mergedClassName = '', component: MergedComponent = component } = merged, mergedProps = __rest(merged, ["isVisible", "children", "className", "component"]);
-    const treeTableTitleCell = (className && className.includes(treeViewStyles.tableTreeViewTitleCell)) ||
-        (mergedClassName && mergedClassName.includes(treeViewStyles.tableTreeViewTitleCell));
-    useEffect(() => {
-        setTruncated(cellRef.current.offsetWidth <
-            cellRef.current.scrollWidth);
-    }, [cellRef]);
-    const cell = (jsx(MergedComponent, Object.assign({ tabIndex: (select || !truncated) && modifier !== 'truncate' ? -1 : 0 }, (!treeTableTitleCell && { 'data-label': dataLabel }), { onFocus: tooltip !== null ? onMouseEnter : onMouseEnterProp, onBlur: () => setShowTooltip(false), onMouseEnter: tooltip !== null ? onMouseEnter : onMouseEnterProp, className: css(styles$1.tableTd, className, isActionCell && styles$1.tableAction, textCenter && styles$1.modifiers.center, noPadding && styles$1.modifiers.noPadding, isStickyColumn && styles.tableStickyCell, hasRightBorder && styles.modifiers.borderRight, hasLeftBorder && styles.modifiers.borderLeft, styles$1.modifiers[modifier], draggableParams && styles$1.tableDraggable, mergedClassName), ref: cellRef }, mergedProps, props, (isStickyColumn && {
-        style: Object.assign({ [c_table__sticky_cell_MinWidth.name]: stickyMinWidth ? stickyMinWidth : undefined, [c_table__sticky_cell_InsetInlineStart.name]: stickyLeftOffset ? stickyLeftOffset : 0, [c_table__sticky_cell_InsetInlineEnd.name]: stickyRightOffset ? stickyRightOffset : 0 }, props.style)
-    }), { children: mergedChildren || children })));
-    const canMakeDefaultTooltip = tooltip === '' ? typeof children === 'string' : true;
-    return tooltip !== null && canMakeDefaultTooltip && showTooltip ? (jsxs(Fragment$1, { children: [cell, jsx(Tooltip, { triggerRef: cellRef, content: tooltip || (tooltip === '' && children), isVisible: true })] })) : (cell);
-};
-const Td = forwardRef((props, ref) => (jsx(TdBase, Object.assign({}, props, { innerRef: ref }))));
-Td.displayName = 'Td';
-
-const textStyles = {
-  "textColorRequired": "pf-v6-u-text-color-required",
-  "textColorSubtle": "pf-v6-u-text-color-subtle"};
-
-const PropsTable = ({
-  componentName,
-  headingLevel = "h3",
-  componentDescription,
-  componentProps
-}) => {
-  const publicProps = componentProps?.filter((prop) => !prop.isHidden);
-  const hasPropsToRender = !!publicProps?.length;
-  const renderTagLabel = (componentProp) => {
-    const { name, isBeta, isDeprecated } = componentProp;
-    if (!isBeta && !isDeprecated) {
-      return null;
-    }
-    if (isBeta && isDeprecated) {
-      console.error(
-        `The ${name} prop for ${componentName} has both the isBeta and isDeprecated tag.`
-      );
-    }
-    return /* @__PURE__ */ jsx(Label, { color: `${isBeta ? "blue" : "grey"}`, isCompact: true, children: isBeta ? "Beta" : "Deprecated" });
-  };
-  const renderRequiredDescription = (isRequired) => {
-    if (!isRequired) {
-      return null;
-    }
-    return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: css(textStyles.textColorRequired), children: "*" }),
-      /* @__PURE__ */ jsx("span", { className: css(accessibleStyles.screenReader), children: "required" })
-    ] });
-  };
-  return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsx(Content, { component: headingLevel, children: componentName }),
-    /* @__PURE__ */ jsxs(Stack, { hasGutter: true, children: [
-      componentDescription && /* @__PURE__ */ jsx(
-        "div",
-        {
-          "data-testid": "component-description",
-          className: css(textStyles.textColorSubtle),
-          children: componentDescription
-        }
-      ),
-      hasPropsToRender && /* @__PURE__ */ jsxs(Fragment$1, { children: [
-        /* @__PURE__ */ jsxs("div", { id: `${componentName}-required-description`, children: [
-          /* @__PURE__ */ jsx("span", { className: css(textStyles.textColorRequired), children: "*" }),
-          " ",
-          /* @__PURE__ */ jsx("span", { className: css(textStyles.textColorSubtle), children: "indicates a required prop" })
-        ] }),
-        /* @__PURE__ */ jsxs(
-          Table,
-          {
-            variant: "compact",
-            "aria-label": `Props for ${componentName}`,
-            "aria-describedby": `${componentName}-required-description`,
-            gridBreakPoint: "grid-lg",
-            children: [
-              /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
-                /* @__PURE__ */ jsx(Th, { width: 20, children: "Name" }),
-                /* @__PURE__ */ jsx(Th, { width: 20, children: "Type" }),
-                /* @__PURE__ */ jsx(Th, { width: 10, children: "Default" }),
-                /* @__PURE__ */ jsx(Th, { children: "Description" })
-              ] }) }),
-              /* @__PURE__ */ jsx(Tbody, { children: publicProps.map((prop) => /* @__PURE__ */ jsxs(Tr, { children: [
-                /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(TableText, { wrapModifier: "breakWord", children: [
-                  prop.name,
-                  renderRequiredDescription(prop.isRequired),
-                  " ",
-                  renderTagLabel(prop)
-                ] }) }),
-                /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(TableText, { wrapModifier: "breakWord", children: prop.type || "No type info available" }) }),
-                /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(TableText, { wrapModifier: "breakWord", children: prop.defaultValue || "-" }) }),
-                /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(TableText, { wrapModifier: "breakWord", children: prop.description || "No description available." }) })
-              ] }, prop.name)) })
-            ]
-          }
-        )
-      ] })
-    ] })
-  ] });
-};
-
-const $$Astro = createAstro();
-const $$PropsTables = createComponent(async ($$result, $$props, $$slots) => {
-  const Astro2 = $$result.createAstro($$Astro, $$props, $$slots);
-  Astro2.self = $$PropsTables;
-  async function getPropsData(propComponents2) {
-    if (!propComponents2 || propComponents2.length === 0) {
-      return [];
-    }
-    const url = new URL(`/props?components=${propComponents2}`, Astro2.url);
-    try {
-      const response = await fetch(url);
-      const propsData2 = await response.json();
-      return propsData2;
-    } catch (e) {
-      console.error(e);
-      return [];
-    }
-  }
-  const { propComponents } = Astro2.props;
-  const propsData = await getPropsData(propComponents);
-  return renderTemplate`${renderTemplate`${renderComponent($$result, "Stack", Stack, { "hasGutter": true }, { "default": ($$result2) => renderTemplate`${renderComponent($$result2, "StackItem", StackItem, {}, { "default": ($$result3) => renderTemplate`${renderComponent($$result3, "AutoLinkHeader", AutoLinkHeader, { "headingLevel": "h2", "className": "pf-v6-c-content--h2", "id": "props-table" }, { "default": ($$result4) => renderTemplate`
-Props
-` })}` })}${propsData.filter((comp) => !!comp).map((component) => renderTemplate`${renderComponent($$result2, "StackItem", StackItem, { "key": component.name }, { "default": ($$result3) => renderTemplate`${renderComponent($$result3, "PropsTable", PropsTable, { "componentName": component.name, "componentDescription": component.description, "componentProps": component.props })}` })}`)}` })}`}`;
-}, "/home/runner/work/patternfly-doc-core/patternfly-doc-core/src/components/PropsTables.astro", void 0);
-
-const $$file = "/home/runner/work/patternfly-doc-core/patternfly-doc-core/src/components/PropsTables.astro";
-const $$url = undefined;
-
-export { $$PropsTables as default, $$file as file, $$url as url };