@homebound/beam 2.390.0 → 2.391.0

package/dist/index.d.cts

@@ -7716,6 +7716,9 @@ type SidebarContentProps = {
 type RightSidebarProps = {
     content: SidebarContentProps[];
 };
+/** Exporting this value allows layout components to coordinate responsive column sizing
+ * while avoiding layout shift when the sidebar is opened */
+declare const RIGHT_SIDEBAR_MIN_WIDTH = "250px";
 declare function RightSidebar({ content }: RightSidebarProps): _emotion_react_jsx_runtime.JSX.Element;
 
 type HeaderBreadcrumb = {
@@ -8238,4 +8241,4 @@ declare function useSessionStorage<T>(key: string, defaultValue: T): UseSessionS
  */
 declare function defaultTestId(label: string): string;
 
-export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BeamButtonProps, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, Container, type ContentStack, Copy, Css, CssReset, DESC, DateField, type DateFieldMode, type DateFieldModeTuple, type DateFieldProps, type DateFilterValue, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, type GridTableProps, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, Palette, type Pin, type Placement, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, ScrollShadows, ScrollableContent, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverStyles, collapseColumn, column, condensedStyle, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatValue, generateColumnId, getAlignment, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, matchesFilter, maybeApplyFunction, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, persistentItemPrefix, pressedStyles, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, scrollContainerBottomPadding, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, visit, zIndices };
+export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BeamButtonProps, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, Container, type ContentStack, Copy, Css, CssReset, DESC, DateField, type DateFieldMode, type DateFieldModeTuple, type DateFieldProps, type DateFilterValue, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, type GridTableProps, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, Palette, type Pin, type Placement, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, RIGHT_SIDEBAR_MIN_WIDTH, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, ScrollShadows, ScrollableContent, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverStyles, collapseColumn, column, condensedStyle, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatValue, generateColumnId, getAlignment, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, matchesFilter, maybeApplyFunction, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, persistentItemPrefix, pressedStyles, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, scrollContainerBottomPadding, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, visit, zIndices };

package/dist/index.d.ts

@@ -7716,6 +7716,9 @@ type SidebarContentProps = {
 type RightSidebarProps = {
     content: SidebarContentProps[];
 };
+/** Exporting this value allows layout components to coordinate responsive column sizing
+ * while avoiding layout shift when the sidebar is opened */
+declare const RIGHT_SIDEBAR_MIN_WIDTH = "250px";
 declare function RightSidebar({ content }: RightSidebarProps): _emotion_react_jsx_runtime.JSX.Element;
 
 type HeaderBreadcrumb = {
@@ -8238,4 +8241,4 @@ declare function useSessionStorage<T>(key: string, defaultValue: T): UseSessionS
  */
 declare function defaultTestId(label: string): string;
 
-export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BeamButtonProps, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, Container, type ContentStack, Copy, Css, CssReset, DESC, DateField, type DateFieldMode, type DateFieldModeTuple, type DateFieldProps, type DateFilterValue, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, type GridTableProps, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, Palette, type Pin, type Placement, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, ScrollShadows, ScrollableContent, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverStyles, collapseColumn, column, condensedStyle, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatValue, generateColumnId, getAlignment, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, matchesFilter, maybeApplyFunction, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, persistentItemPrefix, pressedStyles, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, scrollContainerBottomPadding, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, visit, zIndices };
+export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BeamButtonProps, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, Container, type ContentStack, Copy, Css, CssReset, DESC, DateField, type DateFieldMode, type DateFieldModeTuple, type DateFieldProps, type DateFilterValue, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, type GridTableProps, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, Palette, type Pin, type Placement, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, RIGHT_SIDEBAR_MIN_WIDTH, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, ScrollShadows, ScrollableContent, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverStyles, collapseColumn, column, condensedStyle, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatValue, generateColumnId, getAlignment, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, matchesFilter, maybeApplyFunction, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, persistentItemPrefix, pressedStyles, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, scrollContainerBottomPadding, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, visit, zIndices };

package/dist/index.js

@@ -15245,36 +15245,39 @@ function SubmitButton(props) {
   );
 }
 
+// src/components/Layout/FormPageLayout.tsx
+import { useDebouncedCallback as useDebouncedCallback4 } from "use-debounce";
+
 // src/components/RightSidebar.tsx
 import { AnimatePresence as AnimatePresence2, motion as motion2 } from "framer-motion";
 import { useState as useState31 } from "react";
 import { Fragment as Fragment21, jsx as jsx119, jsxs as jsxs57 } from "@emotion/react/jsx-runtime";
+var RIGHT_SIDEBAR_MIN_WIDTH = "250px";
 function RightSidebar({ content }) {
   const [selectedIcon, setSelectedIcon] = useState31(void 0);
   const tid = useTestIds({}, "rightSidebar");
-  const width2 = 380;
   return /* @__PURE__ */ jsxs57(Fragment21, { children: [
-    /* @__PURE__ */ jsx119("div", { css: Css.df.jcfe.relative.pr3.$, children: /* @__PURE__ */ jsx119("div", { css: Css.df.gap2.z1.$, children: content.map(({ icon }) => /* @__PURE__ */ jsx119(
-      IconButton,
+    /* @__PURE__ */ jsx119("div", { css: Css.df.jcfe.absolute.right0.pr3.$, children: /* @__PURE__ */ jsx119(AnimatePresence2, { children: !selectedIcon && /* @__PURE__ */ jsx119(
+      motion2.div,
       {
-        circle: true,
-        active: icon === selectedIcon,
-        onClick: () => setSelectedIcon(icon),
-        icon,
-        inc: 3.5
-      },
-      `${icon}-${selectedIcon}`
-    )) }) }),
+        css: Css.df.fdc.gap2.z1.$,
+        initial: { x: "100%", opacity: 0 },
+        animate: { x: 0, opacity: 1 },
+        exit: { x: "100%", opacity: 0 },
+        transition: { ease: [0.51, 0.92, 0.24, 1], duration: 0.3, delay: 0.2 },
+        children: /* @__PURE__ */ jsx119(IconButtonList, { content, selectedIcon, onIconClick: setSelectedIcon })
+      }
+    ) }) }),
     /* @__PURE__ */ jsx119(AnimatePresence2, { children: selectedIcon && /* @__PURE__ */ jsx119(
       motion2.div,
       {
-        initial: { x: width2, opacity: 0 },
+        initial: { x: "100%", opacity: 0 },
         animate: { x: 0, opacity: 1 },
-        transition: { delay: 0.2, ease: "linear", duration: 0.2 },
-        exit: { transition: { ease: "linear", duration: 0.2 }, x: width2 },
-        css: Css.wPx(width2).z0.$,
-        children: /* @__PURE__ */ jsxs57("div", { css: Css.relative.topPx(-48).z0.px3.$, children: [
-          /* @__PURE__ */ jsxs57("div", { css: Css.absolute.leftPx(-24).$, children: [
+        transition: { delay: 0.2, ease: [0.51, 0.92, 0.24, 1], duration: 0.3 },
+        exit: { transition: { ease: "linear", duration: 0.2 }, x: "100%" },
+        css: Css.w100.mw(RIGHT_SIDEBAR_MIN_WIDTH).z0.$,
+        children: /* @__PURE__ */ jsxs57("div", { css: Css.relative.z0.px3.$, children: [
+          /* @__PURE__ */ jsxs57("div", { css: Css.absolute.leftPx(-24).top0.$, children: [
             /* @__PURE__ */ jsx119(
               IconButton,
               {
@@ -15287,13 +15290,27 @@ function RightSidebar({ content }) {
             ),
             /* @__PURE__ */ jsx119("div", { css: Css.absolute.topPx(48).leftPx(23).h("calc(100vh - 168px)").wPx(1).bgGray300.$ })
           ] }),
-          selectedIcon && /* @__PURE__ */ jsx119("div", { ...tid.content, css: Css.ptPx(72).$, children: content.find((sidebar) => sidebar.icon === selectedIcon)?.render() })
+          /* @__PURE__ */ jsx119("div", { css: Css.df.aic.jcfe.gap2.mb3.$, children: /* @__PURE__ */ jsx119(IconButtonList, { content, selectedIcon, onIconClick: setSelectedIcon }) }),
+          selectedIcon && /* @__PURE__ */ jsx119("div", { ...tid.content, children: content.find((sidebar) => sidebar.icon === selectedIcon)?.render() })
         ] })
       },
       "rightSidebar"
     ) })
   ] });
 }
+function IconButtonList({ content, selectedIcon, onIconClick }) {
+  return /* @__PURE__ */ jsx119(Fragment21, { children: content.map(({ icon }) => /* @__PURE__ */ jsx119(
+    IconButton,
+    {
+      circle: true,
+      active: icon === selectedIcon,
+      onClick: () => onIconClick(icon),
+      icon,
+      inc: 3.5
+    },
+    `${icon}-${selectedIcon}`
+  )) });
+}
 
 // src/components/Layout/PageHeaderBreadcrumbs.tsx
 import { Fragment as Fragment22 } from "react";
@@ -15311,6 +15328,7 @@ function PageHeaderBreadcrumbs({ breadcrumb }) {
 // src/components/Layout/FormPageLayout.tsx
 import { jsx as jsx121, jsxs as jsxs59 } from "@emotion/react/jsx-runtime";
 var headerHeightPx = 120;
+var maxContentWidthPx = 1600;
 function FormPageLayoutComponent(props) {
   const { formSections, formState, rightSideBar } = props;
   const tids = useTestIds(props, "formPageLayout");
@@ -15323,32 +15341,25 @@ function FormPageLayoutComponent(props) {
     })),
     [formSections]
   );
-  const gridColumns = "minMax(0, auto) minMax(100px, 250px) minMax(350px, 1000px) minMax(min-content, 300px) minMax(0, auto)";
+  const gridColumns = `minMax(100px, 250px) minMax(350px, 1000px) minMax(${RIGHT_SIDEBAR_MIN_WIDTH}, 380px)`;
   return (
     // This page is `fixed` to the full screen to allow it to act as a full screen modal while content is mounted below
     // since this layout will be replacing most superdrawers/sidebars, we keep the listing mounted below to preserve the users's
     // scroll position & filters
     // Adding "align-items: start" allows "position: sticky" to work within a grid for the sidebars
-    /* @__PURE__ */ jsxs59(
-      "div",
-      {
-        css: Css.fixed.top0.bottom0.left0.right0.z(1e3).oya.bgWhite.dg.gtc(gridColumns).gtr("auto 1fr").cg3.ais.$,
-        ...tids,
-        children: [
-          /* @__PURE__ */ jsx121(PageHeader, { ...props, ...tids.pageHeader }),
-          /* @__PURE__ */ jsx121(LeftNav, { sectionsWithRefs, ...tids }),
-          /* @__PURE__ */ jsx121(FormSections, { sectionsWithRefs, formState, ...tids }),
-          rightSideBar && /* @__PURE__ */ jsx121("aside", { css: Css.gr(2).gc("4 / 5").sticky.topPx(headerHeightPx).$, children: /* @__PURE__ */ jsx121(RightSidebar, { content: rightSideBar }) })
-        ]
-      }
-    )
+    /* @__PURE__ */ jsx121("div", { css: Css.fixed.top0.bottom0.left0.right0.z(1e3).oya.bgWhite.df.jcc.aifs.$, ...tids, children: /* @__PURE__ */ jsxs59("div", { css: Css.w100.maxwPx(maxContentWidthPx).dg.gtc(gridColumns).gtr("auto 1fr").cg3.ais.$, children: [
+      /* @__PURE__ */ jsx121(PageHeader, { ...props, ...tids.pageHeader }),
+      /* @__PURE__ */ jsx121(LeftNav, { sectionsWithRefs, ...tids }),
+      /* @__PURE__ */ jsx121(FormSections, { sectionsWithRefs, formState, ...tids }),
+      rightSideBar && /* @__PURE__ */ jsx121("aside", { css: Css.gr(2).gc("3 / 4").sticky.topPx(headerHeightPx).$, children: /* @__PURE__ */ jsx121(RightSidebar, { content: rightSideBar }) })
+    ] }) })
   );
 }
 var FormPageLayout = React13.memo(FormPageLayoutComponent);
 function PageHeader(props) {
   const { pageTitle, breadCrumb, submitAction, cancelAction, tertiaryAction, formState } = props;
   const tids = useTestIds(props);
-  return /* @__PURE__ */ jsx121("header", { css: Css.gr(1).gc("2 / 5").sticky.top0.hPx(headerHeightPx).bgWhite.z5.$, ...tids, children: /* @__PURE__ */ jsxs59("div", { css: Css.py2.px3.df.jcsb.aic.$, children: [
+  return /* @__PURE__ */ jsx121("header", { css: Css.gr(1).gc("1 / 4").sticky.top0.hPx(headerHeightPx).bgWhite.z5.$, ...tids, children: /* @__PURE__ */ jsxs59("div", { css: Css.py2.px3.df.jcsb.aic.$, children: [
     /* @__PURE__ */ jsxs59("div", { children: [
       breadCrumb && /* @__PURE__ */ jsx121(PageHeaderBreadcrumbs, { breadcrumb: breadCrumb }),
       /* @__PURE__ */ jsx121("h1", { css: Css.xl3Sb.$, ...tids.pageTitle, children: pageTitle })
@@ -15381,14 +15392,15 @@ function PageHeader(props) {
 function FormSections(props) {
   const { sectionsWithRefs, formState } = props;
   const tids = useTestIds(props);
-  return /* @__PURE__ */ jsx121("article", { css: Css.gr(2).gc("3 / 4").$, children: sectionsWithRefs.map(({ section, ref, sectionKey }, i) => (
+  const bottomPaddingPx = sectionsWithRefs.length > 1 ? 200 : 0;
+  return /* @__PURE__ */ jsx121("article", { css: Css.gr(2).gc("2 / 3").pbPx(bottomPaddingPx).pr2.$, children: sectionsWithRefs.map(({ section, ref, sectionKey }, i) => (
     // Subgrid here allows for icon placement to the left of the section content
     /* @__PURE__ */ jsxs59(
       "section",
       {
         id: sectionKey,
         ref,
-        css: Css.dg.gtc("50px 1fr").gtr("auto").mb3.add("scrollMarginTop", `${headerHeightPx}px`).$,
+        css: Css.dg.gtc("50px 1fr").gtr("auto").mbPx(72).add("scrollMarginTop", `${headerHeightPx}px`).$,
         ...tids.formSection,
         children: [
           /* @__PURE__ */ jsx121("div", { css: Css.gc(1).$, children: section.icon && /* @__PURE__ */ jsx121(Icon, { icon: section.icon, inc: 3.5 }) }),
@@ -15410,7 +15422,7 @@ function LeftNav(props) {
     [sectionsWithRefs]
   );
   const activeSection = useActiveSection(sectionWithTitles);
-  return /* @__PURE__ */ jsx121("aside", { css: Css.gr(2).gc("2 / 3").sticky.topPx(headerHeightPx).px3.df.fdc.gap1.$, ...tids.nav, children: sectionWithTitles.map((sectionWithRef) => /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx121("aside", { css: Css.gr(2).gc("1 / 2").sticky.topPx(headerHeightPx).px3.df.fdc.gap1.$, ...tids.nav, children: sectionWithTitles.map((sectionWithRef) => /* @__PURE__ */ jsx121(
     SectionNavLink,
     {
       sectionWithRef,
@@ -15455,18 +15467,36 @@ function SectionNavLink(props) {
 }
 function useActiveSection(sectionsWithRefs) {
   const [activeSection, setActiveSection] = useState32(null);
+  const debouncedIntersectionCallback = useDebouncedCallback4(
+    (entries) => {
+      const sectionsInView = entries.filter((entry) => entry.isIntersecting && entry.intersectionRatio > 0.2).sort((a, b) => {
+        const ratioDiff = b.intersectionRatio - a.intersectionRatio;
+        if (Math.abs(ratioDiff) > 0.05) return ratioDiff;
+        const aTop = a.boundingClientRect.top;
+        const bTop = b.boundingClientRect.top;
+        return aTop - bTop;
+      });
+      if (sectionsInView[0]) {
+        setActiveSection(sectionsInView[0].target.id);
+      }
+    },
+    200,
+    { maxWait: 500 }
+  );
   useEffect21(() => {
     if (!("IntersectionObserver" in window)) return;
-    const observer2 = new IntersectionObserver(
-      (entries) => {
-        const sectionsInView = entries.filter((entry) => entry.isIntersecting).sort((a, b) => b.intersectionRatio - a.intersectionRatio);
-        if (sectionsInView[0]) {
-          setActiveSection(sectionsInView[0].target.id);
-        }
-      },
-      // Threshold defines when the observer callback should be triggered, we may need to refine this based on more real word layouts
-      { rootMargin: `-${headerHeightPx}px 0px 0px 0px`, threshold: 0.4 }
-    );
+    const observer2 = new IntersectionObserver((entries) => debouncedIntersectionCallback(entries), {
+      /**
+       * Creating rules to determine when a section is "in view" is a real challenge given the section sizes
+       * are unknown and will likely be mixed (optimizing for large sections makes tracking small sections
+       * more difficult and vice versa). This approach attempts to solve for this by creating a narrowed
+       * "focus zone" trying to approximate where a users attention is likely to be. In this case, blocking
+       * out the top 25% and bottom 35% of the viewport to focus on the middle-top 40%.
+       */
+      rootMargin: "-25% 0px -35% 0px",
+      // Multiple threshold points allow for more granular detection of section visibility
+      threshold: [0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1]
+    });
     sectionsWithRefs.forEach(({ ref }) => {
       if (ref.current) {
         observer2.observe(ref.current);
@@ -15479,7 +15509,7 @@ function useActiveSection(sectionsWithRefs) {
         }
       });
     };
-  }, [sectionsWithRefs]);
+  }, [sectionsWithRefs, debouncedIntersectionCallback]);
   return activeSection;
 }
 
@@ -17861,6 +17891,7 @@ export {
   Palette,
   PresentationProvider,
   PreventBrowserScroll,
+  RIGHT_SIDEBAR_MIN_WIDTH,
   RadioGroupField,
   ResponsiveGrid,
   ResponsiveGridItem,