@geotab/zenith 3.15.0 → 3.16.0-beta.0

package/dist/index.css

@@ -2868,7 +2868,6 @@ html:lang(ar) .zen-accordion {
 }
 .zen-banner__content--multiline {
   flex-direction: column;
-  row-gap: 0.5rem;
 }
 .zen-banner__close-button {
   display: flex;
@@ -2912,6 +2911,8 @@ html:lang(ar) .zen-accordion {
 }
 .zen-banner__block--multiline {
   height: unset;
+  flex-wrap: wrap;
+  padding-block-end: 0.75rem;
 }
 .zen-banner__block--XXL {
   max-width: 100%;
@@ -2936,13 +2937,11 @@ html:lang(ar) .zen-accordion {
   max-width: 22.5rem;
   min-width: 16.75rem;
 }
-.zen-banner__block--multiline {
-  flex-wrap: wrap;
-}
 .zen-banner__multiline-container {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  min-height: 2rem;
   width: 100%;
 }
 .zen-banner__header-container {
@@ -3121,9 +3120,6 @@ html:lang(ar) .zen-banner__message--multiline {
   gap: 0.25rem;
   width: 100%;
 }
-.zen-banner:has(.zen-banner__summary-error-list) .zen-banner__multiline-container {
-  min-height: 2rem;
-}
 .zen-banner .zen-banner__summary-error-link {
   font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
   font-size: 0.875rem;
@@ -3403,6 +3399,29 @@ html:lang(ar) .zen-tooltip__title {
 .zen-shield-faded--visible {
   opacity: 0.1;
 }
+:where(.zen-tooltip-inline-trigger) {
+  font: inherit;
+}
+.zen-tooltip-inline-trigger {
+  display: inline;
+  cursor: pointer;
+  padding: 0;
+  margin: 0;
+  border: none;
+  background: none;
+  color: inherit;
+  text-decoration: underline dotted;
+  text-decoration-thickness: 15%;
+  text-underline-offset: 0.25rem;
+  border-radius: 0.125rem;
+  outline-offset: 0.125rem;
+}
+.zen-tooltip-inline-trigger:focus-visible {
+  outline: 0.125rem solid currentColor;
+}
+.zen-tooltip-inline-trigger:focus:not(:focus-visible) {
+  outline: none;
+}
 .zen-tooltip-info {
   align-items: center;
   cursor: pointer;
@@ -4145,6 +4164,15 @@ html:lang(ar) .zen-side-panel {
 .zen-side-panel--shown .zen-form-field--new-component {
   display: flex;
 }
+.zen-side-panel--right-positioned {
+  transform: translateX(100%);
+}
+[dir="rtl"] .zen-side-panel--right-positioned {
+  transform: translateX(-100%);
+}
+.zen-side-panel.zen-side-panel--right-positioned.zen-side-panel--shown {
+  transform: translateX(0);
+}
 .zen-side-panel--left-positioned {
   inset-inline-start: 0;
   inset-inline-end: auto;
@@ -4154,6 +4182,9 @@ html:lang(ar) .zen-side-panel {
   border-start-end-radius: var(--border-radius-default);
   border-end-end-radius: var(--border-radius-default);
 }
+[dir="rtl"] .zen-side-panel--left-positioned {
+  transform: translateX(100%);
+}
 .zen-side-panel.zen-side-panel--left-positioned.zen-side-panel--shown {
   transform: translateX(0);
 }
@@ -6741,6 +6772,66 @@ html:lang(ar) .zen-table-number {
 .zen-feedExpandControl * {
   box-sizing: border-box;
 }
+.zen-trend-indicator {
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  padding: 0.25rem 0;
+  min-width: 0;
+  max-width: 100%;
+}
+.zen-trend-indicator * {
+  box-sizing: border-box;
+}
+.zen-trend-indicator__icon {
+  flex-shrink: 0;
+}
+.zen-trend-indicator__value {
+  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 0.75rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0.02rem;
+  line-height: 1rem;
+  text-transform: none;
+  text-decoration: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  word-wrap: normal;
+  color: var(--text-primary);
+  min-width: 0;
+}
+html:lang(ar) .zen-trend-indicator__value {
+  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+}
+.zen-trend-indicator__delta {
+  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 0.75rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0.02rem;
+  line-height: 1rem;
+  text-transform: none;
+  text-decoration: none;
+  flex-shrink: 0;
+  margin-inline-start: 0.25rem;
+}
+html:lang(ar) .zen-trend-indicator__delta {
+  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+}
+.zen-trend-indicator--positive .zen-trend-indicator__icon,
+.zen-trend-indicator--positive .zen-trend-indicator__delta {
+  color: var(--accents-success--detail);
+}
+.zen-trend-indicator--negative .zen-trend-indicator__icon,
+.zen-trend-indicator--negative .zen-trend-indicator__delta {
+  color: var(--accents-error--detail);
+}
+.zen-trend-indicator--neutral .zen-trend-indicator__icon,
+.zen-trend-indicator--neutral .zen-trend-indicator__delta {
+  color: var(--text-secondary);
+}
 .zen-summary-tile {
   box-sizing: border-box;
   font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -7594,8 +7685,13 @@ html:lang(ar) .zen-pill-content {
   outline-offset: 2px;
 }
 .zen-pill-actionable__input {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
   position: absolute;
-  left: -5000px;
+  white-space: nowrap;
+  width: 1px;
 }
 .zen-pill-actionable__content-wrapper {
   margin: 0;
@@ -8650,8 +8746,13 @@ html:lang(ar) .zen-chip {
   cursor: pointer;
 }
 .zen-chip__input {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
   position: absolute;
-  left: -5000px;
+  white-space: nowrap;
+  width: 1px;
 }
 .zen-chip__content-wrapper {
   margin: 0;
@@ -15268,6 +15369,9 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-end: calc(2.25rem - 0.375rem);
   background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs__gradient--right::before {
+  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tabs__gradient--right::after {
   position: absolute;
   content: "";
@@ -15295,6 +15399,9 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-start: calc(2.25rem - 0.375rem);
   background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs__gradient--left::after {
+  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tabs__start {
   margin-inline-end: 0.5rem;
   inset-block-end: 0;
@@ -15338,6 +15445,9 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-start: calc(2.875rem - 0.5rem);
   background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--mobile.zen-tabs__gradient--left::after {
+  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--mobile.zen-tabs__gradient--right::before {
   position: absolute;
   content: "";
@@ -15347,6 +15457,9 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-end: calc(2.875rem - 0.5rem);
   background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--mobile.zen-tabs__gradient--right::before {
+  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tabs.zen-tabs--drive,
 .zen-tabs.zen-tabs--drive-tablet {
   height: 3rem;
@@ -15366,6 +15479,10 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-start: calc(3rem - 0.5rem);
   background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive.zen-tabs__gradient--left::after,
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive-tablet.zen-tabs__gradient--left::after {
+  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive.zen-tabs__gradient--right::before,
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive-tablet.zen-tabs__gradient--right::before {
   position: absolute;
@@ -15376,6 +15493,10 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   inset-inline-end: calc(3rem - 0.5rem);
   background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
 }
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive.zen-tabs__gradient--right::before,
+[dir="rtl"] .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive-tablet.zen-tabs__gradient--right::before {
+  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--backgrounds-content-0) 100%);
+}
 .zen-tab-item {
   box-sizing: border-box;
   font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -15564,7 +15685,7 @@ html:lang(ar) .zen-tab-item.zen-tab-item--mobile .zen-tab-item__content-text {
   text-decoration: none;
 }
 .zen-tab-item:focus-visible {
-  outline: 1px solid var(--borders-form-field--active);
+  outline: 1px solid var(--borders-secondary);
   outline-offset: -1px;
 }
 .zen-filters-toolbar {
@@ -17492,6 +17613,10 @@ html:lang(ar) .zen-form-layout-secondary {
   height: 3rem;
   padding: 0.125rem 0.5rem;
 }
+.zen-main-header--mobile .zen-header__section--left {
+  flex-shrink: 1;
+  min-width: 0;
+}
 .zen-main-header--limited-title .zen-page-header__page-name {
   max-width: 6.25rem;
 }
@@ -17500,6 +17625,7 @@ html:lang(ar) .zen-form-layout-secondary {
 }
 .zen-main-header.zen-main-header--shrink-title .zen-header__section--left {
   flex-shrink: 1;
+  min-width: 0;
 }
 .zen-main-header.zen-main-header--mobile-title-large .zen-page-header__page-name {
   max-width: 16.25rem;
@@ -19045,8 +19171,13 @@ html:lang(ar) .zen-pill-actionable__block {
   margin-right: 8px;
 }
 .zen-pill-actionable__input {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
   position: absolute;
-  left: -5000px;
+  white-space: nowrap;
+  width: 1px;
 }
 .zen-pill-actionable__input:hover + .zen-pill-actionable__block--actionable {
   background-color: var(--backgrounds-content-2);

package/dist/index.d.ts

@@ -725,7 +725,7 @@ export { isButton } from "./menu/utils/isButton";
 export { isLink } from "./menu/utils/isLink";
 export { type IMiniTabElement, MiniTabsSize, type IMiniTabs, MiniTabs } from "./miniTabs/miniTabs";
 export { type IMobileSheet, MobileSheet } from "./mobileSheet/mobileSheet";
-export { type TFocusElement, type IModal, Modal, type IDialogContent, DialogContentNew } from "./modal/modal";
+export { MODAL_SCROLL_LOCK_CLASS, type TFocusElement, type IModal, Modal, type IDialogContent, DialogContentNew } from "./modal/modal";
 export { getPredefinedFocusableItem } from "./modal/modalHelpers";
 export { type INotificationProps, Notification } from "./notification/notification";
 export { type IPageHeader, PageHeaderDisplayName, PageHeader } from "./pageHeader/pageHeader";
@@ -778,7 +778,12 @@ export { type IToggleButtonDefaultRaw, type IToggleButtonRaw, type IToggleButton
 export { calculateArrowPosition } from "./tooltip/helpers/calculateArrowPosition";
 export { removeArrowClasses } from "./tooltip/helpers/removeArrowClasses";
 export { type TooltipSize, type TMobileView, Tooltip } from "./tooltip/tooltip";
+export { type TTrendIndicatorDirection, type TTrendIndicatorTone, type ITrendIndicator } from "./trendIndicator/trendIndicator";
+export { getTrendIndicatorDirection } from "./trendIndicator/trendIndicatorUtils";
 export { type IAbortablePromiseOptions, type IAbortablePromiseConstructor, AbortablePromise } from "./utils/abortablePromise";
+export { ZenithExperimentalProvider } from "./utils/experimentalFeatures/experimentalContext";
+export { type ExperimentalFeatureId, EXPERIMENTAL_FLAGS } from "./utils/experimentalFeatures/registry";
+export { useExperimentalFeature } from "./utils/experimentalFeatures/useExperimentalFeature";
 export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvider";
 export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
 export { LanguageProvider } from "./utils/localization/languageProvider";

package/dist/index.js

@@ -16,9 +16,9 @@ exports.IconPinLocation2 = exports.IconPinLocation = exports.IconPinFilled = exp
 exports.IconSettings8 = exports.IconSettings7 = exports.IconSettings6 = exports.IconSettings4 = exports.IconSettings3 = exports.IconSettings2 = exports.IconSettings1 = exports.IconServer3 = exports.IconServer2 = exports.IconServer = exports.IconSend = exports.IconSecuredLines = exports.IconSecured = exports.IconSeatbelt = exports.IconSearchPage = exports.IconSearchLines = exports.IconSearchDocument = exports.IconSearch = exports.IconSdCard = exports.IconRuler = exports.IconRoute = exports.IconRotateRepeat2 = exports.IconRotateRepeat = exports.IconRotateCounterclockwise = exports.IconRotateClockwise = exports.IconResizeSmall = exports.IconResizeBig = exports.IconRepeat2 = exports.IconRepeat = exports.IconRemovePeople = exports.IconRefrigeration = exports.IconRedo2 = exports.IconRedo = exports.IconRecord = exports.IconReceipt = exports.IconRadar = exports.IconQuestion = exports.IconPuzzle = exports.IconPullRequest = exports.IconProcessor = exports.IconPrinter = exports.IconPound = exports.IconPotato = exports.IconPlusSquare = exports.IconPlusLines = exports.IconPlusFile = exports.IconPlusCircle = exports.IconPlus = exports.IconPlay = exports.IconPinLocation3 = void 0;
 exports.IconUsb = exports.IconUpload = exports.IconUnlocked = exports.IconUndock = exports.IconUndo2 = exports.IconUndo = exports.IconUnderline = exports.IconUmbrella = exports.IconTruck = exports.IconTrendNeutral = exports.IconTrailer = exports.IconToggleSmall = exports.IconToggleLarge = exports.IconThumbsUp = exports.IconThumbsDown = exports.IconThermometer = exports.IconThermograph = exports.IconTextSize = exports.IconTelevision2 = exports.IconTelevision = exports.IconTarget3 = exports.IconTarget2 = exports.IconTarget = exports.IconTachographTimeCard = exports.IconTachograph = exports.IconTable = exports.IconSupport = exports.IconSun = exports.IconStrikeThrough = exports.IconStore = exports.IconStorage = exports.IconStopwatch = exports.IconStarFilled = exports.IconStarAi = exports.IconStar = exports.IconSquare = exports.IconSpeaker = exports.IconSortVertical = exports.IconSortHorizontal = exports.IconSort2Vertical = exports.IconSort2Horizontal = exports.IconSmiley = exports.IconSign = exports.IconSidebar = exports.IconShield4 = exports.IconShield3 = exports.IconShield2 = exports.IconShield = exports.IconShare3 = exports.IconShare = void 0;
 exports.ListItem = exports.List = exports.ItemData = exports.ItemCompact = exports.LineChartMini = exports.getDefaultDatasetStyle = exports.htmlLegendPlugin = exports.LEGEND_PLUGIN_ID = exports.LineChart = exports.useLayoutSize = exports.LayoutFullScreenProvider = exports.useLayoutFullScreen = exports.LayoutFullScreenElementProvider = exports.useLayoutFullScreenElement = exports.Layout = exports.ImageTapToUpload = exports.ImageNothingFound = exports.ImageNoMatchingAssets = exports.ImageLooking = exports.ImageCloudUpload = exports.ImageAdjustFilter = exports.IconZoom2 = exports.IconZoom = exports.IconZone = exports.IconYen = exports.IconWrite = exports.IconWrench = exports.IconWorld = exports.IconWorkday = exports.IconWifi2 = exports.IconWifi = exports.IconWhisper = exports.IconWebcam = exports.IconWatch2 = exports.IconWatch = exports.IconWarning = exports.IconWallet1 = exports.IconWallet = exports.IconVolumeOn = exports.IconVolumeOff = exports.IconVolumeMinimum = exports.IconVolumeHalf = exports.IconVolumeFull = exports.IconVolumeDown = exports.IconVoice = exports.IconVisitPage = exports.IconVideoReplay = exports.IconVideo2 = exports.IconVideo = exports.IconUsbHub = void 0;
-exports.Summaries = exports.Stepper = exports.SortControl = exports.SortDirections = exports.Skeleton = exports.LazyContent = exports.SidePanel = exports.CUSTOM_POPUP_COMPONENT_CLASSNAME = exports.SidePanelCloseReason = exports.isChildPopup = exports.SelectField = exports.Select = exports.SearchInput = exports.Range = exports.RadioGroup = exports.Radio = exports.ProgressBar = exports.ProgreesBarSize = exports.ProgressBarType = exports.PrimaryIcon = exports.Popup = exports.PillExpandable = exports.Pill = exports.PaginationType = exports.Pagination = exports.PageLayout = exports.PageContentLayout = exports.PageHeaderMenu = exports.PageHeaderMenuDisplayName = exports.PageHeaderButton = exports.PageHeaderButtonDisplayName = exports.PageHeader = exports.PageHeaderDisplayName = exports.Notification = exports.getPredefinedFocusableItem = exports.DialogContentNew = exports.Modal = exports.MobileSheet = exports.MiniTabs = exports.MiniTabsSize = exports.isLink = exports.isButton = exports.findPrevFocusable = exports.findNextFocusable = exports.findLastFocusable = exports.findFirstFocusable = exports.Menu = exports.ControlledMenu = exports.isDragNotClick = exports.changeOrder = void 0;
-exports.useDrive = exports.ThemeProvider = exports.ThemeDrive = exports.ThemeDark = exports.useLanguage = exports.useDirection = exports.injectString = exports.dictionaries = exports.LanguageProvider = exports.getFirstFocusableItem = exports.getNewFocusableItem = exports.HeaderButtonsProvider = exports.AbortablePromise = exports.Tooltip = exports.removeArrowClasses = exports.calculateArrowPosition = exports.ToggleButtonRaw = exports.ToggleButton = exports.Toast = exports.useToast = exports.TimePicker = exports.TextareaRaw = exports.Textarea = exports.TextInputRaw = exports.TextInput = exports.TextIconButton = exports.ButtonIconPosition = exports.Tabs = exports.TabsDisplayName = exports.ActionLinkColumn = exports.CheckboxColumn = exports.MainColumn = exports.ActionsColumn = exports.getSortableValue = exports.ColumnSortDirection = exports.getEmptySelection = exports.Table = exports.useNestedRows = exports.NestedData = exports.TabBarContent = exports.TabBar = exports.SummaryTileBarDisplayName = exports.SummaryTileBar = exports.getTypeClassName = exports.SummaryTileTrigger = exports.SummaryTile = exports.SummaryTileDisplayName = exports.SummaryTileSize = exports.SummaryTileType = exports.Summary = void 0;
-exports.Waiting = exports.UserFormatProvider = void 0;
+exports.Stepper = exports.SortControl = exports.SortDirections = exports.Skeleton = exports.LazyContent = exports.SidePanel = exports.CUSTOM_POPUP_COMPONENT_CLASSNAME = exports.SidePanelCloseReason = exports.isChildPopup = exports.SelectField = exports.Select = exports.SearchInput = exports.Range = exports.RadioGroup = exports.Radio = exports.ProgressBar = exports.ProgreesBarSize = exports.ProgressBarType = exports.PrimaryIcon = exports.Popup = exports.PillExpandable = exports.Pill = exports.PaginationType = exports.Pagination = exports.PageLayout = exports.PageContentLayout = exports.PageHeaderMenu = exports.PageHeaderMenuDisplayName = exports.PageHeaderButton = exports.PageHeaderButtonDisplayName = exports.PageHeader = exports.PageHeaderDisplayName = exports.Notification = exports.getPredefinedFocusableItem = exports.DialogContentNew = exports.Modal = exports.MODAL_SCROLL_LOCK_CLASS = exports.MobileSheet = exports.MiniTabs = exports.MiniTabsSize = exports.isLink = exports.isButton = exports.findPrevFocusable = exports.findNextFocusable = exports.findLastFocusable = exports.findFirstFocusable = exports.Menu = exports.ControlledMenu = exports.isDragNotClick = exports.changeOrder = void 0;
+exports.useDirection = exports.injectString = exports.dictionaries = exports.LanguageProvider = exports.getFirstFocusableItem = exports.getNewFocusableItem = exports.HeaderButtonsProvider = exports.useExperimentalFeature = exports.EXPERIMENTAL_FLAGS = exports.ZenithExperimentalProvider = exports.AbortablePromise = exports.getTrendIndicatorDirection = exports.Tooltip = exports.removeArrowClasses = exports.calculateArrowPosition = exports.ToggleButtonRaw = exports.ToggleButton = exports.Toast = exports.useToast = exports.TimePicker = exports.TextareaRaw = exports.Textarea = exports.TextInputRaw = exports.TextInput = exports.TextIconButton = exports.ButtonIconPosition = exports.Tabs = exports.TabsDisplayName = exports.ActionLinkColumn = exports.CheckboxColumn = exports.MainColumn = exports.ActionsColumn = exports.getSortableValue = exports.ColumnSortDirection = exports.getEmptySelection = exports.Table = exports.useNestedRows = exports.NestedData = exports.TabBarContent = exports.TabBar = exports.SummaryTileBarDisplayName = exports.SummaryTileBar = exports.getTypeClassName = exports.SummaryTileTrigger = exports.SummaryTile = exports.SummaryTileDisplayName = exports.SummaryTileSize = exports.SummaryTileType = exports.Summary = exports.Summaries = void 0;
+exports.Waiting = exports.UserFormatProvider = exports.useDrive = exports.ThemeProvider = exports.ThemeDrive = exports.ThemeDark = exports.useLanguage = void 0;
 /* eslint-disable max-len */
 var absolute_1 = require("./absolute/absolute");
 Object.defineProperty(exports, "Absolute", { enumerable: true, get: function () { return absolute_1.Absolute; } });
@@ -1546,6 +1546,7 @@ Object.defineProperty(exports, "MiniTabs", { enumerable: true, get: function ()
 var mobileSheet_1 = require("./mobileSheet/mobileSheet");
 Object.defineProperty(exports, "MobileSheet", { enumerable: true, get: function () { return mobileSheet_1.MobileSheet; } });
 var modal_1 = require("./modal/modal");
+Object.defineProperty(exports, "MODAL_SCROLL_LOCK_CLASS", { enumerable: true, get: function () { return modal_1.MODAL_SCROLL_LOCK_CLASS; } });
 Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return modal_1.Modal; } });
 Object.defineProperty(exports, "DialogContentNew", { enumerable: true, get: function () { return modal_1.DialogContentNew; } });
 var modalHelpers_1 = require("./modal/modalHelpers");
@@ -1670,8 +1671,16 @@ var removeArrowClasses_1 = require("./tooltip/helpers/removeArrowClasses");
 Object.defineProperty(exports, "removeArrowClasses", { enumerable: true, get: function () { return removeArrowClasses_1.removeArrowClasses; } });
 var tooltip_1 = require("./tooltip/tooltip");
 Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return tooltip_1.Tooltip; } });
+var trendIndicatorUtils_1 = require("./trendIndicator/trendIndicatorUtils");
+Object.defineProperty(exports, "getTrendIndicatorDirection", { enumerable: true, get: function () { return trendIndicatorUtils_1.getTrendIndicatorDirection; } });
 var abortablePromise_1 = require("./utils/abortablePromise");
 Object.defineProperty(exports, "AbortablePromise", { enumerable: true, get: function () { return abortablePromise_1.AbortablePromise; } });
+var experimentalContext_1 = require("./utils/experimentalFeatures/experimentalContext");
+Object.defineProperty(exports, "ZenithExperimentalProvider", { enumerable: true, get: function () { return experimentalContext_1.ZenithExperimentalProvider; } });
+var registry_1 = require("./utils/experimentalFeatures/registry");
+Object.defineProperty(exports, "EXPERIMENTAL_FLAGS", { enumerable: true, get: function () { return registry_1.EXPERIMENTAL_FLAGS; } });
+var useExperimentalFeature_1 = require("./utils/experimentalFeatures/useExperimentalFeature");
+Object.defineProperty(exports, "useExperimentalFeature", { enumerable: true, get: function () { return useExperimentalFeature_1.useExperimentalFeature; } });
 var headerButtonsProvider_1 = require("./utils/headerButtons/headerButtonsProvider");
 Object.defineProperty(exports, "HeaderButtonsProvider", { enumerable: true, get: function () { return headerButtonsProvider_1.HeaderButtonsProvider; } });
 var keyboardHelpers_1 = require("./utils/keyboardHelpers");

package/dist/modal/modal.d.ts

@@ -4,6 +4,11 @@ import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import { IIcon } from "../icons/icon";
 import { TButtonIconPosition } from "../textIconButton/textIconButton";
 import { TSvgIconSize } from "../svgIcon/svgIconSize";
+/**
+ * The CSS class applied to `document.body` while a Modal is open to prevent page scrolling.
+ * Exported so consumers can reference it without coupling to internal implementation details.
+ */
+export declare const MODAL_SCROLL_LOCK_CLASS = "zen-modal-content--hidden-overflow";
 interface IButtonIconProps {
     icon?: React.FC<IIcon>;
     iconPosition?: TButtonIconPosition;
@@ -38,6 +43,49 @@ export interface IModal {
     className?: string;
     modalContainerClassName?: string;
     focus?: TFocusElement;
+    /**
+     * Called once the body scroll-lock has been synchronously released after the modal closes.
+     * Use this to safely sequence scroll operations that depend on the modal being fully closed.
+     *
+     * **Triggers:** the callback fires in two scenarios:
+     * - `isOpen` transitions from `true` to `false` (normal close)
+     * - The component unmounts while `isOpen` is still `true` (e.g. conditional rendering with
+     *   `{condition && <Modal isOpen={true} ... />}` where `condition` flips to `false`)
+     *
+     * It is **not** called when the modal mounts already closed, or when `isOpen` remains `false`
+     * across re-renders.
+     *
+     * **Layout-phase timing:** this callback fires inside a `useLayoutEffect` cleanup, which runs
+     * synchronously before the browser paints. This makes it safe for DOM reads and imperative
+     * scroll operations. However, calling `setState` inside this callback will trigger an
+     * additional synchronous re-render before the next paint — prefer keeping the callback
+     * side-effect-free or deferring state updates with `setTimeout`/`queueMicrotask` if needed.
+     *
+     * **React Strict Mode (development only):** React 18 Strict Mode intentionally
+     * double-invokes effects on mount (setup → cleanup → setup) to surface side-effect bugs.
+     * If `isOpen` is `true` on initial render, the cleanup from the first (discarded) mount
+     * fires with `wasOpen.current = true`, which triggers this callback once at mount even
+     * though the modal has not closed. This is a dev-mode artefact and does not occur in
+     * production builds.
+     *
+     * @example
+     * ```tsx
+     * // Safe: imperative scroll (no state update)
+     * <Modal
+     *   isOpen={isOpen}
+     *   onScrollLockReleased={() => window.scrollTo({ top: newSectionOffset, behavior: "smooth" })}
+     *   ...
+     * />
+     *
+     * // Use caution: setState inside the callback causes a synchronous re-render before paint
+     * <Modal
+     *   isOpen={isOpen}
+     *   onScrollLockReleased={() => setScrollTarget(newSectionOffset)}
+     *   ...
+     * />
+     * ```
+     */
+    onScrollLockReleased?: () => void;
 }
 export declare const Modal: FC<IModal> & {
     Content: FC<IDialogContent>;

package/dist/modal/modal.js

@@ -47,7 +47,7 @@ var __importStar = this && this.__importStar || function () {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DialogContentNew = exports.Modal = void 0;
+exports.DialogContentNew = exports.Modal = exports.MODAL_SCROLL_LOCK_CLASS = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable @typescript-eslint/naming-convention */
 injectString("cs", "Close", "Zav\u0159\xEDt");
@@ -104,6 +104,11 @@ const textIconButton_1 = require("../textIconButton/textIconButton");
 const useClientReady_1 = require("../commonHelpers/hooks/useClientReady");
 const zen_1 = require("../utils/zen");
 const react_dom_1 = require("react-dom");
+/**
+ * The CSS class applied to `document.body` while a Modal is open to prevent page scrolling.
+ * Exported so consumers can reference it without coupling to internal implementation details.
+ */
+exports.MODAL_SCROLL_LOCK_CLASS = "zen-modal-content--hidden-overflow";
 const Modal = ({
   isOpen,
   children,
@@ -114,7 +119,8 @@ const Modal = ({
   type,
   className,
   focus,
-  modalContainerClassName
+  modalContainerClassName,
+  onScrollLockReleased
 }) => {
   var _a, _b, _c;
   const lastActiveOutsideElement = (0, react_1.useRef)((_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.activeElement);
@@ -123,6 +129,14 @@ const Modal = ({
     dark
   } = (0, react_1.useContext)(themeContext_1.themeContext);
   const isClientReady = (0, useClientReady_1.useClientReady)();
+  // Tracks whether the modal was open on the previous render so we can detect open→closed transitions.
+  const wasOpen = (0, react_1.useRef)(false);
+  // Keep the latest callback in a ref so it never needs to enter the useLayoutEffect deps array.
+  // Assigning directly in the render body (rather than via a sync effect) guarantees the ref is
+  // always current before any effects or cleanups run in the same commit — eliminating the stale
+  // callback edge case that occurred when isOpen and onScrollLockReleased changed simultaneously.
+  const onScrollLockReleasedRef = (0, react_1.useRef)(onScrollLockReleased);
+  onScrollLockReleasedRef.current = onScrollLockReleased;
   const onOutSideClick = (0, react_1.useCallback)(() => {
     if (!isClientReady) {
       return;
@@ -141,19 +155,35 @@ const Modal = ({
       (0, dialogHelpers_1.isFocusable)(copyActive) && copyActive.focus();
     };
   }, [isClientReady]);
-  (0, react_1.useEffect)(() => {
+  // useLayoutEffect runs synchronously after DOM mutations, before the browser paints.
+  // This guarantees the scroll-lock class is removed (and onScrollLockReleased fires)
+  // before the browser repaints — eliminating the timing gap that existed with useEffect.
+  // onScrollLockReleased is intentionally excluded from deps: it is read via ref so that
+  // inline arrow functions passed by consumers do not cause redundant DOM mutations on
+  // every parent re-render while the modal is open.
+  (0, react_1.useLayoutEffect)(() => {
     var _a, _b;
     if (!isClientReady) {
       return undefined;
     }
-    (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.classList.remove("zen-modal-content--hidden-overflow");
+    (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.classList.remove(exports.MODAL_SCROLL_LOCK_CLASS);
     if (isOpen) {
-      (_b = zen_1.zen.document) === null || _b === void 0 ? void 0 : _b.body.classList.add("zen-modal-content--hidden-overflow");
+      wasOpen.current = true;
+      (_b = zen_1.zen.document) === null || _b === void 0 ? void 0 : _b.body.classList.add(exports.MODAL_SCROLL_LOCK_CLASS);
     }
     return () => {
-      var _a;
-      (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.classList.remove("zen-modal-content--hidden-overflow");
+      var _a, _b;
+      (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.classList.remove(exports.MODAL_SCROLL_LOCK_CLASS);
+      // Fire the callback in cleanup so it is triggered in both cases:
+      //   1. isOpen prop transitions true → false
+      //   2. component unmounts while isOpen is still true
+      // wasOpen guards against spurious calls (e.g. closing an already-closed modal).
+      if (wasOpen.current) {
+        wasOpen.current = false;
+        (_b = onScrollLockReleasedRef.current) === null || _b === void 0 ? void 0 : _b.call(onScrollLockReleasedRef);
+      }
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isClientReady, isOpen]);
   (0, react_1.useEffect)(() => {
     var _a, _b;

package/dist/nav/navHeader/navHeader.d.ts

@@ -28,7 +28,7 @@ export declare const NavHeader: FC<INavHeader> & {
      * @deprecated Use NavItem instead. Will be removed in future releases.
      */
     Action: {
-        (props: import("../navItem/navItem").ILinkNavItem | import("../navItem/navItem").IButtonNavItem): import("react/jsx-runtime").JSX.Element;
+        (props: import("../navItem/navItem").ILinkNavItem | import("../navItem/navItem").TButtonNavItem): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Search: {

package/dist/nav/navHeader/navHeaderSearch/navHeaderSearch.js

@@ -136,7 +136,7 @@ const NavHeaderSearch = ({
       onClick: () => onSearchToggle === null || onSearchToggle === void 0 ? void 0 : onSearchToggle(true),
       tooltipAlignment: collapsed ? "end" : "bottom"
     }) : null, searchOpen || isMobile ? (0, jsx_runtime_1.jsx)(searchInput_1.SearchInput, {
-      autoFocus: true,
+      autoFocus: searchOpen,
       ariaLabel: translate("Search"),
       value: searchTerm,
       placeholder: translate("Search"),

package/dist/nav/navItem/navItem.d.ts

@@ -26,11 +26,24 @@ interface INavItemCommon extends IZenComponentProps {
 export interface ILinkNavItem extends INavItemCommon {
     link: string;
 }
-export interface IButtonNavItem extends INavItemCommon {
+interface IButtonNavItemBase extends INavItemCommon {
     onClick?: () => void;
     menuAlignment?: TAlignment;
     onDropdownStateChange?: (isOpen: boolean) => void;
 }
+export type TNavItemPopupType = "dialog" | "menu" | "listbox" | "tree" | "grid";
+export interface IPopupButtonNavItem extends IButtonNavItemBase {
+    popupId: string;
+    isPopupOpen: boolean;
+    popupType?: TNavItemPopupType;
+    children?: never;
+}
+interface IPlainButtonNavItem extends IButtonNavItemBase {
+    popupId?: never;
+    isPopupOpen?: never;
+    popupType?: never;
+}
+export type TButtonNavItem = IPlainButtonNavItem | IPopupButtonNavItem;
 interface INavItemContext {
     parentLevel?: number;
     closeParentMenu?: () => void;
@@ -40,7 +53,7 @@ export declare const NavItemContext: import("react").Context<INavItemContext>;
  * @beta This component is not fully ready yet and may change in future releases.
  */
 export declare const NavItem: {
-    (props: ILinkNavItem | IButtonNavItem): import("react/jsx-runtime").JSX.Element;
+    (props: ILinkNavItem | TButtonNavItem): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};