Login v2

src/@keycloakify/login-ui-angular/lib/directives/attributes/attributes.ts

@@ -0,0 +1,23 @@
+import { Directive, effect, ElementRef, inject, input, Renderer2 } from '@angular/core';
+
+@Directive({ selector: '[kcAttributes]' })
+export class AttributesDirective {
+    kcAttributes = input<Record<string, string>>();
+    readonly #el = inject<ElementRef<HTMLElement>>(ElementRef);
+    readonly #renderer = inject(Renderer2);
+
+    constructor() {
+        effect(() => {
+            const attributes = this.kcAttributes();
+            if (attributes) {
+                Object.entries(attributes).forEach(([key, value]) => {
+                    this.#renderer.setAttribute(
+                        this.#el.nativeElement,
+                        `data-${key}`,
+                        value
+                    );
+                });
+            }
+        });
+    }
+}

src/@keycloakify/login-ui-angular/lib/directives/attributes/index.ts

@@ -0,0 +1 @@
+export * from './attributes';

src/@keycloakify/login-ui-angular/lib/directives/attributes/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/index.ts

@@ -0,0 +1 @@
+export const KEYCLOAKIFY_ANGULAR_LIB = '@keycloakify/angular/lib';

src/@keycloakify/login-ui-angular/lib/models/script/index.ts

@@ -0,0 +1 @@
+export * from './script';

src/@keycloakify/login-ui-angular/lib/models/script/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/models/script/script.ts

@@ -0,0 +1,6 @@
+export type Script = {
+    type: string;
+    id: string;
+    src?: string;
+    textContent?: string;
+};

src/@keycloakify/login-ui-angular/lib/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/input-type/index.ts

@@ -0,0 +1 @@
+export * from './input-type';

src/@keycloakify/login-ui-angular/lib/pipes/input-type/input-type.ts

@@ -0,0 +1,14 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+    name: 'inputType'
+})
+export class InputTypePipe implements PipeTransform {
+    transform(inputType?: string): string {
+        if (inputType?.startsWith('html5-')) {
+            return inputType.slice(6);
+        }
+
+        return inputType ?? 'text';
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/input-type/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/is-array-with-empty-object/index.ts

@@ -0,0 +1 @@
+export * from './is-array-with-empty-object';

src/@keycloakify/login-ui-angular/lib/pipes/is-array-with-empty-object/is-array-with-empty-object.ts

@@ -0,0 +1,15 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+    name: 'isArrayWithEmptyObject'
+})
+export class IsArrayWithEmptyObjectPipe implements PipeTransform {
+    transform(variable: unknown): boolean {
+        return (
+            Array.isArray(variable) &&
+            variable.length === 1 &&
+            typeof variable[0] === 'object' &&
+            Object.keys(variable[0]).length === 0
+        );
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/is-array-with-empty-object/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/kc-sanitize/index.ts

@@ -0,0 +1 @@
+export * from './kc-sanitize';

src/@keycloakify/login-ui-angular/lib/pipes/kc-sanitize/kc-sanitize.ts

@@ -0,0 +1,34 @@
+import { inject, Pipe, PipeTransform } from '@angular/core';
+import {
+    DomSanitizer,
+    SafeHtml,
+    SafeResourceUrl,
+    SafeScript,
+    SafeStyle,
+    SafeUrl
+} from '@angular/platform-browser';
+
+@Pipe({ name: 'kcSanitize' })
+export class KcSanitizePipe implements PipeTransform {
+    #sanitizer = inject(DomSanitizer);
+
+    transform(
+        value: string,
+        type: 'html' | 'style' | 'script' | 'url' | 'resourceUrl'
+    ): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl {
+        switch (type) {
+            case 'html':
+                return this.#sanitizer.bypassSecurityTrustHtml(value);
+            case 'style':
+                return this.#sanitizer.bypassSecurityTrustStyle(value);
+            case 'script':
+                return this.#sanitizer.bypassSecurityTrustScript(value);
+            case 'url':
+                return this.#sanitizer.bypassSecurityTrustUrl(value);
+            case 'resourceUrl':
+                return this.#sanitizer.bypassSecurityTrustResourceUrl(value);
+            default:
+                throw new Error(`Invalid safe type specified: ${type}`);
+        }
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/kc-sanitize/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/to-array/index.ts

@@ -0,0 +1 @@
+export * from './to-array';

src/@keycloakify/login-ui-angular/lib/pipes/to-array/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/to-array/to-array.ts

@@ -0,0 +1,14 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+    name: 'toArray'
+})
+export class ToArrayPipe implements PipeTransform {
+    transform(value: string | string[], emptyWhenString = false): string[] {
+        // if (!value) throw new Error('must pass a value');
+        if (value instanceof Array) {
+            return value;
+        }
+        return emptyWhenString ? [] : [value];
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/to-number/index.ts

@@ -0,0 +1 @@
+export * from './to-number';

src/@keycloakify/login-ui-angular/lib/pipes/to-number/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/pipes/to-number/to-number.ts

@@ -0,0 +1,12 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+    name: 'toNumber'
+})
+export class ToNumberPipe implements PipeTransform {
+    transform(value: string | number): number {
+        const number = Number(`${value}`);
+        if (isNaN(number)) throw new Error('number is NaN');
+        return number;
+    }
+}

src/@keycloakify/login-ui-angular/lib/services/resource-injector/index.ts

@@ -0,0 +1 @@
+export * from './resource-injector.service';

src/@keycloakify/login-ui-angular/lib/services/resource-injector/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/services/resource-injector/resource-injector.service.ts

@@ -0,0 +1,51 @@
+import { inject, Injectable, Renderer2, RendererFactory2 } from '@angular/core';
+import { Observable } from 'rxjs';
+import { Script } from '@keycloakify/angular/lib/models/script';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class ResourceInjectorService {
+    private renderer: Renderer2 = inject(RendererFactory2).createRenderer(null, null);
+
+    createLink(url: string): Observable<void> {
+        return new Observable<void>(observer => {
+            // check if the style is already injected
+            if (Array.from(document.styleSheets).some(s => s.href?.includes(url))) {
+                observer.next();
+                observer.complete();
+                console.debug(`stylesheet: ${url} already loaded`);
+                return;
+            }
+            const link = document.createElement('link');
+            link.rel = 'stylesheet';
+            link.href = url;
+
+            link.onload = () => {
+                observer.next();
+                observer.complete();
+            };
+
+            link.onerror = () => {
+                observer.error(new Error(`Failed to load stylesheet: ${url}`));
+            };
+
+            const head = document.head;
+            head.insertBefore(link, head.firstChild);
+        });
+    }
+    createScript({ type, id, src, textContent }: Script): void {
+        // check if the script is already injected
+        if (Array.from(document.scripts).some(s => s.id?.includes(id))) {
+            console.debug(`script: ${src} already injected`);
+            return;
+        }
+        const script = document.createElement('script');
+        script.type = type;
+        if (src) script.src = src;
+        if (textContent) script.textContent = textContent;
+        script.id = id;
+
+        this.renderer.appendChild(document.head, script);
+    }
+}

src/@keycloakify/login-ui-angular/lib/tokens/use-default-css/index.ts

@@ -0,0 +1 @@
+export * from './use-default-css.token';

src/@keycloakify/login-ui-angular/lib/tokens/use-default-css/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/lib/tokens/use-default-css/use-default-css.token.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+
+export const USE_DEFAULT_CSS = new InjectionToken<boolean>('use default css');

src/@keycloakify/login-ui-angular/login/KcContext/KcContext.ts

@@ -0,0 +1 @@
+export type { KcContext } from 'keycloakify/login/KcContext';

src/@keycloakify/login-ui-angular/login/KcContext/index.ts

@@ -0,0 +1 @@
+export * from './KcContext';

src/@keycloakify/login-ui-angular/login/KcContext/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}

src/@keycloakify/login-ui-angular/login/KcContextMock.ts

@@ -0,0 +1,16 @@
+import { createGetKcContextMock } from 'keycloakify/login/KcContext';
+import { KcContextExtension, KcContextExtensionPerPage } from '../../../login/KcContext';
+import { kcEnvDefaults, themeNames } from '../../../kc.gen';
+const kcContextExtension: KcContextExtension = {
+    themeName: themeNames[0],
+    properties: {
+        ...kcEnvDefaults
+    }
+};
+const kcContextExtensionPerPage: KcContextExtensionPerPage = {};
+export const { getKcContextMock } = createGetKcContextMock({
+    kcContextExtension,
+    kcContextExtensionPerPage,
+    overrides: {},
+    overridesPerPage: {}
+});

src/@keycloakify/login-ui-angular/login/classes/component-reference/component-reference.ts

@@ -0,0 +1,5 @@
+import type { ClassKey } from 'keycloakify/login/lib/kcClsx';
+export abstract class ComponentReference {
+    doUseDefaultCss: boolean | undefined;
+    classes: Partial<Record<ClassKey, string>> | undefined;
+}

src/@keycloakify/login-ui-angular/login/classes/component-reference/index.ts

@@ -0,0 +1 @@
+export * from './component-reference';

src/@keycloakify/login-ui-angular/login/classes/component-reference/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "index.ts"
+    }
+}