mirror of
https://github.com/nextcloud/server.git
synced 2026-03-13 06:03:14 -04:00
39 lines
1.2 KiB
JavaScript
39 lines
1.2 KiB
JavaScript
/**
|
|
* SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
|
|
* SPDX-License-Identifier: AGPL-3.0-or-later
|
|
*/
|
|
|
|
import wrap from '@vue/web-component-wrapper'
|
|
import Vue from 'vue'
|
|
import { logger } from '../logger.ts'
|
|
|
|
/**
|
|
*
|
|
* @param VueComponent {Object} The Vue component to turn into a Web Components custom element.
|
|
* @param customElementId {string} The element name, it must be unique. Recommended pattern oca-$appid-(checks|operations)-$use_case, example: oca-my_app-checks-request_user_agent
|
|
*/
|
|
function registerCustomElement(VueComponent, customElementId) {
|
|
const WrappedComponent = wrap(Vue, VueComponent)
|
|
if (window.customElements.get(customElementId)) {
|
|
logger.error('Custom element with ID ' + customElementId + ' is already defined!')
|
|
throw new Error('Custom element with ID ' + customElementId + ' is already defined!')
|
|
}
|
|
window.customElements.define(customElementId, WrappedComponent)
|
|
|
|
// In Vue 2, wrap doesn't support disabling shadow :(
|
|
// Disable with a hack
|
|
Object.defineProperty(WrappedComponent.prototype, 'attachShadow', {
|
|
value() {
|
|
return this
|
|
},
|
|
})
|
|
Object.defineProperty(WrappedComponent.prototype, 'shadowRoot', {
|
|
get() {
|
|
return this
|
|
},
|
|
})
|
|
|
|
return customElementId
|
|
}
|
|
|
|
export { registerCustomElement }
|