Native App-Funktionen für Lovable, Bolt und Base44: Prompts zum Einfügen

Füge meinem Projekt einen nativen Teilen-Button hinzu, über die SaasToStore-App-Bridge.

Kontext: Meine Website läuft auch in einer nativen Mobile-App, die mit SaasToStore gebaut wurde. In dieser App öffnet die Funktion `window.saastostore.share` das Teilen-Menü des Telefons. In einem normalen Browser und in der Vorschau des Editors existiert es nicht, und die Website muss genau wie heute weiter funktionieren. Ändere sonst nichts.

1. Wenn mein Projekt noch keine `src/lib/saastostore.ts` hat, lege sie an (`.js`, wenn mein Projekt kein TypeScript nutzt); wenn sie existiert, ergänze nur, was fehlt:
   - `isInApp()`: gibt `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")` zurück.
   - `bridge()`: gibt `typeof window !== "undefined" ? window.saastostore : undefined` zurück. Lies `window.saastostore` nie beim Server-Rendering.
   - den TypeScript-Typ von `window.saastostore` (optional), mit diesem optionalen Mitglied:
     `share?: (o?: { title?: string; text?: string; url?: string }) => Promise<{ shared: boolean; error?: string } | null>`

2. Füge auf [DER SEITE ODER DEM ELEMENT ZUM TEILEN] einen Button „Teilen“ hinzu. Beim Tippen:
   - wenn `bridge()?.share` existiert, rufe `bridge().share({ title: [TITEL], text: [KURZER TEXT], url: [VOLLSTÄNDIGER LINK ZUR SEITE] })` auf. `share` ist eine Funktion, kein Objekt. `url` muss mit `https://` oder `http://` beginnen. Das Promise lehnt nie ab: Enthält das Ergebnis einen `error`, zeige eine kurze Meldung.
   - sonst, wenn `navigator.share` existiert, rufe `navigator.share({ title, text, url })` auf und ignoriere den Fehler, der kommt, wenn die Person das Menü schließt.
   - sonst kopiere den Link in die Zwischenablage und zeige „Link kopiert“.

3. `shared: true` heißt nur, dass sich das Teilen-Menü geöffnet hat, nicht, dass etwas gesendet wurde: Zeige keine Bestätigung „Geteilt“.

Ersetzen Sie vor dem Einfügen die Werte in [KLAMMERN]. Fügen Sie das Plugin in Ihrem Projekt hinzu und starten Sie dann einen neuen Build.

Füge meinem Projekt haptisches Feedback hinzu, über die SaasToStore-App-Bridge.

Kontext: Meine Website läuft auch in einer nativen Mobile-App, die mit SaasToStore gebaut wurde. In dieser App lässt `window.saastostore.haptics` das Telefon kurz vibrieren. In einem normalen Browser und in der Vorschau des Editors existiert es nicht, und die Website muss genau wie heute weiter funktionieren. Ändere sonst nichts.

1. Wenn mein Projekt noch keine `src/lib/saastostore.ts` hat, lege sie an (`.js`, wenn mein Projekt kein TypeScript nutzt); wenn sie existiert, ergänze nur, was fehlt:
   - `isInApp()`: gibt `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")` zurück.
   - `bridge()`: gibt `typeof window !== "undefined" ? window.saastostore : undefined` zurück. Lies `window.saastostore` nie beim Server-Rendering.
   - den TypeScript-Typ von `window.saastostore` (optional), mit diesem optionalen Mitglied:
     `haptics?: { impact(o?: { style?: "light" | "medium" | "heavy" }): Promise<{ ok: boolean; error?: string } | null>; notification(o?: { type?: "success" | "warning" | "error" }): Promise<{ ok: boolean; error?: string } | null>; selection(): Promise<{ ok: boolean; error?: string } | null> }`

2. Füge in derselben Datei drei Funktionen hinzu, die außerhalb der App nichts tun und nie auf das Ergebnis warten:
   - `tapFeedback()`: ruft `bridge()?.haptics?.impact({ style: "light" })` auf.
   - `successFeedback()`: ruft `bridge()?.haptics?.notification({ type: "success" })` auf.
   - `errorFeedback()`: ruft `bridge()?.haptics?.notification({ type: "error" })` auf.
   Ihre Promises lehnen nie ab. Ignoriere ein Ergebnis mit `ok: false` (zum Beispiel `not_available` auf einem Telefon, das nicht vibrieren kann): Zeige es der Person nie.

3. Rufe `tapFeedback()` beim Tippen auf [MEINE HAUPT-BUTTONS] auf, `successFeedback()`, wenn [EIN FORMULAR, ZUM BEISPIEL DER CHECKOUT] gelingt, und `errorFeedback()`, wenn es scheitert.

4. Lass nicht beim Scrollen, bei jeder getippten Taste oder mehrmals hintereinander vibrieren.

Ersetzen Sie vor dem Einfügen die Werte in [KLAMMERN]. Fügen Sie das Plugin in Ihrem Projekt hinzu und starten Sie dann einen neuen Build.

Füge meinem Projekt einen QR-Code-Scanner hinzu, über die SaasToStore-App-Bridge.

Kontext: Meine Website läuft auch in einer nativen Mobile-App, die mit SaasToStore gebaut wurde. In dieser App öffnet `window.saastostore.barcode` den Code-Leser des Telefons. In einem normalen Browser und in der Vorschau des Editors existiert es nicht, und die Website muss genau wie heute weiter funktionieren. Ändere sonst nichts.

1. Wenn mein Projekt noch keine `src/lib/saastostore.ts` hat, lege sie an (`.js`, wenn mein Projekt kein TypeScript nutzt); wenn sie existiert, ergänze nur, was fehlt:
   - `isInApp()`: gibt `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")` zurück.
   - `bridge()`: gibt `typeof window !== "undefined" ? window.saastostore : undefined` zurück. Lies `window.saastostore` nie beim Server-Rendering.
   - den TypeScript-Typ von `window.saastostore` (optional), mit diesem optionalen Mitglied:
     `barcode?: { isAvailable(): Promise<{ available: boolean; reason?: string } | null>; scan(o?: { formats?: string[]; prompt?: string }): Promise<{ scanned: true; value: string; format: string } | { scanned: false; error: string } | null> }`

2. Zeige auf [DER SEITE, AUF DER GESCANNT WIRD] einen Button „Code scannen“ nur, wenn `isInApp()` true ist und `bridge()?.barcode?.isAvailable()` `available: true` liefert. Sonst bleibt die Seite wie heute (zum Beispiel ein Feld zum Eintippen des Codes).

3. Beim Tippen auf den Button rufe `bridge().barcode.scan({ formats: ["qr"], prompt: "[TEXT ÜBER DEM SUCHER, HÖCHSTENS 200 ZEICHEN]" })` auf. Das Promise lehnt nie ab:
   - `scanned: true`: nutze `value`, um [WAS MIT DEM CODE GESCHEHEN SOLL, ZUM BEISPIEL DAS TICKET ÖFFNEN].
   - `error: "cancelled"`: tu nichts, die Person hat den Leser geschlossen.
   - `error: "not_allowed"` (iOS, Kamera verweigert): erkläre, dass die Kamera in den Einstellungen des Telefons erlaubt werden kann.
   - jeder andere Fehler: zeige eine kurze Meldung.

4. `value` ist Text aus unbekannter Quelle: Prüfe ihn vor der Verwendung, füge ihn nie als HTML in die Seite ein und öffne ihn nie als Link, ohne zu prüfen, dass er auf [MEINE DOMAIN] zeigt.

Ersetzen Sie vor dem Einfügen die Werte in [KLAMMERN]. Fügen Sie das Plugin in Ihrem Projekt hinzu und starten Sie dann einen neuen Build.

Füge meinem Projekt Erinnerungen (lokale Benachrichtigungen) hinzu, über die SaasToStore-App-Bridge.

Kontext: Meine Website läuft auch in einer nativen Mobile-App, die mit SaasToStore gebaut wurde. In dieser App plant `window.saastostore.localNotifications` Benachrichtigungen auf dem Telefon selbst, ohne Server. In einem normalen Browser und in der Vorschau des Editors existiert es nicht, und die Website muss genau wie heute weiter funktionieren. Ändere sonst nichts.

1. Wenn mein Projekt noch keine `src/lib/saastostore.ts` hat, lege sie an (`.js`, wenn mein Projekt kein TypeScript nutzt); wenn sie existiert, ergänze nur, was fehlt:
   - `isInApp()`: gibt `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")` zurück.
   - `bridge()`: gibt `typeof window !== "undefined" ? window.saastostore : undefined` zurück. Lies `window.saastostore` nie beim Server-Rendering.
   - den TypeScript-Typ von `window.saastostore` (optional), mit diesem optionalen Mitglied:
     `localNotifications?: { requestPermission(): Promise<{ granted: boolean; status: "granted" | "denied" | "prompt"; error?: string } | null>; schedule(o: { id?: number; title: string; body?: string; at?: number | string; in?: number; data?: object }): Promise<{ scheduled: true; id: number; at: number } | { scheduled: false; error: string; status?: string } | null>; cancel(o: { id: number }): Promise<{ ok: boolean; error?: string } | null>; getLastOpened(): Promise<{ notification: { id: number; title: string; body: string; at: number; data: object } | null } | null> }`

2. Zeige bei [DEM ELEMENT, DAS EINE ERINNERUNG VERDIENT, ZUM BEISPIEL EINE BUCHUNG] einen Button „Erinnere mich“ nur, wenn `isInApp()` true ist und `bridge()?.localNotifications` existiert.

3. Beim Tippen auf den Button (nie beim Laden der Seite):
   - rufe zuerst `bridge().localNotifications.requestPermission()` auf. Ist `granted` false, erkläre, dass Benachrichtigungen in den Einstellungen des Telefons erlaubt werden können, und hör auf.
   - rufe dann `bridge().localNotifications.schedule({ id: [EINE ZAHL, DIE NUR ZU DIESEM ELEMENT GEHÖRT], title: [TITEL, HÖCHSTENS 200 ZEICHEN], body: [KURZER TEXT], at: [DER ZEITPUNKT, IN MILLISEKUNDEN ODER date.toISOString()], data: { [DIE ID DES ELEMENTS] } })` auf. Zeige „Erinnerung gesetzt“, wenn `scheduled` true ist, sonst eine kurze Meldung.
   Diese Promises lehnen nie ab.

4. Tippt die Person auf die Benachrichtigung, öffne [DIE SEITE DES ELEMENTS] mit der ID aus `data`:
   - höre auf `window.addEventListener("s2s:localNotifications", (e) => …)` und handle, wenn `e.detail.type === "tap"`, mit `e.detail.data`;
   - rufe außerdem beim Start der App einmal `bridge()?.localNotifications?.getLastOpened()` auf: War die App geschlossen, kam das Event, bevor die Seite zuhörte. Es liefert einmal `{ notification }`, danach `{ notification: null }`.

5. Wird das Element storniert oder braucht es die Erinnerung nicht mehr, rufe `bridge()?.localNotifications?.cancel({ id })` auf.

Ersetzen Sie vor dem Einfügen die Werte in [KLAMMERN]. Fügen Sie das Plugin in Ihrem Projekt hinzu und starten Sie dann einen neuen Build.