@servicetitan/anvil2 3.0.3 → 3.0.4

package/dist/Page-3UxH97bm.js

@@ -1,863 +0,0 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import * as React from 'react';
-import { createContext, forwardRef, useContext, useState, useLayoutEffect, useRef, useEffect, useMemo } from 'react';
-import { c as cx } from './index-De1g9FRV.js';
-import { P as Popover, a as usePopoverContext } from './AiMark-DiMotaq3.js';
-import { b as BreakpointLg } from './primitive-DXlHdTFb.js';
-import { S as SvgKeyboardArrowDown } from './keyboard_arrow_down-C8WQ38p1.js';
-import { S as SvgKeyboardArrowUp } from './keyboard_arrow_up-CxzK6LAl.js';
-import { S as SvgChevronRight } from './chevron_right-BdpsxX7x.js';
-import { useTrackingId } from './useTrackingId.js';
-import { B as Button } from './Button-Bnt8XUI7.js';
-import { I as Icon } from './Icon-BMMbp40n.js';
-import { T as Tooltip } from './Tooltip-lBmgi5ZB.js';
-import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
-import { F as Flex } from './Flex-_orhvoxS.js';
-import { L as Layout } from './Layout-C2Q2hyLG.js';
-import { S as SvgMoreVert } from './more_vert-C_lJSyxt.js';
-import { S as SvgEdit } from './edit-DQOiktcu.js';
-import { S as SvgCheck } from './check-Cf67OWrZ.js';
-import { S as SvgClose } from './close-DZj38AEh.js';
-import { B as ButtonLink } from './ButtonLink-j3h_wRNi.js';
-import { B as Breadcrumbs } from './Breadcrumbs-vvKOtFwN.js';
-import { M as Menu } from './Menu-wpTyUDac.js';
-import { T as TextField } from './TextField-yL52fx5R.js';
-import { T as Text } from './Text-C0F8AkvH.js';
-import { C as Chip } from './Chip-DBn3KRak.js';
-import { createPortal } from 'react-dom';
-import { D as Dialog } from './Dialog-BG9oFx5p.js';
-import { d as drillDownStyles, D as DrillDownContext } from './DrillDown.module-D1Bf9_yP.js';
-import { u as useDrillDownContextState } from './useInitialFocus-BIvXK1Rp.js';
-import { u as useDrillDownContext } from './useDrillDownContext-iUvoTget.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-CB_zHDbW.js';
-
-import './Page.css';const page = "_page_1a6ta_1";
-const container = "_container_1a6ta_29";
-const panel = "_panel_1a6ta_58";
-const open = "_open_1a6ta_58";
-const small = "_small_1a6ta_58";
-const medium = "_medium_1a6ta_61";
-const large = "_large_1a6ta_64";
-const sidebar = "_sidebar_1a6ta_67";
-const collapsed = "_collapsed_1a6ta_67";
-const content = "_content_1a6ta_77";
-const noPadding = "_noPadding_1a6ta_365";
-const header = "_header_1a6ta_442";
-const layout = "_layout_1a6ta_446";
-const title = "_title_1a6ta_454";
-const chips = "_chips_1a6ta_464";
-const actions = "_actions_1a6ta_468";
-const description = "_description_1a6ta_481";
-const styles = {
-	page: page,
-	container: container,
-	panel: panel,
-	open: open,
-	small: small,
-	medium: medium,
-	large: large,
-	sidebar: sidebar,
-	collapsed: collapsed,
-	content: content,
-	"content-footer": "_content-footer_1a6ta_77",
-	"virtual-scroll-container": "_virtual-scroll-container_1a6ta_84",
-	"content-wrapper": "_content-wrapper_1a6ta_92",
-	"footer-slot": "_footer-slot_1a6ta_99",
-	"content-inner": "_content-inner_1a6ta_109",
-	"content-header-inner": "_content-header-inner_1a6ta_131",
-	"sidebar-inner": "_sidebar-inner_1a6ta_195",
-	"sidebar-header": "_sidebar-header_1a6ta_234",
-	"sidebar-adaptive-trigger-container": "_sidebar-adaptive-trigger-container_1a6ta_256",
-	"sidebar-adaptive-trigger": "_sidebar-adaptive-trigger_1a6ta_256",
-	"sidebar-adaptive-trigger-icon": "_sidebar-adaptive-trigger-icon_1a6ta_277",
-	"sidebar-adaptive-container": "_sidebar-adaptive-container_1a6ta_281",
-	"sidebar-adaptive": "_sidebar-adaptive_1a6ta_256",
-	"toggle-button-wrapper": "_toggle-button-wrapper_1a6ta_295",
-	"toggle-button-tooltip": "_toggle-button-tooltip_1a6ta_304",
-	"toggle-button": "_toggle-button_1a6ta_295",
-	noPadding: noPadding,
-	"panel-inner": "_panel-inner_1a6ta_365",
-	"drilldown-open": "_drilldown-open_1a6ta_403",
-	header: header,
-	layout: layout,
-	"title-wrapper": "_title-wrapper_1a6ta_454",
-	title: title,
-	"preference-action": "_preference-action_1a6ta_461",
-	chips: chips,
-	actions: actions,
-	description: description
-};
-
-const SvgSegment = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M10 18h10c.55 0 1-.45 1-1s-.45-1-1-1H10c-.55 0-1 .45-1 1s.45 1 1 1zM3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1zm7 6h10c.55 0 1-.45 1-1s-.45-1-1-1H10c-.55 0-1 .45-1 1s.45 1 1 1z" }));
-
-const SvgChevronLeft = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M14.71 6.71a.996.996 0 0 0-1.41 0L8.71 11.3a.996.996 0 0 0 0 1.41l4.59 4.59a.996.996 0 1 0 1.41-1.41L10.83 12l3.88-3.88c.39-.39.38-1.03 0-1.41z" }));
-
-const PageSideBarContext = createContext(
-  null
-);
-
-const PageContext = createContext({});
-
-function AdaptiveSidebarContent({
-  children,
-  className,
-  innerRef
-}) {
-  const { closePopover } = usePopoverContext();
-  const containerRef = useRef(null);
-  const mergedRef = useMergeRefs([containerRef, innerRef]);
-  useEffect(() => {
-    const el = containerRef.current;
-    if (!el) return;
-    const handleClick = (e) => {
-      if (!(e.target instanceof Element)) return;
-      if (e.target.closest("a")) closePopover();
-    };
-    el.addEventListener("click", handleClick);
-    return () => el.removeEventListener("click", handleClick);
-  }, [closePopover]);
-  return /* @__PURE__ */ jsx(Flex, { direction: "column", className, ref: mergedRef, children });
-}
-const PageSidebar = forwardRef(
-  (props, ref) => {
-    const {
-      children,
-      className,
-      currentPageTitle,
-      localStorageKey = "sidebar-collapsed",
-      ...rest
-    } = props;
-    const data = {
-      localStorageKey
-    };
-    const { pageWidth } = useContext(PageContext);
-    const [isMobile, setIsMobile] = useState(() => {
-      const breakpointWidth = +(BreakpointLg?.value?.replace("px", "") ?? 0);
-      return typeof window !== "undefined" ? window.innerWidth < breakpointWidth : false;
-    });
-    useLayoutEffect(() => {
-      if (!pageWidth) return;
-      const breakpointWidth = +(BreakpointLg?.value?.replace("px", "") ?? 0);
-      setIsMobile(pageWidth < breakpointWidth);
-    }, [pageWidth]);
-    const trackingId = useTrackingId({
-      name: "PageSidebarButton",
-      data,
-      hasOverride: !!props["data-tracking-id"]
-    });
-    const [collapsed, setCollapsed] = useState(() => {
-      const sidebarState = localStorage.getItem(localStorageKey);
-      return sidebarState ? JSON.parse(sidebarState) : false;
-    });
-    const classNames = cx([styles["sidebar"]], className, {
-      [styles["collapsed"]]: collapsed
-    });
-    const onToggleButtonClick = () => {
-      setCollapsed((prev) => {
-        localStorage.setItem(localStorageKey, JSON.stringify(!prev));
-        return !prev;
-      });
-    };
-    if (isMobile) {
-      return /* @__PURE__ */ jsxs(Popover, { fillAvailableHeight: true, matchReferenceWidth: true, noPadding: true, children: [
-        /* @__PURE__ */ jsx(Popover.Trigger, { children: (props2) => {
-          if (typeof document !== "undefined") {
-            if (props2["aria-expanded"]) {
-              document.body.style.overflow = "hidden";
-            } else {
-              document.body.style.overflow = "auto";
-            }
-          }
-          return /* @__PURE__ */ jsx("div", { className: styles["sidebar-adaptive-trigger-container"], children: /* @__PURE__ */ jsxs(
-            Button,
-            {
-              className: styles["sidebar-adaptive-trigger"],
-              icon: SvgSegment,
-              appearance: "ghost",
-              ...props2,
-              children: [
-                !currentPageTitle ? "Menu" : currentPageTitle,
-                /* @__PURE__ */ jsx(
-                  Icon,
-                  {
-                    className: styles["sidebar-adaptive-trigger-icon"],
-                    justifyContent: "end",
-                    svg: props2["aria-expanded"] ? SvgKeyboardArrowUp : SvgKeyboardArrowDown
-                  }
-                )
-              ]
-            }
-          ) });
-        } }),
-        /* @__PURE__ */ jsx(Popover.Content, { className: styles["sidebar-adaptive-container"], children: /* @__PURE__ */ jsx(
-          AdaptiveSidebarContent,
-          {
-            className: styles["sidebar-adaptive"],
-            innerRef: ref,
-            children
-          }
-        ) })
-      ] });
-    }
-    return /* @__PURE__ */ jsx(PageSideBarContext.Provider, { value: { collapsed }, children: /* @__PURE__ */ jsxs("div", { className: classNames, ref, ...rest, children: [
-      /* @__PURE__ */ jsx("div", { className: styles["sidebar-inner"], "aria-hidden": collapsed, children: /* @__PURE__ */ jsx("div", { children }) }),
-      /* @__PURE__ */ jsx("div", { className: styles["toggle-button-wrapper"], children: /* @__PURE__ */ jsxs(Tooltip, { placement: "right", children: [
-        /* @__PURE__ */ jsx(Tooltip.Trigger, { className: styles["toggle-button-tooltip"], children: /* @__PURE__ */ jsx(
-          Button,
-          {
-            size: "small",
-            onClick: onToggleButtonClick,
-            className: styles["toggle-button"],
-            "aria-label": collapsed ? "Open Sidebar" : "Close Sidebar",
-            "data-tracking-id": trackingId,
-            icon: collapsed ? SvgChevronRight : SvgChevronLeft
-          }
-        ) }),
-        /* @__PURE__ */ jsx(Tooltip.Content, { children: collapsed ? "Open Sidebar" : "Close Sidebar" })
-      ] }) })
-    ] }) });
-  }
-);
-PageSidebar.displayName = "Page.Sidebar";
-
-const PageSidebarHeader = forwardRef(
-  (props, ref) => {
-    const { children, className, ...rest } = props;
-    const context = useContext(PageSideBarContext);
-    const classNames = cx([styles["sidebar-header"]], className);
-    return /* @__PURE__ */ jsx("div", { className: classNames, ref, ...rest, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: styles["header-content"],
-        "aria-hidden": context?.collapsed,
-        children
-      }
-    ) });
-  }
-);
-PageSidebarHeader.displayName = "Page.SidebarHeader";
-
-const SvgSettings = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M19.5 12c0-.23-.01-.45-.03-.68l1.86-1.41c.4-.3.51-.86.26-1.3l-1.87-3.23a.987.987 0 0 0-1.25-.42l-2.15.91c-.37-.26-.76-.49-1.17-.68l-.29-2.31c-.06-.5-.49-.88-.99-.88h-3.73c-.51 0-.94.38-1 .88l-.29 2.31c-.41.19-.8.42-1.17.68l-2.15-.91c-.46-.2-1-.02-1.25.42L2.41 8.62c-.25.44-.14.99.26 1.3l1.86 1.41a7.343 7.343 0 0 0 0 1.35l-1.86 1.41c-.4.3-.51.86-.26 1.3l1.87 3.23c.25.44.79.62 1.25.42l2.15-.91c.37.26.76.49 1.17.68l.29 2.31c.06.5.49.88.99.88h3.73c.5 0 .93-.38.99-.88l.29-2.31c.41-.19.8-.42 1.17-.68l2.15.91c.46.2 1 .02 1.25-.42l1.87-3.23c.25-.44.14-.99-.26-1.3l-1.86-1.41c.03-.23.04-.45.04-.68zm-7.46 3.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z" }));
-
-const PageHeader = forwardRef(
-  (props, ref) => {
-    const {
-      title: titleProp,
-      breadcrumbs,
-      chips,
-      description,
-      actions,
-      preferenceAction,
-      layout,
-      className,
-      ...rest
-    } = props;
-    const title = typeof titleProp === "string" ? { text: titleProp } : titleProp;
-    const [editing, setEditing] = useState(false);
-    const [editingTitle, setEditingTitle] = useState(title.text);
-    const editFieldRef = useRef(null);
-    const editButtonRef = useRef(null);
-    const firstRenderRef = useRef(true);
-    useEffect(() => {
-      if (firstRenderRef.current) {
-        firstRenderRef.current = false;
-        return;
-      }
-      if (editing === true && editFieldRef.current) {
-        editFieldRef.current.focus();
-      }
-      if (editing === false && editButtonRef.current) {
-        editButtonRef.current.focus();
-      }
-    }, [editing]);
-    const { fluid, variant } = layout || {};
-    const preferenceItem = preferenceAction && ("href" in preferenceAction ? /* @__PURE__ */ jsxs(Tooltip, { children: [
-      /* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
-        ButtonLink,
-        {
-          appearance: "ghost",
-          icon: SvgSettings,
-          size: "small",
-          className: styles["preference-action"],
-          ...preferenceAction
-        }
-      ) }),
-      /* @__PURE__ */ jsx(Tooltip.Content, { children: preferenceAction["aria-label"] })
-    ] }) : /* @__PURE__ */ jsxs(Tooltip, { children: [
-      /* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
-        Button,
-        {
-          appearance: "ghost",
-          icon: SvgSettings,
-          size: "small",
-          className: styles["preference-action"],
-          ...preferenceAction
-        }
-      ) }),
-      /* @__PURE__ */ jsx(Tooltip.Content, { children: preferenceAction["aria-label"] })
-    ] }));
-    const actionItems = actions && /* @__PURE__ */ jsxs(Flex, { justifyContent: "flex-end", className: styles.actions, children: [
-      actions.primary && (!actions.secondary || actions.secondary.length === 0) && /* @__PURE__ */ jsx(Button, { appearance: "primary", ...actions.primary, children: actions.primary.label }),
-      !!actions.secondary?.length && actions.secondary.length < 3 && !actions.primary && actions.secondary.map((action, index) => /* @__PURE__ */ jsx(Button, { appearance: "secondary", ...action, children: action.label }, index)),
-      actions.primary && !!actions.secondary?.length && actions.secondary.length === 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Button, { appearance: "secondary", ...actions.secondary[0], children: actions.secondary[0].label }),
-        /* @__PURE__ */ jsx(Button, { appearance: "primary", ...actions.primary, children: actions.primary.label })
-      ] }),
-      !!actions.secondary?.length && (actions.secondary.length >= 3 || actions.secondary.length >= 2 && actions.primary) && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          Menu,
-          {
-            trigger: ({ ref: ref2, ...rest2 }) => /* @__PURE__ */ jsxs(Tooltip, { children: [
-              /* @__PURE__ */ jsx(
-                Tooltip.Trigger,
-                {
-                  ref: ref2,
-                  children: /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      appearance: "secondary",
-                      icon: SvgMoreVert,
-                      "aria-label": "More actions",
-                      ...rest2
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ jsx(Tooltip.Content, { children: "More actions" })
-            ] }),
-            children: actions.secondary.map((action, index) => /* @__PURE__ */ jsx(
-              Menu.Item,
-              {
-                label: action.label,
-                onClick: action.onClick,
-                disabled: action.disabled
-              },
-              index
-            ))
-          }
-        ),
-        actions.primary && /* @__PURE__ */ jsx(Button, { appearance: "primary", ...actions.primary, children: actions.primary.label })
-      ] })
-    ] });
-    const headerClassName = cx(styles.content, styles.header, className);
-    const headerContentClassName = cx(
-      styles["content-inner"],
-      styles["content-header-inner"]
-    );
-    return /* @__PURE__ */ jsx("header", { ref, className: headerClassName, ...rest, children: /* @__PURE__ */ jsx("div", { className: headerContentClassName, children: /* @__PURE__ */ jsxs(Layout, { fluid, variant, className: styles["layout"], children: [
-      breadcrumbs && /* @__PURE__ */ jsx(Layout.Item, { children: /* @__PURE__ */ jsx(Breadcrumbs, { children: breadcrumbs.map((breadcrumb, index) => /* @__PURE__ */ jsx(Breadcrumbs.Link, { ...breadcrumb }, index)) }) }),
-      /* @__PURE__ */ jsxs(Layout.Item, { sm: 2, md: actionItems || editing ? 6 : 12, children: [
-        /* @__PURE__ */ jsxs("div", { className: styles["title-wrapper"], children: [
-          title.onChange && editing ? /* @__PURE__ */ jsx(
-            "form",
-            {
-              onSubmit: (e) => {
-                e.preventDefault();
-                if (title.onChange?.(editingTitle) !== false) {
-                  setEditing(false);
-                }
-              },
-              style: { display: "flex" },
-              children: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", grow: 1, gap: 2, children: [
-                /* @__PURE__ */ jsx(
-                  TextField,
-                  {
-                    "aria-label": title.editFieldLabel ?? "Page title",
-                    defaultValue: title.text,
-                    flexGrow: 1,
-                    ref: editFieldRef,
-                    onChange: (event) => setEditingTitle(event.target.value),
-                    onKeyDown: (e) => {
-                      if (e.code === "Escape") {
-                        setEditing(false);
-                        setEditingTitle(title.text);
-                      }
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 1, children: [
-                  /* @__PURE__ */ jsxs(Tooltip, { children: [
-                    /* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
-                      Button,
-                      {
-                        icon: SvgCheck,
-                        "aria-label": title.confirmButtonLabel ?? "Update title",
-                        size: "small",
-                        appearance: "primary",
-                        onClick: () => {
-                          if (title.onChange?.(editingTitle) !== false) {
-                            setEditing(false);
-                          }
-                        }
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsx(Tooltip.Content, { children: title.confirmButtonLabel ?? "Update title" })
-                  ] }),
-                  /* @__PURE__ */ jsxs(Tooltip, { children: [
-                    /* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
-                      Button,
-                      {
-                        icon: SvgClose,
-                        "aria-label": title.cancelButtonLabel ?? "Cancel",
-                        size: "small",
-                        onClick: () => {
-                          setEditing(false);
-                          setEditingTitle(title.text);
-                        }
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsx(Tooltip.Content, { children: title.cancelButtonLabel ?? "Cancel" })
-                  ] })
-                ] })
-              ] })
-            }
-          ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              Text,
-              {
-                variant: "headline",
-                size: "large",
-                el: "h1",
-                className: styles.title,
-                children: title.text
-              }
-            ),
-            title.onChange != null ? /* @__PURE__ */ jsxs(Fragment, { children: [
-              " ",
-              /* @__PURE__ */ jsxs(Tooltip, { children: [
-                /* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    icon: SvgEdit,
-                    "aria-label": title.editButtonLabel ?? "Edit title",
-                    size: "small",
-                    appearance: "ghost",
-                    ref: editButtonRef,
-                    onClick: () => setEditing(true)
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(Tooltip.Content, { children: title.editButtonLabel ?? "Edit title" })
-              ] })
-            ] }) : null
-          ] }),
-          preferenceItem
-        ] }),
-        chips && /* @__PURE__ */ jsx(Flex, { className: styles.chips, children: chips.map((chip, index) => /* @__PURE__ */ jsx(Chip, { ...chip }, index)) })
-      ] }),
-      actions && /* @__PURE__ */ jsx(Layout.Item, { sm: 2, md: 6, children: actionItems }),
-      description && /* @__PURE__ */ jsx(Layout.Item, { md: 12, className: styles.description, children: description })
-    ] }) }) });
-  }
-);
-PageHeader.displayName = "Page.Header";
-
-const PageContent = forwardRef(
-  (props, ref) => {
-    const { children, className, ...rest } = props;
-    const classNames = cx([styles["content"]], className);
-    const sectionRef = useRef(null);
-    const virtualScrollRef = useRef(null);
-    const blocker = useRef(true);
-    const [leftOffset, setLeftOffset] = useState(
-      (sectionRef.current?.offsetLeft ?? 0) + (sectionRef.current?.offsetWidth ?? 0) - 9
-    );
-    const [contentHeight, setContentHeight] = useState(
-      sectionRef.current?.offsetHeight
-    );
-    const { contentWrapper } = useContext(PageContext);
-    useEffect(() => {
-      if (typeof window === "undefined") return;
-      if (!blocker.current) return;
-      function updatePosition() {
-        const newValue = window.scrollY;
-        virtualScrollRef.current?.scrollTo(0, newValue ?? 0);
-      }
-      window?.addEventListener("scroll", updatePosition, { passive: true });
-      return () => {
-        window?.removeEventListener("scroll", updatePosition);
-      };
-    }, []);
-    useEffect(() => {
-      if (sectionRef.current) {
-        const wrapperParent = sectionRef.current.parentElement;
-        const isWrapped = wrapperParent?.classList.contains(styles["content-wrapper"]) ?? false;
-        const heightTarget = isWrapped ? wrapperParent : sectionRef.current;
-        const observer = new ResizeObserver(() => {
-          if (!sectionRef.current) return;
-          setLeftOffset(
-            sectionRef.current.offsetLeft + sectionRef.current.offsetWidth - 9
-          );
-          const offsetStr = getComputedStyle(sectionRef.current).getPropertyValue("--offset").trim();
-          const offset = parseFloat(offsetStr) || 0;
-          const rawHeight = document.documentElement.scrollHeight - offset;
-          const safeHeight = Number.isFinite(rawHeight) ? Math.max(0, rawHeight) : 0;
-          setContentHeight(safeHeight);
-        });
-        observer.observe(sectionRef.current);
-        if (isWrapped) {
-          observer.observe(heightTarget);
-        }
-        return () => {
-          observer.disconnect();
-        };
-      }
-    }, [contentWrapper]);
-    function scrollBody(e) {
-      if (typeof window === "undefined") return;
-      if (blocker.current) return;
-      window.scrollTo(0, e.target.scrollTop);
-    }
-    const section = /* @__PURE__ */ jsxs(
-      "section",
-      {
-        className: classNames,
-        ref: useMergeRefs([sectionRef, ref]),
-        ...rest,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: styles["content-inner"], children }),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: styles["virtual-scroll-container"],
-              ref: virtualScrollRef,
-              style: {
-                left: leftOffset
-              },
-              onScrollCapture: scrollBody,
-              onMouseEnter: () => {
-                blocker.current = false;
-              },
-              onMouseLeave: () => {
-                blocker.current = true;
-              },
-              children: /* @__PURE__ */ jsx("div", { style: { width: 1, height: contentHeight } })
-            }
-          )
-        ]
-      }
-    );
-    if (contentWrapper) {
-      return createPortal(section, contentWrapper);
-    }
-    if (contentWrapper === void 0) {
-      return section;
-    }
-    return null;
-  }
-);
-PageContent.displayName = "PageContent";
-
-const PagePanelInner = ({
-  style,
-  open,
-  children
-}) => {
-  const { index } = useDrillDownContext();
-  const classNames = cx([styles["panel-inner"]], {
-    [styles["drilldown-open"]]: index !== void 0
-  });
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: classNames,
-      tabIndex: typeof open !== "undefined" && open ? 0 : -1,
-      style: { ...style, overflowY: index === void 0 ? "auto" : "hidden" },
-      children: /* @__PURE__ */ jsx("div", { children })
-    }
-  ) });
-};
-const PagePanel = forwardRef(
-  (props, ref) => {
-    const {
-      children,
-      open,
-      size = "medium",
-      noPadding,
-      style,
-      className,
-      defaultDrillDownIndex,
-      onDrillDownContextChange,
-      ...rest
-    } = props;
-    const [isMobile, setIsMobile] = useState(false);
-    const classNames = cx(
-      [styles.panel, drillDownStyles.panel],
-      [styles[size]],
-      className,
-      {
-        [styles["open"]]: typeof open === "undefined" ? true : open,
-        [styles["persistent"]]: typeof open === "undefined",
-        [styles["noPadding"]]: noPadding
-      }
-    );
-    const drillDownContextValue = useDrillDownContextState({
-      defaultDrillDownIndex
-    });
-    const drillDownContextProviderValue = useMemo(
-      () => ({
-        ...drillDownContextValue,
-        hostIsInteractive: open !== false
-      }),
-      [drillDownContextValue, open]
-    );
-    useLayoutEffect(() => {
-      onDrillDownContextChange?.(drillDownContextProviderValue);
-    }, [drillDownContextProviderValue]);
-    const { pageWidth } = useContext(PageContext);
-    const previousOpenRef = useRef(open);
-    useEffect(() => {
-      if (isMobile) {
-        previousOpenRef.current = open;
-        return;
-      }
-      if (previousOpenRef.current && open === false) {
-        drillDownContextValue.onHostClose?.();
-        drillDownContextValue.onHostClosed?.();
-      }
-      previousOpenRef.current = open;
-    }, [open, isMobile, drillDownContextValue]);
-    useLayoutEffect(() => {
-      if (isMobile || !open || previousOpenRef.current) {
-        return;
-      }
-      drillDownContextValue.setHostTrigger?.(
-        document.activeElement instanceof HTMLElement ? document.activeElement : null
-      );
-    }, [open, isMobile, drillDownContextValue]);
-    useLayoutEffect(() => {
-      const breakpointWidth = +(BreakpointLg?.value.replace("px", "") ?? 0);
-      const innerWidth = pageWidth ?? 0;
-      setIsMobile(innerWidth < breakpointWidth);
-    }, [pageWidth]);
-    if (typeof open !== "undefined" && isMobile) {
-      return /* @__PURE__ */ jsx(
-        Dialog,
-        {
-          open,
-          defaultDrillDownIndex,
-          onDrillDownContextChange,
-          children: /* @__PURE__ */ jsx(Dialog.Content, { children: /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: classNames,
-              "aria-hidden": !open,
-              "aria-disabled": !open,
-              ref,
-              ...rest,
-              children
-            }
-          ) })
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx(DrillDownContext.Provider, { value: drillDownContextProviderValue, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: classNames,
-        "aria-hidden": !open,
-        "aria-disabled": !open,
-        ref,
-        ...rest,
-        children: /* @__PURE__ */ jsx(PagePanelInner, { style, open, children })
-      }
-    ) });
-  }
-);
-PagePanel.displayName = "PagePanel";
-
-const PageFooter = forwardRef(
-  (props, ref) => {
-    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-    const { children, className, style, ...rest } = componentProps;
-    const { footerSlot } = useContext(PageContext);
-    const classNames = cx([styles["content-footer"]], className);
-    const styleCombined = {
-      ...style,
-      ...layoutStyles
-    };
-    const footer = /* @__PURE__ */ jsx("footer", { className: classNames, ref, style: styleCombined, ...rest, children });
-    if (footerSlot) {
-      return createPortal(footer, footerSlot);
-    }
-    if (footerSlot === void 0) {
-      return footer;
-    }
-    return null;
-  }
-);
-PageFooter.displayName = "PageFooter";
-
-const Page = Object.assign(
-  forwardRef(function PageInner(props, ref) {
-    const { children, className, ...rest } = props;
-    const classNames = cx(styles["page"], className);
-    const elRef = useRef(null);
-    const combinedRef = useMergeRefs([elRef, ref]);
-    const [pageWidth, setPageWidth] = useState(0);
-    const [contentWrapper, setContentWrapper] = useState(
-      null
-    );
-    const [footerSlot, setFooterSlot] = useState(null);
-    useLayoutEffect(() => {
-      const element = elRef.current;
-      const resizeObserver = new ResizeObserver((entries) => {
-        const entry = entries[0];
-        if (entry) {
-          setPageWidth(entry.contentRect.width);
-        }
-      });
-      if (element) {
-        resizeObserver.observe(element);
-      }
-      return () => {
-        if (element) {
-          resizeObserver.unobserve(element);
-          resizeObserver.disconnect();
-        }
-      };
-    }, [elRef]);
-    const contextValue = useMemo(
-      () => ({ pageWidth, contentWrapper, footerSlot }),
-      [pageWidth, contentWrapper, footerSlot]
-    );
-    return /* @__PURE__ */ jsx(PageContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: classNames, "data-anv": "Page", ref: combinedRef, ...rest, children: /* @__PURE__ */ jsxs("div", { className: styles["container"], children: [
-      children,
-      /* @__PURE__ */ jsx(
-        "main",
-        {
-          className: styles["content-wrapper"],
-          ref: setContentWrapper
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: styles["footer-slot"], ref: setFooterSlot })
-    ] }) }) });
-  }),
-  {
-    /**
-     * PageSidebar component for creating collapsible navigation sidebars.
-     *
-     * Features:
-     * - Collapsible sidebar with localStorage persistence
-     * - Responsive design with adaptive popover on mobile
-     * - Automatic tracking ID generation for analytics
-     * - Keyboard navigation and accessibility support
-     * - Toggle button with tooltip
-     * - Context provider for sidebar state
-     * - Mobile-friendly popover navigation
-     *
-     * @example
-     * <Page.Sidebar currentPageTitle="Navigation">
-     *   <Page.SidebarHeader>
-     *     <Text variant="headline" el="h2">Sidebar Title</Text>
-     *   </Page.SidebarHeader>
-     *   <SideNav>
-     *     <SideNavLink pathname="/">Home</SideNavLink>
-     *   </SideNav>
-     * </Page.Sidebar>
-     */
-    Sidebar: PageSidebar,
-    /**
-     * PageSidebarHeader component for creating header sections within sidebars.
-     *
-     * Features:
-     * - Container for sidebar header content
-     * - Automatic visibility handling based on sidebar collapsed state
-     * - Supports all standard div props
-     * - Context-aware styling
-     *
-     * @example
-     * <Page.SidebarHeader>
-     *   <Text variant="headline" el="h2" size="medium">
-     *     Sidebar Title
-     *   </Text>
-     * </Page.SidebarHeader>
-     */
-    SidebarHeader: PageSidebarHeader,
-    /**
-     * PageHeader component for creating page headers with navigation and actions.
-     *
-     * Features:
-     * - Page title with semantic heading
-     * - Breadcrumb navigation support
-     * - Status chips display
-     * - Primary and secondary action buttons
-     * - Preference action button/link
-     * - Responsive layout with fluid grid
-     * - Accessibility support with proper ARIA labels
-     * - Flexible layout configuration
-     * - Description content support
-     *
-     * @example
-     * <Page.Header
-     *   title="Page Title"
-     *   breadcrumbs={[
-     *     { href: "/", children: "Home" },
-     *     { children: "Current Page" }
-     *   ]}
-     *   chips={[{ label: "Status" }]}
-     *   actions={{
-     *     primary: { label: "Save", onClick: handleSave },
-     *     secondary: [{ label: "Cancel", onClick: handleCancel }]
-     *   }}
-     * />
-     */
-    Header: PageHeader,
-    /**
-     * PageContent component for the main content area of a page.
-     *
-     * Features:
-     * - Semantic main element for page content
-     * - Virtual scrolling support for long content
-     * - Automatic scroll synchronization
-     * - Responsive design
-     * - Accessibility support with proper main landmark
-     * - Scroll position management
-     *
-     * @example
-     * <Page.Content>
-     *   <Text>Main page content goes here</Text>
-     *   <Button>Action Button</Button>
-     * </Page.Content>
-     */
-    Content: PageContent,
-    /**
-     * PagePanel component for creating slide-out panels or dialogs.
-     *
-     * Features:
-     * - Responsive design with dialog fallback on mobile
-     * - Multiple size variants (small, medium, large)
-     * - Optional padding control
-     * - Persistent or controlled open state
-     * - Automatic mobile dialog conversion
-     * - Keyboard navigation and accessibility support
-     * - Smooth animations and transitions
-     *
-     * @example
-     * <Page.Panel open={isOpen} size="medium">
-     *   <Text variant="headline" el="h3">Panel Content</Text>
-     *   <Button onClick={() => setIsOpen(false)}>Close</Button>
-     * </Page.Panel>
-     */
-    Panel: PagePanel,
-    /**
-     * PageFooter component for creating page footers with layout utilities.
-     *
-     * Features:
-     * - Semantic footer element
-     * - Layout utility props support
-     * - Responsive design
-     * - Accessibility support with proper footer landmark
-     * - Flexible content positioning
-     *
-     * @example
-     * <Page.Footer>
-     *   <Text>Footer content with layout utilities</Text>
-     * </Page.Footer>
-     */
-    Footer: PageFooter
-  }
-);
-Page.displayName = "Page";
-
-export { Page as P };
-//# sourceMappingURL=Page-3UxH97bm.js.map