@esri/solutions-components 0.7.3 → 0.7.4

package/dist/components/instant-apps-interactive-legend.js

@@ -0,0 +1,217 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { proxyCustomElement, HTMLElement, forceUpdate, h } from '@stencil/core/internal/client';
+import { l as loadModules } from './loadModules2.js';
+import { g as getMessages } from './locale3.js';
+import { g as getTheme } from './helpers.js';
+import { d as defineCustomElement$e } from './action.js';
+import { d as defineCustomElement$d } from './button.js';
+import { d as defineCustomElement$c } from './icon.js';
+import { d as defineCustomElement$b } from './loader.js';
+import { d as defineCustomElement$a } from './tooltip.js';
+import { d as defineCustomElement$9 } from './instant-apps-interactive-legend-classic2.js';
+import { d as defineCustomElement$8 } from './instant-apps-interactive-legend-count2.js';
+import { d as defineCustomElement$7 } from './instant-apps-interactive-legend-group-legend-element2.js';
+import { d as defineCustomElement$6 } from './instant-apps-interactive-legend-layer-element2.js';
+import { d as defineCustomElement$5 } from './instant-apps-interactive-legend-layer-element-caption2.js';
+import { d as defineCustomElement$4 } from './instant-apps-interactive-legend-legend-element2.js';
+import { d as defineCustomElement$3 } from './instant-apps-interactive-legend-legend-element-caption2.js';
+import { d as defineCustomElement$2 } from './instant-apps-interactive-legend-relationship2.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$1 = /*@__PURE__*/ proxyCustomElement(class InstantAppsInteractiveLegend extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        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(() => {
+            forceUpdate(this.el);
+        });
+        observer.observe(this.el, {
+            attributes: true,
+        });
+        await this.initializeModules();
+    }
+    async componentDidLoad() {
+        getMessages(this);
+    }
+    async initializeModules() {
+        const [Handles, reactiveUtils, Widget, Legend] = await 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(['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 (h("div", { key: "interactive-legend", class: (_a = this.widget) === null || _a === void 0 ? void 0 : _a.classes(base, component, widget, widgetPanel) }, h("instant-apps-interactive-legend-classic", { key: "interactive-legend-classic", ref: (el) => (this.ref = el), class: 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 this; }
+    static get watchers() { return {
+        "handles": ["init"],
+        "reactiveUtils": ["init"],
+        "view": ["init"]
+    }; }
+    static get style() { return instantAppsInteractiveLegendCss; }
+}, [2, "instant-apps-interactive-legend", {
+        "view": [16],
+        "zoomTo": [4, "zoom-to"],
+        "featureCount": [4, "feature-count"],
+        "filterMode": [16],
+        "handles": [32],
+        "reactiveUtils": [32],
+        "legendvm": [32],
+        "widget": [32],
+        "messages": [32]
+    }, undefined, {
+        "handles": ["init"],
+        "reactiveUtils": ["init"],
+        "view": ["init"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["instant-apps-interactive-legend", "calcite-action", "calcite-button", "calcite-icon", "calcite-loader", "calcite-tooltip", "instant-apps-interactive-legend-classic", "instant-apps-interactive-legend-count", "instant-apps-interactive-legend-group-legend-element", "instant-apps-interactive-legend-layer-element", "instant-apps-interactive-legend-layer-element-caption", "instant-apps-interactive-legend-legend-element", "instant-apps-interactive-legend-legend-element-caption", "instant-apps-interactive-legend-relationship"];
+    components.forEach(tagName => { switch (tagName) {
+        case "instant-apps-interactive-legend":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, InstantAppsInteractiveLegend$1);
+            }
+            break;
+        case "calcite-action":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "calcite-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "calcite-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "calcite-loader":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "calcite-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "instant-apps-interactive-legend-classic":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "instant-apps-interactive-legend-count":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "instant-apps-interactive-legend-group-legend-element":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "instant-apps-interactive-legend-layer-element":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "instant-apps-interactive-legend-layer-element-caption":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "instant-apps-interactive-legend-legend-element":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "instant-apps-interactive-legend-legend-element-caption":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "instant-apps-interactive-legend-relationship":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const InstantAppsInteractiveLegend = InstantAppsInteractiveLegend$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { InstantAppsInteractiveLegend, defineCustomElement };

package/dist/components/instant-apps-keyboard-shortcuts.js

@@ -0,0 +1,211 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { g as getMessages } from './locale3.js';
+import { d as defineCustomElement$a } from './action.js';
+import { d as defineCustomElement$9 } from './action-menu.js';
+import { d as defineCustomElement$8 } from './block.js';
+import { d as defineCustomElement$7 } from './handle.js';
+import { d as defineCustomElement$6 } from './icon.js';
+import { d as defineCustomElement$5 } from './label2.js';
+import { d as defineCustomElement$4 } from './loader.js';
+import { d as defineCustomElement$3 } from './popover.js';
+import { d as defineCustomElement$2 } from './scrim.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$1 = /*@__PURE__*/ proxyCustomElement(class InstantAppsKeyboardShortcuts extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        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 (h(Host, null, 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 }, h("table", null, this.renderTableHeader(), h("tr", null, h("td", null, `${modifierKey} + M`), 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))), 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), h("table", null, this.renderTableHeader(), commands.map(command => {
+            return (h("tr", null, h("td", null, command.alias), h("td", null, command.title)));
+        })))));
+    }
+    componentDidLoad() {
+        getMessages(this);
+    }
+    renderTableHeader() {
+        var _a, _b;
+        return (this === null || this === void 0 ? void 0 : this.messages) ? (h("tr", null, h("th", null, (_a = this === null || this === void 0 ? void 0 : this.messages) === null || _a === void 0 ? void 0 : _a.generalShortcuts.shortcut), 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 this; }
+    static get style() { return instantAppsKeyboardShortcutsCss; }
+}, [1, "instant-apps-keyboard-shortcuts", {
+        "view": [16],
+        "messages": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["instant-apps-keyboard-shortcuts", "calcite-action", "calcite-action-menu", "calcite-block", "calcite-handle", "calcite-icon", "calcite-label", "calcite-loader", "calcite-popover", "calcite-scrim"];
+    components.forEach(tagName => { switch (tagName) {
+        case "instant-apps-keyboard-shortcuts":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, InstantAppsKeyboardShortcuts$1);
+            }
+            break;
+        case "calcite-action":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "calcite-action-menu":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "calcite-block":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "calcite-handle":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "calcite-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "calcite-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "calcite-loader":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "calcite-popover":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "calcite-scrim":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const InstantAppsKeyboardShortcuts = InstantAppsKeyboardShortcuts$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { InstantAppsKeyboardShortcuts, defineCustomElement };

package/dist/components/instant-apps-landing-page.js

@@ -0,0 +1,150 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$4 } from './button.js';
+import { d as defineCustomElement$3 } from './icon.js';
+import { d as defineCustomElement$2 } from './loader.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$1 = /*@__PURE__*/ proxyCustomElement(class InstantAppsLandingPage extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        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 h(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 (h("div", { style: this.backgroundImageSrc
+                ? {
+                    backgroundSize: 'cover',
+                    backgroundImage: `url("${this.backgroundImageSrc}")`,
+                    backgroundRepeat: 'no-repeat',
+                }
+                : {}, class: `${CSS.BASE}${alignmentClass}${closed}${removeTransition}` }, h("div", { class: CSS.contentContainer }, this.renderIconImage(), this.renderTitleText(), this.renderSubtitleText(), this.renderDescriptionText()), h("div", { class: CSS.buttonContainer }, this.renderEntryButton(), h("slot", { name: "secondary-action" }))));
+    }
+    renderIconImage() {
+        return this.iconImage ? h("img", { class: `${CSS.iconImage}${this.getIconImageScale()}`, src: this.iconImage, alt: this.iconImageAltText }) : null;
+    }
+    renderTitleText() {
+        return h("h1", { class: CSS.titleText }, this.titleText);
+    }
+    renderSubtitleText() {
+        return h("span", { class: CSS.subtitleText }, this.subtitleText);
+    }
+    renderDescriptionText() {
+        return h("p", { class: CSS.descriptionText }, this.descriptionText);
+    }
+    renderEntryButton() {
+        return (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 this; }
+    static get style() { return instantAppsLandingPageCss; }
+}, [1, "instant-apps-landing-page", {
+        "titleText": [1, "title-text"],
+        "subtitleText": [1, "subtitle-text"],
+        "descriptionText": [1, "description-text"],
+        "entryButtonText": [1, "entry-button-text"],
+        "iconImage": [1, "icon-image"],
+        "iconImageScale": [1, "icon-image-scale"],
+        "iconImageAltText": [1, "icon-image-alt-text"],
+        "alignment": [1],
+        "disableTransition": [4, "disable-transition"],
+        "backgroundImageSrc": [1, "background-image-src"],
+        "open": [1028],
+        "entryButtonScale": [1, "entry-button-scale"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["instant-apps-landing-page", "calcite-button", "calcite-icon", "calcite-loader"];
+    components.forEach(tagName => { switch (tagName) {
+        case "instant-apps-landing-page":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, InstantAppsLandingPage$1);
+            }
+            break;
+        case "calcite-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "calcite-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "calcite-loader":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const InstantAppsLandingPage = InstantAppsLandingPage$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { InstantAppsLandingPage, defineCustomElement };