@nascentdigital/funnel-editor 4.4.18

package/dist/core/splash/SplashContext.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SplashContext = void 0;
+const react_1 = require("react");
+// context
+exports.SplashContext = (0, react_1.createContext)({});

package/dist/core/splash/SplashService.d.ts

@@ -0,0 +1,42 @@
+import { Callback, Duration, EventBus } from '@nascentdigital/funnel-core';
+import { Observable } from 'rxjs';
+export declare class SplashService {
+    private readonly _eventBus;
+    private _state?;
+    private _stateCompletion?;
+    private _visible;
+    constructor();
+    get events$(): Observable<SplashService.Event>;
+    get state(): Readonly<SplashService.State> | undefined;
+    private set state(value);
+    get visible(): boolean;
+    set visible(visible: boolean);
+    get active(): boolean;
+    onActivated(delay?: Duration): void;
+    showLoading(message: string): void;
+    showError({ message, onRetry }: Omit<SplashService.State.Error, 'type'>): void;
+    dismiss(): void;
+    private raiseEvent;
+}
+export declare namespace SplashService {
+    type State = State.Loading | State.Error;
+    namespace State {
+        type Loading = {
+            type: 'loading';
+            message: string;
+        };
+        type Error = {
+            type: 'error';
+            message: string;
+            onRetry?: Callback.Void;
+        };
+    }
+    interface Event extends EventBus.Event<'SplashService', Event.Type> {
+        service: SplashService;
+    }
+    namespace Event {
+        type Type = 'changed';
+        function filter(event: EventBus.Event): event is Event;
+        function create(event: EventBus.Args<Event>): Event;
+    }
+}

package/dist/core/splash/SplashService.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SplashService = void 0;
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+const rxjs_1 = require("rxjs");
+// class
+class SplashService {
+    constructor() {
+        // initialize instance variables
+        this._eventBus = new funnel_core_1.EventBus();
+        this._visible = false;
+    }
+    get events$() {
+        return this._eventBus.events$;
+    }
+    get state() {
+        return this._state;
+    }
+    set state(state) {
+        // helper
+        const setState = () => {
+            // update state
+            this._state = state;
+            this._stateCompletion = state
+                ? new funnel_core_1.Deferral()
+                : undefined;
+            // raise change
+            this.raiseEvent('changed');
+        };
+        // start after completion
+        const completion = this._stateCompletion;
+        if (completion && !completion.isComplete) {
+            completion.promise.then(() => setState());
+        }
+        // or start now
+        else {
+            setState();
+        }
+    }
+    get visible() {
+        return this._visible;
+    }
+    set visible(visible) {
+        // ignore if unchanged
+        if (this._visible === visible) {
+            return;
+        }
+        // update
+        this._visible = visible;
+        // raise event
+        this.raiseEvent('changed');
+    }
+    get active() {
+        return this._state !== undefined;
+    }
+    onActivated(delay) {
+        const completion = this._stateCompletion;
+        if (completion && !completion.isComplete) {
+            // complete after delay
+            const delayInMs = delay
+                ? funnel_core_1.Duration.toMilliseconds(delay)
+                : 0;
+            if (delayInMs > 0) {
+                (0, rxjs_1.firstValueFrom)((0, rxjs_1.timer)(delayInMs))
+                    .then(() => completion.resolve());
+            }
+            // or complete immediately
+            else {
+                completion.resolve();
+            }
+        }
+    }
+    showLoading(message) {
+        this.state = {
+            type: 'loading',
+            message
+        };
+    }
+    showError({ message, onRetry }) {
+        this.state = {
+            type: 'error',
+            message,
+            onRetry
+        };
+    }
+    dismiss() {
+        this.state = undefined;
+    }
+    raiseEvent(type) {
+        this._eventBus.publish(SplashService.Event.create({ type, service: this }));
+    }
+}
+exports.SplashService = SplashService;
+// extension
+(function (SplashService) {
+    let Event;
+    (function (Event) {
+        // methods
+        function filter(event) {
+            return event.domain === 'SplashService';
+        }
+        Event.filter = filter;
+        function create(event) {
+            return funnel_core_1.EventBus.createEvent(Object.assign({ domain: 'SplashService' }, event));
+        }
+        Event.create = create;
+    })(Event = SplashService.Event || (SplashService.Event = {}));
+})(SplashService || (exports.SplashService = SplashService = {}));

package/dist/core/splash/index.d.ts

@@ -0,0 +1,2 @@
+export * from './SplashContainer';
+export * from './useSplash';

package/dist/core/splash/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SplashContainer"), exports);
+__exportStar(require("./useSplash"), exports);

package/dist/core/splash/useSplash.d.ts

@@ -0,0 +1,2 @@
+import { SplashService } from './SplashService';
+export declare function useSplash(): SplashService;

package/dist/core/splash/useSplash.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSplash = useSplash;
+const react_1 = require("react");
+const SplashContext_1 = require("./SplashContext");
+function useSplash() {
+    // resolve service
+    const { service } = (0, react_1.useContext)(SplashContext_1.SplashContext);
+    // and return it
+    return service;
+}

package/dist/dashboard/components/NavCard.d.ts

@@ -0,0 +1,14 @@
+import { Callback } from '@nascentdigital/funnel-core';
+import { Button } from '../../core';
+export declare function NavCard({ className, variant, title, caption, action, disabled, onClick }: NavCard.Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace NavCard {
+    type Props = {
+        className?: string;
+        variant?: Button.Variant;
+        title: string;
+        caption: string;
+        action: string;
+        disabled?: boolean;
+        onClick?: Callback.Void;
+    };
+}

package/dist/dashboard/components/NavCard.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavCard = NavCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+const classnames_1 = __importDefault(require("classnames"));
+const core_1 = require("../../core");
+// component
+function NavCard({ className, variant = 'primary', title, caption, action, disabled = false, onClick = funnel_core_1.Fn.NoOp }) {
+    // render
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(className, 'flex flex-col items-center gap-l6 bg-background p-l8', 'border border-solid border-border-l1 rounded-sm'), children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex-1 w-full", children: [(0, jsx_runtime_1.jsx)("h2", { className: "heading-md text-content-primary", children: title }), (0, jsx_runtime_1.jsx)("p", { className: "body-sm texts-content-secondary", children: caption })] }), (0, jsx_runtime_1.jsx)(core_1.Button, { variant: variant, disabled: disabled, onClick: onClick, children: action })] }));
+}

package/dist/dashboard/components/index.d.ts

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

package/dist/dashboard/components/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./NavCard"), exports);

package/dist/dashboard/index.d.ts

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

package/dist/dashboard/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./screens"), exports);

package/dist/dashboard/screens/Dashboard.d.ts

@@ -0,0 +1 @@
+export declare function Dashboard(): import("react/jsx-runtime").JSX.Element;

package/dist/dashboard/screens/Dashboard.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dashboard = Dashboard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("react");
+const core_1 = require("../../core");
+const components_1 = require("../components");
+// component
+function Dashboard() {
+    // bind hooks
+    const { user } = (0, core_1.useAuthenticator)();
+    const router = (0, core_1.useEditorRouter)();
+    const brand = funnel_core_1.AppConfig.brandConfig();
+    const splash = (0, core_1.useSplash)();
+    const { collections } = funnel_core_1.Schema.Site.current();
+    // dismiss splash
+    (0, react_1.useEffect)(() => {
+        splash.dismiss();
+    }, [splash]);
+    // render
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "w-dvw h-dvh flex flex-col bg-surface1", children: [(0, jsx_runtime_1.jsx)(core_1.Header, { breadcrumbs: [brand.name, 'Dashboard'], back: "none" }), (0, jsx_runtime_1.jsx)("div", { className: "relative flex-1", children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('w-full sm:w-4/5 md:w-3/5 max-h-full overflow-y-scroll p-l6', 'grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 grid-auto-rows auto-cols-fr auto-rows-fr gap-l6'), children: [(0, jsx_runtime_1.jsx)(components_1.NavCard, { title: "My Site's Pages", caption: "Your main website.", action: "Explore pages", onClick: () => router.navigateToTemplates({ region: brand.regionalization.fallback }) }), collections.length > 0 &&
+                            (0, jsx_runtime_1.jsx)(components_1.NavCard, { title: "Collections", caption: "Shared data used by site pages.", action: "Manage collections", onClick: () => router.navigateToCollections() }), (0, jsx_runtime_1.jsx)(components_1.NavCard, { title: "Publishing", caption: "View and manage groups of changes.", action: "Manage changes", onClick: () => router.navigateToChangeSets() }), (0, jsx_runtime_1.jsx)(components_1.NavCard, { title: "Media", caption: "Images, videos and other files.", action: "Manage media", disabled: true }), user.hasAny('user.create', 'user.update', 'user.delete') &&
+                            (0, jsx_runtime_1.jsx)(components_1.NavCard, { title: "Users", caption: "Control who has access to content.", action: "Manage Users", onClick: () => router.navigateToUsers() }), user.role.id === 'owner' &&
+                            (0, jsx_runtime_1.jsx)(components_1.NavCard, { variant: "destructive", title: "Developer", caption: "Access tools tomaintain the site.", action: "Developer Tools", onClick: () => router.navigateToDevtools() })] }) })] }));
+}

package/dist/dashboard/screens/index.d.ts

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

package/dist/dashboard/screens/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Dashboard"), exports);

package/dist/devtools/components/PlatformStatus.d.ts

@@ -0,0 +1,6 @@
+export declare function PlatformStatus({ className }: PlatformStatus.Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace PlatformStatus {
+    type Props = {
+        className?: string;
+    };
+}

package/dist/devtools/components/PlatformStatus.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PlatformStatus = PlatformStatus;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("motion/react");
+const core_1 = require("../../core");
+const status_1 = require("./status");
+// component
+function PlatformStatus({ className }) {
+    // render
+    return ((0, jsx_runtime_1.jsx)(core_1.FadeIn, { className: (0, classnames_1.default)(className, 'flex flex-col gap-l8 p-l8'), children: (0, jsx_runtime_1.jsx)(react_1.AnimatePresence, { children: (0, jsx_runtime_1.jsx)(status_1.Upgrader, {}) }) }));
+}

package/dist/devtools/components/index.d.ts

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

package/dist/devtools/components/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./PlatformStatus"), exports);

package/dist/devtools/components/status/Upgrader.d.ts

@@ -0,0 +1,6 @@
+export declare function Upgrader({ className }: Upgrader.Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace Upgrader {
+    type Props = {
+        className?: string;
+    };
+}

package/dist/devtools/components/status/Upgrader.js

@@ -0,0 +1,144 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Upgrader = Upgrader;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const funnel_cms_1 = require("@nascentdigital/funnel-cms");
+const client_1 = require("@nascentdigital/funnel-ui/client");
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("react");
+const core_1 = require("../../../core");
+// component
+function Upgrader({ className }) {
+    var _a;
+    // bind state + hooks
+    const [status, setStatus] = (0, react_1.useState)();
+    const [liveStatus, setLiveStatus] = (0, react_1.useState)();
+    const [refreshing, setRefreshing] = (0, react_1.useState)(false);
+    const editorApi = (0, core_1.useEditorApi)();
+    const counter = (0, client_1.useCounter)();
+    const dialog = (0, core_1.useDialog)();
+    // fetch status
+    (0, react_1.useEffect)(() => {
+        // mark as refreshing
+        setRefreshing(true);
+        // fetch status on mount
+        let cancelled = false;
+        editorApi.getUpgradeStatus()
+            // set status if not cancelled
+            .then(async (status) => {
+            if (!cancelled) {
+                setStatus(status);
+                setLiveStatus(undefined);
+            }
+        })
+            // TODO: handle error
+            .catch(e => console.error(e))
+            .finally(() => setRefreshing(false));
+        // cancel on unmount
+        return () => {
+            cancelled = true;
+        };
+    }, [editorApi, counter.count]);
+    // helpers
+    const onSync = () => counter.up();
+    const onUpgrade = async (version) => {
+        // confirm (or cancel)
+        const confirmed = await dialog.confirm({
+            title: 'Upgrade CMS',
+            message: ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-l3", children: [(0, jsx_runtime_1.jsx)("p", { children: "Are you sure you want to upgrade now?" }), (0, jsx_runtime_1.jsx)("p", { children: "Make sure that you keep this window open and do not refresh the browser." })] })),
+            confirmationCode: 'upgrade'
+        });
+        if (!confirmed) {
+            return;
+        }
+        // try to upgrade
+        try {
+            console.debug(`[Upgrader] starting upgrade to v${version}`);
+            // mark as upgrading
+            setLiveStatus({ id: funnel_cms_1.Upgrade.Status.Id.unknown, status: 'upgrading', active: version });
+            console.debug(`[Upgrader] executing upgrade`);
+            // start upgrade
+            const newStatus = await editorApi.executeUpgrade();
+            console.debug(`[Upgrader] upgrade complete`);
+            // finalize upgrade status
+            setStatus(newStatus);
+            setLiveStatus(undefined);
+        }
+        catch (e) {
+            console.error('[Upgrader] upgrade failed', e);
+            // sync to fetch error
+            onSync();
+        }
+    };
+    // render
+    return ((0, jsx_runtime_1.jsxs)("section", { className: (0, classnames_1.default)(className, 'flex flex-col gap-l6 p-l6 rounded-sm bg-background'), children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "label-sm", children: "Upgrader" }), (0, jsx_runtime_1.jsxs)("p", { className: "body-xs", children: ["Current version: ", (0, jsx_runtime_1.jsx)("span", { className: "font-bold", children: status ? ((_a = status.current) !== null && _a !== void 0 ? _a : 'beta') : 'unknown' })] })] }), (0, jsx_runtime_1.jsx)("hr", { className: "divider border-border-l1" }), renderStatus({ status, liveStatus, refreshing, onUpgrade, onSync })] }, "upgrader"));
+}
+function renderStatus(args) {
+    // show loader if still waiting
+    const { status, liveStatus } = args;
+    if (status === undefined) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "flex justify-center items-center", children: (0, jsx_runtime_1.jsx)(core_1.Loader, {}) }));
+    }
+    // or show error if it failed
+    else if (!status) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "body-sm text-error", children: "Failed to fetch status!" }));
+    }
+    // otherwise, handle based on status type
+    else {
+        const activeStatus = liveStatus !== null && liveStatus !== void 0 ? liveStatus : status;
+        switch (activeStatus.status) {
+            case 'pending':
+                return renderPending(args, activeStatus);
+            case 'upgrading':
+                return renderUpgrading(args, activeStatus);
+            case 'failed':
+                return renderFailed(args, activeStatus);
+            case 'up-to-date':
+                return renderUpToDate(args, activeStatus);
+        }
+    }
+}
+function renderPending({ refreshing, onUpgrade, onSync }, status) {
+    // bind props
+    const { available, dbReady } = status;
+    const [version] = available;
+    // render
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-l5", children: [(0, jsx_runtime_1.jsx)("span", { className: "body-sm", children: "New version available!" }), renderUpgradePrompt({
+                version,
+                dbReady,
+                prompt: refreshing ? 'Upgrading...' : `Upgrade to v${version}`,
+                refreshing,
+                onUpgrade,
+                onSync
+            })] }));
+}
+function renderUpgrading(args, status) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-l5 body-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-l3", children: [(0, jsx_runtime_1.jsx)(core_1.Loader, { size: "sm" }), (0, jsx_runtime_1.jsxs)("span", { children: ["Upgrading to v", status.active] })] }), (0, jsx_runtime_1.jsx)("div", { children: "Please keep this browser window open and don't navigate to anywhere else." })] }));
+}
+function renderFailed({ refreshing, onUpgrade, onSync }, status) {
+    const { failed: version, dbReady } = status;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-l5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-l3", children: [(0, jsx_runtime_1.jsx)(core_1.Icon, { className: "text-destructive", variant: "CircleAlert" }), (0, jsx_runtime_1.jsxs)("span", { className: "body-sm", children: ["Upgrade of v", status.failed, " failed"] })] }), renderUpgradePrompt({
+                version,
+                dbReady,
+                prompt: refreshing ? 'Retrying...' : 'Retry upgrade',
+                refreshing,
+                onUpgrade,
+                onSync
+            })] }));
+}
+function renderUpToDate(args, status) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-l3", children: [(0, jsx_runtime_1.jsx)(core_1.Icon, { className: "text-success", variant: "CircleCheckBig" }), (0, jsx_runtime_1.jsx)("span", { className: "body-sm", children: "Everything is up-to-date!" })] }));
+}
+function renderUpgradePrompt({ version, dbReady, prompt, refreshing, onUpgrade, onSync }) {
+    // render direct prompt if we're ready
+    if (dbReady) {
+        return ((0, jsx_runtime_1.jsx)(core_1.Button, { variant: "destructive", size: "xs", onClick: () => onUpgrade(version), disabled: refreshing, children: prompt }));
+    }
+    // or retry
+    else {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-l5", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-errorContainer border border-solid border-error rounded-sm text-onErrorContainer p-l4", children: "The underlying CMS database needs to be upgraded before you can apply the prepared migration scripts. Please check the CMS deployments and refresh this page." }), (0, jsx_runtime_1.jsx)(core_1.Button, { variant: "secondary", size: "xs", onClick: onSync, disabled: refreshing, children: refreshing ? 'Refreshing...' : 'Refresh' })] }));
+    }
+}

package/dist/devtools/components/status/index.d.ts

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

package/dist/devtools/components/status/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Upgrader"), exports);

package/dist/devtools/index.d.ts

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

package/dist/devtools/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./screens"), exports);

package/dist/devtools/screens/Devtools.d.ts

@@ -0,0 +1 @@
+export declare function Devtools(): import("react/jsx-runtime").JSX.Element;

package/dist/devtools/screens/Devtools.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Devtools = Devtools;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+const react_1 = require("motion/react");
+const react_2 = require("react");
+const core_1 = require("../../core");
+// component
+function Devtools() {
+    // bind state + hooks
+    const router = (0, core_1.useEditorRouter)();
+    const { user } = (0, core_1.useAuthenticator)();
+    const dialog = (0, core_1.useDialog)();
+    const siteConfig = (0, core_1.useSiteConfig)();
+    const splash = (0, core_1.useSplash)();
+    const brand = funnel_core_1.AppConfig.brandConfig();
+    const { ready, isEditorLocked } = siteConfig;
+    // dismiss splash
+    (0, react_2.useEffect)(() => {
+        if (ready) {
+            splash.dismiss();
+        }
+    }, [splash, ready]);
+    // helpers
+    const onToggleEditorLockdown = async () => {
+        // unlock
+        if (isEditorLocked) {
+            await dialog.confirm({
+                title: 'End Lockdown',
+                message: 'Are you ready to allow other users to start using the editor?',
+                confirmLabel: 'End Lockdown',
+                destructive: true,
+                asyncTask: async () => {
+                    try {
+                        await siteConfig.unlockEditor();
+                        return { success: true };
+                    }
+                    catch (e) {
+                        return { success: false, error: funnel_core_1.IsometricErrorUtils.coerceError(e) };
+                    }
+                }
+            });
+        }
+        // or lock
+        else {
+            await dialog.confirm({
+                title: 'Initiate Lockdown',
+                message: 'This will block all users from access the CMS!',
+                confirmLabel: 'Lockdown',
+                destructive: true,
+                asyncTask: async () => {
+                    try {
+                        await siteConfig.lockEditor();
+                        return { success: true };
+                    }
+                    catch (e) {
+                        return { success: false, error: funnel_core_1.IsometricErrorUtils.coerceError(e) };
+                    }
+                }
+            });
+        }
+    };
+    // render error screen if not authorized
+    if (user.role.id !== 'owner') {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "w-dvw h-dvh flex flex-col bg-surface1", children: [(0, jsx_runtime_1.jsx)(core_1.Header, { breadcrumbs: [brand.name, 'Developer Tools'], back: "back", onBack: () => router.navigateToDashboard() }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(core_1.EmptyState, { variant: "missing", size: "md", children: (0, jsx_runtime_1.jsx)("h1", { className: "heading text-content-primary", children: "You're not authorized to see this page!" }) }) })] }));
+    }
+    // render
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "w-dvw h-dvh flex flex-col bg-surface1", children: [(0, jsx_runtime_1.jsx)(core_1.Header, { breadcrumbs: [brand.name, 'Developer Tools'], back: "back", onBack: () => router.navigateToDashboard() }), (0, jsx_runtime_1.jsx)("div", { className: "relative flex-1", children: (0, jsx_runtime_1.jsxs)("div", { className: "absolute inset-0 flex", children: [(0, jsx_runtime_1.jsx)("section", { className: "flex-1 h-full max-h-full overflow-y-scroll flex flex-wrap justify-start items-start gap-l6 p-l6", children: (0, jsx_runtime_1.jsx)(react_1.AnimatePresence, { mode: "wait", initial: true, children: (0, jsx_runtime_1.jsx)(core_1.Button, { variant: isEditorLocked ? 'destructive' : 'primary', iconLeft: isEditorLocked ? 'Lock' : 'LockOpen', onClick: onToggleEditorLockdown, disabled: !ready, children: isEditorLocked ? 'Unlock Editor' : 'Lock Editor' }) }) }), (0, jsx_runtime_1.jsx)("section", { className: "hidden md:block md:w-[280px] lg:w-[320px] xl:w-[350px] border-l border-solid border-border-l1 overflow-y-scroll shrink-0" })] }) })] }));
+}