@dynatrace/strato-components 3.13.3 → 3.14.1

package/esm/layouts/page-layout/sidebar-layout/SidebarLayout.js

@@ -1,218 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import {
-  forwardRef,
-  memo,
-  useCallback,
-  useRef,
-  useState
-} from "react";
-import { useIntl } from "react-intl";
-import { ChevronSmallLeftDoubleIcon, XmarkIcon } from "@dynatrace/strato-icons";
-import { SidebarHint } from "./CollapsedSidebarRail.js";
-import * as styles from "./SidebarLayout.sty.js";
-import { useButtonFocusHandover } from "./useFocusHandover.js";
-import { useLayoutState } from "./useLayoutState.js";
-import { Button } from "../../../buttons/button/Button.js";
-import { useId } from "../../../core/hooks/useId.js";
-import { useMergeRefs } from "../../../core/hooks/useMergeRefs.js";
-import { useVisualRefreshEnabled } from "../../../core/hooks/useVisualRefreshEnabled.js";
-import { Drawer } from "../../../overlays/drawer/Drawer.js";
-import { Tooltip } from "../../../overlays/tooltip/Tooltip.js";
-import { clampPanelWidth } from "../../split-layout/split-sizing-utils.js";
-import { SplitLayout } from "../../split-layout/SplitLayout.js";
-import { convertToPx } from "../../split-layout/width-utils.js";
-import { useTeleport } from "../shared/useTeleport.js";
-const COLLAPSED_RAIL_WIDTH = 16;
-const COLLAPSED_RAIL_BORDER_WIDTH = 1;
-const SPLIT_HANDLE_WIDTH = 8;
-function SidebarLayoutInner({
-  sidebar,
-  content,
-  containerRef,
-  panelId,
-  contentTeleport,
-  panelTeleport
-}) {
-  const layout = useLayoutState({ sidebar, containerRef });
-  const intl = useIntl();
-  const focusHandover = useButtonFocusHandover();
-  const isVisualRefreshEnabled = useVisualRefreshEnabled();
-  const collapsedRailWidth = isVisualRefreshEnabled ? COLLAPSED_RAIL_WIDTH + COLLAPSED_RAIL_BORDER_WIDTH : COLLAPSED_RAIL_WIDTH;
-  const [intendedWidth, setIntendedWidth] = useState();
-  const containerWidth = layout.containerWidth;
-  const baseWidth = containerWidth === 0 ? void 0 : intendedWidth ?? convertToPx(sidebar.config.defaultWidth, containerWidth);
-  const panelWidth = baseWidth === void 0 ? void 0 : clampPanelWidth(baseWidth, containerWidth, {
-    panelMin: sidebar.config.minWidth,
-    panelMax: sidebar.config.maxWidth,
-    contentMin: content.config.minWidth,
-    handleWidth: sidebar.config.resizable ? SPLIT_HANDLE_WIDTH : 0
-  });
-  const commitWidth = useCallback(
-    (value) => {
-      setIntendedWidth(value);
-      sidebar.config.onResize?.(value);
-    },
-    [sidebar.config]
-  );
-  const expandSidebarLabel = intl.formatMessage({
-    defaultMessage: "Expand sidebar",
-    id: "NF0tLfJTokD/xw5B",
-    description: "Label for the button that expands the sidebar."
-  });
-  const collapseSidebarLabel = intl.formatMessage({
-    defaultMessage: "Collapse sidebar",
-    id: "LJ0fyD2++VZgZ5g0",
-    description: "Label for the button that collapses the sidebar."
-  });
-  const sidebarLabel = intl.formatMessage({
-    defaultMessage: "Sidebar",
-    id: "BYUJpW8TBonAxnYd",
-    description: "Accessible label for the sidebar panel."
-  });
-  const setCollapsedWithFocusHandover = (value) => {
-    layout.setCollapsed(value);
-    focusHandover.setTarget(value ? "expand" : "collapse");
-  };
-  const contentNode = /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: content.ref,
-      ...content.domProps,
-      className: clsx(styles.content, content.domProps.className),
-      children: /* @__PURE__ */ jsx(contentTeleport.Target, {})
-    }
-  );
-  const isSplit = layout.mode === "split";
-  const isDrawer = layout.mode === "drawer";
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(SplitLayout, { children: [
-      /* @__PURE__ */ jsx(
-        SplitLayout.Panel,
-        {
-          ...isSplit ? sidebar.domProps : {},
-          ref: isSplit ? sidebar.ref : void 0,
-          minWidth: isSplit ? sidebar.config.minWidth : collapsedRailWidth,
-          maxWidth: isSplit ? sidebar.config.maxWidth : collapsedRailWidth,
-          defaultWidth: sidebar.config.defaultWidth,
-          width: isSplit ? panelWidth : collapsedRailWidth,
-          resizable: isSplit && sidebar.config.resizable,
-          position: "start",
-          onResize: commitWidth,
-          className: clsx(
-            isSplit && styles.panel,
-            isSplit && sidebar.domProps.className
-          ),
-          style: isSplit ? void 0 : { overflow: "visible" },
-          "aria-label": isSplit ? sidebarLabel : void 0,
-          id: isSplit ? panelId : void 0,
-          children: isSplit ? /* @__PURE__ */ jsx(panelTeleport.Target, {}) : /* @__PURE__ */ jsx(
-            SidebarHint,
-            {
-              panelId,
-              expandSidebarLabel,
-              expandButtonRef: focusHandover.expandButtonRef,
-              isCollapsed: isDrawer ? layout.collapsed : true,
-              onCollapsedChange: setCollapsedWithFocusHandover
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ jsx(SplitLayout.ResizeHandle, { className: styles.resizeHandle, children: /* @__PURE__ */ jsx("div", { className: styles.collapseButtonContainer, children: /* @__PURE__ */ jsx(Tooltip, { text: collapseSidebarLabel, children: /* @__PURE__ */ jsx(
-        Button,
-        {
-          className: styles.collapseButton,
-          "aria-expanded": "true",
-          ref: focusHandover.collapseButtonRef,
-          "aria-controls": panelId,
-          "aria-label": collapseSidebarLabel,
-          size: "condensed",
-          "data-dt-children-name": "ExpandCollapse",
-          "data-dt-properties": "state:collapse",
-          onClick: () => {
-            setCollapsedWithFocusHandover(true);
-          },
-          children: /* @__PURE__ */ jsx(Button.Prefix, { children: /* @__PURE__ */ jsx(ChevronSmallLeftDoubleIcon, {}) })
-        }
-      ) }) }) }),
-      /* @__PURE__ */ jsx(SplitLayout.Content, { minWidth: content.config.minWidth, children: contentNode })
-    ] }),
-    isDrawer && /* @__PURE__ */ jsx(
-      Drawer,
-      {
-        ...sidebar.domProps,
-        ref: sidebar.ref,
-        className: clsx(styles.drawer, sidebar.domProps.className),
-        "aria-label": sidebarLabel,
-        isDismissed: layout.collapsed,
-        onDismiss: (state, _reason) => {
-          setCollapsedWithFocusHandover(state);
-        },
-        placement: "left",
-        width: "wide",
-        children: /* @__PURE__ */ jsxs("div", { className: styles.drawerContentContainer, children: [
-          /* @__PURE__ */ jsx("div", { className: styles.drawerHeader, children: /* @__PURE__ */ jsx(
-            Button,
-            {
-              style: { marginLeft: "auto" },
-              ref: focusHandover.collapseButtonRef,
-              "aria-label": collapseSidebarLabel,
-              "data-dt-children-name": "CloseX",
-              onClick: () => {
-                setCollapsedWithFocusHandover(true);
-              },
-              children: /* @__PURE__ */ jsx(Button.Prefix, { children: /* @__PURE__ */ jsx(XmarkIcon, {}) })
-            }
-          ) }),
-          /* @__PURE__ */ jsx("div", { className: styles.drawerContent, children: /* @__PURE__ */ jsx(panelTeleport.Target, {}) })
-        ] })
-      }
-    )
-  ] });
-}
-const SidebarLayout = memo(
-  forwardRef((props, ref) => {
-    const { className: rootClassName, sidebar, content, ...rootProps } = props;
-    const panelId = useId();
-    const containerRef = useRef(null);
-    const rootRef = useMergeRefs([ref, containerRef]);
-    const contentTeleport = useTeleport();
-    const panelTeleport = useTeleport();
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(contentTeleport.Source, { children: content.children }),
-      sidebar && /* @__PURE__ */ jsx(panelTeleport.Source, { children: sidebar.children }),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ...rootProps,
-          ref: rootRef,
-          className: clsx(styles.layoutRoot, rootClassName),
-          children: sidebar ? /* @__PURE__ */ jsx(
-            SidebarLayoutInner,
-            {
-              sidebar,
-              content,
-              containerRef,
-              panelId,
-              contentTeleport,
-              panelTeleport
-            }
-          ) : /* @__PURE__ */ jsx(
-            "div",
-            {
-              ref: content.ref,
-              ...content.domProps,
-              className: clsx(styles.content, content.domProps.className),
-              children: /* @__PURE__ */ jsx(contentTeleport.Target, {})
-            }
-          )
-        }
-      )
-    ] });
-  })
-);
-SidebarLayout.displayName = "SidebarLayout (forwardRef)";
-export {
-  SidebarLayout
-};
-//# sourceMappingURL=SidebarLayout.js.map

package/esm/layouts/page-layout/sidebar-layout/SidebarLayout.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/layouts/page-layout/sidebar-layout/SidebarLayout.tsx"],
-  "sourcesContent": ["import { clsx } from 'clsx';\nimport {\n  forwardRef,\n  memo,\n  useCallback,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type Ref,\n  type RefObject,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { ChevronSmallLeftDoubleIcon, XmarkIcon } from '@dynatrace/strato-icons';\n\nimport { SidebarHint } from './CollapsedSidebarRail.js';\nimport * as styles from './SidebarLayout.sty.js';\nimport {\n  type ExtractedContentSlot,\n  type ExtractedSidebarSlot,\n} from './slots.js';\nimport { useButtonFocusHandover } from './useFocusHandover.js';\nimport { useLayoutState } from './useLayoutState.js';\nimport { Button } from '../../../buttons/button/Button.js';\nimport { useId } from '../../../core/hooks/useId.js';\nimport { useMergeRefs } from '../../../core/hooks/useMergeRefs.js';\nimport { useVisualRefreshEnabled } from '../../../core/hooks/useVisualRefreshEnabled.js';\nimport { Drawer } from '../../../overlays/drawer/Drawer.js';\nimport { Tooltip } from '../../../overlays/tooltip/Tooltip.js';\nimport { clampPanelWidth } from '../../split-layout/split-sizing-utils.js';\nimport { SplitLayout } from '../../split-layout/SplitLayout.js';\nimport { convertToPx } from '../../split-layout/width-utils.js';\nimport { useTeleport } from '../shared/useTeleport.js';\n\ntype TeleportPair = ReturnType<typeof useTeleport>;\n\n// = Spacings.Size16; SplitLayout.Panel needs a plain number, not a CSS var\nconst COLLAPSED_RAIL_WIDTH = 16;\n// visual refresh adds a 1px border-right (content-box, so it adds to the width)\nconst COLLAPSED_RAIL_BORDER_WIDTH = 1;\n\n// mirrors SplitLayout's own resize-handle width (useSplitSizing)\nconst SPLIT_HANDLE_WIDTH = 8;\n\nfunction SidebarLayoutInner({\n  sidebar,\n  content,\n  containerRef,\n  panelId,\n  contentTeleport,\n  panelTeleport,\n}: {\n  sidebar: ExtractedSidebarSlot;\n  content: ExtractedContentSlot;\n  containerRef: RefObject<HTMLDivElement | null>;\n  panelId: string;\n  contentTeleport: TeleportPair;\n  panelTeleport: TeleportPair;\n}) {\n  const layout = useLayoutState({ sidebar, containerRef });\n  const intl = useIntl();\n  const focusHandover = useButtonFocusHandover();\n  const isVisualRefreshEnabled = useVisualRefreshEnabled();\n\n  const collapsedRailWidth = isVisualRefreshEnabled\n    ? COLLAPSED_RAIL_WIDTH + COLLAPSED_RAIL_BORDER_WIDTH\n    : COLLAPSED_RAIL_WIDTH;\n\n  const [intendedWidth, setIntendedWidth] = useState<number>();\n  const containerWidth = layout.containerWidth;\n\n  const baseWidth =\n    containerWidth === 0\n      ? undefined\n      : intendedWidth ??\n        convertToPx(sidebar.config.defaultWidth, containerWidth);\n  const panelWidth =\n    baseWidth === undefined\n      ? undefined\n      : clampPanelWidth(baseWidth, containerWidth, {\n          panelMin: sidebar.config.minWidth,\n          panelMax: sidebar.config.maxWidth,\n          contentMin: content.config.minWidth,\n          handleWidth: sidebar.config.resizable ? SPLIT_HANDLE_WIDTH : 0,\n        });\n\n  const commitWidth = useCallback(\n    (value: number) => {\n      setIntendedWidth(value);\n      sidebar.config.onResize?.(value);\n    },\n    [sidebar.config],\n  );\n\n  const expandSidebarLabel = intl.formatMessage({\n    defaultMessage: 'Expand sidebar',\n    id: 'NF0tLfJTokD/xw5B',\n    description: 'Label for the button that expands the sidebar.',\n  });\n\n  const collapseSidebarLabel = intl.formatMessage({\n    defaultMessage: 'Collapse sidebar',\n    id: 'LJ0fyD2++VZgZ5g0',\n    description: 'Label for the button that collapses the sidebar.',\n  });\n\n  const sidebarLabel = intl.formatMessage({\n    defaultMessage: 'Sidebar',\n    id: 'BYUJpW8TBonAxnYd',\n    description: 'Accessible label for the sidebar panel.',\n  });\n\n  const setCollapsedWithFocusHandover = (value: boolean) => {\n    layout.setCollapsed(value);\n    focusHandover.setTarget(value ? 'expand' : 'collapse');\n  };\n\n  const contentNode = (\n    <div\n      ref={content.ref}\n      {...content.domProps}\n      className={clsx(styles.content, content.domProps.className)}\n    >\n      <contentTeleport.Target />\n    </div>\n  );\n\n  // must stay in one SplitLayout, not per-mode, or it remounts and resets scroll (APPDEV-18829)\n  const isSplit = layout.mode === 'split';\n  const isDrawer = layout.mode === 'drawer';\n\n  return (\n    <>\n      <SplitLayout>\n        <SplitLayout.Panel\n          {...(isSplit ? sidebar.domProps : {})}\n          ref={isSplit ? (sidebar.ref as Ref<HTMLDivElement>) : undefined}\n          minWidth={isSplit ? sidebar.config.minWidth : collapsedRailWidth}\n          maxWidth={isSplit ? sidebar.config.maxWidth : collapsedRailWidth}\n          defaultWidth={sidebar.config.defaultWidth}\n          width={isSplit ? panelWidth : collapsedRailWidth}\n          resizable={isSplit && sidebar.config.resizable}\n          position=\"start\"\n          onResize={commitWidth}\n          className={clsx(\n            isSplit && styles.panel,\n            isSplit && sidebar.domProps.className,\n          )}\n          // rail's expand button intentionally overflows the 16px column\n          style={isSplit ? undefined : { overflow: 'visible' }}\n          aria-label={isSplit ? sidebarLabel : undefined}\n          id={isSplit ? panelId : undefined}\n        >\n          {isSplit ? (\n            <panelTeleport.Target />\n          ) : (\n            <SidebarHint\n              panelId={panelId}\n              expandSidebarLabel={expandSidebarLabel}\n              expandButtonRef={focusHandover.expandButtonRef}\n              isCollapsed={isDrawer ? layout.collapsed : true}\n              onCollapsedChange={setCollapsedWithFocusHandover}\n            />\n          )}\n        </SplitLayout.Panel>\n        <SplitLayout.ResizeHandle className={styles.resizeHandle}>\n          <div className={styles.collapseButtonContainer}>\n            <Tooltip text={collapseSidebarLabel}>\n              <Button\n                className={styles.collapseButton}\n                aria-expanded=\"true\"\n                ref={focusHandover.collapseButtonRef}\n                aria-controls={panelId}\n                aria-label={collapseSidebarLabel}\n                size=\"condensed\"\n                data-dt-children-name=\"ExpandCollapse\"\n                data-dt-properties=\"state:collapse\"\n                onClick={() => {\n                  setCollapsedWithFocusHandover(true);\n                }}\n              >\n                <Button.Prefix>\n                  <ChevronSmallLeftDoubleIcon />\n                </Button.Prefix>\n              </Button>\n            </Tooltip>\n          </div>\n        </SplitLayout.ResizeHandle>\n        <SplitLayout.Content minWidth={content.config.minWidth}>\n          {contentNode}\n        </SplitLayout.Content>\n      </SplitLayout>\n      {isDrawer && (\n        <Drawer\n          {...sidebar.domProps}\n          ref={sidebar.ref as Ref<HTMLDialogElement>}\n          className={clsx(styles.drawer, sidebar.domProps.className)}\n          aria-label={sidebarLabel}\n          isDismissed={layout.collapsed}\n          onDismiss={(state, _reason) => {\n            setCollapsedWithFocusHandover(state);\n          }}\n          placement=\"left\"\n          width=\"wide\"\n        >\n          <div className={styles.drawerContentContainer}>\n            <div className={styles.drawerHeader}>\n              <Button\n                style={{ marginLeft: 'auto' }}\n                ref={focusHandover.collapseButtonRef}\n                aria-label={collapseSidebarLabel}\n                data-dt-children-name=\"CloseX\"\n                onClick={() => {\n                  setCollapsedWithFocusHandover(true);\n                }}\n              >\n                <Button.Prefix>\n                  <XmarkIcon />\n                </Button.Prefix>\n              </Button>\n            </div>\n            <div className={styles.drawerContent}>\n              <panelTeleport.Target />\n            </div>\n          </div>\n        </Drawer>\n      )}\n    </>\n  );\n}\n\n/** @internal */\nexport type LayoutRootProps = {\n  sidebar: ExtractedSidebarSlot | null;\n  content: ExtractedContentSlot;\n} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'content'>;\n\n/** @internal */\nexport const SidebarLayout = memo(\n  forwardRef<HTMLDivElement, LayoutRootProps>((props, ref) => {\n    const { className: rootClassName, sidebar, content, ...rootProps } = props;\n\n    const panelId = useId();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const rootRef = useMergeRefs([ref, containerRef]);\n\n    const contentTeleport = useTeleport();\n    const panelTeleport = useTeleport();\n\n    return (\n      <>\n        <contentTeleport.Source>{content.children}</contentTeleport.Source>\n        {sidebar && (\n          <panelTeleport.Source>{sidebar.children}</panelTeleport.Source>\n        )}\n        <div\n          {...rootProps}\n          ref={rootRef}\n          className={clsx(styles.layoutRoot, rootClassName)}\n        >\n          {sidebar ? (\n            <SidebarLayoutInner\n              sidebar={sidebar}\n              content={content}\n              containerRef={containerRef}\n              panelId={panelId}\n              contentTeleport={contentTeleport}\n              panelTeleport={panelTeleport}\n            />\n          ) : (\n            <div\n              ref={content.ref}\n              {...content.domProps}\n              className={clsx(styles.content, content.domProps.className)}\n            >\n              <contentTeleport.Target />\n            </div>\n          )}\n        </div>\n      </>\n    );\n  }),\n);\nSidebarLayout.displayName = 'SidebarLayout (forwardRef)';\n"],
-  "mappings": "AA2HM,SASF,UATE,KAUA,YAVA;AA3HN,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,eAAe;AAExB,SAAS,4BAA4B,iBAAiB;AAEtD,SAAS,mBAAmB;AAC5B,YAAY,YAAY;AAKxB,SAAS,8BAA8B;AACvC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,oBAAoB;AAC7B,SAAS,+BAA+B;AACxC,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAK5B,MAAM,uBAAuB;AAE7B,MAAM,8BAA8B;AAGpC,MAAM,qBAAqB;AAE3B,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOG;AACD,QAAM,SAAS,eAAe,EAAE,SAAS,aAAa,CAAC;AACvD,QAAM,OAAO,QAAQ;AACrB,QAAM,gBAAgB,uBAAuB;AAC7C,QAAM,yBAAyB,wBAAwB;AAEvD,QAAM,qBAAqB,yBACvB,uBAAuB,8BACvB;AAEJ,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAiB;AAC3D,QAAM,iBAAiB,OAAO;AAE9B,QAAM,YACJ,mBAAmB,IACf,SACA,iBACA,YAAY,QAAQ,OAAO,cAAc,cAAc;AAC7D,QAAM,aACJ,cAAc,SACV,SACA,gBAAgB,WAAW,gBAAgB;AAAA,IACzC,UAAU,QAAQ,OAAO;AAAA,IACzB,UAAU,QAAQ,OAAO;AAAA,IACzB,YAAY,QAAQ,OAAO;AAAA,IAC3B,aAAa,QAAQ,OAAO,YAAY,qBAAqB;AAAA,EAC/D,CAAC;AAEP,QAAM,cAAc;AAAA,IAClB,CAAC,UAAkB;AACjB,uBAAiB,KAAK;AACtB,cAAQ,OAAO,WAAW,KAAK;AAAA,IACjC;AAAA,IACA,CAAC,QAAQ,MAAM;AAAA,EACjB;AAEA,QAAM,qBAAqB,KAAK,cAAc;AAAA,IAC5C,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,QAAM,uBAAuB,KAAK,cAAc;AAAA,IAC9C,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,QAAM,eAAe,KAAK,cAAc;AAAA,IACtC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,QAAM,gCAAgC,CAAC,UAAmB;AACxD,WAAO,aAAa,KAAK;AACzB,kBAAc,UAAU,QAAQ,WAAW,UAAU;AAAA,EACvD;AAEA,QAAM,cACJ;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,QAAQ;AAAA,MACZ,GAAG,QAAQ;AAAA,MACZ,WAAW,KAAK,OAAO,SAAS,QAAQ,SAAS,SAAS;AAAA,MAE1D,8BAAC,gBAAgB,QAAhB,EAAuB;AAAA;AAAA,EAC1B;AAIF,QAAM,UAAU,OAAO,SAAS;AAChC,QAAM,WAAW,OAAO,SAAS;AAEjC,SACE,iCACE;AAAA,yBAAC,eACC;AAAA;AAAA,QAAC,YAAY;AAAA,QAAZ;AAAA,UACE,GAAI,UAAU,QAAQ,WAAW,CAAC;AAAA,UACnC,KAAK,UAAW,QAAQ,MAA8B;AAAA,UACtD,UAAU,UAAU,QAAQ,OAAO,WAAW;AAAA,UAC9C,UAAU,UAAU,QAAQ,OAAO,WAAW;AAAA,UAC9C,cAAc,QAAQ,OAAO;AAAA,UAC7B,OAAO,UAAU,aAAa;AAAA,UAC9B,WAAW,WAAW,QAAQ,OAAO;AAAA,UACrC,UAAS;AAAA,UACT,UAAU;AAAA,UACV,WAAW;AAAA,YACT,WAAW,OAAO;AAAA,YAClB,WAAW,QAAQ,SAAS;AAAA,UAC9B;AAAA,UAEA,OAAO,UAAU,SAAY,EAAE,UAAU,UAAU;AAAA,UACnD,cAAY,UAAU,eAAe;AAAA,UACrC,IAAI,UAAU,UAAU;AAAA,UAEvB,oBACC,oBAAC,cAAc,QAAd,EAAqB,IAEtB;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA,iBAAiB,cAAc;AAAA,cAC/B,aAAa,WAAW,OAAO,YAAY;AAAA,cAC3C,mBAAmB;AAAA;AAAA,UACrB;AAAA;AAAA,MAEJ;AAAA,MACA,oBAAC,YAAY,cAAZ,EAAyB,WAAW,OAAO,cAC1C,8BAAC,SAAI,WAAW,OAAO,yBACrB,8BAAC,WAAQ,MAAM,sBACb;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,OAAO;AAAA,UAClB,iBAAc;AAAA,UACd,KAAK,cAAc;AAAA,UACnB,iBAAe;AAAA,UACf,cAAY;AAAA,UACZ,MAAK;AAAA,UACL,yBAAsB;AAAA,UACtB,sBAAmB;AAAA,UACnB,SAAS,MAAM;AACb,0CAA8B,IAAI;AAAA,UACpC;AAAA,UAEA,8BAAC,OAAO,QAAP,EACC,8BAAC,8BAA2B,GAC9B;AAAA;AAAA,MACF,GACF,GACF,GACF;AAAA,MACA,oBAAC,YAAY,SAAZ,EAAoB,UAAU,QAAQ,OAAO,UAC3C,uBACH;AAAA,OACF;AAAA,IACC,YACC;AAAA,MAAC;AAAA;AAAA,QACE,GAAG,QAAQ;AAAA,QACZ,KAAK,QAAQ;AAAA,QACb,WAAW,KAAK,OAAO,QAAQ,QAAQ,SAAS,SAAS;AAAA,QACzD,cAAY;AAAA,QACZ,aAAa,OAAO;AAAA,QACpB,WAAW,CAAC,OAAO,YAAY;AAC7B,wCAA8B,KAAK;AAAA,QACrC;AAAA,QACA,WAAU;AAAA,QACV,OAAM;AAAA,QAEN,+BAAC,SAAI,WAAW,OAAO,wBACrB;AAAA,8BAAC,SAAI,WAAW,OAAO,cACrB;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,EAAE,YAAY,OAAO;AAAA,cAC5B,KAAK,cAAc;AAAA,cACnB,cAAY;AAAA,cACZ,yBAAsB;AAAA,cACtB,SAAS,MAAM;AACb,8CAA8B,IAAI;AAAA,cACpC;AAAA,cAEA,8BAAC,OAAO,QAAP,EACC,8BAAC,aAAU,GACb;AAAA;AAAA,UACF,GACF;AAAA,UACA,oBAAC,SAAI,WAAW,OAAO,eACrB,8BAAC,cAAc,QAAd,EAAqB,GACxB;AAAA,WACF;AAAA;AAAA,IACF;AAAA,KAEJ;AAEJ;AASO,MAAM,gBAAgB;AAAA,EAC3B,WAA4C,CAAC,OAAO,QAAQ;AAC1D,UAAM,EAAE,WAAW,eAAe,SAAS,SAAS,GAAG,UAAU,IAAI;AAErE,UAAM,UAAU,MAAM;AACtB,UAAM,eAAe,OAAuB,IAAI;AAChD,UAAM,UAAU,aAAa,CAAC,KAAK,YAAY,CAAC;AAEhD,UAAM,kBAAkB,YAAY;AACpC,UAAM,gBAAgB,YAAY;AAElC,WACE,iCACE;AAAA,0BAAC,gBAAgB,QAAhB,EAAwB,kBAAQ,UAAS;AAAA,MACzC,WACC,oBAAC,cAAc,QAAd,EAAsB,kBAAQ,UAAS;AAAA,MAE1C;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ,KAAK;AAAA,UACL,WAAW,KAAK,OAAO,YAAY,aAAa;AAAA,UAE/C,oBACC;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACF,IAEA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK,QAAQ;AAAA,cACZ,GAAG,QAAQ;AAAA,cACZ,WAAW,KAAK,OAAO,SAAS,QAAQ,SAAS,SAAS;AAAA,cAE1D,8BAAC,gBAAgB,QAAhB,EAAuB;AAAA;AAAA,UAC1B;AAAA;AAAA,MAEJ;AAAA,OACF;AAAA,EAEJ,CAAC;AACH;AACA,cAAc,cAAc;",
-  "names": []
-}

package/esm/layouts/page-layout/sidebar-layout/SidebarLayout.sty.js

@@ -1,34 +0,0 @@
-import "../../../core/components/app-root/AppRoot.css";
-import "../../../core/styles/focusRingStatic.css";
-import "./SidebarLayout.css";
-var collapseButton = "_1mr4xg7e-3-13-3 _1mr4xg7d-3-13-3";
-var collapseButtonContainer = "_1mr4xg7b-3-13-3";
-var collapsedSidebar = "_1mr4xg74-3-13-3";
-var content = "_1mr4xg72-3-13-3";
-var drawer = "_1mr4xg76-3-13-3";
-var drawerContent = "_1mr4xg78-3-13-3";
-var drawerContentContainer = "_1mr4xg77-3-13-3";
-var drawerHeader = "_1mr4xg79-3-13-3";
-var expandButton = "_1mr4xg7f-3-13-3 _1mr4xg7d-3-13-3";
-var expandButtonContainer = "_1mr4xg7c-3-13-3";
-var hint = "_1mr4xg75-3-13-3 _z0fq9b4-3-13-3 _z0fq9bd-3-13-3 _z0fq9b6-3-13-3 _z0fq9bc-3-13-3";
-var layoutRoot = "_1mr4xg70-3-13-3";
-var panel = "_1mr4xg71-3-13-3";
-var resizeHandle = "_1mr4xg73-3-13-3";
-export {
-  collapseButton,
-  collapseButtonContainer,
-  collapsedSidebar,
-  content,
-  drawer,
-  drawerContent,
-  drawerContentContainer,
-  drawerHeader,
-  expandButton,
-  expandButtonContainer,
-  hint,
-  layoutRoot,
-  panel,
-  resizeHandle
-};
-//# sourceMappingURL=SidebarLayout.sty.js.map

package/esm/layouts/page-layout/sidebar-layout/SidebarLayout.sty.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/layouts/page-layout/sidebar-layout/SidebarLayout.css.ts"],
-  "sourcesContent": ["import '../../../core/components/app-root/AppRoot.css';\nimport '../../../core/styles/focusRingStatic.css';\nimport './SidebarLayout.css';\nexport var collapseButton = '_1mr4xg7e-3-13-3 _1mr4xg7d-3-13-3';\nexport var collapseButtonContainer = '_1mr4xg7b-3-13-3';\nexport var collapsedSidebar = '_1mr4xg74-3-13-3';\nexport var content = '_1mr4xg72-3-13-3';\nexport var drawer = '_1mr4xg76-3-13-3';\nexport var drawerContent = '_1mr4xg78-3-13-3';\nexport var drawerContentContainer = '_1mr4xg77-3-13-3';\nexport var drawerHeader = '_1mr4xg79-3-13-3';\nexport var expandButton = '_1mr4xg7f-3-13-3 _1mr4xg7d-3-13-3';\nexport var expandButtonContainer = '_1mr4xg7c-3-13-3';\nexport var hint = '_1mr4xg75-3-13-3 _z0fq9b4-3-13-3 _z0fq9bd-3-13-3 _z0fq9b6-3-13-3 _z0fq9bc-3-13-3';\nexport var layoutRoot = '_1mr4xg70-3-13-3';\nexport var panel = '_1mr4xg71-3-13-3';\nexport var resizeHandle = '_1mr4xg73-3-13-3';"],
-  "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACA,IAAI,iBAAiB;AACrB,IAAI,0BAA0B;AAC9B,IAAI,mBAAmB;AACvB,IAAI,UAAU;AACd,IAAI,SAAS;AACb,IAAI,gBAAgB;AACpB,IAAI,yBAAyB;AAC7B,IAAI,eAAe;AACnB,IAAI,eAAe;AACnB,IAAI,wBAAwB;AAC5B,IAAI,OAAO;AACX,IAAI,aAAa;AACjB,IAAI,QAAQ;AACZ,IAAI,eAAe;",
-  "names": []
-}

package/esm/layouts/page-layout/sidebar-layout/useFocusHandover.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/layouts/page-layout/sidebar-layout/useFocusHandover.ts"],
-  "sourcesContent": ["import { useCallback, useRef } from 'react';\n\ninterface PendingFocusTarget {\n  target: 'collapse' | 'expand';\n}\n\n/** @internal */\nexport function useButtonFocusHandover() {\n  const pendingTarget = useRef<PendingFocusTarget | null>(null);\n\n  const setTarget = useCallback((target: 'collapse' | 'expand') => {\n    pendingTarget.current = { target };\n  }, []);\n\n  const collapseButtonRef = useCallback((node: HTMLButtonElement | null) => {\n    if (node && pendingTarget.current?.target === 'collapse') {\n      node.focus();\n      pendingTarget.current = null;\n    }\n  }, []);\n\n  const expandButtonRef = useCallback((node: HTMLButtonElement | null) => {\n    if (node && pendingTarget.current?.target === 'expand') {\n      node.focus();\n      pendingTarget.current = null;\n    }\n  }, []);\n\n  return {\n    setTarget,\n    collapseButtonRef,\n    expandButtonRef,\n  };\n}\n"],
-  "mappings": "AAAA,SAAS,aAAa,cAAc;AAO7B,SAAS,yBAAyB;AACvC,QAAM,gBAAgB,OAAkC,IAAI;AAE5D,QAAM,YAAY,YAAY,CAAC,WAAkC;AAC/D,kBAAc,UAAU,EAAE,OAAO;AAAA,EACnC,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAoB,YAAY,CAAC,SAAmC;AACxE,QAAI,QAAQ,cAAc,SAAS,WAAW,YAAY;AACxD,WAAK,MAAM;AACX,oBAAc,UAAU;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,kBAAkB,YAAY,CAAC,SAAmC;AACtE,QAAI,QAAQ,cAAc,SAAS,WAAW,UAAU;AACtD,WAAK,MAAM;AACX,oBAAc,UAAU;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
-  "names": []
-}

package/esm/layouts/page-layout/sidebar-layout/useLayoutState.js

@@ -1,35 +0,0 @@
-import { useBreakpointCollapse } from "../shared/useBreakpointCollapse.js";
-function useLayoutState({
-  sidebar,
-  containerRef
-}) {
-  const { containerWidth, collapsed, setCollapsed, isBelowBreakpoint } = useBreakpointCollapse({
-    collapsed: {
-      value: sidebar.config.collapsed,
-      defaultValue: sidebar.config.defaultCollapsed ?? false,
-      onChange: sidebar.config.onCollapsedChange
-    },
-    breakpoint: sidebar.config.breakpoint,
-    containerRef,
-    onBreakpointTransition: sidebar.config.onBreakpointTransition,
-    autoCollapse: true
-  });
-  let mode = "split";
-  if (collapsed) {
-    mode = "collapsed";
-  }
-  if (isBelowBreakpoint) {
-    mode = "drawer";
-  }
-  return {
-    collapsed,
-    containerWidth,
-    isBelowBreakpoint,
-    mode,
-    setCollapsed
-  };
-}
-export {
-  useLayoutState
-};
-//# sourceMappingURL=useLayoutState.js.map

package/esm/layouts/page-layout/sidebar-layout/useLayoutState.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/layouts/page-layout/sidebar-layout/useLayoutState.ts"],
-  "sourcesContent": ["import { type RefObject } from 'react';\n\nimport type { ExtractedSidebarSlot } from './slots.js';\nimport { useBreakpointCollapse } from '../shared/useBreakpointCollapse.js';\n\ntype RenderedLayout = 'split' | 'collapsed' | 'drawer';\n\nexport function useLayoutState({\n  sidebar,\n  containerRef,\n}: {\n  sidebar: ExtractedSidebarSlot;\n  containerRef: RefObject<HTMLDivElement | null>;\n}) {\n  const { containerWidth, collapsed, setCollapsed, isBelowBreakpoint } =\n    useBreakpointCollapse({\n      collapsed: {\n        value: sidebar.config.collapsed,\n        defaultValue: sidebar.config.defaultCollapsed ?? false,\n        onChange: sidebar.config.onCollapsedChange,\n      },\n      breakpoint: sidebar.config.breakpoint,\n      containerRef,\n      onBreakpointTransition: sidebar.config.onBreakpointTransition,\n      autoCollapse: true,\n    });\n\n  let mode: RenderedLayout = 'split';\n  if (collapsed) {\n    mode = 'collapsed';\n  }\n  if (isBelowBreakpoint) {\n    mode = 'drawer';\n  }\n\n  return {\n    collapsed,\n    containerWidth,\n    isBelowBreakpoint,\n    mode,\n    setCollapsed,\n  };\n}\n"],
-  "mappings": "AAGA,SAAS,6BAA6B;AAI/B,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AACF,GAGG;AACD,QAAM,EAAE,gBAAgB,WAAW,cAAc,kBAAkB,IACjE,sBAAsB;AAAA,IACpB,WAAW;AAAA,MACT,OAAO,QAAQ,OAAO;AAAA,MACtB,cAAc,QAAQ,OAAO,oBAAoB;AAAA,MACjD,UAAU,QAAQ,OAAO;AAAA,IAC3B;AAAA,IACA,YAAY,QAAQ,OAAO;AAAA,IAC3B;AAAA,IACA,wBAAwB,QAAQ,OAAO;AAAA,IACvC,cAAc;AAAA,EAChB,CAAC;AAEH,MAAI,OAAuB;AAC3B,MAAI,WAAW;AACb,WAAO;AAAA,EACT;AACA,MAAI,mBAAmB;AACrB,WAAO;AAAA,EACT;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
-  "names": []
-}

package/esm/layouts/shared/resize-handle-styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/layouts/shared/resize-handle-styles.ts"],
-  "sourcesContent": ["import type { StyleRule } from '@vanilla-extract/css';\n\nimport Borders from '@dynatrace/strato-design-tokens/borders';\nimport Colors from '@dynatrace/strato-design-tokens/colors';\nimport Easings from '@dynatrace/strato-design-tokens/easings';\nimport Spacings from '@dynatrace/strato-design-tokens/spacings';\nimport Timings from '@dynatrace/strato-design-tokens/timings';\n\nimport { vrResizeHandleOverrides } from './visual-refresh-overrides.js';\n\nexport const resizeHandleStyles = {\n  backgroundColor: Colors.Border.Neutral.Accent,\n  border: 'none',\n  borderRadius: Borders.Radius.Field.Default,\n  cursor: 'col-resize',\n  height: Spacings.Size36,\n  left: '3px',\n  margin: 0,\n  padding: 0,\n  touchAction: 'none',\n  transition: `height ${Timings.Base.Default} ${Easings.FastInSlowOut}`,\n  width: '2px',\n  selectors: {\n    '&:focus-visible': {\n      width: '100%',\n    },\n    // If we click the handle we don't want to apply the extra handling for the boxShadow\n    '&:hover&:focus-visible': {\n      width: '2px',\n    },\n    '&:focus-visible, &:hover': {\n      height: Spacings.Size48,\n      backgroundColor: Colors.Border.Neutral.AccentHover,\n    },\n    // The resizing ref is applied to the actual handle to manage the focus state by the ref.\n    // However, this would make only the handle resizable and not the whole separator, hence the after element.\n    '&:after': {\n      content: '\"\"',\n      display: 'block',\n      height: '100%',\n      left: '50%',\n      position: 'absolute',\n      top: 0,\n      transform: 'translateX(-50%)',\n      userSelect: 'none',\n      width: '100%',\n    },\n    ...vrResizeHandleOverrides,\n  },\n} satisfies StyleRule;\n"],
-  "mappings": "AAEA,OAAO,aAAa;AACpB,OAAO,YAAY;AACnB,OAAO,aAAa;AACpB,OAAO,cAAc;AACrB,OAAO,aAAa;AAEpB,SAAS,+BAA+B;AAEjC,MAAM,qBAAqB;AAAA,EAChC,iBAAiB,OAAO,OAAO,QAAQ;AAAA,EACvC,QAAQ;AAAA,EACR,cAAc,QAAQ,OAAO,MAAM;AAAA,EACnC,QAAQ;AAAA,EACR,QAAQ,SAAS;AAAA,EACjB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,aAAa;AAAA,EACb,YAAY,UAAU,QAAQ,KAAK,OAAO,IAAI,QAAQ,aAAa;AAAA,EACnE,OAAO;AAAA,EACP,WAAW;AAAA,IACT,mBAAmB;AAAA,MACjB,OAAO;AAAA,IACT;AAAA;AAAA,IAEA,0BAA0B;AAAA,MACxB,OAAO;AAAA,IACT;AAAA,IACA,4BAA4B;AAAA,MAC1B,QAAQ,SAAS;AAAA,MACjB,iBAAiB,OAAO,OAAO,QAAQ;AAAA,IACzC;AAAA;AAAA;AAAA,IAGA,WAAW;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,UAAU;AAAA,MACV,KAAK;AAAA,MACL,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,OAAO;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
-  "names": []
-}

package/esm/layouts/split-layout/split-sizing-utils.js

@@ -1,45 +0,0 @@
-import {
-  clamp,
-  resolveWidthPx,
-  toCssLength
-} from "./width-utils.js";
-function clampPanelWidth(split, containerWidth, config) {
-  const { panelMin, panelMax, contentMin, handleWidth } = config;
-  const minPx = resolveWidthPx(panelMin, containerWidth, 0);
-  const maxPx = resolveWidthPx(panelMax, containerWidth, Infinity);
-  const contentMinPx = resolveWidthPx(contentMin, containerWidth, 0);
-  let extrinsicMax = Infinity;
-  if (containerWidth !== 0) {
-    extrinsicMax = containerWidth - contentMinPx - handleWidth;
-  }
-  const finalMax = Math.max(minPx, Math.min(maxPx, extrinsicMax));
-  return clamp(minPx, split, finalMax);
-}
-function computeLayout(splitPx, containerWidth, config) {
-  const { panelMin, panelMax, contentMin, handleWidth } = config;
-  const panelWidth = clampPanelWidth(splitPx, containerWidth, config);
-  const panelMinPx = resolveWidthPx(panelMin, containerWidth, 0);
-  const panelMaxPx = resolveWidthPx(panelMax, containerWidth, Infinity);
-  const contentMinPx = resolveWidthPx(contentMin, containerWidth, 0);
-  const contentMaxPx = Math.max(0, containerWidth - contentMinPx - handleWidth);
-  const contentWidth = clamp(
-    contentMinPx,
-    containerWidth - handleWidth - panelWidth,
-    contentMaxPx
-  );
-  const contentWidthCss = `max(${toCssLength(contentMin)}, 100% - ${panelWidth ? panelWidth + handleWidth : 0}px)`;
-  return {
-    panel: { width: panelWidth, minPx: panelMinPx, maxPx: panelMaxPx },
-    content: {
-      width: contentWidth,
-      widthCss: contentWidthCss,
-      minPx: contentMinPx,
-      maxPx: contentMaxPx
-    }
-  };
-}
-export {
-  clampPanelWidth,
-  computeLayout
-};
-//# sourceMappingURL=split-sizing-utils.js.map

package/esm/layouts/split-layout/split-sizing-utils.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/layouts/split-layout/split-sizing-utils.ts"],
-  "sourcesContent": ["import {\n  clamp,\n  resolveWidthPx,\n  toCssLength,\n  type PanelWidth,\n} from './width-utils.js';\n\ninterface SizingConfig {\n  panelMin: PanelWidth;\n  panelMax: PanelWidth;\n  contentMin: PanelWidth;\n  handleWidth: number;\n}\n\ninterface LayoutValues {\n  panel: { width: number; minPx: number; maxPx: number };\n  content: { width: number; widthCss: string; minPx: number; maxPx: number };\n}\n\n/** @internal */\nexport function clampPanelWidth(\n  split: number,\n  containerWidth: number,\n  config: SizingConfig,\n): number {\n  const { panelMin, panelMax, contentMin, handleWidth } = config;\n\n  const minPx = resolveWidthPx(panelMin, containerWidth, 0);\n  const maxPx = resolveWidthPx(panelMax, containerWidth, Infinity);\n  const contentMinPx = resolveWidthPx(contentMin, containerWidth, 0);\n\n  let extrinsicMax = Infinity;\n  if (containerWidth !== 0) {\n    extrinsicMax = containerWidth - contentMinPx - handleWidth;\n  }\n\n  const finalMax = Math.max(minPx, Math.min(maxPx, extrinsicMax));\n  return clamp(minPx, split, finalMax);\n}\n\n/** @internal */\nexport function computeLayout(\n  splitPx: number,\n  containerWidth: number,\n  config: SizingConfig,\n): LayoutValues {\n  const { panelMin, panelMax, contentMin, handleWidth } = config;\n\n  const panelWidth = clampPanelWidth(splitPx, containerWidth, config);\n\n  const panelMinPx = resolveWidthPx(panelMin, containerWidth, 0);\n  const panelMaxPx = resolveWidthPx(panelMax, containerWidth, Infinity);\n\n  const contentMinPx = resolveWidthPx(contentMin, containerWidth, 0);\n  const contentMaxPx = Math.max(0, containerWidth - contentMinPx - handleWidth);\n  const contentWidth = clamp(\n    contentMinPx,\n    containerWidth - handleWidth - panelWidth,\n    contentMaxPx,\n  );\n\n  const contentWidthCss = `max(${toCssLength(contentMin)}, 100% - ${\n    panelWidth ? panelWidth + handleWidth : 0\n  }px)`;\n\n  return {\n    panel: { width: panelWidth, minPx: panelMinPx, maxPx: panelMaxPx },\n    content: {\n      width: contentWidth,\n      widthCss: contentWidthCss,\n      minPx: contentMinPx,\n      maxPx: contentMaxPx,\n    },\n  };\n}\n"],
-  "mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAeA,SAAS,gBACd,OACA,gBACA,QACQ;AACR,QAAM,EAAE,UAAU,UAAU,YAAY,YAAY,IAAI;AAExD,QAAM,QAAQ,eAAe,UAAU,gBAAgB,CAAC;AACxD,QAAM,QAAQ,eAAe,UAAU,gBAAgB,QAAQ;AAC/D,QAAM,eAAe,eAAe,YAAY,gBAAgB,CAAC;AAEjE,MAAI,eAAe;AACnB,MAAI,mBAAmB,GAAG;AACxB,mBAAe,iBAAiB,eAAe;AAAA,EACjD;AAEA,QAAM,WAAW,KAAK,IAAI,OAAO,KAAK,IAAI,OAAO,YAAY,CAAC;AAC9D,SAAO,MAAM,OAAO,OAAO,QAAQ;AACrC;AAGO,SAAS,cACd,SACA,gBACA,QACc;AACd,QAAM,EAAE,UAAU,UAAU,YAAY,YAAY,IAAI;AAExD,QAAM,aAAa,gBAAgB,SAAS,gBAAgB,MAAM;AAElE,QAAM,aAAa,eAAe,UAAU,gBAAgB,CAAC;AAC7D,QAAM,aAAa,eAAe,UAAU,gBAAgB,QAAQ;AAEpE,QAAM,eAAe,eAAe,YAAY,gBAAgB,CAAC;AACjE,QAAM,eAAe,KAAK,IAAI,GAAG,iBAAiB,eAAe,WAAW;AAC5E,QAAM,eAAe;AAAA,IACnB;AAAA,IACA,iBAAiB,cAAc;AAAA,IAC/B;AAAA,EACF;AAEA,QAAM,kBAAkB,OAAO,YAAY,UAAU,CAAC,YACpD,aAAa,aAAa,cAAc,CAC1C;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,OAAO,YAAY,OAAO,YAAY,OAAO,WAAW;AAAA,IACjE,SAAS;AAAA,MACP,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OAAO;AAAA,MACP,OAAO;AAAA,IACT;AAAA,EACF;AACF;",
-  "names": []
-}

package/layouts/page-layout/details-layout/DetailsLayout.css

@@ -1,34 +0,0 @@
-._1377n3n0-3-13-3 {
-  height: 100%;
-  overflow: hidden;
-  position: relative;
-  background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
-}
-._1377n3n1-3-13-3 {
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  height: 100%;
-  overflow-y: auto;
-  position: relative;
-  padding: var(--dt-spacings-size-16, 16px);
-  background-color: var(--dt-colors-background-base-default, #f9f9fa);
-  border-top-left-radius: var(--dt-borders-radius-surface-default, 12px);
-}
-._1jgl8s50-3-13-3 ._1377n3n1-3-13-3 {
-  border-top-left-radius: 0;
-}
-._1377n3n2-3-13-3 {
-  box-sizing: border-box;
-  height: 100%;
-  overflow-y: auto;
-}
-._1377n3n3-3-13-3 {
-  box-sizing: border-box;
-  padding: 0;
-}
-._1377n3n4-3-13-3 {
-  box-sizing: border-box;
-  padding: var(--dt-spacings-size-16, 16px);
-  height: 100%;
-}

package/layouts/page-layout/details-layout/DetailsLayout.css.d.ts

@@ -1,6 +0,0 @@
-export declare const layoutRoot: string;
-export declare const panel: string;
-export declare const content: string;
-export declare const drawer: string;
-export declare const drawerContent: string;
-//# sourceMappingURL=DetailsLayout.css.d.ts.map

package/layouts/page-layout/details-layout/DetailsLayout.d.ts

@@ -1,13 +0,0 @@
-import { type ComponentPropsWithoutRef } from 'react';
-import { type ExtractedContentSlot, type ExtractedDetailsSlot } from './slots.js';
-/** @internal */
-export type LayoutRootProps = {
-    details: ExtractedDetailsSlot | null;
-    content: ExtractedContentSlot;
-} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'content'>;
-/** @internal */
-export declare const DetailsLayout: import("react").MemoExoticComponent<(props: {
-    details: ExtractedDetailsSlot | null;
-    content: ExtractedContentSlot;
-} & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "children" | "content"> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null>;
-//# sourceMappingURL=DetailsLayout.d.ts.map