📦 Kong / kong-auth-elements

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67import type { App } from 'vue'
// Do not use '@' alias in utils paths here so that imports within a consuming project resolve properly.
import { registerCustomElement } from './utils'
import type {
  CustomEndpointElement,
  CustomEndpointErrorEvent,
  CustomEndpointRequest,
  KongAuthElementsOptions,
  DeveloperConfig,
  UserEntities,
} from './utils'
// Import all elements
import * as elements from './elements'

// Export a Vue plugin install function
export const KongAuthElementsPlugin = {
  install: (app: App, options?: KongAuthElementsOptions): any => {
    // Provide option values to components
    app.provide('kauth-api-base-url', options?.apiBaseUrl)
    app.provide('user-entity', options?.userEntity || 'user')
    app.provide('developer-config', options?.developerConfig)
    app.provide('custom-endpoint-error-handler', options?.customErrorHandler)
    // Since we are registering as a native Vue plugin, force options.shadowDom to false
    app.provide('shadow-dom', false)
    app.provide('inject-css', options?.injectCss)
    app.provide('lang', options?.lang)

    // Register all components
    for (const key in elements) {
      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
      // @ts-ignore
      app.component(key, elements[key])
    }
  },
}

// Exports a function that registers all custom elements as native web components
export default function registerKongAuthNativeElements(options?: KongAuthElementsOptions): void {
  const userOptions = Object.assign({}, options)

  // Since we are registering custom elements as native web components, force options.shadowDom to true only if undefined
  userOptions.shadowDom = options?.shadowDom !== undefined ? options.shadowDom : true

  registerCustomElement('kong-auth-accept-invitation', elements.KongAuthAcceptInvitation, userOptions)
  registerCustomElement('kong-auth-forgot-password', elements.KongAuthForgotPassword, userOptions)
  registerCustomElement('kong-auth-login', elements.KongAuthLogin, userOptions)
  registerCustomElement('kong-auth-register', elements.KongAuthRegister, userOptions)
  registerCustomElement('kong-auth-reset-password', elements.KongAuthResetPassword, userOptions)
  registerCustomElement('kong-auth-change-password', elements.KongAuthChangePassword, userOptions)
}

export type {
  CustomEndpointElement,
  CustomEndpointErrorEvent,
  CustomEndpointRequest,
  KongAuthElementsOptions,
  DeveloperConfig,
  UserEntities,
}

// Auto-register the function to the window object
if (typeof window !== 'undefined') {
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  window.registerKongAuthNativeElements = registerKongAuthNativeElements
}