@esri/solutions-components 0.8.11 → 0.8.13

package/dist/cjs/ExpandToggle-249fdc45.js

@@ -0,0 +1,118 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const index = require('./index-79b35510.js');
+const dom = require('./dom-1c78fa73.js');
+const resources$1 = require('./resources-f9c93f5a.js');
+const resources = require('./resources-144a98da.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+const overflowActionsDebounceInMs = 150;
+const groupBufferPx = 2;
+const getAverage = (arr) => arr.reduce((p, c) => p + c, 0) / arr.length;
+const geActionDimensions = (actions) => {
+    const actionsNotSlotted = actions.filter((action) => action.slot !== resources$1.SLOTS.menuActions);
+    const actionLen = actionsNotSlotted?.length;
+    return {
+        actionWidth: actionLen ? getAverage(actionsNotSlotted.map((action) => action.clientWidth || 0)) : 0,
+        actionHeight: actionLen ? getAverage(actionsNotSlotted.map((action) => action.clientHeight || 0)) : 0,
+    };
+};
+const getMaxActionCount = ({ width, actionWidth, layout, height, actionHeight, groupCount, }) => {
+    const maxContainerPx = layout === "horizontal" ? width : height;
+    const avgItemPx = layout === "horizontal" ? actionWidth : actionHeight;
+    return Math.floor((maxContainerPx - groupCount * groupBufferPx) / avgItemPx);
+};
+const getOverflowCount = ({ layout, actionCount, actionWidth, width, actionHeight, height, groupCount, }) => {
+    return Math.max(actionCount - getMaxActionCount({ width, actionWidth, layout, height, actionHeight, groupCount }), 0);
+};
+const queryActions = (el) => {
+    return Array.from(el.querySelectorAll("calcite-action")).filter((action) => action.closest("calcite-action-menu") ? action.slot === resources.SLOTS.trigger : true);
+};
+const overflowActions = ({ actionGroups, expanded, overflowCount, }) => {
+    let needToSlotCount = overflowCount;
+    actionGroups.reverse().forEach((group) => {
+        let slottedWithinGroupCount = 0;
+        const groupActions = queryActions(group).reverse();
+        groupActions.forEach((groupAction) => {
+            if (groupAction.slot === resources$1.SLOTS.menuActions) {
+                groupAction.removeAttribute("slot");
+                groupAction.textEnabled = expanded;
+            }
+        });
+        if (needToSlotCount > 0) {
+            groupActions.some((groupAction) => {
+                const unslottedActions = groupActions.filter((action) => !action.slot);
+                if (unslottedActions.length > 1 && groupActions.length > 2 && !groupAction.closest("calcite-action-menu")) {
+                    groupAction.textEnabled = true;
+                    groupAction.setAttribute("slot", resources$1.SLOTS.menuActions);
+                    slottedWithinGroupCount++;
+                    if (slottedWithinGroupCount > 1) {
+                        needToSlotCount--;
+                    }
+                }
+                return needToSlotCount < 1;
+            });
+        }
+        index.forceUpdate(group);
+    });
+};
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+const ICONS = {
+    chevronsLeft: "chevrons-left",
+    chevronsRight: "chevrons-right",
+};
+function getCalcitePosition(position, el) {
+    return position || el.closest("calcite-shell-panel")?.position || "start";
+}
+function toggleChildActionText({ el, expanded, }) {
+    queryActions(el)
+        .filter((el) => el.slot !== resources$1.SLOTS.menuActions)
+        .forEach((action) => (action.textEnabled = expanded));
+    el.querySelectorAll("calcite-action-group, calcite-action-menu").forEach((el) => (el.expanded = expanded));
+}
+const setTooltipReference = ({ tooltip, referenceElement, expanded, ref, }) => {
+    if (tooltip) {
+        tooltip.referenceElement = !expanded && referenceElement ? referenceElement : null;
+    }
+    if (ref) {
+        ref(referenceElement);
+    }
+    return referenceElement;
+};
+const ExpandToggle = ({ expanded, expandText, collapseText, toggle, el, position, tooltip, ref, scale, }) => {
+    const rtl = dom.getElementDir(el) === "rtl";
+    const text = expanded ? collapseText : expandText;
+    const icons = [ICONS.chevronsLeft, ICONS.chevronsRight];
+    if (rtl) {
+        icons.reverse();
+    }
+    const end = getCalcitePosition(position, el) === "end";
+    const expandIcon = end ? icons[1] : icons[0];
+    const collapseIcon = end ? icons[0] : icons[1];
+    const actionNode = (index.h("calcite-action", { icon: expanded ? expandIcon : collapseIcon, onClick: toggle, scale: scale, text: text, textEnabled: expanded, title: !expanded && !tooltip ? text : null,
+        // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
+        ref: (referenceElement) => setTooltipReference({ tooltip, referenceElement, expanded, ref }) }));
+    return actionNode;
+};
+
+exports.ExpandToggle = ExpandToggle;
+exports.geActionDimensions = geActionDimensions;
+exports.getOverflowCount = getOverflowCount;
+exports.overflowActions = overflowActions;
+exports.overflowActionsDebounceInMs = overflowActionsDebounceInMs;
+exports.queryActions = queryActions;
+exports.toggleChildActionText = toggleChildActionText;

package/dist/cjs/FloatingArrow-28abf7c7.js

@@ -0,0 +1,50 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const index = require('./index-79b35510.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+const CSS = {
+    arrow: "calcite-floating-ui-arrow",
+    arrowStroke: "calcite-floating-ui-arrow__stroke",
+};
+const DEFAULTS = {
+    width: 12,
+    height: 6,
+    strokeWidth: 1,
+};
+/**
+ * Renders a SVG element to be used as a floating-ui arrow.
+ *
+ * This functional component should be rendered inside a `FloatingUIComponent` when it needs an arrow element.
+ *
+ * @param floatingLayout.floatingLayout
+ * @param floatingLayout – The effective floating layout to render the arrow vertically or horizontally. Possible values: `vertical` or `horizontal`.
+ *
+ * See [floating-ui](https://github.com/Esri/calcite-design-system/blob/main/src/utils/floating-ui.ts)
+ * @param floatingLayout.key
+ * @param floatingLayout.ref
+ */
+const FloatingArrow = ({ floatingLayout, key, ref, }) => {
+    const { width, height, strokeWidth } = DEFAULTS;
+    const svgX = width / 2;
+    const isVertical = floatingLayout === "vertical";
+    const dValue = "M0,0" +
+        ` H${width}` +
+        ` L${width - svgX},${height}` +
+        ` Q${svgX},${height} ${svgX},${height}` +
+        " Z";
+    return (index.h("svg", { "aria-hidden": "true", class: CSS.arrow, height: width, key: key, viewBox: `0 0 ${width} ${width + (!isVertical ? strokeWidth : 0)}`, width: width + (isVertical ? strokeWidth : 0),
+        // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
+        ref: ref }, strokeWidth > 0 && (index.h("path", { class: CSS.arrowStroke, d: dValue, fill: "none", "stroke-width": strokeWidth + 1 })), index.h("path", { d: dValue, stroke: "none" })));
+};
+
+exports.FloatingArrow = FloatingArrow;

package/dist/cjs/Heading-1f831135.js

@@ -0,0 +1,25 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const index = require('./index-79b35510.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+function constrainHeadingLevel(level) {
+    return Math.min(Math.max(Math.ceil(level), 1), 6);
+}
+const Heading = (props, children) => {
+    const HeadingTag = props.level ? `h${props.level}` : "div";
+    delete props.level;
+    return index.h(HeadingTag, { ...props }, children);
+};
+
+exports.Heading = Heading;
+exports.constrainHeadingLevel = constrainHeadingLevel;

package/dist/cjs/Validation-eb9afded.js

@@ -0,0 +1,20 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const index = require('./index-79b35510.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+const CSS = {
+    validationContainer: "validation-container",
+};
+const Validation = ({ scale, status, icon, message, }) => (index.h("div", { class: CSS.validationContainer }, index.h("calcite-input-message", { icon: icon, scale: scale, status: status }, message)));
+
+exports.Validation = Validation;

package/dist/cjs/app-globals-6acebf3e.js

@@ -0,0 +1,69 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const resources = require('./resources-1c0e54c1.js');
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+/**
+ * Emits when the mode is dynamically toggled between light and dark on <body> or in OS preferences.
+ */
+function initModeChangeEvent() {
+    const { classList } = document.body;
+    const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    const getMode = () => classList.contains(resources.darkMode) || (classList.contains(resources.autoMode) && prefersDark) ? "dark" : "light";
+    const emitModeChange = (mode) => document.body.dispatchEvent(new CustomEvent("calciteModeChange", { bubbles: true, detail: { mode } }));
+    const modeChangeHandler = (newMode) => {
+        currentMode !== newMode && emitModeChange(newMode);
+        currentMode = newMode;
+    };
+    let currentMode = getMode();
+    // emits event on page load
+    emitModeChange(currentMode);
+    // emits event when changing OS mode preferences
+    window
+        .matchMedia("(prefers-color-scheme: dark)")
+        .addEventListener("change", (event) => modeChangeHandler(event.matches ? "dark" : "light"));
+    // emits event when toggling between mode classes on <body>
+    new MutationObserver(() => modeChangeHandler(getMode())).observe(document.body, {
+        attributes: true,
+        attributeFilter: ["class"],
+    });
+}
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+/**
+ * This file is imported in Stencil's `globalScript` config option.
+ *
+ * @see {@link https://stenciljs.com/docs/config#globalscript}
+ */
+function appGlobalScript () {
+    const isBrowser = typeof window !== "undefined" &&
+        typeof location !== "undefined" &&
+        typeof document !== "undefined" &&
+        window.location === location &&
+        window.document === document;
+    if (isBrowser) {
+        if (document.readyState === "interactive") {
+            initModeChangeEvent();
+        }
+        else {
+            document.addEventListener("DOMContentLoaded", () => initModeChangeEvent(), { once: true });
+        }
+    }
+}
+
+const globalScripts = appGlobalScript;
+
+exports.globalScripts = globalScripts;

package/dist/cjs/ar-1013e0a6.js

@@ -0,0 +1,105 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+const calciteInputTimePicker_entry = require('./calcite-input-time-picker-ebdc5205.js');
+require('./index-79b35510.js');
+require('./form-a27f759c.js');
+require('./dom-1c78fa73.js');
+require('./guid-a7528dfa.js');
+require('./resources-1c0e54c1.js');
+require('./interactive-f08f0369.js');
+require('./browser-a96d0614.js');
+require('./key-7ed07912.js');
+require('./label-85cf6821.js');
+require('./component-d48747c9.js');
+require('./loadable-b374ef4b.js');
+require('./locale-5efdf085.js');
+require('./observers-4fa351d9.js');
+require('./focusTrapComponent-0c672330.js');
+require('./time-d250cbf5.js');
+require('./math-11993213.js');
+require('./t9n-9d199056.js');
+require('./openCloseComponent-6a283ac3.js');
+require('./Validation-eb9afded.js');
+
+// Arabic [ar]
+var months = 'يناير_فبراير_مارس_أبريل_مايو_يونيو_يوليو_أغسطس_سبتمبر_أكتوبر_نوفمبر_ديسمبر'.split('_');
+var symbolMap = {
+  1: '١',
+  2: '٢',
+  3: '٣',
+  4: '٤',
+  5: '٥',
+  6: '٦',
+  7: '٧',
+  8: '٨',
+  9: '٩',
+  0: '٠'
+};
+var numberMap = {
+  '١': '1',
+  '٢': '2',
+  '٣': '3',
+  '٤': '4',
+  '٥': '5',
+  '٦': '6',
+  '٧': '7',
+  '٨': '8',
+  '٩': '9',
+  '٠': '0'
+};
+var locale = {
+  name: 'ar',
+  weekdays: 'الأحد_الإثنين_الثلاثاء_الأربعاء_الخميس_الجمعة_السبت'.split('_'),
+  weekdaysShort: 'أحد_إثنين_ثلاثاء_أربعاء_خميس_جمعة_سبت'.split('_'),
+  weekdaysMin: 'ح_ن_ث_ر_خ_ج_س'.split('_'),
+  months: months,
+  monthsShort: months,
+  weekStart: 6,
+  meridiem: function meridiem(hour) {
+    return hour > 12 ? 'م' : 'ص';
+  },
+  relativeTime: {
+    future: 'بعد %s',
+    past: 'منذ %s',
+    s: 'ثانية واحدة',
+    m: 'دقيقة واحدة',
+    mm: '%d دقائق',
+    h: 'ساعة واحدة',
+    hh: '%d ساعات',
+    d: 'يوم واحد',
+    dd: '%d أيام',
+    M: 'شهر واحد',
+    MM: '%d أشهر',
+    y: 'عام واحد',
+    yy: '%d أعوام'
+  },
+  preparse: function preparse(string) {
+    return string.replace(/[١٢٣٤٥٦٧٨٩٠]/g, function (match) {
+      return numberMap[match];
+    }).replace(/،/g, ',');
+  },
+  postformat: function postformat(string) {
+    return string.replace(/\d/g, function (match) {
+      return symbolMap[match];
+    }).replace(/,/g, '،');
+  },
+  ordinal: function ordinal(n) {
+    return n;
+  },
+  formats: {
+    LT: 'HH:mm',
+    LTS: 'HH:mm:ss',
+    L: 'D/‏M/‏YYYY',
+    LL: 'D MMMM YYYY',
+    LLL: 'D MMMM YYYY HH:mm',
+    LLLL: 'dddd D MMMM YYYY HH:mm'
+  }
+};
+calciteInputTimePicker_entry.dayjs.locale(locale, null, true);
+
+exports['default'] = locale;

package/dist/cjs/arcgis-login.cjs.entry.js

@@ -7,9 +7,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-105cf2b9.js');
+const index = require('./index-79b35510.js');
 
 const arcgisLoginCss = ":host{display:block}";
+const ArcgisLoginStyle0 = arcgisLoginCss;
 
 const ArcgisLogin = class {
     constructor(hostRef) {
@@ -51,10 +52,10 @@ const ArcgisLogin = class {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (index.h(index.Host, null, index.h("slot", null)));
+        return (index.h(index.Host, { key: '7ef89062c15023c646a5134818900cc5b5ae2c43' }, index.h("slot", { key: 'a1698e009dd0e86591c4858f352186079e0299ed' })));
     }
     get el() { return index.getElement(this); }
 };
-ArcgisLogin.style = arcgisLoginCss;
+ArcgisLogin.style = ArcgisLoginStyle0;
 
 exports.arcgis_login = ArcgisLogin;

package/dist/cjs/array-550d54b1.js

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+'use strict';
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.8.2
+ */
+function getRoundRobinIndex(index, total) {
+    return (index + total) % total;
+}
+
+exports.getRoundRobinIndex = getRoundRobinIndex;

package/dist/cjs/basemap-gallery_7.cjs.entry.js

@@ -7,12 +7,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-105cf2b9.js');
-const locale = require('./locale-3d0a4bc2.js');
-require('./esri-loader-ce6c3d3d.js');
-require('./_commonjsHelpers-480c2e77.js');
+const index = require('./index-79b35510.js');
+const locale = require('./locale-48d76c59.js');
+require('./esri-loader-fce6a9cb.js');
 
 const basemapGalleryCss = ":host{display:block}";
+const BasemapGalleryStyle0 = basemapGalleryCss;
 
 const BasemapGallery = class {
     constructor(hostRef) {
@@ -56,7 +56,7 @@ const BasemapGallery = class {
      * StencilJS: Renders the component.
      */
     render() {
-        return (index.h(index.Host, null, index.h("div", { ref: (el) => { this._basemapElement = el; } })));
+        return (index.h(index.Host, { key: '9cef4efc85e1168ca8909f9e7d5cea48bf06b51c' }, index.h("div", { key: '837779b470b2170285fafeffa705d09f573dbfc6', ref: (el) => { this._basemapElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -116,9 +116,10 @@ const BasemapGallery = class {
         "mapView": ["mapViewWatchHandler"]
     }; }
 };
-BasemapGallery.style = basemapGalleryCss;
+BasemapGallery.style = BasemapGalleryStyle0;
 
 const floorFilterCss = ":host{display:block}";
+const FloorFilterStyle0 = floorFilterCss;
 
 const FloorFilter = class {
     constructor(hostRef) {
@@ -161,7 +162,7 @@ const FloorFilter = class {
         return this._initModules();
     }
     render() {
-        return (index.h(index.Host, null, index.h("div", { ref: (el) => { this._floorFilterElement = el; } })));
+        return (index.h(index.Host, { key: '14268f8fb66eb28085ce60b782b15f41285bf923' }, index.h("div", { key: 'c428424b3d639fa043fef55523de35a9bf07bda0', ref: (el) => { this._floorFilterElement = el; } })));
     }
     //--------------------------------------------------------------------------
     //
@@ -212,9 +213,10 @@ const FloorFilter = class {
         "mapView": ["mapViewWatchHandler"]
     }; }
 };
-FloorFilter.style = floorFilterCss;
+FloorFilter.style = FloorFilterStyle0;
 
 const mapFullscreenCss = ":host{display:block}";
+const MapFullscreenStyle0 = mapFullscreenCss;
 
 const MapFullscreen = class {
     constructor(hostRef) {
@@ -253,7 +255,7 @@ const MapFullscreen = class {
      * Renders the component.
      */
     render() {
-        return (index.h(index.Host, null, index.h("div", { class: "fullscreen-widget", ref: (el) => { this._fullscreenElement = el; } })));
+        return (index.h(index.Host, { key: '415fea7bdb4f9c26231f92f49ad6bb98bcdca22d' }, index.h("div", { key: '1888034532b129838472b4713f55b7ad23c8b3f0', class: "fullscreen-widget", ref: (el) => { this._fullscreenElement = el; } })));
     }
     /**
      * StencilJS: Called just after the component updates.
@@ -313,9 +315,10 @@ const MapFullscreen = class {
         "mapView": ["mapViewWatchHandler"]
     }; }
 };
-MapFullscreen.style = mapFullscreenCss;
+MapFullscreen.style = MapFullscreenStyle0;
 
 const mapLegendCss = ":host{display:block}";
+const MapLegendStyle0 = mapLegendCss;
 
 const MapLegend = class {
     constructor(hostRef) {
@@ -358,7 +361,7 @@ const MapLegend = class {
      * StencilJS: Renders the component.
      */
     render() {
-        return (index.h(index.Host, null, index.h("div", { ref: (el) => { this._legendElement = el; } })));
+        return (index.h(index.Host, { key: '032c6daa2f4c5d3bcbf83d776c68901c7c137781' }, index.h("div", { key: 'd773649fce8d3a0a4073ad017ae3906c1de98f07', ref: (el) => { this._legendElement = el; } })));
     }
     /**
      * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -407,9 +410,10 @@ const MapLegend = class {
         "mapView": ["mapViewWatchHandler"]
     }; }
 };
-MapLegend.style = mapLegendCss;
+MapLegend.style = MapLegendStyle0;
 
 const mapPickerCss = ":host{display:block;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.width-full{width:100%}.height-full{height:100%}.display-flex{display:flex}.border-bottom-1{border-width:0px;border-bottom-width:1px;border-style:solid;border-color:var(--calcite-color-border-3)}.action-bar-size{height:51px;width:100%}.map-list{position:absolute;display:flex;flex-direction:column;overflow:hidden;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-color-background);z-index:1000;width:100%;height:-moz-fit-content;height:fit-content}.display-none{display:none}.align-center{align-items:center}";
+const MapPickerStyle0 = mapPickerCss;
 
 const MapPicker = class {
     constructor(hostRef) {
@@ -475,7 +479,7 @@ const MapPicker = class {
      * Renders the component.
      */
     render() {
-        return (index.h(index.Host, null, this._getToolbar(), this._getMapNameList(this._mapListExpanded)));
+        return (index.h(index.Host, { key: 'f703ef70b12ffe3eaa83074a79bdbdf2233b3c30' }, this._getToolbar(), this._getMapNameList(this._mapListExpanded)));
     }
     /**
      * Called once after the component has loaded
@@ -565,9 +569,10 @@ const MapPicker = class {
         "mapInfos": ["mapInfosWatchHandler"]
     }; }
 };
-MapPicker.style = mapPickerCss;
+MapPicker.style = MapPickerStyle0;
 
 const mapSearchCss = ":host{display:block}.search-widget{width:100% !important;border:1px solid var(--calcite-color-border-input)}";
+const MapSearchStyle0 = mapSearchCss;
 
 const MapSearch = class {
     constructor(hostRef) {
@@ -633,7 +638,7 @@ const MapSearch = class {
      * Renders the component.
      */
     render() {
-        return (index.h(index.Host, null, index.h("div", { class: "search-widget", ref: (el) => { this._searchElement = el; } })));
+        return (index.h(index.Host, { key: 'fc649c2fbcb8b39c63408b942f9129dfdee0a99f' }, index.h("div", { key: '44461b45207d97e2329742f4d915945bd9364ef3', class: "search-widget", ref: (el) => { this._searchElement = el; } })));
     }
     //--------------------------------------------------------------------------
     //
@@ -734,9 +739,10 @@ const MapSearch = class {
         "mapView": ["mapViewWatchHandler"]
     }; }
 };
-MapSearch.style = mapSearchCss;
+MapSearch.style = MapSearchStyle0;
 
 const mapToolsCss = ":host{display:block}.display-none{display:none}.margin-top-1-2{margin-top:0.5rem}.square-32{width:32px;height:32px}.square-40{width:40px;height:40px}.square-48{width:48px;height:48px}.width-40{width:40px}.square-40-41{width:40px;height:41px}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.box-shadow{box-shadow:0 1px 2px rgba(0, 0, 0, 0.3)}.margin-bottom-1-2{margin-bottom:0.5rem}";
+const MapToolsStyle0 = mapToolsCss;
 
 const MapTools = class {
     constructor(hostRef) {
@@ -897,7 +903,7 @@ const MapTools = class {
         const toolMarginClass = this.enableSingleExpand ? "margin-top-1-2" : "";
         const toolOrder = this.toolOrder ? this.toolOrder : ["legend", "search", "fullscreen", "floorfilter"];
         const shadowClass = this.stackTools ? "box-shadow" : "";
-        return (index.h(index.Host, null, index.h("div", { class: containerClass }, this.enableSingleExpand ? (index.h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, index.h("div", { class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), index.h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), index.h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), index.h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), index.h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), index.h("floor-filter", { class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
+        return (index.h(index.Host, { key: '60d3373785662ecbc79249170fb7b854ade7a288' }, index.h("div", { key: 'caf43fd67ffed7a957d431537b794c54455507aa', class: containerClass }, this.enableSingleExpand ? (index.h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools()))) : undefined, index.h("div", { key: '646c6bb1edcd21069c5e925deeead0b2f1ada464', class: `${toolMarginClass} ${shadowClass} ${toolsClass}` }, this._getMapWidgets(toolOrder))), index.h("basemap-gallery", { key: '4ff407d51575c0efabb5e92f6834cb8a6ef9adfd', basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), index.h("map-search", { key: '7d54a20d8112db9384293829a85f5faecb67a631', class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, resultGraphicEnabled: true, searchConfiguration: this.searchConfiguration }), index.h("map-legend", { key: 'ddfafa37f9c1192c1851e2a314cc1062a314939a', class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), index.h("map-fullscreen", { key: 'af93e6c0f10249be6c9cc0a25e17d7d7e5726190', class: fullscreenClass, mapView: this.mapView, onFullscreenStateChange: (evt) => this._fullscreenStateChange(evt.detail), ref: (el) => { this._fullscreenElement = el; } }), index.h("floor-filter", { key: '0fdfbb13aee43e483946ee4c0169a47b12e6cfab', class: floorFilterClass, enabled: this.enableFloorFilter, mapView: this.mapView, ref: (el) => { this._floorFilterElement = el; } })));
     }
     //--------------------------------------------------------------------------
     //
@@ -1091,7 +1097,7 @@ const MapTools = class {
         "_showSearchWidget": ["_showSearchWidgetWatchHandler"]
     }; }
 };
-MapTools.style = mapToolsCss;
+MapTools.style = MapToolsStyle0;
 
 exports.basemap_gallery = BasemapGallery;
 exports.floor_filter = FloorFilter;