@telia-ace/widget-core 1.0.0

package/lib/types/ui.d.ts

@@ -0,0 +1,55 @@
+/// <reference types="react" />
+export declare type Theme = {
+    gap: string;
+    accessibility: {
+        isTabbing: boolean;
+        border: string;
+        colors: {
+            inactiveText: string;
+            activeText: string;
+        };
+    };
+    border: string;
+    borderRadius: string;
+    boxShadow: string;
+    inputBorder: string;
+    colors: {
+        warning: string;
+        accent: string;
+        link: string;
+        primary: string;
+        text: string;
+        textLight: string;
+    };
+    fonts: {
+        type: string;
+        base: string;
+        small: string;
+        normal: string;
+        medium: string;
+        large: string;
+        huge: string;
+    };
+    sizes: {
+        cardinal: number;
+        small: string;
+        normal: string;
+        medium: string;
+        large: string;
+    };
+    typographyVariantMapping?: {
+        h1: 'h1';
+        h2: 'h2';
+        h3: 'h3';
+        h4: 'h4';
+        h5: 'h5';
+        h6: 'h6';
+        p: 'p';
+        span: 'span';
+    };
+};
+export declare type ModeWrapper = React.FC<{
+    className: string;
+    route: string;
+    isTabbing: boolean;
+}>;

package/lib/types/ui.js

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

package/lib-esm/action-resolver.d.ts

@@ -0,0 +1,8 @@
+import { Container, EventSubscriptionCancellation } from '@webprovisions/platform';
+export declare type Action = (origin: string, action: string, value?: any) => void;
+export default class ActionResolver {
+    private events;
+    constructor(container: Container);
+    action(target: string, action: string, value: any): void;
+    subscribe(origin: string, fn: Action): EventSubscriptionCancellation;
+}

package/lib-esm/action-resolver.js

@@ -0,0 +1,17 @@
+var ActionResolver = /** @class */ (function () {
+    function ActionResolver(container) {
+        var events = container.get('$widget').events;
+        this.events = events.createChild(this);
+    }
+    ActionResolver.prototype.action = function (target, action, value) {
+        this.events.dispatch('data:action', { action: action, value: value, target: target }, { bubbles: true });
+    };
+    ActionResolver.prototype.subscribe = function (origin, fn) {
+        return this.events.subscribe('data:action', function (e, _a) {
+            var action = _a.action, value = _a.value, target = _a.target;
+            return origin === target && fn(origin, action, value);
+        });
+    };
+    return ActionResolver;
+}());
+export default ActionResolver;

package/lib-esm/component-platform/actions-controller.d.ts

@@ -0,0 +1,40 @@
+import { EventSubscriptionCancellation } from '@webprovisions/platform';
+import { ComponentNodeController } from './component-controller';
+import { ComponentNode } from './component-node';
+import { ComponentPlatform } from './component-platform';
+import { ComponentQuery } from './component-query';
+export declare type ActionData = any;
+export declare type ActionHandler = (data: any, options: any, instance: ComponentNodeController) => any;
+export declare type NextActionDelegate = (data: any, options?: any) => Promise<any>;
+export declare type WatchActionDelegate = (input: ActionData, next: NextActionDelegate, instance: ComponentNodeController) => Promise<any> | any;
+export declare type ActionWatcherContext = {
+    source: ComponentNode;
+    action: string;
+};
+export declare type ActionsState = {
+    handlers: {
+        fn: ActionHandler;
+        key: string;
+        target: ComponentQuery;
+        ns?: string;
+    }[];
+    watchers: {
+        target: ComponentQuery;
+        fn: WatchActionDelegate;
+        key: string;
+        ns?: string;
+    }[];
+};
+export declare class ActionsController {
+    private platform;
+    private target;
+    private ns?;
+    private subscriptions;
+    constructor(platform: ComponentPlatform, target: ComponentQuery, ns?: string | undefined);
+    create(key: string, fn?: ActionHandler): EventSubscriptionCancellation;
+    dispatch(key: string, data: any): Promise<{
+        [instanceId: string]: any;
+    }>;
+    watch(key: string, fn: WatchActionDelegate): EventSubscriptionCancellation;
+    dispose(): void;
+}

package/lib-esm/component-platform/actions-controller.js

@@ -0,0 +1,116 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { ComponentNodeController } from './component-controller';
+var executeActionListeners = function (listeners, data, controller) {
+    var stack = listeners.concat();
+    var dispatch = function (data, globalOptions, controller) {
+        var cancelled = true;
+        if (stack.length) {
+            var handler = stack.shift();
+            var next = function (data, options) {
+                cancelled = false;
+                return dispatch(data, Object.assign({}, globalOptions, options), controller);
+            };
+            return Promise.resolve(handler(data, next, controller)).then(function (result) { return (__assign(__assign({}, result), { cancelled: cancelled })); });
+        }
+        return Promise.resolve({ data: data, cancelled: false, options: globalOptions });
+    };
+    return dispatch(data, {}, controller);
+};
+var ActionsController = /** @class */ (function () {
+    function ActionsController(platform, target, ns) {
+        this.platform = platform;
+        this.target = target;
+        this.ns = ns;
+        this.subscriptions = [];
+        this.create = this.create.bind(this);
+    }
+    ActionsController.prototype.create = function (key, fn) {
+        var _this = this;
+        if (fn === void 0) { fn = function () { }; }
+        var handler = {
+            key: key,
+            fn: fn,
+            target: this.target,
+            ns: this.ns,
+        };
+        this.platform.actionsState.handlers.push(handler);
+        var subscription = function () {
+            var index = _this.platform.actionsState.handlers.indexOf(handler);
+            if (index > -1) {
+                _this.platform.actionsState.handlers.splice(index, 1);
+            }
+        };
+        this.subscriptions.push(subscription);
+        return subscription;
+    };
+    ActionsController.prototype.dispatch = function (key, data) {
+        var _this = this;
+        var instances = this.platform.nodes.all.concat(this.platform.nodes.detached);
+        var output = {};
+        // handlers matching the specified pattern.
+        var handlers = this.platform.actionsState.handlers.filter(function (handler) { return handler.key === key && (!handler.ns || !_this.ns || handler.ns === _this.ns); });
+        return Promise.all(handlers.map(function (handler) {
+            // select all matching instances for this particular
+            // handler (a handler can be mapped to many instances)
+            var matchedInstances = instances.filter(function (instance) { return handler.target.match(instance) && _this.target.match(instance); });
+            // execute watchers for each matched instance
+            var watchers = _this.platform.actionsState.watchers
+                .filter(function (watcher) {
+                return (watcher.key === key &&
+                    (!watcher.ns || !_this.ns || watcher.ns === _this.ns) &&
+                    matchedInstances.some(function (instance) { return watcher.target.match(instance); }));
+            })
+                .map(function (watcher) { return watcher.fn; });
+            // execute watchers and handler for each instance
+            return Promise.all(matchedInstances.map(function (node) {
+                var controller = new ComponentNodeController(_this.platform, node, _this.ns);
+                return executeActionListeners(watchers, data, controller).then(function (input) {
+                    var _a = input.data, data = _a === void 0 ? {} : _a, options = input.options, cancelled = input.cancelled;
+                    return Promise.resolve(cancelled ? {} : handler.fn(data, options, controller)).then(function (handlerResponse) {
+                        output[node.id] = handlerResponse;
+                    });
+                });
+            }));
+        })).then(function () { return output; });
+    };
+    ActionsController.prototype.watch = function (key, fn) {
+        var _this = this;
+        var parsedKey = key;
+        var parsedNs = this.ns;
+        var sections = key.split('.');
+        if (sections.length > 1) {
+            parsedNs = sections[0];
+            parsedKey = sections.splice(1).join('.');
+        }
+        var watcher = {
+            fn: fn,
+            target: this.target,
+            key: parsedKey,
+            ns: parsedNs,
+        };
+        this.platform.actionsState.watchers.push(watcher);
+        var subscription = function () {
+            var index = _this.platform.actionsState.watchers.indexOf(watcher);
+            if (index > -1) {
+                _this.platform.actionsState.watchers.splice(index, 1);
+            }
+        };
+        this.subscriptions.push(subscription);
+        return subscription;
+    };
+    ActionsController.prototype.dispose = function () {
+        this.subscriptions.forEach(function (unsubscribe) { return unsubscribe(); });
+    };
+    return ActionsController;
+}());
+export { ActionsController };

package/lib-esm/component-platform/changeset-provider.d.ts

@@ -0,0 +1,8 @@
+import { ChangesetOptions, ComponentNodeSettings } from './component-node';
+import { ComponentPlatform } from './component-platform';
+import { ComponentQuery } from './component-query';
+export interface ChangesetProvider {
+    write: (key: string, target: ComponentQuery, attributes: Partial<ComponentNodeSettings>, options: ChangesetOptions) => void;
+    remove: (key: string) => void;
+    load: (platform: ComponentPlatform) => Promise<any>;
+}

package/lib-esm/component-platform/changeset-provider.js

@@ -0,0 +1 @@
+export {};

package/lib-esm/component-platform/component-controller.d.ts

@@ -0,0 +1,38 @@
+import { ActionsController } from './actions-controller';
+import { ChangesetOptions, ComponentNode, ComponentNodeContext, ComponentNodeLayout, ComponentNodeProperties } from './component-node';
+import { ComponentPlatform } from './component-platform';
+import { ComponentQuery } from './component-query';
+export interface ComponentController {
+    actions: ActionsController;
+    writeProperties(properties: Partial<ComponentNodeProperties>, options: ChangesetOptions): void;
+    writeContext(context: Partial<ComponentNodeContext>, options: ChangesetOptions): void;
+    writeLayout(context: Partial<ComponentNodeLayout>, options: ChangesetOptions): void;
+    dispose(): void;
+}
+export declare class ComponentNodeController implements ComponentController {
+    private platform;
+    node: ComponentNode;
+    actions: ActionsController;
+    private subscribe;
+    private unsubscribe;
+    constructor(platform: ComponentPlatform, node: ComponentNode, ns?: string);
+    properties<T extends ComponentNodeProperties>(updated?: (properties: T) => void | Partial<ComponentNodeProperties>): T;
+    context(updated?: (context: ComponentNodeContext) => void): ComponentNodeContext;
+    layout(updated?: (layout: ComponentNodeLayout) => void): ComponentNodeLayout;
+    writeProperties(properties: Partial<ComponentNodeProperties> | ((properties: ComponentNodeProperties) => Partial<ComponentNodeProperties>), options?: ChangesetOptions): void;
+    writeContext(context: Partial<ComponentNodeContext>, options?: ChangesetOptions): void;
+    writeLayout(layout: Partial<ComponentNodeLayout>, options?: ChangesetOptions): void;
+    dispose(): void;
+}
+export declare class AbstractComponentController implements ComponentController {
+    private platform;
+    private target;
+    private clearOnDispose;
+    actions: ActionsController;
+    private removes;
+    constructor(platform: ComponentPlatform, target: ComponentQuery, clearOnDispose?: boolean);
+    writeProperties(properties: Partial<ComponentNodeProperties>, options?: ChangesetOptions): void;
+    writeContext(context: Partial<ComponentNodeContext>, options?: ChangesetOptions): void;
+    writeLayout(layout: Partial<ComponentNodeLayout>, options?: ChangesetOptions): void;
+    dispose(): void;
+}

package/lib-esm/component-platform/component-controller.js

@@ -0,0 +1,116 @@
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import { createEventSubscriber } from '../event-subscriber';
+import { ActionsController } from './actions-controller';
+import { ComponentQuery } from './component-query';
+var ComponentNodeController = /** @class */ (function () {
+    function ComponentNodeController(platform, node, ns) {
+        this.platform = platform;
+        this.node = node;
+        this.actions = new ActionsController(platform, new ComponentQuery(platform).withId(node.id), ns);
+        var _a = __read(createEventSubscriber(this.platform.events), 2), subscribe = _a[0], unsubscribe = _a[1];
+        this.subscribe = subscribe;
+        this.unsubscribe = unsubscribe;
+    }
+    ComponentNodeController.prototype.properties = function (updated) {
+        if (updated) {
+            this.node.touchProperties(function (properties) { return updated(properties); });
+        }
+        return this.node.attributes.properties;
+    };
+    ComponentNodeController.prototype.context = function (updated) {
+        var _this = this;
+        if (updated) {
+            this.subscribe('components:context-changed', function (event, _a) {
+                var node = _a.node;
+                if (node === _this.node) {
+                    updated(_this.node.attributes.context);
+                }
+            });
+        }
+        return this.node.attributes.context;
+    };
+    ComponentNodeController.prototype.layout = function (updated) {
+        var _this = this;
+        if (updated) {
+            this.subscribe('components:layout-changed', function (event, _a) {
+                var node = _a.node;
+                if (node === _this.node) {
+                    updated(_this.node.attributes.layout);
+                }
+            });
+        }
+        return this.node.attributes.layout;
+    };
+    ComponentNodeController.prototype.writeProperties = function (properties, options) {
+        this.node.writeProperties(properties, options);
+    };
+    ComponentNodeController.prototype.writeContext = function (context, options) {
+        this.node.writeProperties(context, options);
+    };
+    ComponentNodeController.prototype.writeLayout = function (layout, options) {
+        this.node.writeLayout(layout, options);
+    };
+    ComponentNodeController.prototype.dispose = function () {
+        this.unsubscribe();
+        this.actions.dispose();
+    };
+    return ComponentNodeController;
+}());
+export { ComponentNodeController };
+var AbstractComponentController = /** @class */ (function () {
+    function AbstractComponentController(platform, target, clearOnDispose) {
+        if (clearOnDispose === void 0) { clearOnDispose = true; }
+        this.platform = platform;
+        this.target = target;
+        this.clearOnDispose = clearOnDispose;
+        this.removes = [];
+        this.actions = new ActionsController(this.platform, this.target);
+    }
+    AbstractComponentController.prototype.writeProperties = function (properties, options) {
+        this.removes.push(this.platform.write({
+            options: options,
+            attributes: { properties: properties },
+            target: this.target,
+            removable: this.clearOnDispose,
+        }));
+    };
+    AbstractComponentController.prototype.writeContext = function (context, options) {
+        this.removes.push(this.platform.write({
+            options: options,
+            attributes: { context: context },
+            target: this.target,
+            removable: this.clearOnDispose,
+        }));
+    };
+    AbstractComponentController.prototype.writeLayout = function (layout, options) {
+        this.removes.push(this.platform.write({
+            options: options,
+            attributes: { layout: layout },
+            target: this.target,
+            removable: this.clearOnDispose,
+        }));
+    };
+    AbstractComponentController.prototype.dispose = function () {
+        this.removes.forEach(function (remove) {
+            remove();
+        });
+        this.actions.dispose();
+    };
+    return AbstractComponentController;
+}());
+export { AbstractComponentController };

package/lib-esm/component-platform/component-node-collection.d.ts

@@ -0,0 +1,18 @@
+import { EventManager } from '@webprovisions/platform';
+import { ComponentNode } from './component-node';
+import { SwitchMap } from './component-platform';
+export declare type QueryDescriptor = {
+    id?: string;
+    type?: string;
+    name?: string;
+};
+export declare class ComponentNodeCollection {
+    root: ComponentNode;
+    private switches;
+    all: ComponentNode[];
+    visible: ComponentNode[];
+    detached: ComponentNode[];
+    constructor(root: ComponentNode, switches: SwitchMap, events: EventManager);
+    query(query?: QueryDescriptor): ComponentNode[];
+    get(id: string): ComponentNode | undefined;
+}

package/lib-esm/component-platform/component-node-collection.js

@@ -0,0 +1,48 @@
+import { findComponent, findVisibleComponents, traverseComponents } from './queries';
+var ComponentNodeCollection = /** @class */ (function () {
+    function ComponentNodeCollection(root, switches, events) {
+        var _this = this;
+        this.root = root;
+        this.switches = switches;
+        this.all = [];
+        this.visible = [];
+        this.detached = [];
+        events.subscribe('components:node-appended', function (event, data) {
+            _this.all.push(data.node);
+            _this.visible = findVisibleComponents(root, switches);
+        });
+        events.subscribe('components:node-removed', function (event, data) {
+            var indexToRemove = _this.all.indexOf(data.node);
+            if (indexToRemove > -1) {
+                _this.all.splice(indexToRemove, 1);
+            }
+            indexToRemove = _this.visible.indexOf(data.node);
+            if (indexToRemove > -1) {
+                _this.visible.splice(indexToRemove, 1);
+            }
+            _this.visible = findVisibleComponents(root, switches);
+        });
+        events.subscribe('components:node-switched', function (event, data) {
+            _this.visible = findVisibleComponents(root, switches);
+        });
+    }
+    ComponentNodeCollection.prototype.query = function (query) {
+        if (query === void 0) { query = {}; }
+        var nodes = [];
+        traverseComponents(this.root, this.switches, function (node) {
+            var match = Object.keys(query).every(function (member) {
+                return query[member] === node[member];
+            });
+            if (match) {
+                nodes.push(node);
+            }
+        });
+        return nodes;
+    };
+    ComponentNodeCollection.prototype.get = function (id) {
+        return (findComponent(this.root, this.switches, function (node) { return node.id === id; }) ||
+            this.detached.find(function (node) { return node.id === id; }));
+    };
+    return ComponentNodeCollection;
+}());
+export { ComponentNodeCollection };

package/lib-esm/component-platform/component-node.d.ts

@@ -0,0 +1,63 @@
+import { Container, EventManager } from '@webprovisions/platform';
+import { Breakpoints } from '../types';
+export declare type ComponentNodeEventData = {
+    node: ComponentNode;
+};
+export declare type RemoveChangeset = () => void;
+export declare type ComponentNodeAttributes = {
+    tags: string[];
+    properties: ComponentNodeProperties;
+    context: ComponentNodeContext;
+    layout: ComponentNodeLayout;
+};
+export declare type ResolveComponentNodeProperties = (properties: ComponentNodeProperties) => Partial<ComponentNodeProperties> | void;
+export declare type ResolveComponentNodeContext = (context: ComponentNodeContext) => Partial<ComponentNodeContext>;
+export declare type ResolveComponentNodeLayout = (layout: ComponentNodeLayout) => Partial<ComponentNodeLayout>;
+export declare type ComponentNodeSettings = {
+    tags?: string[];
+    properties?: ComponentNodeProperties | ResolveComponentNodeProperties;
+    context?: ComponentNodeContext | ResolveComponentNodeContext;
+    layout?: ComponentNodeLayout | ResolveComponentNodeLayout;
+};
+export declare type ComponentNodeProperties = {
+    [key: string]: any;
+};
+export declare type ComponentNodeContext = {
+    [key: string]: any;
+};
+export declare type ComponentNodeLayout = {
+    size?: Size;
+    indent?: number;
+    order?: number;
+};
+export declare type Size = number | 'full' | 'none';
+export declare type UnmountComponentNode = () => void;
+export declare type ChangesetOptions = {
+    breakpoints?: Breakpoints;
+};
+export declare type Changeset = [Partial<ComponentNodeSettings>, ChangesetOptions];
+export declare class ComponentNode {
+    private events;
+    id: string;
+    type: string;
+    name?: string;
+    parent?: ComponentNode;
+    tags: string[];
+    children: {
+        [key: string]: ComponentNode[];
+    };
+    changesets: Changeset[];
+    attributes: ComponentNodeAttributes;
+    private mountCount;
+    constructor(events: EventManager, type: string);
+    mount(viewOutletContainer: Container, element?: HTMLElement): UnmountComponentNode;
+    appendChild(node: ComponentNode, branch?: string): void;
+    prependChild(node: ComponentNode, branch?: string): void;
+    touchProperties(properties: ResolveComponentNodeProperties, options?: ChangesetOptions, removable?: boolean): RemoveChangeset;
+    writeProperties(properties: Partial<ComponentNodeProperties> | ResolveComponentNodeProperties, options?: ChangesetOptions, removable?: boolean): RemoveChangeset;
+    writeLayout(layout: Partial<ComponentNodeLayout> | ResolveComponentNodeLayout, options?: ChangesetOptions, removable?: boolean): RemoveChangeset;
+    writeContext(context: Partial<ComponentNodeContext> | ResolveComponentNodeContext, options?: ChangesetOptions, removable?: boolean): RemoveChangeset;
+    getChildren(branch?: string): ComponentNode[];
+    remove(): void;
+    removeChild(node: ComponentNode): void;
+}