@esri/solutions-components 0.7.3 → 0.7.4

package/dist/cjs/instant-apps-interactive-legend.cjs.entry.js

@@ -0,0 +1,115 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b8a649fc.js');
+const loadModules = require('./loadModules-1d0f0316.js');
+const locale = require('./locale-56c3447b.js');
+const helpers = require('./helpers-ff831524.js');
+require('./esri-loader-a91c0ec1.js');
+require('./_commonjsHelpers-384729db.js');
+require('./languageUtil-a3b464f8.js');
+require('./index-22bb61da.js');
+
+const instantAppsInteractiveLegendCss = ".sc-instant-apps-interactive-legend-h{display:block;height:100%}.sc-instant-apps-interactive-legend-h .esri-legend.sc-instant-apps-interactive-legend{height:100%;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1)}.sc-instant-apps-interactive-legend-h .esri-legend.esri-component.esri-widget.esri-widget--panel.sc-instant-apps-interactive-legend{margin:0}";
+
+const CSS = {
+    esri: {
+        base: 'esri-legend',
+        widget: 'esri-widget',
+        widgetPanel: 'esri-widget--panel',
+        component: 'esri-component',
+        iconLayerList: 'esri-icon-layer-list',
+    },
+};
+const InstantAppsInteractiveLegend = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.handles = undefined;
+        this.reactiveUtils = undefined;
+        this.legendvm = undefined;
+        this.widget = undefined;
+        this.view = undefined;
+        this.zoomTo = false;
+        this.featureCount = false;
+        this.filterMode = {
+            type: 'filter',
+        };
+        this.messages = undefined;
+    }
+    async componentWillLoad() {
+        const observer = new MutationObserver(() => {
+            index.forceUpdate(this.el);
+        });
+        observer.observe(this.el, {
+            attributes: true,
+        });
+        await this.initializeModules();
+    }
+    async componentDidLoad() {
+        locale.getMessages(this);
+    }
+    async initializeModules() {
+        const [Handles, reactiveUtils, Widget, Legend] = await loadModules.loadModules(['esri/core/Handles', 'esri/core/reactiveUtils', 'esri/widgets/Widget', 'esri/widgets/Legend']);
+        this.handles = new Handles();
+        this.reactiveUtils = reactiveUtils;
+        this.widget = new Widget();
+        const legend = new Legend();
+        await reactiveUtils.whenOnce(() => legend === null || legend === void 0 ? void 0 : legend.messages);
+        this.messages = Object.assign(Object.assign({}, this.messages), legend.messages);
+        return Promise.resolve();
+    }
+    async init() {
+        if (!this.reactiveUtils || !this.view || !this.handles)
+            return;
+        try {
+            const { on } = this.reactiveUtils;
+            const [LegendViewModel] = await loadModules.loadModules(['esri/widgets/Legend/LegendViewModel']);
+            const legendVM = new LegendViewModel({ view: this.view });
+            this.legendvm = legendVM;
+            this.handles.add([
+                on(() => { var _a; return (_a = this.legendvm) === null || _a === void 0 ? void 0 : _a.activeLayerInfos; }, 'change', () => { var _a; return this._refreshActiveLayerInfos((_a = this === null || this === void 0 ? void 0 : this.legendvm) === null || _a === void 0 ? void 0 : _a.activeLayerInfos, this.reactiveUtils); }),
+            ]);
+        }
+        catch (err) {
+            console.error('Failed at "init": ', err);
+        }
+    }
+    render() {
+        var _a;
+        const { base, component, widget, widgetPanel } = CSS.esri;
+        return (index.h("div", { key: "interactive-legend", class: (_a = this.widget) === null || _a === void 0 ? void 0 : _a.classes(base, component, widget, widgetPanel) }, index.h("instant-apps-interactive-legend-classic", { key: "interactive-legend-classic", ref: (el) => (this.ref = el), class: helpers.getTheme(this.el), legendvm: this.legendvm, "zoom-to": this.zoomTo, filterMode: this.filterMode, "feature-count": this.featureCount, messages: this.messages })));
+    }
+    _refreshActiveLayerInfos(activeLayerInfos, reactiveUtils) {
+        if (!activeLayerInfos)
+            return;
+        this.handles.removeAll();
+        activeLayerInfos.forEach(activeLayerInfo => this._renderOnActiveLayerInfoChange(activeLayerInfo, reactiveUtils));
+    }
+    _renderOnActiveLayerInfoChange(activeLayerInfo, reactiveUtils) {
+        var _a;
+        const { on } = this.reactiveUtils;
+        const childrenChangeHandle = on(() => activeLayerInfo.children, 'change', () => activeLayerInfo.children.forEach(childActiveLayerInfo => this._renderOnActiveLayerInfoChange(childActiveLayerInfo, reactiveUtils)));
+        this.handles.add(childrenChangeHandle, `children_${(_a = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.layer) === null || _a === void 0 ? void 0 : _a.uid}`);
+        activeLayerInfo.children.forEach(childActiveLayerInfo => {
+            var _a, _b;
+            this._renderOnActiveLayerInfoChange(childActiveLayerInfo, reactiveUtils);
+            if (((_a = childActiveLayerInfo === null || childActiveLayerInfo === void 0 ? void 0 : childActiveLayerInfo.children) === null || _a === void 0 ? void 0 : _a.length) > 0)
+                (_b = childActiveLayerInfo === null || childActiveLayerInfo === void 0 ? void 0 : childActiveLayerInfo.children) === null || _b === void 0 ? void 0 : _b.forEach(innerChild => this._renderOnActiveLayerInfoChange(innerChild, reactiveUtils));
+        });
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "handles": ["init"],
+        "reactiveUtils": ["init"],
+        "view": ["init"]
+    }; }
+};
+InstantAppsInteractiveLegend.style = instantAppsInteractiveLegendCss;
+
+exports.instant_apps_interactive_legend = InstantAppsInteractiveLegend;

package/dist/cjs/instant-apps-keyboard-shortcuts.cjs.entry.js

@@ -0,0 +1,143 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b8a649fc.js');
+const locale = require('./locale-56c3447b.js');
+require('./loadModules-1d0f0316.js');
+require('./esri-loader-a91c0ec1.js');
+require('./_commonjsHelpers-384729db.js');
+require('./languageUtil-a3b464f8.js');
+
+const instantAppsKeyboardShortcutsCss = ":host .instant-apps-keyboard-shortcuts__content{display:flex;flex-direction:column;font-family:var(--calcite-sans-family);font-size:0.875rem;background-color:var(--calcite-ui-background);color:var(--calcite-ui-text-1);width:auto;padding:0.5em;margin-bottom:0;overflow:auto}:host .instant-apps-keyboard-shortcuts__content table{border:none;border-collapse:collapse;width:100%;margin-bottom:1em}:host .instant-apps-keyboard-shortcuts__content table td,:host .instant-apps-keyboard-shortcuts__content table th{border:solid 1px var(--calcite-ui-border-1);padding:0.5rem 0.75rem 0.5rem 0.75rem;white-space:normal}:host .instant-apps-keyboard-shortcuts__content table td:lang(ja),:host .instant-apps-keyboard-shortcuts__content table td:lang(ja-JP),:host .instant-apps-keyboard-shortcuts__content table th:lang(ja-JP),:host .instant-apps-keyboard-shortcuts__content table th:lang(ja){white-space:nowrap}:host .instant-apps-keyboard-shortcuts__content tr:nth-child(even){background-color:var(--calcite-ui-foreground-2)}:host .instant-apps-keyboard-shortcuts__content tr th{padding:0.5em 0.7em;font-weight:400}";
+
+const CSS = {
+    content: 'instant-apps-keyboard-shortcuts__content',
+};
+const InstantAppsKeyboardShortcuts = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.messages = undefined;
+        this.view = undefined;
+    }
+    render() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        const commands = ((_a = this === null || this === void 0 ? void 0 : this.view) === null || _a === void 0 ? void 0 : _a.type) === '2d' || !(this === null || this === void 0 ? void 0 : this.view) ? this._getMapViewCommands() : this._getSceneViewCommands();
+        const modifierKey = this._isMacLike() ? 'Option' : 'Alt';
+        return (index.h(index.Host, null, index.h("calcite-block", { open: true, class: `${CSS.content}`, heading: (_c = (_b = this === null || this === void 0 ? void 0 : this.messages) === null || _b === void 0 ? void 0 : _b.generalShortcuts) === null || _c === void 0 ? void 0 : _c.label }, index.h("table", null, this.renderTableHeader(), index.h("tr", null, index.h("td", null, `${modifierKey} + M`), index.h("td", null, (_e = (_d = this === null || this === void 0 ? void 0 : this.messages) === null || _d === void 0 ? void 0 : _d.generalShortcuts) === null || _e === void 0 ? void 0 : _e.title))), index.h("calcite-label", null, (_g = (_f = this === null || this === void 0 ? void 0 : this.messages) === null || _f === void 0 ? void 0 : _f.generalShortcuts) === null || _g === void 0 ? void 0 : _g.title), index.h("table", null, this.renderTableHeader(), commands.map(command => {
+            return (index.h("tr", null, index.h("td", null, command.alias), index.h("td", null, command.title)));
+        })))));
+    }
+    componentDidLoad() {
+        locale.getMessages(this);
+    }
+    renderTableHeader() {
+        var _a, _b;
+        return (this === null || this === void 0 ? void 0 : this.messages) ? (index.h("tr", null, index.h("th", null, (_a = this === null || this === void 0 ? void 0 : this.messages) === null || _a === void 0 ? void 0 : _a.generalShortcuts.shortcut), index.h("th", null, (_b = this === null || this === void 0 ? void 0 : this.messages) === null || _b === void 0 ? void 0 : _b.generalShortcuts.action))) : null;
+    }
+    _getMapViewCommands() {
+        return (this === null || this === void 0 ? void 0 : this.messages)
+            ? [
+                {
+                    alias: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.arrowKeys,
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.nudge,
+                },
+                {
+                    alias: 'N',
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.N,
+                },
+                {
+                    alias: 'A',
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.A,
+                },
+                {
+                    alias: 'D',
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.D,
+                },
+                {
+                    alias: '+',
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.plus,
+                },
+                {
+                    alias: '-',
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.minus,
+                },
+            ]
+            : [];
+    }
+    _getSceneViewCommands() {
+        var _a;
+        /* Arrow Keys(nudge), U and J are only
+         supported in global scenes*/
+        const isGlobal = ((_a = this === null || this === void 0 ? void 0 : this.view) === null || _a === void 0 ? void 0 : _a.viewingMode) === 'global' ? true : false;
+        const allMessages = (this === null || this === void 0 ? void 0 : this.messages)
+            ? [
+                {
+                    alias: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.arrowKeys,
+                    title: this === null || this === void 0 ? void 0 : this.messages.mapShortcuts.nudge,
+                    show: isGlobal ? true : false,
+                },
+                {
+                    alias: 'P',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.P,
+                    show: true,
+                },
+                {
+                    alias: 'N',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.N,
+                    show: true,
+                },
+                {
+                    alias: 'W',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.W,
+                    show: true,
+                },
+                {
+                    alias: 'A',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.A,
+                    show: true,
+                },
+                {
+                    alias: 'D',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.D,
+                    show: true,
+                },
+                {
+                    alias: 'S',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.S,
+                    show: true,
+                },
+                {
+                    alias: 'J',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.globalCommands.J,
+                    show: isGlobal ? true : false,
+                },
+                {
+                    alias: 'U',
+                    title: this === null || this === void 0 ? void 0 : this.messages.sceneShortcuts.globalCommands.U,
+                    show: isGlobal ? true : false,
+                },
+            ]
+            : [];
+        return (this === null || this === void 0 ? void 0 : this.messages)
+            ? allMessages === null || allMessages === void 0 ? void 0 : allMessages.filter(m => {
+                return m.show;
+            })
+            : [];
+    }
+    /* _parseMessageValues(data) {
+      return Object.keys(data).map(key => ({ alias: key, title: data[key] }));
+    }*/
+    _isMacLike() {
+        return /(Mac)/i.test(navigator.platform);
+    }
+    get el() { return index.getElement(this); }
+};
+InstantAppsKeyboardShortcuts.style = instantAppsKeyboardShortcutsCss;
+
+exports.instant_apps_keyboard_shortcuts = InstantAppsKeyboardShortcuts;

package/dist/cjs/instant-apps-landing-page.cjs.entry.js

@@ -0,0 +1,104 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b8a649fc.js');
+
+var AlignmentPositions;
+(function (AlignmentPositions) {
+  AlignmentPositions["TopLeft"] = "top-left";
+  AlignmentPositions["TopCenter"] = "top-center";
+  AlignmentPositions["TopRight"] = "top-right";
+  AlignmentPositions["CenterLeft"] = "center-left";
+  AlignmentPositions["Center"] = "center";
+  AlignmentPositions["CenterRight"] = "center-right";
+  AlignmentPositions["BottomLeft"] = "bottom-left";
+  AlignmentPositions["BottomCenter"] = "bottom-center";
+  AlignmentPositions["BottomRight"] = "bottom-right";
+})(AlignmentPositions || (AlignmentPositions = {}));
+
+const instantAppsLandingPageCss = ":host{--instant-apps-landing-page-background-color:var(--calcite-ui-brand);--instant-apps-landing-page-text-color:var(--calcite-ui-text-inverse);--instant-apps-landing-page-entry-button-color:var(--calcite-ui-brand);--instant-apps-landing-page-title-text-font-size:var(--calcite-font-size-6);--instant-apps-landing-page-subtitle-text-font-size:var(--calcite-font-size-3);--instant-apps-landing-page-description-text-font-size:var(--calcite-font-size-0);--instant-apps-landing-page-icon-image-scale--s:100px;--instant-apps-landing-page-icon-image-scale--m:250px;--instant-apps-landing-page-icon-image-scale--l:500px;--instant-apps-landing-page-entry-button-margin:0}:host .instant-apps-landing-page{box-sizing:border-box;position:absolute;top:0;left:0;z-index:9000;display:flex;flex-direction:column;width:100%;height:100%;padding:2.5%;transition:top 0.5s ease-in-out;background-color:var(--instant-apps-landing-page-background-color);color:var(--instant-apps-landing-page-text-color)}:host .instant-apps-landing-page__title-text{color:var(--instant-apps-landing-page-text-color);font-size:var(--instant-apps-landing-page-title-text-font-size);margin:0}:host .instant-apps-landing-page__subtitle-text{font-weight:var(--calcite-font-weight-medium);font-size:var(--instant-apps-landing-page-subtitle-text-font-size);text-align:center}:host .instant-apps-landing-page__description-text{font-size:var(--instant-apps-landing-page-description-text-font-size);width:50%;min-width:250px}:host .instant-apps-landing-page__title-text,:host .instant-apps-landing-page__subtitle-text{text-shadow:0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.1), 0px 18px 23px rgba(0, 0, 0, 0.1)}:host .instant-apps-landing-page__icon-image{margin-bottom:5px;max-width:50%}:host .instant-apps-landing-page__icon-image-scale--s{width:100px}:host .instant-apps-landing-page__icon-image-scale--m{width:250px}:host .instant-apps-landing-page__icon-image-scale--l{width:500px}:host .instant-apps-landing-page__button-container{display:flex}:host .instant-apps-landing-page__button-container .instant-apps-landing-page__entry-button{margin:var(--instant-apps-landing-page-entry-button-margin)}:host .instant-apps-landing-page__entry-button{--calcite-ui-brand:var(--instant-apps-landing-page-entry-button-color);--calcite-ui-brand-hover:var(--instant-apps-landing-page-entry-button-color);--calcite-ui-brand-press:var(--instant-apps-landing-page-entry-button-color)}:host .instant-apps-landing-page__remove-transition{transition:none}:host .instant-apps-landing-page--closed-no-transition{display:none}:host .instant-apps-landing-page--closed{top:-100%}:host .instant-apps-landing-page__alignment--top-center{justify-content:flex-start;align-items:center}:host .instant-apps-landing-page__alignment--top-center .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:center;justify-content:center}:host .instant-apps-landing-page__alignment--top-center .instant-apps-landing-page__description-text{text-align:center}:host .instant-apps-landing-page__alignment--center{justify-content:center;align-items:center}:host .instant-apps-landing-page__alignment--center .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:center}:host .instant-apps-landing-page__alignment--center .instant-apps-landing-page__description-text{text-align:center}:host .instant-apps-landing-page__alignment--bottom-center{justify-content:flex-end;align-items:center}:host .instant-apps-landing-page__alignment--bottom-center .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:center}:host .instant-apps-landing-page__alignment--bottom-center .instant-apps-landing-page__description-text{text-align:center}:host .instant-apps-landing-page__alignment--top-left{justify-content:flex-start;align-items:flex-start}:host .instant-apps-landing-page__alignment--top-left .instant-apps-landing-page__description-text{text-align:left}:host .instant-apps-landing-page__alignment--center-left{justify-content:center;align-items:flex-start}:host .instant-apps-landing-page__alignment--center-left .instant-apps-landing-page__description-text{text-align:left}:host .instant-apps-landing-page__alignment--bottom-left{justify-content:flex-end;align-items:flex-start}:host .instant-apps-landing-page__alignment--bottom-left .instant-apps-landing-page__description-text{text-align:left}:host .instant-apps-landing-page__alignment--top-right{justify-content:flex-start;align-items:flex-end}:host .instant-apps-landing-page__alignment--top-right .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:flex-end}:host .instant-apps-landing-page__alignment--top-right .instant-apps-landing-page__description-text{text-align:right}:host .instant-apps-landing-page__alignment--center-right{justify-content:center;align-items:flex-end}:host .instant-apps-landing-page__alignment--center-right .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:flex-end}:host .instant-apps-landing-page__alignment--center-right .instant-apps-landing-page__description-text{text-align:right}:host .instant-apps-landing-page__alignment--bottom-right{justify-content:flex-end;align-items:flex-end}:host .instant-apps-landing-page__alignment--bottom-right .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:flex-end}:host .instant-apps-landing-page__alignment--bottom-right .instant-apps-landing-page__description-text{text-align:right}@media only screen and (max-width: 768px){:host .instant-apps-landing-page__icon-image{max-width:70%;margin-bottom:20px}:host .instant-apps-landing-page__description-text{width:80%}:host .instant-apps-landing-page__title-text{font-size:var(--calcite-font-size-3)}:host .instant-apps-landing-page__subtitle-text{font-size:var(--calcite-font-size-0)}:host .instant-apps-landing-page__content-container{display:flex;flex-direction:column;align-items:center;margin-top:auto}:host .instant-apps-landing-page__button-container{display:flex;flex-direction:column;width:100%;margin-top:auto}:host .instant-apps-landing-page__button-container .instant-apps-landing-page__entry-button{width:100%;margin-right:unset;margin-bottom:10px}}@media only screen and (max-width: 896px) and (orientation: landscape){:host .instant-apps-landing-page__icon-image{max-width:25%}}";
+
+const CSS = {
+    BASE: 'instant-apps-landing-page',
+    titleText: 'instant-apps-landing-page__title-text',
+    subtitleText: 'instant-apps-landing-page__subtitle-text',
+    descriptionText: 'instant-apps-landing-page__description-text',
+    closed: 'instant-apps-landing-page--closed',
+    closedNoTransition: 'instant-apps-landing-page--closed-no-transition',
+    iconImage: 'instant-apps-landing-page__icon-image',
+    removeTransition: 'instant-apps-landing-page__remove-transition',
+    alignment: 'instant-apps-landing-page__alignment--',
+    entryButton: 'instant-apps-landing-page__entry-button',
+    contentContainer: 'instant-apps-landing-page__content-container',
+    buttonContainer: 'instant-apps-landing-page__button-container',
+    iconImageScale: {
+        s: ' instant-apps-landing-page__icon-image-scale--s',
+        m: ' instant-apps-landing-page__icon-image-scale--m',
+        l: ' instant-apps-landing-page__icon-image-scale--l',
+    },
+};
+const InstantAppsLandingPage = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.titleText = undefined;
+        this.subtitleText = undefined;
+        this.descriptionText = undefined;
+        this.entryButtonText = undefined;
+        this.iconImage = undefined;
+        this.iconImageScale = 'm';
+        this.iconImageAltText = undefined;
+        this.alignment = AlignmentPositions.Center;
+        this.disableTransition = true;
+        this.backgroundImageSrc = undefined;
+        this.open = true;
+        this.entryButtonScale = 'l';
+    }
+    render() {
+        return index.h(index.Host, null, this.renderLandingPageContent());
+    }
+    renderLandingPageContent() {
+        const closed = !this.open ? (this.disableTransition ? ` ${CSS.closedNoTransition}` : ` ${CSS.closed}`) : '';
+        const alignmentClass = this.getAlignmentClass();
+        const removeTransition = this.disableTransition ? ` ${CSS.removeTransition}` : '';
+        return (index.h("div", { style: this.backgroundImageSrc
+                ? {
+                    backgroundSize: 'cover',
+                    backgroundImage: `url("${this.backgroundImageSrc}")`,
+                    backgroundRepeat: 'no-repeat',
+                }
+                : {}, class: `${CSS.BASE}${alignmentClass}${closed}${removeTransition}` }, index.h("div", { class: CSS.contentContainer }, this.renderIconImage(), this.renderTitleText(), this.renderSubtitleText(), this.renderDescriptionText()), index.h("div", { class: CSS.buttonContainer }, this.renderEntryButton(), index.h("slot", { name: "secondary-action" }))));
+    }
+    renderIconImage() {
+        return this.iconImage ? index.h("img", { class: `${CSS.iconImage}${this.getIconImageScale()}`, src: this.iconImage, alt: this.iconImageAltText }) : null;
+    }
+    renderTitleText() {
+        return index.h("h1", { class: CSS.titleText }, this.titleText);
+    }
+    renderSubtitleText() {
+        return index.h("span", { class: CSS.subtitleText }, this.subtitleText);
+    }
+    renderDescriptionText() {
+        return index.h("p", { class: CSS.descriptionText }, this.descriptionText);
+    }
+    renderEntryButton() {
+        return (index.h("calcite-button", { class: CSS.entryButton, onClick: () => (this.open = false), scale: this.entryButtonScale, appearance: "outline-fill" }, this.entryButtonText));
+    }
+    getAlignmentClass() {
+        return ` ${CSS.alignment}${this.alignment}`;
+    }
+    getIconImageScale() {
+        const { iconImageScale } = this;
+        const { s, m, l } = CSS.iconImageScale;
+        return iconImageScale === 'l' ? l : iconImageScale === 's' ? s : m;
+    }
+    get el() { return index.getElement(this); }
+};
+InstantAppsLandingPage.style = instantAppsLandingPageCss;
+
+exports.instant_apps_landing_page = InstantAppsLandingPage;

package/dist/cjs/instant-apps-language-switcher.cjs.entry.js

@@ -0,0 +1,177 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-b8a649fc.js');
+const utils = require('./utils-41eb3a01.js');
+const loadModules = require('./loadModules-1d0f0316.js');
+const locale = require('./locale-56c3447b.js');
+const languageSwitcher = require('./languageSwitcher-cae609d9.js');
+require('./index-22bb61da.js');
+require('./esri-loader-a91c0ec1.js');
+require('./_commonjsHelpers-384729db.js');
+require('./languageUtil-a3b464f8.js');
+
+const instantAppsLanguageSwitcherCss = ":host{display:block;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1);min-width:200px}:host calcite-dropdown{width:100%}:host calcite-button{--calcite-ui-brand:var(--calcite-ui-text-3);--calcite-ui-brand-hover:var(--calcite-ui-text-3)}";
+
+const InstantAppsLanguageSwitcher = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.selectedLanguageUpdated = index.createEvent(this, "selectedLanguageUpdated", 7);
+        this.icon = 'language';
+        this.portalItem = undefined;
+        this.view = undefined;
+        this.locales = [];
+        this.defaultLocale = undefined;
+        this.messages = undefined;
+        this.selectedLanguage = null;
+        this.t9nData = null;
+    }
+    async componentWillLoad() {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        const [intl, WebMap, request] = await loadModules.loadModules(['esri/intl', 'esri/WebMap', 'esri/request']);
+        this.intl = intl;
+        this.request = request;
+        this.messages = await utils.getMessages(document.createElement('instant-apps-language-translator'));
+        try {
+            this.portalItemResource = (await languageSwitcher.getPortalItemResource(this.portalItem));
+            const t9nData = await languageSwitcher.fetchResourceData(request, this.portalItemResource);
+            this.t9nData = t9nData !== null && t9nData !== void 0 ? t9nData : {};
+        }
+        catch (err) {
+            this.t9nData = {};
+            console.error('NO PORTAL ITEM RESOURCE AVAILABLE.');
+        }
+        finally {
+            // Language that the app was configured in
+            this.userLocale = this.defaultLocale;
+            // Language from URL parameter
+            const params = new URLSearchParams(window.location.search);
+            const localeUrlParam = params.get('locale');
+            const localeUrlFromParamExists = ((_c = (_b = (_a = this.locales) === null || _a === void 0 ? void 0 : _a.map(locale => locale === null || locale === void 0 ? void 0 : locale.locale)) === null || _b === void 0 ? void 0 : _b.filter(localeFlag => localeFlag === localeUrlParam)) === null || _c === void 0 ? void 0 : _c.length) > 0;
+            // Browser's default language
+            const defaultLangauge = locale.getDefaultLanguage(intl, this.portalItem.portal);
+            const localeFromDefaultLanguageExists = ((_f = (_e = (_d = this.locales) === null || _d === void 0 ? void 0 : _d.map(locale => locale === null || locale === void 0 ? void 0 : locale.locale)) === null || _e === void 0 ? void 0 : _e.filter(localeFlag => localeFlag === defaultLangauge)) === null || _f === void 0 ? void 0 : _f.length) > 0;
+            this.selectedLanguage = localeUrlFromParamExists ? localeUrlParam : localeFromDefaultLanguageExists ? defaultLangauge : this.userLocale;
+            const selectedLanguage = this.selectedLanguage;
+            if (selectedLanguage !== this.userLocale) {
+                this.calciteDropdownItemSelectCallback(selectedLanguage)();
+                this.selectedLanguageUpdated.emit({ locale: selectedLanguage, data: (_h = (_g = this.t9nData) === null || _g === void 0 ? void 0 : _g[selectedLanguage]) !== null && _h !== void 0 ? _h : null });
+            }
+            if (this.view) {
+                const webmap = this.view.map;
+                this.defaultWebMapId = webmap.portalItem.id;
+                const translatedWebmap = (_l = (_k = (_j = this.locales) === null || _j === void 0 ? void 0 : _j.filter(localeItem => (localeItem === null || localeItem === void 0 ? void 0 : localeItem.webmap) && (localeItem === null || localeItem === void 0 ? void 0 : localeItem.webmap) !== this.defaultWebMapId && (localeItem === null || localeItem === void 0 ? void 0 : localeItem.locale) === this.selectedLanguage)) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.webmap;
+                if (translatedWebmap) {
+                    this.view.map = new WebMap({
+                        portalItem: {
+                            id: translatedWebmap,
+                        },
+                    });
+                }
+            }
+        }
+    }
+    render() {
+        const trigger = this.renderTrigger();
+        const dropdown = this.renderDropdownItems();
+        const defaultLocale = this.renderDefaultLocale();
+        return (index.h("calcite-dropdown", { onCalciteDropdownBeforeOpen: () => (this.trigger.iconEnd = 'chevron-up'), onCalciteDropdownBeforeClose: () => (this.trigger.iconEnd = 'chevron-down'), width: "m" }, trigger, defaultLocale, dropdown));
+    }
+    renderDefaultLocale() {
+        const { userLocale } = this;
+        return (index.h("calcite-dropdown-item", { key: `default-${userLocale}`, value: userLocale, onCalciteDropdownItemSelect: this.calciteDropdownItemSelectCallback(userLocale), selected: this.selectedLanguage === this.userLocale }, this.getSelectedLanguageText(userLocale)));
+    }
+    renderTrigger() {
+        return (index.h("calcite-button", { ref: node => (this.trigger = node), slot: "trigger", "icon-start": this.icon, "icon-end": "chevron-down", width: "full", appearance: "outline" }, this.getSelectedLanguageText(this.selectedLanguage)));
+    }
+    renderDropdownItems() {
+        var _a, _b;
+        return (_b = (_a = this.locales) === null || _a === void 0 ? void 0 : _a.map(localeItem => localeItem.locale)) === null || _b === void 0 ? void 0 : _b.map(translatedLanguage => this.renderDropdownItem(translatedLanguage));
+    }
+    renderDropdownItem(translatedLanguage) {
+        const text = this.getSelectedLanguageText(translatedLanguage);
+        const selected = translatedLanguage === this.selectedLanguage;
+        return (index.h("calcite-dropdown-item", { key: translatedLanguage, value: translatedLanguage, selected: selected, onCalciteDropdownItemSelect: this.calciteDropdownItemSelectCallback(translatedLanguage) }, text));
+    }
+    calciteDropdownItemSelectCallback(translatedLanguage) {
+        return async () => {
+            var _a, _b, _c, _d, _e;
+            this.selectedLanguage = translatedLanguage;
+            const { intl, selectedLanguage, t9nData, userLocale } = this;
+            const eventData = this.locales.filter(locale => locale.locale === selectedLanguage)[0];
+            if (selectedLanguage !== userLocale)
+                eventData['data'] = t9nData[translatedLanguage];
+            const params = new URLSearchParams(window.location.search);
+            if (selectedLanguage !== userLocale) {
+                // Set url parameter 'locale' with value
+                params.set('locale', this.selectedLanguage);
+            }
+            else {
+                params.delete('locale');
+            }
+            intl.setLocale(selectedLanguage);
+            if (this.view) {
+                const [WebMap] = await loadModules.loadModules(['esri/WebMap']);
+                const webmap = (_b = (_a = this.locales.filter(localeItem => localeItem.locale === selectedLanguage)) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.webmap;
+                if (webmap) {
+                    this.view.map = new WebMap({
+                        portalItem: {
+                            id: webmap,
+                        },
+                    });
+                }
+                else {
+                    const currentMapId = (_e = (_d = (_c = this.view) === null || _c === void 0 ? void 0 : _c.map) === null || _d === void 0 ? void 0 : _d.portalItem) === null || _e === void 0 ? void 0 : _e.id;
+                    if (currentMapId && this.defaultWebMapId !== currentMapId) {
+                        this.view.map = new WebMap({
+                            portalItem: {
+                                id: this.defaultWebMapId,
+                            },
+                        });
+                    }
+                }
+            }
+            document.documentElement.setAttribute('lang', this.selectedLanguage);
+            const prefersRTL = this.intl.prefersRTL();
+            if (prefersRTL) {
+                document.documentElement.setAttribute('dir', 'rtl');
+            }
+            else {
+                document.documentElement.setAttribute('dir', 'ltr');
+            }
+            window.history.replaceState({}, '', decodeURIComponent(`${window.location.pathname}?${params}`));
+            this.selectedLanguageUpdated.emit(eventData);
+        };
+    }
+    getSelectedLanguageText(translatedLanguage) {
+        const { messages } = this;
+        const translatedLanguageNames = messages === null || messages === void 0 ? void 0 : messages.translatedLanguageNames;
+        const enLanguageNames = messages === null || messages === void 0 ? void 0 : messages.languages;
+        const translatedLanguageName = translatedLanguageNames === null || translatedLanguageNames === void 0 ? void 0 : translatedLanguageNames[translatedLanguage];
+        const enLanguageName = enLanguageNames === null || enLanguageNames === void 0 ? void 0 : enLanguageNames[translatedLanguage];
+        return `${translatedLanguageName} - ${enLanguageName}`;
+    }
+    /**
+     * Refreshes the component by fetching the latest translation data from the portal item resource.
+     */
+    async refresh() {
+        try {
+            const resource = (await languageSwitcher.getPortalItemResource(this.portalItem));
+            const t9nData = await languageSwitcher.fetchResourceData(this.request, resource);
+            this.t9nData = t9nData;
+            const refreshedData = { locale: this.selectedLanguage, data: t9nData[this.selectedLanguage] };
+            this.selectedLanguageUpdated.emit(refreshedData);
+        }
+        catch (_a) { }
+    }
+    get el() { return index.getElement(this); }
+};
+InstantAppsLanguageSwitcher.style = instantAppsLanguageSwitcherCss;
+
+exports.instant_apps_language_switcher = InstantAppsLanguageSwitcher;