taon-ui 21.0.74 → 21.0.76

package/ts-source/browser-code/ui/taon-stripe-buy-button/taon-stripe-buy-button.component.ts

@@ -0,0 +1,82 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { CommonModule } from '@angular/common';
+import { Component, Input, OnInit } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { TaonStripeCloudflareWorker } from '@taon-dev/api-workers/browser';
+import { Translation, Translatable, TranslateDirective, TranslatePipe, } from '@taon-dev/i18n/browser';
+import { Taon } from 'taon/browser';
+import { TaonLangSelectorComponent } from '../../index';
+import { _ } from 'tnp-core/browser';
+const t = Translation.for('src/lib/ui/taon-stripe-buy-button/taon-stripe-buy-button.component.ts', { "src/lib/ui/taon-stripe-buy-button/taon-stripe-buy-button.component.ts": { "en-US": async () => (await import('./i18n/taon-stripe-buy-button.component.ts.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-stripe-buy-button.component.ts.pl-PL.i18n.data')).default, "de-DE": async () => (await import('./i18n/taon-stripe-buy-button.component.ts.de-DE.i18n.data')).default } } as any, {});
+@Component({
+    selector: 'taon-stripe-buy-button',
+    imports: [CommonModule, MatButtonModule],
+    templateUrl: './taon-stripe-buy-button.component.html',
+})
+export class TaonStripeBuyButtonComponent implements OnInit, Translatable {
+    t = t.for(this);
+    @Input({ required: true })
+    priceId!: string;
+    @Input({ required: true })
+    productId!: string;
+    @Input()
+    promotionPreviousPrice!: string;
+    @Input({ required: true })
+    workerUrl!: string;
+    @Input({ required: true })
+    email!: string;
+    @Input()
+    successUrl: string;
+    @Input()
+    cancelUrl: string;
+    label = this.t.signal.gettext('Buy now');
+    loading = false;
+    ngOnInit(): void {
+        this.successUrl = _.isString(this.successUrl)
+            ? this.successUrl
+            : `${location.href.split('?')[0]}?success=true&productId=${this.productId}`;
+        this.cancelUrl = _.isString(this.cancelUrl)
+            ? this.cancelUrl
+            : `${location.href.split('?')[0]}?cancel=true`;
+    }
+    async buy(): Promise<void> {
+        if (!this.priceId || !this.workerUrl || !this.email) {
+            console.error('Missing stripe parameters');
+            return;
+        }
+        this.loading = true;
+        try {
+            const resp = await fetch(`${this.workerUrl}${TaonStripeCloudflareWorker.HOOK_CREATE_STRIPE_SESSION}`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    priceId: this.priceId,
+                    email: this.email,
+                    success_url: this.successUrl,
+                    cancel_url: this.cancelUrl,
+                }),
+            });
+            const data = await resp.json();
+            if (data?.url) {
+                window.location.href = data.url;
+            }
+            else {
+                console.error('Stripe checkout url missing', data);
+            }
+        }
+        catch (err) {
+            console.error('Stripe checkout error', err);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+}

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.de-DE.i18n.data.ts

@@ -0,0 +1,47 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml {
+    "de-DE": {
+        "": {
+            "Dark mode"?: string;
+            "Settings can't ba changed"?: string;
+            "Sync colors with system"?: string;
+            "Theme settings"?: string;
+        };
+    };
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.html",
+    "tags": [
+        {
+            "gettextString": "Theme settings",
+            "lineNumber": 11,
+            "translation": "Ustawienia motywu"
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 11,
+            "translation": "Ustawienia nie mogą być zmienione"
+        },
+        {
+            "gettextString": "Sync colors with system",
+            "lineNumber": 20,
+            "translation": "Synchronizuj motyw koloru z systemem"
+        },
+        {
+            "gettextString": "Dark mode",
+            "lineNumber": 28,
+            "translation": "Tryb ciemny"
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 12,
+            "translation": "Ustawienia nie mogą być zmienione"
+        }
+    ]
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.de-DE.po

@@ -0,0 +1,22 @@
+msgid ""
+msgstr ""
+"Language: de-DE\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+msgid "Theme settings"
+msgstr "Ustawienia motywu"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+#: src/lib/ui/taon-theme/taon-theme.component.html:12
+msgid "Settings can't ba changed"
+msgstr "Ustawienia nie mogą być zmienione"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:20
+msgid "Sync colors with system"
+msgstr "Synchronizuj motyw koloru z systemem"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:28
+msgid "Dark mode"
+msgstr "Tryb ciemny"

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.en-US.i18n.data.ts

@@ -0,0 +1,42 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml {
+    "en-US": {
+        "": {
+            "Dark mode"?: string;
+            "Settings can't ba changed"?: string;
+            "Sync colors with system"?: string;
+            "Theme settings"?: string;
+        };
+    };
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.html",
+    "tags": [
+        {
+            "gettextString": "Theme settings",
+            "lineNumber": 11
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 11
+        },
+        {
+            "gettextString": "Sync colors with system",
+            "lineNumber": 20
+        },
+        {
+            "gettextString": "Dark mode",
+            "lineNumber": 28
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 12
+        }
+    ]
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.en-US.po

@@ -0,0 +1,22 @@
+msgid ""
+msgstr ""
+"Language: en-US\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+msgid "Theme settings"
+msgstr ""
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+#: src/lib/ui/taon-theme/taon-theme.component.html:12
+msgid "Settings can't ba changed"
+msgstr ""
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:20
+msgid "Sync colors with system"
+msgstr ""
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:28
+msgid "Dark mode"
+msgstr ""

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.pl-PL.i18n.data.ts

@@ -0,0 +1,47 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml {
+    "pl-PL": {
+        "": {
+            "Dark mode"?: string;
+            "Settings can't ba changed"?: string;
+            "Sync colors with system"?: string;
+            "Theme settings"?: string;
+        };
+    };
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.html",
+    "tags": [
+        {
+            "gettextString": "Theme settings",
+            "lineNumber": 11,
+            "translation": "Ustawienia motywu"
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 11,
+            "translation": "Ustawienia nie mogą być zmienione"
+        },
+        {
+            "gettextString": "Sync colors with system",
+            "lineNumber": 20,
+            "translation": "Synchronizuj motyw koloru z systemem"
+        },
+        {
+            "gettextString": "Dark mode",
+            "lineNumber": 28,
+            "translation": "Tryb ciemny"
+        },
+        {
+            "gettextString": "Settings can't ba changed",
+            "lineNumber": 12,
+            "translation": "Ustawienia nie mogą być zmienione"
+        }
+    ]
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.html.pl-PL.po

@@ -0,0 +1,22 @@
+msgid ""
+msgstr ""
+"Language: pl-PL\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+msgid "Theme settings"
+msgstr "Ustawienia motywu"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:11
+#: src/lib/ui/taon-theme/taon-theme.component.html:12
+msgid "Settings can't ba changed"
+msgstr "Ustawienia nie mogą być zmienione"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:20
+msgid "Sync colors with system"
+msgstr "Synchronizuj motyw koloru z systemem"
+
+#: src/lib/ui/taon-theme/taon-theme.component.html:28
+msgid "Dark mode"
+msgstr "Tryb ciemny"

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.de-DE.i18n.data.ts

@@ -0,0 +1,14 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs {
+    "de-DE": {};
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.ts",
+    "tags": []
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.de-DE.po

@@ -0,0 +1,5 @@
+msgid ""
+msgstr ""
+"Language: de-DE\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.en-US.i18n.data.ts

@@ -0,0 +1,14 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs {
+    "en-US": {};
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.ts",
+    "tags": []
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.en-US.po

@@ -0,0 +1,5 @@
+msgid ""
+msgstr ""
+"Language: en-US\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.pl-PL.i18n.data.ts

@@ -0,0 +1,14 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs {
+    "pl-PL": {};
+}
+export default {
+    "fileRelativePath": "src/lib/ui/taon-theme/taon-theme.component.ts",
+    "tags": []
+};

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.component.ts.pl-PL.po

@@ -0,0 +1,5 @@
+msgid ""
+msgstr ""
+"Language: pl-PL\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"

package/ts-source/browser-code/ui/taon-theme/i18n/taon-theme.translation.ts

@@ -0,0 +1,16 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { CoreModels } from 'tnp-core/browser';
+import { EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml } from './taon-theme.component.html.en-US.i18n.data';
+import { PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml } from './taon-theme.component.html.pl-PL.i18n.data';
+import { DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml } from './taon-theme.component.html.de-DE.i18n.data';
+import { EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs } from './taon-theme.component.ts.en-US.i18n.data';
+import { PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs } from './taon-theme.component.ts.pl-PL.i18n.data';
+import { DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs } from './taon-theme.component.ts.de-DE.i18n.data';
+;
+export type TaonThemeOverride = CoreModels.DeepPartial<EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml | PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml | DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentHtml | EnUsTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs | PlPlTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs | DeDeTraslationOverrideSrcLibUiTaonThemeTaonThemeComponentTs>;

package/ts-source/browser-code/ui/taon-theme/taon-theme.component.html

@@ -0,0 +1,38 @@
+<!--
+==============================================================================
+ TAON READONLY SOURCE
+ DO NOT MODIFY THIS FILE.
+ Changes may be overwritten.
+==============================================================================
+-->
+
+<div class="absolute top-2 right-2">
+  <button
+    mat-icon-button
+    aria-label="Close dialog"
+    (click)="close()">
+    <mat-icon>close</mat-icon>
+  </button>
+</div>
+<div class="p-4">
+  <h3 class="bold">
+     {{ t.gettext('Theme settings') }}
+    {{ taonTheme.pernamentMode ? t.gettext("Settings can't ba changed") : '' }}
+  </h3>
+
+  <mat-slide-toggle
+    class="p-2"
+    [checked]="taonTheme.isAuto()"
+    [disabled]="taonTheme.pernamentMode"
+    (change)="taonTheme.toogleAuto($event.checked)">
+    {{ t.gettext('Sync colors with system') }}
+  </mat-slide-toggle>
+
+  <mat-slide-toggle
+    class="p-2"
+    [checked]="taonTheme.isDark()"
+    [disabled]="taonTheme.isAuto() || taonTheme.pernamentMode"
+    (change)="taonTheme.setDark($event.checked)">
+    {{ t.gettext('Dark mode') }}
+  </mat-slide-toggle>
+</div>

package/ts-source/browser-code/ui/taon-theme/taon-theme.component.ts

@@ -0,0 +1,36 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { Component, inject } from '@angular/core';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { TaonThemeMode, TaonThemeService } from './taon-theme.service';
+import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';
+import { MatIconModule } from '@angular/material/icon';
+import { MatButtonModule } from '@angular/material/button';
+import { Translatable, TranslateDirective, TranslateService, Translation, } from '@taon-dev/i18n/browser';
+import { Taon } from 'taon/browser';
+const t = Translation.for('src/lib/ui/taon-theme/taon-theme.component.ts', { "src/lib/ui/taon-theme/taon-theme.component.html": { "en-US": async () => (await import('./i18n/taon-theme.component.html.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-theme.component.html.pl-PL.i18n.data')).default, "de-DE": async () => (await import('./i18n/taon-theme.component.html.de-DE.i18n.data')).default }, "src/lib/ui/taon-theme/taon-theme.component.ts": { "en-US": async () => (await import('./i18n/taon-theme.component.ts.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-theme.component.ts.pl-PL.i18n.data')).default, "de-DE": async () => (await import('./i18n/taon-theme.component.ts.de-DE.i18n.data')).default } } as any);
+@Component({
+    selector: 'taon-theme',
+    imports: [
+        MatSlideToggleModule,
+        MatIconModule,
+        MatButtonModule,
+        MatDialogModule,
+        TranslateDirective,
+    ],
+    templateUrl: './taon-theme.component.html',
+})
+export class TaonThemeComponent implements Translatable {
+    t = t.for(this);
+    TaonThemeMode = TaonThemeMode;
+    private readonly dialogRef = inject(MatDialogRef<TaonThemeComponent>);
+    close(): void {
+        this.dialogRef.close();
+    }
+    taonTheme = inject(TaonThemeService);
+}

package/ts-source/browser-code/ui/taon-theme/taon-theme.service.ts

@@ -0,0 +1,84 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { isPlatformBrowser } from '@angular/common';
+import { Injectable, signal, effect, inject, PLATFORM_ID } from '@angular/core';
+export enum TaonThemeMode {
+    AUTO = 'auto',
+    LIGHT = 'light',
+    DARK = 'dark'
+}
+@Injectable({ providedIn: 'root' })
+export class TaonThemeService {
+    private readonly TAON_THEME_KEY = 'taon-theme-mode';
+    private platformId = inject(PLATFORM_ID);
+    private isBrowser = isPlatformBrowser(this.platformId);
+    private mediaQuery: MediaQueryList | null = null;
+    public pernamentMode = false;
+    mode = signal<TaonThemeMode>(TaonThemeMode.AUTO);
+    isDark = signal<boolean>(false);
+    constructor() {
+        if (!this.isBrowser)
+            return;
+        this.mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+        const saved = localStorage.getItem(this.TAON_THEME_KEY) as TaonThemeMode | null;
+        if (saved) {
+            this.mode.set(saved);
+        }
+        this.mediaQuery.addEventListener('change', e => {
+            if (this.pernamentMode) {
+                return;
+            }
+            if (this.mode() === TaonThemeMode.AUTO) {
+                this.apply(e.matches);
+            }
+        });
+        effect(() => {
+            const currentMode = this.mode();
+            localStorage.setItem(this.TAON_THEME_KEY, currentMode);
+            const dark = currentMode === TaonThemeMode.AUTO
+                ? (this.mediaQuery?.matches ?? false)
+                : currentMode === TaonThemeMode.DARK;
+            this.apply(dark);
+        });
+    }
+    private apply(dark: boolean): void {
+        this.isDark.set(dark);
+        const root = document.documentElement;
+        root.classList.toggle('dark-taon-theme', dark);
+        root.classList.toggle('light-taon-theme', !dark);
+    }
+    setMode(mode: TaonThemeMode, options?: {
+        pernamentMode?: boolean;
+    }): void {
+        options = options || {};
+        this.pernamentMode = options.pernamentMode ?? false;
+        this.mode.set(mode);
+    }
+    toogleAuto(auto: boolean): void {
+        if (auto) {
+            this.mode.set(TaonThemeMode.AUTO);
+        }
+        else {
+            this.mode.set(TaonThemeMode.LIGHT);
+        }
+    }
+    setDark(yes: boolean): void {
+        if (yes) {
+            this.mode.set(TaonThemeMode.DARK);
+        }
+        else {
+            this.mode.set(TaonThemeMode.LIGHT);
+        }
+    }
+    toggle(): void {
+        this.setMode(this.isDark() ? TaonThemeMode.LIGHT : TaonThemeMode.DARK);
+    }
+    isAuto(): boolean {
+        return this.mode() === TaonThemeMode.AUTO;
+    }
+}

package/ts-source/browser-code/ui/taon-youtube-video/taon-youtube-video.component.html

@@ -0,0 +1,77 @@
+<!--
+==============================================================================
+ TAON READONLY SOURCE
+ DO NOT MODIFY THIS FILE.
+ Changes may be overwritten.
+==============================================================================
+-->
+
+<div
+  class="yt-container"
+  [ngClass]="state"
+  [ngStyle]="containerStyle">
+  
+  <div
+    *ngIf="!videoActivated()"
+    class="yt-preview"
+    (click)="onPreviewClick()">
+    
+    <img
+      class="yt-media"
+      [src]="previewImage()"
+      [alt]="displayTitle || 'YouTube video'"
+      decoding="async"
+      draggable="false"
+      (error)="onThumbnailError($event)" />
+    
+
+    
+    <div
+      *ngIf="state !== 'preview-picture-locked'"
+      class="yt-play-button">
+      <mat-icon>play_arrow</mat-icon>
+    </div>
+
+    
+    <div
+      *ngIf="state === 'preview-picture-locked'"
+      class="yt-overlay yt-lock"
+      (click)="onLockClick($event)">
+      <mat-icon>lock</mat-icon>
+    </div>
+  </div>
+
+  
+  <iframe
+    #ytFrame
+    *ngIf="videoActivated()"
+    class="yt-media"
+    [src]="embedUrl()"
+    frameborder="0"
+    allow="autoplay; encrypted-media; picture-in-picture; web-share"
+    allowfullscreen>
+  </iframe>
+
+  
+  <div
+    *ngIf="
+      videoActivated() &&
+      state === 'video-preview-private' &&
+      allowedToBeDisplayedVideoOveraly()
+    "
+    class="yt-overlay-video"
+    (contextmenu)="onRightClick($event)"
+    (dblclick)="clicked($event)"
+    (click)="clicked($event)">
+    <h1 class="text-center">
+      Thanks for buying<br />
+      this video
+    </h1>
+  </div>
+</div>
+
+<div
+  class="yt-title"
+  *ngIf="displayTitle">
+  {{ displayTitle }}
+</div>