{"remainingRequest":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js??vue-loader-options!/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/flatmapvuer/src/components/FlatmapVuer.vue?vue&type=style&index=0&id=5350596b&scoped=true&lang=scss&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/flatmapvuer/src/components/FlatmapVuer.vue","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/sass-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9idXR0b24iOwpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvbG9hZGluZyI7CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9yb3ciOwpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvc2VsZWN0IjsKCi5iZXRhLXBvcG92ZXJzIHsKICBwb3NpdGlvbjogYWJzb2x1dGU7CiAgdG9wOiA5MHB4OwogIGxlZnQ6IDE2cHg7CiAgdGV4dC1hbGlnbjogbGVmdDsKICBmb250LXNpemU6IDI1cHg7Cn0KCi53YXJuaW5nLWljb24gewogIGNvbG9yOiAkd2FybmluZzsKCiAgJjpob3ZlciB7CiAgICBjdXJzb3I6IHBvaW50ZXI7CiAgfQp9Cgoud2FybmluZy10ZXh0IHsKICBmb250LWZhbWlseTogQXNhcCwgc2Fucy1zZXJpZjsKICBmb250LXNpemU6IDE1cHg7CiAgdmVydGljYWwtYWxpZ246IDVweDsKfQoKLmxhdGVzdC1tYXAtdGV4dCB7CiAgY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsKICBmb250LWZhbWlseTogQXNhcCwgc2Fucy1zZXJpZjsKICBmb250LXNpemU6IDEycHg7CiAgbWFyZ2luLXRvcDogNXB4OwogIHZlcnRpY2FsLWFsaWduOiAxMHB4OwogIGN1cnNvcjogcG9pbnRlcjsKfQoKLmxhdGVzdC1jaGFuZ2VzaWNvbiB7CiAgY29sb3I6ICRzdWNjZXNzOwoKICAmOmhvdmVyIHsKICAgIGN1cnNvcjogcG9pbnRlcjsKICB9Cn0KCi5sYXRlc3QtY2hhbmdlc3RleHQgewogIGZvbnQtZmFtaWx5OiBBc2FwLCBzYW5zLXNlcmlmOwogIGZvbnQtc2l6ZTogMTVweDsKICB2ZXJ0aWNhbC1hbGlnbjogNXB4Owp9CgouZmxhdG1hcC1jb250YWluZXIgewogIGhlaWdodDogMTAwJTsKICB3aWR0aDogMTAwJTsKfQoKLnBhdGh3YXktbG9jYXRpb24gewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICBib3R0b206IDBweDsKICB0cmFuc2l0aW9uOiBhbGwgMXMgZWFzZTsKICAmLm9wZW4gewogICAgbGVmdDogMHB4OwogIH0KICAmLmNsb3NlIHsKICAgIGxlZnQ6IC0yOThweDsKICB9Cn0KCi5zdmctbGVnZW5kcy1jb250YWluZXIgewogIHdpZHRoOiA3MCU7CiAgaGVpZ2h0OiBhdXRvOwogIHBvc2l0aW9uOiByZWxhdGl2ZTsKICBtYXgtaGVpZ2h0OiAxNDBweDsKfQoKLnBhdGh3YXktY29udGFpbmVyIHsKICBmbG9hdDogbGVmdDsKICBwYWRkaW5nLWxlZnQ6IDE2cHg7CiAgcGFkZGluZy1yaWdodDogMThweDsKICB0ZXh0LWFsaWduOiBsZWZ0OwogIG92ZXJmbG93OiBhdXRvOwogIGJvcmRlcjogMXB4IHNvbGlkIHJnYigyMjAsIDIyMywgMjMwKTsKICBwYWRkaW5nLWJvdHRvbTogMTZweDsKICBiYWNrZ3JvdW5kOiAjZmZmZmZmOwogIG92ZXJmbG93LXg6IGhpZGRlbjsKICBzY3JvbGxiYXItd2lkdGg6IHRoaW47CgogIHRyYW5zaXRpb246IGFsbCAxcyBlYXNlOwogICYub3BlbiB7CiAgICBvcGFjaXR5OiAxOwogIH0KICAmLmNsb3NlIHsKICAgIG9wYWNpdHk6IDA7CiAgfQoKICAmOjotd2Via2l0LXNjcm9sbGJhciB7CiAgICB3aWR0aDogNHB4OwogIH0KCiAgJjo6LXdlYmtpdC1zY3JvbGxiYXItdGh1bWIgewogICAgYm9yZGVyLXJhZGl1czogMTBweDsKICAgIGJveC1zaGFkb3c6IGluc2V0IDAgMCA2cHggI2MwYzRjYzsKICB9Cn0KCi5mbGF0bWFwLW1hcmtlci1oZWxwIHsKICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7Cn0KCjo6di1kZWVwIC5wb3BwZXItYnVtcC1yaWdodCB7CiAgbGVmdDogMzBweDsKfQoKLmVsLWRyb3Bkb3duLWxpbmsgewogIGN1cnNvcjogcG9pbnRlcjsKICBjb2xvcjogIzQwOWVmZjsKfQouZWwtaWNvbi1hcnJvdy1kb3duIHsKICBmb250LXNpemU6IDEycHg7Cn0KLmRlbW9uc3RyYXRpb24gewogIGRpc3BsYXk6IGJsb2NrOwogIGNvbG9yOiAjODQ5MmE2OwogIGZvbnQtc2l6ZTogMTRweDsKICBtYXJnaW4tYm90dG9tOiAyMHB4Owp9CgoudG9vbHRpcCB7CiAgZGlzcGxheTogbm9uZTsKfQoKOjp2LWRlZXAgLm1hcGxpYnJlZ2wtcG9wdXAgewogIG1heC13aWR0aDogMzAwcHggIWltcG9ydGFudDsKfQoKOjp2LWRlZXAgLmZsYXRtYXAtdG9vbHRpcC1wb3B1cCB7CiAgJi5tYXBsaWJyZWdsLXBvcHVwLWFuY2hvci1ib3R0b20gewogICAgLm1hcGxpYnJlZ2wtcG9wdXAtY29udGVudCB7CiAgICAgIG1hcmdpbi1ib3R0b206IDEycHg7CiAgICAgICY6OmFmdGVyLAogICAgICAmOjpiZWZvcmUgewogICAgICAgIHRvcDogMTAwJTsKICAgICAgICBib3JkZXItd2lkdGg6IDEycHg7CiAgICAgIH0KICAgICAgLyogdGhpcyBib3JkZXIgY29sb3IgY29udHJvbGxzIHRoZSBjb2xvciBvZiB0aGUgdHJpYW5nbGUgKHdoYXQgbG9va3MgbGlrZSB0aGUgZmlsbCBvZiB0aGUgdHJpYW5nbGUpICovCiAgICAgICY6OmFmdGVyIHsKICAgICAgICBtYXJnaW4tdG9wOiAtMXB4OwogICAgICAgIGJvcmRlci1jb2xvcjogcmdiKDI1NSwgMjU1LCAyNTUpIHRyYW5zcGFyZW50IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50OwogICAgICB9CiAgICAgIC8qIHRoaXMgYm9yZGVyIGNvbG9yIGNvbnRyb2xscyB0aGUgb3V0c2lkZSwgdGhpbiBib3JkZXIgKi8KICAgICAgJjo6YmVmb3JlIHsKICAgICAgICBtYXJnaW46IDAgYXV0bzsKICAgICAgICBib3JkZXItY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvciB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCB0cmFuc3BhcmVudDsKICAgICAgfQogICAgfQogIH0KICAmLm1hcGxpYnJlZ2wtcG9wdXAtYW5jaG9yLXRvcCB7CiAgICAubWFwbGlicmVnbC1wb3B1cC1jb250ZW50IHsKICAgICAgbWFyZ2luLXRvcDogMThweDsKICAgICAgJjo6YWZ0ZXIsCiAgICAgICY6OmJlZm9yZSB7CiAgICAgICAgdG9wOiBjYWxjKC0xMDAlICsgNnB4KTsKICAgICAgICBib3JkZXItd2lkdGg6IDEycHg7CiAgICAgIH0KICAgICAgLyogdGhpcyBib3JkZXIgY29sb3IgY29udHJvbGxzIHRoZSBjb2xvciBvZiB0aGUgdHJpYW5nbGUgKHdoYXQgbG9va3MgbGlrZSB0aGUgZmlsbCBvZiB0aGUgdHJpYW5nbGUpICovCiAgICAgICY6OmFmdGVyIHsKICAgICAgICBtYXJnaW4tdG9wOiAxcHg7CiAgICAgICAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCByZ2IoMjU1LCAyNTUsIDI1NSkgdHJhbnNwYXJlbnQ7CiAgICAgIH0KICAgICAgJjo6YmVmb3JlIHsKICAgICAgICBtYXJnaW46IDAgYXV0bzsKICAgICAgICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50IHRyYW5zcGFyZW50ICRhcHAtcHJpbWFyeS1jb2xvciB0cmFuc3BhcmVudDsKICAgICAgfQogICAgfQogIH0KICAubWFwbGlicmVnbC1wb3B1cC1jb250ZW50IHsKICAgIGJvcmRlci1yYWRpdXM6IDRweDsKICAgIGJveC1zaGFkb3c6IDAgMXB4IDJweCByZ2JhKDAsIDAsIDAsIDAuMSk7CiAgICBwb2ludGVyLWV2ZW50czogbm9uZTsKICAgIGRpc3BsYXk6IG5vbmU7CiAgICBiYWNrZ3JvdW5kOiAjZmZmOwogICAgYm9yZGVyOiAxcHggc29saWQgJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgcGFkZGluZy1sZWZ0OiA2cHg7CiAgICBwYWRkaW5nLXJpZ2h0OiA2cHg7CiAgICBkaXNwbGF5OiBmbGV4OwogICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7CiAgICBhbGlnbi1pdGVtczogY2VudGVyOwogICAgJjo6YWZ0ZXIsCiAgICAmOjpiZWZvcmUgewogICAgICBjb250ZW50OiAiIjsKICAgICAgZGlzcGxheTogYmxvY2s7CiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICAgICAgd2lkdGg6IDA7CiAgICAgIGhlaWdodDogMDsKICAgICAgYm9yZGVyLXN0eWxlOiBzb2xpZDsKICAgICAgZmxleC1zaHJpbms6IDA7CiAgICB9CiAgfQogIC5tYXBsaWJyZWdsLXBvcHVwLXRpcCB7CiAgICBkaXNwbGF5OiBub25lOwogIH0KfQoKOjp2LWRlZXAgLm1hcGxpYnJlZ2wtcG9wdXAgewogICYuZmxhdG1hcC1tYXJrZXItcG9wdXAgewogICAgYm94LXNoYWRvdzogMXB4IDFweCAycHggcmdiYSgwLCAwLCAwLCAwLjEpOwogICAgcG9pbnRlci1ldmVudHM6IGF1dG87CiAgICBiYWNrZ3JvdW5kOiAjZmZmOwogIH0KfQoKLyogRml4IGZvciBjaHJvbWUgYnVnIHdoZXJlIHVuZGVyIHRyaWFuZ2xlIHBvcHMgdXAgYWJvdmUgb25lIG9uIHRvcCBvZiBpdCAgKi8KLnNlbGVjdG9yOm5vdCgqOnJvb3QpLAo6OnYtZGVlcC5mbGF0bWFwLXRvb2x0aXAtcG9wdXAgewogIC5tYXBsaWJyZWdsLXBvcHVwLWNvbnRlbnQ6OmFmdGVyIHsKICAgIHRvcDogOTkuOSU7CiAgfQp9Cgo6OnYtZGVlcCAuZmxhdG1hcC10b29sdGlwLWRpYWxvZyB7CiAgLm1hcGxpYnJlZ2wtcG9wdXAtdGlwIHsKICAgIGRpc3BsYXk6IG5vbmU7CiAgfQp9Cgo6OnYtZGVlcCAuZmxhdG1hcC1tYXJrZXItcG9wdXAgewogIC5tYXBsaWJyZWdsLXBvcHVwLWNvbnRlbnQgewogICAgcGFkZGluZzogMHB4OwogIH0KfQoKOjp2LWRlZXAgLmZsYXRtYXB2dWVyLXBvcG92ZXIgewogIC5tYXBsaWJyZWdsLXBvcHVwLWNsb3NlLWJ1dHRvbiB7CiAgICBwb3NpdGlvbjogYWJzb2x1dGU7CiAgICByaWdodDogMC41ZW07CiAgICB0b3A6IDA7CiAgICBib3JkZXI6IDA7CiAgICBib3JkZXItcmFkaXVzOiAwIDNweCAwIDA7CiAgICBjdXJzb3I6IHBvaW50ZXI7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDsKICAgIGZvbnQtc2l6ZTogMi41ZW07CiAgICBjb2xvcjogZ3JleTsKICAgIHRvcDogMC45NWVtOwogIH0KfQoKLnpvb21PdXQgewogIHBhZGRpbmctbGVmdDogOHB4Owp9CgouZml0V2luZG93IHsKICBwYWRkaW5nLWxlZnQ6IDhweDsKfQoKLnllbGxvdy1zdGFyLWxlZ2VuZCB7CiAgd2lkdGg6IDEzMHB4OwogIGN1cnNvcjogcG9pbnRlcjsKfQoKLnNldHRpbmdzLWdyb3VwIHsKICBib3R0b206IDE2cHg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRyYW5zaXRpb246IGFsbCAxcyBlYXNlOwogICYub3BlbiB7CiAgICBsZWZ0OiAzMjJweDsKICB9CiAgJi5jbG9zZSB7CiAgICBsZWZ0OiAyNHB4OwogIH0KfQoKOjp2LWRlZXAgLmJhY2tncm91bmQtcG9wcGVyIHsKICBwYWRkaW5nOiA1cHggMTJweDsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmOwogIGJvcmRlcjogMXB4IHNvbGlkICRhcHAtcHJpbWFyeS1jb2xvcjsKICBib3gtc2hhZG93OiAwcHggMnB4IDEycHggMHB4IHJnYmEoMCwgMCwgMCwgMC4wNik7CiAgaGVpZ2h0OiAyNzBweDsKICB3aWR0aDogMTc1cHg7CiAgbWluLXdpZHRoOiAxNzVweDsKICAmLmVsLXBvcHBlclt4LXBsYWNlbWVudF49InRvcCJdIHsKICAgIC5wb3BwZXJfX2Fycm93IHsKICAgICAgYm9yZGVyLXRvcC1jb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yICFpbXBvcnRhbnQ7CiAgICAgICY6OmFmdGVyIHsKICAgICAgICBib3JkZXItdG9wLWNvbG9yOiAjZmZmICFpbXBvcnRhbnQ7CiAgICAgIH0KICAgIH0KICB9Cn0KCjo6di1kZWVwIC5vcGVuLW1hcC1wb3BwZXIgewogIHBhZGRpbmctdG9wOiA1cHg7CiAgcGFkZGluZy1ib3R0b206IDVweDsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmOwogIGJvcmRlcjogMXB4IHNvbGlkICRhcHAtcHJpbWFyeS1jb2xvcjsKICBib3gtc2hhZG93OiAwcHggMnB4IDEycHggMHB4IHJnYmEoMCwgMCwgMCwgMC4wNik7CiAgd2lkdGg6IDE3OHB4OwogIG1pbi13aWR0aDogMTc4cHg7CgogIC5lbC1yb3cgfiAuZWwtcm93IHsKICAgIG1hcmdpbi10b3A6IDhweDsKICB9CgogIC5lbC1idXR0b24gewogICAgcGFkZGluZy10b3A6IDVweDsKICAgIHBhZGRpbmctYm90dG9tOiA1cHg7CiAgfQoKICAmLmVsLXBvcHBlclt4LXBsYWNlbWVudF49InRvcCJdIHsKICAgIC5wb3BwZXJfX2Fycm93IHsKICAgICAgYm9yZGVyLXRvcC1jb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yICFpbXBvcnRhbnQ7CiAgICAgICY6YWZ0ZXIgewogICAgICAgIGJvcmRlci10b3AtY29sb3I6ICNmZmYgIWltcG9ydGFudDsKICAgICAgfQogICAgfQogIH0KfQoKLmJhY2tncm91bmRUZXh0IHsKICBjb2xvcjogcmdiKDQ4LCA0OSwgNTEpOwogIGZvbnQtc2l6ZTogMTRweDsKICBmb250LXdlaWdodDogbm9ybWFsOwogIGxpbmUtaGVpZ2h0OiAyMHB4Owp9CgouYmFja2dyb3VuZENvbnRyb2wgewogIGRpc3BsYXk6IGZsZXg7CiAgbWFyZ2luLXRvcDogMTJweDsKfQoKLmJhY2tncm91bmRDaG9pY2UgewogIHdpZHRoOiAyMHB4OwogIGhlaWdodDogMjBweDsKICBib3JkZXI6IDFweCBzb2xpZCByZ2IoMTQ0LCAxNDcsIDE1Myk7CiAgbWFyZ2luLWxlZnQ6IDIwcHg7CiAgJi5hY3RpdmUgewogICAgYm9yZGVyOiAycHggc29saWQgJGFwcC1wcmltYXJ5LWNvbG9yOwogIH0KICAmOmhvdmVyIHsKICAgIGN1cnNvcjogcG9pbnRlcjsKICB9CiAgJi53aGl0ZSB7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB3aGl0ZTsKICAgIG1hcmdpbi1sZWZ0OiAxMHB4OwogIH0KICAmLmJsYWNrIHsKICAgIGJhY2tncm91bmQtY29sb3I6IGJsYWNrOwogIH0KICAmLmxpZ2h0c2t5Ymx1ZSB7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBsaWdodHNreWJsdWU7CiAgfQp9CgouaWNvbi1idXR0b24gewogIGhlaWdodDogMjRweCAhaW1wb3J0YW50OwogIHdpZHRoOiAyNHB4ICFpbXBvcnRhbnQ7CiAgY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsKICAmOmhvdmVyIHsKICAgIGN1cnNvcjogcG9pbnRlcjsKICB9Cn0KCjo6di1kZWVwIC5tYXBsaWJyZWdsLWN0cmwtbWluaW1hcCB7CiAgdHJhbnNmb3JtLW9yaWdpbjogdG9wIHJpZ2h0OwogIEBtZWRpYSAobWF4LXdpZHRoOiAxMjUwcHgpIHsKICAgIGhlaWdodDogMTI1cHggIWltcG9ydGFudDsgLy8gaW1wb3J0YW50IGlzIG5lZWRlZCBoZXJlIGFzIHdlIGFyZSBvdmVyLXJpZGluZyB0aGUgc3R5bGUgc2V0IGJ5IHRoZSBmbGF0bWFwCiAgICB3aWR0aDogMTgwcHggIWltcG9ydGFudDsKICAgID4+PiAubWFwbGlicmVnbC1jYW52YXMgLm1hcGxpYnJlZ2wtY2FudmFzIHsKICAgICAgaGVpZ2h0OiAxMjVweCAhaW1wb3J0YW50OwogICAgICB3aWR0aDogMTgwcHggIWltcG9ydGFudDsKICAgIH0KICB9CiAgQG1lZGlhIChtaW4td2lkdGg6IDEyNTFweCkgewogICAgaGVpZ2h0OiAxOTBweCAhaW1wb3J0YW50OwogICAgd2lkdGg6IDMwMHB4ICFpbXBvcnRhbnQ7CiAgICA+Pj4gLm1hcGxpYnJlZ2wtY2FudmFzIC5tYXBsaWJyZWdsLWNhbnZhcyB7CiAgICAgIGhlaWdodDogMTkwcHggIWltcG9ydGFudDsKICAgICAgd2lkdGg6IDMwMHB4ICFpbXBvcnRhbnQ7CiAgICB9CiAgfQogIHRyYW5zaXRpb246IGFsbCAxcyBlYXNlOwogICYuc2hyaW5rIHsKICAgIHRyYW5zZm9ybTogc2NhbGUoMC41KTsKICAgIHRyYW5zZm9ybTogc2NhbGUoMC41KTsKICB9Cn0KCi5taW5pbWFwLXJlc2l6ZSB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHBvaW50ZXItZXZlbnRzOiBhbGw7CiAgY3Vyc29yOiBwb2ludGVyOwogIHRvcDogMDsKICByaWdodDogMDsKICBwYWRkaW5nLXRvcDogM3B4OyAvLyBuZWVkZWQgYXMgaWNvbiBpcyBvZmZzZXQKICB3aWR0aDogMjBweDsKICBoZWlnaHQ6IDE0cHg7CiAgei1pbmRleDogOTsKICB0cmFuc2l0aW9uOiBhbGwgMXMgZWFzZTsKICAmLnNocmluayB7CiAgICB0cmFuc2Zvcm06IHJvdGF0ZSgwZGVnKTsKICB9CiAgJi5lbmxhcmdlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDE4MGRlZykgc2NhbGUoMik7CiAgICBwYWRkaW5nLWJvdHRvbTogNXB4OyAvLyBub3RlIHBhZGRpbmcgaXMgYWRkZWQgdG8gdGhlIG9wcG9zaXRlIHNpZGUgc2luY2UgaXQgaXMgcm90YXRlZAogICAgcGFkZGluZy1sZWZ0OiA1cHg7CiAgfQp9Cgo6OnYtZGVlcCAuZmxhdG1hcC1wb3BwZXIgewogIHBhZGRpbmc6IDZweCA0cHg7CiAgZm9udC1zaXplOiAxMnB4OwogIGNvbG9yOiByZ2IoNDgsIDQ5LCA1MSk7CiAgYmFja2dyb3VuZC1jb2xvcjogI2YzZWNmNjsKICBib3JkZXI6IDFweCBzb2xpZCAkYXBwLXByaW1hcnktY29sb3I7CiAgd2hpdGUtc3BhY2U6IG5vd3JhcDsKICBtaW4td2lkdGg6IHVuc2V0OwogICYud2FybmluZy1wb3BwZXIgewogICAgbWluLXdpZHRoOiAxNTBweDsKICAgIG1heC13aWR0aDogNDAwcHg7CiAgICB3b3JkLWJyZWFrOiBrZWVwLWFsbDsKICAgIHdoaXRlLXNwYWNlOiB1bnNldDsKICB9CiAgJi5sZWZ0LXBvcHBlciB7CiAgICAucG9wcGVyX19hcnJvdyB7CiAgICAgIGJvcmRlci1sZWZ0LWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3IgIWltcG9ydGFudDsKICAgICAgJjo6YWZ0ZXIgewogICAgICAgIGJvcmRlci1sZWZ0LWNvbG9yOiAjZjNlY2Y2ICFpbXBvcnRhbnQ7CiAgICAgIH0KICAgIH0KICB9CiAgJi5yaWdodC1wb3BwZXIgewogICAgLnBvcHBlcl9fYXJyb3cgewogICAgICBib3JkZXItcmlnaHQtY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvciAhaW1wb3J0YW50OwogICAgICAmOmFmdGVyIHsKICAgICAgICBib3JkZXItcmlnaHQtY29sb3I6ICNmM2VjZjYgIWltcG9ydGFudDsKICAgICAgfQogICAgfQogIH0KICAmLmVsLXBvcHBlclt4LXBsYWNlbWVudF49InRvcCJdIHsKICAgIC5wb3BwZXJfX2Fycm93IHsKICAgICAgYm9yZGVyLXRvcC1jb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yICFpbXBvcnRhbnQ7CiAgICAgICY6YWZ0ZXIgewogICAgICAgIGJvcmRlci10b3AtY29sb3I6ICNmM2VjZjYgIWltcG9ydGFudDsKICAgICAgfQogICAgfQogIH0KfQoKOjp2LWRlZXAgLmVsLWxvYWRpbmctc3Bpbm5lciB7CiAgaSwKICAuZWwtbG9hZGluZy10ZXh0IHsKICAgIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgfQp9Cgo6OnYtZGVlcCAuZmxhdG1hcC1wb3B1cC1wb3BwZXIgewogIC5tYXBsaWJyZWdsLXBvcHVwLXRpcCB7CiAgICBib3JkZXItYm90dG9tLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgfQogIC5tYXBsaWJyZWdsLXBvcHVwLWNvbnRlbnQgewogICAgcGFkZGluZzogNnB4IDRweDsKICAgIGZvbnQtc2l6ZTogMTJweDsKICAgIGNvbG9yOiByZ2IoNDgsIDQ5LCA1MSk7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZjNlY2Y2OwogICAgYm9yZGVyOiAxcHggc29saWQgJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgd2hpdGUtc3BhY2U6IG5vd3JhcDsKICAgIG1pbi13aWR0aDogdW5zZXQ7CiAgICAubWFwbGlicmVnbC1wb3B1cC1jbG9zZS1idXR0b24gewogICAgICBkaXNwbGF5OiBub25lOwogICAgfQogIH0KfQoKOjp2LWRlZXAgLnBvcHBlci16b29tb3V0IHsKICBwYWRkaW5nLXJpZ2h0OiAxM3B4ICFpbXBvcnRhbnQ7CiAgbGVmdDogLTIxcHggIWltcG9ydGFudDsKfQoKOjp2LWRlZXAgLnBvcHBlci16b29tb3V0IHsKICAucG9wcGVyX19hcnJvdyB7CiAgICBsZWZ0OiA1M3B4ICFpbXBvcnRhbnQ7CiAgfQp9Cgo6OnYtZGVlcCAubWFwbGlicmVnbC1wb3B1cC1jb250ZW50IHsKICBwYWRkaW5nOiAwcHg7Cn0KCi5ib3R0b20tcmlnaHQtY29udHJvbCB7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHJpZ2h0OiAxNnB4OwogIGJvdHRvbTogMTZweDsKfQoKOjp2LWRlZXAgLm15LWRyYXdlciB7CiAgYmFja2dyb3VuZDogcmdiYSgwLCAwLCAwLCAwKTsKICBib3gtc2hhZG93OiBub25lOwp9CgouZHJhd2VyIHsKICA6OnYtZGVlcCAuZWwtZHJhd2VyOmZvY3VzIHsKICAgIG91dGxpbmU6IG5vbmU7CiAgfQp9Cgoub3Blbi1kcmF3ZXIsCi5kcmF3ZXItYnV0dG9uIHsKICB6LWluZGV4OiA4OwogIHdpZHRoOiAyMHB4OwogIGhlaWdodDogNDBweDsKICBib3JkZXI6IHNvbGlkIDFweCAkYXBwLXByaW1hcnktY29sb3I7CiAgdGV4dC1hbGlnbjogY2VudGVyOwogIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7CiAgY3Vyc29yOiBwb2ludGVyOwogIHBvaW50ZXItZXZlbnRzOiBhdXRvOwp9Cgoub3Blbi1kcmF3ZXIgewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICBsZWZ0OiAwcHg7CiAgYmFja2dyb3VuZC1jb2xvcjogI2Y3ZmFmZjsKICBib3gtc2hhZG93OiAwIDJweCAxMnB4IDAgcmdiYSgwLCAwLCAwLCAwLjA2KTsKfQoKLmRyYXdlci1idXR0b24gewogIGZsb2F0OiBsZWZ0OwogIG1hcmdpbi10b3A6IGNhbGMoNTAlIC0gMzZweCk7CiAgYmFja2dyb3VuZC1jb2xvcjogI2Y5ZjJmYzsKCiAgaSB7CiAgICBmb250LXdlaWdodDogNjAwOwogICAgbWFyZ2luLXRvcDogMTJweDsKICAgIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgICB0cmFuc2l0aW9uLWRlbGF5OiAwLjlzOwogIH0KICAmLm9wZW4gewogICAgaSB7CiAgICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpIHNjYWxlWSgyKTsKICAgIH0KICB9CiAgJi5jbG9zZSB7CiAgICBpIHsKICAgICAgdHJhbnNmb3JtOiByb3RhdGUoMTgwZGVnKSBzY2FsZVkoMik7CiAgICB9CiAgfQp9Cgo6OnYtZGVlcCAubWFwbGlicmVnbC1jYW52YXMtY29udGFpbmVyIHsKICBjYW52YXMgewogICAgb3V0bGluZTogbm9uZTsKICB9Cn0KCi5iYWNrZ3JvdW5kU3BhY2VyIHsKICBib3JkZXItYm90dG9tOiAxcHggc29saWQgI2U0ZTdlZDsKICBtYXJnaW4tYm90dG9tOiAxMHB4Owp9CgouZmxhdG1hcC1yYWRpbyB7CiAgOjp2LWRlZXAgbGFiZWwgewogICAgbWFyZ2luLXJpZ2h0OiAyMHB4OwogICAgJjpsYXN0LWNoaWxkIHsKICAgICAgbWFyZ2luLXJpZ2h0OiAwcHg7CiAgICB9CiAgfQogIDo6di1kZWVwIC5lbC1yYWRpb19faW5wdXQgewogICAgJi5pcy1jaGVja2VkIHsKICAgICAgJiArIC5lbC1yYWRpb19fbGFiZWwgewogICAgICAgIGNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgICAgIH0KICAgICAgLmVsLXJhZGlvX19pbm5lciB7CiAgICAgICAgYm9yZGVyLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgICAgICAgYmFja2dyb3VuZDogJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgICB9CiAgICB9CiAgICAuZWwtcmFkaW9fX2lubmVyOmhvdmVyIHsKICAgICAgYm9yZGVyLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7CiAgICB9CiAgfQp9Cgo6OnYtZGVlcCAuY3VzdG9tLXBvcHVwIHsKICAubWFwbGlicmVnbC1wb3B1cC10aXAgewogICAgZGlzcGxheTogbm9uZTsKICB9CiAgLm1hcGxpYnJlZ2wtcG9wdXAtY29udGVudCB7CiAgICBib3JkZXItcmFkaXVzOiA0cHg7CiAgICBib3gtc2hhZG93OiAwIDFweCAycHggcmdiYSgwLCAwLCAwLCAwLjEpOwogICAgcG9pbnRlci1ldmVudHM6IG5vbmU7CiAgICBkaXNwbGF5OiBub25lOwogICAgYmFja2dyb3VuZDogI2ZmZjsKICAgIGZvbnQtZmFtaWx5OiAiQXNhcCIsIHNhbnMtc2VyaWY7CiAgICBmb250LXNpemU6IDEycHQ7CiAgICBjb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgYm9yZGVyOiAxcHggc29saWQgJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgcGFkZGluZy1sZWZ0OiA2cHg7CiAgICBwYWRkaW5nLXJpZ2h0OiA2cHg7CiAgICBwYWRkaW5nLXRvcDogNnB4OwogICAgcGFkZGluZy1ib3R0b206IDZweDsKICAgIGRpc3BsYXk6IGZsZXg7CiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsKICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7CiAgICAmOjphZnRlciwKICAgICY6OmJlZm9yZSB7CiAgICAgIGNvbnRlbnQ6ICIiOwogICAgICBkaXNwbGF5OiBibG9jazsKICAgICAgcG9zaXRpb246IGFic29sdXRlOwogICAgICB3aWR0aDogMDsKICAgICAgaGVpZ2h0OiAwOwogICAgICBib3JkZXItc3R5bGU6IHNvbGlkOwogICAgICBmbGV4LXNocmluazogMDsKICAgIH0KICAgIC5tYXBsaWJyZWdsLXBvcHVwLWNsb3NlLWJ1dHRvbiB7CiAgICAgIGRpc3BsYXk6IG5vbmU7CiAgICB9CiAgfQogICYubWFwbGlicmVnbC1wb3B1cC1hbmNob3ItYm90dG9tIHsKICAgIC5tYXBsaWJyZWdsLXBvcHVwLWNvbnRlbnQgewogICAgICBtYXJnaW4tYm90dG9tOiAxMnB4OwogICAgICAmOjphZnRlciwKICAgICAgJjo6YmVmb3JlIHsKICAgICAgICB0b3A6IDEwMCU7CiAgICAgICAgYm9yZGVyLXdpZHRoOiAxMnB4OwogICAgICB9CiAgICAgIC8qIHRoaXMgYm9yZGVyIGNvbG9yIGNvbnRyb2xscyB0aGUgY29sb3Igb2YgdGhlIHRyaWFuZ2xlICh3aGF0IGxvb2tzIGxpa2UgdGhlIGZpbGwgb2YgdGhlIHRyaWFuZ2xlKSAqLwogICAgICAmOjphZnRlciB7CiAgICAgICAgbWFyZ2luLXRvcDogLTFweDsKICAgICAgICBib3JkZXItY29sb3I6IHJnYigyNTUsIDI1NSwgMjU1KSB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCB0cmFuc3BhcmVudDsKICAgICAgfQogICAgICAvKiB0aGlzIGJvcmRlciBjb2xvciBjb250cm9sbHMgdGhlIG91dHNpZGUsIHRoaW4gYm9yZGVyICovCiAgICAgICY6OmJlZm9yZSB7CiAgICAgICAgbWFyZ2luOiAwIGF1dG87CiAgICAgICAgYm9yZGVyLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3IgdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQ7CiAgICAgIH0KICAgIH0KICB9CiAgJi5tYXBsaWJyZWdsLXBvcHVwLWFuY2hvci10b3AgewogICAgLm1hcGxpYnJlZ2wtcG9wdXAtY29udGVudCB7CiAgICAgIG1hcmdpbi10b3A6IDE4cHg7CiAgICAgICY6OmFmdGVyLAogICAgICAmOjpiZWZvcmUgewogICAgICAgIHRvcDogY2FsYygtMTAwJSArIDZweCk7CiAgICAgICAgYm9yZGVyLXdpZHRoOiAxMnB4OwogICAgICB9CiAgICAgIC8qIHRoaXMgYm9yZGVyIGNvbG9yIGNvbnRyb2xscyB0aGUgY29sb3Igb2YgdGhlIHRyaWFuZ2xlICh3aGF0IGxvb2tzIGxpa2UgdGhlIGZpbGwgb2YgdGhlIHRyaWFuZ2xlKSAqLwogICAgICAmOjphZnRlciB7CiAgICAgICAgbWFyZ2luLXRvcDogMXB4OwogICAgICAgIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQgdHJhbnNwYXJlbnQgcmdiKDI1NSwgMjU1LCAyNTUpIHRyYW5zcGFyZW50OwogICAgICB9CiAgICAgICY6OmJlZm9yZSB7CiAgICAgICAgbWFyZ2luOiAwIGF1dG87CiAgICAgICAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCB0cmFuc3BhcmVudCAkYXBwLXByaW1hcnktY29sb3IgdHJhbnNwYXJlbnQ7CiAgICAgIH0KICAgIH0KICB9Cn0KCi5zZWxlY3QtYm94IHsKICBib3JkZXItcmFkaXVzOiA0cHg7CiAgYm9yZGVyOiAxcHggc29saWQgcmdiKDE0NCwgMTQ3LCAxNTMpOwogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXdoaXRlKTsKICBmb250LXdlaWdodDogNTAwOwogIGNvbG9yOiByZ2IoNDgsIDQ5LCA1MSk7CiAgOjp2LWRlZXAgLmVsLWlucHV0X19pbm5lciB7CiAgICBoZWlnaHQ6IDMwcHg7CiAgICBjb2xvcjogcmdiKDQ4LCA0OSwgNTEpOwogIH0KICA6OnYtZGVlcCAuZWwtaW5wdXRfX2lubmVyIHsKICAgICZpcy1mb2N1cywKICAgICY6Zm9jdXMgewogICAgICBib3JkZXI6IDFweCBzb2xpZCAkYXBwLXByaW1hcnktY29sb3I7CiAgICB9CiAgfQogIDo6di1kZWVwIC5lbC1pbnB1dF9faWNvbiB7CiAgICBsaW5lLWhlaWdodDogMzBweDsKICB9Cn0KCjo6di1kZWVwIC5mbGF0bWFwX2Ryb3Bkb3duIHsKICBtaW4td2lkdGg6IDE2MHB4ICFpbXBvcnRhbnQ7CiAgLmVsLXNlbGVjdC1kcm9wZG93bl9faXRlbSB7CiAgICB3aGl0ZS1zcGFjZTogbm93cmFwOwogICAgdGV4dC1hbGlnbjogbGVmdDsKICAgICYuc2VsZWN0ZWQgewogICAgICBjb2xvcjogJGFwcC1wcmltYXJ5LWNvbG9yOwogICAgICBmb250LXdlaWdodDogbm9ybWFsOwogICAgfQogIH0KfQo="},{"version":3,"sources":["FlatmapVuer.vue"],"names":[],"mappings":";AA01CA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"FlatmapVuer.vue","sourceRoot":"node_modules/@abi-software/flatmapvuer/src/components","sourcesContent":["<template>\n  <div\n    class=\"flatmap-container\"\n    ref=\"flatmapContainer\"\n    v-loading=\"loading\"\n    element-loading-text=\"Loading...\"\n    element-loading-spinner=\"el-icon-loading\"\n    element-loading-background=\"rgba(0, 0, 0, 0.3)\"\n  >\n    <map-svg-sprite-color />\n    <div\n      style=\"height: 100%; width: 100%; position: relative; overflow-y: none\"\n    >\n      <div style=\"height: 100%; width: 100%\" ref=\"display\"></div>\n      <div class=\"beta-popovers\">\n        <div>\n          <el-popover\n            placement=\"right\"\n            :appendToBody=\"false\"\n            trigger=\"manual\"\n            popper-class=\"warning-popper flatmap-popper right-popper\"\n            v-model=\"hoverVisibilities[6].value\"\n            ref=\"warningPopover\"\n          >\n            <p\n              v-if=\"isLegacy\"\n              @mouseover=\"showToolitip(6)\"\n              @mouseout=\"hideToolitip(6)\"\n            >\n              This is a legacy map, you may view the latest map instead.\n            </p>\n            <p\n              v-else-if=\"isFC\"\n              @mouseover=\"showToolitip(6)\"\n              @mouseout=\"hideToolitip(6)\"\n            >\n              This map displays the connectivity of individual neurons.\n              Specifically, those which align with (parts of) the neuron\n              populations from the\n              <a\n                href=\"https://sparc.science/resources/1ZUKXU2YmLcn2reCyXjlew\"\n                target=\"_blank\"\n              >\n                ApiNATOMY\n              </a>\n              models available in\n              <a\n                href=\"https://sparc.science/resources/6eg3VpJbwQR4B84CjrvmyD\"\n                target=\"_blank\"\n              >\n                SCKAN </a\n              >.\n            </p>\n            <p v-else @mouseover=\"showToolitip(6)\" @mouseout=\"hideToolitip(6)\">\n              This map displays the connectivity of neuron populations.\n              Specifically, those from the primarily rat-based\n              <a\n                href=\"https://sparc.science/resources/1ZUKXU2YmLcn2reCyXjlew\"\n                target=\"_blank\"\n              >\n                ApiNATOMY\n              </a>\n              models available in\n              <a\n                href=\"https://sparc.science/resources/6eg3VpJbwQR4B84CjrvmyD\"\n                target=\"_blank\"\n              >\n                SCKAN </a\n              >. New connectivity and species specificity will be added as the\n              SPARC program progresses.\n            </p>\n          </el-popover>\n          <i\n            class=\"el-icon-warning warning-icon\"\n            v-if=\"displayWarning\"\n            @mouseover=\"showToolitip(6)\"\n            @mouseout=\"hideToolitip(6)\"\n            v-popover:warningPopover\n          >\n            <template v-if=\"isLegacy\">\n              <span class=\"warning-text\">Legacy Map</span>\n              <div class=\"latest-map-text\" @click=\"viewLatestMap\">\n                Click here for the latest map\n              </div>\n            </template>\n            <template v-else>\n              <span class=\"warning-text\">Beta</span>\n            </template>\n          </i>\n        </div>\n        <el-popover\n          :content=\"latestChangesMessage\"\n          placement=\"right\"\n          v-if=\"displayLatestChanges\"\n          :appendToBody=\"false\"\n          trigger=\"manual\"\n          popper-class=\"warning-popper flatmap-popper right-popper\"\n          v-model=\"hoverVisibilities[7].value\"\n          ref=\"latestChangesPopover\"\n        ></el-popover>\n        <i\n          class=\"el-icon-warning latest-changesicon\"\n          v-if=\"displayLatestChanges && latestChangesMessage\"\n          @mouseover=\"showToolitip(7)\"\n          @mouseout=\"hideToolitip(7)\"\n          v-popover:latestChangesPopover\n        >\n          <span class=\"warning-text\">What's new?</span>\n        </i>\n      </div>\n\n      <!-- The element below is placed onto the flatmap when it is ready -->\n      <i\n        class=\"el-icon-arrow-down minimap-resize\"\n        :class=\"{ enlarge: minimapSmall, shrink: !minimapSmall }\"\n        ref=\"minimapResize\"\n        v-show=\"minimapResizeShow\"\n        @click=\"closeMinimap\"\n      ></i>\n\n      <div class=\"bottom-right-control\">\n        <el-popover\n          content=\"Zoom in\"\n          placement=\"left\"\n          :appendToBody=\"false\"\n          trigger=\"manual\"\n          popper-class=\"flatmap-popper left-popper\"\n          v-model=\"hoverVisibilities[0].value\"\n        >\n          <map-svg-icon\n            icon=\"zoomIn\"\n            class=\"icon-button zoomIn\"\n            slot=\"reference\"\n            @click.native=\"zoomIn()\"\n            @mouseover.native=\"showToolitip(0)\"\n            @mouseout.native=\"hideToolitip(0)\"\n          />\n        </el-popover>\n        <el-popover\n          content=\"Zoom out\"\n          placement=\"top-end\"\n          :appendToBody=\"false\"\n          trigger=\"manual\"\n          popper-class=\"flatmap-popper popper-zoomout\"\n          v-model=\"hoverVisibilities[1].value\"\n        >\n          <map-svg-icon\n            icon=\"zoomOut\"\n            class=\"icon-button zoomOut\"\n            slot=\"reference\"\n            @click.native=\"zoomOut()\"\n            @mouseover.native=\"showToolitip(1)\"\n            @mouseout.native=\"hideToolitip(1)\"\n          />\n        </el-popover>\n        <el-popover\n          content=\"Reset\"\n          placement=\"top\"\n          :appendToBody=\"false\"\n          trigger=\"manual\"\n          popper-class=\"flatmap-popper\"\n          v-model=\"hoverVisibilities[2].value\"\n        >\n          <div>\n            Fit to\n            <br />\n            window\n          </div>\n          <map-svg-icon\n            slot=\"reference\"\n            icon=\"fitWindow\"\n            class=\"icon-button fitWindow\"\n            @click.native=\"resetView()\"\n            @mouseover.native=\"showToolitip(2)\"\n            @mouseout.native=\"hideToolitip(2)\"\n          />\n        </el-popover>\n      </div>\n      <el-popover\n        content=\"Change pathway visibility\"\n        placement=\"right\"\n        :appendToBody=\"false\"\n        trigger=\"manual\"\n        popper-class=\"flatmap-popper right-popper\"\n        v-model=\"hoverVisibilities[4].value\"\n        ref=\"checkBoxPopover\"\n      />\n      <div\n        class=\"pathway-location\"\n        :class=\"{ open: drawerOpen, close: !drawerOpen }\"\n      >\n        <div\n          class=\"pathway-container\"\n          :class=\"{ open: drawerOpen, close: !drawerOpen }\"\n          :style=\"{ 'max-height' : pathwaysMaxHeight + 'px' }\"\n          v-if=\"pathControls\"\n          v-popover:checkBoxPopover\n        >\n          <svg-legends v-if=\"!isFC\" class=\"svg-legends-container\" />\n          <el-popover\n            content=\"Location of the featured dataset\"\n            placement=\"right\"\n            :appendToBody=\"false\"\n            trigger=\"hover\"\n            popper-class=\"flatmap-popper popper-bump-right right-popper\"\n            v-model=\"hoverVisibilities[9].value\"\n            ref=\"featuredMarkerPopover\"\n          >\n          </el-popover>\n          <div v-show=\"showStarInLegend\" v-popover:featuredMarkerPopover class=\"yellow-star-legend\" v-html=\"yellowstar\"></div>\n          <!-- The line below places the yellowstar svg on the left, and the text \"Featured markers on the right\" with css so they are both centered in the div -->\n\n          <el-popover\n            content=\"Find these markers for data\"\n            placement=\"right\"\n            :appendToBody=\"false\"\n            trigger=\"manual\"\n            popper-class=\"flatmap-popper popper-bump-right  right-popper\"\n            v-model=\"hoverVisibilities[5].value\"\n            ref=\"markerPopover\"\n          ></el-popover>\n          <div\n            v-show=\"hoverVisibilities[5].value\"\n            class=\"flatmap-marker-help\"\n            v-html=\"flatmapMarker\"\n            v-popover:markerPopover\n          ></div>\n          <tree-controls\n            v-if=\"isFC && systems && systems.length > 0\"\n            :active=\"currentActive\"\n            :hover=\"currentHover\"\n            :tree-data=\"systems\"\n            ref=\"treeControls\"\n            @changed=\"systemSelected\"\n            @checkAll=\"checkAllSystems\"\n            @change-active=\"ftuSelected\"\n          />\n          <selections-group\n            v-if=\"!isFC && centreLines && centreLines.length > 0\"\n            title=\"Nerves\"\n            labelKey=\"label\"\n            identifierKey=\"key\"\n            :selections=\"centreLines\"\n            @changed=\"centreLinesSelected\"\n            ref=\"centrelinesSelection\"\n            key=\"centrelinesSelection\"\n          />\n          <!--\n          <selections-group\n            v-if=\"isFC && sckanDisplay && sckanDisplay.length > 0\"\n            title=\"SCKAN\"\n            labelKey=\"label\"\n            identifierKey=\"key\"\n            :selections=\"sckanDisplay\"\n            @changed=\"sckanSelected\"\n            @checkAll=\"checkAllSCKAN\"\n            ref=\"skcanSelection\"\n            key=\"skcanSelection\"\n          />\n          <selections-group\n            v-if=\"layers && layers.length > 0\"\n            title=\"Layers\"\n            labelKey=\"description\"\n            identifierKey=\"id\"\n            :selections=\"layers\"\n            @changed=\"layersSelected\"\n            @checkAll=\"checkAllLayers\"\n            ref=\"layersSelection\"\n            key=\"layersSelection\"\n          />\n          -->\n          <selections-group\n            v-if=\"!isFC && taxonConnectivity && taxonConnectivity.length > 0\"\n            title=\"Observed in\"\n            labelKey=\"label\"\n            identifierKey=\"taxon\"\n            :selections=\"taxonConnectivity\"\n            @changed=\"taxonsSelected\"\n            @checkAll=\"checkAllTaxons\"\n            ref=\"taxonSelection\"\n            key=\"taxonSelection\"\n          />\n          <selections-group\n            v-if=\"pathways && pathways.length > 0\"\n            title=\"Pathways\"\n            labelKey=\"label\"\n            identifierKey=\"type\"\n            colourStyle=\"line\"\n            :selections=\"pathways\"\n            @changed=\"pathwaysSelected\"\n            @checkAll=\"checkAllPathways\"\n            ref=\"pathwaysSelection\"\n            key=\"pathwaysSelection\"\n          />\n        </div>\n        <div\n          @click=\"toggleDrawer\"\n          class=\"drawer-button\"\n          :class=\"{ open: drawerOpen, close: !drawerOpen }\"\n        >\n          <i class=\"el-icon-arrow-left\"></i>\n        </div>\n      </div>\n      <el-popover\n        ref=\"open-map-popover\"\n        placement=\"top-start\"\n        width=\"128\"\n        :append-to-body=\"false\"\n        trigger=\"click\"\n        popper-class=\"open-map-popper non-selectable\"\n      >\n        <el-row v-for=\"item in openMapOptions\" :key=\"item.key\">\n          <el-button type=\"primary\" plain @click=\"$emit('open-map', item.key)\">\n            {{ item.display }}\n          </el-button>\n        </el-row>\n      </el-popover>\n      <el-popover\n        ref=\"backgroundPopover\"\n        placement=\"top-start\"\n        width=\"175\"\n        :appendToBody=\"false\"\n        trigger=\"click\"\n        popper-class=\"background-popper\"\n      >\n        <el-row class=\"backgroundText\">Viewing Mode</el-row>\n        <el-row class=\"backgroundControl\">\n          <el-select\n            :popper-append-to-body=\"false\"\n            v-model=\"viewingMode\"\n            placeholder=\"Select\"\n            class=\"select-box\"\n            popper-class=\"flatmap_dropdown\"\n          >\n            <el-option\n              v-for=\"item in viewingModes\"\n              :key=\"item\"\n              :label=\"item\"\n              :value=\"item\"\n            >\n              <el-row>\n                <el-col :span=\"12\">{{ item }}</el-col>\n              </el-row>\n            </el-option>\n          </el-select>\n        </el-row>\n        <el-row class=\"backgroundSpacer\"></el-row>\n        <el-row class=\"backgroundText\">Organs display</el-row>\n        <el-row class=\"backgroundControl\">\n          <el-radio-group\n            v-model=\"colourRadio\"\n            class=\"flatmap-radio\"\n            @change=\"setColour\"\n          >\n            <el-radio :label=\"true\">Colour</el-radio>\n            <el-radio :label=\"false\">Greyscale</el-radio>\n          </el-radio-group>\n        </el-row>\n        <el-row class=\"backgroundSpacer\"></el-row>\n        <el-row class=\"backgroundText\">Outlines display</el-row>\n        <el-row class=\"backgroundControl\">\n          <el-radio-group\n            v-model=\"outlinesRadio\"\n            class=\"flatmap-radio\"\n            @change=\"setOutlines\"\n          >\n            <el-radio :label=\"true\">Show</el-radio>\n            <el-radio :label=\"false\">Hide</el-radio>\n          </el-radio-group>\n        </el-row>\n        <el-row class=\"backgroundSpacer\"></el-row>\n        <el-row class=\"backgroundText\">Change background</el-row>\n        <el-row class=\"backgroundControl\">\n          <div\n            v-for=\"item in availableBackground\"\n            :key=\"item\"\n            :class=\"[\n              'backgroundChoice',\n              item,\n              item == currentBackground ? 'active' : '',\n            ]\"\n            @click=\"backgroundChangeCallback(item)\"\n          />\n        </el-row>\n      </el-popover>\n      <div\n        class=\"settings-group\"\n        :class=\"{ open: drawerOpen, close: !drawerOpen }\"\n      >\n        <el-row>\n          <el-popover\n            v-model=\"hoverVisibilities[8].value\"\n            content=\"Open new map\"\n            placement=\"right\"\n            :append-to-body=\"false\"\n            trigger=\"manual\"\n            popper-class=\"flatmap-popper right-popper\"\n          >\n            <map-svg-icon\n              v-if=\"enableOpenMapUI && openMapOptions.length > 0\"\n              slot=\"reference\"\n              v-popover:open-map-popover\n              icon=\"openMap\"\n              class=\"icon-button\"\n              @mouseover.native=\"showToolitip(8)\"\n              @mouseout.native=\"hideToolitip(8)\"\n            />\n          </el-popover>\n        </el-row>\n        <el-row>\n          <el-popover\n            content=\"Change settings\"\n            placement=\"right\"\n            v-model=\"hoverVisibilities[3].value\"\n            :appendToBody=\"false\"\n            trigger=\"manual\"\n            popper-class=\"flatmap-popper right-popper\"\n          >\n            <map-svg-icon\n              v-popover:backgroundPopover\n              icon=\"changeBckgd\"\n              class=\"icon-button\"\n              slot=\"reference\"\n              @mouseover.native=\"showToolitip(3)\"\n              @mouseout.native=\"hideToolitip(3)\"\n            />\n          </el-popover>\n        </el-row>\n      </div>\n      <Tooltip\n        ref=\"tooltip\"\n        class=\"tooltip\"\n        :annotationEntry=\"annotationEntry\"\n        :entry=\"tooltipEntry\"\n        :annotationDisplay=\"viewingMode === 'Annotation'\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\n/* eslint-disable no-alert, no-console */\nimport Vue from \"vue\";\nimport Tooltip from \"./Tooltip\";\nimport SelectionsGroup from \"./SelectionsGroup\";\nimport TreeControls from \"./TreeControls\";\nimport { MapSvgIcon, MapSvgSpriteColor } from \"@abi-software/svg-sprite\";\nimport SvgLegends from \"./legends/SvgLegends\";\nimport {\n  Button,\n  Col,\n  Loading,\n  Radio,\n  RadioGroup,\n  Row,\n  Select,\n} from \"element-ui\";\nimport lang from \"element-ui/lib/locale/lang/en\";\nimport locale from \"element-ui/lib/locale\";\nimport flatmapMarker from \"../icons/flatmap-marker\";\nimport {FlatmapQueries, findTaxonomyLabel} from \"../services/flatmapQueries.js\";\nimport yellowstar from \"../icons/yellowstar\";\n\nlocale.use(lang);\nVue.use(Button);\nVue.use(Col);\nVue.use(Loading.directive);\nVue.use(Radio);\nVue.use(RadioGroup);\nVue.use(Row);\nVue.use(Select);\nconst ResizeSensor = require(\"css-element-queries/src/ResizeSensor\");\n\nconst processTaxon = (flatmapAPI, taxonIdentifiers) => {\n  let processed = [];\n  taxonIdentifiers.forEach((taxon) => {\n    findTaxonomyLabel(flatmapAPI, taxon).then((value) => {\n      const item = { taxon, label: value };\n      processed.push(item);\n    });\n  });\n\n  return processed;\n};\n\nconst processFTUs = (parent, key) => {\n  const ftus = [];\n  let items = parent.organs ? parent.organs : parent.ftus;\n  const children = items\n    ? items.filter(\n        (obj, index) =>\n          items.findIndex((item) => item.label === obj.label) === index\n      )\n    : undefined;\n  if (children) {\n    children.forEach((child) => {\n      const data = {\n        label: child.label,\n        models: child.models,\n        key: `${key}.${child.label}`,\n      };\n      const grandChildren = processFTUs(child, data.key);\n      if (grandChildren.length > 0) {\n        data.children = grandChildren;\n      }\n      ftus.push(data);\n    });\n  }\n  return ftus;\n};\n\nconst processSystems = (systems) => {\n  const allSystems = [];\n  if (systems && systems.length > 0) {\n    const data = { label: \"All\", key: \"All\", children: [] };\n    systems.forEach((system) => {\n      const child = {\n        colour: system.colour,\n        enabled: system.enabled,\n        label: system.id,\n        key: system.id,\n      };\n      const children = processFTUs(system, child.key);\n      if (children.length > 0) child.children = children;\n      data.children.push(child);\n    });\n\n    allSystems.push(data);\n  }\n\n  return allSystems;\n};\n\nconst createUnfilledTooltipData = function () {\n  return {\n    destinations: [],\n    origins: [],\n    components: [],\n    destinationsWithDatasets: [],\n    originsWithDatasets: [],\n    componentsWithDatasets: [],\n    resource: undefined,\n  };\n};\n\nexport default {\n  name: \"FlatmapVuer\",\n  components: {\n    MapSvgIcon,\n    MapSvgSpriteColor,\n    Tooltip,\n    TreeControls,\n    SelectionsGroup,\n    SvgLegends,\n  },\n  beforeCreate: function () {\n    this.mapManager = undefined;\n    this.mapImp = undefined;\n    //The state watcher may triggered before\n    //created causing issue, This flag will\n    //resolve this issue.\n    this.setStateRequired = false;\n  },\n  methods: {\n    viewLatestMap: function () {\n      let biologicalSex = this.biologicalSex ? this.biologicalSex : undefined;\n      //Human requires special handling\n      if (this.entry === \"NCBITaxon:9606\") {\n        biologicalSex = \"PATO:0000384\";\n      }\n      const state = {\n        entry: this.entry,\n        biologicalSex,\n        viewport: this.mapImp.getState(),\n      };\n      this.$emit(\"view-latest-map\", state);\n    },\n    backgroundChangeCallback: function (colour) {\n      this.currentBackground = colour;\n      if (this.mapImp) {\n        this.mapImp.setBackgroundColour(this.currentBackground, 1);\n      }\n    },\n    toggleDrawer: function () {\n      this.drawerOpen = !this.drawerOpen;\n    },\n    /**\n     * Function to toggle colour/greyscale of organs.\n     */\n    setColour: function (flag) {\n      this.colourRadio = flag;\n      if (this.mapImp) {\n        this.mapImp.setColour({ colour: flag, outline: this.outlinesRadio });\n      }\n    },\n    /**\n     * Function to toggle outlines f organs.\n     */\n    setOutlines: function (flag) {\n      this.outlineRadio = flag;\n      if (this.mapImp) {\n        this.mapImp.setColour({ colour: this.colourRadio, outline: flag });\n      }\n    },\n    /**\n     * Function to toggle paths to default.\n     * Also called when the associated button is pressed.\n     */\n    resetView: function () {\n      if (this.mapImp) {\n        this.mapImp.resetMap();\n        if (this.$refs.centrelinesSelection) {\n          this.$refs.centrelinesSelection.reset();\n        }\n        if (this.$refs.skcanSelection) {\n          this.$refs.skcanSelection.reset();\n        }\n        if (this.$refs.layersSelection) {\n          this.$refs.layersSelection.reset();\n        }\n        if (this.$refs.systemsSelection) {\n          this.$refs.pathwaysSelection.reset();\n        }\n        if (this.$refs.pathwaysSelection) {\n          this.$refs.pathwaysSelection.reset();\n        }\n      }\n    },\n    /**\n     * Function to zoom in.\n     * Also called when the associated button is pressed.\n     */\n    zoomIn: function () {\n      if (this.mapImp) {\n        this.mapImp.zoomIn();\n      }\n    },\n    /**\n     * Function to zoom out.\n     * Also called when the associated button is pressed.\n     */\n    zoomOut: function () {\n      if (this.mapImp) {\n        this.mapImp.zoomOut();\n      }\n    },\n    centreLinesSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enableCentrelines(payload.value);\n      }\n    },\n    sckanSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enableSckanPath(payload.key, payload.value);\n      }\n    },\n    checkAllSCKAN: function (payload) {\n      if (this.mapImp) {\n        payload.keys.forEach((key) =>\n          this.mapImp.enableSckanPath(key, payload.value));\n      }\n    },\n    highlightConnectedPaths: function (payload) {\n      if (this.mapImp) {\n        let paths = [...this.mapImp.pathModelNodes(payload)];\n        // The line below matches the paths to the annIdToFeatureId map to get the feature ids\n\n        let pathFeatures = paths.map(p=>this.mapImp.featureProperties(p));\n        let toHighlight = [];\n        pathFeatures.forEach(p=>{\n          this.mapImp.nodePathModels(p.featureId).forEach(f=>{\n            toHighlight.push(f);\n          })\n        })\n        // display connected paths\n        this.mapImp.zoomToFeatures(toHighlight, {noZoomIn: true});\n      }\n    },\n    systemSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enableSystem(payload.key, payload.value);\n      }\n    },\n    checkAllSystems: function (flag) {\n      if (this.mapImp) {\n        this.systems[0].children.forEach((key) =>\n          this.mapImp.enableSystem(key.label, flag)\n        );\n      }\n    },\n    ftuSelected: function (models) {\n      this.searchAndShowResult(models, true);\n    },\n    layersSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enableLayer(payload.key, payload.value);\n      }\n    },\n    checkAllLayers: function (payload) {\n      if (this.mapImp) {\n        payload.keys.forEach((key) =>\n          this.mapImp.enableLayer(key, payload.value)\n        );\n      }\n    },\n    taxonsSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enableConnectivityByTaxonIds(payload.key, payload.value);\n      }\n    },\n    checkAllTaxons: function (payload) {\n      if (this.mapImp) {\n        payload.keys.forEach((key) =>\n          this.mapImp.enableConnectivityByTaxonIds(key, payload.value)\n        );\n      }\n    },\n    pathwaysSelected: function (payload) {\n      if (this.mapImp) {\n        this.mapImp.enablePath(payload.key, payload.value);\n      }\n    },\n    checkAllPathways: function (payload) {\n      if (this.mapImp) {\n        payload.keys.forEach((key) =>\n          this.mapImp.enablePath(key, payload.value)\n        );\n      }\n    },\n    enablePanZoomEvents: function (flag) {\n      this.mapImp.enablePanZoomEvents(flag);\n    },\n    eventCallback: function () {\n      return (eventType, data, ...args) => {\n        if (eventType !== \"pan-zoom\") {\n          const label = data.label;\n          const resource = [data.models];\n          const taxonomy = this.entry;\n          const biologicalSex = this.biologicalSex;\n          const payload = {\n            dataset: data.dataset,\n            biologicalSex: biologicalSex,\n            taxonomy: taxonomy,\n            resource: resource,\n            label: label,\n            feature: data,\n            userData: args,\n            eventType: eventType,\n            provenanceTaxonomy: data.taxons\n              ? JSON.parse(data.taxons)\n              : undefined,\n          };\n          if (eventType === \"click\") {\n            if (this.viewingMode === \"Network Discovery\") {\n              this.highlightConnectedPaths([data.models]);\n            } else {\n              this.currentActive = data.models ? data.models : \"\";\n            }\n          } else if (eventType === \"mouseenter\" && \n          !(this.viewingMode === \"Network Discovery\")) {\n            this.currentHover = data.models ? data.models : \"\";\n          }\n          if (\n            data &&\n            data.type !== \"marker\" &&\n            eventType === \"click\" &&\n            !(this.viewingMode === \"Network Discovery\")\n          ) {\n            this.checkAndCreatePopups(payload);\n          }\n          this.$emit(\"resource-selected\", payload);\n        } else {\n          this.$emit(\"pan-zoom-callback\", data);\n        }\n      };\n    },\n    // checkNeuronClicked shows a neuron path pop up if a path was recently clicked\n    checkAndCreatePopups: async function (data) {\n      // Call flatmap database to get the connection data\n      if (this.viewingMode  === \"Annotation\") {\n        if (data.feature && data.feature.featureId && data.feature.models) {\n          this.annotationEntry = { ...data.feature, resourceId: this.serverUUID };\n          this.displayTooltip(data.feature.models);\n        } else {\n          this.annotation = {};\n        }\n      } else {\n        let results =\n          await this.flatmapQueries.retrieveFlatmapKnowledgeForEvent(data);\n        // The line below only creates the tooltip if some data was found on the path\n        // result 0 is the connection, result 1 is the pubmed results from flatmap\n        if (\n          results[0] ||\n          results[1] ||\n          (data.feature.hyperlinks && data.feature.hyperlinks.length > 0)\n        ) {\n          this.resourceForTooltip = data.resource[0];\n          data.resourceForTooltip = this.resourceForTooltip;\n          this.createTooltipFromNeuronCuration(data);\n        }\n      }\n    },\n    popUpCssHacks: function () {\n      // Below is a hack to remove flatmap tooltips while popup is open\n      let ftooltip = document.querySelector(\".flatmap-tooltip-popup\");\n      if (ftooltip) ftooltip.style.display = \"none\";\n      document.querySelector(\".maplibregl-popup-close-button\").style.display =\n        \"block\";\n      this.$refs.tooltip.$el.style.display = \"flex\";\n      document.querySelector(\".maplibregl-popup-close-button\").onclick = () => {\n        document.querySelector(\".flatmap-tooltip-popup\").style.display =\n          \"block\";\n      };\n    },\n    closeTooltip: function () {\n      this.$refs.tooltip.$el.style.display = \"none\";\n      document.querySelectorAll(\".maplibregl-popup\").forEach((item) => {\n        item.style.display = \"none\";\n      });\n    },\n    createTooltipFromNeuronCuration: async function (data) {\n      this.tooltipEntry = await this.flatmapQueries.createTooltipData(data);\n      this.displayTooltip(data.resource[0]);\n    },\n    // Keeping this as an API\n    showPopup: function (featureId, node, options) {\n      let myOptions = options;\n      if (this.mapImp) {\n        if (myOptions) {\n          if (!myOptions.className) myOptions.className = \"custom-popup\";\n        } else {\n          myOptions = { className: \"custom-popup\", positionAtLastClick: true };\n        }\n        this.mapImp.showPopup(featureId, node, myOptions);\n      }\n    },\n    showMarkerPopup: function (featureId, node, options) {\n      if (this.mapImp) {\n        this.mapImp.showMarkerPopup(featureId, node, options);\n      }\n    },\n    closeMinimap: function () {\n      let minimapEl = this.$refs.flatmapContainer.querySelector(\n        \".maplibregl-ctrl-minimap\"\n      ); // find minimap\n      if (this.minimapSmall) {\n        //switch the classes on the minimap\n        minimapEl.classList.add(\"enlarge\");\n        minimapEl.classList.remove(\"shrink\");\n      } else {\n        minimapEl.classList.add(\"shrink\");\n        minimapEl.classList.remove(\"enlarge\");\n      }\n      this.minimapSmall = !this.minimapSmall;\n    },\n    addResizeButtonToMinimap: function () {\n      let minimapEl = this.$refs.flatmapContainer.querySelector(\n        \".maplibregl-ctrl-minimap\"\n      );\n      if (minimapEl) {\n        this.$refs.minimapResize.parentNode.removeChild(\n          this.$refs.minimapResize\n        );\n        minimapEl.appendChild(this.$refs.minimapResize);\n        this.minimapResizeShow = true;\n      }\n    },\n    setHelpMode: function (helpMode) {\n      if (helpMode) {\n        this.inHelp = true;\n        this.hoverVisibilities.forEach((item) => {\n          item.value = true;\n        });\n        this.openFlatmapHelpPopup();\n      } else {\n        this.inHelp = false;\n        this.hoverVisibilities.forEach((item) => {\n          item.value = false;\n        });\n        this.closeFlatmapHelpPopup();\n      }\n    },\n    showToolitip: function (tooltipNumber) {\n      if (!this.inHelp) {\n        clearTimeout(this.tooltipWait[tooltipNumber]);\n        this.tooltipWait[tooltipNumber] = setTimeout(() => {\n          this.hoverVisibilities[tooltipNumber].value = true;\n        }, 500);\n      }\n    },\n    hideToolitip: function (tooltipNumber) {\n      if (!this.inHelp) {\n        clearTimeout(this.tooltipWait[tooltipNumber]);\n        this.tooltipWait[tooltipNumber] = setTimeout(() => {\n          this.hoverVisibilities[tooltipNumber].value = false;\n        }, 500);\n      }\n    },\n    displayTooltip: function (feature) {\n      this.mapImp.showPopup(\n        this.mapImp.modelFeatureIds(feature)[0],\n        this.$refs.tooltip.$el,\n        { className: \"flatmapvuer-popover\", positionAtLastClick: true }\n      );\n      this.popUpCssHacks();\n    },\n    openFlatmapHelpPopup: function () {\n      if (this.mapImp) {\n        let heartId = this.mapImp.featureIdsForModel(\"UBERON:0000948\")[0];\n        const elm = \"Click for more information\";\n        this.mapImp.showPopup(heartId, elm, {\n          anchor: \"top\",\n          className: \"flatmap-popup-popper\",\n        });\n      }\n    },\n    closeFlatmapHelpPopup: function () {\n      this.$el\n        .querySelectorAll(\".maplibregl-popup-close-button\")\n        .forEach((item) => {\n          item.click();\n        });\n    },\n    getLabels: function () {\n      let labels = [];\n      if (this.mapImp) {\n        let annotations = this.mapImp.annotations;\n        for (let value of annotations.values()) {\n          if (value.label) labels.push(value.label);\n        }\n        return Array.from(new Set(labels));\n      }\n    },\n    getState: function () {\n      if (this.mapImp) {\n        let state = {\n          entry: this.entry,\n          viewport: this.mapImp.getState(),\n        };\n        const identifier = this.mapImp.getIdentifier();\n        if (this.biologicalSex) state[\"biologicalSex\"] = this.biologicalSex;\n        else if (identifier && identifier.biologicalSex)\n          state[\"biologicalSex\"] = identifier.biologicalSex;\n        if (identifier && identifier.uuid) state[\"uuid\"] = identifier.uuid;\n        return state;\n      }\n      return undefined;\n    },\n    setState: function (state) {\n      if (state) {\n        if (\n          this.mapImp &&\n          state.entry &&\n          this.entry == state.entry &&\n          (!state.biologicalSex || state.biologicalSex === this.biologicalSex)\n        ) {\n          if (state.viewport) {\n            this.mapImp.setState(state.viewport);\n          }\n        } else {\n          this.createFlatmap(state);\n        }\n        this.setStateRequired = false;\n      }\n    },\n    restoreMapState: function (state) {\n      if (state) {\n        if (state.viewport) this.mapImp.setState(state.viewport);\n        if (state.searchTerm) this.searchAndShowResult(state.searchTerm, true);\n      }\n    },\n    createFlatmap: function (state) {\n      if (!this.mapImp && !this.loading) {\n        this.loading = true;\n        let minimap = false;\n        if (this.displayMinimap) {\n          minimap = { position: \"top-right\" };\n        }\n\n        //As for flatmap-viewer@2.2.7, see below for the documentation\n        //for the identifier:\n\n        //@arg identifier {string|Object}\n        // A string or object identifying the map to load. If a string its\n        // value can be either the map's ``uuid``, assigned at generation time,\n        // or taxon and biological sex identifiers of the species that the map\n        // represents. The latest version of a map is loaded unless it has been\n        // identified using a ``uuid`` (see below).\n        // @arg identifier.taxon {string} The taxon identifier of the species\n        //  represented by the map. This is specified as metadata in the map's source file.\n        // @arg identifier.biologicalSex {string} The biological sex of the species\n        // represented by the map. This is specified as metadatain the map's source file.\n        // @arg identifier.uuid {string} The unique uuid the flatmap. If given then this exact map will\n        //  be loaded, overriding ``taxon`` and ``biologicalSex``.\n\n        let identifier = { taxon: this.entry };\n        if (this.uuid) {\n          identifier.uuid = this.uuid;\n        }\n        //This now handle the uses of uuid when resuming states\n        if (state) {\n          if (state.uuid) {\n            identifier = { uuid: state.uuid };\n          } else if (state.entry) {\n            identifier.taxon = state.entry;\n            if (state.biologicalSex) {\n              identifier[\"biologicalSex\"] = state.biologicalSex;\n            } else if (identifier.taxon === \"NCBITaxon:9606\") {\n              //For backward compatibility\n              identifier[\"biologicalSex\"] = \"PATO:0000384\";\n            }\n          }\n        } else {\n          // Set the bioloicalSex now if map is not resumed from\n          // a saved state\n          if (this.biologicalSex) {\n            identifier[\"biologicalSex\"] = this.biologicalSex;\n          }\n        }\n\n        let promise1 = this.mapManager.loadMap(\n          identifier,\n          this.$refs.display,\n          this.eventCallback(),\n          {\n            //fullscreenControl: false,\n            //annotatable: false,\n            //debug: true,\n            featureInfo: this.featureInfo,\n            \"min-zoom\": this.minZoom,\n            layerControl: true,\n            pathControls: true,\n            searchable: this.searchable,\n            tooltips: this.tooltips,\n            minimap: minimap,\n          }\n        );\n        promise1.then((returnedObject) => {\n          this.mapImp = returnedObject;\n          this.serverUUID = this.mapImp.getIdentifier().uuid;\n          this.onFlatmapReady();\n          if (this._stateToBeSet) this.restoreMapState(this._stateToBeSet);\n          else {\n            this.restoreMapState(state);\n          }\n        });\n      } else if (state) {\n        this._stateToBeSet = {\n          viewport: state.viewport,\n          searchTerm: state.searchTerm,\n        };\n        if (this.mapImp && !this.loading)\n          this.restoreMapState(this._stateToBeSet);\n      }\n    },\n    computePathControlsMaximumHeight() {\n      const elem = this.$refs.display;\n      if (elem) {\n        const computed = getComputedStyle(elem);\n        const padding =\n          parseInt(computed.paddingTop) + parseInt(computed.paddingBottom);\n        const height = elem.clientHeight - padding;\n        this.pathwaysMaxHeight = height - 170;\n      }\n    },\n    mapResize: function () {\n      try {\n        this.computePathControlsMaximumHeight();\n        if (this.mapImp) {\n          this.mapImp.resize();\n          this.showMinimap(this.displayMinimap);\n          if (this.mapImp._minimap) {\n            this.mapImp._minimap.resize();\n          }\n        }\n      } catch {\n        console.error(\"Map resize error\");\n      }\n    },\n    onFlatmapReady: function () {\n      // onFlatmapReady is used for functions that need to run immediately after the flatmap is loaded\n      this.sensor = new ResizeSensor(this.$refs.display, this.mapResize);\n      if (this.mapImp.options && this.mapImp.options.style === \"functional\") {\n        this.isFC = true;\n      }\n      this.mapImp.setBackgroundOpacity(1);\n      this.backgroundChangeCallback(this.currentBackground);\n      this.pathways = this.mapImp.pathTypes();\n      this.mapImp.enableCentrelines(false);\n      //Disable layers for now\n      //this.layers = this.mapImp.getLayers();\n      this.systems = processSystems(this.mapImp.getSystems());\n      this.taxonConnectivity = processTaxon(\n        this.flatmapAPI,\n        this.mapImp.taxonIdentifiers\n      );\n      this.addResizeButtonToMinimap();\n      this.loading = false;\n      this.computePathControlsMaximumHeight();\n      this.drawerOpen = true;\n      this.mapResize();\n      this.$emit(\"ready\", this);\n    },\n    showMinimap: function (flag) {\n      if (this.mapImp) this.mapImp.showMinimap(flag);\n    },\n    showPathwaysDrawer: function (flag) {\n      this.drawerOpen = flag;\n    },\n    /**\n     * Function to display features with annotation matching the provided term,\n     * with the option to display the label using displayLabel flag.\n     */\n    searchAndShowResult: function (term, displayLabel) {\n      if (this.mapImp) {\n        if (term === undefined || term === \"\") {\n          this.mapImp.clearSearchResults();\n          return true;\n        } else {\n          const searchResults = this.mapImp.search(term);\n          if (\n            searchResults &&\n            searchResults.results &&\n            searchResults.results.length > 0\n          ) {\n            this.mapImp.showSearchResults(searchResults);\n            if (\n              displayLabel &&\n              searchResults.results[0].featureId &&\n              searchResults.results[0].text\n            ) {\n              const annotation = this.mapImp.annotation(\n                searchResults.results[0].featureId\n              );\n              this.mapImp.showPopup(\n                searchResults.results[0].featureId,\n                annotation.label,\n                {\n                  className: \"custom-popup\",\n                  positionAtLastClick: false,\n                  preserveSelection: true,\n                }\n              );\n            }\n            return true;\n          } else this.mapImp.clearSearchResults();\n        }\n      }\n      return false;\n    },\n    /**\n     * Get the list of suggested terms\n     */\n    searchSuggestions: function (term) {\n      if (this.mapImp) return this.mapImp.search(term);\n      return [];\n    },\n  },\n  props: {\n    entry: String,\n    uuid: String,\n    biologicalSex: {\n      type: String,\n      default: \"\",\n    },\n    featureInfo: {\n      type: Boolean,\n      default: false,\n    },\n    minZoom: {\n      type: Number,\n      default: 4,\n    },\n    pathControls: {\n      type: Boolean,\n      default: false,\n    },\n    searchable: {\n      type: Boolean,\n      default: false,\n    },\n    layerControl: {\n      type: Boolean,\n      default: false,\n    },\n    tooltips: {\n      type: Boolean,\n      default: true,\n    },\n    helpMode: {\n      type: Boolean,\n      default: false,\n    },\n    renderAtMounted: {\n      type: Boolean,\n      default: true,\n    },\n    displayMinimap: {\n      type: Boolean,\n      default: false,\n    },\n    displayWarning: {\n      type: Boolean,\n      default: false,\n    },\n    /**\n     * Flag to determine rather open map UI should be\n     * presented or not.\n     */\n    enableOpenMapUI: {\n      type: Boolean,\n      default: false,\n    },\n    openMapOptions: {\n      type: Array,\n      default: function () {\n        return [\n          {\n            display: \"Open AC Map\",\n            key: \"AC\",\n          },\n          {\n            display: \"Open FC Map\",\n            key: \"FC\",\n          },\n          {\n            display: \"Open 3D Human Map\",\n            key: \"3D\",\n          },\n        ];\n      },\n    },\n    showStarInLegend: {\n      type: Boolean,\n      default: false\n    },\n    isLegacy: {\n      type: Boolean,\n      default: false,\n    },\n    displayLatestChanges: {\n      type: Boolean,\n      default: false,\n    },\n    latestChangesMessage: {\n      type: String,\n      default:\n        \"'Observed In' controls and information are now included in AC maps. System control with FTU information has been added to the FC map.\",\n    },\n    /**\n     * State containing state of the flatmap.\n     */\n    state: {\n      type: Object,\n      default: undefined,\n    },\n    /**\n     * Specify the endpoint of the flatmap server.\n     */\n    flatmapAPI: {\n      type: String,\n      default: \"https://mapcore-demo.org/current/flatmap/v3/\",\n    },\n    sparcAPI: {\n      type: String,\n      default: \"https://api.sparc.science/\",\n    },\n  },\n  provide() {\n    return {\n      flatmapAPI: this.flatmapAPI,\n      sparcAPI: this.sparcAPI,\n    };\n  },\n  data: function () {\n    return {\n      annotationEntry: {},\n      serverUUID: undefined,\n      layers: [],\n      pathways: [],\n      sckanDisplay: [\n        {\n          label: \"Display Path with SCKAN\",\n          key: \"VALID\",\n        },\n      ],\n      centreLines: [\n        {\n          label: \"Display Nerves\",\n          key: \"centrelines\",\n          enabled: false,\n        },\n      ],\n      systems: [],\n      taxonConnectivity: [],\n      pathwaysMaxHeight: 1000,\n      hoverVisibilities: [\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n        { value: false },\n      ],\n      yellowstar: yellowstar,\n      isFC: false,\n      inHelp: false,\n      currentBackground: \"white\",\n      availableBackground: [\"white\", \"lightskyblue\", \"black\"],\n      loading: false,\n      flatmapMarker: flatmapMarker,\n      tooltipEntry: createUnfilledTooltipData(),\n      connectivityTooltipVisible: false,\n      drawerOpen: false,\n      annotationRadio: false,\n      colourRadio: true,\n      outlinesRadio: true,\n      minimapResizeShow: false,\n      minimapSmall: false,\n      currentActive: \"\",\n      currentHover: \"\",\n      viewingMode: \"Exploration\",\n      viewingModes: [\"Annotation\", \"Exploration\", \"Network Discovery\"],\n    };\n  },\n  watch: {\n    entry: function () {\n      if (!this.state) this.createFlatmap();\n    },\n    helpMode: function (val) {\n      this.setHelpMode(val);\n    },\n    state: {\n      handler: function (state) {\n        if (this.mapManager) {\n          this.setState(state);\n        } else {\n          //this component has not been mounted yet\n          this.setStateRequired = true;\n        }\n      },\n      immediate: true,\n      deep: true,\n    },\n  },\n  mounted: function () {\n    const flatmap = require(\"@abi-software/flatmap-viewer\");\n    this.tooltipWait = [];\n    this.tooltipWait.length = this.hoverVisibilities.length;\n    this.mapManager = new flatmap.MapManager(this.flatmapAPI);\n    this.flatmapQueries = new FlatmapQueries();\n    this.flatmapQueries.initialise(this.flatmapAPI);\n    if (this.state) {\n      //State is set and require to set the state\n      if (this.setStateRequired) {\n        this.setState(this.state);\n      }\n    } else if (this.renderAtMounted) {\n      this.createFlatmap();\n    }\n  },\n};\n</script>\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped lang=\"scss\">\n@import \"~element-ui/packages/theme-chalk/src/button\";\n@import \"~element-ui/packages/theme-chalk/src/loading\";\n@import \"~element-ui/packages/theme-chalk/src/row\";\n@import \"~element-ui/packages/theme-chalk/src/select\";\n\n.beta-popovers {\n  position: absolute;\n  top: 90px;\n  left: 16px;\n  text-align: left;\n  font-size: 25px;\n}\n\n.warning-icon {\n  color: $warning;\n\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.warning-text {\n  font-family: Asap, sans-serif;\n  font-size: 15px;\n  vertical-align: 5px;\n}\n\n.latest-map-text {\n  color: $app-primary-color;\n  font-family: Asap, sans-serif;\n  font-size: 12px;\n  margin-top: 5px;\n  vertical-align: 10px;\n  cursor: pointer;\n}\n\n.latest-changesicon {\n  color: $success;\n\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.latest-changestext {\n  font-family: Asap, sans-serif;\n  font-size: 15px;\n  vertical-align: 5px;\n}\n\n.flatmap-container {\n  height: 100%;\n  width: 100%;\n}\n\n.pathway-location {\n  position: absolute;\n  bottom: 0px;\n  transition: all 1s ease;\n  &.open {\n    left: 0px;\n  }\n  &.close {\n    left: -298px;\n  }\n}\n\n.svg-legends-container {\n  width: 70%;\n  height: auto;\n  position: relative;\n  max-height: 140px;\n}\n\n.pathway-container {\n  float: left;\n  padding-left: 16px;\n  padding-right: 18px;\n  text-align: left;\n  overflow: auto;\n  border: 1px solid rgb(220, 223, 230);\n  padding-bottom: 16px;\n  background: #ffffff;\n  overflow-x: hidden;\n  scrollbar-width: thin;\n\n  transition: all 1s ease;\n  &.open {\n    opacity: 1;\n  }\n  &.close {\n    opacity: 0;\n  }\n\n  &::-webkit-scrollbar {\n    width: 4px;\n  }\n\n  &::-webkit-scrollbar-thumb {\n    border-radius: 10px;\n    box-shadow: inset 0 0 6px #c0c4cc;\n  }\n}\n\n.flatmap-marker-help {\n  display: inline-block;\n}\n\n::v-deep .popper-bump-right {\n  left: 30px;\n}\n\n.el-dropdown-link {\n  cursor: pointer;\n  color: #409eff;\n}\n.el-icon-arrow-down {\n  font-size: 12px;\n}\n.demonstration {\n  display: block;\n  color: #8492a6;\n  font-size: 14px;\n  margin-bottom: 20px;\n}\n\n.tooltip {\n  display: none;\n}\n\n::v-deep .maplibregl-popup {\n  max-width: 300px !important;\n}\n\n::v-deep .flatmap-tooltip-popup {\n  &.maplibregl-popup-anchor-bottom {\n    .maplibregl-popup-content {\n      margin-bottom: 12px;\n      &::after,\n      &::before {\n        top: 100%;\n        border-width: 12px;\n      }\n      /* this border color controlls the color of the triangle (what looks like the fill of the triangle) */\n      &::after {\n        margin-top: -1px;\n        border-color: rgb(255, 255, 255) transparent transparent transparent;\n      }\n      /* this border color controlls the outside, thin border */\n      &::before {\n        margin: 0 auto;\n        border-color: $app-primary-color transparent transparent transparent;\n      }\n    }\n  }\n  &.maplibregl-popup-anchor-top {\n    .maplibregl-popup-content {\n      margin-top: 18px;\n      &::after,\n      &::before {\n        top: calc(-100% + 6px);\n        border-width: 12px;\n      }\n      /* this border color controlls the color of the triangle (what looks like the fill of the triangle) */\n      &::after {\n        margin-top: 1px;\n        border-color: transparent transparent rgb(255, 255, 255) transparent;\n      }\n      &::before {\n        margin: 0 auto;\n        border-color: transparent transparent $app-primary-color transparent;\n      }\n    }\n  }\n  .maplibregl-popup-content {\n    border-radius: 4px;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n    pointer-events: none;\n    display: none;\n    background: #fff;\n    border: 1px solid $app-primary-color;\n    padding-left: 6px;\n    padding-right: 6px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    &::after,\n    &::before {\n      content: \"\";\n      display: block;\n      position: absolute;\n      width: 0;\n      height: 0;\n      border-style: solid;\n      flex-shrink: 0;\n    }\n  }\n  .maplibregl-popup-tip {\n    display: none;\n  }\n}\n\n::v-deep .maplibregl-popup {\n  &.flatmap-marker-popup {\n    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);\n    pointer-events: auto;\n    background: #fff;\n  }\n}\n\n/* Fix for chrome bug where under triangle pops up above one on top of it  */\n.selector:not(*:root),\n::v-deep.flatmap-tooltip-popup {\n  .maplibregl-popup-content::after {\n    top: 99.9%;\n  }\n}\n\n::v-deep .flatmap-tooltip-dialog {\n  .maplibregl-popup-tip {\n    display: none;\n  }\n}\n\n::v-deep .flatmap-marker-popup {\n  .maplibregl-popup-content {\n    padding: 0px;\n  }\n}\n\n::v-deep .flatmapvuer-popover {\n  .maplibregl-popup-close-button {\n    position: absolute;\n    right: 0.5em;\n    top: 0;\n    border: 0;\n    border-radius: 0 3px 0 0;\n    cursor: pointer;\n    background-color: transparent;\n    font-size: 2.5em;\n    color: grey;\n    top: 0.95em;\n  }\n}\n\n.zoomOut {\n  padding-left: 8px;\n}\n\n.fitWindow {\n  padding-left: 8px;\n}\n\n.yellow-star-legend {\n  width: 130px;\n  cursor: pointer;\n}\n\n.settings-group {\n  bottom: 16px;\n  position: absolute;\n  transition: all 1s ease;\n  &.open {\n    left: 322px;\n  }\n  &.close {\n    left: 24px;\n  }\n}\n\n::v-deep .background-popper {\n  padding: 5px 12px;\n  background-color: #ffffff;\n  border: 1px solid $app-primary-color;\n  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.06);\n  height: 270px;\n  width: 175px;\n  min-width: 175px;\n  &.el-popper[x-placement^=\"top\"] {\n    .popper__arrow {\n      border-top-color: $app-primary-color !important;\n      &::after {\n        border-top-color: #fff !important;\n      }\n    }\n  }\n}\n\n::v-deep .open-map-popper {\n  padding-top: 5px;\n  padding-bottom: 5px;\n  background-color: #ffffff;\n  border: 1px solid $app-primary-color;\n  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.06);\n  width: 178px;\n  min-width: 178px;\n\n  .el-row ~ .el-row {\n    margin-top: 8px;\n  }\n\n  .el-button {\n    padding-top: 5px;\n    padding-bottom: 5px;\n  }\n\n  &.el-popper[x-placement^=\"top\"] {\n    .popper__arrow {\n      border-top-color: $app-primary-color !important;\n      &:after {\n        border-top-color: #fff !important;\n      }\n    }\n  }\n}\n\n.backgroundText {\n  color: rgb(48, 49, 51);\n  font-size: 14px;\n  font-weight: normal;\n  line-height: 20px;\n}\n\n.backgroundControl {\n  display: flex;\n  margin-top: 12px;\n}\n\n.backgroundChoice {\n  width: 20px;\n  height: 20px;\n  border: 1px solid rgb(144, 147, 153);\n  margin-left: 20px;\n  &.active {\n    border: 2px solid $app-primary-color;\n  }\n  &:hover {\n    cursor: pointer;\n  }\n  &.white {\n    background-color: white;\n    margin-left: 10px;\n  }\n  &.black {\n    background-color: black;\n  }\n  &.lightskyblue {\n    background-color: lightskyblue;\n  }\n}\n\n.icon-button {\n  height: 24px !important;\n  width: 24px !important;\n  color: $app-primary-color;\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n::v-deep .maplibregl-ctrl-minimap {\n  transform-origin: top right;\n  @media (max-width: 1250px) {\n    height: 125px !important; // important is needed here as we are over-riding the style set by the flatmap\n    width: 180px !important;\n    >>> .maplibregl-canvas .maplibregl-canvas {\n      height: 125px !important;\n      width: 180px !important;\n    }\n  }\n  @media (min-width: 1251px) {\n    height: 190px !important;\n    width: 300px !important;\n    >>> .maplibregl-canvas .maplibregl-canvas {\n      height: 190px !important;\n      width: 300px !important;\n    }\n  }\n  transition: all 1s ease;\n  &.shrink {\n    transform: scale(0.5);\n    transform: scale(0.5);\n  }\n}\n\n.minimap-resize {\n  position: absolute;\n  pointer-events: all;\n  cursor: pointer;\n  top: 0;\n  right: 0;\n  padding-top: 3px; // needed as icon is offset\n  width: 20px;\n  height: 14px;\n  z-index: 9;\n  transition: all 1s ease;\n  &.shrink {\n    transform: rotate(0deg);\n  }\n  &.enlarge {\n    transform: rotate(180deg) scale(2);\n    padding-bottom: 5px; // note padding is added to the opposite side since it is rotated\n    padding-left: 5px;\n  }\n}\n\n::v-deep .flatmap-popper {\n  padding: 6px 4px;\n  font-size: 12px;\n  color: rgb(48, 49, 51);\n  background-color: #f3ecf6;\n  border: 1px solid $app-primary-color;\n  white-space: nowrap;\n  min-width: unset;\n  &.warning-popper {\n    min-width: 150px;\n    max-width: 400px;\n    word-break: keep-all;\n    white-space: unset;\n  }\n  &.left-popper {\n    .popper__arrow {\n      border-left-color: $app-primary-color !important;\n      &::after {\n        border-left-color: #f3ecf6 !important;\n      }\n    }\n  }\n  &.right-popper {\n    .popper__arrow {\n      border-right-color: $app-primary-color !important;\n      &:after {\n        border-right-color: #f3ecf6 !important;\n      }\n    }\n  }\n  &.el-popper[x-placement^=\"top\"] {\n    .popper__arrow {\n      border-top-color: $app-primary-color !important;\n      &:after {\n        border-top-color: #f3ecf6 !important;\n      }\n    }\n  }\n}\n\n::v-deep .el-loading-spinner {\n  i,\n  .el-loading-text {\n    color: $app-primary-color;\n  }\n}\n\n::v-deep .flatmap-popup-popper {\n  .maplibregl-popup-tip {\n    border-bottom-color: $app-primary-color;\n  }\n  .maplibregl-popup-content {\n    padding: 6px 4px;\n    font-size: 12px;\n    color: rgb(48, 49, 51);\n    background-color: #f3ecf6;\n    border: 1px solid $app-primary-color;\n    white-space: nowrap;\n    min-width: unset;\n    .maplibregl-popup-close-button {\n      display: none;\n    }\n  }\n}\n\n::v-deep .popper-zoomout {\n  padding-right: 13px !important;\n  left: -21px !important;\n}\n\n::v-deep .popper-zoomout {\n  .popper__arrow {\n    left: 53px !important;\n  }\n}\n\n::v-deep .maplibregl-popup-content {\n  padding: 0px;\n}\n\n.bottom-right-control {\n  position: absolute;\n  right: 16px;\n  bottom: 16px;\n}\n\n::v-deep .my-drawer {\n  background: rgba(0, 0, 0, 0);\n  box-shadow: none;\n}\n\n.drawer {\n  ::v-deep .el-drawer:focus {\n    outline: none;\n  }\n}\n\n.open-drawer,\n.drawer-button {\n  z-index: 8;\n  width: 20px;\n  height: 40px;\n  border: solid 1px $app-primary-color;\n  text-align: center;\n  vertical-align: middle;\n  cursor: pointer;\n  pointer-events: auto;\n}\n\n.open-drawer {\n  position: absolute;\n  left: 0px;\n  background-color: #f7faff;\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.06);\n}\n\n.drawer-button {\n  float: left;\n  margin-top: calc(50% - 36px);\n  background-color: #f9f2fc;\n\n  i {\n    font-weight: 600;\n    margin-top: 12px;\n    color: $app-primary-color;\n    transition-delay: 0.9s;\n  }\n  &.open {\n    i {\n      transform: rotate(0deg) scaleY(2);\n    }\n  }\n  &.close {\n    i {\n      transform: rotate(180deg) scaleY(2);\n    }\n  }\n}\n\n::v-deep .maplibregl-canvas-container {\n  canvas {\n    outline: none;\n  }\n}\n\n.backgroundSpacer {\n  border-bottom: 1px solid #e4e7ed;\n  margin-bottom: 10px;\n}\n\n.flatmap-radio {\n  ::v-deep label {\n    margin-right: 20px;\n    &:last-child {\n      margin-right: 0px;\n    }\n  }\n  ::v-deep .el-radio__input {\n    &.is-checked {\n      & + .el-radio__label {\n        color: $app-primary-color;\n      }\n      .el-radio__inner {\n        border-color: $app-primary-color;\n        background: $app-primary-color;\n      }\n    }\n    .el-radio__inner:hover {\n      border-color: $app-primary-color;\n    }\n  }\n}\n\n::v-deep .custom-popup {\n  .maplibregl-popup-tip {\n    display: none;\n  }\n  .maplibregl-popup-content {\n    border-radius: 4px;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n    pointer-events: none;\n    display: none;\n    background: #fff;\n    font-family: \"Asap\", sans-serif;\n    font-size: 12pt;\n    color: $app-primary-color;\n    border: 1px solid $app-primary-color;\n    padding-left: 6px;\n    padding-right: 6px;\n    padding-top: 6px;\n    padding-bottom: 6px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    &::after,\n    &::before {\n      content: \"\";\n      display: block;\n      position: absolute;\n      width: 0;\n      height: 0;\n      border-style: solid;\n      flex-shrink: 0;\n    }\n    .maplibregl-popup-close-button {\n      display: none;\n    }\n  }\n  &.maplibregl-popup-anchor-bottom {\n    .maplibregl-popup-content {\n      margin-bottom: 12px;\n      &::after,\n      &::before {\n        top: 100%;\n        border-width: 12px;\n      }\n      /* this border color controlls the color of the triangle (what looks like the fill of the triangle) */\n      &::after {\n        margin-top: -1px;\n        border-color: rgb(255, 255, 255) transparent transparent transparent;\n      }\n      /* this border color controlls the outside, thin border */\n      &::before {\n        margin: 0 auto;\n        border-color: $app-primary-color transparent transparent transparent;\n      }\n    }\n  }\n  &.maplibregl-popup-anchor-top {\n    .maplibregl-popup-content {\n      margin-top: 18px;\n      &::after,\n      &::before {\n        top: calc(-100% + 6px);\n        border-width: 12px;\n      }\n      /* this border color controlls the color of the triangle (what looks like the fill of the triangle) */\n      &::after {\n        margin-top: 1px;\n        border-color: transparent transparent rgb(255, 255, 255) transparent;\n      }\n      &::before {\n        margin: 0 auto;\n        border-color: transparent transparent $app-primary-color transparent;\n      }\n    }\n  }\n}\n\n.select-box {\n  border-radius: 4px;\n  border: 1px solid rgb(144, 147, 153);\n  background-color: var(--white);\n  font-weight: 500;\n  color: rgb(48, 49, 51);\n  ::v-deep .el-input__inner {\n    height: 30px;\n    color: rgb(48, 49, 51);\n  }\n  ::v-deep .el-input__inner {\n    &is-focus,\n    &:focus {\n      border: 1px solid $app-primary-color;\n    }\n  }\n  ::v-deep .el-input__icon {\n    line-height: 30px;\n  }\n}\n\n::v-deep .flatmap_dropdown {\n  min-width: 160px !important;\n  .el-select-dropdown__item {\n    white-space: nowrap;\n    text-align: left;\n    &.selected {\n      color: $app-primary-color;\n      font-weight: normal;\n    }\n  }\n}\n</style>\n\n"]}]}