@amboss/design-system 4.9.4-canary.4 → 4.10.0

package/build/cjs/components/CheckboxCard/CheckboxCard.d.ts

@@ -15,4 +15,4 @@ export declare const CheckboxCard: React.ForwardRefExoticComponent<{
     renderContent?: (params: {
         isSelected: boolean;
     }) => React.ReactNode;
-} & Omit<CheckboxProps, "errorMessages" | "hint" | "hideLabel" | "indeterminate"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<CheckboxProps, "errorMessages" | "hideLabel" | "hint" | "indeterminate"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Content/ContentCheckbox/ContentCheckbox.d.ts

@@ -16,4 +16,4 @@ export declare const ContentCheckbox: React.ForwardRefExoticComponent<{
     /** Adds extra spacing around the checkbox to accomodate a label with larger line height */
     isSpacedOut?: boolean;
     "data-e2e-test-id"?: string;
-} & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Content/ContentCitation/ContentCitation.d.ts

@@ -20,7 +20,7 @@ export type ContentCitationProps = {
  */
 export declare function ContentCitation({ children, color, isSpacedOut, as, "data-e2e-test-id": dataE2eTestId, }: ContentCitationProps): React.ReactElement;
 export declare namespace ContentCitation {
-    var Title: typeof ContentCitationTitle;
-    var Link: typeof ContentCitationLink;
-    var LookupLink: typeof ContentCitationLookupLink;
+    export { ContentCitationTitle as Title };
+    export { ContentCitationLink as Link };
+    export { ContentCitationLookupLink as LookupLink };
 }

package/build/cjs/components/Content/ContentFontResizer/FontSizeOffsetContext.d.ts

@@ -1,2 +1,2 @@
 export type FontSizeOffset = number;
-export declare const FontSizeOffsetContext: React.Context<number>;
+export declare const FontSizeOffsetContext: import("react").Context<number>;

package/build/cjs/components/Content/ContentText/ContentText.d.ts

@@ -7,6 +7,6 @@ export type ContentTextProps = TypographyTextProps & {
     /** Provides additional line-height */
     isSpacedOut?: boolean;
 };
-export declare const ContentTextContext: React.Context<Pick<ContentTextProps, "color" | "size" | "weight" | "isSpacedOut"> | null>;
+export declare const ContentTextContext: React.Context<Pick<ContentTextProps, "color" | "isSpacedOut" | "size" | "weight"> | null>;
 export declare const CONTENT_TEXT_LINE_HEIGHT_OFFSET = 0.14;
 export declare function ContentText({ size, color, weight, isSpacedOut, children, ...rest }: ContentTextProps): React.ReactElement;

package/build/cjs/components/Content/DosageButton/DosageButton.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 export type DosageButtonProps = React.ComponentPropsWithRef<"button">;
 export declare const DosageButton: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLButtonElement> | null | undefined;
+    ref?: React.RefObject<HTMLButtonElement> | ((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null | undefined;
 }, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/build/cjs/components/DataTable/DataTable.d.ts

@@ -1,6 +1,7 @@
 import type { ReactElement, ReactNode } from "react";
 import type { MQ } from "../../types";
 import type { DataTableColumn, DataTableColumnOrGroup, DataTableRow, DataTableRowProps, DataTableSlotProps } from "./types";
+import { defaultSortCompareFn } from "./useDataTableSort";
 import { DataTableToolbar } from "./DataTableToolbar/DataTableToolbar";
 type DataTablePropsBase = {
     /** Screen reader text for table caption */
@@ -143,7 +144,7 @@ export type DataTableProps = DataTablePropsBase & (DataTableSelectableProps | Da
 export declare function BaseDataTable({ caption, columns, rows, footer, currentlySortedByColumn, isFirstColumnSticky, isLastColumnSticky, "data-e2e-test-id": dataE2eTestId, isLoading, loadingStateScreenReaderText, isEmpty, slotProps, children, emptyTableContentHeight, layout, width, bodyCellVerticalPadding, emptyCellContent, maxHeight, isSelectable, selectedRowIds, allRowsSelected, selectAllRowsCheckboxAriaLabel, getRowProps, onRowSelectionChange, onAllRowsSelectionChange, isExpandable, expandedRowIds: expandedRowIdsProp, onRowExpansionChange, expandRowAriaLabel, collapseRowAriaLabel, onSort, ...ariaAttributes }: DataTableProps): ReactElement;
 export declare function DataTable({ children, ...rest }: DataTableProps): ReactElement;
 export declare namespace DataTable {
-    var sortCompareFn: (a: DataTableRow, b: DataTableRow, columnName: DataTableColumn["name"], desiredSortDirection: DataTableColumn["sortDirection"]) => number;
-    var Toolbar: typeof DataTableToolbar;
+    export { defaultSortCompareFn as sortCompareFn };
+    export { DataTableToolbar as Toolbar };
 }
 export {};

package/build/cjs/components/DataTable/TableCell.d.ts

@@ -17,5 +17,5 @@ declare const TableCell: import("@emotion/styled").StyledComponent<{
     isTableScrolledToLeft: boolean;
     isTableScrolledToRight: boolean;
     sticky?: "left" | "right" | false;
-} & Pick<DataTableRowProps, "isActive">, React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {}>;
+} & Pick<DataTableRowProps, "isActive">, import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {}>;
 export default TableCell;

package/build/cjs/components/DataTable/internal/tablePrimitives.d.ts

@@ -10,14 +10,14 @@ type StyledTrProps = {
 export declare const StyledTr: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & StyledTrProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, {}>;
+} & StyledTrProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, {}>;
 type StyledTextProps = {
     alignColumn?: DataTableColumn["align"];
 };
 export declare const StyledText: import("@emotion/styled").StyledComponent<Omit<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & import("../../Typography/Text/Text").BaseTextProps & React.ClassAttributes<HTMLParagraphElement> & React.HTMLAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement> & {
+} & import("../../Typography/Text/Text").BaseTextProps & import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement> & {
     theme?: import("@emotion/react").Theme;
 } & StyledTextProps, {}, {}>;
 export declare const StyledTd: import("@emotion/styled").StyledComponent<{
@@ -30,7 +30,7 @@ export declare const StyledTd: import("@emotion/styled").StyledComponent<{
     isTableScrolledToLeft: boolean;
     isTableScrolledToRight: boolean;
     sticky?: "left" | "right" | false;
-} & Pick<import("../types").DataTableRowProps, "isActive"> & React.ClassAttributes<HTMLTableDataCellElement> & React.TdHTMLAttributes<HTMLTableDataCellElement> & {
+} & Pick<import("../types").DataTableRowProps, "isActive"> & import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & {
     theme?: import("@emotion/react").Theme;
 } & {
     bodyCellVerticalPadding?: DataTableProps["bodyCellVerticalPadding"];

package/build/cjs/components/EntityList/styled-components.d.ts

@@ -3,38 +3,38 @@ import type { EntityListItemProps, EntityListItemWrapperProps } from "./types";
 import type { ListSize } from "../../types";
 export declare const getOffsetMqStyle: (cssProp: string, { theme, size, }: {
     theme: Theme;
-} & Partial<EntityListItemWrapperProps>) => Record<string, (string | number) | {
+} & Partial<EntityListItemWrapperProps>) => Record<string, {
     [x: string]: string | number;
-}>;
+} | (string | number)>;
 export declare const StyledList: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
 } & {
     size: ListSize;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledEntityItem: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledShowMore: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledWrapperOffset: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
 } & {
     size: ListSize;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledEntityListItemWrapper: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
 } & {
     size: ListSize;
-} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     theme?: Theme;
 } & EntityListItemWrapperProps, {}, {}>;
 export declare const StyledEntityListItemButton: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
-} & Partial<EntityListItemProps>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<EntityListItemProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/cjs/components/Form/Checkbox/Checkbox.d.ts

@@ -35,11 +35,11 @@ export declare const CheckboxRaw: React.ForwardRefExoticComponent<{
     label?: string | React.ReactElement;
     indeterminate?: boolean;
     size?: CheckboxSizes;
-} & Omit<FormFieldProps, "label" | "hideLabel"> & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+} & Omit<FormFieldProps, "hideLabel" | "label"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     labelSize?: CheckboxSizes;
 } & React.RefAttributes<HTMLInputElement>>;
 export declare const Checkbox: React.ForwardRefExoticComponent<{
     label?: string | React.ReactElement;
     indeterminate?: boolean;
     size?: CheckboxSizes;
-} & Omit<FormFieldProps, "label" | "hideLabel"> & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<FormFieldProps, "hideLabel" | "label"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Form/Combobox/StyledSelectComponents.d.ts

@@ -1,7 +1,7 @@
 export declare const StyledContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 type StyledOptionProps = {
     active: boolean;
     preSelected: boolean;
@@ -10,13 +10,13 @@ type StyledOptionProps = {
 export declare const StyledOption: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & StyledOptionProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & StyledOptionProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledFakeInputWrap: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledDropdown: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/build/cjs/components/Form/DatePicker/DatePicker.d.ts

@@ -27,7 +27,7 @@ export declare const DatePicker: React.ForwardRefExoticComponent<{
             formatAriaLabel: (monthName: string, year: number) => string;
         };
     };
-} & import("../FormField/FormField").FormFieldProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "type" | "onChange"> & {
+} & import("../FormField/FormField").FormFieldProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "type" | "value"> & {
     value?: string;
     hasError?: boolean;
 } & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Form/MaskedInput/MaskedInput.d.ts

@@ -20,4 +20,4 @@ export declare const MaskedInput: React.ForwardRefExoticComponent<{
     maskOptions: FactoryArg;
     onAccept?: (value: string, unmaskedValue: string, typedValue: string) => void;
     onComplete?: (value: string, unmaskedValue: string, typedValue: string) => void;
-} & Omit<InputProps, "type" | "onChange" | "size"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<InputProps, "onChange" | "size" | "type"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Form/Radio/Radio.d.ts

@@ -18,7 +18,7 @@ export declare const RadioRaw: React.ForwardRefExoticComponent<{
     /** Display hint below the label specific for the radio */
     labelHint?: string | React.ReactElement;
     size?: RadioSizes;
-} & Omit<FormFieldProps, "label" | "labelHint" | "hideLabel"> & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+} & Omit<FormFieldProps, "hideLabel" | "label" | "labelHint"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     labelSize?: RadioSizes;
 } & React.RefAttributes<HTMLInputElement>>;
 export declare const Radio: React.ForwardRefExoticComponent<{
@@ -26,5 +26,5 @@ export declare const Radio: React.ForwardRefExoticComponent<{
     /** Display hint below the label specific for the radio */
     labelHint?: string | React.ReactElement;
     size?: RadioSizes;
-} & Omit<FormFieldProps, "label" | "labelHint" | "hideLabel"> & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<FormFieldProps, "hideLabel" | "label" | "labelHint"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & React.RefAttributes<HTMLInputElement>>;
 export {};

package/build/cjs/components/Form/RangeInput/RangeInput.d.ts

@@ -9,4 +9,4 @@ export declare const RangeInput: React.ForwardRefExoticComponent<{
     /** The step size for each change in the range input's value. */
     hasError?: boolean;
     onSlideStart?: (e: React.FormEvent<HTMLInputElement>) => void;
-} & FormFieldProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & React.RefAttributes<HTMLInputElement>>;
+} & FormFieldProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Form/Textarea/Textarea.d.ts

@@ -14,12 +14,12 @@ export declare const TextareaRaw: React.ForwardRefExoticComponent<{
      */
     hasError?: boolean;
     resize?: "none" | "horizontal" | "vertical" | "both";
-} & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
+} & TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
 export declare const Textarea: React.ForwardRefExoticComponent<FormFieldProps & {
     /**
      * Set to true to toggle error state
      */
     hasError?: boolean;
     resize?: "none" | "horizontal" | "vertical" | "both";
-} & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
+} & TextareaHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>>;
 export {};

package/build/cjs/components/Form/Toggle/Toggle.d.ts

@@ -9,7 +9,7 @@ type ToggleRawProps = {
 export declare const ToggleRaw: React.ForwardRefExoticComponent<{
     size?: ToggleSize;
     isHighlighted?: boolean;
-} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & React.RefAttributes<HTMLInputElement>>;
 export type ToggleProps = ToggleRawProps & {
     /** Controls label alignment with respect to toggle */
     alignLabel?: "before" | "after";
@@ -20,11 +20,11 @@ export type ToggleProps = ToggleRawProps & {
 export declare const Toggle: React.ForwardRefExoticComponent<{
     size?: ToggleSize;
     isHighlighted?: boolean;
-} & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     /** Controls label alignment with respect to toggle */
     alignLabel?: "before" | "after";
     /** Display hint below the label specific for the toggle */
     labelHint?: string | React.ReactElement;
     alignItems?: InlineProps["alignItems"];
-} & Omit<FormFieldProps, "labelHint" | "hideLabel"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<FormFieldProps, "hideLabel" | "labelHint"> & React.RefAttributes<HTMLInputElement>>;
 export {};

package/build/cjs/components/Form/ToggleButton/ToggleButton.d.ts

@@ -7,4 +7,4 @@ export type ToggleButtonProps = {
 export declare const ToggleButton: React.ForwardRefExoticComponent<{
     label: string;
     subLabel?: string;
-} & Omit<FormFieldProps, "label" | "labelHint" | "errorMessages" | "hint" | "hideLabel"> & Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & React.RefAttributes<HTMLInputElement>>;
+} & Omit<FormFieldProps, "errorMessages" | "hideLabel" | "hint" | "label" | "labelHint"> & Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/Grid/Grid.d.ts

@@ -32,5 +32,5 @@ export type GridProps = {
 } & HTMLAttributes<HTMLDivElement>;
 export declare function Grid({ columnGap, rowGap, "data-e2e-test-id": dataE2eTestId, children, ...rest }: GridProps): React.ReactElement;
 export declare namespace Grid {
-    var Item: typeof GridItem;
+    export { GridItem as Item };
 }

package/build/cjs/components/Internal/Drawer/Drawer.js

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Drawer",{enumerable:!0,get:function(){return Drawer}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_useOutsideClickDeactivatesWithinPortal=require("../../../shared/useOutsideClickDeactivatesWithinPortal"),_useDocument=require("../../../shared/useDocument"),_focusableSelector=require("../../../shared/focusableSelector"),_Portal=require("../../Portal/Portal"),_FocusTrapWrapper=require("../../../shared/FocusTrapWrapper"),_DialogContext=require("../../Patterns/Dialog/DialogContext"),_Backdrop=require("../../Utilities/Backdrop/Backdrop"),_useExitAnimation=require("./useExitAnimation"),StyledViewportLayer=(0,_styled.default)("div",{target:"e11o9pe90",label:"StyledViewportLayer"})(({theme,isLeaving})=>{let{hidden,visible}=theme.variables.opacity,fadeIn=(0,_react1.keyframes)`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Drawer",{enumerable:!0,get:function(){return Drawer}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_react1=require("@emotion/react"),_useOutsideClickDeactivatesWithinPortal=require("../../../shared/useOutsideClickDeactivatesWithinPortal"),_useDocument=require("../../../shared/useDocument"),_focusableSelector=require("../../../shared/focusableSelector"),_Portal=require("../../Portal/Portal"),_FocusTrapWrapper=require("../../../shared/FocusTrapWrapper"),_DialogContext=require("../../Patterns/Dialog/DialogContext"),_Backdrop=require("../../Utilities/Backdrop/Backdrop"),_useExitAnimation=require("../../../shared/useExitAnimation"),StyledViewportLayer=(0,_styled.default)("div",{target:"e1h3k5750",label:"StyledViewportLayer"})(({theme,isLeaving})=>{let{hidden,visible}=theme.variables.opacity,fadeIn=(0,_react1.keyframes)`
       from { opacity: ${hidden}; }
       to { opacity: ${visible}; }
     `,fadeOut=(0,_react1.keyframes)`
       from { opacity: ${visible}; }
       to { opacity: ${hidden}; }
-    `,{duration,timingFunction}=theme.variables.animation.modalBackdrop.open;return{position:"fixed",top:0,left:0,zIndex:theme.variables.zIndex.modal,width:"100%",height:"100dvh",animation:`${isLeaving?fadeOut:fadeIn} ${duration} ${timingFunction} both`,"@media (prefers-reduced-motion: reduce)":{animation:"none"}}}),StyledContent=(0,_styled.default)("div",{target:"e11o9pe91",label:"StyledContent"})(({theme,positionX,positionY,isLeaving})=>{let restX=positionX?"0%":"-50%",restY=positionY?"0%":"-50%",{x:fromX,y:fromY}="left"===positionX?{x:"-100%",y:restY}:"right"===positionX?{x:"100%",y:restY}:"top"===positionY?{x:restX,y:"-100%"}:"bottom"===positionY?{x:restX,y:"100%"}:{x:restX,y:restY},resting=`translate(${restX}, ${restY})`,offscreen=`translate(${fromX}, ${fromY})`,slideIn=(0,_react1.keyframes)`
+    `,{duration,timingFunction}=theme.variables.animation.modalBackdrop.open;return{position:"fixed",top:0,left:0,zIndex:theme.variables.zIndex.modal,width:"100%",height:"100dvh",animation:`${isLeaving?fadeOut:fadeIn} ${duration} ${timingFunction} both`,"@media (prefers-reduced-motion: reduce)":{animation:"none"}}}),StyledContent=(0,_styled.default)("div",{target:"e1h3k5751",label:"StyledContent"})(({theme,positionX,positionY,isLeaving})=>{let restX=positionX?"0%":"-50%",restY=positionY?"0%":"-50%",{x:fromX,y:fromY}="left"===positionX?{x:"-100%",y:restY}:"right"===positionX?{x:"100%",y:restY}:"top"===positionY?{x:restX,y:"-100%"}:"bottom"===positionY?{x:restX,y:"100%"}:{x:restX,y:restY},resting=`translate(${restX}, ${restY})`,offscreen=`translate(${fromX}, ${fromY})`,slideIn=(0,_react1.keyframes)`
       from { transform: ${offscreen}; }
       to { transform: ${resting}; }
     `,slideOut=(0,_react1.keyframes)`
       from { transform: ${resting}; }
       to { transform: ${offscreen}; }
-    `,{duration,timingFunction}=theme.variables.animation.navSlide.open;return{position:"fixed",...{..."left"===positionX&&{left:0},..."right"===positionX&&{right:0},...!positionX&&{left:"50%"},..."top"===positionY&&{top:0},..."bottom"===positionY&&{bottom:0},...!positionY&&{top:"50%"}},transform:resting,willChange:"transform",animation:`${isLeaving?slideOut:slideIn} ${duration} ${timingFunction} both`,"@media (prefers-reduced-motion: reduce)":{animation:"none"}}}),StyledBackdrop=(0,_styled.default)(_Backdrop.Backdrop,{target:"e11o9pe92",label:"StyledBackdrop"})({pointerEvents:"none"});function getFocusTarget(container,document){return container?.querySelector(_focusableSelector.FOCUSABLE_SELECTOR)??container??document.body}function Drawer({backdropRef,portalContainer,initialFocus,isDismissible=!0,isVisible=!0,onUnmount,hasBackdrop=!0,positionX,positionY,children,handleClose,privateProps:{skipPortal}={skipPortal:!1},...rest}){let portalContainerElement=(0,_Portal.usePortalContainerElement)(portalContainer),contentRef=(0,_react.useRef)(null),document=(0,_useDocument.useDocument)(),{isMounted,isLeaving,onAnimationEnd}=(0,_useExitAnimation.useExitAnimation)(isVisible),wasMounted=(0,_react.useRef)(isMounted);(0,_react.useEffect)(()=>{wasMounted.current&&!isMounted&&onUnmount?.(),wasMounted.current=isMounted},[isMounted,onUnmount]);let layerRef=(0,_react.useRef)(null),setLayerNode=(0,_react.useCallback)(node=>{layerRef.current=node,backdropRef&&(backdropRef.current=node)},[backdropRef]),handleClickOutsideDeactivates=(0,_useOutsideClickDeactivatesWithinPortal.useOutsideClickDeactivatesWithinPortal)({portalContainerElement,outerRef:layerRef,isDismissible});if(!isMounted)return null;let content=_react.default.createElement(StyledViewportLayer,{ref:setLayerNode,"data-ds-id":"Drawer",isLeaving:isLeaving},hasBackdrop&&_react.default.createElement(StyledBackdrop,{"data-ds-id":"DrawerBackdrop"}),_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{allowOutsideClick:!0,clickOutsideDeactivates:handleClickOutsideDeactivates,escapeDeactivates:isDismissible,preventScroll:!0,initialFocus:()=>{var container;return container=contentRef.current,"string"==typeof initialFocus?initialFocus:initialFocus?.current??getFocusTarget(container,document)},fallbackFocus:()=>getFocusTarget(contentRef.current,document),onPostDeactivate:()=>handleClose?.()}},_react.default.createElement(StyledContent,{...rest,ref:contentRef,positionX:positionX,positionY:positionY,isLeaving:isLeaving,onAnimationEnd:onAnimationEnd,role:"dialog","aria-modal":"true"},children)));return skipPortal?content:_react.default.createElement(_DialogContext.DialogContext.Provider,{value:!0},_react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},content))}
+    `,{duration,timingFunction}=theme.variables.animation.navSlide.open;return{position:"fixed",...{..."left"===positionX&&{left:0},..."right"===positionX&&{right:0},...!positionX&&{left:"50%"},..."top"===positionY&&{top:0},..."bottom"===positionY&&{bottom:0},...!positionY&&{top:"50%"}},transform:resting,willChange:"transform",animation:`${isLeaving?slideOut:slideIn} ${duration} ${timingFunction} both`,"@media (prefers-reduced-motion: reduce)":{animation:"none"}}}),StyledBackdrop=(0,_styled.default)(_Backdrop.Backdrop,{target:"e1h3k5752",label:"StyledBackdrop"})({pointerEvents:"none"});function getFocusTarget(container,document){return container?.querySelector(_focusableSelector.FOCUSABLE_SELECTOR)??container??document.body}function Drawer({backdropRef,portalContainer,initialFocus,isDismissible=!0,isVisible=!0,onUnmount,hasBackdrop=!0,positionX,positionY,children,handleClose,privateProps:{skipPortal}={skipPortal:!1},...rest}){let portalContainerElement=(0,_Portal.usePortalContainerElement)(portalContainer),contentRef=(0,_react.useRef)(null),document=(0,_useDocument.useDocument)(),{isMounted,isLeaving,onAnimationEnd}=(0,_useExitAnimation.useExitAnimation)(isVisible),wasMounted=(0,_react.useRef)(isMounted);(0,_react.useEffect)(()=>{wasMounted.current&&!isMounted&&onUnmount?.(),wasMounted.current=isMounted},[isMounted,onUnmount]);let layerRef=(0,_react.useRef)(null),setLayerNode=(0,_react.useCallback)(node=>{layerRef.current=node,backdropRef&&(backdropRef.current=node)},[backdropRef]),handleClickOutsideDeactivates=(0,_useOutsideClickDeactivatesWithinPortal.useOutsideClickDeactivatesWithinPortal)({portalContainerElement,outerRef:layerRef,isDismissible});if(!isMounted)return null;let content=_react.default.createElement(StyledViewportLayer,{ref:setLayerNode,"data-ds-id":"Drawer",isLeaving:isLeaving},hasBackdrop&&_react.default.createElement(StyledBackdrop,{"data-ds-id":"DrawerBackdrop"}),_react.default.createElement(_FocusTrapWrapper.FocusTrapWrapper,{active:isVisible,focusTrapOptions:{allowOutsideClick:!0,clickOutsideDeactivates:handleClickOutsideDeactivates,escapeDeactivates:isDismissible,preventScroll:!0,initialFocus:()=>{var container;return container=contentRef.current,"string"==typeof initialFocus?initialFocus:initialFocus?.current??getFocusTarget(container,document)},fallbackFocus:()=>getFocusTarget(contentRef.current,document),onPostDeactivate:()=>handleClose?.()}},_react.default.createElement(StyledContent,{...rest,ref:contentRef,positionX:positionX,positionY:positionY,isLeaving:isLeaving,onAnimationEnd:onAnimationEnd,role:"dialog","aria-modal":"true"},children)));return skipPortal?content:_react.default.createElement(_DialogContext.DialogContext.Provider,{value:!0},_react.default.createElement(_Portal.Portal,{portalContainer:portalContainer},content))}

package/build/cjs/components/Internal/LayoutFloat/LayoutFloat.d.ts

@@ -13,4 +13,16 @@ export type LayoutFloatProps = {
     hostRef: (el: HTMLDivElement | null) => void;
     "data-e2e-test-id"?: string;
 };
-export declare const LayoutFloat: React.MemoExoticComponent<({ width, height, hostRef, "data-e2e-test-id": dataE2eTestId, }: LayoutFloatProps) => React.ReactElement>;
+/**
+ * The floating shell hosting a layout panel's content while its variant is
+ * `"float"`. Pins to the bottom-right viewport corner via the internal
+ * `Float` positioner, then becomes freely draggable by its header across the
+ * viewport (clamped to `spacing.m` from the edges, matching `Float`'s inset).
+ * The header carries the `useMove` handle; this float owns the drag geometry
+ * and publishes its move handlers via `useLayoutFloatDrag` for the header to drive.
+ * Purely presentational otherwise: the content arrives by the panel's persistent
+ * host node being appended into `hostRef`'s element.
+ */
+declare const LayoutFloatBase: ({ width, height, hostRef, "data-e2e-test-id": dataE2eTestId, }: LayoutFloatProps) => React.ReactElement;
+export declare const LayoutFloat: React.MemoExoticComponent<typeof LayoutFloatBase>;
+export {};

package/build/cjs/components/Internal/LayoutFloat/useLayoutFloatDrag.d.ts

@@ -10,7 +10,7 @@ export type LayoutFloatDragContextValue = {
     /** Publish/clear the handlers - for the float. */
     setHandlers: (handlers: LayoutFloatDragHandlers) => void;
 };
-export declare const LayoutFloatDragContext: React.Context<LayoutFloatDragContextValue>;
+export declare const LayoutFloatDragContext: import("react").Context<LayoutFloatDragContextValue>;
 /** Read the float-drag channel. Outside a `LayoutFloatDragProvider` the handlers are
  *  `null` and the setter a no-op, so consumers need no existence checks. */
 export declare const useLayoutFloatDrag: () => LayoutFloatDragContextValue;

package/build/cjs/components/Internal/Sandwich/useSandwichContext.d.ts

@@ -16,6 +16,6 @@ export type SandwichContextValue = SandwichEdges & {
     /** Static host below the scroll body - `Sandwich.Footer` portals into it. */
     footerSlotNode: HTMLElement | null;
 };
-export declare const SandwichProvider: React.Provider<SandwichContextValue | null>;
+export declare const SandwichProvider: import("react").Provider<SandwichContextValue | null>;
 /** Read the Sandwich context, or throw if used outside `<Sandwich>`. */
 export declare function useSandwichContext(): SandwichContextValue;

package/build/cjs/components/Layout/-types.d.ts

@@ -1,4 +1,5 @@
 import type React from "react";
+import type { ConditionalAccessibleName } from "../../types/a11y";
 import type { PanelKey, SidePanelKey, SlotKey } from "./-constants";
 import type { PanelHeaderTitle } from "../Internal/PanelHeader/PanelHeader";
 import type { SandwichSeparator } from "../Internal/Sandwich/-types";
@@ -496,3 +497,11 @@ export type RightPanelProps = SidePanelProps & {
      *  floating panel isn't part of the resizable row. */
     collapsible?: boolean;
 };
+export type LayoutBottomBarProps = ConditionalAccessibleName & {
+    /** Layout.BottomBarItem declarations for the page's actions. */
+    children: React.ReactNode;
+    /** Background of each section; gaps stay transparent. Defaults to transparent. */
+    background?: "primary" | "secondary" | "transparent";
+    /** Identifier applied to the action group. */
+    "data-e2e-test-id"?: string;
+};

package/build/{esm/components/Layout/BottomBar → cjs/components/Layout/BottomBar/BottomBarItem}/LayoutBottomBarItem.d.ts

@@ -1,5 +1,5 @@
 import type { FC, ReactNode } from "react";
-import type { SlotKey } from "../-types";
+import type { SlotKey } from "../../-types";
 export type LayoutBottomBarFallback = "hide" | "remaining" | "full";
 export type LayoutBottomBarItemProps = {
     /** Layout region whose column the item follows. */

package/build/cjs/components/Layout/BottomBar/LayoutBottomBar.d.ts

@@ -1,11 +1,3 @@
-import { type ReactElement, type ReactNode } from "react";
-import type { ConditionalAccessibleName } from "../../../types/a11y";
-export type LayoutBottomBarProps = ConditionalAccessibleName & {
-    /** Layout.BottomBarItem declarations for the page's actions. */
-    children: ReactNode;
-    /** Background of each section; gaps stay transparent. Defaults to transparent. */
-    background?: "primary" | "secondary" | "transparent";
-    /** Identifier applied to the action group. */
-    "data-e2e-test-id"?: string;
-};
+import { type ReactElement } from "react";
+import type { LayoutBottomBarProps } from "../-types";
 export declare function LayoutBottomBar({ children, background, "data-e2e-test-id": dataE2eTestId, ...accessibleName }: LayoutBottomBarProps): ReactElement | null;

package/build/cjs/components/Layout/BottomBar/StyledLayoutBottomBar.d.ts

@@ -7,5 +7,5 @@ type StyledLayoutBottomBarProps = {
 export declare const StyledLayoutBottomBar: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & StyledLayoutBottomBarProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & StyledLayoutBottomBarProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/build/cjs/components/Layout/BottomBar/StyledLayoutBottomBarSection.d.ts

@@ -1,4 +1,4 @@
-import type { LayoutBottomBarProps } from "./LayoutBottomBar";
+import type { LayoutBottomBarProps } from "../-types";
 type StyledLayoutBottomBarSectionProps = {
     background: NonNullable<LayoutBottomBarProps["background"]>;
     columnIndex?: number;
@@ -9,5 +9,5 @@ type StyledLayoutBottomBarSectionProps = {
 export declare const StyledLayoutBottomBarSection: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & StyledLayoutBottomBarSectionProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & StyledLayoutBottomBarSectionProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/build/cjs/components/Layout/BottomBar/StyledLayoutBottomBarSection.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"StyledLayoutBottomBarSection",{enumerable:!0,get:function(){return StyledLayoutBottomBarSection}});const StyledLayoutBottomBarSection=(0,/*#__PURE__*/require("@swc/helpers/_/_interop_require_default")._(require("@emotion/styled")).default)("div",{target:"e5xujxr0",label:"StyledLayoutBottomBarSection"})(({theme,background,columnIndex,rowIndex,fullWidth,hasPanelDivider})=>({gridColumn:fullWidth?"1 / -1":(columnIndex??0)+1,gridRow:rowIndex+1,alignItems:"center",boxSizing:"border-box",backgroundColor:"transparent"===background?"transparent":theme.values.color.background[background].default,display:"flex",minWidth:0,whiteSpace:"nowrap",...hasPanelDivider&&{position:"relative","&::after":{content:'""',position:"absolute",top:0,bottom:0,right:0,width:1,backgroundColor:theme.values.color.border.secondary.default,pointerEvents:"none"}}}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"StyledLayoutBottomBarSection",{enumerable:!0,get:function(){return StyledLayoutBottomBarSection}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_ispropvalid=/*#__PURE__*/_interop_require_default._(require("@emotion/is-prop-valid")),StyledLayoutBottomBarSection=(0,_styled.default)("div",{shouldForwardProp:prop=>"background"!==prop&&(0,_ispropvalid.default)(prop),target:"e1dq38by0",label:"StyledLayoutBottomBarSection"})(({theme,background,columnIndex,rowIndex,fullWidth,hasPanelDivider})=>({gridColumn:fullWidth?"1 / -1":(columnIndex??0)+1,gridRow:rowIndex+1,alignItems:"center",boxSizing:"border-box",backgroundColor:"transparent"===background?"transparent":theme.values.color.background[background].default,display:"flex",minWidth:0,whiteSpace:"nowrap",...hasPanelDivider&&{position:"relative","&::after":{content:'""',position:"absolute",top:0,bottom:0,right:0,width:1,backgroundColor:theme.values.color.border.secondary.default,pointerEvents:"none"}}}));

package/build/cjs/components/Layout/BottomBar/getBottomBarLayout.d.ts

@@ -1,6 +1,6 @@
 import { type ReactNode } from "react";
 import type { LayoutValue, SlotKey } from "../-types";
-import { type LayoutBottomBarItemProps, type LayoutBottomBarFallback } from "./LayoutBottomBarItem";
+import { type LayoutBottomBarItemProps, type LayoutBottomBarFallback } from "./BottomBarItem/LayoutBottomBarItem";
 type BottomBarLayout = Pick<LayoutValue, SlotKey>;
 type BottomBarItemMode = "column" | LayoutBottomBarFallback;
 type VisibleSection = LayoutBottomBarItemProps & {

package/build/cjs/components/Layout/BottomBar/getBottomBarLayout.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"getBottomBarLayout",{enumerable:!0,get:function(){return getBottomBarLayout}});const _react=require("react"),_constants=require("../-constants"),_LayoutBottomBarItem=require("./LayoutBottomBarItem"),getBottomBarItemMode=({region,fallback,layout})=>{let handle=layout[region];return"column"===handle.presentation?"column":("leftPanel"!==region||"sidebar"!==layout.leftPanel.state.variant)&&("rightPanel"!==region||"sidebar"!==layout.rightPanel.state.variant)||handle.isVisible||null===handle.animation?fallback:"column"},getVisibleSections=(children,layout)=>_react.Children.toArray(children).flatMap(child=>{if(!(0,_react.isValidElement)(child)||child.type!==_LayoutBottomBarItem.LayoutBottomBarItem||null==child.props.children||!1===child.props.children)return[];let{region,fallback="hide"}=child.props,placement=getBottomBarItemMode({region,fallback,layout});return"hide"===placement?[]:[{...child.props,placement,fallback}]}),shouldPreserveSplitColumnWidth=sections=>{let hasLeftFallback=sections.some(({region,fallback})=>"leftPanel"===region&&"remaining"===fallback),hasContentColumn=sections.some(({region,placement})=>"content"===region&&"column"===placement),hasSplitColumn=sections.some(({region,placement})=>"splitview"===region&&"column"===placement),hasRightFallback=sections.some(({region,fallback})=>"rightPanel"===region&&"remaining"===fallback);return hasLeftFallback&&hasContentColumn&&hasSplitColumn&&!hasRightFallback},getSharedRowCells=sections=>{if(!sections.length)return[];let firstSection=sections[0],lastSection=sections[sections.length-1],hasRemainingActions=sections.some(({fallback})=>"remaining"===fallback),preserveSplitColumn=shouldPreserveSplitColumnWidth(sections),flexibleColumns={leftPanel:!1,content:hasRemainingActions,splitview:hasRemainingActions&&!preserveSplitColumn,rightPanel:!1},hasFlexibleColumn=sections.some(({region,placement})=>"column"===placement&&flexibleColumns[region]),needsFlexibleGap=hasRemainingActions&&!hasFlexibleColumn,rightActions=sections.find(({region})=>"rightPanel"===region);return[..."column"===firstSection.placement?[{kind:"leading-gap",region:firstSection.region}]:[],...sections.flatMap((section,index)=>{let previousSection=sections[index-1];return[..."column"===section.placement&&previousSection?.placement==="column"?[{kind:"column-gap",region:section.region,previousRegion:previousSection.region}]:[],...needsFlexibleGap&&section===rightActions?[{kind:"flexible-gap"}]:[],{kind:"section",section,flexible:flexibleColumns[section.region]}]}),...!hasRemainingActions||preserveSplitColumn?[{kind:"trailing-gap",region:lastSection.region}]:[],...needsFlexibleGap&&!rightActions?[{kind:"flexible-gap"}]:[]]},getBottomBarLayout=({children,layout})=>{let sections=getVisibleSections(children,layout),sharedSections=_constants.PANEL_ORDER.flatMap(region=>sections.filter(section=>section.region===region&&"full"!==section.placement)),fullWidthSections=sections.filter(({placement})=>"full"===placement),sharedRowCount=+!!sharedSections.length,cells=getSharedRowCells(sharedSections);return{cells,sections:[...cells.flatMap((cell,column)=>"section"===cell.kind?[{...cell.section,columnIndex:column,rowIndex:0}]:[]),...fullWidthSections.map((section,row)=>({...section,rowIndex:sharedRowCount+row}))],rowCount:sharedRowCount+fullWidthSections.length,hasRightPanel:sections.some(({region})=>"rightPanel"===region)}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"getBottomBarLayout",{enumerable:!0,get:function(){return getBottomBarLayout}});const _react=require("react"),_constants=require("../-constants"),_LayoutBottomBarItem=require("./BottomBarItem/LayoutBottomBarItem"),getBottomBarItemMode=({region,fallback,layout})=>{let handle=layout[region];return"column"===handle.presentation?"column":("leftPanel"!==region||"sidebar"!==layout.leftPanel.state.variant)&&("rightPanel"!==region||"sidebar"!==layout.rightPanel.state.variant)||handle.isVisible||null===handle.animation?fallback:"column"},getVisibleSections=(children,layout)=>_react.Children.toArray(children).flatMap(child=>{if(!(0,_react.isValidElement)(child)||child.type!==_LayoutBottomBarItem.LayoutBottomBarItem||null==child.props.children||!1===child.props.children)return[];let{region,fallback="hide"}=child.props,placement=getBottomBarItemMode({region,fallback,layout});return"hide"===placement?[]:[{...child.props,placement,fallback}]}),shouldPreserveSplitColumnWidth=sections=>{let hasLeftFallback=sections.some(({region,fallback})=>"leftPanel"===region&&"remaining"===fallback),hasContentColumn=sections.some(({region,placement})=>"content"===region&&"column"===placement),hasSplitColumn=sections.some(({region,placement})=>"splitview"===region&&"column"===placement),hasRightFallback=sections.some(({region,fallback})=>"rightPanel"===region&&"remaining"===fallback);return hasLeftFallback&&hasContentColumn&&hasSplitColumn&&!hasRightFallback},getSharedRowCells=sections=>{if(!sections.length)return[];let firstSection=sections[0],lastSection=sections[sections.length-1],hasRemainingActions=sections.some(({fallback})=>"remaining"===fallback),preserveSplitColumn=shouldPreserveSplitColumnWidth(sections),flexibleColumns={leftPanel:!1,content:hasRemainingActions,splitview:hasRemainingActions&&!preserveSplitColumn,rightPanel:!1},hasFlexibleColumn=sections.some(({region,placement})=>"column"===placement&&flexibleColumns[region]),needsFlexibleGap=hasRemainingActions&&!hasFlexibleColumn,rightActions=sections.find(({region})=>"rightPanel"===region);return[..."column"===firstSection.placement?[{kind:"leading-gap",region:firstSection.region}]:[],...sections.flatMap((section,index)=>{let previousSection=sections[index-1];return[..."column"===section.placement&&previousSection?.placement==="column"?[{kind:"column-gap",region:section.region,previousRegion:previousSection.region}]:[],...needsFlexibleGap&&section===rightActions?[{kind:"flexible-gap"}]:[],{kind:"section",section,flexible:flexibleColumns[section.region]}]}),...!hasRemainingActions||preserveSplitColumn?[{kind:"trailing-gap",region:lastSection.region}]:[],...needsFlexibleGap&&!rightActions?[{kind:"flexible-gap"}]:[]]},getBottomBarLayout=({children,layout})=>{let sections=getVisibleSections(children,layout),sharedSections=_constants.PANEL_ORDER.flatMap(region=>sections.filter(section=>section.region===region&&"full"!==section.placement)),fullWidthSections=sections.filter(({placement})=>"full"===placement),sharedRowCount=+!!sharedSections.length,cells=getSharedRowCells(sharedSections);return{cells,sections:[...cells.flatMap((cell,column)=>"section"===cell.kind?[{...cell.section,columnIndex:column,rowIndex:0}]:[]),...fullWidthSections.map((section,row)=>({...section,rowIndex:sharedRowCount+row}))],rowCount:sharedRowCount+fullWidthSections.length,hasRightPanel:sections.some(({region})=>"rightPanel"===region)}};

package/build/cjs/components/Layout/Layout.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { LayoutProvider } from "./LayoutProvider";
 import { LayoutBottomBar } from "./BottomBar/LayoutBottomBar";
-import { LayoutBottomBarItem } from "./BottomBar/LayoutBottomBarItem";
+import { LayoutBottomBarItem } from "./BottomBar/BottomBarItem/LayoutBottomBarItem";
 import { Content } from "./Content/Content";
 import { RightPanel } from "./RightPanel/RightPanel";
 import { RightPanelHeader } from "./RightPanel/RightPanelHeader";

package/build/cjs/components/Layout/Layout.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Layout(){return Layout},get PANEL_HOST_DS_ID(){return PANEL_HOST_DS_ID}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Panel=require("../Internal/Panel/Panel"),_LayoutFloat=require("../Internal/LayoutFloat/LayoutFloat"),_useBreakpoints=require("../../shared/useBreakpoints"),_constants=require("./-constants"),_context=require("./context"),_useMobileSplitStack=require("./Split/MobileSplitView/useMobileSplitStack"),_useMobileSplitView=require("./Split/MobileSplitView/useMobileSplitView"),_LayoutProvider=require("./LayoutProvider"),_LayoutBottomBar=require("./BottomBar/LayoutBottomBar"),_LayoutBottomBarItem=require("./BottomBar/LayoutBottomBarItem"),_Content=require("./Content/Content"),_RightPanel=require("./RightPanel/RightPanel"),_RightPanelHeader=require("./RightPanel/RightPanelHeader"),_RightPanelFooter=require("./RightPanel/RightPanelFooter"),_LeftPanel=require("./LeftPanel/LeftPanel"),_LeftPanelHeader=require("./LeftPanel/LeftPanelHeader"),_LeftPanelFooter=require("./LeftPanel/LeftPanelFooter"),_LeftNavBar=require("./LeftNavBar/LeftNavBar"),_LeftNavBarFooter=require("./LeftNavBar/LeftNavBarFooter"),_Split=require("./Split/Split"),_SplitHeader=require("./Split/SplitHeader"),_SplitFooter=require("./Split/SplitFooter"),_registry=require("./registry"),_usePortalTargets=require("./usePortalTargets"),_LayoutFloatDragProvider=require("../Internal/LayoutFloat/LayoutFloatDragProvider"),_LayoutCssVars=require("./LayoutCssVars"),_useLayout=require("./useLayout"),_useLayoutRules=require("./useLayoutRules"),_rules=require("./rules"),resizableFromState=slotState=>"sidePanel"===slotState.kind?slotState.resizable:void 0,useGlobalCssVariables=({slotHosts,root,mobileHost})=>{let leftPanelWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.leftPanel),contentWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.content),splitviewWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.splitview),rightPanelWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.rightPanel),leftPanelStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.leftPanel),contentStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.content),splitviewStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.splitview),rightPanelStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.rightPanel),regionsReadyCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.LAYOUT_REGIONS_READY_VAR),publishRegions=(0,_react.useCallback)(()=>{if(!root)return;let targets=[[_constants.Slot.leftPanel,leftPanelWidthCssVar,leftPanelStartCssVar],[_constants.Slot.content,contentWidthCssVar,contentStartCssVar],[_constants.Slot.splitview,splitviewWidthCssVar,splitviewStartCssVar],[_constants.Slot.rightPanel,rightPanelWidthCssVar,rightPanelStartCssVar]],rootRect=root.getBoundingClientRect();targets.forEach(([slot,widthCssVar,startCssVar])=>{let rect=slotHosts[slot]?.getBoundingClientRect(),isMobileRegion=!!mobileHost&&(slot===_constants.Slot.content||slot===_constants.Slot.splitview),width=isMobileRegion?rootRect.width:rect?.width??0,start=isMobileRegion||!rect?0:rect.left-rootRect.left;widthCssVar.set(`${width}px`),startCssVar.set(`${start}px`)}),regionsReadyCssVar.set("1")},[slotHosts,root,mobileHost,leftPanelWidthCssVar,contentWidthCssVar,splitviewWidthCssVar,rightPanelWidthCssVar,leftPanelStartCssVar,contentStartCssVar,splitviewStartCssVar,rightPanelStartCssVar,regionsReadyCssVar]);(0,_react.useLayoutEffect)(()=>{publishRegions()},[publishRegions]),(0,_react.useLayoutEffect)(()=>{if(!root||"undefined"==typeof ResizeObserver)return;let observer=new ResizeObserver(publishRegions);return observer.observe(root),Object.values(slotHosts).forEach(host=>{host&&observer.observe(host)}),()=>observer.disconnect()},[root,slotHosts,publishRegions])},StyledLayout=(0,_styled.default)("div",{target:"e1kh2kot0",label:"StyledLayout"})({position:"relative",height:"100%",width:"100%"}),StyledPanelRow=(0,_styled.default)("div",{target:"e1kh2kot1",label:"StyledPanelRow"})(({theme,hasOffcanvasLeftBar})=>({height:"100%",boxSizing:"border-box",...hasOffcanvasLeftBar&&{paddingLeft:theme.variables.size.dimension.leftNavBar.width}})),StyledPanelHost=(0,_styled.default)("div",{target:"e1kh2kot2",label:"StyledPanelHost"})({position:"relative",height:"100%",width:"100%"}),PANEL_HOST_DS_ID="PanelHost",StyledContentColumn=(0,_styled.default)("div",{shouldForwardProp:prop=>"isSplitOpen"!==prop,target:"e1kh2kot3",label:"StyledContentColumn"})(({isSplitOpen,theme})=>({display:"flex",height:`calc(100% - ${_constants.PAGE_BOTTOM_BAR_INSET})`,width:"100%",...isSplitOpen&&{maxWidth:theme.variables.layout.split.maxWidth.default,marginInline:"auto",gap:theme.variables.size.spacing.xxs}})),StyledContentColumnHalf=(0,_styled.default)("div",{target:"e1kh2kot4",label:"StyledContentColumnHalf"})({position:"relative",height:"100%",flex:"1 1 0",minWidth:0}),StyledMobileSplitStackHost=(0,_styled.default)("div",{target:"e1kh2kot5",label:"StyledMobileSplitStackHost"})({position:"absolute",top:0,left:0,right:0,bottom:_constants.PAGE_BOTTOM_BAR_INSET,overflow:"hidden",pointerEvents:"none"}),isPanelPresent=({slot,declared,present,isShown})=>!!(declared[slot]&&(isShown(slot)||present[slot])),defaultSizeFor=({slot,panel,panelState})=>slot===_constants.Slot.content?void 0:panel?.defaultSize!==void 0?panel.defaultSize:panel?.resizable!==!1?panelState.size:void 0,childFor=(slot,contentColumn,slotHostRefs)=>slot===_constants.Slot.content?contentColumn:_react.default.createElement(StyledPanelHost,{"data-ds-id":PANEL_HOST_DS_ID,ref:slotHostRefs[slot]}),Layout=function({children,persistenceKey,storage,rules=_rules.DEFAULT_LAYOUT_RULES,additionalRulesData}){let[declared,setDeclared]=(0,_react.useState)({}),layout=(0,_useLayout.useLayout)(),{state:layoutState,...panelCallbacks}=layout;(0,_useLayoutRules.useLayoutRules)({layout,declared,rules,additionalData:additionalRulesData});let{dispatch}=(0,_context.useLayoutStore)(),persistence=(0,_context.useLayoutPersistence)(),resolvedKey=persistenceKey??persistence.persistenceKey,resolvedStorage=storage??persistence.storage,{isMobile}=(0,_useBreakpoints.useBreakpoints)(),showMobileSplitStack=(0,_useMobileSplitView.useMobileSplitViewEnabled)(),[mobileSplitStackHost,setMobileSplitStackHost]=(0,_react.useState)(null),[splitCount,setSplitCount]=(0,_react.useState)(0),registerSplit=(0,_react.useCallback)(()=>(setSplitCount(count=>count+1),()=>setSplitCount(count=>count-1)),[]),mobileSplitStack=(0,_react.useMemo)(()=>({host:mobileSplitStackHost,isSplitPresent:splitCount>0,registerSplit}),[mobileSplitStackHost,splitCount,registerSplit]),rightPanelVariant=layoutState[_constants.Slot.rightPanel].variant??declared[_constants.Slot.rightPanel]?.variant??"sidebar",isRightPanelFloating=!isMobile&&"float"===rightPanelVariant,hasOffcanvasLeftBar=!!declared[_constants.Slot.leftPanel]&&"offcanvas"===layoutState[_constants.Slot.leftPanel].variant,isShown=slot=>layoutState[slot].visible&&!(slot===_constants.Slot.rightPanel&&(isRightPanelFloating||isMobile))&&(slot!==_constants.Slot.leftPanel||"sidebar"===layoutState.leftPanel.variant),[present,setPresent]=(0,_react.useState)({}),presence=(0,_react.useMemo)(()=>({setPresent:(slot,isPresent)=>setPresent(prev=>prev[slot]===isPresent?prev:{...prev,[slot]:isPresent})}),[]),panelHandles=(0,_react.useRef)({}),panelElements=(0,_react.useRef)({}),resizeSuppressed=(0,_react.useRef)({}),animationControl=(0,_react.useMemo)(()=>({setHandle:(slot,handle)=>{panelHandles.current[slot]=handle},getHandle:slot=>panelHandles.current[slot]??null,setElement:(slot,element)=>{panelElements.current[slot]=element},getElement:slot=>panelElements.current[slot]??null,setResizeSuppressed:(slot,suppressed)=>{resizeSuppressed.current[slot]=suppressed}}),[]),panelRefCallbacks=(0,_react.useMemo)(()=>{let handleCallbacks=new Map,elementCallbacks=new Map;return{handleFor:id=>{let callback=handleCallbacks.get(id);return callback||(callback=handle=>animationControl.setHandle(id,handle),handleCallbacks.set(id,callback)),callback},elementFor:id=>{let callback=elementCallbacks.get(id);return callback||(callback=element=>animationControl.setElement(id,element),elementCallbacks.set(id,callback)),callback}}},[animationControl]),shouldSuppressLayoutCallback=(0,_react.useCallback)(()=>Object.values(resizeSuppressed.current).some(Boolean),[]),registry=(0,_react.useMemo)(()=>({register:(slot,reg)=>setDeclared(prev=>({...prev,[slot]:reg})),unregister:slot=>setDeclared(prev=>{if(!(slot in prev))return prev;let next={...prev};return delete next[slot],next})}),[]),{portalTargets,slotHosts,slotHostRefs,floatHostRef}=(0,_usePortalTargets.usePortalTargets)({slots:_constants.PANEL_ORDER,floatableSlot:_constants.Slot.rightPanel,isFloating:isRightPanelFloating}),[layoutRoot,setLayoutRoot]=(0,_react.useState)(null),rootPortalTargets=(0,_react.useMemo)(()=>({...portalTargets,root:layoutRoot}),[portalTargets,layoutRoot]);useGlobalCssVariables({slotHosts,root:layoutRoot,mobileHost:mobileSplitStackHost});let rowSlots=_constants.PANEL_ORDER.filter(slot=>slot!==_constants.Slot.splitview),declaredSlots=rowSlots.filter(slot=>declared[slot]),isSolo=declaredSlots.length<=1,soloSlot=declaredSlots[0],isSplitOpen=isPanelPresent({slot:_constants.Slot.splitview,declared,present,isShown})&&isPanelPresent({slot:_constants.Slot.content,declared,present,isShown}),contentColumn=_react.default.createElement(StyledContentColumn,{isSplitOpen:isSplitOpen},_react.default.createElement(StyledContentColumnHalf,{ref:slotHostRefs[_constants.Slot.content]}),isSplitOpen&&_react.default.createElement(StyledContentColumnHalf,{ref:slotHostRefs[_constants.Slot.splitview]})),panelItems=rowSlots.filter(slot=>isPanelPresent({slot,declared,present,isShown})).map(slot=>{let panel=declared[slot],panelState=layoutState[slot];return{id:slot,gapBefore:slot===_constants.Slot.rightPanel,child:childFor(slot,contentColumn,slotHostRefs),defaultSize:defaultSizeFor({slot,panel,panelState}),minSize:panel?.minSize,maxSize:panel?.maxSize,collapsible:slot!==_constants.Slot.content&&(panel?.collapsible??!0),lockWidthOnWindowResize:panel?.lockWidthOnWindowResize,resizable:panel?.resizable??resizableFromState(panelState)}}),rowKey=panelItems.map(item=>item.id).join(","),soloHost=soloSlot&&isShown(soloSlot)?childFor(soloSlot,contentColumn,slotHostRefs):null,panelGroup=panelItems.length>0?_react.default.createElement(_Panel.Panel,{key:resolvedKey,panels:panelItems,persistenceKey:resolvedKey,storage:resolvedStorage,onResize:(id,size)=>{isShown(id)&&declared[id]?.resizable!==!1&&dispatch({type:"resize",slot:id,size:declared[id]?.lockWidthOnWindowResize?Math.round(size.inPixels):`${size.asPercentage}%`})},onCollapse:id=>panelCallbacks[id].hide(),panelHandleFor:panelRefCallbacks.handleFor,panelElementFor:panelRefCallbacks.elementFor,shouldSuppressLayoutCallback:shouldSuppressLayoutCallback}):null;return _react.default.createElement(_registry.PanelRegistryContext.Provider,{value:registry},_react.default.createElement(_registry.PanelDeclarationsContext.Provider,{value:declared},_react.default.createElement(_registry.PanelPresenceContext.Provider,{value:presence},_react.default.createElement(_registry.PanelAnimationContext.Provider,{value:animationControl},_react.default.createElement(_registry.PanelRowContext.Provider,{value:rowKey},_react.default.createElement(_registry.LayoutPortalContext.Provider,{value:rootPortalTargets},_react.default.createElement(_LayoutFloatDragProvider.LayoutFloatDragProvider,null,_react.default.createElement(_useMobileSplitStack.MobileSplitStackContext.Provider,{value:mobileSplitStack},_react.default.createElement(StyledLayout,{ref:setLayoutRoot,"data-ds-id":"Layout"},_react.default.createElement(StyledPanelRow,{hasOffcanvasLeftBar:hasOffcanvasLeftBar},isSolo?soloHost:panelGroup),isRightPanelFloating&&layoutState[_constants.Slot.rightPanel].visible&&_react.default.createElement(_LayoutFloat.LayoutFloat,{hostRef:floatHostRef}),children,showMobileSplitStack&&_react.default.createElement(StyledMobileSplitStackHost,{ref:setMobileSplitStackHost}))))))))))};Layout.Provider=_LayoutProvider.LayoutProvider,Layout.BottomBar=_LayoutBottomBar.LayoutBottomBar,Layout.BottomBarItem=_LayoutBottomBarItem.LayoutBottomBarItem,Layout.LeftPanel=_LeftPanel.LeftPanel,Layout.LeftNavBar=_LeftNavBar.LeftNavBar,Layout.LeftNavBarFooter=_LeftNavBarFooter.LeftNavBarFooter,Layout.LeftPanelHeader=_LeftPanelHeader.LeftPanelHeader,Layout.LeftPanelFooter=_LeftPanelFooter.LeftPanelFooter,Layout.RightPanel=_RightPanel.RightPanel,Layout.RightPanelHeader=_RightPanelHeader.RightPanelHeader,Layout.RightPanelFooter=_RightPanelFooter.RightPanelFooter,Layout.Content=_Content.Content,Layout.Split=_Split.Split,Layout.SplitHeader=_SplitHeader.SplitHeader,Layout.SplitFooter=_SplitFooter.SplitFooter;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var target=exports,all={get Layout(){return Layout},get PANEL_HOST_DS_ID(){return PANEL_HOST_DS_ID}};for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:Object.getOwnPropertyDescriptor(all,name).get});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=/*#__PURE__*/require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=/*#__PURE__*/_interop_require_default._(require("@emotion/styled")),_Panel=require("../Internal/Panel/Panel"),_LayoutFloat=require("../Internal/LayoutFloat/LayoutFloat"),_useBreakpoints=require("../../shared/useBreakpoints"),_constants=require("./-constants"),_context=require("./context"),_useMobileSplitStack=require("./Split/MobileSplitView/useMobileSplitStack"),_useMobileSplitView=require("./Split/MobileSplitView/useMobileSplitView"),_LayoutProvider=require("./LayoutProvider"),_LayoutBottomBar=require("./BottomBar/LayoutBottomBar"),_LayoutBottomBarItem=require("./BottomBar/BottomBarItem/LayoutBottomBarItem"),_Content=require("./Content/Content"),_RightPanel=require("./RightPanel/RightPanel"),_RightPanelHeader=require("./RightPanel/RightPanelHeader"),_RightPanelFooter=require("./RightPanel/RightPanelFooter"),_LeftPanel=require("./LeftPanel/LeftPanel"),_LeftPanelHeader=require("./LeftPanel/LeftPanelHeader"),_LeftPanelFooter=require("./LeftPanel/LeftPanelFooter"),_LeftNavBar=require("./LeftNavBar/LeftNavBar"),_LeftNavBarFooter=require("./LeftNavBar/LeftNavBarFooter"),_Split=require("./Split/Split"),_SplitHeader=require("./Split/SplitHeader"),_SplitFooter=require("./Split/SplitFooter"),_registry=require("./registry"),_usePortalTargets=require("./usePortalTargets"),_LayoutFloatDragProvider=require("../Internal/LayoutFloat/LayoutFloatDragProvider"),_LayoutCssVars=require("./LayoutCssVars"),_useLayout=require("./useLayout"),_useLayoutRules=require("./useLayoutRules"),_rules=require("./rules"),resizableFromState=slotState=>"sidePanel"===slotState.kind?slotState.resizable:void 0,useGlobalCssVariables=({slotHosts,root,mobileHost})=>{let leftPanelWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.leftPanel),contentWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.content),splitviewWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.splitview),rightPanelWidthCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_WIDTH_VAR.rightPanel),leftPanelStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.leftPanel),contentStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.content),splitviewStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.splitview),rightPanelStartCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.PANEL_START_VAR.rightPanel),regionsReadyCssVar=(0,_LayoutCssVars.useLayoutVar)(_constants.LAYOUT_REGIONS_READY_VAR),publishRegions=(0,_react.useCallback)(()=>{if(!root)return;let targets=[[_constants.Slot.leftPanel,leftPanelWidthCssVar,leftPanelStartCssVar],[_constants.Slot.content,contentWidthCssVar,contentStartCssVar],[_constants.Slot.splitview,splitviewWidthCssVar,splitviewStartCssVar],[_constants.Slot.rightPanel,rightPanelWidthCssVar,rightPanelStartCssVar]],rootRect=root.getBoundingClientRect();targets.forEach(([slot,widthCssVar,startCssVar])=>{let rect=slotHosts[slot]?.getBoundingClientRect(),isMobileRegion=!!mobileHost&&(slot===_constants.Slot.content||slot===_constants.Slot.splitview),width=isMobileRegion?rootRect.width:rect?.width??0,start=isMobileRegion||!rect?0:rect.left-rootRect.left;widthCssVar.set(`${width}px`),startCssVar.set(`${start}px`)}),regionsReadyCssVar.set("1")},[slotHosts,root,mobileHost,leftPanelWidthCssVar,contentWidthCssVar,splitviewWidthCssVar,rightPanelWidthCssVar,leftPanelStartCssVar,contentStartCssVar,splitviewStartCssVar,rightPanelStartCssVar,regionsReadyCssVar]);(0,_react.useLayoutEffect)(()=>{publishRegions()},[publishRegions]),(0,_react.useLayoutEffect)(()=>{if(!root||"undefined"==typeof ResizeObserver)return;let observer=new ResizeObserver(publishRegions);return observer.observe(root),Object.values(slotHosts).forEach(host=>{host&&observer.observe(host)}),()=>observer.disconnect()},[root,slotHosts,publishRegions])},StyledLayout=(0,_styled.default)("div",{target:"e1tobjas0",label:"StyledLayout"})({position:"relative",height:"100%",width:"100%"}),StyledPanelRow=(0,_styled.default)("div",{target:"e1tobjas1",label:"StyledPanelRow"})(({theme,hasOffcanvasLeftBar})=>({height:"100%",boxSizing:"border-box",...hasOffcanvasLeftBar&&{paddingLeft:theme.variables.size.dimension.leftNavBar.width}})),StyledPanelHost=(0,_styled.default)("div",{target:"e1tobjas2",label:"StyledPanelHost"})({position:"relative",height:"100%",width:"100%"}),PANEL_HOST_DS_ID="PanelHost",StyledContentColumn=(0,_styled.default)("div",{shouldForwardProp:prop=>"isSplitOpen"!==prop,target:"e1tobjas3",label:"StyledContentColumn"})(({isSplitOpen,theme})=>({display:"flex",height:`calc(100% - ${_constants.PAGE_BOTTOM_BAR_INSET})`,width:"100%",...isSplitOpen&&{maxWidth:theme.variables.layout.split.maxWidth.default,marginInline:"auto",gap:theme.variables.size.spacing.xxs}})),StyledContentColumnHalf=(0,_styled.default)("div",{target:"e1tobjas4",label:"StyledContentColumnHalf"})({position:"relative",height:"100%",flex:"1 1 0",minWidth:0}),StyledMobileSplitStackHost=(0,_styled.default)("div",{target:"e1tobjas5",label:"StyledMobileSplitStackHost"})({position:"absolute",top:0,left:0,right:0,bottom:_constants.PAGE_BOTTOM_BAR_INSET,overflow:"hidden",pointerEvents:"none"}),isPanelPresent=({slot,declared,present,isShown})=>!!(declared[slot]&&(isShown(slot)||present[slot])),defaultSizeFor=({slot,panel,panelState})=>slot===_constants.Slot.content?void 0:panel?.defaultSize!==void 0?panel.defaultSize:panel?.resizable!==!1?panelState.size:void 0,childFor=(slot,contentColumn,slotHostRefs)=>slot===_constants.Slot.content?contentColumn:_react.default.createElement(StyledPanelHost,{"data-ds-id":PANEL_HOST_DS_ID,ref:slotHostRefs[slot]}),Layout=function({children,persistenceKey,storage,rules=_rules.DEFAULT_LAYOUT_RULES,additionalRulesData}){let[declared,setDeclared]=(0,_react.useState)({}),layout=(0,_useLayout.useLayout)(),{state:layoutState,...panelCallbacks}=layout;(0,_useLayoutRules.useLayoutRules)({layout,declared,rules,additionalData:additionalRulesData});let{dispatch}=(0,_context.useLayoutStore)(),persistence=(0,_context.useLayoutPersistence)(),resolvedKey=persistenceKey??persistence.persistenceKey,resolvedStorage=storage??persistence.storage,{isMobile}=(0,_useBreakpoints.useBreakpoints)(),showMobileSplitStack=(0,_useMobileSplitView.useMobileSplitViewEnabled)(),[mobileSplitStackHost,setMobileSplitStackHost]=(0,_react.useState)(null),[splitCount,setSplitCount]=(0,_react.useState)(0),registerSplit=(0,_react.useCallback)(()=>(setSplitCount(count=>count+1),()=>setSplitCount(count=>count-1)),[]),mobileSplitStack=(0,_react.useMemo)(()=>({host:mobileSplitStackHost,isSplitPresent:splitCount>0,registerSplit}),[mobileSplitStackHost,splitCount,registerSplit]),rightPanelVariant=layoutState[_constants.Slot.rightPanel].variant??declared[_constants.Slot.rightPanel]?.variant??"sidebar",isRightPanelFloating=!isMobile&&"float"===rightPanelVariant,hasOffcanvasLeftBar=!!declared[_constants.Slot.leftPanel]&&"offcanvas"===layoutState[_constants.Slot.leftPanel].variant,isShown=slot=>layoutState[slot].visible&&!(slot===_constants.Slot.rightPanel&&(isRightPanelFloating||isMobile))&&(slot!==_constants.Slot.leftPanel||"sidebar"===layoutState.leftPanel.variant),[present,setPresent]=(0,_react.useState)({}),presence=(0,_react.useMemo)(()=>({setPresent:(slot,isPresent)=>setPresent(prev=>prev[slot]===isPresent?prev:{...prev,[slot]:isPresent})}),[]),panelHandles=(0,_react.useRef)({}),panelElements=(0,_react.useRef)({}),resizeSuppressed=(0,_react.useRef)({}),animationControl=(0,_react.useMemo)(()=>({setHandle:(slot,handle)=>{panelHandles.current[slot]=handle},getHandle:slot=>panelHandles.current[slot]??null,setElement:(slot,element)=>{panelElements.current[slot]=element},getElement:slot=>panelElements.current[slot]??null,setResizeSuppressed:(slot,suppressed)=>{resizeSuppressed.current[slot]=suppressed}}),[]),panelRefCallbacks=(0,_react.useMemo)(()=>{let handleCallbacks=new Map,elementCallbacks=new Map;return{handleFor:id=>{let callback=handleCallbacks.get(id);return callback||(callback=handle=>animationControl.setHandle(id,handle),handleCallbacks.set(id,callback)),callback},elementFor:id=>{let callback=elementCallbacks.get(id);return callback||(callback=element=>animationControl.setElement(id,element),elementCallbacks.set(id,callback)),callback}}},[animationControl]),shouldSuppressLayoutCallback=(0,_react.useCallback)(()=>Object.values(resizeSuppressed.current).some(Boolean),[]),registry=(0,_react.useMemo)(()=>({register:(slot,reg)=>setDeclared(prev=>({...prev,[slot]:reg})),unregister:slot=>setDeclared(prev=>{if(!(slot in prev))return prev;let next={...prev};return delete next[slot],next})}),[]),{portalTargets,slotHosts,slotHostRefs,floatHostRef}=(0,_usePortalTargets.usePortalTargets)({slots:_constants.PANEL_ORDER,floatableSlot:_constants.Slot.rightPanel,isFloating:isRightPanelFloating}),[layoutRoot,setLayoutRoot]=(0,_react.useState)(null),rootPortalTargets=(0,_react.useMemo)(()=>({...portalTargets,root:layoutRoot}),[portalTargets,layoutRoot]);useGlobalCssVariables({slotHosts,root:layoutRoot,mobileHost:mobileSplitStackHost});let rowSlots=_constants.PANEL_ORDER.filter(slot=>slot!==_constants.Slot.splitview),declaredSlots=rowSlots.filter(slot=>declared[slot]),isSolo=declaredSlots.length<=1,soloSlot=declaredSlots[0],isSplitOpen=isPanelPresent({slot:_constants.Slot.splitview,declared,present,isShown})&&isPanelPresent({slot:_constants.Slot.content,declared,present,isShown}),contentColumn=_react.default.createElement(StyledContentColumn,{isSplitOpen:isSplitOpen},_react.default.createElement(StyledContentColumnHalf,{ref:slotHostRefs[_constants.Slot.content]}),isSplitOpen&&_react.default.createElement(StyledContentColumnHalf,{ref:slotHostRefs[_constants.Slot.splitview]})),panelItems=rowSlots.filter(slot=>isPanelPresent({slot,declared,present,isShown})).map(slot=>{let panel=declared[slot],panelState=layoutState[slot];return{id:slot,gapBefore:slot===_constants.Slot.rightPanel,child:childFor(slot,contentColumn,slotHostRefs),defaultSize:defaultSizeFor({slot,panel,panelState}),minSize:panel?.minSize,maxSize:panel?.maxSize,collapsible:slot!==_constants.Slot.content&&(panel?.collapsible??!0),lockWidthOnWindowResize:panel?.lockWidthOnWindowResize,resizable:panel?.resizable??resizableFromState(panelState)}}),rowKey=panelItems.map(item=>item.id).join(","),soloHost=soloSlot&&isShown(soloSlot)?childFor(soloSlot,contentColumn,slotHostRefs):null,panelGroup=panelItems.length>0?_react.default.createElement(_Panel.Panel,{key:resolvedKey,panels:panelItems,persistenceKey:resolvedKey,storage:resolvedStorage,onResize:(id,size)=>{isShown(id)&&declared[id]?.resizable!==!1&&dispatch({type:"resize",slot:id,size:declared[id]?.lockWidthOnWindowResize?Math.round(size.inPixels):`${size.asPercentage}%`})},onCollapse:id=>panelCallbacks[id].hide(),panelHandleFor:panelRefCallbacks.handleFor,panelElementFor:panelRefCallbacks.elementFor,shouldSuppressLayoutCallback:shouldSuppressLayoutCallback}):null;return _react.default.createElement(_registry.PanelRegistryContext.Provider,{value:registry},_react.default.createElement(_registry.PanelDeclarationsContext.Provider,{value:declared},_react.default.createElement(_registry.PanelPresenceContext.Provider,{value:presence},_react.default.createElement(_registry.PanelAnimationContext.Provider,{value:animationControl},_react.default.createElement(_registry.PanelRowContext.Provider,{value:rowKey},_react.default.createElement(_registry.LayoutPortalContext.Provider,{value:rootPortalTargets},_react.default.createElement(_LayoutFloatDragProvider.LayoutFloatDragProvider,null,_react.default.createElement(_useMobileSplitStack.MobileSplitStackContext.Provider,{value:mobileSplitStack},_react.default.createElement(StyledLayout,{ref:setLayoutRoot,"data-ds-id":"Layout"},_react.default.createElement(StyledPanelRow,{hasOffcanvasLeftBar:hasOffcanvasLeftBar},isSolo?soloHost:panelGroup),isRightPanelFloating&&layoutState[_constants.Slot.rightPanel].visible&&_react.default.createElement(_LayoutFloat.LayoutFloat,{hostRef:floatHostRef}),children,showMobileSplitStack&&_react.default.createElement(StyledMobileSplitStackHost,{ref:setMobileSplitStackHost}))))))))))};Layout.Provider=_LayoutProvider.LayoutProvider,Layout.BottomBar=_LayoutBottomBar.LayoutBottomBar,Layout.BottomBarItem=_LayoutBottomBarItem.LayoutBottomBarItem,Layout.LeftPanel=_LeftPanel.LeftPanel,Layout.LeftNavBar=_LeftNavBar.LeftNavBar,Layout.LeftNavBarFooter=_LeftNavBarFooter.LeftNavBarFooter,Layout.LeftPanelHeader=_LeftPanelHeader.LeftPanelHeader,Layout.LeftPanelFooter=_LeftPanelFooter.LeftPanelFooter,Layout.RightPanel=_RightPanel.RightPanel,Layout.RightPanelHeader=_RightPanelHeader.RightPanelHeader,Layout.RightPanelFooter=_RightPanelFooter.RightPanelFooter,Layout.Content=_Content.Content,Layout.Split=_Split.Split,Layout.SplitHeader=_SplitHeader.SplitHeader,Layout.SplitFooter=_SplitFooter.SplitFooter;

package/build/cjs/components/Layout/LeftPanel/useLeftBarContext.d.ts

@@ -6,6 +6,6 @@ export type LeftBarSlot = {
      *  content alone. */
     slotNode: HTMLElement | null;
 };
-export declare const LeftBarProvider: React.Provider<LeftBarSlot>;
+export declare const LeftBarProvider: import("react").Provider<LeftBarSlot>;
 /** The left bar slot behind the left panel, if this presentation has one. */
 export declare const useLeftBarContext: () => LeftBarSlot;

package/build/cjs/components/Layout/LeftPanel/useLeftPanelCollapseContext.d.ts

@@ -6,6 +6,6 @@ export type LeftPanelCollapseState = {
      *  at the column's edge so nothing inside reflows on the way down. */
     fixedContentWidth?: string;
 };
-export declare const LeftPanelCollapseProvider: React.Provider<LeftPanelCollapseState>;
+export declare const LeftPanelCollapseProvider: import("react").Provider<LeftPanelCollapseState>;
 /** How the left panel's parts have to behave while its column narrows. */
 export declare const useLeftPanelCollapseContext: () => LeftPanelCollapseState;

package/build/cjs/components/Layout/Split/MobileSplitView/StyledMobileSplitSlideLayer.d.ts

@@ -18,5 +18,5 @@ export declare const StyledMobileSplitSlideLayer: import("@emotion/styled").Styl
 } & {
     offset: MobileSplitViewOffset;
     layer: MobileSplitLayer;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};