@unabridged/midwest 0.24.3 → 0.24.4

package/app/assets/javascript/midwest/index.ts

@@ -39,6 +39,10 @@ import ThemeSwitch from '../../../components/midwest/form/switch_component/theme
 import Panorama from '../../../components/midwest/panorama_component/panorama_component_controller'
 import Playlist from '../../../components/midwest/playlist_component/playlist_component_controller'
 import Motion from '../../../components/midwest/motion_component/motion_component_controller'
+import PageTransition from '../../../components/midwest/page_transition_component/page_transition_component_controller'
+import Map from '../../../components/midwest/map_component/map_component_controller'
+import Address from '../../../components/midwest/form/address_component/address_component_controller'
+import Popover from '../../../components/midwest/popover_component/popover_component_controller'
 /* IMPORTS */
 
 export { Card, Banner, CountdownTimer, Chart }
@@ -85,5 +89,9 @@ export function registerMidwestControllers (application: any) {
   application.register('midwest-panorama', Panorama)
   application.register('midwest-playlist', Playlist)
   application.register('midwest-motion', Motion)
+  application.register('midwest-page-transition', PageTransition)
+  application.register('midwest-map', Map)
+  application.register('midwest-address', Address)
+  application.register('midwest-popover', Popover)
   /* EXPORTS */
 }

package/app/assets/javascript/midwest/map_providers.ts

@@ -0,0 +1,61 @@
+// Shared map provider script loaders. Module-level promises ensure the CDN
+// script is only injected once even when MapComponent and AddressComponent both
+// mount on the same page simultaneously.
+
+let mapkitScriptPromise: Promise<void> | null = null
+let googleMapsScriptPromise: Promise<void> | null = null
+let leafletScriptPromise: Promise<void> | null = null
+
+export function loadMapKitScript (): Promise<void> {
+  if ((window as any).mapkit) return Promise.resolve()
+  if (mapkitScriptPromise) return mapkitScriptPromise
+
+  mapkitScriptPromise = new Promise<void>((resolve, reject) => {
+    const script = document.createElement('script')
+    script.src = 'https://cdn.apple-mapkit.com/mk/5.x.x/mapkit.js'
+    script.crossOrigin = 'anonymous'
+    script.addEventListener('load', () => resolve())
+    script.addEventListener('error', () => reject(new Error('Failed to load MapKit JS')))
+    document.head.appendChild(script)
+  })
+  return mapkitScriptPromise
+}
+
+// Leaflet: injects the CSS link then the JS. Both are deduplicated.
+export function loadLeafletScript (): Promise<void> {
+  if ((window as any).L) return Promise.resolve()
+  if (leafletScriptPromise) return leafletScriptPromise
+
+  leafletScriptPromise = new Promise<void>((resolve, reject) => {
+    if (!document.querySelector('link[data-midwest-leaflet]')) {
+      const link = document.createElement('link')
+      link.rel = 'stylesheet'
+      link.href = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css'
+      link.dataset.midwestLeaflet = ''
+      document.head.appendChild(link)
+    }
+
+    const script = document.createElement('script')
+    script.src = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.js'
+    script.addEventListener('load', () => resolve())
+    script.addEventListener('error', () => reject(new Error('Failed to load Leaflet')))
+    document.head.appendChild(script)
+  })
+  return leafletScriptPromise
+}
+
+// Always includes &libraries=places so that AddressComponent autocomplete works
+// whether or not a MapComponent also loads Google Maps on the same page.
+export function loadGoogleMapsScript (apiKey: string): Promise<void> {
+  if ((window as any).google?.maps) return Promise.resolve()
+  if (googleMapsScriptPromise) return googleMapsScriptPromise
+
+  googleMapsScriptPromise = new Promise<void>((resolve, reject) => {
+    ;(window as any).__midwestGoogleMapsReady = resolve
+    const script = document.createElement('script')
+    script.src = `https://maps.googleapis.com/maps/api/js?key=${encodeURIComponent(apiKey)}&callback=__midwestGoogleMapsReady&loading=async&libraries=places`
+    script.addEventListener('error', () => reject(new Error('Failed to load Google Maps')))
+    document.head.appendChild(script)
+  })
+  return googleMapsScriptPromise
+}