@mapsindoors/map-template 1.95.1 → 1.95.2
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/dist/{GoogleMapsMap-C5n6Bgtp.mjs → GoogleMapsMap-Dkn60-_e.mjs} +2 -2
- package/dist/{MapboxMap-UCqzt1AC.mjs → MapboxMap-B1oo7IUm.mjs} +2 -2
- package/dist/_commonjsHelpers-B85MJLTf.js +5 -0
- package/dist/app-globals-DQuL1Twl.js +3 -0
- package/dist/combo-box-item.entry.js +8 -10
- package/dist/icon-DT_sDkmK.js +11 -0
- package/dist/index-BZQHyS7V.js +1701 -0
- package/dist/loader.js +7 -14
- package/dist/mapsindoors-react.es.js +1 -1
- package/dist/mapsindoors-react.umd.js +175 -175
- package/dist/mapsindoors-webcomponent.es.js +2916 -2904
- package/dist/mi-card_2.entry.js +23 -18
- package/dist/mi-chip.entry.js +25 -16
- package/dist/mi-column.entry.js +47 -23
- package/dist/mi-combo-box.entry.js +412 -379
- package/dist/mi-components.js +15 -12
- package/dist/mi-data-table.entry.js +298 -278
- package/dist/mi-distance_2.entry.js +58 -56
- package/dist/mi-dropdown-item.entry.js +8 -10
- package/dist/mi-dropdown.entry.js +525 -481
- package/dist/mi-floor-selector.entry.js +183 -180
- package/dist/mi-keyboard.entry.js +207 -186
- package/dist/mi-list-item-category.entry.js +44 -41
- package/dist/mi-list-item-location.entry.js +168 -162
- package/dist/mi-list.entry.js +56 -48
- package/dist/mi-location-booking.entry.js +320 -295
- package/dist/mi-location-info.entry.js +61 -53
- package/dist/mi-map-googlemaps.entry.js +369 -324
- package/dist/mi-map-mapbox.entry.js +502 -439
- package/dist/mi-metric-card.entry.js +50 -37
- package/dist/mi-my-position.entry.js +2341 -874
- package/dist/mi-notification.entry.js +112 -102
- package/dist/mi-route-instructions-heading.entry.js +70 -65
- package/dist/mi-route-instructions-maneuver-legacy.entry.js +80 -76
- package/dist/mi-route-instructions-maneuver.entry.js +80 -76
- package/dist/mi-route-instructions-step-legacy.entry.js +296 -282
- package/dist/mi-route-instructions-step.entry.js +313 -292
- package/dist/mi-route-instructions.entry.js +167 -150
- package/dist/mi-scroll-buttons.entry.js +104 -98
- package/dist/mi-search.entry.js +366 -325
- package/dist/mi-share-sms.entry.js +82 -70
- package/dist/mi-step-switcher.entry.js +34 -25
- package/dist/mi-tab-panel.entry.js +18 -18
- package/dist/mi-tab.entry.js +5 -7
- package/dist/mi-tabs.entry.js +42 -40
- package/dist/mi-time.entry.js +49 -49
- package/dist/mi-variables-CDNvnTkH.js +5 -0
- package/dist/{reactcomponent-DQsjxRIN.mjs → reactcomponent-2Oa1vSiK.mjs} +8996 -8660
- package/dist/route-travel-mode.enum-BvqP1fpw.js +9 -0
- package/dist/sort-order.enum-jsLAbYWg.js +566 -0
- package/dist/{unit-system.enum-eaefb53e.js → unit-system.enum-BwPgAWqL.js} +2 -2
- package/dist/utils-DNHzysQ6.js +61 -0
- package/package.json +1 -1
- package/dist/_commonjsHelpers-ba3f0406.js +0 -21
- package/dist/icon-b8d01d6f.js +0 -24
- package/dist/index-7e9696f3.js +0 -1678
- package/dist/mi-variables-9a6c8d4d.js +0 -6
- package/dist/polyfills/core-js.js +0 -11
- package/dist/polyfills/css-shim.js +0 -1
- package/dist/polyfills/dom.js +0 -79
- package/dist/polyfills/es5-html-element.js +0 -1
- package/dist/polyfills/index.js +0 -34
- package/dist/polyfills/system.js +0 -6
- package/dist/route-travel-mode.enum-7f4ce9c7.js +0 -9
- package/dist/sort-order.enum-64ce8998.js +0 -552
- package/dist/utils-ae714467.js +0 -61
|
@@ -1,202 +1,205 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, g as getElement } from './index-
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-BZQHyS7V.js';
|
|
2
2
|
|
|
3
|
-
const floorSelectorCss = ".mi-floor-selector{width:-moz-min-content;width:min-content;display:flex;align-items:flex-start;position:relative;overflow:hidden;animation-duration:0.15s;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:auto;border-radius:56px;border-width:1px;font-family:Figtree, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen, Ubuntu, Cantarell, \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;border-color:#e5e7eb;border-style:solid;background-color:#fcfcfc}.mi-floor-selector--hidden{display:none}.mi-floor-selector__button{position:absolute;z-index:4;top:4px;right:4px;left:4px;background-position:center;background-repeat:no-repeat;border-width:1px;background-color:#f9fafb;border-color:#e5e7eb;border-style:solid;border-radius:50%;width:40px;height:40px}.mi-floor-selector__button:hover{background-color:#f3f4f6}.mi-floor-selector__button--open{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMTUwNDUgNi4wODk5OEM3LjEzODUgNi4wNzg3NiA3LjEyODk3IDYuMDY1MjEgNy4xMjI0NSA2LjA1MDE2QzcuMTE1OTQgNi4wMzUxMSA3LjExMjU3IDYuMDE4ODggNy4xMTI1NyA2LjAwMjQ4QzcuMTEyNTcgNS45ODYwOCA3LjExNTk0IDUuOTY5ODYgNy4xMjI0NSA1Ljk1NDgxQzcuMTI4OTcgNS45Mzk3NiA3LjEzODUgNS45MjYyIDcuMTUwNDUgNS45MTQ5OEwxMS43ODA1IDEuMjc5OThDMTEuODUwNiAxLjIxMDY5IDExLjkwNjMgMS4xMjgxNiAxMS45NDQzIDEuMDM3MThDMTEuOTgyMyAwLjk0NjIwMSAxMi4wMDE5IDAuODQ4NTgyIDEyLjAwMTkgMC43NDk5ODJDMTIuMDAxOSAwLjY1MTM4MiAxMS45ODIzIDAuNTUzNzYzIDExLjk0NDMgMC40NjI3ODRDMTEuOTA2MyAwLjM3MTgwNSAxMS44NTA2IDAuMjg5Mjc2IDExLjc4MDUgMC4yMTk5ODJDMTEuNjM5MiAwLjA4MDc0MTkgMTEuNDQ4OCAwLjAwMjY4NTU1IDExLjI1MDUgMC4wMDI2ODU1NUMxMS4wNTIxIDAuMDAyNjg1NTUgMTAuODYxNyAwLjA4MDc0MTkgMTAuNzIwNSAwLjIxOTk4Mkw2LjA5MDQ1IDQuODQ5OThDNi4wNzg3OSA0Ljg2MjA4IDYuMDY0ODEgNC44NzE3IDYuMDQ5MzUgNC44NzgyN0M2LjAzMzg5IDQuODg0ODUgNi4wMTcyNiA0Ljg4ODI0IDYuMDAwNDUgNC44ODgyNEM1Ljk4MzY1IDQuODg4MjQgNS45NjcwMiA0Ljg4NDg1IDUuOTUxNTYgNC44NzgyN0M1LjkzNjA5IDQuODcxNyA1LjkyMjExIDQuODYyMDggNS45MTA0NSA0Ljg0OTk4TDEuMjgwNDUgMC4yMTk5ODJDMS4xMzkxOSAwLjA4MDc0MTkgMC45NDg4MDUgMC4wMDI2ODU1NSAwLjc1MDQ1NCAwLjAwMjY4NTU1QzAuNTUyMTAyIDAuMDAyNjg1NTUgMC4zNjE3MTggMC4wODA3NDE5IDAuMjIwNDU0IDAuMjE5OTgyQzAuMTUwMzA5IDAuMjg5Mjc2IDAuMDk0NjE2OSAwLjM3MTgwNSAwLjA1NjYwNjQgMC40NjI3ODRDMC4wMTg1OTYgMC41NTM3NjMgLTAuMDAwOTc2NTYyIDAuNjUxMzgyIC0wLjAwMDk3NjU2MiAwLjc0OTk4MkMtMC4wMDA5NzY1NjIgMC44NDg1ODIgMC4wMTg1OTYgMC45NDYyMDEgMC4wNTY2MDY0IDEuMDM3MThDMC4wOTQ2MTY5IDEuMTI4MTYgMC4xNTAzMDkgMS4yMTA2OSAwLjIyMDQ1NCAxLjI3OTk4TDQuODUwNDUgNS45MTQ5OEM0Ljg2MjQxIDUuOTI2MiA0Ljg3MTk0IDUuOTM5NzYgNC44Nzg0NiA1Ljk1NDgxQzQuODg0OTcgNS45Njk4NiA0Ljg4ODMzIDUuOTg2MDggNC44ODgzMyA2LjAwMjQ4QzQuODg4MzMgNi4wMTg4OCA0Ljg4NDk3IDYuMDM1MTEgNC44Nzg0NiA2LjA1MDE2QzQuODcxOTQgNi4wNjUyMSA0Ljg2MjQxIDYuMDc4NzYgNC44NTA0NSA2LjA4OTk4TDAuMjIwNDU0IDEwLjcyQzAuMTUwMzA5IDEwLjc4OTMgMC4wOTQ2MTY5IDEwLjg3MTggMC4wNTY2MDY0IDEwLjk2MjhDMC4wMTg1OTYgMTEuMDUzOCAtMC4wMDA5NzY1NjIgMTEuMTUxNCAtMC4wMDA5NzY1NjIgMTEuMjVDLTAuMDAwOTc2NTYyIDExLjM0ODYgMC4wMTg1OTYgMTEuNDQ2MiAwLjA1NjYwNjQgMTEuNTM3MkMwLjA5NDYxNjkgMTEuNjI4MiAwLjE1MDMwOSAxMS43MTA3IDAuMjIwNDU0IDExLjc4QzAuMzYxNzE4IDExLjkxOTIgMC41NTIxMDIgMTEuOTk3MyAwLjc1MDQ1NCAxMS45OTczQzAuOTQ4ODA1IDExLjk5NzMgMS4xMzkxOSAxMS45MTkyIDEuMjgwNDUgMTEuNzhMNS45MTA0NSA3LjE0OTk4QzUuOTIyMTEgNy4xMzc4OCA1LjkzNjA5IDcuMTI4MjYgNS45NTE1NiA3LjEyMTY5QzUuOTY3MDIgNy4xMTUxMiA1Ljk4MzY1IDcuMTExNzMgNi4wMDA0NSA3LjExMTczQzYuMDE3MjYgNy4xMTE3MyA2LjAzMzg5IDcuMTE1MTIgNi4wNDkzNSA3LjEyMTY5QzYuMDY0ODEgNy4xMjgyNiA2LjA3ODc5IDcuMTM3ODggNi4wOTA0NSA3LjE0OTk4TDEwLjcyMDUgMTEuNzhDMTAuODYxNyAxMS45MTkyIDExLjA1MjEgMTEuOTk3MyAxMS4yNTA1IDExLjk5NzNDMTEuNDQ4OCAxMS45OTczIDExLjYzOTIgMTEuOTE5MiAxMS43ODA1IDExLjc4QzExLjg1MDYgMTEuNzEwNyAxMS45MDYzIDExLjYyODIgMTEuOTQ0MyAxMS41MzcyQzExLjk4MjMgMTEuNDQ2MiAxMi4wMDE5IDExLjM0ODYgMTIuMDAxOSAxMS4yNUMxMi4wMDE5IDExLjE1MTQgMTEuOTgyMyAxMS4wNTM4IDExLjk0NDMgMTAuOTYyOEMxMS45MDYzIDEwLjg3MTggMTEuODUwNiAxMC43ODkzIDExLjc4MDUgMTAuNzJMNy4xNTA0NSA2LjA4OTk4WiIgZmlsbD0iIzcwNzA3MCIvPgo8L3N2Zz4K)}.mi-floor-selector__button--open+.mi-floor-selector__list{max-height:300px;overflow:auto;flex-wrap:unset}.mi-floor-selector__button--closed{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuOTY3Mzc0IDYuMTY2NjRMOS4wMDA3MSA5LjY1ODMxQzkuMzE2MTIgOS43OTU5NiA5LjY1NjU2IDkuODY3MDIgMTAuMDAwNyA5Ljg2NzAyQzEwLjM0NDkgOS44NjcwMiAxMC42ODUzIDkuNzk1OTYgMTEuMDAwNyA5LjY1ODMxTDE5LjA0MjQgNi4xNjY2NEMxOS4yNjczIDYuMDY2MTcgMTkuNDU4IDUuOTAyMjkgMTkuNTkxMiA1LjY5NTA4QzE5LjcyNDUgNS40ODc4NiAxOS43OTQzIDUuMjQ2MyAxOS43OTI0IDQuOTk5OTdDMTkuNzkzMSA0Ljc1NjAxIDE5LjcyMTQgNC41MTczMiAxOS41ODY0IDQuMzE0MUMxOS40NTE0IDQuMTEwODggMTkuMjU5MiAzLjk1MjI2IDE5LjAzNCAzLjg1ODMxTDExLjAwMDcgMC4zNzQ5NzJDMTAuNjg1MyAwLjIzNzMxNCAxMC4zNDQ5IDAuMTY2MjYgMTAuMDAwNyAwLjE2NjI2QzkuNjU2NTYgMC4xNjYyNiA5LjMxNjEyIDAuMjM3MzE0IDkuMDAwNzEgMC4zNzQ5NzJMMC45NjczNzQgMy44NzQ5N0MwLjc0NDgzNiAzLjk2NzgzIDAuNTU0Mzk4IDQuMTIzODggMC40MTk2MTggNC4zMjM4M0MwLjI4NDgzNyA0LjUyMzc4IDAuMjExNjI2IDQuNzU4ODUgMC4yMDkwNDEgNC45OTk5N0MwLjIwNjY5OCA1LjI0NzQ2IDAuMjc3MzkxIDUuNDkwMTUgMC40MTIyNzYgNS42OTc2NkMwLjU0NzE2MSA1LjkwNTE4IDAuNzQwMjQ3IDYuMDY4MzEgMC45NjczNzQgNi4xNjY2NFoiIGZpbGw9IiM3MDcwNzAiLz4KPHBhdGggZD0iTTE5LjAzMzYgOC44NzQ5MUwxOC4wMDAzIDguNDI0OTFDMTcuODk5MiA4LjM3NDE5IDE3Ljc4ODggOC4zNDQ2IDE3LjY3NTkgOC4zMzc5NEMxNy41NjI5IDguMzMxMjcgMTcuNDQ5OCA4LjM0NzY3IDE3LjM0MzQgOC4zODYxNEMxNy4yMzcgOC40MjQ2IDE3LjEzOTYgOC40ODQzMyAxNy4wNTcgOC41NjE2N0MxNi45NzQ1IDguNjM5MDIgMTYuOTA4NSA4LjczMjM3IDE2Ljg2MzIgOC44MzYwM0MxNi44MTc5IDguOTM5NjkgMTYuNzk0MSA5LjA1MTQ5IDE2Ljc5MzQgOS4xNjQ2MkMxNi43OTI3IDkuMjc3NzUgMTYuODE1MSA5LjM4OTgzIDE2Ljg1OTEgOS40OTQwNUMxNi45MDMxIDkuNTk4MjcgMTYuOTY3OSA5LjY5MjQzIDE3LjA0OTUgOS43NzA4MUMxNy4xMzExIDkuODQ5MTggMTcuMjI3NyA5LjkxMDEyIDE3LjMzMzYgOS45NDk5MUwxNy41MDAzIDkuOTk5OTFMMTAuMzMzNiAxMy4xMzMyQzEwLjIyODUgMTMuMTc5MSAxMC4xMTUgMTMuMjAyOCAxMC4wMDAzIDEzLjIwMjhDOS44ODU2IDEzLjIwMjggOS43NzIxMiAxMy4xNzkxIDkuNjY2OTggMTMuMTMzMkwyLjUwMDMxIDkuOTk5OTFMMi42NTg2NSA5LjkzMzI0QzIuNzY0NTUgOS44OTM0NSAyLjg2MTI0IDkuODMyNTEgMi45NDI4MyA5Ljc1NDE0QzMuMDI0NDIgOS42NzU3NyAzLjA4OTE5IDkuNTgxNiAzLjEzMzIxIDkuNDc3MzlDMy4xNzcyMiA5LjM3MzE3IDMuMTk5NTYgOS4yNjEwOCAzLjE5ODg1IDkuMTQ3OTVDMy4xOTgxNSA5LjAzNDgyIDMuMTc0NDEgOC45MjMwMiAzLjEyOTEgOC44MTkzNkMzLjA4Mzc4IDguNzE1NyAzLjAxNzgzIDguNjIyMzUgMi45MzUyNyA4LjU0NTAxQzIuODUyNzEgOC40Njc2NiAyLjc1NTI3IDguNDA3OTQgMi42NDg4NyA4LjM2OTQ3QzIuNTQyNDggOC4zMzEwMSAyLjQyOTM3IDguMzE0NjEgMi4zMTY0NCA4LjMyMTI3QzIuMjAzNSA4LjMyNzk0IDIuMDkzMTEgOC4zNTc1MyAxLjk5MTk4IDguNDA4MjRMMC45NTg2NDcgOC44NTgyNEMwLjczMjU2MSA4Ljk1MjYyIDAuNTM5NDQ5IDkuMTExNzggMC40MDM2MTkgOS4zMTU2N0MwLjI2Nzc4OSA5LjUxOTU2IDAuMTk1MzEzIDkuNzU5MDggMC4xOTUzMTIgMTAuMDA0MUMwLjE5NTMxMyAxMC4yNDkxIDAuMjY3Nzg5IDEwLjQ4ODYgMC40MDM2MTkgMTAuNjkyNUMwLjUzOTQ0OSAxMC44OTY0IDAuNzMyNTYxIDExLjA1NTUgMC45NTg2NDcgMTEuMTQ5OUw4Ljk5MTk4IDE0LjY0MTZDOS4zMDczOSAxNC43NzkyIDkuNjQ3ODMgMTQuODUwMyA5Ljk5MTk4IDE0Ljg1MDNDMTAuMzM2MSAxNC44NTAzIDEwLjY3NjYgMTQuNzc5MiAxMC45OTIgMTQuNjQxNkwxOS4wMjUzIDExLjE0OTlDMTkuMjUxNCAxMS4wNTQgMTkuNDQ0NCAxMC44OTM5IDE5LjU4MDcgMTAuNjg5NkMxOS43MTY5IDEwLjQ4NTIgMTkuNzkwNCAxMC4yNDU1IDE5Ljc5MiA5Ljk5OTkxQzE5Ljc4OTQgOS43NTg3OSAxOS43MTYyIDkuNTIzNzEgMTkuNTgxNCA5LjMyMzc3QzE5LjQ0NjYgOS4xMjM4MiAxOS4yNTYyIDguOTY3NzYgMTkuMDMzNiA4Ljg3NDkxWiIgZmlsbD0iIzcwNzA3MCIvPgo8cGF0aCBkPSJNMTkuMDM0IDEzLjgzMzRMMTguMDAwNyAxMy4zODM0QzE3LjkgMTMuMzM5MyAxNy43OTE3IDEzLjMxNTUgMTcuNjgxOCAxMy4zMTM0QzE3LjU3MTkgMTMuMzExMyAxNy40NjI3IDEzLjMzMSAxNy4zNjA1IDEzLjM3MTJDMTcuMjU4MyAxMy40MTE1IDE3LjE2NSAxMy40NzE2IDE3LjA4NjEgMTMuNTQ4MUMxNy4wMDcyIDEzLjYyNDUgMTYuOTQ0MSAxMy43MTU4IDE2LjkwMDcgMTMuODE2N0MxNi44MTQxIDE0LjAxOTEgMTYuODExMSAxNC4yNDc0IDE2Ljg5MjMgMTQuNDUxOUMxNi45NzM1IDE0LjY1NjQgMTcuMTMyMyAxNC44MjA1IDE3LjMzNCAxNC45MDg0TDE3LjUwMDcgMTUuMDAwMUwxMC4zMzQgMTguMDkxN0MxMC4yMjg5IDE4LjEzNzYgMTAuMTE1NCAxOC4xNjEzIDEwLjAwMDcgMTguMTYxM0M5Ljg4NTk0IDE4LjE2MTMgOS43NzI0NiAxOC4xMzc2IDkuNjY3MzIgMTguMDkxN0wyLjUwMDY2IDE1LjAwMDFMMi42NTg5OSAxNC45MjUxQzIuODYwNzEgMTQuODM3MiAzLjAxOTQ5IDE0LjY3MzEgMy4xMDA2NyAxNC40Njg2QzMuMTgxODUgMTQuMjY0IDMuMTc4ODUgMTQuMDM1NyAzLjA5MjMyIDEzLjgzMzRDMy4wNDg4MyAxMy43MzI1IDIuOTg1ODEgMTMuNjQxMiAyLjkwNjg5IDEzLjU2NDdDMi44Mjc5NyAxMy40ODgzIDIuNzM0NzEgMTMuNDI4MiAyLjYzMjQ4IDEzLjM4NzlDMi41MzAyNCAxMy4zNDc2IDIuNDIxMDUgMTMuMzI4IDIuMzExMTggMTMuMzMwMUMyLjIwMTMyIDEzLjMzMjEgMi4wOTI5NSAxMy4zNTU5IDEuOTkyMzIgMTMuNDAwMUwwLjk1ODk4OSAxMy44NTAxQzAuNzM2MDMzIDEzLjk0ODUgMC41NDY0NyAxNC4xMDk2IDAuNDEzMzI5IDE0LjMxMzhDMC4yODAxODggMTQuNTE3OSAwLjIwOTIgMTQuNzU2MyAwLjIwODk4OSAxNS4wMDAxQzAuMjA4MzAzIDE1LjI0NCAwLjI3OTk4NSAxNS40ODI3IDAuNDE0OTcgMTUuNjg1OUMwLjU0OTk1NSAxNS44ODkyIDAuNzQyMTc3IDE2LjA0NzggMC45NjczMjMgMTYuMTQxN0w5LjAwMDY2IDE5LjY0MTdDOS4zMTYwNyAxOS43Nzk0IDkuNjU2NTEgMTkuODUwNSAxMC4wMDA3IDE5Ljg1MDVDMTAuMzQ0OCAxOS44NTA1IDEwLjY4NTIgMTkuNzc5NCAxMS4wMDA3IDE5LjY0MTdMMTkuMDM0IDE2LjE0MTdDMTkuMjU5MSAxNi4wNDc4IDE5LjQ1MTQgMTUuODg5MiAxOS41ODYzIDE1LjY4NTlDMTkuNzIxMyAxNS40ODI3IDE5Ljc5MyAxNS4yNDQgMTkuNzkyMyAxNS4wMDAxQzE5Ljc5NDcgMTQuNzUyNiAxOS43MjQgMTQuNTA5OSAxOS41ODkxIDE0LjMwMjRDMTkuNDU0MiAxNC4wOTQ5IDE5LjI2MTEgMTMuOTMxNyAxOS4wMzQgMTMuODMzNFoiIGZpbGw9IiM3MDcwNzAiLz4KPC9zdmc+Cg==)}.mi-floor-selector__button span{position:none}.mi-floor-selector__list{box-sizing:unset;display:flex;flex-direction:column;gap:4px;overflow-y:hidden;transition:max-height 0.25s;scroll-behavior:smooth;z-index:0;border-radius:9999px;padding:4px;padding-top:48px;max-height:40px}.mi-floor-selector__list::before,.mi-floor-selector__list::after{content:\"\";height:100%;position:absolute;pointer-events:none;z-index:3;left:-1px;right:-1px;transition:opacity 0.1s;opacity:0}.mi-floor-selector__list--fade-top::before{opacity:1;top:-1px;background:linear-gradient(180deg, white 39px, rgba(255, 255, 255, 0) 86px)}.mi-floor-selector__list--fade-bottom::after{opacity:1;bottom:-1px;background:linear-gradient(0deg, white 4px, rgba(255, 255, 255, 0) 40px)}.mi-floor-selector__list::-webkit-scrollbar{width:4px}.mi-floor-selector__list::-webkit-scrollbar-track{background:none}.mi-floor-selector__list::-webkit-scrollbar-thumb{background:#8D98AA;border-radius:5px}.mi-floor-selector__floor{position:relative;order:1;flex-shrink:0;margin-top:-1px;z-index:0;float:none;text-align:center;background:none;transition:translateY 0.25s;transform:translateY(0px);color:#666666;border-radius:50%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;border-style:none;width:40px;height:40px}.mi-floor-selector__floor:hover{z-index:2;background-color:#d1d5db}.mi-floor-selector__floor--active{z-index:2;transform:translateY(0px);color:#fcfcfc}.mi-floor-selector__floor-text{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:4px;padding-right:4px}";
|
|
3
|
+
const floorSelectorCss = () => `.mi-floor-selector{width:-moz-min-content;width:min-content;display:flex;align-items:flex-start;position:relative;overflow:hidden;animation-duration:0.15s;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:auto;border-radius:56px;border-width:1px;font-family:Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";font-size:0.875rem;border-color:#e5e7eb;border-style:solid;background-color:#fcfcfc}.mi-floor-selector--hidden{display:none}.mi-floor-selector__button{position:absolute;z-index:4;top:4px;right:4px;left:4px;background-position:center;background-repeat:no-repeat;border-width:1px;background-color:#f9fafb;border-color:#e5e7eb;border-style:solid;border-radius:50%;width:40px;height:40px}.mi-floor-selector__button:hover{background-color:#f3f4f6}.mi-floor-selector__button--open{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMTUwNDUgNi4wODk5OEM3LjEzODUgNi4wNzg3NiA3LjEyODk3IDYuMDY1MjEgNy4xMjI0NSA2LjA1MDE2QzcuMTE1OTQgNi4wMzUxMSA3LjExMjU3IDYuMDE4ODggNy4xMTI1NyA2LjAwMjQ4QzcuMTEyNTcgNS45ODYwOCA3LjExNTk0IDUuOTY5ODYgNy4xMjI0NSA1Ljk1NDgxQzcuMTI4OTcgNS45Mzk3NiA3LjEzODUgNS45MjYyIDcuMTUwNDUgNS45MTQ5OEwxMS43ODA1IDEuMjc5OThDMTEuODUwNiAxLjIxMDY5IDExLjkwNjMgMS4xMjgxNiAxMS45NDQzIDEuMDM3MThDMTEuOTgyMyAwLjk0NjIwMSAxMi4wMDE5IDAuODQ4NTgyIDEyLjAwMTkgMC43NDk5ODJDMTIuMDAxOSAwLjY1MTM4MiAxMS45ODIzIDAuNTUzNzYzIDExLjk0NDMgMC40NjI3ODRDMTEuOTA2MyAwLjM3MTgwNSAxMS44NTA2IDAuMjg5Mjc2IDExLjc4MDUgMC4yMTk5ODJDMTEuNjM5MiAwLjA4MDc0MTkgMTEuNDQ4OCAwLjAwMjY4NTU1IDExLjI1MDUgMC4wMDI2ODU1NUMxMS4wNTIxIDAuMDAyNjg1NTUgMTAuODYxNyAwLjA4MDc0MTkgMTAuNzIwNSAwLjIxOTk4Mkw2LjA5MDQ1IDQuODQ5OThDNi4wNzg3OSA0Ljg2MjA4IDYuMDY0ODEgNC44NzE3IDYuMDQ5MzUgNC44NzgyN0M2LjAzMzg5IDQuODg0ODUgNi4wMTcyNiA0Ljg4ODI0IDYuMDAwNDUgNC44ODgyNEM1Ljk4MzY1IDQuODg4MjQgNS45NjcwMiA0Ljg4NDg1IDUuOTUxNTYgNC44NzgyN0M1LjkzNjA5IDQuODcxNyA1LjkyMjExIDQuODYyMDggNS45MTA0NSA0Ljg0OTk4TDEuMjgwNDUgMC4yMTk5ODJDMS4xMzkxOSAwLjA4MDc0MTkgMC45NDg4MDUgMC4wMDI2ODU1NSAwLjc1MDQ1NCAwLjAwMjY4NTU1QzAuNTUyMTAyIDAuMDAyNjg1NTUgMC4zNjE3MTggMC4wODA3NDE5IDAuMjIwNDU0IDAuMjE5OTgyQzAuMTUwMzA5IDAuMjg5Mjc2IDAuMDk0NjE2OSAwLjM3MTgwNSAwLjA1NjYwNjQgMC40NjI3ODRDMC4wMTg1OTYgMC41NTM3NjMgLTAuMDAwOTc2NTYyIDAuNjUxMzgyIC0wLjAwMDk3NjU2MiAwLjc0OTk4MkMtMC4wMDA5NzY1NjIgMC44NDg1ODIgMC4wMTg1OTYgMC45NDYyMDEgMC4wNTY2MDY0IDEuMDM3MThDMC4wOTQ2MTY5IDEuMTI4MTYgMC4xNTAzMDkgMS4yMTA2OSAwLjIyMDQ1NCAxLjI3OTk4TDQuODUwNDUgNS45MTQ5OEM0Ljg2MjQxIDUuOTI2MiA0Ljg3MTk0IDUuOTM5NzYgNC44Nzg0NiA1Ljk1NDgxQzQuODg0OTcgNS45Njk4NiA0Ljg4ODMzIDUuOTg2MDggNC44ODgzMyA2LjAwMjQ4QzQuODg4MzMgNi4wMTg4OCA0Ljg4NDk3IDYuMDM1MTEgNC44Nzg0NiA2LjA1MDE2QzQuODcxOTQgNi4wNjUyMSA0Ljg2MjQxIDYuMDc4NzYgNC44NTA0NSA2LjA4OTk4TDAuMjIwNDU0IDEwLjcyQzAuMTUwMzA5IDEwLjc4OTMgMC4wOTQ2MTY5IDEwLjg3MTggMC4wNTY2MDY0IDEwLjk2MjhDMC4wMTg1OTYgMTEuMDUzOCAtMC4wMDA5NzY1NjIgMTEuMTUxNCAtMC4wMDA5NzY1NjIgMTEuMjVDLTAuMDAwOTc2NTYyIDExLjM0ODYgMC4wMTg1OTYgMTEuNDQ2MiAwLjA1NjYwNjQgMTEuNTM3MkMwLjA5NDYxNjkgMTEuNjI4MiAwLjE1MDMwOSAxMS43MTA3IDAuMjIwNDU0IDExLjc4QzAuMzYxNzE4IDExLjkxOTIgMC41NTIxMDIgMTEuOTk3MyAwLjc1MDQ1NCAxMS45OTczQzAuOTQ4ODA1IDExLjk5NzMgMS4xMzkxOSAxMS45MTkyIDEuMjgwNDUgMTEuNzhMNS45MTA0NSA3LjE0OTk4QzUuOTIyMTEgNy4xMzc4OCA1LjkzNjA5IDcuMTI4MjYgNS45NTE1NiA3LjEyMTY5QzUuOTY3MDIgNy4xMTUxMiA1Ljk4MzY1IDcuMTExNzMgNi4wMDA0NSA3LjExMTczQzYuMDE3MjYgNy4xMTE3MyA2LjAzMzg5IDcuMTE1MTIgNi4wNDkzNSA3LjEyMTY5QzYuMDY0ODEgNy4xMjgyNiA2LjA3ODc5IDcuMTM3ODggNi4wOTA0NSA3LjE0OTk4TDEwLjcyMDUgMTEuNzhDMTAuODYxNyAxMS45MTkyIDExLjA1MjEgMTEuOTk3MyAxMS4yNTA1IDExLjk5NzNDMTEuNDQ4OCAxMS45OTczIDExLjYzOTIgMTEuOTE5MiAxMS43ODA1IDExLjc4QzExLjg1MDYgMTEuNzEwNyAxMS45MDYzIDExLjYyODIgMTEuOTQ0MyAxMS41MzcyQzExLjk4MjMgMTEuNDQ2MiAxMi4wMDE5IDExLjM0ODYgMTIuMDAxOSAxMS4yNUMxMi4wMDE5IDExLjE1MTQgMTEuOTgyMyAxMS4wNTM4IDExLjk0NDMgMTAuOTYyOEMxMS45MDYzIDEwLjg3MTggMTEuODUwNiAxMC43ODkzIDExLjc4MDUgMTAuNzJMNy4xNTA0NSA2LjA4OTk4WiIgZmlsbD0iIzcwNzA3MCIvPgo8L3N2Zz4K)}.mi-floor-selector__button--open+.mi-floor-selector__list{max-height:300px;overflow-y:auto;overflow-x:hidden;flex-wrap:unset}.mi-floor-selector__button--closed{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuOTY3Mzc0IDYuMTY2NjRMOS4wMDA3MSA5LjY1ODMxQzkuMzE2MTIgOS43OTU5NiA5LjY1NjU2IDkuODY3MDIgMTAuMDAwNyA5Ljg2NzAyQzEwLjM0NDkgOS44NjcwMiAxMC42ODUzIDkuNzk1OTYgMTEuMDAwNyA5LjY1ODMxTDE5LjA0MjQgNi4xNjY2NEMxOS4yNjczIDYuMDY2MTcgMTkuNDU4IDUuOTAyMjkgMTkuNTkxMiA1LjY5NTA4QzE5LjcyNDUgNS40ODc4NiAxOS43OTQzIDUuMjQ2MyAxOS43OTI0IDQuOTk5OTdDMTkuNzkzMSA0Ljc1NjAxIDE5LjcyMTQgNC41MTczMiAxOS41ODY0IDQuMzE0MUMxOS40NTE0IDQuMTEwODggMTkuMjU5MiAzLjk1MjI2IDE5LjAzNCAzLjg1ODMxTDExLjAwMDcgMC4zNzQ5NzJDMTAuNjg1MyAwLjIzNzMxNCAxMC4zNDQ5IDAuMTY2MjYgMTAuMDAwNyAwLjE2NjI2QzkuNjU2NTYgMC4xNjYyNiA5LjMxNjEyIDAuMjM3MzE0IDkuMDAwNzEgMC4zNzQ5NzJMMC45NjczNzQgMy44NzQ5N0MwLjc0NDgzNiAzLjk2NzgzIDAuNTU0Mzk4IDQuMTIzODggMC40MTk2MTggNC4zMjM4M0MwLjI4NDgzNyA0LjUyMzc4IDAuMjExNjI2IDQuNzU4ODUgMC4yMDkwNDEgNC45OTk5N0MwLjIwNjY5OCA1LjI0NzQ2IDAuMjc3MzkxIDUuNDkwMTUgMC40MTIyNzYgNS42OTc2NkMwLjU0NzE2MSA1LjkwNTE4IDAuNzQwMjQ3IDYuMDY4MzEgMC45NjczNzQgNi4xNjY2NFoiIGZpbGw9IiM3MDcwNzAiLz4KPHBhdGggZD0iTTE5LjAzMzYgOC44NzQ5MUwxOC4wMDAzIDguNDI0OTFDMTcuODk5MiA4LjM3NDE5IDE3Ljc4ODggOC4zNDQ2IDE3LjY3NTkgOC4zMzc5NEMxNy41NjI5IDguMzMxMjcgMTcuNDQ5OCA4LjM0NzY3IDE3LjM0MzQgOC4zODYxNEMxNy4yMzcgOC40MjQ2IDE3LjEzOTYgOC40ODQzMyAxNy4wNTcgOC41NjE2N0MxNi45NzQ1IDguNjM5MDIgMTYuOTA4NSA4LjczMjM3IDE2Ljg2MzIgOC44MzYwM0MxNi44MTc5IDguOTM5NjkgMTYuNzk0MSA5LjA1MTQ5IDE2Ljc5MzQgOS4xNjQ2MkMxNi43OTI3IDkuMjc3NzUgMTYuODE1MSA5LjM4OTgzIDE2Ljg1OTEgOS40OTQwNUMxNi45MDMxIDkuNTk4MjcgMTYuOTY3OSA5LjY5MjQzIDE3LjA0OTUgOS43NzA4MUMxNy4xMzExIDkuODQ5MTggMTcuMjI3NyA5LjkxMDEyIDE3LjMzMzYgOS45NDk5MUwxNy41MDAzIDkuOTk5OTFMMTAuMzMzNiAxMy4xMzMyQzEwLjIyODUgMTMuMTc5MSAxMC4xMTUgMTMuMjAyOCAxMC4wMDAzIDEzLjIwMjhDOS44ODU2IDEzLjIwMjggOS43NzIxMiAxMy4xNzkxIDkuNjY2OTggMTMuMTMzMkwyLjUwMDMxIDkuOTk5OTFMMi42NTg2NSA5LjkzMzI0QzIuNzY0NTUgOS44OTM0NSAyLjg2MTI0IDkuODMyNTEgMi45NDI4MyA5Ljc1NDE0QzMuMDI0NDIgOS42NzU3NyAzLjA4OTE5IDkuNTgxNiAzLjEzMzIxIDkuNDc3MzlDMy4xNzcyMiA5LjM3MzE3IDMuMTk5NTYgOS4yNjEwOCAzLjE5ODg1IDkuMTQ3OTVDMy4xOTgxNSA5LjAzNDgyIDMuMTc0NDEgOC45MjMwMiAzLjEyOTEgOC44MTkzNkMzLjA4Mzc4IDguNzE1NyAzLjAxNzgzIDguNjIyMzUgMi45MzUyNyA4LjU0NTAxQzIuODUyNzEgOC40Njc2NiAyLjc1NTI3IDguNDA3OTQgMi42NDg4NyA4LjM2OTQ3QzIuNTQyNDggOC4zMzEwMSAyLjQyOTM3IDguMzE0NjEgMi4zMTY0NCA4LjMyMTI3QzIuMjAzNSA4LjMyNzk0IDIuMDkzMTEgOC4zNTc1MyAxLjk5MTk4IDguNDA4MjRMMC45NTg2NDcgOC44NTgyNEMwLjczMjU2MSA4Ljk1MjYyIDAuNTM5NDQ5IDkuMTExNzggMC40MDM2MTkgOS4zMTU2N0MwLjI2Nzc4OSA5LjUxOTU2IDAuMTk1MzEzIDkuNzU5MDggMC4xOTUzMTIgMTAuMDA0MUMwLjE5NTMxMyAxMC4yNDkxIDAuMjY3Nzg5IDEwLjQ4ODYgMC40MDM2MTkgMTAuNjkyNUMwLjUzOTQ0OSAxMC44OTY0IDAuNzMyNTYxIDExLjA1NTUgMC45NTg2NDcgMTEuMTQ5OUw4Ljk5MTk4IDE0LjY0MTZDOS4zMDczOSAxNC43NzkyIDkuNjQ3ODMgMTQuODUwMyA5Ljk5MTk4IDE0Ljg1MDNDMTAuMzM2MSAxNC44NTAzIDEwLjY3NjYgMTQuNzc5MiAxMC45OTIgMTQuNjQxNkwxOS4wMjUzIDExLjE0OTlDMTkuMjUxNCAxMS4wNTQgMTkuNDQ0NCAxMC44OTM5IDE5LjU4MDcgMTAuNjg5NkMxOS43MTY5IDEwLjQ4NTIgMTkuNzkwNCAxMC4yNDU1IDE5Ljc5MiA5Ljk5OTkxQzE5Ljc4OTQgOS43NTg3OSAxOS43MTYyIDkuNTIzNzEgMTkuNTgxNCA5LjMyMzc3QzE5LjQ0NjYgOS4xMjM4MiAxOS4yNTYyIDguOTY3NzYgMTkuMDMzNiA4Ljg3NDkxWiIgZmlsbD0iIzcwNzA3MCIvPgo8cGF0aCBkPSJNMTkuMDM0IDEzLjgzMzRMMTguMDAwNyAxMy4zODM0QzE3LjkgMTMuMzM5MyAxNy43OTE3IDEzLjMxNTUgMTcuNjgxOCAxMy4zMTM0QzE3LjU3MTkgMTMuMzExMyAxNy40NjI3IDEzLjMzMSAxNy4zNjA1IDEzLjM3MTJDMTcuMjU4MyAxMy40MTE1IDE3LjE2NSAxMy40NzE2IDE3LjA4NjEgMTMuNTQ4MUMxNy4wMDcyIDEzLjYyNDUgMTYuOTQ0MSAxMy43MTU4IDE2LjkwMDcgMTMuODE2N0MxNi44MTQxIDE0LjAxOTEgMTYuODExMSAxNC4yNDc0IDE2Ljg5MjMgMTQuNDUxOUMxNi45NzM1IDE0LjY1NjQgMTcuMTMyMyAxNC44MjA1IDE3LjMzNCAxNC45MDg0TDE3LjUwMDcgMTUuMDAwMUwxMC4zMzQgMTguMDkxN0MxMC4yMjg5IDE4LjEzNzYgMTAuMTE1NCAxOC4xNjEzIDEwLjAwMDcgMTguMTYxM0M5Ljg4NTk0IDE4LjE2MTMgOS43NzI0NiAxOC4xMzc2IDkuNjY3MzIgMTguMDkxN0wyLjUwMDY2IDE1LjAwMDFMMi42NTg5OSAxNC45MjUxQzIuODYwNzEgMTQuODM3MiAzLjAxOTQ5IDE0LjY3MzEgMy4xMDA2NyAxNC40Njg2QzMuMTgxODUgMTQuMjY0IDMuMTc4ODUgMTQuMDM1NyAzLjA5MjMyIDEzLjgzMzRDMy4wNDg4MyAxMy43MzI1IDIuOTg1ODEgMTMuNjQxMiAyLjkwNjg5IDEzLjU2NDdDMi44Mjc5NyAxMy40ODgzIDIuNzM0NzEgMTMuNDI4MiAyLjYzMjQ4IDEzLjM4NzlDMi41MzAyNCAxMy4zNDc2IDIuNDIxMDUgMTMuMzI4IDIuMzExMTggMTMuMzMwMUMyLjIwMTMyIDEzLjMzMjEgMi4wOTI5NSAxMy4zNTU5IDEuOTkyMzIgMTMuNDAwMUwwLjk1ODk4OSAxMy44NTAxQzAuNzM2MDMzIDEzLjk0ODUgMC41NDY0NyAxNC4xMDk2IDAuNDEzMzI5IDE0LjMxMzhDMC4yODAxODggMTQuNTE3OSAwLjIwOTIgMTQuNzU2MyAwLjIwODk4OSAxNS4wMDAxQzAuMjA4MzAzIDE1LjI0NCAwLjI3OTk4NSAxNS40ODI3IDAuNDE0OTcgMTUuNjg1OUMwLjU0OTk1NSAxNS44ODkyIDAuNzQyMTc3IDE2LjA0NzggMC45NjczMjMgMTYuMTQxN0w5LjAwMDY2IDE5LjY0MTdDOS4zMTYwNyAxOS43Nzk0IDkuNjU2NTEgMTkuODUwNSAxMC4wMDA3IDE5Ljg1MDVDMTAuMzQ0OCAxOS44NTA1IDEwLjY4NTIgMTkuNzc5NCAxMS4wMDA3IDE5LjY0MTdMMTkuMDM0IDE2LjE0MTdDMTkuMjU5MSAxNi4wNDc4IDE5LjQ1MTQgMTUuODg5MiAxOS41ODYzIDE1LjY4NTlDMTkuNzIxMyAxNS40ODI3IDE5Ljc5MyAxNS4yNDQgMTkuNzkyMyAxNS4wMDAxQzE5Ljc5NDcgMTQuNzUyNiAxOS43MjQgMTQuNTA5OSAxOS41ODkxIDE0LjMwMjRDMTkuNDU0MiAxNC4wOTQ5IDE5LjI2MTEgMTMuOTMxNyAxOS4wMzQgMTMuODMzNFoiIGZpbGw9IiM3MDcwNzAiLz4KPC9zdmc+Cg==)}.mi-floor-selector__button span{position:none}.mi-floor-selector__list{box-sizing:unset;display:flex;flex-direction:column;gap:4px;overflow-y:hidden;overflow-x:hidden;transition:max-height 0.25s;scroll-behavior:smooth;z-index:0;scrollbar-width:thin;border-radius:9999px;padding:4px;padding-top:48px;max-height:40px}.mi-floor-selector__list::before,.mi-floor-selector__list::after{content:"";height:100%;position:absolute;pointer-events:none;z-index:3;left:-1px;right:-1px;transition:opacity 0.1s;opacity:0}.mi-floor-selector__list--fade-top::before{opacity:1;top:-1px;background:linear-gradient(180deg, white 39px, rgba(255, 255, 255, 0) 86px)}.mi-floor-selector__list--fade-bottom::after{opacity:1;bottom:-1px;background:linear-gradient(0deg, white 4px, rgba(255, 255, 255, 0) 40px)}.mi-floor-selector__list::-webkit-scrollbar{width:4px}.mi-floor-selector__list::-webkit-scrollbar-track{background:none}.mi-floor-selector__list::-webkit-scrollbar-thumb{background:#8D98AA;border-radius:5px}.mi-floor-selector__floor{position:relative;order:1;flex-shrink:0;margin-top:-1px;z-index:0;float:none;text-align:center;background:none;transition:translateY 0.25s;transform:translateY(0px);color:#666666;border-radius:50%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:100%;border-style:none;width:40px;height:40px}.mi-floor-selector__floor:hover{z-index:2;background-color:#d1d5db}.mi-floor-selector__floor--active{z-index:2;transform:translateY(0px);color:#fcfcfc}.mi-floor-selector__floor-text{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:4px;padding-right:4px}`;
|
|
4
4
|
|
|
5
5
|
const FloorSelector = class {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
*/
|
|
20
|
-
scrollToSelectedFloor() {
|
|
21
|
-
// Get the container and list heights
|
|
22
|
-
const containerHeight = this.floorSelectorElement.clientHeight;
|
|
23
|
-
const listHeight = this.floorListElement.scrollHeight;
|
|
24
|
-
// Get the selected list item's position relative to the list
|
|
25
|
-
const currentFloorOffsetTop = this.currentFloorElement.offsetTop;
|
|
26
|
-
const currentFloorHeight = this.currentFloorElement.offsetHeight;
|
|
27
|
-
// Calculate the scrollTop value for the selected list item
|
|
28
|
-
let scrollTopValue;
|
|
29
|
-
if (listHeight > containerHeight) {
|
|
30
|
-
// Center the selected list item within the container
|
|
31
|
-
scrollTopValue = currentFloorOffsetTop - (containerHeight / 2) + (currentFloorHeight / 2);
|
|
32
|
-
scrollTopValue = Math.max(0, scrollTopValue); // Prevent negative values
|
|
33
|
-
scrollTopValue = Math.min(scrollTopValue, listHeight - containerHeight); // Limit within valid range
|
|
6
|
+
constructor(hostRef) {
|
|
7
|
+
registerInstance(this, hostRef);
|
|
8
|
+
/**
|
|
9
|
+
* The color to use as the primary color (as background color of the selected floor in the list).
|
|
10
|
+
*
|
|
11
|
+
* @type {string}
|
|
12
|
+
*/
|
|
13
|
+
this.primaryColor = '#005655';
|
|
14
|
+
this.floors = new Array();
|
|
15
|
+
this.floorSelectorClosed = true;
|
|
16
|
+
this.fadeFloorSelectorOnTop = false;
|
|
17
|
+
this.fadeFloorSelectorOnBottom = false;
|
|
18
|
+
this.maxListHeight = 300; // The floor-selector.scss: $max-list-height variable needs to be synced with this value
|
|
34
19
|
}
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
20
|
+
/**
|
|
21
|
+
* Scrolling the floorList element to the selected floor.
|
|
22
|
+
*/
|
|
23
|
+
scrollToSelectedFloor() {
|
|
24
|
+
// Get the container and list heights
|
|
25
|
+
const containerHeight = this.floorSelectorElement.clientHeight;
|
|
26
|
+
const listHeight = this.floorListElement.scrollHeight;
|
|
27
|
+
// Get the selected list item's position relative to the list
|
|
28
|
+
const currentFloorOffsetTop = this.currentFloorElement.offsetTop;
|
|
29
|
+
const currentFloorHeight = this.currentFloorElement.offsetHeight;
|
|
30
|
+
// Calculate the scrollTop value for the selected list item
|
|
31
|
+
let scrollTopValue;
|
|
32
|
+
if (listHeight > containerHeight) {
|
|
33
|
+
// Center the selected list item within the container
|
|
34
|
+
scrollTopValue = currentFloorOffsetTop - (containerHeight / 2) + (currentFloorHeight / 2);
|
|
35
|
+
scrollTopValue = Math.max(0, scrollTopValue); // Prevent negative values
|
|
36
|
+
scrollTopValue = Math.min(scrollTopValue, listHeight - containerHeight); // Limit within valid range
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
// If the list is smaller than the container, scroll to the top
|
|
40
|
+
scrollTopValue = 0;
|
|
41
|
+
}
|
|
42
|
+
// Set the scrollTop property on the list element
|
|
43
|
+
this.floorListElement.scrollTop = scrollTopValue;
|
|
38
44
|
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
animateTranslateY(element, distance, duration) {
|
|
50
|
-
const keyframes = [{ transform: `translateY(${distance}px)` }];
|
|
51
|
-
element.animate(keyframes, { duration, fill: 'forwards' });
|
|
52
|
-
}
|
|
53
|
-
/**
|
|
54
|
-
* Calls the animation for the needed elements with the calculated animation values.
|
|
55
|
-
*/
|
|
56
|
-
animateFloorSelector() {
|
|
57
|
-
const floorElements = this.el.querySelectorAll('.mi-floor-selector__floor');
|
|
58
|
-
// Elements that are placed before the selected element in the markup.
|
|
59
|
-
const elementsBeforeSelected = [];
|
|
60
|
-
for (let i = 0; i < floorElements.length; i++) {
|
|
61
|
-
// Stop iterating when we reach the clicked element
|
|
62
|
-
if (floorElements[i].getAttribute('data-floor') === this.currentFloor) {
|
|
63
|
-
break;
|
|
64
|
-
}
|
|
65
|
-
elementsBeforeSelected.push(floorElements[i]);
|
|
45
|
+
/**
|
|
46
|
+
* Applies a 'transform: translateY()' animation to the provided element.
|
|
47
|
+
*
|
|
48
|
+
* @param {HTMLElement} element
|
|
49
|
+
* @param {number} distance
|
|
50
|
+
* @param {number} duration
|
|
51
|
+
*/
|
|
52
|
+
animateTranslateY(element, distance, duration) {
|
|
53
|
+
const keyframes = [{ transform: `translateY(${distance}px)` }];
|
|
54
|
+
element.animate(keyframes, { duration, fill: 'forwards' });
|
|
66
55
|
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
56
|
+
/**
|
|
57
|
+
* Calls the animation for the needed elements with the calculated animation values.
|
|
58
|
+
*/
|
|
59
|
+
animateFloorSelector() {
|
|
60
|
+
const floorElements = this.el.querySelectorAll('.mi-floor-selector__floor');
|
|
61
|
+
// Elements that are placed before the selected element in the markup.
|
|
62
|
+
const elementsBeforeSelected = [];
|
|
63
|
+
for (let i = 0; i < floorElements.length; i++) {
|
|
64
|
+
// Stop iterating when we reach the clicked element
|
|
65
|
+
if (floorElements[i].getAttribute('data-floor') === this.currentFloor) {
|
|
66
|
+
break;
|
|
67
|
+
}
|
|
68
|
+
elementsBeforeSelected.push(floorElements[i]);
|
|
69
|
+
}
|
|
70
|
+
if (this.floorSelectorClosed) {
|
|
71
|
+
const listScrollTop = this.floorListElement.scrollTop;
|
|
72
|
+
const listPaddingTop = parseInt(window.getComputedStyle(this.floorListElement).getPropertyValue('padding-top'));
|
|
73
|
+
const selectedElementDistanceFromTop = this.currentFloorElement.offsetTop - this.floorListElement.offsetTop;
|
|
74
|
+
const newElementDistanceFromTop = -(selectedElementDistanceFromTop - listScrollTop - listPaddingTop);
|
|
75
|
+
this.animateTranslateY(this.currentFloorElement, newElementDistanceFromTop, 250);
|
|
76
|
+
// If the floor selector has been scrolled, all floors need to be pushed down.
|
|
77
|
+
if (this.floorListElement.scrollTop > 0) {
|
|
78
|
+
floorElements.forEach(floorElement => {
|
|
79
|
+
if (floorElement.getAttribute('data-floor') !== this.currentFloor) {
|
|
80
|
+
// Floors placed before the first floor need to be pushed further down.
|
|
81
|
+
if (elementsBeforeSelected.indexOf(floorElement) > -1) {
|
|
82
|
+
this.animateTranslateY(floorElement, floorElement.offsetTop + this.floorListElement.scrollTop, 250);
|
|
83
|
+
}
|
|
84
|
+
else {
|
|
85
|
+
this.animateTranslateY(floorElement, this.floorListElement.scrollTop, 250);
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
});
|
|
80
89
|
}
|
|
81
90
|
else {
|
|
82
|
-
|
|
91
|
+
// If the floor selector has NOT been scrolled, only the elements above the selected floor need to be pushed down.
|
|
92
|
+
// The selected floor will take the position of the first floor in the list.
|
|
93
|
+
elementsBeforeSelected.forEach(floorElement => {
|
|
94
|
+
this.animateTranslateY(floorElement, floorElement.offsetTop, 250);
|
|
95
|
+
});
|
|
83
96
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
97
|
+
}
|
|
98
|
+
else {
|
|
99
|
+
// If the floor selector is closed, all elements need to be animated back to their original position.
|
|
100
|
+
this.animateTranslateY(this.currentFloorElement, 0, 250);
|
|
101
|
+
floorElements.forEach(floorElement => {
|
|
102
|
+
if (floorElement.getAttribute('data-floor') !== this.currentFloor) {
|
|
103
|
+
this.animateTranslateY(floorElement, 0, 250);
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
}
|
|
94
107
|
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
108
|
+
/**
|
|
109
|
+
* Toggles the floor selector open-close.
|
|
110
|
+
*/
|
|
111
|
+
onToggleFloorSelector() {
|
|
112
|
+
this.floorSelectorClosed = !this.floorSelectorClosed;
|
|
113
|
+
this.animateFloorSelector();
|
|
114
|
+
this.floorListElement.addEventListener('transitionend', () => {
|
|
115
|
+
if (!this.floorSelectorClosed) {
|
|
116
|
+
this.scrollToSelectedFloor();
|
|
117
|
+
}
|
|
118
|
+
this.onScrollStyle();
|
|
119
|
+
}, { once: true });
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* Adding/removing classes to the floorlist to fade-in/out the top/bottom part of the container..
|
|
123
|
+
*/
|
|
124
|
+
onScrollStyle() {
|
|
125
|
+
const maxScrollTop = this.floorListElement.scrollHeight - this.floorListElement.clientHeight;
|
|
126
|
+
if (this.floorSelectorClosed) {
|
|
127
|
+
this.fadeFloorSelectorOnTop = false;
|
|
128
|
+
this.fadeFloorSelectorOnBottom = false;
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
if (this.maxListHeight > this.floorListElement.clientHeight - 48) {
|
|
132
|
+
return;
|
|
101
133
|
}
|
|
102
|
-
|
|
134
|
+
this.fadeFloorSelectorOnTop = this.floorListElement.scrollTop > 0 ? true : false;
|
|
135
|
+
this.fadeFloorSelectorOnBottom = this.floorListElement.scrollTop === maxScrollTop ? false : true;
|
|
103
136
|
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
this.scrollToSelectedFloor();
|
|
114
|
-
}
|
|
115
|
-
this.onScrollStyle();
|
|
116
|
-
}, { once: true });
|
|
117
|
-
}
|
|
118
|
-
/**
|
|
119
|
-
* Adding/removing classes to the floorlist to fade-in/out the top/bottom part of the container..
|
|
120
|
-
*/
|
|
121
|
-
onScrollStyle() {
|
|
122
|
-
const maxScrollTop = this.floorListElement.scrollHeight - this.floorListElement.clientHeight;
|
|
123
|
-
if (this.floorSelectorClosed) {
|
|
124
|
-
this.fadeFloorSelectorOnTop = false;
|
|
125
|
-
this.fadeFloorSelectorOnBottom = false;
|
|
126
|
-
return;
|
|
137
|
+
/**
|
|
138
|
+
* Sets the clicked floor active.
|
|
139
|
+
*
|
|
140
|
+
* @param {PointerEvent} event
|
|
141
|
+
*/
|
|
142
|
+
onSelectFloor(event, floorIndex) {
|
|
143
|
+
this.mapsindoors.setFloor(floorIndex);
|
|
144
|
+
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
145
|
+
this.currentFloorElement = event.currentTarget;
|
|
127
146
|
}
|
|
128
|
-
|
|
129
|
-
|
|
147
|
+
/**
|
|
148
|
+
* Called every time the component is connected to the DOM.
|
|
149
|
+
* It resets the floorlist and the active floor when the building changes.
|
|
150
|
+
*/
|
|
151
|
+
connectedCallback() {
|
|
152
|
+
this.mapsindoors.addListener('building_changed', () => {
|
|
153
|
+
this.floors = [];
|
|
154
|
+
const building = this.mapsindoors.getBuilding();
|
|
155
|
+
if (building) {
|
|
156
|
+
const floorChangedListener = () => {
|
|
157
|
+
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
158
|
+
this.mapsindoors.removeListener('floor_changed', floorChangedListener);
|
|
159
|
+
};
|
|
160
|
+
if (this.mapsindoors.getFloor() === null || this.mapsindoors.getFloor() === undefined) {
|
|
161
|
+
this.mapsindoors.addListener('floor_changed', floorChangedListener);
|
|
162
|
+
}
|
|
163
|
+
else {
|
|
164
|
+
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
165
|
+
}
|
|
166
|
+
Object.keys(building.floors)
|
|
167
|
+
.sort((a, b) => b - a)
|
|
168
|
+
.forEach(floor => {
|
|
169
|
+
building.floors[floor].index = floor;
|
|
170
|
+
this.floors.push(building.floors[floor]);
|
|
171
|
+
});
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
this.mapsindoors.addListener('floor_changed', () => {
|
|
175
|
+
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
176
|
+
});
|
|
130
177
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
* @param {PointerEvent} event
|
|
138
|
-
*/
|
|
139
|
-
onSelectFloor(event, floorIndex) {
|
|
140
|
-
this.mapsindoors.setFloor(floorIndex);
|
|
141
|
-
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
142
|
-
this.currentFloorElement = event.currentTarget;
|
|
143
|
-
}
|
|
144
|
-
/**
|
|
145
|
-
* Called every time the component is connected to the DOM.
|
|
146
|
-
* It resets the floorlist and the active floor when the building changes.
|
|
147
|
-
*/
|
|
148
|
-
connectedCallback() {
|
|
149
|
-
this.mapsindoors.addListener('building_changed', () => {
|
|
150
|
-
this.floors = [];
|
|
151
|
-
const building = this.mapsindoors.getBuilding();
|
|
152
|
-
if (building) {
|
|
153
|
-
const floorChangedListener = () => {
|
|
154
|
-
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
155
|
-
this.mapsindoors.removeListener('floor_changed', floorChangedListener);
|
|
156
|
-
};
|
|
157
|
-
if (this.mapsindoors.getFloor() === null || this.mapsindoors.getFloor() === undefined) {
|
|
158
|
-
this.mapsindoors.addListener('floor_changed', floorChangedListener);
|
|
178
|
+
/**
|
|
179
|
+
* Called after every render().
|
|
180
|
+
*/
|
|
181
|
+
componentDidRender() {
|
|
182
|
+
if (!this.mapsindoors.getBuilding() || this.mapsindoors.getFloor() === null || this.mapsindoors.getFloor() === undefined) {
|
|
183
|
+
this.floorSelectorElement.classList.add('mi-floor-selector--hidden');
|
|
159
184
|
}
|
|
160
185
|
else {
|
|
161
|
-
|
|
186
|
+
this.floorSelectorElement.classList.remove('mi-floor-selector--hidden');
|
|
187
|
+
}
|
|
188
|
+
this.currentFloorElement = this.el.querySelector('.mi-floor-selector__floor--active');
|
|
189
|
+
if (this.currentFloorElement && this.currentFloor) {
|
|
190
|
+
this.animateFloorSelector();
|
|
162
191
|
}
|
|
163
|
-
Object.keys(building.floors)
|
|
164
|
-
.sort((a, b) => b - a)
|
|
165
|
-
.forEach(floor => {
|
|
166
|
-
building.floors[floor].index = floor;
|
|
167
|
-
this.floors.push(building.floors[floor]);
|
|
168
|
-
});
|
|
169
|
-
}
|
|
170
|
-
});
|
|
171
|
-
this.mapsindoors.addListener('floor_changed', () => {
|
|
172
|
-
this.currentFloor = this.mapsindoors.getFloor().toString();
|
|
173
|
-
});
|
|
174
|
-
}
|
|
175
|
-
/**
|
|
176
|
-
* Called after every render().
|
|
177
|
-
*/
|
|
178
|
-
componentDidRender() {
|
|
179
|
-
if (!this.mapsindoors.getBuilding() || this.mapsindoors.getFloor() === null || this.mapsindoors.getFloor() === undefined) {
|
|
180
|
-
this.floorSelectorElement.classList.add('mi-floor-selector--hidden');
|
|
181
|
-
}
|
|
182
|
-
else {
|
|
183
|
-
this.floorSelectorElement.classList.remove('mi-floor-selector--hidden');
|
|
184
192
|
}
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
193
|
+
/**
|
|
194
|
+
* Renders the floor selector.
|
|
195
|
+
*
|
|
196
|
+
* @returns {JSX.Element}
|
|
197
|
+
*/
|
|
198
|
+
render() {
|
|
199
|
+
return (h(Host, { key: 'de95d023bdcb3e5f06e46366cddca9bcb7b000d4' }, h("div", { key: '7fa2423b4b77dfbad7b27f103e48910606446e59', class: 'mi-floor-selector', ref: (element) => this.floorSelectorElement = element }, h("button", { key: '939b69c8912f8d2d0c5aec56e79c616c0e7ac30a', class: `mi-floor-selector__button mi-floor-selector__button--${this.floorSelectorClosed ? 'closed' : 'open'}`, onClick: () => this.onToggleFloorSelector() }), h("div", { key: '4c926e280127006f530332b180233796de86d302', class: `mi-floor-selector__list ${this.fadeFloorSelectorOnTop ? 'mi-floor-selector__list--fade-top' : ''} ${this.fadeFloorSelectorOnBottom ? 'mi-floor-selector__list--fade-bottom' : ''}`, ref: (element) => this.floorListElement = element, onScroll: () => this.onScrollStyle() }, this.floors.map((floor) => (h("button", { "data-floor": floor.index, style: this.currentFloor === floor.index ? { backgroundColor: this.primaryColor } : {}, class: `mi-floor-selector__floor ${this.currentFloor === floor.index ? 'mi-floor-selector__floor--active' : ''}`, onClick: (event) => this.onSelectFloor(event, floor.index) }, h("span", null, floor.name))))))));
|
|
188
200
|
}
|
|
189
|
-
|
|
190
|
-
/**
|
|
191
|
-
* Renders the floor selector.
|
|
192
|
-
*
|
|
193
|
-
* @returns {JSX.Element}
|
|
194
|
-
*/
|
|
195
|
-
render() {
|
|
196
|
-
return (h(Host, null, h("div", { class: 'mi-floor-selector', ref: (element) => this.floorSelectorElement = element }, h("button", { class: `mi-floor-selector__button mi-floor-selector__button--${this.floorSelectorClosed ? 'closed' : 'open'}`, onClick: () => this.onToggleFloorSelector() }), h("div", { class: `mi-floor-selector__list ${this.fadeFloorSelectorOnTop ? 'mi-floor-selector__list--fade-top' : ''} ${this.fadeFloorSelectorOnBottom ? 'mi-floor-selector__list--fade-bottom' : ''}`, ref: (element) => this.floorListElement = element, onScroll: () => this.onScrollStyle() }, this.floors.map((floor) => (h("button", { "data-floor": floor.index, style: this.currentFloor === floor.index ? { backgroundColor: this.primaryColor } : {}, class: `mi-floor-selector__floor ${this.currentFloor === floor.index ? 'mi-floor-selector__floor--active' : ''}`, onClick: (event) => this.onSelectFloor(event, floor.index) }, h("span", null, floor.name))))))));
|
|
197
|
-
}
|
|
198
|
-
get el() { return getElement(this); }
|
|
201
|
+
get el() { return getElement(this); }
|
|
199
202
|
};
|
|
200
|
-
FloorSelector.style = floorSelectorCss;
|
|
203
|
+
FloorSelector.style = floorSelectorCss();
|
|
201
204
|
|
|
202
205
|
export { FloorSelector as mi_floor_selector };
|