Typescript support

[cosminv6u]

Typescript support

[cosminv6u]

I found the keycloak.d.ts file which can be useful for the current issue https://github.com/keycloak/keycloak/blob/4.8.3.Final/adapters/oidc/js/src/main/resources/keycloak.d.ts

If #37 is fixed, then this issue should also have the resulting .d.ts file in sync with latest verion of keycloak.d.ts

[nlien]

This is something that would be nice, I agree. Unfortunately, this is not prioritized at the moment. But, you're welcome to add a PR.

[wolfuser99]

This seems to temporary works for me:

1. create vue project with typescript
2. add a file as src/shims-keycloak.d.ts with the next content:

declare module "@dsb-norge/vue-keycloak-js" {
  import Vue, { PluginObject, PluginFunction } from "vue";

  export class VueKeyCloakInstance {
    ready: boolean; // Flag indicating whether Keycloak has initialized and is ready
    authenticated: boolean;
    userName: string; // Username from Keycloak. Collected from tokenParsed['preferred_username']
    fullName: string; // Full name from Keycloak. Collected from tokenParsed['name']
    login: Function; // [Keycloak] login function
    loginFn: Function; // Alias for login
    logoutFn: Function; // Keycloak logout function
    createLoginUrl: Function; // Keycloak createLoginUrl function
    createLogoutUrl: Function; // Keycloak createLogoutUrl function
    createRegisterUrl: Function; // Keycloak createRegisterUrl function
    register: Function; // Keycloak register function
    accountManagement: Function; // Keycloak accountManagement function
    createAccountUrl: Function; // Keycloak createAccountUrl function
    loadUserProfile: Function; // Keycloak loadUserProfile function
    loadUserInfo: Function; // Keycloak loadUserInfo function
    subject: string; // The user id
    idToken: string; // The base64 encoded ID token.
    idTokenParsed: object; // The parsed id token as a JavaScript object.
    realmAccess: object; // The realm roles associated with the token.
    resourceAccess: object; // The resource roles associated with the token.
    refreshToken: string; // The base64 encoded refresh token that can be used to retrieve a new token.
    refreshTokenParsed: object; // The parsed refresh token as a JavaScript object.
    timeSkew: number; // The estimated time difference between the browser time and the Keycloak server in seconds. This value is just an estimation, but is accurate enough when determining if a token is expired or not.
    responseMode: string; // Response mode passed in init (default value is fragment).
    responseType: string; // Response type sent to Keycloak with login requests. This is determined based on the flow value used during initialization, but can be overridden by setting this value.
    hasRealmRole: Function; // Keycloak hasRealmRole function
    hasResourceRole: Function; // Keycloak hasResourceRole function
    token: string; // The base64 encoded token that can be sent in the Authorization header in requests to services
    tokenParsed: string; // The parsed token as a JavaScript object
  }

  export type VueKeyCloakOptions = {
    config?: {
      authUrl?: string;
      authRealm?: string;
      authClientId?: string;
      logoutRedirectUri?: string;
    };
    init?: {
      onLoad: string;
    };
    onReady(keycloak: VueKeyCloakInstance): void;
  };

  declare module "vue/types/vue" {
    // Declare augmentation for Vue
    interface Vue {
      $keycloak: VueKeyCloakInstance;
    }
  }

  export default class VueKeyCloak implements PluginObject<VueKeyCloakOptions> {
    [key: string]: any;
    install: PluginFunction<VueKeyCloakOptions>;
    static install(
      pVue: typeof Vue,
      options?: VueKeyCloakOptions | undefined
    ): void;

    constructor(options: VueKeyCloakOptions);
  }
}

I just add some augmentation for Vue all the credits to @razbakov

[baltom]

Added with #68 / #73

[baltom]

Typescript support added with 2.0.0-beta release