@nascentdigital/funnel-apps 4.4.18

package/dist/react/nav/core/useSpec.d.ts

@@ -0,0 +1,3 @@
+import { Result } from '@nascentdigital/funnel-core';
+import { Spec } from '../domain';
+export declare function useSpec(): Result<Spec<any>>;

package/dist/react/nav/core/useSpec.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSpec = useSpec;
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+const hooks_1 = require("@nascentdigital/funnel-ui/hooks");
+const react_1 = require("react");
+const SpecSourceContext_1 = require("./SpecSourceContext");
+// hook
+function useSpec() {
+    // bind context
+    const { specSource } = (0, react_1.useContext)(SpecSourceContext_1.SpecSourceContext);
+    const touch = (0, hooks_1.useTouch)();
+    // sync on touch
+    (0, react_1.useEffect)(() => {
+        // skip if there's not source
+        if (!specSource) {
+            return;
+        }
+        // touch when result changes
+        const subscription = specSource.result$.subscribe(touch);
+        // unsubscribe on unmount
+        return () => subscription.unsubscribe();
+    }, [specSource, touch]);
+    // throw if the there's no source
+    if (!specSource) {
+        throw new funnel_core_1.InvalidOperationError('Attempt to call useSpec() outside of SpecSourceContext');
+    }
+    // return spec (might be undefined)
+    return specSource.result;
+}

package/dist/react/nav/domain/Icon.d.ts

@@ -0,0 +1,2 @@
+import { ImageIcon, LucideIcon } from './icons';
+export type Icon = ImageIcon | LucideIcon;

package/dist/react/nav/domain/Icon.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/react/nav/domain/Modal.d.ts

@@ -0,0 +1,25 @@
+import type { Screen } from './Screen';
+import type { Tabs } from './Tabs';
+import type { Stack } from './Stack';
+export declare class Modal {
+    readonly __type: "modal";
+    readonly variant: Modal.Variant;
+    readonly content: Modal.Content;
+    constructor(args: Modal.ConstructorArgs);
+    toData(): Modal.Data;
+    toJSON(): any;
+    static create(args: Modal.ConstructorArgs): Modal;
+}
+export declare namespace Modal {
+    type Variant = 'full' | 'partial';
+    type Content = Stack | Tabs | Screen;
+    type Data = {
+        __type: 'modal';
+        variant: Variant;
+        content: Stack.Data | Tabs.Data | Screen.Data;
+    };
+    type ConstructorArgs = {
+        variant?: Variant;
+        content: Content;
+    };
+}

package/dist/react/nav/domain/Modal.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Modal = void 0;
+// class
+class Modal {
+    constructor(args) {
+        var _a;
+        this.__type = 'modal';
+        // initialize instance variables
+        this.variant = (_a = args.variant) !== null && _a !== void 0 ? _a : 'full';
+        this.content = args.content;
+    }
+    toData() {
+        const { __type, variant, content } = this;
+        return {
+            __type,
+            variant,
+            content: content.toJSON()
+        };
+    }
+    toJSON() {
+        return JSON.parse(JSON.stringify(this.toData()));
+    }
+    static create(args) {
+        return new Modal(args);
+    }
+}
+exports.Modal = Modal;

package/dist/react/nav/domain/Navigation.d.ts

@@ -0,0 +1,13 @@
+import { StringKeyOf } from 'type-fest';
+import type { Modal } from './Modal';
+import type { Tabs } from './Tabs';
+import type { Stack } from './Stack';
+export type Navigation = Record<string, Navigation.Item>;
+export declare namespace Navigation {
+    type Item = Stack | Tabs | Modal;
+    namespace Item {
+        type Data = Stack.Data | Tabs.Data | Modal.Data;
+    }
+    type Root<TNavigation extends Navigation = Navigation> = StringKeyOf<TNavigation>;
+    type Data = Record<string, Navigation.Item.Data>;
+}

package/dist/react/nav/domain/Navigation.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/react/nav/domain/NavigationCommand.d.ts

@@ -0,0 +1,14 @@
+export type NavigationCommand = NavigationCommand.Push | NavigationCommand.Replace | NavigationCommand.Back;
+export declare namespace NavigationCommand {
+    type Push = {
+        __type: 'push';
+        url: string;
+    };
+    type Replace = {
+        __type: 'replace';
+        url: string;
+    };
+    type Back = {
+        __type: 'back';
+    };
+}

package/dist/react/nav/domain/NavigationCommand.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/react/nav/domain/Route.d.ts

@@ -0,0 +1,12 @@
+import { Navigation } from './Navigation';
+import { Screen } from './Screen';
+export type Route = {
+    readonly navigation: ReadonlyArray<Route.Component>;
+    readonly screen: Screen;
+};
+export declare namespace Route {
+    type Component = {
+        readonly id: string;
+        readonly navigation: Navigation.Item;
+    };
+}

package/dist/react/nav/domain/Route.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/react/nav/domain/Routes.d.ts

@@ -0,0 +1,6 @@
+import { Route } from './Route';
+import type { Spec } from './Spec';
+export type Routes = Record<string, Route>;
+export declare namespace Routes {
+    function fromSpec(spec: Spec): Routes;
+}

package/dist/react/nav/domain/Routes.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Routes = void 0;
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+// namespace
+var Routes;
+(function (Routes) {
+    // helpers
+    function fromSpec(spec) {
+        // create routes + context
+        const routes = {};
+        // recursively process all spec navigation routes
+        Object.entries(spec.navigation)
+            .forEach(([id, item]) => walkItem(id, item, { routes, navigation: [] }));
+        // return routes
+        return routes;
+    }
+    Routes.fromSpec = fromSpec;
+})(Routes || (exports.Routes = Routes = {}));
+function walkItem(id, item, context) {
+    // process item
+    switch (item.__type) {
+        case 'tabs':
+            return walkTabs(id, item, context);
+        case 'stack':
+            return walkStack(id, item, context);
+        case 'modal':
+            return walkModal(id, item, context);
+        case 'screen':
+            return walkScreen(item, context);
+    }
+}
+function walkTabs(id, tabs, { routes, navigation }) {
+    // create new context
+    const context = {
+        routes,
+        navigation: [...navigation, { id, navigation: tabs }]
+    };
+    // walk each tab
+    Object.entries(tabs.items)
+        .forEach(([key, item]) => walkItem(key, item.content, context));
+}
+function walkStack(id, stack, { routes, navigation }) {
+    // create new context
+    const context = {
+        routes,
+        navigation: [...navigation, { id, navigation: stack }]
+    };
+    // walk each item in stack
+    Object.entries(stack.items)
+        .forEach(([key, item]) => walkItem(key, item.content, context));
+}
+function walkModal(id, modal, { routes, navigation }) {
+    // fail if not first item
+    if (navigation.length !== 0) {
+        throw new funnel_core_1.IllegalStateError('Modal instances can only be a navigation root');
+    }
+    // recurse over content
+    walkItem('root', modal.content, {
+        routes,
+        navigation: [...navigation, { id, navigation: modal }]
+    });
+}
+function walkScreen(screen, { routes, navigation }) {
+    // fail if screen is root
+    if (navigation.length === 0) {
+        throw new funnel_core_1.IllegalStateError('Screen instances can\'t be used as a navigation root');
+    }
+    // bind screen to routes
+    routes[screen.route] = {
+        navigation,
+        screen
+    };
+}

package/dist/react/nav/domain/Screen.d.ts

@@ -0,0 +1,24 @@
+import { Skeleton } from './Skeleton';
+export declare class Screen {
+    readonly __type: "screen";
+    readonly id: string;
+    readonly route: string;
+    readonly skeleton?: Skeleton;
+    constructor(args: Screen.ConstructorArgs);
+    toData(): Screen.Data;
+    toJSON(): any;
+    static create(args: Screen.ConstructorArgs): Screen;
+}
+export declare namespace Screen {
+    type Data = {
+        __type: 'screen';
+        id: string;
+        route: string;
+        skeleton?: Skeleton;
+    };
+    type ConstructorArgs = {
+        id: string;
+        route: string;
+        skeleton?: Skeleton;
+    };
+}

package/dist/react/nav/domain/Screen.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Screen = void 0;
+class Screen {
+    constructor(args) {
+        this.__type = 'screen';
+        // initialize instance variables
+        this.id = args.id;
+        this.route = args.route;
+        this.skeleton = args.skeleton;
+    }
+    toData() {
+        const { __type, id, route, skeleton } = this;
+        return {
+            __type,
+            id,
+            route,
+            skeleton
+        };
+    }
+    toJSON() {
+        return JSON.parse(JSON.stringify(this.toData()));
+    }
+    static create(args) {
+        return new Screen(args);
+    }
+}
+exports.Screen = Screen;

package/dist/react/nav/domain/Skeleton.d.ts

@@ -0,0 +1,26 @@
+export type Skeleton = {
+    padding?: number | [number, number];
+    background?: string;
+    color?: string;
+    items: ReadonlyArray<Skeleton.Item>;
+};
+export declare namespace Skeleton {
+    type Item = Text | Image;
+    type Text = {
+        __type: 'text';
+        width?: string | number;
+        lines?: number;
+        lineGap?: number;
+        size?: number;
+        radius?: number;
+        margin?: number;
+    };
+    type Image = {
+        __type: 'image';
+        width?: string | number;
+        height?: number;
+        aspectRatio?: number;
+        radius?: number;
+        margin?: number;
+    };
+}

package/dist/react/nav/domain/Skeleton.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/react/nav/domain/Spec.d.ts

@@ -0,0 +1,33 @@
+import { AppService } from '../../app/domain';
+import type { Navigation } from './Navigation';
+export declare class Spec<TNavigation extends Navigation = Navigation> {
+    readonly backgroundColor: string;
+    readonly skeletonColor: string;
+    readonly root: Navigation.Root<TNavigation>;
+    readonly navigation: Readonly<TNavigation>;
+    constructor(args: Spec.ConstructorArgs<TNavigation>);
+    static fromData<TNavigation extends Navigation = Navigation>(data: Spec.Data): Spec<TNavigation>;
+    toData(): Spec.Data;
+    toJSON(): any;
+}
+export declare namespace Spec {
+    type Request = Request.GetSpec;
+    namespace Request {
+        const appId: "_nd-nav";
+        type AppId = typeof appId;
+        type GetSpec = AppService.Request<AppId, typeof GetSpecMethod, null>;
+        const GetSpecMethod: "getSpec";
+    }
+    type Data = {
+        backgroundColor: string;
+        skeletonColor: string;
+        root: string;
+        navigation: Navigation.Data;
+    };
+    type ConstructorArgs<TNavigation extends Navigation = Navigation> = {
+        backgroundColor: string;
+        skeletonColor: string;
+        root: Navigation.Root<TNavigation>;
+        navigation: TNavigation;
+    };
+}

package/dist/react/nav/domain/Spec.js

@@ -0,0 +1,124 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Spec = void 0;
+const Modal_1 = require("./Modal");
+const Screen_1 = require("./Screen");
+const Stack_1 = require("./Stack");
+const Tabs_1 = require("./Tabs");
+// class
+class Spec {
+    constructor(args) {
+        // initialize instance variables
+        this.backgroundColor = args.backgroundColor;
+        this.skeletonColor = args.skeletonColor;
+        this.root = args.root;
+        this.navigation = args.navigation;
+    }
+    static fromData(data) {
+        return parseSpec(data);
+    }
+    toData() {
+        const { backgroundColor, skeletonColor, root, navigation } = this;
+        return {
+            backgroundColor,
+            skeletonColor,
+            root,
+            navigation: Object.entries(navigation).reduce((data, [key, itemRaw]) => {
+                // map item
+                const item = itemRaw;
+                data[key] = item.toData();
+                // keep reducing
+                return data;
+            }, {})
+        };
+    }
+    toJSON() {
+        return JSON.parse(JSON.stringify(this.toData()));
+    }
+}
+exports.Spec = Spec;
+// extension
+(function (Spec) {
+    let Request;
+    (function (Request) {
+        // app id
+        Request.appId = '_nd-nav';
+        Request.GetSpecMethod = 'getSpec';
+    })(Request = Spec.Request || (Spec.Request = {}));
+})(Spec || (exports.Spec = Spec = {}));
+// helpers
+function parseSpec({ backgroundColor, skeletonColor, root, navigation }) {
+    return new Spec({
+        backgroundColor,
+        skeletonColor,
+        root,
+        navigation: Object.entries(navigation).reduce((navigation, [key, itemData]) => {
+            // map next item
+            navigation[key] = parseItem(itemData);
+            // keep reducing
+            return navigation;
+        }, {})
+    });
+}
+function parseItem(data) {
+    switch (data.__type) {
+        case 'tabs':
+            return parseTabs(data);
+        case 'stack':
+            return parseStack(data);
+        case 'modal':
+            return parseModal(data);
+    }
+}
+function parseTabs({ variant, items }) {
+    return new Tabs_1.Tabs({
+        variant,
+        items: Object.entries(items).reduce((items, [key, itemData]) => {
+            // map next item
+            const { label, content } = itemData;
+            items[key] = {
+                label,
+                icon: {},
+                content: content.__type === 'screen'
+                    ? parseScreen(content)
+                    : parseStack(content)
+            };
+            // keep reducing
+            return items;
+        }, {})
+    });
+}
+function parseStack({ root, items }) {
+    return new Stack_1.Stack({
+        root,
+        items: Object.entries(items).reduce((items, [key, itemData]) => {
+            // map next item
+            const { label, content } = itemData;
+            items[key] = {
+                label,
+                content: content.__type === 'screen'
+                    ? parseScreen(content)
+                    : parseTabs(content)
+            };
+            // keep reducing
+            return items;
+        }, {})
+    });
+}
+function parseModal({ variant, content }) {
+    return new Modal_1.Modal({
+        variant,
+        content: content.__type === 'screen'
+            ? parseScreen(content)
+            : content.__type === 'stack'
+                ? parseStack(content)
+                : parseTabs(content)
+    });
+}
+function parseScreen({ id, route, skeleton }) {
+    return new Screen_1.Screen({
+        id,
+        route,
+        skeleton
+    });
+}

package/dist/react/nav/domain/SpecSource.d.ts

@@ -0,0 +1,21 @@
+import { Result } from '@nascentdigital/funnel-core';
+import { Observable } from 'rxjs';
+import type { Identity } from '../../identity/domain';
+import type { Profile } from '../../profile/domain';
+import type { Navigation } from './Navigation';
+import type { Spec } from './Spec';
+export interface SpecSource<TNavigation extends Navigation = Navigation> {
+    readonly result$: Observable<Result<Spec<TNavigation>>>;
+    readonly result: Result<Spec<TNavigation>>;
+    sync(args: SpecSource.Sync.Args): Promise<Result.Completion<Spec<TNavigation>>>;
+}
+export declare namespace SpecSource {
+    namespace Sync {
+        type Args = {
+            identity?: Identity;
+            profile?: Profile;
+        };
+    }
+    function get(): SpecSource<Navigation>;
+    function set(provider: SpecSource): void;
+}

package/dist/react/nav/domain/SpecSource.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SpecSource = void 0;
+const funnel_core_1 = require("@nascentdigital/funnel-core");
+// extension
+var SpecSource;
+(function (SpecSource) {
+    // helpers
+    function get() {
+        // throw if already set
+        if (!_provider) {
+            throw new funnel_core_1.InvalidOperationError('Attempt to access AppNav.SpecSource before binding');
+        }
+        // set client
+        return _provider;
+    }
+    SpecSource.get = get;
+    function set(provider) {
+        // throw if already set
+        if (_provider) {
+            throw new funnel_core_1.InvalidOperationError('Cannot bind AppNav.SpecSource multiple times');
+        }
+        // set client
+        _provider = provider;
+    }
+    SpecSource.set = set;
+})(SpecSource || (exports.SpecSource = SpecSource = {}));
+let _provider = undefined;

package/dist/react/nav/domain/Stack.d.ts

@@ -0,0 +1,35 @@
+import { StringKeyOf } from 'type-fest';
+import type { Screen } from './Screen';
+import type { Tabs } from './Tabs';
+export declare class Stack<TItems extends Stack.Items = Stack.Items> {
+    readonly __type: "stack";
+    readonly root: StringKeyOf<TItems>;
+    readonly items: Readonly<TItems>;
+    constructor(args: Stack.ConstructorArgs<TItems>);
+    toData(): Stack.Data;
+    toJSON(): any;
+    static create<TItems extends Stack.Items>(args: Stack.ConstructorArgs<TItems>): Stack<TItems>;
+}
+export declare namespace Stack {
+    type Items = Record<string, Item>;
+    type Item = {
+        label: string;
+        content: Content;
+    };
+    namespace Item {
+        type Data = {
+            label: string;
+            content: Tabs.Data | Screen.Data;
+        };
+    }
+    type Content = Tabs | Screen;
+    type Data = {
+        __type: 'stack';
+        root: string;
+        items: Record<string, Item.Data>;
+    };
+    type ConstructorArgs<TItems extends Items = Items> = {
+        root: StringKeyOf<TItems>;
+        items: Readonly<TItems>;
+    };
+}

package/dist/react/nav/domain/Stack.js

@@ -0,0 +1,44 @@
+"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.Stack = void 0;
+// class
+class Stack {
+    constructor(args) {
+        this.__type = 'stack';
+        // initialize instance variables
+        this.root = args.root;
+        this.items = args.items;
+    }
+    toData() {
+        const { __type, root, items } = this;
+        return {
+            __type,
+            root,
+            items: Object.entries(items).reduce((data, [key, itemRaw]) => {
+                // map item
+                const _a = itemRaw, { content } = _a, item = __rest(_a, ["content"]);
+                data[key] = Object.assign(Object.assign({}, item), { content: content.toData() });
+                // keep reducing
+                return data;
+            }, {})
+        };
+    }
+    toJSON() {
+        return JSON.parse(JSON.stringify(this.toData()));
+    }
+    static create(args) {
+        return new Stack(args);
+    }
+}
+exports.Stack = Stack;

package/dist/react/nav/domain/Tabs.d.ts

@@ -0,0 +1,37 @@
+import type { Icon } from './Icon';
+import type { Screen } from './Screen';
+import type { Stack } from './Stack';
+export declare class Tabs {
+    readonly __type: "tabs";
+    readonly variant: Tabs.Variant;
+    readonly items: Readonly<Tabs.Items>;
+    constructor(args: Tabs.ConstructorArgs);
+    toData(): Tabs.Data;
+    toJSON(): any;
+    static create(args: Tabs.ConstructorArgs): Tabs;
+}
+export declare namespace Tabs {
+    type Variant = 'bottom' | 'top';
+    type Items = Record<string, Item>;
+    type Item = {
+        label: string;
+        icon: Icon;
+        content: Content;
+    };
+    namespace Item {
+        type Data = {
+            label: string;
+            content: Stack.Data | Screen.Data;
+        };
+    }
+    type Content = Stack | Screen;
+    type Data = {
+        __type: 'tabs';
+        variant: Variant;
+        items: Record<string, Item.Data>;
+    };
+    type ConstructorArgs = {
+        variant?: Variant;
+        items: Items;
+    };
+}