@a-type/ui 3.0.36 → 3.0.37

package/dist/cjs/components/provider/Provider.d.ts

@@ -5,11 +5,12 @@ export interface ProviderProps {
     disableViewportOffset?: boolean;
     virtualKeyboardBehavior?: 'overlay' | 'displace';
     disableTitleBarColor?: boolean;
+    manifestPath?: string;
 }
 /**
  * Provides all the stuff for all global junk.
  */
-export declare function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior, disableTitleBarColor, }: ProviderProps): import("react/jsx-runtime.js").JSX.Element;
+export declare function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior, disableTitleBarColor, manifestPath, }: ProviderProps): import("react/jsx-runtime.js").JSX.Element;
 export declare const ConfigContext: import("react").Context<{
     virtualKeyboardBehavior: "overlay" | "displace";
 }>;

package/dist/cjs/components/provider/Provider.js

@@ -10,19 +10,20 @@ const hooks_js_1 = require("../../hooks.js");
 const useVirtualKeyboardBehavior_js_1 = require("../../hooks/useVirtualKeyboardBehavior.js");
 const index_js_1 = require("../icon/index.js");
 const index_js_2 = require("../particles/index.js");
+const PwaInstall_js_1 = require("../pwaInstall/PwaInstall.js");
 const toasts_js_1 = require("../toasts/toasts.js");
 const index_js_3 = require("../tooltip/index.js");
 /**
  * Provides all the stuff for all global junk.
  */
-function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior = 'displace', disableTitleBarColor, }) {
+function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior = 'displace', disableTitleBarColor, manifestPath, }) {
     (0, hooks_js_1.useVisualViewportOffset)(disableViewportOffset);
     const supportedVirtualKeyboardBehavior = typeof navigator !== 'undefined' && 'virtualKeyboard' in navigator
         ? virtualKeyboardBehavior
         : 'displace';
     (0, useVirtualKeyboardBehavior_js_1.useVirtualKeyboardBehavior)(supportedVirtualKeyboardBehavior);
     (0, hooks_js_1.useThemedTitleBar)('gray', 'wash', undefined, disableTitleBarColor);
-    const otherStuff = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_js_1.IconSpritesheet, {}), (0, jsx_runtime_1.jsx)(toasts_js_1.Toaster, {})] }));
+    const otherStuff = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_js_1.IconSpritesheet, {}), (0, jsx_runtime_1.jsx)(toasts_js_1.Toaster, {}), (0, jsx_runtime_1.jsx)(PwaInstall_js_1.PwaInstall, { manifestPath: manifestPath })] }));
     if (disableParticles)
         return ((0, jsx_runtime_1.jsx)(exports.ConfigContext.Provider, { value: { virtualKeyboardBehavior: supportedVirtualKeyboardBehavior }, children: (0, jsx_runtime_1.jsxs)(index_js_3.TooltipProvider, { children: [children, otherStuff] }) }));
     return ((0, jsx_runtime_1.jsx)(exports.ConfigContext.Provider, { value: { virtualKeyboardBehavior: supportedVirtualKeyboardBehavior }, children: (0, jsx_runtime_1.jsx)(index_js_3.TooltipProvider, { children: (0, jsx_runtime_1.jsxs)(index_js_2.ParticleLayer, { children: [children, otherStuff] }) }) }));

package/dist/cjs/components/provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/components/provider/Provider.tsx"],"names":[],"mappings":";;;AAmBA,4BA6CC;AAQD,8BAEC;;AA1ED,iCAA6D;AAC7D,6CAA4E;AAC5E,6FAAuF;AACvF,+CAAmD;AACnD,oDAAsD;AACtD,mDAA8C;AAC9C,kDAAsD;AAUtD;;GAEG;AACH,SAAgB,QAAQ,CAAC,EACxB,QAAQ,EACR,gBAAgB,EAChB,qBAAqB,EACrB,uBAAuB,GAAG,UAAU,EACpC,oBAAoB,GACL;IACf,IAAA,kCAAuB,EAAC,qBAAqB,CAAC,CAAC;IAC/C,MAAM,gCAAgC,GACrC,OAAO,SAAS,KAAK,WAAW,IAAI,iBAAiB,IAAI,SAAS;QACjE,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,UAAU,CAAC;IACf,IAAA,0DAA0B,EAAC,gCAAgC,CAAC,CAAC;IAC7D,IAAA,4BAAiB,EAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,CAClB,6DACC,uBAAC,0BAAe,KAAG,EACnB,uBAAC,mBAAO,KAAG,IACT,CACH,CAAC;IAEF,IAAI,gBAAgB;QACnB,OAAO,CACN,uBAAC,qBAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,wBAAC,0BAAe,eACd,QAAQ,EACR,UAAU,IACM,GACM,CACzB,CAAC;IAEH,OAAO,CACN,uBAAC,qBAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,uBAAC,0BAAe,cACf,wBAAC,wBAAa,eACZ,QAAQ,EACR,UAAU,IACI,GACC,GACM,CACzB,CAAC;AACH,CAAC;AAEY,QAAA,aAAa,GAAG,IAAA,qBAAa,EAEvC;IACF,uBAAuB,EAAE,UAAU;CACnC,CAAC,CAAC;AAEH,SAAgB,SAAS;IACxB,OAAO,IAAA,kBAAU,EAAC,qBAAa,CAAC,CAAC;AAClC,CAAC"}
+{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/components/provider/Provider.tsx"],"names":[],"mappings":";;;AAqBA,4BA+CC;AAQD,8BAEC;;AA9ED,iCAA6D;AAC7D,6CAA4E;AAC5E,6FAAuF;AACvF,+CAAmD;AACnD,oDAAsD;AACtD,+DAAyD;AACzD,mDAA8C;AAC9C,kDAAsD;AAWtD;;GAEG;AACH,SAAgB,QAAQ,CAAC,EACxB,QAAQ,EACR,gBAAgB,EAChB,qBAAqB,EACrB,uBAAuB,GAAG,UAAU,EACpC,oBAAoB,EACpB,YAAY,GACG;IACf,IAAA,kCAAuB,EAAC,qBAAqB,CAAC,CAAC;IAC/C,MAAM,gCAAgC,GACrC,OAAO,SAAS,KAAK,WAAW,IAAI,iBAAiB,IAAI,SAAS;QACjE,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,UAAU,CAAC;IACf,IAAA,0DAA0B,EAAC,gCAAgC,CAAC,CAAC;IAC7D,IAAA,4BAAiB,EAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,CAClB,6DACC,uBAAC,0BAAe,KAAG,EACnB,uBAAC,mBAAO,KAAG,EACX,uBAAC,0BAAU,IAAC,YAAY,EAAE,YAAY,GAAI,IACxC,CACH,CAAC;IAEF,IAAI,gBAAgB;QACnB,OAAO,CACN,uBAAC,qBAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,wBAAC,0BAAe,eACd,QAAQ,EACR,UAAU,IACM,GACM,CACzB,CAAC;IAEH,OAAO,CACN,uBAAC,qBAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,uBAAC,0BAAe,cACf,wBAAC,wBAAa,eACZ,QAAQ,EACR,UAAU,IACI,GACC,GACM,CACzB,CAAC;AACH,CAAC;AAEY,QAAA,aAAa,GAAG,IAAA,qBAAa,EAEvC;IACF,uBAAuB,EAAE,UAAU;CACnC,CAAC,CAAC;AAEH,SAAgB,SAAS;IACxB,OAAO,IAAA,kBAAU,EAAC,qBAAa,CAAC,CAAC;AAClC,CAAC"}

package/dist/cjs/components/pwaInstall/PwaInstall.d.ts

@@ -0,0 +1,5 @@
+import { DialogTriggerProps } from '@radix-ui/react-dialog';
+export interface PwaInstall extends DialogTriggerProps {
+    manifestPath?: string;
+}
+export declare function PwaInstall({ children, manifestPath, asChild: _, ...rest }: PwaInstall): import("react/jsx-runtime.js").JSX.Element | null;

package/dist/cjs/components/pwaInstall/PwaInstall.js

@@ -0,0 +1,79 @@
+// @unocss-include
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PwaInstall = PwaInstall;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const valtio_1 = require("valtio");
+const platform_js_1 = require("../../platform.js");
+const Box_js_1 = require("../box/Box.js");
+const Button_js_1 = require("../button/Button.js");
+const Dialog_js_1 = require("../dialog/Dialog.js");
+const Icon_js_1 = require("../icon/Icon.js");
+const Lightbox_js_1 = require("../lightbox/Lightbox.js");
+const lists_js_1 = require("../lists/lists.js");
+const typography_js_1 = require("../typography/typography.js");
+const PlatformIcons_js_1 = require("./PlatformIcons.js");
+const state_js_1 = require("./state.js");
+const useIsInstallReady_js_1 = require("./useIsInstallReady.js");
+const useWebManifest_js_1 = require("./useWebManifest.js");
+function PwaInstall(_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var { children, manifestPath, asChild: _ } = _a, rest = __rest(_a, ["children", "manifestPath", "asChild"]);
+    const installed = (0, useIsInstallReady_js_1.useIsInstalled)();
+    const manifest = (0, useWebManifest_js_1.useWebManifest)(manifestPath);
+    const { open } = (0, valtio_1.useSnapshot)(state_js_1.pwaInstallerState);
+    const [showInstructions, setShowInstructions] = (0, react_1.useState)(false);
+    if (installed) {
+        return null;
+    }
+    const primaryIcon = (_b = manifest === null || manifest === void 0 ? void 0 : manifest.icons) === null || _b === void 0 ? void 0 : _b[0];
+    return ((0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog, { open: open, onOpenChange: (isOpen) => {
+            state_js_1.pwaInstallerState.open = isOpen;
+        }, children: (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Content, { className: "flex flex-col gap-xs", id: "pwa-install-dialog", children: [(0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Title, { className: "flex flex-row gap-md items-center", children: [primaryIcon && ((0, jsx_runtime_1.jsx)("img", { src: primaryIcon.src, alt: (_e = (_d = (_c = primaryIcon.label) !== null && _c !== void 0 ? _c : manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _d !== void 0 ? _d : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _e !== void 0 ? _e : 'App Icon', className: "inline-block w-1em h-1em rounded" })), "Install ", (_g = (_f = manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _f !== void 0 ? _f : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _g !== void 0 ? _g : 'App'] }), showInstructions ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Description, { children: "Follow the instructions below to install this app on your device." }), (0, jsx_runtime_1.jsx)(InstallInstructions, {}), (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Close, { asChild: true, children: (0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", children: "Close" }) }), (0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => setShowInstructions(false), children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "arrowLeft" }), " Back"] })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Description, { children: "This site is also an app. You can install it right now for easier access and more features." }), (manifest === null || manifest === void 0 ? void 0 : manifest.description) && ((0, jsx_runtime_1.jsx)(typography_js_1.P, { className: "mb-sm", children: manifest.description })), (0, jsx_runtime_1.jsx)(ManifestImageGallery, { manifestPath: manifestPath }), (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Close, { asChild: true, children: (0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", children: "Close" }) }), (0, jsx_runtime_1.jsx)(InstallDeviceActions, { showInstructions: () => setShowInstructions(true) })] })] }))] }) }));
+}
+const supportsDirectInstall = (0, platform_js_1.getSupportsPWAInstallPrompt)();
+function InstallInstructions() {
+    const os = (0, platform_js_1.getOS)();
+    if (os === 'iOS' || os === 'Mac OS') {
+        if ((0, platform_js_1.getIsSafari)()) {
+            if (os === 'iOS') {
+                return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariPlusSquareIcon, {}), " Scroll down and tap \"Add to Home Screen\"."] })] }));
+            }
+            else {
+                return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariAddToDockIcon, {}), " Tap \"Add to Dock\"."] })] }));
+            }
+        }
+        else {
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lists_js_1.Ol, { children: (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariIcon, {}), " Open this site in Safari to continue."] }) }), (0, jsx_runtime_1.jsx)(Box_js_1.Box, { surface: true, p: true, children: "Apple does not allow non-Safari browsers to install web apps." })] }));
+        }
+    }
+    return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "dots", className: "rotate-90" }), " Tap the menu button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.AndroidAddToHomeIcon, {}), " Tap \"Add to Home Screen.\""] })] }));
+}
+function ManifestImageGallery({ manifestPath }) {
+    var _a, _b;
+    const manifest = (0, useWebManifest_js_1.useWebManifest)(manifestPath);
+    if (!((_a = manifest === null || manifest === void 0 ? void 0 : manifest.screenshots) === null || _a === void 0 ? void 0 : _a.length)) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)(Box_js_1.Box, { overflow: "auto-x", p: "sm", gap: true, className: "h-240px", children: (_b = manifest.screenshots) === null || _b === void 0 ? void 0 : _b.map((screenshot, index) => ((0, jsx_runtime_1.jsxs)(Lightbox_js_1.Lightbox.Root, { children: [(0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Image, { tabIndex: 0, src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}`, className: "border border-default rounded-xs" }, index) }), (0, jsx_runtime_1.jsxs)(Lightbox_js_1.Lightbox.Portal, { children: [(0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Overlay, { className: "z-10000" }), (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Content, { className: "z-10001", children: (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Image, { src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}` }) })] })] }, screenshot.src))) }));
+}
+function InstallDeviceActions({ showInstructions, }) {
+    const ready = (0, useIsInstallReady_js_1.useIsInstallReady)();
+    if (supportsDirectInstall && ready) {
+        return ((0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => (0, useIsInstallReady_js_1.triggerDeferredInstall)(), emphasis: "primary", children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "download" }), " Install now"] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => showInstructions(), emphasis: "primary", children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "arrowRight" }), " Add to Home"] }));
+}
+//# sourceMappingURL=PwaInstall.js.map

package/dist/cjs/components/pwaInstall/PwaInstall.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PwaInstall.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstall.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/pwaInstall/PwaInstallTrigger.d.ts

@@ -1,5 +1,4 @@
-import { DialogTriggerProps } from '@radix-ui/react-dialog';
-export interface PwaInstallTriggerProps extends DialogTriggerProps {
-    manifestPath?: string;
+import { ButtonProps } from '../button/Button.js';
+export interface PwaInstallTriggerProps extends ButtonProps {
 }
-export declare function PwaInstallTrigger({ children, manifestPath, asChild: _, ...rest }: PwaInstallTriggerProps): import("react/jsx-runtime.js").JSX.Element | null;
+export declare function PwaInstallTrigger({ children, ...rest }: PwaInstallTriggerProps): import("react/jsx-runtime.js").JSX.Element | null;

package/dist/cjs/components/pwaInstall/PwaInstallTrigger.js

@@ -14,61 +14,18 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PwaInstallTrigger = PwaInstallTrigger;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const platform_js_1 = require("../../platform.js");
-const Box_js_1 = require("../box/Box.js");
 const Button_js_1 = require("../button/Button.js");
-const Dialog_js_1 = require("../dialog/Dialog.js");
 const Icon_js_1 = require("../icon/Icon.js");
-const Lightbox_js_1 = require("../lightbox/Lightbox.js");
-const lists_js_1 = require("../lists/lists.js");
-const typography_js_1 = require("../typography/typography.js");
-const PlatformIcons_js_1 = require("./PlatformIcons.js");
+const state_js_1 = require("./state.js");
 const useIsInstallReady_js_1 = require("./useIsInstallReady.js");
-const useWebManifest_js_1 = require("./useWebManifest.js");
 function PwaInstallTrigger(_a) {
-    var _b, _c, _d, _e, _f, _g;
-    var { children, manifestPath, asChild: _ } = _a, rest = __rest(_a, ["children", "manifestPath", "asChild"]);
+    var { children } = _a, rest = __rest(_a, ["children"]);
     const installed = (0, useIsInstallReady_js_1.useIsInstalled)();
-    const manifest = (0, useWebManifest_js_1.useWebManifest)(manifestPath);
-    const [showInstructions, setShowInstructions] = (0, react_1.useState)(false);
     if (installed) {
         return null;
     }
-    const primaryIcon = (_b = manifest === null || manifest === void 0 ? void 0 : manifest.icons) === null || _b === void 0 ? void 0 : _b[0];
-    return ((0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Trigger, Object.assign({}, rest, { asChild: true, children: children !== null && children !== void 0 ? children : ((0, jsx_runtime_1.jsxs)(Button_js_1.Button, { color: "primary", emphasis: "light", children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "star" }), " Install"] })) })), (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Content, { className: "flex flex-col gap-xs", children: [(0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Title, { className: "flex flex-row gap-md items-center", children: [primaryIcon && ((0, jsx_runtime_1.jsx)("img", { src: primaryIcon.src, alt: (_e = (_d = (_c = primaryIcon.label) !== null && _c !== void 0 ? _c : manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _d !== void 0 ? _d : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _e !== void 0 ? _e : 'App Icon', className: "inline-block w-1em h-1em rounded" })), "Install ", (_g = (_f = manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _f !== void 0 ? _f : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _g !== void 0 ? _g : 'App'] }), showInstructions ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Description, { children: "Follow the instructions below to install this app on your device." }), (0, jsx_runtime_1.jsx)(InstallInstructions, {}), (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Close, { asChild: true, children: (0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", children: "Close" }) }), (0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => setShowInstructions(false), children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "arrowLeft" }), " Back"] })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Description, { children: "This site is also an app. You can install it right now for easier access and more features." }), (manifest === null || manifest === void 0 ? void 0 : manifest.description) && ((0, jsx_runtime_1.jsx)(typography_js_1.P, { className: "mb-sm", children: manifest.description })), (0, jsx_runtime_1.jsx)(ManifestImageGallery, { manifestPath: manifestPath }), (0, jsx_runtime_1.jsxs)(Dialog_js_1.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(Dialog_js_1.Dialog.Close, { asChild: true, children: (0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", children: "Close" }) }), (0, jsx_runtime_1.jsx)(InstallDeviceActions, { showInstructions: () => setShowInstructions(true) })] })] }))] })] }));
-}
-const supportsDirectInstall = (0, platform_js_1.getSupportsPWAInstallPrompt)();
-function InstallInstructions() {
-    const os = (0, platform_js_1.getOS)();
-    if (os === 'iOS' || os === 'Mac OS') {
-        if ((0, platform_js_1.getIsSafari)()) {
-            if (os === 'iOS') {
-                return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariPlusSquareIcon, {}), " Scroll down and tap \"Add to Home Screen\"."] })] }));
-            }
-            else {
-                return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariAddToDockIcon, {}), " Tap \"Add to Dock\"."] })] }));
-            }
-        }
-        else {
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(lists_js_1.Ol, { children: (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.SafariIcon, {}), " Open this site in Safari to continue."] }) }), (0, jsx_runtime_1.jsx)(Box_js_1.Box, { surface: true, p: true, children: "Apple does not allow non-Safari browsers to install web apps." })] }));
-        }
-    }
-    return ((0, jsx_runtime_1.jsxs)(lists_js_1.Ol, { children: [(0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "dots", className: "rotate-90" }), " Tap the menu button in the toolbar."] }), (0, jsx_runtime_1.jsxs)(lists_js_1.Ol.Item, { children: [(0, jsx_runtime_1.jsx)(PlatformIcons_js_1.AndroidAddToHomeIcon, {}), " Tap \"Add to Home Screen.\""] })] }));
-}
-function ManifestImageGallery({ manifestPath }) {
-    var _a, _b;
-    const manifest = (0, useWebManifest_js_1.useWebManifest)(manifestPath);
-    if (!((_a = manifest === null || manifest === void 0 ? void 0 : manifest.screenshots) === null || _a === void 0 ? void 0 : _a.length)) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)(Box_js_1.Box, { overflow: "auto-x", p: "sm", gap: true, className: "h-240px", children: (_b = manifest.screenshots) === null || _b === void 0 ? void 0 : _b.map((screenshot, index) => ((0, jsx_runtime_1.jsxs)(Lightbox_js_1.Lightbox.Root, { children: [(0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Image, { tabIndex: 0, src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}`, className: "border border-default rounded-xs" }, index) }), (0, jsx_runtime_1.jsxs)(Lightbox_js_1.Lightbox.Portal, { children: [(0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Overlay, { className: "z-10000" }), (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Content, { className: "z-10001", children: (0, jsx_runtime_1.jsx)(Lightbox_js_1.Lightbox.Image, { src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}` }) })] })] }, screenshot.src))) }));
-}
-function InstallDeviceActions({ showInstructions, }) {
-    const ready = (0, useIsInstallReady_js_1.useIsInstallReady)();
-    if (supportsDirectInstall && ready) {
-        return ((0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => (0, useIsInstallReady_js_1.triggerDeferredInstall)(), emphasis: "primary", children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "download" }), " Install now"] }));
-    }
-    return ((0, jsx_runtime_1.jsxs)(Button_js_1.Button, { onClick: () => showInstructions(), emphasis: "primary", children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "arrowRight" }), " Add to Home"] }));
+    return ((0, jsx_runtime_1.jsx)(Button_js_1.Button, Object.assign({ color: "primary", emphasis: "light" }, rest, { onClick: () => {
+            state_js_1.pwaInstallerState.open = true;
+        }, children: children !== null && children !== void 0 ? children : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "star" }), " Install"] })) })));
 }
 //# sourceMappingURL=PwaInstallTrigger.js.map

package/dist/cjs/components/pwaInstall/PwaInstallTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"PwaInstallTrigger.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstallTrigger.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PwaInstallTrigger.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstallTrigger.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAOA,8CAyBC;;AAhCD,mDAA0D;AAC1D,6CAAuC;AACvC,yCAA+C;AAC/C,iEAAwD;AAIxD,SAAgB,iBAAiB,CAAC,EAGT;QAHS,EACjC,QAAQ,OAEgB,EADrB,IAAI,cAF0B,YAGjC,CADO;IAEP,MAAM,SAAS,GAAG,IAAA,qCAAc,GAAE,CAAC;IACnC,IAAI,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,CACN,uBAAC,kBAAM,kBACN,KAAK,EAAC,SAAS,EACf,QAAQ,EAAC,OAAO,IACZ,IAAI,IACR,OAAO,EAAE,GAAG,EAAE;YACb,4BAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;QAC/B,CAAC,YAEA,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CACZ,6DACC,uBAAC,cAAI,IAAC,IAAI,EAAC,MAAM,GAAG,gBAClB,CACH,IACO,CACT,CAAC;AACH,CAAC"}

package/dist/cjs/components/pwaInstall/index.d.ts

@@ -1,3 +1,4 @@
 export * from './PwaInstallTrigger.js';
+export * from './state.js';
 export * from './useIsInstallReady.js';
 export * from './useWebManifest.js';

package/dist/cjs/components/pwaInstall/index.js

@@ -16,6 +16,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./PwaInstallTrigger.js"), exports);
+__exportStar(require("./state.js"), exports);
 __exportStar(require("./useIsInstallReady.js"), exports);
 __exportStar(require("./useWebManifest.js"), exports);
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/pwaInstall/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yDAAuC;AACvC,yDAAuC;AACvC,sDAAoC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yDAAuC;AACvC,6CAA2B;AAC3B,yDAAuC;AACvC,sDAAoC"}

package/dist/cjs/components/pwaInstall/state.d.ts

@@ -0,0 +1,4 @@
+export declare const pwaInstallerState: {
+    open: boolean;
+};
+export declare function showPwaInstall(): void;

package/dist/cjs/components/pwaInstall/state.js

@@ -0,0 +1,13 @@
+// @unocss-include
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pwaInstallerState = void 0;
+exports.showPwaInstall = showPwaInstall;
+const valtio_1 = require("valtio");
+exports.pwaInstallerState = (0, valtio_1.proxy)({
+    open: false,
+});
+function showPwaInstall() {
+    exports.pwaInstallerState.open = true;
+}
+//# sourceMappingURL=state.js.map

package/dist/cjs/components/pwaInstall/state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/state.ts"],"names":[],"mappings":";;;AAMA,wCAEC;AARD,mCAA+B;AAElB,QAAA,iBAAiB,GAAG,IAAA,cAAK,EAAC;IACtC,IAAI,EAAE,KAAK;CACX,CAAC,CAAC;AAEH,SAAgB,cAAc;IAC7B,yBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;AAC/B,CAAC"}

package/dist/esm/components/provider/Provider.d.ts

@@ -5,11 +5,12 @@ export interface ProviderProps {
     disableViewportOffset?: boolean;
     virtualKeyboardBehavior?: 'overlay' | 'displace';
     disableTitleBarColor?: boolean;
+    manifestPath?: string;
 }
 /**
  * Provides all the stuff for all global junk.
  */
-export declare function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior, disableTitleBarColor, }: ProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior, disableTitleBarColor, manifestPath, }: ProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare const ConfigContext: import("react").Context<{
     virtualKeyboardBehavior: "overlay" | "displace";
 }>;

package/dist/esm/components/provider/Provider.js

@@ -5,19 +5,20 @@ import { useThemedTitleBar, useVisualViewportOffset } from '../../hooks.js';
 import { useVirtualKeyboardBehavior } from '../../hooks/useVirtualKeyboardBehavior.js';
 import { IconSpritesheet } from '../icon/index.js';
 import { ParticleLayer } from '../particles/index.js';
+import { PwaInstall } from '../pwaInstall/PwaInstall.js';
 import { Toaster } from '../toasts/toasts.js';
 import { TooltipProvider } from '../tooltip/index.js';
 /**
  * Provides all the stuff for all global junk.
  */
-export function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior = 'displace', disableTitleBarColor, }) {
+export function Provider({ children, disableParticles, disableViewportOffset, virtualKeyboardBehavior = 'displace', disableTitleBarColor, manifestPath, }) {
     useVisualViewportOffset(disableViewportOffset);
     const supportedVirtualKeyboardBehavior = typeof navigator !== 'undefined' && 'virtualKeyboard' in navigator
         ? virtualKeyboardBehavior
         : 'displace';
     useVirtualKeyboardBehavior(supportedVirtualKeyboardBehavior);
     useThemedTitleBar('gray', 'wash', undefined, disableTitleBarColor);
-    const otherStuff = (_jsxs(_Fragment, { children: [_jsx(IconSpritesheet, {}), _jsx(Toaster, {})] }));
+    const otherStuff = (_jsxs(_Fragment, { children: [_jsx(IconSpritesheet, {}), _jsx(Toaster, {}), _jsx(PwaInstall, { manifestPath: manifestPath })] }));
     if (disableParticles)
         return (_jsx(ConfigContext.Provider, { value: { virtualKeyboardBehavior: supportedVirtualKeyboardBehavior }, children: _jsxs(TooltipProvider, { children: [children, otherStuff] }) }));
     return (_jsx(ConfigContext.Provider, { value: { virtualKeyboardBehavior: supportedVirtualKeyboardBehavior }, children: _jsx(TooltipProvider, { children: _jsxs(ParticleLayer, { children: [children, otherStuff] }) }) }));

package/dist/esm/components/provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/components/provider/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAa,UAAU,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,0BAA0B,EAAE,MAAM,2CAA2C,CAAC;AACvF,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAUtD;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,EACxB,QAAQ,EACR,gBAAgB,EAChB,qBAAqB,EACrB,uBAAuB,GAAG,UAAU,EACpC,oBAAoB,GACL;IACf,uBAAuB,CAAC,qBAAqB,CAAC,CAAC;IAC/C,MAAM,gCAAgC,GACrC,OAAO,SAAS,KAAK,WAAW,IAAI,iBAAiB,IAAI,SAAS;QACjE,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,UAAU,CAAC;IACf,0BAA0B,CAAC,gCAAgC,CAAC,CAAC;IAC7D,iBAAiB,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,CAClB,8BACC,KAAC,eAAe,KAAG,EACnB,KAAC,OAAO,KAAG,IACT,CACH,CAAC;IAEF,IAAI,gBAAgB;QACnB,OAAO,CACN,KAAC,aAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,MAAC,eAAe,eACd,QAAQ,EACR,UAAU,IACM,GACM,CACzB,CAAC;IAEH,OAAO,CACN,KAAC,aAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,KAAC,eAAe,cACf,MAAC,aAAa,eACZ,QAAQ,EACR,UAAU,IACI,GACC,GACM,CACzB,CAAC;AACH,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAEvC;IACF,uBAAuB,EAAE,UAAU;CACnC,CAAC,CAAC;AAEH,MAAM,UAAU,SAAS;IACxB,OAAO,UAAU,CAAC,aAAa,CAAC,CAAC;AAClC,CAAC"}
+{"version":3,"file":"Provider.js","sourceRoot":"","sources":["../../../../src/components/provider/Provider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAa,UAAU,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,0BAA0B,EAAE,MAAM,2CAA2C,CAAC;AACvF,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAWtD;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,EACxB,QAAQ,EACR,gBAAgB,EAChB,qBAAqB,EACrB,uBAAuB,GAAG,UAAU,EACpC,oBAAoB,EACpB,YAAY,GACG;IACf,uBAAuB,CAAC,qBAAqB,CAAC,CAAC;IAC/C,MAAM,gCAAgC,GACrC,OAAO,SAAS,KAAK,WAAW,IAAI,iBAAiB,IAAI,SAAS;QACjE,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,UAAU,CAAC;IACf,0BAA0B,CAAC,gCAAgC,CAAC,CAAC;IAC7D,iBAAiB,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,oBAAoB,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,CAClB,8BACC,KAAC,eAAe,KAAG,EACnB,KAAC,OAAO,KAAG,EACX,KAAC,UAAU,IAAC,YAAY,EAAE,YAAY,GAAI,IACxC,CACH,CAAC;IAEF,IAAI,gBAAgB;QACnB,OAAO,CACN,KAAC,aAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,MAAC,eAAe,eACd,QAAQ,EACR,UAAU,IACM,GACM,CACzB,CAAC;IAEH,OAAO,CACN,KAAC,aAAa,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,uBAAuB,EAAE,gCAAgC,EAAE,YAEpE,KAAC,eAAe,cACf,MAAC,aAAa,eACZ,QAAQ,EACR,UAAU,IACI,GACC,GACM,CACzB,CAAC;AACH,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAEvC;IACF,uBAAuB,EAAE,UAAU;CACnC,CAAC,CAAC;AAEH,MAAM,UAAU,SAAS;IACxB,OAAO,UAAU,CAAC,aAAa,CAAC,CAAC;AAClC,CAAC"}

package/dist/esm/components/pwaInstall/PwaInstall.d.ts

@@ -0,0 +1,5 @@
+import { DialogTriggerProps } from '@radix-ui/react-dialog';
+export interface PwaInstall extends DialogTriggerProps {
+    manifestPath?: string;
+}
+export declare function PwaInstall({ children, manifestPath, asChild: _, ...rest }: PwaInstall): import("react/jsx-runtime").JSX.Element | null;

package/dist/esm/components/pwaInstall/PwaInstall.js

@@ -0,0 +1,76 @@
+// @unocss-include
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useSnapshot } from 'valtio';
+import { getIsSafari, getOS, getSupportsPWAInstallPrompt, } from '../../platform.js';
+import { Box } from '../box/Box.js';
+import { Button } from '../button/Button.js';
+import { Dialog } from '../dialog/Dialog.js';
+import { Icon } from '../icon/Icon.js';
+import { Lightbox } from '../lightbox/Lightbox.js';
+import { Ol } from '../lists/lists.js';
+import { P } from '../typography/typography.js';
+import { AndroidAddToHomeIcon, SafariAddToDockIcon, SafariIcon, SafariPlusSquareIcon, SafariShareIcon, } from './PlatformIcons.js';
+import { pwaInstallerState } from './state.js';
+import { triggerDeferredInstall, useIsInstalled, useIsInstallReady, } from './useIsInstallReady.js';
+import { useWebManifest } from './useWebManifest.js';
+export function PwaInstall(_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var { children, manifestPath, asChild: _ } = _a, rest = __rest(_a, ["children", "manifestPath", "asChild"]);
+    const installed = useIsInstalled();
+    const manifest = useWebManifest(manifestPath);
+    const { open } = useSnapshot(pwaInstallerState);
+    const [showInstructions, setShowInstructions] = useState(false);
+    if (installed) {
+        return null;
+    }
+    const primaryIcon = (_b = manifest === null || manifest === void 0 ? void 0 : manifest.icons) === null || _b === void 0 ? void 0 : _b[0];
+    return (_jsx(Dialog, { open: open, onOpenChange: (isOpen) => {
+            pwaInstallerState.open = isOpen;
+        }, children: _jsxs(Dialog.Content, { className: "flex flex-col gap-xs", id: "pwa-install-dialog", children: [_jsxs(Dialog.Title, { className: "flex flex-row gap-md items-center", children: [primaryIcon && (_jsx("img", { src: primaryIcon.src, alt: (_e = (_d = (_c = primaryIcon.label) !== null && _c !== void 0 ? _c : manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _d !== void 0 ? _d : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _e !== void 0 ? _e : 'App Icon', className: "inline-block w-1em h-1em rounded" })), "Install ", (_g = (_f = manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _f !== void 0 ? _f : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _g !== void 0 ? _g : 'App'] }), showInstructions ? (_jsxs(_Fragment, { children: [_jsx(Dialog.Description, { children: "Follow the instructions below to install this app on your device." }), _jsx(InstallInstructions, {}), _jsxs(Dialog.Actions, { children: [_jsx(Dialog.Close, { asChild: true, children: _jsx(Button, { emphasis: "ghost", children: "Close" }) }), _jsxs(Button, { onClick: () => setShowInstructions(false), children: [_jsx(Icon, { name: "arrowLeft" }), " Back"] })] })] })) : (_jsxs(_Fragment, { children: [_jsx(Dialog.Description, { children: "This site is also an app. You can install it right now for easier access and more features." }), (manifest === null || manifest === void 0 ? void 0 : manifest.description) && (_jsx(P, { className: "mb-sm", children: manifest.description })), _jsx(ManifestImageGallery, { manifestPath: manifestPath }), _jsxs(Dialog.Actions, { children: [_jsx(Dialog.Close, { asChild: true, children: _jsx(Button, { emphasis: "ghost", children: "Close" }) }), _jsx(InstallDeviceActions, { showInstructions: () => setShowInstructions(true) })] })] }))] }) }));
+}
+const supportsDirectInstall = getSupportsPWAInstallPrompt();
+function InstallInstructions() {
+    const os = getOS();
+    if (os === 'iOS' || os === 'Mac OS') {
+        if (getIsSafari()) {
+            if (os === 'iOS') {
+                return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(SafariPlusSquareIcon, {}), " Scroll down and tap \"Add to Home Screen\"."] })] }));
+            }
+            else {
+                return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(SafariAddToDockIcon, {}), " Tap \"Add to Dock\"."] })] }));
+            }
+        }
+        else {
+            return (_jsxs(_Fragment, { children: [_jsx(Ol, { children: _jsxs(Ol.Item, { children: [_jsx(SafariIcon, {}), " Open this site in Safari to continue."] }) }), _jsx(Box, { surface: true, p: true, children: "Apple does not allow non-Safari browsers to install web apps." })] }));
+        }
+    }
+    return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(Icon, { name: "dots", className: "rotate-90" }), " Tap the menu button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(AndroidAddToHomeIcon, {}), " Tap \"Add to Home Screen.\""] })] }));
+}
+function ManifestImageGallery({ manifestPath }) {
+    var _a, _b;
+    const manifest = useWebManifest(manifestPath);
+    if (!((_a = manifest === null || manifest === void 0 ? void 0 : manifest.screenshots) === null || _a === void 0 ? void 0 : _a.length)) {
+        return null;
+    }
+    return (_jsx(Box, { overflow: "auto-x", p: "sm", gap: true, className: "h-240px", children: (_b = manifest.screenshots) === null || _b === void 0 ? void 0 : _b.map((screenshot, index) => (_jsxs(Lightbox.Root, { children: [_jsx(Lightbox.Trigger, { asChild: true, children: _jsx(Lightbox.Image, { tabIndex: 0, src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}`, className: "border border-default rounded-xs" }, index) }), _jsxs(Lightbox.Portal, { children: [_jsx(Lightbox.Overlay, { className: "z-10000" }), _jsx(Lightbox.Content, { className: "z-10001", children: _jsx(Lightbox.Image, { src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}` }) })] })] }, screenshot.src))) }));
+}
+function InstallDeviceActions({ showInstructions, }) {
+    const ready = useIsInstallReady();
+    if (supportsDirectInstall && ready) {
+        return (_jsxs(Button, { onClick: () => triggerDeferredInstall(), emphasis: "primary", children: [_jsx(Icon, { name: "download" }), " Install now"] }));
+    }
+    return (_jsxs(Button, { onClick: () => showInstructions(), emphasis: "primary", children: [_jsx(Icon, { name: "arrowRight" }), " Add to Home"] }));
+}
+//# sourceMappingURL=PwaInstall.js.map

package/dist/esm/components/pwaInstall/PwaInstall.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PwaInstall.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstall.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/pwaInstall/PwaInstallTrigger.d.ts

@@ -1,5 +1,4 @@
-import { DialogTriggerProps } from '@radix-ui/react-dialog';
-export interface PwaInstallTriggerProps extends DialogTriggerProps {
-    manifestPath?: string;
+import { ButtonProps } from '../button/Button.js';
+export interface PwaInstallTriggerProps extends ButtonProps {
 }
-export declare function PwaInstallTrigger({ children, manifestPath, asChild: _, ...rest }: PwaInstallTriggerProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function PwaInstallTrigger({ children, ...rest }: PwaInstallTriggerProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/esm/components/pwaInstall/PwaInstallTrigger.js

@@ -10,62 +10,19 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from 'react';
-import { getIsSafari, getOS, getSupportsPWAInstallPrompt, } from '../../platform.js';
-import { Box } from '../box/Box.js';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from '../button/Button.js';
-import { Dialog } from '../dialog/Dialog.js';
 import { Icon } from '../icon/Icon.js';
-import { Lightbox } from '../lightbox/Lightbox.js';
-import { Ol } from '../lists/lists.js';
-import { P } from '../typography/typography.js';
-import { AndroidAddToHomeIcon, SafariAddToDockIcon, SafariIcon, SafariPlusSquareIcon, SafariShareIcon, } from './PlatformIcons.js';
-import { triggerDeferredInstall, useIsInstalled, useIsInstallReady, } from './useIsInstallReady.js';
-import { useWebManifest } from './useWebManifest.js';
+import { pwaInstallerState } from './state.js';
+import { useIsInstalled } from './useIsInstallReady.js';
 export function PwaInstallTrigger(_a) {
-    var _b, _c, _d, _e, _f, _g;
-    var { children, manifestPath, asChild: _ } = _a, rest = __rest(_a, ["children", "manifestPath", "asChild"]);
+    var { children } = _a, rest = __rest(_a, ["children"]);
     const installed = useIsInstalled();
-    const manifest = useWebManifest(manifestPath);
-    const [showInstructions, setShowInstructions] = useState(false);
     if (installed) {
         return null;
     }
-    const primaryIcon = (_b = manifest === null || manifest === void 0 ? void 0 : manifest.icons) === null || _b === void 0 ? void 0 : _b[0];
-    return (_jsxs(Dialog, { children: [_jsx(Dialog.Trigger, Object.assign({}, rest, { asChild: true, children: children !== null && children !== void 0 ? children : (_jsxs(Button, { color: "primary", emphasis: "light", children: [_jsx(Icon, { name: "star" }), " Install"] })) })), _jsxs(Dialog.Content, { className: "flex flex-col gap-xs", children: [_jsxs(Dialog.Title, { className: "flex flex-row gap-md items-center", children: [primaryIcon && (_jsx("img", { src: primaryIcon.src, alt: (_e = (_d = (_c = primaryIcon.label) !== null && _c !== void 0 ? _c : manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _d !== void 0 ? _d : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _e !== void 0 ? _e : 'App Icon', className: "inline-block w-1em h-1em rounded" })), "Install ", (_g = (_f = manifest === null || manifest === void 0 ? void 0 : manifest.short_name) !== null && _f !== void 0 ? _f : manifest === null || manifest === void 0 ? void 0 : manifest.name) !== null && _g !== void 0 ? _g : 'App'] }), showInstructions ? (_jsxs(_Fragment, { children: [_jsx(Dialog.Description, { children: "Follow the instructions below to install this app on your device." }), _jsx(InstallInstructions, {}), _jsxs(Dialog.Actions, { children: [_jsx(Dialog.Close, { asChild: true, children: _jsx(Button, { emphasis: "ghost", children: "Close" }) }), _jsxs(Button, { onClick: () => setShowInstructions(false), children: [_jsx(Icon, { name: "arrowLeft" }), " Back"] })] })] })) : (_jsxs(_Fragment, { children: [_jsx(Dialog.Description, { children: "This site is also an app. You can install it right now for easier access and more features." }), (manifest === null || manifest === void 0 ? void 0 : manifest.description) && (_jsx(P, { className: "mb-sm", children: manifest.description })), _jsx(ManifestImageGallery, { manifestPath: manifestPath }), _jsxs(Dialog.Actions, { children: [_jsx(Dialog.Close, { asChild: true, children: _jsx(Button, { emphasis: "ghost", children: "Close" }) }), _jsx(InstallDeviceActions, { showInstructions: () => setShowInstructions(true) })] })] }))] })] }));
-}
-const supportsDirectInstall = getSupportsPWAInstallPrompt();
-function InstallInstructions() {
-    const os = getOS();
-    if (os === 'iOS' || os === 'Mac OS') {
-        if (getIsSafari()) {
-            if (os === 'iOS') {
-                return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(SafariPlusSquareIcon, {}), " Scroll down and tap \"Add to Home Screen\"."] })] }));
-            }
-            else {
-                return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(SafariShareIcon, {}), " Tap the Share button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(SafariAddToDockIcon, {}), " Tap \"Add to Dock\"."] })] }));
-            }
-        }
-        else {
-            return (_jsxs(_Fragment, { children: [_jsx(Ol, { children: _jsxs(Ol.Item, { children: [_jsx(SafariIcon, {}), " Open this site in Safari to continue."] }) }), _jsx(Box, { surface: true, p: true, children: "Apple does not allow non-Safari browsers to install web apps." })] }));
-        }
-    }
-    return (_jsxs(Ol, { children: [_jsxs(Ol.Item, { children: [_jsx(Icon, { name: "dots", className: "rotate-90" }), " Tap the menu button in the toolbar."] }), _jsxs(Ol.Item, { children: [_jsx(AndroidAddToHomeIcon, {}), " Tap \"Add to Home Screen.\""] })] }));
-}
-function ManifestImageGallery({ manifestPath }) {
-    var _a, _b;
-    const manifest = useWebManifest(manifestPath);
-    if (!((_a = manifest === null || manifest === void 0 ? void 0 : manifest.screenshots) === null || _a === void 0 ? void 0 : _a.length)) {
-        return null;
-    }
-    return (_jsx(Box, { overflow: "auto-x", p: "sm", gap: true, className: "h-240px", children: (_b = manifest.screenshots) === null || _b === void 0 ? void 0 : _b.map((screenshot, index) => (_jsxs(Lightbox.Root, { children: [_jsx(Lightbox.Trigger, { asChild: true, children: _jsx(Lightbox.Image, { tabIndex: 0, src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}`, className: "border border-default rounded-xs" }, index) }), _jsxs(Lightbox.Portal, { children: [_jsx(Lightbox.Overlay, { className: "z-10000" }), _jsx(Lightbox.Content, { className: "z-10001", children: _jsx(Lightbox.Image, { src: screenshot.src, alt: screenshot.label || `Screenshot ${index + 1}` }) })] })] }, screenshot.src))) }));
-}
-function InstallDeviceActions({ showInstructions, }) {
-    const ready = useIsInstallReady();
-    if (supportsDirectInstall && ready) {
-        return (_jsxs(Button, { onClick: () => triggerDeferredInstall(), emphasis: "primary", children: [_jsx(Icon, { name: "download" }), " Install now"] }));
-    }
-    return (_jsxs(Button, { onClick: () => showInstructions(), emphasis: "primary", children: [_jsx(Icon, { name: "arrowRight" }), " Add to Home"] }));
+    return (_jsx(Button, Object.assign({ color: "primary", emphasis: "light" }, rest, { onClick: () => {
+            pwaInstallerState.open = true;
+        }, children: children !== null && children !== void 0 ? children : (_jsxs(_Fragment, { children: [_jsx(Icon, { name: "star" }), " Install"] })) })));
 }
 //# sourceMappingURL=PwaInstallTrigger.js.map

package/dist/esm/components/pwaInstall/PwaInstallTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"PwaInstallTrigger.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstallTrigger.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PwaInstallTrigger.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/PwaInstallTrigger.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAIxD,MAAM,UAAU,iBAAiB,CAAC,EAGT;QAHS,EACjC,QAAQ,OAEgB,EADrB,IAAI,cAF0B,YAGjC,CADO;IAEP,MAAM,SAAS,GAAG,cAAc,EAAE,CAAC;IACnC,IAAI,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,CACN,KAAC,MAAM,kBACN,KAAK,EAAC,SAAS,EACf,QAAQ,EAAC,OAAO,IACZ,IAAI,IACR,OAAO,EAAE,GAAG,EAAE;YACb,iBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;QAC/B,CAAC,YAEA,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CACZ,8BACC,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,gBAClB,CACH,IACO,CACT,CAAC;AACH,CAAC"}

package/dist/esm/components/pwaInstall/index.d.ts

@@ -1,3 +1,4 @@
 export * from './PwaInstallTrigger.js';
+export * from './state.js';
 export * from './useIsInstallReady.js';
 export * from './useWebManifest.js';

package/dist/esm/components/pwaInstall/index.js

@@ -1,5 +1,6 @@
 // @unocss-include
 export * from './PwaInstallTrigger.js';
+export * from './state.js';
 export * from './useIsInstallReady.js';
 export * from './useWebManifest.js';
 //# sourceMappingURL=index.js.map

package/dist/esm/components/pwaInstall/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,YAAY,CAAC;AAC3B,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC"}

package/dist/esm/components/pwaInstall/state.d.ts

@@ -0,0 +1,4 @@
+export declare const pwaInstallerState: {
+    open: boolean;
+};
+export declare function showPwaInstall(): void;

package/dist/esm/components/pwaInstall/state.js

@@ -0,0 +1,9 @@
+// @unocss-include
+import { proxy } from 'valtio';
+export const pwaInstallerState = proxy({
+    open: false,
+});
+export function showPwaInstall() {
+    pwaInstallerState.open = true;
+}
+//# sourceMappingURL=state.js.map

package/dist/esm/components/pwaInstall/state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.js","sourceRoot":"","sources":["../../../../src/components/pwaInstall/state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAE/B,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC;IACtC,IAAI,EAAE,KAAK;CACX,CAAC,CAAC;AAEH,MAAM,UAAU,cAAc;IAC7B,iBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;AAC/B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a-type/ui",
-  "version": "3.0.36",
+  "version": "3.0.37",
   "type": "module",
   "repository": {
     "url": "https://github.com/a-type/ui"

package/src/components/provider/Provider.tsx

@@ -3,6 +3,7 @@ import { useThemedTitleBar, useVisualViewportOffset } from '../../hooks.js';
 import { useVirtualKeyboardBehavior } from '../../hooks/useVirtualKeyboardBehavior.js';
 import { IconSpritesheet } from '../icon/index.js';
 import { ParticleLayer } from '../particles/index.js';
+import { PwaInstall } from '../pwaInstall/PwaInstall.js';
 import { Toaster } from '../toasts/toasts.js';
 import { TooltipProvider } from '../tooltip/index.js';
 
@@ -12,6 +13,7 @@ export interface ProviderProps {
 	disableViewportOffset?: boolean;
 	virtualKeyboardBehavior?: 'overlay' | 'displace';
 	disableTitleBarColor?: boolean;
+	manifestPath?: string;
 }
 
 /**
@@ -23,6 +25,7 @@ export function Provider({
 	disableViewportOffset,
 	virtualKeyboardBehavior = 'displace',
 	disableTitleBarColor,
+	manifestPath,
 }: ProviderProps) {
 	useVisualViewportOffset(disableViewportOffset);
 	const supportedVirtualKeyboardBehavior =
@@ -35,6 +38,7 @@ export function Provider({
 		<>
 			<IconSpritesheet />
 			<Toaster />
+			<PwaInstall manifestPath={manifestPath} />
 		</>
 	);
 

package/src/components/pwaInstall/PwaInstall.tsx

@@ -0,0 +1,228 @@
+import { DialogTriggerProps } from '@radix-ui/react-dialog';
+import { useState } from 'react';
+import { useSnapshot } from 'valtio';
+import {
+	getIsSafari,
+	getOS,
+	getSupportsPWAInstallPrompt,
+} from '../../platform.js';
+import { Box } from '../box/Box.js';
+import { Button } from '../button/Button.js';
+import { Dialog } from '../dialog/Dialog.js';
+import { Icon } from '../icon/Icon.js';
+import { Lightbox } from '../lightbox/Lightbox.js';
+import { Ol } from '../lists/lists.js';
+import { P } from '../typography/typography.js';
+import {
+	AndroidAddToHomeIcon,
+	SafariAddToDockIcon,
+	SafariIcon,
+	SafariPlusSquareIcon,
+	SafariShareIcon,
+} from './PlatformIcons.js';
+import { pwaInstallerState } from './state.js';
+import {
+	triggerDeferredInstall,
+	useIsInstalled,
+	useIsInstallReady,
+} from './useIsInstallReady.js';
+import { useWebManifest } from './useWebManifest.js';
+
+export interface PwaInstall extends DialogTriggerProps {
+	manifestPath?: string;
+}
+
+export function PwaInstall({
+	children,
+	manifestPath,
+	asChild: _,
+	...rest
+}: PwaInstall) {
+	const installed = useIsInstalled();
+	const manifest = useWebManifest(manifestPath);
+	const { open } = useSnapshot(pwaInstallerState);
+
+	const [showInstructions, setShowInstructions] = useState(false);
+
+	if (installed) {
+		return null;
+	}
+
+	const primaryIcon = manifest?.icons?.[0];
+
+	return (
+		<Dialog
+			open={open}
+			onOpenChange={(isOpen) => {
+				pwaInstallerState.open = isOpen;
+			}}
+		>
+			<Dialog.Content className="flex flex-col gap-xs" id="pwa-install-dialog">
+				<Dialog.Title className="flex flex-row gap-md items-center">
+					{primaryIcon && (
+						<img
+							src={primaryIcon.src}
+							alt={
+								primaryIcon.label ??
+								manifest?.short_name ??
+								manifest?.name ??
+								'App Icon'
+							}
+							className="inline-block w-1em h-1em rounded"
+						/>
+					)}
+					Install {manifest?.short_name ?? manifest?.name ?? 'App'}
+				</Dialog.Title>
+				{showInstructions ? (
+					<>
+						<Dialog.Description>
+							Follow the instructions below to install this app on your device.
+						</Dialog.Description>
+						<InstallInstructions />
+						<Dialog.Actions>
+							<Dialog.Close asChild>
+								<Button emphasis="ghost">Close</Button>
+							</Dialog.Close>
+							<Button onClick={() => setShowInstructions(false)}>
+								<Icon name="arrowLeft" /> Back
+							</Button>
+						</Dialog.Actions>
+					</>
+				) : (
+					<>
+						<Dialog.Description>
+							This site is also an app. You can install it right now for easier
+							access and more features.
+						</Dialog.Description>
+						{manifest?.description && (
+							<P className="mb-sm">{manifest.description}</P>
+						)}
+						<ManifestImageGallery manifestPath={manifestPath} />
+						<Dialog.Actions>
+							<Dialog.Close asChild>
+								<Button emphasis="ghost">Close</Button>
+							</Dialog.Close>
+							<InstallDeviceActions
+								showInstructions={() => setShowInstructions(true)}
+							/>
+						</Dialog.Actions>
+					</>
+				)}
+			</Dialog.Content>
+		</Dialog>
+	);
+}
+
+const supportsDirectInstall = getSupportsPWAInstallPrompt();
+
+function InstallInstructions() {
+	const os = getOS();
+	if (os === 'iOS' || os === 'Mac OS') {
+		if (getIsSafari()) {
+			if (os === 'iOS') {
+				return (
+					<Ol>
+						<Ol.Item>
+							<SafariShareIcon /> Tap the Share button in the toolbar.
+						</Ol.Item>
+						<Ol.Item>
+							<SafariPlusSquareIcon /> Scroll down and tap "Add to Home Screen".
+						</Ol.Item>
+					</Ol>
+				);
+			} else {
+				return (
+					<Ol>
+						<Ol.Item>
+							<SafariShareIcon /> Tap the Share button in the toolbar.
+						</Ol.Item>
+						<Ol.Item>
+							<SafariAddToDockIcon /> Tap "Add to Dock".
+						</Ol.Item>
+					</Ol>
+				);
+			}
+		} else {
+			return (
+				<>
+					<Ol>
+						<Ol.Item>
+							<SafariIcon /> Open this site in Safari to continue.
+						</Ol.Item>
+					</Ol>
+					<Box surface p>
+						Apple does not allow non-Safari browsers to install web apps.
+					</Box>
+				</>
+			);
+		}
+	}
+
+	return (
+		<Ol>
+			<Ol.Item>
+				<Icon name="dots" className="rotate-90" /> Tap the menu button in the
+				toolbar.
+			</Ol.Item>
+			<Ol.Item>
+				<AndroidAddToHomeIcon /> Tap "Add to Home Screen."
+			</Ol.Item>
+		</Ol>
+	);
+}
+
+function ManifestImageGallery({ manifestPath }: { manifestPath?: string }) {
+	const manifest = useWebManifest(manifestPath);
+
+	if (!manifest?.screenshots?.length) {
+		return null;
+	}
+
+	return (
+		<Box overflow="auto-x" p="sm" gap className="h-240px">
+			{manifest.screenshots?.map((screenshot, index) => (
+				<Lightbox.Root key={screenshot.src}>
+					<Lightbox.Trigger asChild>
+						<Lightbox.Image
+							tabIndex={0}
+							key={index}
+							src={screenshot.src}
+							alt={screenshot.label || `Screenshot ${index + 1}`}
+							className="border border-default rounded-xs"
+						/>
+					</Lightbox.Trigger>
+					<Lightbox.Portal>
+						<Lightbox.Overlay className="z-10000" />
+						<Lightbox.Content className="z-10001">
+							<Lightbox.Image
+								src={screenshot.src}
+								alt={screenshot.label || `Screenshot ${index + 1}`}
+							/>
+						</Lightbox.Content>
+					</Lightbox.Portal>
+				</Lightbox.Root>
+			))}
+		</Box>
+	);
+}
+
+function InstallDeviceActions({
+	showInstructions,
+}: {
+	showInstructions: () => void;
+}) {
+	const ready = useIsInstallReady();
+	if (supportsDirectInstall && ready) {
+		return (
+			<Button onClick={() => triggerDeferredInstall()} emphasis="primary">
+				<Icon name="download" /> Install now
+			</Button>
+		);
+	}
+
+	return (
+		<Button onClick={() => showInstructions()} emphasis="primary">
+			<Icon name="arrowRight" /> Add to Home
+		</Button>
+	);
+}

package/src/components/pwaInstall/PwaInstallTrigger.tsx

@@ -1,227 +1,33 @@
-import { DialogTriggerProps } from '@radix-ui/react-dialog';
-import { useState } from 'react';
-import {
-	getIsSafari,
-	getOS,
-	getSupportsPWAInstallPrompt,
-} from '../../platform.js';
-import { Box } from '../box/Box.js';
-import { Button } from '../button/Button.js';
-import { Dialog } from '../dialog/Dialog.js';
+import { Button, ButtonProps } from '../button/Button.js';
 import { Icon } from '../icon/Icon.js';
-import { Lightbox } from '../lightbox/Lightbox.js';
-import { Ol } from '../lists/lists.js';
-import { P } from '../typography/typography.js';
-import {
-	AndroidAddToHomeIcon,
-	SafariAddToDockIcon,
-	SafariIcon,
-	SafariPlusSquareIcon,
-	SafariShareIcon,
-} from './PlatformIcons.js';
-import {
-	triggerDeferredInstall,
-	useIsInstalled,
-	useIsInstallReady,
-} from './useIsInstallReady.js';
-import { useWebManifest } from './useWebManifest.js';
+import { pwaInstallerState } from './state.js';
+import { useIsInstalled } from './useIsInstallReady.js';
 
-export interface PwaInstallTriggerProps extends DialogTriggerProps {
-	manifestPath?: string;
-}
+export interface PwaInstallTriggerProps extends ButtonProps {}
 
 export function PwaInstallTrigger({
 	children,
-	manifestPath,
-	asChild: _,
 	...rest
 }: PwaInstallTriggerProps) {
 	const installed = useIsInstalled();
-	const manifest = useWebManifest(manifestPath);
-
-	const [showInstructions, setShowInstructions] = useState(false);
-
 	if (installed) {
 		return null;
 	}
 
-	const primaryIcon = manifest?.icons?.[0];
-
 	return (
-		<Dialog>
-			<Dialog.Trigger {...rest} asChild>
-				{children ?? (
-					<Button color="primary" emphasis="light">
-						<Icon name="star" /> Install
-					</Button>
-				)}
-			</Dialog.Trigger>
-			<Dialog.Content className="flex flex-col gap-xs">
-				<Dialog.Title className="flex flex-row gap-md items-center">
-					{primaryIcon && (
-						<img
-							src={primaryIcon.src}
-							alt={
-								primaryIcon.label ??
-								manifest?.short_name ??
-								manifest?.name ??
-								'App Icon'
-							}
-							className="inline-block w-1em h-1em rounded"
-						/>
-					)}
-					Install {manifest?.short_name ?? manifest?.name ?? 'App'}
-				</Dialog.Title>
-				{showInstructions ? (
-					<>
-						<Dialog.Description>
-							Follow the instructions below to install this app on your device.
-						</Dialog.Description>
-						<InstallInstructions />
-						<Dialog.Actions>
-							<Dialog.Close asChild>
-								<Button emphasis="ghost">Close</Button>
-							</Dialog.Close>
-							<Button onClick={() => setShowInstructions(false)}>
-								<Icon name="arrowLeft" /> Back
-							</Button>
-						</Dialog.Actions>
-					</>
-				) : (
-					<>
-						<Dialog.Description>
-							This site is also an app. You can install it right now for easier
-							access and more features.
-						</Dialog.Description>
-						{manifest?.description && (
-							<P className="mb-sm">{manifest.description}</P>
-						)}
-						<ManifestImageGallery manifestPath={manifestPath} />
-						<Dialog.Actions>
-							<Dialog.Close asChild>
-								<Button emphasis="ghost">Close</Button>
-							</Dialog.Close>
-							<InstallDeviceActions
-								showInstructions={() => setShowInstructions(true)}
-							/>
-						</Dialog.Actions>
-					</>
-				)}
-			</Dialog.Content>
-		</Dialog>
-	);
-}
-
-const supportsDirectInstall = getSupportsPWAInstallPrompt();
-
-function InstallInstructions() {
-	const os = getOS();
-	if (os === 'iOS' || os === 'Mac OS') {
-		if (getIsSafari()) {
-			if (os === 'iOS') {
-				return (
-					<Ol>
-						<Ol.Item>
-							<SafariShareIcon /> Tap the Share button in the toolbar.
-						</Ol.Item>
-						<Ol.Item>
-							<SafariPlusSquareIcon /> Scroll down and tap "Add to Home Screen".
-						</Ol.Item>
-					</Ol>
-				);
-			} else {
-				return (
-					<Ol>
-						<Ol.Item>
-							<SafariShareIcon /> Tap the Share button in the toolbar.
-						</Ol.Item>
-						<Ol.Item>
-							<SafariAddToDockIcon /> Tap "Add to Dock".
-						</Ol.Item>
-					</Ol>
-				);
-			}
-		} else {
-			return (
+		<Button
+			color="primary"
+			emphasis="light"
+			{...rest}
+			onClick={() => {
+				pwaInstallerState.open = true;
+			}}
+		>
+			{children ?? (
 				<>
-					<Ol>
-						<Ol.Item>
-							<SafariIcon /> Open this site in Safari to continue.
-						</Ol.Item>
-					</Ol>
-					<Box surface p>
-						Apple does not allow non-Safari browsers to install web apps.
-					</Box>
+					<Icon name="star" /> Install
 				</>
-			);
-		}
-	}
-
-	return (
-		<Ol>
-			<Ol.Item>
-				<Icon name="dots" className="rotate-90" /> Tap the menu button in the
-				toolbar.
-			</Ol.Item>
-			<Ol.Item>
-				<AndroidAddToHomeIcon /> Tap "Add to Home Screen."
-			</Ol.Item>
-		</Ol>
-	);
-}
-
-function ManifestImageGallery({ manifestPath }: { manifestPath?: string }) {
-	const manifest = useWebManifest(manifestPath);
-
-	if (!manifest?.screenshots?.length) {
-		return null;
-	}
-
-	return (
-		<Box overflow="auto-x" p="sm" gap className="h-240px">
-			{manifest.screenshots?.map((screenshot, index) => (
-				<Lightbox.Root key={screenshot.src}>
-					<Lightbox.Trigger asChild>
-						<Lightbox.Image
-							tabIndex={0}
-							key={index}
-							src={screenshot.src}
-							alt={screenshot.label || `Screenshot ${index + 1}`}
-							className="border border-default rounded-xs"
-						/>
-					</Lightbox.Trigger>
-					<Lightbox.Portal>
-						<Lightbox.Overlay className="z-10000" />
-						<Lightbox.Content className="z-10001">
-							<Lightbox.Image
-								src={screenshot.src}
-								alt={screenshot.label || `Screenshot ${index + 1}`}
-							/>
-						</Lightbox.Content>
-					</Lightbox.Portal>
-				</Lightbox.Root>
-			))}
-		</Box>
-	);
-}
-
-function InstallDeviceActions({
-	showInstructions,
-}: {
-	showInstructions: () => void;
-}) {
-	const ready = useIsInstallReady();
-	if (supportsDirectInstall && ready) {
-		return (
-			<Button onClick={() => triggerDeferredInstall()} emphasis="primary">
-				<Icon name="download" /> Install now
-			</Button>
-		);
-	}
-
-	return (
-		<Button onClick={() => showInstructions()} emphasis="primary">
-			<Icon name="arrowRight" /> Add to Home
+			)}
 		</Button>
 	);
 }

package/src/components/pwaInstall/index.ts

@@ -1,3 +1,4 @@
 export * from './PwaInstallTrigger.js';
+export * from './state.js';
 export * from './useIsInstallReady.js';
 export * from './useWebManifest.js';

package/src/components/pwaInstall/state.ts

@@ -0,0 +1,9 @@
+import { proxy } from 'valtio';
+
+export const pwaInstallerState = proxy({
+	open: false,
+});
+
+export function showPwaInstall() {
+	pwaInstallerState.open = true;
+}