@castlabs/ui 8.0.0 → 8.1.1

package/dist/castlabs-ui.core.js

@@ -1,4 +1,4 @@
-/* @castlabs/ui v8.0.0 */
+/* @castlabs/ui v8.1.1 */
 
 /*!
   * Bootstrap v5.3.8 (https://getbootstrap.com/)
@@ -918,6 +918,14 @@ function getDomain () {
 // -----------------------------------------------------------------------------
 
 let modal = null // the open modal (if any)
+let modalDelay = null // a just-closed modal to circumvent unlucky event order
+
+function setModalDelay (newModal) {
+  modal = newModal
+  setTimeout(function () {
+    modalDelay = newModal
+  }, 10)
+}
 
 /**
  * Hide a bootstrap modal via it's ID.
@@ -928,7 +936,7 @@ let modal = null // the open modal (if any)
  */
 function clModalHide () {
   modal?.hide()
-  modal = null
+  setModalDelay(null)
 }
 
 /**
@@ -945,10 +953,11 @@ function clModalShow (id, value) {
   // find & show the modal
   const element = document.getElementById(id)
   if (element) {
-    modal = new bootstrap.Modal(element, { backdrop: 'static' })
-    modal.value = value
-    modal.id = id
-    modal.show()
+    const newModal = new bootstrap.Modal(element, { backdrop: 'static' })
+    newModal.value = value
+    newModal.id = id
+    newModal.show()
+    setModalDelay(newModal)
 
     // focus the first auto-focus field in the Modal
     const autofocus = document.querySelector(`#${id} [autofocus]`)
@@ -973,8 +982,16 @@ function clModalValue (id) {
  */
 function clModalIsShown (modalId) {
   if (!modal) return false
-  if (!modalId) return modal._isShown
-  return modal.id === modalId && modal._isShown
+  if (modal._isShown) return true
+  return modal.id === modalId
+}
+
+/**
+ * Determine if a modal is/was open. It considers modal a few more ms as open, as
+ * sometimes browser/bootstrap events might fire in unlucky orders.
+ */
+function clModalWasShown () {
+  return !!modalDelay
 }
 
 /**
@@ -1165,7 +1182,7 @@ function clFormFieldFocusFirstInvalid (formId, moreSelectors = []) {
   const invalid = document.querySelector(
     clSubselectorQuery(`#${formId}`, [':invalid', '.invalid', ...moreSelectors])
   )
-  invalid?.focus()
+  invalid?.focus({ focusVisible: true })
 }
 
 function clSubselectorQuery (main, subselectors) {