Native app features for Lovable, Bolt and Base44: prompts to paste

Add a native share button to my project, using the SaasToStore app bridge.

Context: my website also runs inside a native mobile app built with SaasToStore. Inside that app, the function `window.saastostore.share` opens the phone's share sheet. In a normal web browser, and in the editor preview, it does not exist, and the site must keep working exactly as it does today. Do not change anything else.

1. If my project has no `src/lib/saastostore.ts` yet, create it (`.js` if my project doesn't use TypeScript); if it exists, only add what is missing:
   - `isInApp()`: returns `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")`.
   - `bridge()`: returns `typeof window !== "undefined" ? window.saastostore : undefined`. Never read `window.saastostore` during server rendering.
   - the TypeScript type of `window.saastostore` (optional), with this optional member:
     `share?: (o?: { title?: string; text?: string; url?: string }) => Promise<{ shared: boolean; error?: string } | null>`

2. On [THE PAGE OR ITEM TO SHARE], add a "Share" button. When it is tapped:
   - if `bridge()?.share` exists, call `bridge().share({ title: [TITLE], text: [SHORT TEXT], url: [FULL LINK TO THE PAGE] })`. `share` is a function, not an object. `url` must start with `https://` or `http://`. Its promise never rejects: if the result has an `error`, show a short message.
   - otherwise, if `navigator.share` exists, call `navigator.share({ title, text, url })` and ignore the error thrown when the person closes the sheet.
   - otherwise, copy the link to the clipboard and show "Link copied".

3. `shared: true` only means the share sheet opened, not that something was sent: don't show a "Shared" confirmation.

Replace the values in [BRACKETS] before pasting. Add the plugin in your project, then launch a new build.

Add haptic feedback to my project, using the SaasToStore app bridge.

Context: my website also runs inside a native mobile app built with SaasToStore. Inside that app, `window.saastostore.haptics` makes the phone vibrate briefly. In a normal web browser, and in the editor preview, it does not exist, and the site must keep working exactly as it does today. Do not change anything else.

1. If my project has no `src/lib/saastostore.ts` yet, create it (`.js` if my project doesn't use TypeScript); if it exists, only add what is missing:
   - `isInApp()`: returns `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")`.
   - `bridge()`: returns `typeof window !== "undefined" ? window.saastostore : undefined`. Never read `window.saastostore` during server rendering.
   - the TypeScript type of `window.saastostore` (optional), with this optional member:
     `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. In the same file, add three functions that do nothing outside the app and never wait for the result:
   - `tapFeedback()`: calls `bridge()?.haptics?.impact({ style: "light" })`.
   - `successFeedback()`: calls `bridge()?.haptics?.notification({ type: "success" })`.
   - `errorFeedback()`: calls `bridge()?.haptics?.notification({ type: "error" })`.
   Their promises never reject. Ignore a result with `ok: false` (for example `not_available` on a phone that can't vibrate): never show it to the person.

3. Call `tapFeedback()` when [MY MAIN BUTTONS] are tapped, `successFeedback()` when [A FORM, FOR EXAMPLE THE CHECKOUT] succeeds and `errorFeedback()` when it fails.

4. Don't vibrate on scroll, on every key typed, or several times in a row.

Replace the values in [BRACKETS] before pasting. Add the plugin in your project, then launch a new build.

Add a QR code scanner to my project, using the SaasToStore app bridge.

Context: my website also runs inside a native mobile app built with SaasToStore. Inside that app, `window.saastostore.barcode` opens the phone's code reader. In a normal web browser, and in the editor preview, it does not exist, and the site must keep working exactly as it does today. Do not change anything else.

1. If my project has no `src/lib/saastostore.ts` yet, create it (`.js` if my project doesn't use TypeScript); if it exists, only add what is missing:
   - `isInApp()`: returns `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")`.
   - `bridge()`: returns `typeof window !== "undefined" ? window.saastostore : undefined`. Never read `window.saastostore` during server rendering.
   - the TypeScript type of `window.saastostore` (optional), with this optional member:
     `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. On [THE PAGE WHERE PEOPLE SCAN], show a "Scan a code" button only when `isInApp()` is true and `bridge()?.barcode?.isAvailable()` answers `available: true`. Otherwise keep the page as it is today (for example a field to type the code).

3. When the button is tapped, call `bridge().barcode.scan({ formats: ["qr"], prompt: "[TEXT ABOVE THE VIEWFINDER, 200 CHARACTERS MAX]" })`. Its promise never rejects:
   - `scanned: true`: use `value` to [WHAT TO DO WITH THE CODE, FOR EXAMPLE OPEN THE TICKET].
   - `error: "cancelled"`: do nothing, the person closed the reader.
   - `error: "not_allowed"` (iOS, camera refused): explain that the camera can be allowed in the phone's settings.
   - any other error: show a short message.

4. `value` is text from an unknown source: check it before using it, never insert it into the page as HTML, and never open it as a link without checking that it points to [MY DOMAIN].

Replace the values in [BRACKETS] before pasting. Add the plugin in your project, then launch a new build.

Add reminders (local notifications) to my project, using the SaasToStore app bridge.

Context: my website also runs inside a native mobile app built with SaasToStore. Inside that app, `window.saastostore.localNotifications` schedules notifications on the phone itself, with no server. In a normal web browser, and in the editor preview, it does not exist, and the site must keep working exactly as it does today. Do not change anything else.

1. If my project has no `src/lib/saastostore.ts` yet, create it (`.js` if my project doesn't use TypeScript); if it exists, only add what is missing:
   - `isInApp()`: returns `typeof window !== "undefined" && navigator.userAgent.includes("SaasToStoreApp")`.
   - `bridge()`: returns `typeof window !== "undefined" ? window.saastostore : undefined`. Never read `window.saastostore` during server rendering.
   - the TypeScript type of `window.saastostore` (optional), with this optional member:
     `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. On [THE ITEM THAT DESERVES A REMINDER, FOR EXAMPLE A BOOKING], show a "Remind me" button only when `isInApp()` is true and `bridge()?.localNotifications` exists.

3. When the button is tapped (never when the page loads):
   - first call `bridge().localNotifications.requestPermission()`. If `granted` is false, explain that notifications can be allowed in the phone's settings, and stop.
   - then call `bridge().localNotifications.schedule({ id: [A NUMBER UNIQUE TO THIS ITEM], title: [TITLE, 200 CHARACTERS MAX], body: [SHORT TEXT], at: [THE TIME, AS A TIMESTAMP IN MILLISECONDS OR date.toISOString()], data: { [THE ITEM ID] } })`. Show "Reminder set" when `scheduled` is true, and a short message otherwise.
   These promises never reject.

4. When the person taps the notification, open [THE PAGE OF THE ITEM] with the id found in `data`:
   - listen to `window.addEventListener("s2s:localNotifications", (e) => …)` and act when `e.detail.type === "tap"`, using `e.detail.data`;
   - also call `bridge()?.localNotifications?.getLastOpened()` once when the app starts: if the app was closed, the event fired before the page was listening. It returns `{ notification }` once, then `{ notification: null }`.

5. When the item is cancelled or the reminder is no longer useful, call `bridge()?.localNotifications?.cancel({ id })`.

Replace the values in [BRACKETS] before pasting. Add the plugin in your project, then launch a new build.