51 lines
2.8 KiB
JavaScript
51 lines
2.8 KiB
JavaScript
/**
|
|
* dashboard-plus-grid / index.js — Bundle entry (Capability-4 nested-elements-mfe, BAKED variant).
|
|
*
|
|
* ONE folder -> ONE bundle -> ONE self-contained element:
|
|
* <dashboard-plus-grid> — bakes the research-dashboard + people-groups-grid components DIRECTLY into
|
|
* one compiled bundle (no runtime bundle injection) and stacks them via the shared StackLayout so the
|
|
* host page scrolls through both. This is "two elements baked together into one."
|
|
*
|
|
* Usage — direct-JS (method 3):
|
|
* <script src=".../dashboard-plus-grid/dashboard-plus-grid.js"></script>
|
|
* <dashboard-plus-grid></dashboard-plus-grid>
|
|
*/
|
|
import { defineCustomElement } from 'vue'
|
|
import { createPinia } from 'pinia'
|
|
import { createAppI18n } from '@map/i18n/index.js'
|
|
import DashboardPlusGrid from './dashboard-plus-grid.vue'
|
|
|
|
// ─── configureApp is NOT optional for a BAKED composite ──────────────────────
|
|
// BUG-VUE-I18N-CODE27-SYNTAXERROR-ON-EVERY-MOUNT. dashboard-plus-grid.vue imports
|
|
// research-dashboard.vue DIRECTLY, which bypasses plugin-designs/research-dashboard/index.js
|
|
// — and that entry, not the .vue, is where `app.use(createAppI18n())` lives. So the baked
|
|
// library components that call useI18n() (ShareButton, ZoomInButton, ZoomOutButton) landed in
|
|
// an appContext with no __VUE_I18N_SYMBOL__ and useI18n() threw I18nErrorCodes.NOT_INSTALLED
|
|
// (runtime code 27 — "Need to install with `app.use` function").
|
|
//
|
|
// The throw surfaces as a bare `SyntaxError` with an EMPTY message, which is badly misleading:
|
|
// vue-i18n builds every error through the message-compiler's createCompileError(), which does
|
|
// `new SyntaxError(...)`, and in a production build it passes no message table at all. Nothing
|
|
// is being parsed and nothing is being minified — read the CODE, not the error class.
|
|
//
|
|
// It was never cosmetic: setup() threw, so Vue aborted those three subtrees and the composite
|
|
// silently shipped WITHOUT its Share / Zoom in / Zoom out map controls, which cap-3 has.
|
|
//
|
|
// Installing the same Pinia + i18n pair the sibling entries install makes the baked children
|
|
// see exactly the appContext they would get when mounted through their own bundle entry.
|
|
const DashboardPlusGridElement = defineCustomElement(DashboardPlusGrid, {
|
|
configureApp(app) {
|
|
app.use(createPinia())
|
|
const i18n = createAppI18n()
|
|
app.use(i18n)
|
|
// Same contract as the map bundles: the defineCustomElement ROOT cannot call useI18n()
|
|
// (see ProfileLoader.vue), so any root-level locale driving goes through this instance.
|
|
app.provide('appI18n', i18n)
|
|
}
|
|
})
|
|
|
|
if (typeof customElements !== 'undefined') {
|
|
if (!customElements.get('dashboard-plus-grid')) customElements.define('dashboard-plus-grid', DashboardPlusGridElement)
|
|
}
|
|
|
|
export default DashboardPlusGridElement
|