@geotab/zenith 3.15.0 → 3.16.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +21 -0
- package/dist/absolute/absolute.js +1 -1
- package/dist/betaPill/betaPill.js +9 -9
- package/dist/commonHelpers/arrowNavigation/arrowNavigationHelper.d.ts +1 -0
- package/dist/commonHelpers/arrowNavigation/arrowNavigationHelper.js +5 -1
- package/dist/commonHelpers/hooks/useTrapFocus.d.ts +9 -0
- package/dist/commonHelpers/hooks/useTrapFocus.js +66 -14
- package/dist/controlledPopup/controlledPopup.d.ts +1 -1
- package/dist/controlledPopup/controlledPopup.js +1 -1
- package/dist/dropdownRaw/dropdownSearchableTrigger.js +1 -1
- package/dist/filtersBar/components/filtersBarRange/filtersBarRange.d.ts +1 -1
- package/dist/filtersBar/filtersBarSidePanel/components/filtersBarSidePanelRange/filtersBarSidePanelRange.d.ts +1 -1
- package/dist/filtersBar/filtersBarSidePanel/components/filtersBarSidePanelRange/filtersBarSidePanelRange.js +8 -5
- package/dist/filtersBar/filtersContainer/filtersContainer.js +7 -4
- package/dist/header/header.js +9 -2
- package/dist/header/headerHelpers.js +8 -5
- package/dist/index.css +142 -11
- package/dist/index.d.ts +6 -1
- package/dist/index.js +12 -3
- package/dist/modal/modal.d.ts +48 -0
- package/dist/modal/modal.js +37 -7
- package/dist/nav/navHeader/navHeader.d.ts +1 -1
- package/dist/nav/navHeader/navHeaderSearch/navHeaderSearch.js +1 -1
- package/dist/nav/navItem/navItem.d.ts +15 -2
- package/dist/nav/navItem/navItem.js +49 -7
- package/dist/nav/utils/navUtils.d.ts +2 -2
- package/dist/pillExpandable/pillExpandable.js +6 -3
- package/dist/rangeRaw/components/rangeField.d.ts +2 -1
- package/dist/rangeRaw/components/rangeField.js +4 -3
- package/dist/rangeRaw/rangeRaw.js +8 -5
- package/dist/rangeRaw/types.d.ts +1 -0
- package/dist/sidePanel/sidePanel.js +3 -2
- package/dist/table/selectable/interfaces.d.ts +13 -0
- package/dist/table/selectable/useSelectableRows.js +46 -12
- package/dist/table/selectable/utils/calculateSelectionState.js +35 -0
- package/dist/table/selectable/utils/isRowChecked.js +12 -1
- package/dist/table/table.d.ts +2 -0
- package/dist/table/table.js +3 -1
- package/dist/tabs/tabs.js +14 -5
- package/dist/textInputRaw/textInputRaw.js +1 -1
- package/dist/textInputRaw/types.d.ts +1 -0
- package/dist/tooltip/components/inlineTrigger.d.ts +43 -0
- package/dist/tooltip/components/inlineTrigger.js +42 -0
- package/dist/tooltip/tooltip.d.ts +5 -2
- package/dist/tooltip/tooltip.js +15 -4
- package/dist/trendIndicator/trendIndicator.d.ts +47 -0
- package/dist/trendIndicator/trendIndicator.js +47 -0
- package/dist/trendIndicator/trendIndicatorUtils.d.ts +9 -0
- package/dist/trendIndicator/trendIndicatorUtils.js +18 -0
- package/dist/utils/experimentalFeatures/experimentalContext.d.ts +17 -0
- package/dist/utils/experimentalFeatures/experimentalContext.js +29 -0
- package/dist/utils/experimentalFeatures/index.d.ts +4 -0
- package/dist/utils/experimentalFeatures/index.js +9 -0
- package/dist/utils/experimentalFeatures/registry.d.ts +13 -0
- package/dist/utils/experimentalFeatures/registry.js +11 -0
- package/dist/utils/experimentalFeatures/useExperimentalFeature.d.ts +3 -0
- package/dist/utils/experimentalFeatures/useExperimentalFeature.js +25 -0
- package/dist/utils/localization/translations/ar.json +1 -1
- package/dist/utils/localization/translations/bg-BG.json +1 -1
- package/dist/utils/localization/translations/cs.json +1 -1
- package/dist/utils/localization/translations/da-DK.json +1 -1
- package/dist/utils/localization/translations/de.json +1 -1
- package/dist/utils/localization/translations/el-GR.json +1 -1
- package/dist/utils/localization/translations/en.json +1 -1
- package/dist/utils/localization/translations/es.json +1 -1
- package/dist/utils/localization/translations/et-EE.json +1 -1
- package/dist/utils/localization/translations/fi-FI.json +1 -1
- package/dist/utils/localization/translations/fr-FR.json +1 -1
- package/dist/utils/localization/translations/fr.json +1 -1
- package/dist/utils/localization/translations/hu-HU.json +1 -1
- package/dist/utils/localization/translations/id.json +1 -1
- package/dist/utils/localization/translations/it.json +1 -1
- package/dist/utils/localization/translations/ja.json +1 -1
- package/dist/utils/localization/translations/ka-GE.json +1 -1
- package/dist/utils/localization/translations/ko-KR.json +1 -1
- package/dist/utils/localization/translations/lt-LT.json +1 -1
- package/dist/utils/localization/translations/lv-LV.json +1 -1
- package/dist/utils/localization/translations/ms.json +1 -1
- package/dist/utils/localization/translations/nb-NO.json +1 -1
- package/dist/utils/localization/translations/nl.json +1 -1
- package/dist/utils/localization/translations/pl.json +1 -1
- package/dist/utils/localization/translations/pt-BR.json +1 -1
- package/dist/utils/localization/translations/pt-PT.json +1 -1
- package/dist/utils/localization/translations/ro-RO.json +1 -1
- package/dist/utils/localization/translations/sk-SK.json +1 -1
- package/dist/utils/localization/translations/sv.json +1 -1
- package/dist/utils/localization/translations/th.json +1 -1
- package/dist/utils/localization/translations/tr.json +1 -1
- package/dist/utils/localization/translations/zh-Hans.json +1 -1
- package/dist/utils/localization/translations/zh-TW.json +1 -1
- package/esm/absolute/absolute.js +1 -1
- package/esm/betaPill/betaPill.js +9 -9
- package/esm/commonHelpers/arrowNavigation/arrowNavigationHelper.d.ts +1 -0
- package/esm/commonHelpers/arrowNavigation/arrowNavigationHelper.js +3 -0
- package/esm/commonHelpers/hooks/useTrapFocus.d.ts +9 -0
- package/esm/commonHelpers/hooks/useTrapFocus.js +67 -15
- package/esm/controlledPopup/controlledPopup.d.ts +1 -1
- package/esm/controlledPopup/controlledPopup.js +1 -1
- package/esm/dropdownRaw/dropdownSearchableTrigger.js +1 -1
- package/esm/filtersBar/components/filtersBarRange/filtersBarRange.d.ts +1 -1
- package/esm/filtersBar/filtersBarSidePanel/components/filtersBarSidePanelRange/filtersBarSidePanelRange.d.ts +1 -1
- package/esm/filtersBar/filtersBarSidePanel/components/filtersBarSidePanelRange/filtersBarSidePanelRange.js +8 -5
- package/esm/filtersBar/filtersContainer/filtersContainer.js +7 -4
- package/esm/header/header.js +9 -2
- package/esm/header/headerHelpers.js +8 -5
- package/esm/index.d.ts +6 -1
- package/esm/index.js +5 -1
- package/esm/modal/modal.d.ts +48 -0
- package/esm/modal/modal.js +37 -7
- package/esm/nav/navHeader/navHeader.d.ts +1 -1
- package/esm/nav/navHeader/navHeaderSearch/navHeaderSearch.js +1 -1
- package/esm/nav/navItem/navItem.d.ts +15 -2
- package/esm/nav/navItem/navItem.js +49 -7
- package/esm/nav/utils/navUtils.d.ts +2 -2
- package/esm/pillExpandable/pillExpandable.js +6 -3
- package/esm/rangeRaw/components/rangeField.d.ts +2 -1
- package/esm/rangeRaw/components/rangeField.js +4 -3
- package/esm/rangeRaw/rangeRaw.js +8 -5
- package/esm/rangeRaw/types.d.ts +1 -0
- package/esm/sidePanel/sidePanel.js +3 -2
- package/esm/table/selectable/interfaces.d.ts +13 -0
- package/esm/table/selectable/useSelectableRows.js +46 -12
- package/esm/table/selectable/utils/calculateSelectionState.js +35 -0
- package/esm/table/selectable/utils/isRowChecked.js +12 -1
- package/esm/table/table.d.ts +2 -0
- package/esm/table/table.js +2 -0
- package/esm/tabs/tabs.js +14 -5
- package/esm/testHelpers/renderWithFeatures.d.ts +4 -0
- package/esm/testHelpers/renderWithFeatures.js +6 -0
- package/esm/textInputRaw/textInputRaw.js +1 -1
- package/esm/textInputRaw/types.d.ts +1 -0
- package/esm/tooltip/components/inlineTrigger.d.ts +43 -0
- package/esm/tooltip/components/inlineTrigger.js +38 -0
- package/esm/tooltip/tooltip.d.ts +5 -2
- package/esm/tooltip/tooltip.js +15 -4
- package/esm/trendIndicator/trendIndicator.d.ts +47 -0
- package/esm/trendIndicator/trendIndicator.js +43 -0
- package/esm/trendIndicator/trendIndicatorUtils.d.ts +9 -0
- package/esm/trendIndicator/trendIndicatorUtils.js +14 -0
- package/esm/utils/experimentalFeatures/experimentalContext.d.ts +17 -0
- package/esm/utils/experimentalFeatures/experimentalContext.js +25 -0
- package/esm/utils/experimentalFeatures/index.d.ts +4 -0
- package/esm/utils/experimentalFeatures/index.js +3 -0
- package/esm/utils/experimentalFeatures/registry.d.ts +13 -0
- package/esm/utils/experimentalFeatures/registry.js +8 -0
- package/esm/utils/experimentalFeatures/useExperimentalFeature.d.ts +3 -0
- package/esm/utils/experimentalFeatures/useExperimentalFeature.js +21 -0
- package/esm/utils/localization/translations/ar.json +1 -1
- package/esm/utils/localization/translations/bg-BG.json +1 -1
- package/esm/utils/localization/translations/cs.json +1 -1
- package/esm/utils/localization/translations/da-DK.json +1 -1
- package/esm/utils/localization/translations/de.json +1 -1
- package/esm/utils/localization/translations/el-GR.json +1 -1
- package/esm/utils/localization/translations/en.json +1 -1
- package/esm/utils/localization/translations/es.json +1 -1
- package/esm/utils/localization/translations/et-EE.json +1 -1
- package/esm/utils/localization/translations/fi-FI.json +1 -1
- package/esm/utils/localization/translations/fr-FR.json +1 -1
- package/esm/utils/localization/translations/fr.json +1 -1
- package/esm/utils/localization/translations/hu-HU.json +1 -1
- package/esm/utils/localization/translations/id.json +1 -1
- package/esm/utils/localization/translations/it.json +1 -1
- package/esm/utils/localization/translations/ja.json +1 -1
- package/esm/utils/localization/translations/ka-GE.json +1 -1
- package/esm/utils/localization/translations/ko-KR.json +1 -1
- package/esm/utils/localization/translations/lt-LT.json +1 -1
- package/esm/utils/localization/translations/lv-LV.json +1 -1
- package/esm/utils/localization/translations/ms.json +1 -1
- package/esm/utils/localization/translations/nb-NO.json +1 -1
- package/esm/utils/localization/translations/nl.json +1 -1
- package/esm/utils/localization/translations/pl.json +1 -1
- package/esm/utils/localization/translations/pt-BR.json +1 -1
- package/esm/utils/localization/translations/pt-PT.json +1 -1
- package/esm/utils/localization/translations/ro-RO.json +1 -1
- package/esm/utils/localization/translations/sk-SK.json +1 -1
- package/esm/utils/localization/translations/sv.json +1 -1
- package/esm/utils/localization/translations/th.json +1 -1
- package/esm/utils/localization/translations/tr.json +1 -1
- package/esm/utils/localization/translations/zh-Hans.json +1 -1
- package/esm/utils/localization/translations/zh-TW.json +1 -1
- package/package.json +36 -16
- package/dist/banner/utils/isBannerTarget.d.ts +0 -1
- package/dist/banner/utils/isBannerTarget.js +0 -11
- package/esm/banner/utils/isBannerTarget.d.ts +0 -1
- package/esm/banner/utils/isBannerTarget.js +0 -7
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"Go to My Reports": "Eiti į mano ataskaitas",
|
|
93
93
|
"There was an issue preparing your report": "Rengiant ataskaitą įvyko klaida",
|
|
94
94
|
"Your report is being prepared": "Jūsų ataskaita rengiama",
|
|
95
|
-
"
|
|
95
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Pranešime, kai ataskaita bus paruošta. Pažangą galite stebėti puslapyje Mano ataskaitos.",
|
|
96
96
|
"Your report is ready to download": "Jūsų ataskaita paruošta atsisiųsti",
|
|
97
97
|
"Download now": "Atsisiųsti dabar",
|
|
98
98
|
"Download": "Atsisiųsti",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"Go to My Reports": "Doties uz manām atskaitēm",
|
|
93
93
|
"There was an issue preparing your report": "Sagatavojot atskaiti, radās problēma",
|
|
94
94
|
"Your report is being prepared": "Jūsu atskaite tiek sagatavota",
|
|
95
|
-
"
|
|
95
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Paziņosim, kad atskaite būs gatava. Progresu varat sekot lapā Manas atskaites.",
|
|
96
96
|
"Your report is ready to download": "Jūsu atskaite ir gatava lejupielādei",
|
|
97
97
|
"Download now": "Lejupielādēt tagad",
|
|
98
98
|
"Download": "Lejupielādēt",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Semua",
|
|
82
82
|
"There was an issue preparing your report": "Terdapat isu ketika menyediakan laporan anda",
|
|
83
83
|
"Your report is being prepared": "Laporan anda sedang disediakan",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Kami akan memaklumi anda apabila laporan anda siap. Anda boleh menjejaki kemajuan proses ini pada halaman Laporan Saya.",
|
|
85
85
|
"Your report is ready to download": "Laporan anda sedia untuk dimuat turun",
|
|
86
86
|
"Download now": "Muat turun sekarang",
|
|
87
87
|
"Download": "Muat Turun",
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"Go to My Reports": "Gå til Mine rapporter",
|
|
89
89
|
"There was an issue preparing your report": "Noe gikk galt med å forberede rapporten din.",
|
|
90
90
|
"Your report is being prepared": "Rapporten din er under arbeid.",
|
|
91
|
-
"
|
|
91
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Vi gir deg beskjed når rapporten er klar. Du kan følge med på fremdriften på siden Mine rapporter.",
|
|
92
92
|
"Your report is ready to download": "Rapporten er klar for nedlasting",
|
|
93
93
|
"Download now": "Last ned nå",
|
|
94
94
|
"Download": "Last ned",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Alle",
|
|
82
82
|
"There was an issue preparing your report": "Er is een probleem opgetreden bij het voorbereiden van uw rapport",
|
|
83
83
|
"Your report is being prepared": "Uw rapport wordt voorbereid",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "We zullen u op de hoogte stellen wanneer uw rapport klaar is. U kunt de voortgang volgen door naar de pagina Mijn rapporten te gaan.",
|
|
85
85
|
"Your report is ready to download": "Uw rapport is gereed voor downloaden",
|
|
86
86
|
"Download now": "Download nu",
|
|
87
87
|
"Download": "Downloaden",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Wszystkie",
|
|
82
82
|
"There was an issue preparing your report": "Wystąpił problem podczas przygotowywania raportu",
|
|
83
83
|
"Your report is being prepared": "Trwa przygotowywanie raportu",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Powiadomimy Cię, gdy raport będzie gotowy. Postęp można śledzić na stronie Moje raporty.",
|
|
85
85
|
"Your report is ready to download": "Raport jest gotowy do pobrania.",
|
|
86
86
|
"Download now": "Pobierz teraz",
|
|
87
87
|
"Download": "Pobierz",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Tudo",
|
|
82
82
|
"There was an issue preparing your report": "Houve um problema ao preparar seu relatório",
|
|
83
83
|
"Your report is being prepared": "Seu relatório está sendo preparado",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Enviaremos uma notificação quando seu relatório estiver pronto. Você pode acompanhar o progresso acessando a página Meus relatórios.",
|
|
85
85
|
"Your report is ready to download": "Seu relatório está pronto para download",
|
|
86
86
|
"Download now": "Baixar agora",
|
|
87
87
|
"Download": "Download",
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
"Go to My Reports": "Ir para Os meus relatórios",
|
|
91
91
|
"There was an issue preparing your report": "Ocorreu um problema ao preparar o relatório",
|
|
92
92
|
"Your report is being prepared": "O relatório está a ser preparado",
|
|
93
|
-
"
|
|
93
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Notificá-lo-emos quando o seu relatório estiver pronto. Pode acompanhar o progresso na página Os meus relatórios.",
|
|
94
94
|
"Your report is ready to download": "O relatório está pronto para transferência",
|
|
95
95
|
"Download now": "Transferir agora",
|
|
96
96
|
"Download": "Download",
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
"Go to My Reports": "Accesați Rapoartele mele",
|
|
91
91
|
"There was an issue preparing your report": "A apărut o problemă la pregătirea raportului",
|
|
92
92
|
"Your report is being prepared": "Raportul este în curs de pregătire",
|
|
93
|
-
"
|
|
93
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Vă vom înștiința când raportul este gata. Puteți urmări evoluția accesând pagina Rapoartele mele.",
|
|
94
94
|
"Your report is ready to download": "Raportul dvs. este gata de descărcare",
|
|
95
95
|
"Download now": "Descărcați acum",
|
|
96
96
|
"Download": "Descărcați",
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"Go to My Reports": "Prejdi na Moje správy.",
|
|
89
89
|
"There was an issue preparing your report": "Pri príprave tvojej správy nastal problém.",
|
|
90
90
|
"Your report is being prepared": "Tvoja správa sa pripravuje.",
|
|
91
|
-
"
|
|
91
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Dáme ti vedieť, keď bude tvoja správa pripravená. Postup môžeš sledovať na stránke Moje správy.",
|
|
92
92
|
"Your report is ready to download": "Tvoja správa je pripravená na stiahnutie",
|
|
93
93
|
"Download now": "Stiahnuť teraz",
|
|
94
94
|
"Download": "Stiahni",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Alla",
|
|
82
82
|
"There was an issue preparing your report": "Det uppstod ett problem när din rapport skulle förberedas",
|
|
83
83
|
"Your report is being prepared": "Din rapport förbereds",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Du får ett meddelande när din rapport är klar. Du kan spåra rapportens status genom att gå till sidan Mina rapporter.",
|
|
85
85
|
"Your report is ready to download": "Nu kan du ladda ner din rapport",
|
|
86
86
|
"Download now": "Ladda ner nu",
|
|
87
87
|
"Download": "Ladda ned",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "ทั้งหมด",
|
|
82
82
|
"There was an issue preparing your report": "มีปัญหาในการเตรียมรายงานของคุณ",
|
|
83
83
|
"Your report is being prepared": "กำลังเตรียมรายงานของคุณ",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "เราจะแจ้งให้คุณทราบเมื่อรายงานของคุณพร้อมแล้ว คุณสามารถติดตามความคืบหน้าได้โดยไปที่หน้ารายงานของฉัน",
|
|
85
85
|
"Your report is ready to download": "รายงานของคุณพร้อมสำหรับการดาวน์โหลดแล้ว",
|
|
86
86
|
"Download now": "ดาวน์โหลดทันที",
|
|
87
87
|
"Download": "ดาวน์โหลด",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "Tümü",
|
|
82
82
|
"There was an issue preparing your report": "Raporunuz hazırlanırken bir sorun oluştu",
|
|
83
83
|
"Your report is being prepared": "Raporunuz hazırlanıyor",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "Raporunuz hazır olduğunda sizi bilgilendireceğiz. Raporlarım sayfasına giderek ilerlemeyi takip edebilirsiniz.",
|
|
85
85
|
"Your report is ready to download": "Raporunuz indirilmeye hazır",
|
|
86
86
|
"Download now": "Şimdi indir",
|
|
87
87
|
"Download": "İndir",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"All": "全部",
|
|
82
82
|
"There was an issue preparing your report": "准备您的报告时出现问题",
|
|
83
83
|
"Your report is being prepared": "您的报告正在准备中",
|
|
84
|
-
"
|
|
84
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "您的报告准备就绪时,我们会通知您。您可以转至“我的报告”页面来跟踪进度。",
|
|
85
85
|
"Your report is ready to download": "您的报告现可供下载",
|
|
86
86
|
"Download now": "立即下载",
|
|
87
87
|
"Download": "下载",
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"Go to My Reports": "前往「我的報告」",
|
|
89
89
|
"There was an issue preparing your report": "準備您的報告時發生問題",
|
|
90
90
|
"Your report is being prepared": "您的報告正在準備中",
|
|
91
|
-
"
|
|
91
|
+
"You'll be notified when your report is ready. Track the progress on the My Reports page.": "報告準備就緒時,我們會通知您。您可以前往「我的報告」頁面追蹤進度。",
|
|
92
92
|
"Your report is ready to download": "您的報告已可供下載",
|
|
93
93
|
"Download now": "立即下載",
|
|
94
94
|
"Download": "下載",
|
package/esm/absolute/absolute.js
CHANGED
|
@@ -108,7 +108,7 @@ export const Absolute = ({ isOpen, id, paddingX, paddingY, className, children,
|
|
|
108
108
|
returnFocusToTrigger();
|
|
109
109
|
}
|
|
110
110
|
}, [isOpen, returnFocusToTrigger]);
|
|
111
|
-
const condition = useCallback(() =>
|
|
111
|
+
const condition = useCallback((subscriptionTrigger) => useTrapFocusWithTrigger !== "off" && !!subscriptionTrigger, [useTrapFocusWithTrigger]);
|
|
112
112
|
useTrapFocus(popupRef, useTrapFocusWithTrigger === "withTrigger" ? triggerRef : undefined, isOpen, condition);
|
|
113
113
|
useEscape(popupRef, handleEscape, isOpen);
|
|
114
114
|
useArrowKey(popupRef, handleEscape, isOpen);
|
package/esm/betaPill/betaPill.js
CHANGED
|
@@ -154,15 +154,15 @@ export const BetaPill = props => {
|
|
|
154
154
|
const isMobile = useMobile();
|
|
155
155
|
const pillClasses = useMemo(() => classNames(["zen-caption", "zen-beta-pill", isMobile ? "zen-beta-pill--mobile" : "", className !== null && className !== void 0 ? className : ""]), [isMobile, className]);
|
|
156
156
|
const contextActions = useBetaPillActions();
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
if (
|
|
160
|
-
resolvedMainAction = Object.assign(Object.assign({},
|
|
161
|
-
text:
|
|
162
|
-
});
|
|
163
|
-
resolvedSecondaryAction = Object.assign(Object.assign({},
|
|
164
|
-
text:
|
|
165
|
-
});
|
|
157
|
+
const rawMainAction = feedbackAction || (contextActions === null || contextActions === void 0 ? void 0 : contextActions.feedbackAction);
|
|
158
|
+
const rawSecondaryAction = betaOptionAction || (contextActions === null || contextActions === void 0 ? void 0 : contextActions.betaOptionAction);
|
|
159
|
+
if (rawMainAction || rawSecondaryAction) {
|
|
160
|
+
const resolvedMainAction = rawMainAction ? Object.assign(Object.assign({}, rawMainAction), {
|
|
161
|
+
text: rawMainAction.text || translate("Send feedback")
|
|
162
|
+
}) : undefined;
|
|
163
|
+
const resolvedSecondaryAction = rawSecondaryAction ? Object.assign(Object.assign({}, rawSecondaryAction), {
|
|
164
|
+
text: rawSecondaryAction.text || translate("Manage beta option")
|
|
165
|
+
}) : undefined;
|
|
166
166
|
return _jsx(PillExpandable, {
|
|
167
167
|
isBeta: true,
|
|
168
168
|
icon: IconLab,
|
|
@@ -5,6 +5,7 @@ interface IScrollOptions {
|
|
|
5
5
|
top: number;
|
|
6
6
|
left: number;
|
|
7
7
|
}
|
|
8
|
+
export declare const getDirectionalScrollDelta: (delta: number, isRTL: boolean) => number;
|
|
8
9
|
export declare const getScrollOptions: (action: string, element: HTMLElement | null, isRTL?: boolean) => IScrollOptions;
|
|
9
10
|
export declare const extractButtonAction: (event: React.MouseEvent<HTMLElement>) => TArrowsNavValue | null;
|
|
10
11
|
export declare const scrollElement: (element: HTMLElement, options: IScrollOptions) => void;
|
|
@@ -33,6 +33,9 @@ const getLTRScrollLeft = (action, scrollLeft, step, element) => {
|
|
|
33
33
|
}
|
|
34
34
|
return scrollLeft;
|
|
35
35
|
};
|
|
36
|
+
// In RTL the horizontal scroll axis is inverted: scrollLeft is 0 at the right edge and goes negative
|
|
37
|
+
// toward the left edge, so a delta meant to move the viewport toward the arrow must flip sign.
|
|
38
|
+
export const getDirectionalScrollDelta = (delta, isRTL) => (isRTL ? -delta : delta);
|
|
36
39
|
export const getScrollOptions = (action, element, isRTL = false) => {
|
|
37
40
|
const step = (element === null || element === void 0 ? void 0 : element.offsetWidth) ? element.offsetWidth : 100;
|
|
38
41
|
const scrollTop = (element === null || element === void 0 ? void 0 : element.scrollTop) || 0;
|
|
@@ -1,4 +1,13 @@
|
|
|
1
1
|
import { RefObject } from "react";
|
|
2
2
|
type TElementToBool = (element: HTMLElement) => boolean;
|
|
3
|
+
/**
|
|
4
|
+
* Traps keyboard (Tab) focus within `containerRef` (and optionally its `triggerRef`).
|
|
5
|
+
*
|
|
6
|
+
* Nested-popup contract: for correct nested-popup behaviour, a focused element that triggers an
|
|
7
|
+
* open child popup must expose a `data-popup-id` attribute whose value is the `id` of the child
|
|
8
|
+
* popup element rendered in the DOM. When present, focus is deferred to that child popup's trap.
|
|
9
|
+
* This contract is fulfilled automatically by `ControlledPopup`; callers using `useTrapFocus`
|
|
10
|
+
* directly must set `data-popup-id` themselves or nested popups will silently lose focus handling.
|
|
11
|
+
*/
|
|
3
12
|
export declare const useTrapFocus: (containerRef: RefObject<HTMLElement | null>, triggerRef: RefObject<HTMLElement | null> | undefined, subscriptionTrigger: unknown, condition?: (t: unknown) => boolean, isElementVisible?: TElementToBool) => void;
|
|
4
13
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useCallback } from "react";
|
|
1
|
+
import { useCallback, useEffect, useRef } from "react";
|
|
2
2
|
import { isElementInsideContainer } from "../../dialog/dialogHelpers";
|
|
3
3
|
import { FOCUSABLE_SELECTOR } from "../../utils/focusableSelector";
|
|
4
4
|
import { useKeydown } from "./useKeydown";
|
|
@@ -6,18 +6,38 @@ import { isChildOf } from "../../utils/isChildOf";
|
|
|
6
6
|
import { isElementHidden } from "../../utils/isElementHidden";
|
|
7
7
|
import { zen } from "../../utils/zen";
|
|
8
8
|
const findFirstVisible = (elems, isElementVisible) => elems.find(elem => isElementVisible(elem));
|
|
9
|
+
/**
|
|
10
|
+
* Traps keyboard (Tab) focus within `containerRef` (and optionally its `triggerRef`).
|
|
11
|
+
*
|
|
12
|
+
* Nested-popup contract: for correct nested-popup behaviour, a focused element that triggers an
|
|
13
|
+
* open child popup must expose a `data-popup-id` attribute whose value is the `id` of the child
|
|
14
|
+
* popup element rendered in the DOM. When present, focus is deferred to that child popup's trap.
|
|
15
|
+
* This contract is fulfilled automatically by `ControlledPopup`; callers using `useTrapFocus`
|
|
16
|
+
* directly must set `data-popup-id` themselves or nested popups will silently lose focus handling.
|
|
17
|
+
*/
|
|
9
18
|
export const useTrapFocus = (containerRef, triggerRef, subscriptionTrigger, condition, isElementVisible) => {
|
|
10
19
|
/* eslint-disable complexity */
|
|
11
20
|
const handleKeyDown = useCallback(e => {
|
|
12
|
-
var _a, _b, _c, _d, _e, _f;
|
|
21
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
13
22
|
/* eslint-enable complexity */
|
|
14
23
|
const getChildCondition = () => {
|
|
15
|
-
var _a, _b;
|
|
24
|
+
var _a, _b, _c;
|
|
25
|
+
const targetEl = e.target;
|
|
26
|
+
// If the target is a trigger for an open child popup, defer to that popup's
|
|
27
|
+
// focus trap. Key on data-popup-id + DOM presence so this works even when
|
|
28
|
+
// preventAttributesAutoSet suppresses aria-expanded.
|
|
29
|
+
const dataPopupId = targetEl.getAttribute("data-popup-id");
|
|
30
|
+
if (dataPopupId &&
|
|
31
|
+
((_a = zen.document) === null || _a === void 0 ? void 0 : _a.getElementById(dataPopupId)) &&
|
|
32
|
+
isChildOf(targetEl, containerRef.current) &&
|
|
33
|
+
targetEl !== (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current)) {
|
|
34
|
+
return true;
|
|
35
|
+
}
|
|
16
36
|
return triggerRef
|
|
17
|
-
? !isChildOf(
|
|
18
|
-
|
|
19
|
-
!isChildOf(
|
|
20
|
-
: !isChildOf(
|
|
37
|
+
? !isChildOf(targetEl, containerRef.current) &&
|
|
38
|
+
targetEl !== ((_b = zen.document) === null || _b === void 0 ? void 0 : _b.body) &&
|
|
39
|
+
!isChildOf(targetEl, triggerRef.current)
|
|
40
|
+
: !isChildOf(targetEl, containerRef.current) && targetEl !== ((_c = zen.document) === null || _c === void 0 ? void 0 : _c.body);
|
|
21
41
|
};
|
|
22
42
|
if (!containerRef.current || getChildCondition()) {
|
|
23
43
|
return;
|
|
@@ -27,9 +47,14 @@ export const useTrapFocus = (containerRef, triggerRef, subscriptionTrigger, cond
|
|
|
27
47
|
: !isElementInsideContainer(target, containerEl.current) &&
|
|
28
48
|
!isElementInsideContainer(target, triggerEl.current);
|
|
29
49
|
const isTargetOutside = e.target ? checkIsElementOutside(e.target, containerRef, triggerRef) : undefined;
|
|
30
|
-
const
|
|
50
|
+
const triggerElement = (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) !== null && _a !== void 0 ? _a : null;
|
|
51
|
+
const triggerSelf = (triggerElement === null || triggerElement === void 0 ? void 0 : triggerElement.matches(FOCUSABLE_SELECTOR)) ? [triggerElement] : [];
|
|
52
|
+
const triggerChildren = Array.from((_b = triggerElement === null || triggerElement === void 0 ? void 0 : triggerElement.querySelectorAll(FOCUSABLE_SELECTOR)) !== null && _b !== void 0 ? _b : []);
|
|
53
|
+
// querySelectorAll only returns descendants (never the element itself), so triggerSelf
|
|
54
|
+
// and triggerChildren are disjoint by definition and need no deduplication.
|
|
55
|
+
const triggerSelectors = [...triggerSelf, ...triggerChildren];
|
|
31
56
|
const containerSelectors = containerRef.current.querySelectorAll(FOCUSABLE_SELECTOR);
|
|
32
|
-
const focusable = triggerRef ? [...
|
|
57
|
+
const focusable = triggerRef ? [...triggerSelectors, ...Array.from(containerSelectors)] : [...Array.from(containerSelectors)];
|
|
33
58
|
if (!focusable.length) {
|
|
34
59
|
return;
|
|
35
60
|
}
|
|
@@ -46,31 +71,58 @@ export const useTrapFocus = (containerRef, triggerRef, subscriptionTrigger, cond
|
|
|
46
71
|
return;
|
|
47
72
|
}
|
|
48
73
|
if (e.shiftKey) {
|
|
49
|
-
if (((
|
|
74
|
+
if (((_c = zen.document) === null || _c === void 0 ? void 0 : _c.activeElement) === first) {
|
|
50
75
|
e.preventDefault();
|
|
51
76
|
last === null || last === void 0 ? void 0 : last.focus();
|
|
52
77
|
return;
|
|
53
78
|
}
|
|
54
|
-
if (firstContainerFocusable && ((
|
|
79
|
+
if (firstContainerFocusable && ((_d = zen.document) === null || _d === void 0 ? void 0 : _d.activeElement) === firstContainerFocusable) {
|
|
55
80
|
e.preventDefault();
|
|
56
81
|
lastTriggerFocusable === null || lastTriggerFocusable === void 0 ? void 0 : lastTriggerFocusable.focus();
|
|
57
82
|
}
|
|
58
83
|
return;
|
|
59
84
|
}
|
|
60
|
-
if (((
|
|
85
|
+
if (((_e = zen.document) === null || _e === void 0 ? void 0 : _e.activeElement) === last) {
|
|
61
86
|
e.preventDefault();
|
|
62
87
|
first === null || first === void 0 ? void 0 : first.focus();
|
|
63
88
|
return;
|
|
64
89
|
}
|
|
65
|
-
if (lastTriggerFocusable && ((
|
|
90
|
+
if (lastTriggerFocusable && ((_f = zen.document) === null || _f === void 0 ? void 0 : _f.activeElement) === lastTriggerFocusable) {
|
|
66
91
|
e.preventDefault();
|
|
67
92
|
firstContainerFocusable === null || firstContainerFocusable === void 0 ? void 0 : firstContainerFocusable.focus();
|
|
68
93
|
}
|
|
69
|
-
else if (isLastChildOfFirst && first && isChildOf((
|
|
94
|
+
else if (isLastChildOfFirst && first && isChildOf((_g = zen.document) === null || _g === void 0 ? void 0 : _g.activeElement, first)) {
|
|
70
95
|
e.preventDefault();
|
|
71
96
|
}
|
|
72
97
|
return;
|
|
73
98
|
}
|
|
74
|
-
},
|
|
99
|
+
},
|
|
100
|
+
// condition is consumed by useKeydown below, not read by handleKeyDown directly; its absence from deps is intentional.
|
|
101
|
+
[containerRef, triggerRef, isElementVisible]);
|
|
75
102
|
useKeydown(handleKeyDown, subscriptionTrigger, condition);
|
|
103
|
+
// When withTrigger mode closes (condition goes false), restore focus to the trigger
|
|
104
|
+
// if focus landed on body (which happens when the popup's focused element is unmounted).
|
|
105
|
+
// This restoration is intentionally scoped to the "focused element unmounted → body" case;
|
|
106
|
+
// the general close case (e.g. click-outside, item selection) is handled separately by the
|
|
107
|
+
// returnFocusToTrigger effect in absolute.tsx. Both are idempotent, so overlap is harmless.
|
|
108
|
+
// Initialized to false because popups mount closed; the guard below reconciles the first
|
|
109
|
+
// active/inactive edge, so a popup that mounts already open still resolves correctly.
|
|
110
|
+
const isActiveRef = useRef(false);
|
|
111
|
+
useEffect(() => {
|
|
112
|
+
var _a, _b;
|
|
113
|
+
const isActive = condition ? condition(subscriptionTrigger) : !!subscriptionTrigger;
|
|
114
|
+
// Guard: short-circuit when the raw open/close state is unchanged to avoid spurious
|
|
115
|
+
// focus restoration if an unstable condition reference re-fires this effect.
|
|
116
|
+
if (!!subscriptionTrigger === isActiveRef.current) {
|
|
117
|
+
isActiveRef.current = isActive;
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
120
|
+
if (!isActive && isActiveRef.current && (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current)) {
|
|
121
|
+
const active = (_a = zen.document) === null || _a === void 0 ? void 0 : _a.activeElement;
|
|
122
|
+
if (!active || active === ((_b = zen.document) === null || _b === void 0 ? void 0 : _b.body)) {
|
|
123
|
+
triggerRef.current.focus();
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
isActiveRef.current = isActive;
|
|
127
|
+
}, [condition, subscriptionTrigger, triggerRef]);
|
|
76
128
|
};
|
|
@@ -10,7 +10,7 @@ import { IAlignment } from "../utils/positioningUtils/alignments";
|
|
|
10
10
|
export type TAlignment = "top" | "top-left" | "top-right" | "left" | "left-top" | "left-bottom" | "right" | "right-top" | "right-bottom" | "bottom" | "bottom-left" | "bottom-right";
|
|
11
11
|
export interface IControlledPopup extends IZenComponentProps {
|
|
12
12
|
triggerRef: RefObject<HTMLElement | null>;
|
|
13
|
-
/** Alignment of the popup relative to its trigger. Defaults to `"bottom-
|
|
13
|
+
/** Alignment of the popup relative to its trigger. Defaults to `"bottom-start"`. */
|
|
14
14
|
alignment?: TAlignmentAbsolute;
|
|
15
15
|
id?: string;
|
|
16
16
|
className?: string;
|
|
@@ -8,7 +8,7 @@ export const ControlledPopup = ({ isOpen, id, paddingX, paddingY, triggerRef, cl
|
|
|
8
8
|
const autoId = useId();
|
|
9
9
|
const popupId = id || autoId;
|
|
10
10
|
const isClientReady = useClientReady();
|
|
11
|
-
const rtlAlignment = useRTLAlignment(alignment !== null && alignment !== void 0 ? alignment : "bottom-
|
|
11
|
+
const rtlAlignment = useRTLAlignment(alignment !== null && alignment !== void 0 ? alignment : "bottom-start");
|
|
12
12
|
useEffect(() => {
|
|
13
13
|
if (!triggerRef.current || !isClientReady) {
|
|
14
14
|
return;
|
|
@@ -175,7 +175,7 @@ export const DropdownSearchableTrigger = _a => {
|
|
|
175
175
|
} = _a,
|
|
176
176
|
otherProps = __rest(_a, ["value", "className", "onChange", "placeholder", "isOpenPopup", "inputRef", "handleClick", "width", "title", "id", "disabled", "count", "currentSelection", "isError", "fullWidth", "ref", "name", "onBlur", "popupId", "handleFocusOnPopup", "dataAnalyticsId"])
|
|
177
177
|
// eslint-disable-next-line complexity
|
|
178
|
-
|
|
178
|
+
;
|
|
179
179
|
const {
|
|
180
180
|
isFormSection
|
|
181
181
|
} = useContext(FormSectionContext);
|
|
@@ -3,7 +3,7 @@ import { IRange, IRangeValues } from "../../../range/range";
|
|
|
3
3
|
export interface IFiltersBarRangeState {
|
|
4
4
|
value: IRangeValues;
|
|
5
5
|
}
|
|
6
|
-
interface IFiltersBarRangeProps extends Pick<IRange, "id" | "defaultValue" | "unit" | "labelMin" | "labelMax" | "disabled" | "label" | "triggerAriaLabel" | "min" | "max" | "fullWidthTriggerButton" | "fullBounded" | "className" | "allowEqualMinMax"> {
|
|
6
|
+
interface IFiltersBarRangeProps extends Pick<IRange, "id" | "defaultValue" | "unit" | "labelMin" | "labelMax" | "disabled" | "label" | "triggerAriaLabel" | "min" | "max" | "fullWidthTriggerButton" | "fullBounded" | "className" | "allowEqualMinMax" | "integer"> {
|
|
7
7
|
}
|
|
8
8
|
export interface IFiltersBarRange extends IFiltersBarItem<IFiltersBarRangeState, IFiltersBarRangeProps> {
|
|
9
9
|
className?: string;
|
|
@@ -2,4 +2,4 @@ import "./filtersBarSidePanelRange.less";
|
|
|
2
2
|
import { IRange } from "../../../../range/range";
|
|
3
3
|
export interface IFiltersBarSidePanelRange extends Omit<IRange, "label" | "fullWidthTriggerButton" | "defaultValue"> {
|
|
4
4
|
}
|
|
5
|
-
export declare const FiltersBarSidePanelRange: ({ className, id, onChange, value, unit, min, max, fullBounded, allowEqualMinMax, labelMin, labelMax, disabled }: IFiltersBarSidePanelRange) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare const FiltersBarSidePanelRange: ({ className, id, onChange, value, unit, min, max, fullBounded, allowEqualMinMax, labelMin, labelMax, disabled, integer }: IFiltersBarSidePanelRange) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -86,7 +86,8 @@ export const FiltersBarSidePanelRange = ({
|
|
|
86
86
|
allowEqualMinMax,
|
|
87
87
|
labelMin,
|
|
88
88
|
labelMax,
|
|
89
|
-
disabled
|
|
89
|
+
disabled,
|
|
90
|
+
integer
|
|
90
91
|
}) => {
|
|
91
92
|
const generatedId = useId();
|
|
92
93
|
const intId = id || generatedId;
|
|
@@ -145,8 +146,9 @@ export const FiltersBarSidePanelRange = ({
|
|
|
145
146
|
min: min,
|
|
146
147
|
isMinField: true,
|
|
147
148
|
direction: directionState,
|
|
148
|
-
disabled: disabled
|
|
149
|
-
|
|
149
|
+
disabled: disabled,
|
|
150
|
+
integer: integer
|
|
151
|
+
}), [rangeFieldClasses, labelMin, translate, unit, currentValue.min, errorType, min, max, handleChange, directionState, disabled, integer]);
|
|
150
152
|
const memoizedMaxRangeField = useMemo(() => _jsx(RangeField, {
|
|
151
153
|
className: classNames([rangeFieldClasses, "zen-filters-bar-side-panel-range__max-field"]),
|
|
152
154
|
label: labelMax || translate("Max"),
|
|
@@ -160,8 +162,9 @@ export const FiltersBarSidePanelRange = ({
|
|
|
160
162
|
min: min,
|
|
161
163
|
isMinField: false,
|
|
162
164
|
direction: directionState,
|
|
163
|
-
disabled: disabled
|
|
164
|
-
|
|
165
|
+
disabled: disabled,
|
|
166
|
+
integer: integer
|
|
167
|
+
}), [rangeFieldClasses, labelMax, translate, unit, currentValue.max, errorType, min, max, handleChange, directionState, disabled, integer]);
|
|
165
168
|
return _jsxs("div", {
|
|
166
169
|
ref: setFieldsContainerRef,
|
|
167
170
|
id: intId,
|
|
@@ -9,6 +9,7 @@ import { useDirectionalIcon } from "../../utils/localization/useDirectionalIcon"
|
|
|
9
9
|
import { useLanguage } from "../../utils/localization/useLanguage";
|
|
10
10
|
import { useDriveClassName } from "../../utils/theme/useDriveClassName";
|
|
11
11
|
import { useIsRTL } from "../../utils/localization/useIsRTL";
|
|
12
|
+
import { getDirectionalScrollDelta } from "../../commonHelpers/arrowNavigation/arrowNavigationHelper";
|
|
12
13
|
import { zen } from "../../utils/zen";
|
|
13
14
|
injectString("cs", "Scroll to start", "P\u0159ej\xEDt na za\u010D\xE1tek");
|
|
14
15
|
injectString("da-DK", "Scroll to start", "Rul til start");
|
|
@@ -84,13 +85,15 @@ const getScrollButtonType = (element, isRTL) => {
|
|
|
84
85
|
return "";
|
|
85
86
|
}
|
|
86
87
|
if (isRTL) {
|
|
88
|
+
// scrollLeft is 0 at the start (right edge) and negative toward the end (left edge),
|
|
89
|
+
// so the button to offer is the mirror of the LTR case below.
|
|
87
90
|
if (scrollLeft < -1 && scrollLeft > clientWidth - scrollWidth + 1) {
|
|
88
91
|
return "both";
|
|
89
92
|
}
|
|
90
93
|
if (scrollLeft >= -1) {
|
|
91
|
-
return "
|
|
94
|
+
return "end";
|
|
92
95
|
}
|
|
93
|
-
return "
|
|
96
|
+
return "start";
|
|
94
97
|
}
|
|
95
98
|
if (scrollLeft > 0 && scrollWidth > clientWidth + scrollLeft + 1) {
|
|
96
99
|
return "both";
|
|
@@ -226,7 +229,7 @@ export const FiltersContainer = ({
|
|
|
226
229
|
className: classNames(["zen-filters-toolbar__scroller", driveClassNameScroller || "", "zen-filters-toolbar__start", showLeft ? `${scrollerClass}--visible` : "", isHiddenDisplay.left ? `${scrollerClass}--hidden` : ""]),
|
|
227
230
|
icon: ScrollStartIcon,
|
|
228
231
|
iconPosition: ButtonIconPosition.Start,
|
|
229
|
-
onClick: handleScrollButtonClick(-scrollableStep)
|
|
232
|
+
onClick: handleScrollButtonClick(getDirectionalScrollDelta(-scrollableStep, isRTL))
|
|
230
233
|
}), _jsx("div", {
|
|
231
234
|
ref: scrollableRef,
|
|
232
235
|
className: classNames(["zen-filters-toolbar__scrollable", !isHiddenDisplay.left ? "has-left-scroller" : "", !isHiddenDisplay.right ? "has-right-scroller" : ""]),
|
|
@@ -240,7 +243,7 @@ export const FiltersContainer = ({
|
|
|
240
243
|
title: translate("Scroll to end"),
|
|
241
244
|
className: classNames([scrollerClass, driveClassNameScroller || "", "zen-filters-toolbar__end", showRight ? `${scrollerClass}--visible` : "", isHiddenDisplay.right ? `${scrollerClass}--hidden` : ""]),
|
|
242
245
|
icon: ScrollEndIcon,
|
|
243
|
-
onClick: handleScrollButtonClick(scrollableStep),
|
|
246
|
+
onClick: handleScrollButtonClick(getDirectionalScrollDelta(scrollableStep, isRTL)),
|
|
244
247
|
iconPosition: ButtonIconPosition.End
|
|
245
248
|
})]
|
|
246
249
|
}) : null;
|
package/esm/header/header.js
CHANGED
|
@@ -151,11 +151,13 @@ export const Header = ({ children, className, onFiltersBarOpen
|
|
|
151
151
|
const headerRefWidth = ((_a = headerRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) || 0;
|
|
152
152
|
const leftElementsRefWidth = ((_b = leftElementsRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width) || 0;
|
|
153
153
|
const rightelementsRefWidth = ((_c = rightElementsRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width) || 0;
|
|
154
|
-
|
|
154
|
+
// Mobile padding: 8px * 2 = 16px (zen-main-header--mobile .zen-main-header__section--padding)
|
|
155
|
+
// Desktop padding: 20px * 2 = 40px + 8px gaps between sections ≈ 48px
|
|
156
|
+
const paddings = isMobile ? 16 : 48;
|
|
155
157
|
const gaps = 8 + (rightelementsRefWidth ? 8 : 0);
|
|
156
158
|
const calculatedMiddleWidth = headerRefWidth - gaps - paddings - rightelementsRefWidth - leftElementsRefWidth;
|
|
157
159
|
setMiddleWidth(calculatedMiddleWidth);
|
|
158
|
-
}, []);
|
|
160
|
+
}, [isMobile]);
|
|
159
161
|
const resizeCallBack = useThrottle(() => {
|
|
160
162
|
calculateMiddleWidth();
|
|
161
163
|
if (!isMobile) {
|
|
@@ -212,6 +214,11 @@ export const Header = ({ children, className, onFiltersBarOpen
|
|
|
212
214
|
const prefixesForTitleSize = ["large", "medium", "small"];
|
|
213
215
|
return prefixesForTitleSize[count - 1];
|
|
214
216
|
}, [collapsedElements.length, mobileFilterCondition, mobileSearchCondition, rightElements.length, visibleElements.length]);
|
|
217
|
+
// On mobile, title shrink when items overflow is handled via CSS (flex-shrink: 1 and
|
|
218
|
+
// min-width: 0 are always set on .zen-header__section--left for mobile in header.less).
|
|
219
|
+
// Applying this via React state caused a measurement feedback loop: adding shrink-title
|
|
220
|
+
// increased middleWidth → items fit → condition became false → title expanded → items
|
|
221
|
+
// overflowed → condition became true again → oscillation.
|
|
215
222
|
const titleShrinkCondition = (visibleElements.length === 0 && rightElements.length) || (mobileSearchCondition && mobileFilterCondition);
|
|
216
223
|
const fullClassName = classNames([
|
|
217
224
|
"zen-main-header zen-main-header--background-color",
|
|
@@ -48,11 +48,14 @@ export const getItemsForRender = (items, isMobile) => {
|
|
|
48
48
|
};
|
|
49
49
|
export const getItemsForMeasure = (items, isMobile) => getItemsForRender(items, isMobile).map((el, ind) => {
|
|
50
50
|
const elProps = el.props;
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
// Only HeaderCustomMenuWrapper components receive their original id in the
|
|
52
|
+
// measurement clone. These components use id purely as a registration key inside
|
|
53
|
+
// useCustomMenu and do NOT forward it to a DOM attribute, so no duplicate HTML
|
|
54
|
+
// element id is created in the hidden measurement container (MYG-141810).
|
|
55
|
+
// All other items (HeaderButton, HeaderMenu, …) keep id: undefined, preserving
|
|
56
|
+
// the MYG-133482 protection against duplicate DOM ids.
|
|
57
|
+
const isCustomMenuWrapper = el.type.displayName === HeaderCustomMenuWrapper;
|
|
58
|
+
return cloneElement(el, Object.assign(Object.assign({ key: `measure-key-${ind}-${items.length}` }, (isCustomMenuWrapper ? {} : { id: undefined })), { "data-zen-measure-id": elProps.id }));
|
|
56
59
|
});
|
|
57
60
|
export const filterItems = (items, isMobile) => {
|
|
58
61
|
const itemsArr = [];
|
package/esm/index.d.ts
CHANGED
|
@@ -725,7 +725,7 @@ export { isButton } from "./menu/utils/isButton";
|
|
|
725
725
|
export { isLink } from "./menu/utils/isLink";
|
|
726
726
|
export { type IMiniTabElement, MiniTabsSize, type IMiniTabs, MiniTabs } from "./miniTabs/miniTabs";
|
|
727
727
|
export { type IMobileSheet, MobileSheet } from "./mobileSheet/mobileSheet";
|
|
728
|
-
export { type TFocusElement, type IModal, Modal, type IDialogContent, DialogContentNew } from "./modal/modal";
|
|
728
|
+
export { MODAL_SCROLL_LOCK_CLASS, type TFocusElement, type IModal, Modal, type IDialogContent, DialogContentNew } from "./modal/modal";
|
|
729
729
|
export { getPredefinedFocusableItem } from "./modal/modalHelpers";
|
|
730
730
|
export { type INotificationProps, Notification } from "./notification/notification";
|
|
731
731
|
export { type IPageHeader, PageHeaderDisplayName, PageHeader } from "./pageHeader/pageHeader";
|
|
@@ -778,7 +778,12 @@ export { type IToggleButtonDefaultRaw, type IToggleButtonRaw, type IToggleButton
|
|
|
778
778
|
export { calculateArrowPosition } from "./tooltip/helpers/calculateArrowPosition";
|
|
779
779
|
export { removeArrowClasses } from "./tooltip/helpers/removeArrowClasses";
|
|
780
780
|
export { type TooltipSize, type TMobileView, Tooltip } from "./tooltip/tooltip";
|
|
781
|
+
export { type TTrendIndicatorDirection, type TTrendIndicatorTone, type ITrendIndicator } from "./trendIndicator/trendIndicator";
|
|
782
|
+
export { getTrendIndicatorDirection } from "./trendIndicator/trendIndicatorUtils";
|
|
781
783
|
export { type IAbortablePromiseOptions, type IAbortablePromiseConstructor, AbortablePromise } from "./utils/abortablePromise";
|
|
784
|
+
export { ZenithExperimentalProvider } from "./utils/experimentalFeatures/experimentalContext";
|
|
785
|
+
export { type ExperimentalFeatureId, EXPERIMENTAL_FLAGS } from "./utils/experimentalFeatures/registry";
|
|
786
|
+
export { useExperimentalFeature } from "./utils/experimentalFeatures/useExperimentalFeature";
|
|
782
787
|
export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvider";
|
|
783
788
|
export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
|
|
784
789
|
export { LanguageProvider } from "./utils/localization/languageProvider";
|
package/esm/index.js
CHANGED
|
@@ -711,7 +711,7 @@ export { isButton } from "./menu/utils/isButton";
|
|
|
711
711
|
export { isLink } from "./menu/utils/isLink";
|
|
712
712
|
export { MiniTabsSize, MiniTabs } from "./miniTabs/miniTabs";
|
|
713
713
|
export { MobileSheet } from "./mobileSheet/mobileSheet";
|
|
714
|
-
export { Modal, DialogContentNew } from "./modal/modal";
|
|
714
|
+
export { MODAL_SCROLL_LOCK_CLASS, Modal, DialogContentNew } from "./modal/modal";
|
|
715
715
|
export { getPredefinedFocusableItem } from "./modal/modalHelpers";
|
|
716
716
|
export { Notification } from "./notification/notification";
|
|
717
717
|
export { PageHeaderDisplayName, PageHeader } from "./pageHeader/pageHeader";
|
|
@@ -762,7 +762,11 @@ export { ToggleButtonRaw } from "./toggleButtonRaw/toggleButtonRaw";
|
|
|
762
762
|
export { calculateArrowPosition } from "./tooltip/helpers/calculateArrowPosition";
|
|
763
763
|
export { removeArrowClasses } from "./tooltip/helpers/removeArrowClasses";
|
|
764
764
|
export { Tooltip } from "./tooltip/tooltip";
|
|
765
|
+
export { getTrendIndicatorDirection } from "./trendIndicator/trendIndicatorUtils";
|
|
765
766
|
export { AbortablePromise } from "./utils/abortablePromise";
|
|
767
|
+
export { ZenithExperimentalProvider } from "./utils/experimentalFeatures/experimentalContext";
|
|
768
|
+
export { EXPERIMENTAL_FLAGS } from "./utils/experimentalFeatures/registry";
|
|
769
|
+
export { useExperimentalFeature } from "./utils/experimentalFeatures/useExperimentalFeature";
|
|
766
770
|
export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvider";
|
|
767
771
|
export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
|
|
768
772
|
export { LanguageProvider } from "./utils/localization/languageProvider";
|