@telia-ace/widget-types-grid 1.0.8 → 1.0.11

package/lib/ui/use-router.js

@@ -1,32 +0,0 @@
-"use strict";
-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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var widget_ui_1 = require("@telia-ace/widget-ui");
-var react_1 = require("react");
-exports.default = (function (container) {
-    var _a = __read((0, react_1.useState)(null), 2), router = _a[0], setRouter = _a[1];
-    var isMounted = (0, widget_ui_1.useIsMounted)();
-    (0, react_1.useEffect)(function () {
-        container.getAsync('router').then(function (router) {
-            if (isMounted.current) {
-                setRouter(router);
-            }
-        });
-    }, [container, isMounted]);
-    return router;
-});

package/lib/ui/view-outlet.d.ts

@@ -1,32 +0,0 @@
-import { Symbol } from '@telia-ace/widget-ui';
-import { Container } from '@webprovisions/platform';
-import { TriggerType } from './prepare-dom';
-export declare type BadgeOptions = {
-    symbol?: Symbol;
-    label?: string;
-    ariaLabel?: string;
-    openTooltip?: string;
-    closedTooltip?: string;
-};
-export declare type ViewOutletOptions = {
-    widgetDOMElement: HTMLElement;
-    triggerDOMElement?: HTMLElement;
-    triggerOptions?: BadgeOptions | boolean;
-    triggerType: TriggerType;
-    cachedOriginals: {
-        widgetDOMElement?: Node;
-        triggerDOMElement?: Node;
-    };
-};
-export declare class ViewOutlet {
-    options: ViewOutletOptions;
-    container: Container;
-    private unsubscribe;
-    constructor(container: Container, options: ViewOutletOptions);
-    /**
-     * Renders the view outlet to the DOM.
-     */
-    render(): Promise<void>;
-    renderBadge(options: BadgeOptions): void;
-    dispose(): Promise<void>;
-}

package/lib/ui/view-outlet.js

@@ -1,151 +0,0 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-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;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ViewOutlet = void 0;
-var widget_services_1 = require("@telia-ace/widget-services");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var html_element_handlers_1 = require("./html-element-handlers");
-var prepare_dom_1 = require("./prepare-dom");
-var MODALS_STORAGE_KEY = 'modals';
-var ViewOutlet = /** @class */ (function () {
-    function ViewOutlet(container, options) {
-        this.options = options;
-        this.unsubscribe = [];
-        this.container = container.createChild(this);
-        this.container.register('widgetDOMElement', this.options.widgetDOMElement);
-        this.container.register('triggerDOMElement', this.options.triggerDOMElement);
-        var widget = this.container.get('$widget');
-        this.options.widgetDOMElement.classList.add('humany-widget');
-        this.options.widgetDOMElement.classList.add("humany_".concat(widget.name));
-        var widgetDOMElements = container.get('widgetDOMElements') || [];
-        container.register('widgetDOMElements', __spreadArray(__spreadArray([], __read(widgetDOMElements), false), [
-            this.options.widgetDOMElement,
-        ], false));
-    }
-    /**
-     * Renders the view outlet to the DOM.
-     */
-    ViewOutlet.prototype.render = function () {
-        var _this = this;
-        var _a = this.options, widgetDOMElement = _a.widgetDOMElement, triggerDOMElement = _a.triggerDOMElement;
-        var widget = this.container.get('$widget');
-        if (widgetDOMElement.getAttribute('data-rendered') === 'true') {
-            return Promise.resolve();
-        }
-        if (triggerDOMElement && this.options.triggerType === prepare_dom_1.TriggerType.Badge) {
-            (0, html_element_handlers_1.setLoading)(triggerDOMElement);
-        }
-        return Promise.resolve().then(function () { return __importStar(require('./render')); }).then(function (module) { return module.default(_this.container, widgetDOMElement); })
-            .then(function () {
-            widgetDOMElement.setAttribute('data-rendered', 'true');
-            if (triggerDOMElement && _this.options.triggerType === prepare_dom_1.TriggerType.Badge) {
-                var tooltip = _this.options.triggerOptions.openTooltip;
-                (0, html_element_handlers_1.setActive)(triggerDOMElement, tooltip);
-            }
-            (0, widget_utilities_1.notifyDataLoaded)(_this.container, widgetDOMElement);
-            var widgets = _this.container.get('$environment').widgets.all();
-            (0, widget_services_1.readStorage)(_this.container, MODALS_STORAGE_KEY, widget_services_1.StorageMedium.Session).then(function (modals) {
-                if (modals) {
-                    modals.forEach(function (modal) {
-                        if (widgets.find(function (w) { return w.name === modal.name && w.state === 'activated'; })) {
-                            widget.events.dispatch('widget:modal-opened', modal);
-                        }
-                    });
-                }
-            });
-        });
-    };
-    ViewOutlet.prototype.renderBadge = function (options) {
-        var triggerDOMElement = this.options.triggerDOMElement;
-        if (!triggerDOMElement) {
-            return;
-        }
-        if (!triggerDOMElement.getAttribute('role')) {
-            triggerDOMElement.setAttribute('role', 'button');
-        }
-        var name = this.container.get('$widget').name;
-        var label = options.label, symbol = options.symbol, ariaLabel = options.ariaLabel, closedTooltip = options.closedTooltip, openTooltip = options.openTooltip;
-        var triggerOptions = { closedTooltip: closedTooltip, openTooltip: openTooltip };
-        this.options.triggerOptions = triggerOptions;
-        var removeTriggerListeners = (0, html_element_handlers_1.createTriggerElement)(triggerDOMElement, {
-            label: label,
-            symbol: symbol,
-            ariaLabel: ariaLabel,
-            widgetName: name,
-            tooltip: closedTooltip,
-        });
-        this.unsubscribe.push(removeTriggerListeners);
-    };
-    ViewOutlet.prototype.dispose = function () {
-        var _this = this;
-        return Promise.resolve().then(function () { return __importStar(require('./unmount')); }).then(function (module) {
-            var _a, _b, _c, _d;
-            var _e = _this.options, triggerDOMElement = _e.triggerDOMElement, widgetDOMElement = _e.widgetDOMElement;
-            module.default(widgetDOMElement);
-            if (_this.options.cachedOriginals.widgetDOMElement) {
-                if (widgetDOMElement) {
-                    (_a = widgetDOMElement.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(_this.options.cachedOriginals.widgetDOMElement, widgetDOMElement);
-                }
-            }
-            if (_this.options.cachedOriginals.triggerDOMElement) {
-                if (triggerDOMElement) {
-                    (_b = triggerDOMElement.parentNode) === null || _b === void 0 ? void 0 : _b.replaceChild(_this.options.cachedOriginals.triggerDOMElement, triggerDOMElement);
-                }
-            }
-            _this.unsubscribe.forEach(function (unsubscribe) {
-                unsubscribe();
-            });
-            (_c = widgetDOMElement.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(widgetDOMElement);
-            (_d = triggerDOMElement === null || triggerDOMElement === void 0 ? void 0 : triggerDOMElement.parentNode) === null || _d === void 0 ? void 0 : _d.removeChild(triggerDOMElement);
-        });
-    };
-    return ViewOutlet;
-}());
-exports.ViewOutlet = ViewOutlet;

package/lib/ui/view.js

@@ -1,75 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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);
-};
-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;
-};
-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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var widget_ui_1 = require("@telia-ace/widget-ui");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var react_1 = __importDefault(require("react"));
-var styled_components_1 = __importDefault(require("styled-components"));
-var component_1 = __importDefault(require("./component"));
-var switch_1 = __importDefault(require("./switch"));
-var StyledView = (0, styled_components_1.default)(widget_ui_1.Grid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), function (p) { return !!p.scrollableCss && p.scrollableCss; });
-var View = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, other = __rest(_a, ["className"]);
-    var properties = (0, widget_ui_1.useProperties)();
-    var context = (0, widget_ui_1.useContext)();
-    var container = (0, widget_ui_1.useContainer)();
-    var node = (0, widget_ui_1.useComponentNode)();
-    var views = container.get('$settings').views;
-    var _c = context.gap, gap = _c === void 0 ? '0' : _c;
-    var _d = properties.columns, columns = _d === void 0 ? 1 : _d, _e = properties.animation, animation = _e === void 0 ? 'none' : _e, _f = properties.scrollable, scrollable = _f === void 0 ? false : _f, areaProperties = __rest(properties, ["columns", "animation", "scrollable"]);
-    var _g = __read((0, widget_ui_1.useScroll)(scrollable), 2), scrollableCss = _g[0], elem = _g[1];
-    if (!node) {
-        return null;
-    }
-    return (react_1.default.createElement(StyledView, __assign({}, other, areaProperties, { scrollableCss: scrollableCss, ref: elem, columns: columns, gap: gap, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-view') }),
-        react_1.default.createElement(switch_1.default, { views: views, render: function (name) {
-                var childNode = node.getChildren(name)[0];
-                return react_1.default.createElement(component_1.default, { id: childNode.id, node: childNode, branch: "default" });
-            } })));
-};
-exports.default = View;
-var templateObject_1;

package/lib/ui/wrapper.d.ts

@@ -1,7 +0,0 @@
-import { Container } from '@webprovisions/platform';
-import React from 'react';
-declare type Props = {
-    container: Container;
-};
-declare const Wrapper: React.SFC<Props>;
-export default Wrapper;

package/lib/ui/wrapper.js

@@ -1,108 +0,0 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var widget_ui_1 = require("@telia-ace/widget-ui");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var react_1 = __importStar(require("react"));
-var react_router_dom_1 = require("react-router-dom");
-var component_1 = __importDefault(require("./component"));
-var use_router_1 = __importDefault(require("./use-router"));
-var keyNavigationKeys = ['Tab', 'ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'];
-var Wrapper = function (_a) {
-    var container = _a.container;
-    var components = (0, widget_ui_1.useComponentPlatform)(container);
-    var router = (0, use_router_1.default)(container);
-    var env = container.get('$environment');
-    var _b = __read((0, react_1.useState)((env === null || env === void 0 ? void 0 : env.container.get('isTabbing')) || false), 2), isTabbing = _b[0], setIsTabbing = _b[1];
-    var _c = __read((0, react_1.useState)(null), 2), entry = _c[0], setEntry = _c[1];
-    (0, react_1.useEffect)(function () {
-        var keydown = function (event) {
-            if (keyNavigationKeys.indexOf(event.key) > -1) {
-                if (!isTabbing) {
-                    env === null || env === void 0 ? void 0 : env.container.register('isTabbing', true);
-                }
-                setIsTabbing(true);
-            }
-        };
-        var click = function (event) {
-            if (event.screenX === 0 && event.screenY === 0) {
-                return;
-            }
-            if (isTabbing) {
-                env === null || env === void 0 ? void 0 : env.container.register('isTabbing', false);
-            }
-            setIsTabbing(false);
-        };
-        window.addEventListener('keydown', keydown);
-        window.addEventListener('click', click);
-        return function () {
-            window.removeEventListener('keydown', keydown);
-            window.removeEventListener('click', click);
-        };
-    }, []);
-    (0, react_1.useEffect)(function () {
-        if (components) {
-            setEntry(components.nodes.root.children.default[0].id || null);
-            var unsubscribe = components.events.subscribe('components:root-children-changed', function (event, _a) {
-                var node = _a.node;
-                if (node.parent && node.parent.type === 'root') {
-                    var entry_1 = node.parent.children.default[0].id;
-                    setEntry(entry_1);
-                }
-            });
-            return unsubscribe;
-        }
-    }, [components]);
-    if (!router || !router.history || !components) {
-        return null;
-    }
-    if (!entry) {
-        return null;
-    }
-    return (react_1.default.createElement(react_router_dom_1.Router, { history: router.history },
-        react_1.default.createElement(widget_ui_1.ContainerContext.Provider, { value: container },
-            react_1.default.createElement(widget_ui_1.RoutingContext.Provider, { value: router },
-                react_1.default.createElement(component_1.default, { className: (0, widget_utilities_1.appendClassNames)([isTabbing, 'humany-is-tabbing']), isTabbing: isTabbing, id: entry, branch: "default" })))));
-};
-exports.default = Wrapper;

package/lib/widget.d.ts

@@ -1,54 +0,0 @@
-import { WidgetRenderState, WidgetSettings } from '@telia-ace/widget-core';
-import { BootstrappingActivationData } from '@webprovisions/bootstrapping';
-import { Container, EventSubscriptionCancellation, WidgetType } from '@webprovisions/platform';
-import { ViewOutlet } from '././ui/view-outlet';
-export declare enum InitialRenderState {
-    Open = "open",
-    Closed = "closed",
-    Hidden = "hidden",
-    Storage = "storage"
-}
-export declare type RenderData = {
-    widgetDOMElement?: HTMLElement;
-    triggerDOMElement?: HTMLElement;
-    key?: string;
-    open?: boolean;
-    withRenderState?: InitialRenderState;
-};
-export declare type AttachData = {
-    widgetDOMElement?: HTMLElement;
-    triggerDOMElement?: HTMLElement;
-    key?: string;
-    withRenderState?: InitialRenderState;
-};
-export default class Widget extends WidgetType {
-    outlets: Map<string, ViewOutlet>;
-    activated: Promise<void> | undefined;
-    subs: EventSubscriptionCancellation[];
-    constructor(container: Container);
-    handleBootstrapping: (activationData: BootstrappingActivationData) => void;
-    initialize(): Promise<void>;
-    attach(attachData?: AttachData): any;
-    detach(key?: string): void;
-    private triggerStateIfApplicable;
-    private getOrCreateViewOutlet;
-    render(renderData?: RenderData): any;
-    activate(data?: any): void;
-    setSettings(fn: (settings: WidgetSettings) => Promise<Partial<WidgetSettings>>): Promise<WidgetSettings>;
-    clearSettings(): Promise<void>;
-    action({ action, value }: {
-        action: string;
-        value?: any;
-    }): Promise<void>;
-    renderState(): Promise<WidgetRenderState>;
-    hide(): Promise<void>;
-    open(): Promise<void>;
-    close(): Promise<void>;
-    show(): Promise<void>;
-    private onAction;
-    private setRenderState;
-    private onOpen;
-    private onClose;
-    private setTriggerState;
-    deactivate(): Promise<void[]>;
-}