@esri/solutions-components 0.6.5 → 0.6.6

package/dist/cjs/calcite-flow-item.cjs.entry.js

@@ -8,29 +8,28 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0e50040c.js');
-const dom = require('./dom-1eb1ded2.js');
-const interactive = require('./interactive-871d70ce.js');
-const loadable = require('./loadable-da060faa.js');
-const locale = require('./locale-37b9924d.js');
-const t9n = require('./t9n-a85989ef.js');
-const resources = require('./resources-8e2cc7f4.js');
-require('./guid-1b1fbdbc.js');
-require('./resources-f60f44b0.js');
-require('./browser-ecb3aabc.js');
-require('./key-7fbdf405.js');
-require('./observers-62c5955c.js');
+const dom = require('./dom-c1807fc1.js');
+const interactive = require('./interactive-2fe0f43a.js');
+const loadable = require('./loadable-bac9cdd6.js');
+const locale = require('./locale-c63a1b57.js');
+const t9n = require('./t9n-1d032c30.js');
+const resources = require('./resources-9f2b33ee.js');
+require('./guid-3abe3cc6.js');
+require('./resources-77713c2e.js');
+require('./key-b8b55ea3.js');
+require('./observers-f5fa975b.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 const CSS = {
-  backButton: "back-button"
+  backButton: "back-button",
 };
 const ICONS = {
   backLeft: "chevron-left",
-  backRight: "chevron-right"
+  backRight: "chevron-right",
 };
 const SLOTS = {
   actionBar: "action-bar",
@@ -40,10 +39,10 @@ const SLOTS = {
   headerContent: "header-content",
   fab: "fab",
   footer: "footer",
-  footerActions: "footer-actions"
+  footerActions: "footer-actions",
 };
 
-const flowItemCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden;--calcite-flow-item-footer-padding:0.5rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding:var(--calcite-flow-item-footer-padding)}";
+const flowItemCss = ":host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden;--calcite-flow-item-footer-padding:0.5rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding:var(--calcite-flow-item-footer-padding)}:host([hidden]){display:none}[hidden]{display:none}";
 
 const FlowItem = class {
   constructor(hostRef) {
@@ -85,7 +84,6 @@ const FlowItem = class {
     this.messageOverrides = undefined;
     this.messages = undefined;
     this.showBackButton = false;
-    this.backButtonEl = undefined;
     this.defaultMessages = undefined;
     this.effectiveLocale = "";
   }
@@ -129,13 +127,14 @@ const FlowItem = class {
    * Sets focus on the component.
    */
   async setFocus() {
-    await loadable.componentLoaded(this);
+    await loadable.componentFocusable(this);
     const { backButtonEl, containerEl } = this;
     if (backButtonEl) {
-      backButtonEl.setFocus();
-      return;
+      return backButtonEl.setFocus();
+    }
+    else if (containerEl) {
+      return containerEl.setFocus();
     }
-    containerEl === null || containerEl === void 0 ? void 0 : containerEl.setFocus();
   }
   /**
    * Scrolls the component's content to a specified set of coordinates.
@@ -163,16 +162,15 @@ const FlowItem = class {
     const { showBackButton, backButtonClick, messages } = this;
     const label = messages.back;
     const icon = rtl ? ICONS.backRight : ICONS.backLeft;
-    return showBackButton ? (index.h("calcite-action", { "aria-label": label, class: CSS.backButton, icon: icon, key: "flow-back-button", onClick: backButtonClick, scale: "s", slot: "header-actions-start", text: label,
+    return showBackButton ? (index.h("calcite-action", { "aria-label": label, class: CSS.backButton, icon: icon, key: "flow-back-button", onClick: backButtonClick, scale: "s", slot: "header-actions-start", text: label, title: label,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setBackRef })) : null;
   }
   render() {
-    const { closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, backButtonEl } = this;
-    const label = messages.back;
+    const { closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, } = this;
     return (index.h(index.Host, null, index.h("calcite-panel", { closable: closable, closed: closed, description: description, disabled: disabled, heading: heading, headingLevel: headingLevel, loading: loading, menuOpen: menuOpen, messageOverrides: messages, onCalcitePanelClose: this.handlePanelClose, onCalcitePanelScroll: this.handlePanelScroll,
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setContainerRef }, this.renderBackButton(), index.h("slot", { name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { name: SLOTS.footerActions, slot: resources.SLOTS.footerActions }), index.h("slot", { name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", null)), backButtonEl ? (index.h("calcite-tooltip", { closeOnClick: true, label: label, overlayPositioning: "fixed", placement: "top", referenceElement: backButtonEl }, label)) : null));
+      ref: this.setContainerRef }, this.renderBackButton(), index.h("slot", { name: SLOTS.actionBar, slot: resources.SLOTS.actionBar }), index.h("slot", { name: SLOTS.headerActionsStart, slot: resources.SLOTS.headerActionsStart }), index.h("slot", { name: SLOTS.headerActionsEnd, slot: resources.SLOTS.headerActionsEnd }), index.h("slot", { name: SLOTS.headerContent, slot: resources.SLOTS.headerContent }), index.h("slot", { name: SLOTS.headerMenuActions, slot: resources.SLOTS.headerMenuActions }), index.h("slot", { name: SLOTS.fab, slot: resources.SLOTS.fab }), index.h("slot", { name: SLOTS.footerActions, slot: resources.SLOTS.footerActions }), index.h("slot", { name: SLOTS.footer, slot: resources.SLOTS.footer }), index.h("slot", null))));
   }
   static get assetsDirs() { return ["assets"]; }
   get el() { return index.getElement(this); }

package/dist/cjs/calcite-flow.cjs.entry.js

@@ -8,20 +8,21 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0e50040c.js');
-const observers = require('./observers-62c5955c.js');
+const observers = require('./observers-f5fa975b.js');
+const loadable = require('./loadable-bac9cdd6.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 const CSS = {
   frame: "frame",
   frameAdvancing: "frame--advancing",
-  frameRetreating: "frame--retreating"
+  frameRetreating: "frame--retreating",
 };
 
-const flowCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0px}:host ::slotted(calcite-flow-item),:host ::slotted(calcite-panel){block-size:100%}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation:calcite-frame-advance var(--calcite-animation-timing)}:host .frame--retreating{animation:calcite-frame-retreat var(--calcite-animation-timing)}@keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}";
+const flowCss = ":host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0px}:host ::slotted(calcite-flow-item),:host ::slotted(calcite-panel){block-size:100%}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation:calcite-frame-advance var(--calcite-animation-timing)}:host .frame--retreating{animation:calcite-frame-retreat var(--calcite-animation-timing)}@keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Flow = class {
   constructor(hostRef) {
@@ -79,10 +80,18 @@ const Flow = class {
     const beforeBack = lastItem.beforeBack
       ? lastItem.beforeBack
       : () => Promise.resolve();
-    return beforeBack.call(lastItem).then(() => {
-      lastItem.remove();
-      return lastItem;
-    });
+    await beforeBack.call(lastItem);
+    lastItem.remove();
+    return lastItem;
+  }
+  /**
+   * Sets focus on the component.
+   */
+  async setFocus() {
+    await loadable.componentFocusable(this);
+    const { items } = this;
+    const activeItem = items[items.length - 1];
+    return activeItem === null || activeItem === void 0 ? void 0 : activeItem.setFocus();
   }
   // --------------------------------------------------------------------------
   //
@@ -94,6 +103,12 @@ const Flow = class {
     (_a = this.itemMutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
     this.updateFlowProps();
   }
+  async componentWillLoad() {
+    loadable.setUpLoadableComponent(this);
+  }
+  componentDidLoad() {
+    loadable.setComponentLoaded(this);
+  }
   disconnectedCallback() {
     var _a;
     (_a = this.itemMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
@@ -103,8 +118,9 @@ const Flow = class {
   //  Private Methods
   //
   // --------------------------------------------------------------------------
-  handleItemBackClick() {
-    this.back();
+  async handleItemBackClick() {
+    await this.back();
+    return this.setFocus();
   }
   // --------------------------------------------------------------------------
   //
@@ -116,7 +132,7 @@ const Flow = class {
     const frameDirectionClasses = {
       [CSS.frame]: true,
       [CSS.frameAdvancing]: flowDirection === "advancing",
-      [CSS.frameRetreating]: flowDirection === "retreating"
+      [CSS.frameRetreating]: flowDirection === "retreating",
     };
     return (index.h("div", { class: frameDirectionClasses }, index.h("slot", null)));
   }

package/dist/cjs/calcite-graph.cjs.entry.js

@@ -8,13 +8,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0e50040c.js');
-const guid = require('./guid-1b1fbdbc.js');
-const observers = require('./observers-62c5955c.js');
+const guid = require('./guid-3abe3cc6.js');
+const observers = require('./observers-f5fa975b.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 /**
  * Calculate slope of the tangents
@@ -99,7 +99,7 @@ function range(data) {
   const max = [startX, startY];
   return data.reduce(({ min, max }, [x, y]) => ({
     min: [Math.min(min[0], x), Math.min(min[1], y)],
-    max: [Math.max(max[0], x), Math.max(max[1], y)]
+    max: [Math.max(max[0], x), Math.max(max[1], y)],
   }), { min, max });
 }
 /**
@@ -143,7 +143,7 @@ function area({ data, min, max, t }) {
   return `${commands} ${end} L ${maxX},${minY} Z`;
 }
 
-const graphCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host{display:block;block-size:100%}.svg{fill:currentColor;stroke:transparent;margin:0px;display:block;block-size:100%;inline-size:100%;padding:0px}.svg .graph-path--highlight{fill:var(--calcite-ui-brand);opacity:0.5}";
+const graphCss = ":host{display:block;block-size:100%}.svg{fill:currentColor;stroke:transparent;margin:0px;display:block;block-size:100%;inline-size:100%;padding:0px}.svg .graph-path--highlight{fill:var(--calcite-ui-brand);opacity:0.5}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Graph = class {
   constructor(hostRef) {
@@ -221,7 +221,7 @@ const Graph = class {
               `, fill: "white" })),
       index.h("path", { class: "graph-path", d: areaPath, fill: fill, mask: `url(#${id}1)` }),
       index.h("path", { class: "graph-path--highlight", d: areaPath, fill: fill, mask: `url(#${id}2)` }),
-      index.h("path", { class: "graph-path", d: areaPath, fill: fill, mask: `url(#${id}3)` })
+      index.h("path", { class: "graph-path", d: areaPath, fill: fill, mask: `url(#${id}3)` }),
     ]) : (index.h("path", { class: "graph-path", d: areaPath, fill: fill }))));
   }
   get el() { return index.getElement(this); }

package/dist/cjs/calcite-icon.cjs.entry.js

@@ -8,25 +8,25 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0e50040c.js');
-const dom = require('./dom-1eb1ded2.js');
-const observers = require('./observers-62c5955c.js');
-require('./guid-1b1fbdbc.js');
-require('./resources-f60f44b0.js');
+const dom = require('./dom-c1807fc1.js');
+const observers = require('./observers-f5fa975b.js');
+require('./guid-3abe3cc6.js');
+require('./resources-77713c2e.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 const CSS = {
   icon: "icon",
-  flipRtl: "flip-rtl"
+  flipRtl: "flip-rtl",
 };
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 /**
  * Icon data cache.
@@ -45,7 +45,7 @@ const requestCache = {};
 const scaleToPx = {
   s: 16,
   m: 24,
-  l: 32
+  l: 32,
 };
 async function fetchIcon({ icon, scale }) {
   const size = scaleToPx[scale];
@@ -96,7 +96,7 @@ function normalizeIconName(name) {
   return numberLeadingName ? `i${name}` : name;
 }
 
-const iconCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host{display:inline-flex;color:var(--calcite-ui-icon-color)}:host([scale=s]){block-size:1rem;inline-size:1rem;min-inline-size:1rem;min-block-size:1rem}:host([scale=m]){block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;min-block-size:1.5rem}:host([scale=l]){block-size:2rem;inline-size:2rem;min-inline-size:2rem;min-block-size:2rem}.flip-rtl{transform:scaleX(-1)}.svg{display:block}";
+const iconCss = ":host{display:inline-flex;color:var(--calcite-ui-icon-color)}:host([scale=s]){block-size:1rem;inline-size:1rem;min-inline-size:1rem;min-block-size:1rem}:host([scale=m]){block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;min-block-size:1.5rem}:host([scale=l]){block-size:2rem;inline-size:2rem;min-inline-size:2rem;min-block-size:2rem}.flip-rtl{transform:scaleX(-1)}.svg{display:block}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Icon = class {
   constructor(hostRef) {
@@ -135,7 +135,7 @@ const Icon = class {
     const paths = [].concat(pathData || "");
     return (index.h(index.Host, { "aria-hidden": dom.toAriaBoolean(!semantic), "aria-label": semantic ? textLabel : null, role: semantic ? "img" : null }, index.h("svg", { "aria-hidden": "true", class: {
         [CSS.flipRtl]: dir === "rtl" && flipRtl,
-        svg: true
+        svg: true,
       }, fill: "currentColor", height: "100%", viewBox: `0 0 ${size} ${size}`, width: "100%", xmlns: "http://www.w3.org/2000/svg" }, paths.map((path) => typeof path === "string" ? (index.h("path", { d: path })) : (index.h("path", { d: path.d, opacity: "opacity" in path ? path.opacity : 1 }))))));
   }
   //--------------------------------------------------------------------------

package/dist/cjs/calcite-inline-editable.cjs.entry.js

@@ -8,22 +8,21 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0e50040c.js');
-const dom = require('./dom-1eb1ded2.js');
-const interactive = require('./interactive-871d70ce.js');
-const label = require('./label-e5c998a9.js');
-const loadable = require('./loadable-da060faa.js');
-const locale = require('./locale-37b9924d.js');
-const observers = require('./observers-62c5955c.js');
-const t9n = require('./t9n-a85989ef.js');
-require('./guid-1b1fbdbc.js');
-require('./resources-f60f44b0.js');
-require('./browser-ecb3aabc.js');
-require('./key-7fbdf405.js');
+const dom = require('./dom-c1807fc1.js');
+const interactive = require('./interactive-2fe0f43a.js');
+const label = require('./label-6e33e971.js');
+const loadable = require('./loadable-bac9cdd6.js');
+const locale = require('./locale-c63a1b57.js');
+const observers = require('./observers-f5fa975b.js');
+const t9n = require('./t9n-1d032c30.js');
+require('./guid-3abe3cc6.js');
+require('./resources-77713c2e.js');
+require('./key-b8b55ea3.js');
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.3
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.6.0
  */
 const CSS = {
   wrapper: "wrapper",
@@ -32,10 +31,10 @@ const CSS = {
   inputWrapper: "input-wrapper",
   cancelEditingButtonWrapper: "cancel-editing-button-wrapper",
   enableEditingButton: "enable-editing-button",
-  controlsWrapper: "controls-wrapper"
+  controlsWrapper: "controls-wrapper",
 };
 
-const inlineEditableCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block}:host([scale=s]) .controls-wrapper{block-size:1.5rem}:host([scale=m]) .controls-wrapper{block-size:2rem}:host([scale=l]) .controls-wrapper{block-size:2.75rem}:host(:not([editing-enabled]):not([disabled])) .wrapper:hover{background-color:var(--calcite-ui-foreground-2)}.wrapper{box-sizing:border-box;display:flex;justify-content:space-between;background-color:var(--calcite-ui-foreground-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.wrapper .input-wrapper{flex:1 1 0%}.controls-wrapper{display:flex}:host([disabled]) .cancel-editing-button-wrapper{border-color:var(--calcite-ui-border-2)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}";
+const inlineEditableCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block}:host([scale=s]) .controls-wrapper{block-size:1.5rem}:host([scale=m]) .controls-wrapper{block-size:2rem}:host([scale=l]) .controls-wrapper{block-size:2.75rem}:host(:not([editing-enabled]):not([disabled])) .wrapper:hover{background-color:var(--calcite-ui-foreground-2)}.wrapper{box-sizing:border-box;display:flex;justify-content:space-between;background-color:var(--calcite-ui-foreground-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.wrapper .input-wrapper{flex:1 1 0%}.controls-wrapper{display:flex}:host([disabled]) .cancel-editing-button-wrapper{border-color:var(--calcite-ui-border-2)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}:host([hidden]){display:none}[hidden]{display:none}";
 
 const InlineEditable = class {
   constructor(hostRef) {
@@ -178,7 +177,7 @@ const InlineEditable = class {
   render() {
     return (index.h("div", { class: CSS.wrapper, onClick: this.enableEditingHandler, onKeyDown: this.escapeKeyHandler }, index.h("div", { class: CSS.inputWrapper }, index.h("slot", null)), index.h("div", { class: CSS.controlsWrapper }, index.h("calcite-button", { appearance: "transparent", class: CSS.enableEditingButton, disabled: this.disabled, iconStart: "pencil", kind: "neutral", label: this.messages.enableEditing, onClick: this.enableEditingHandler, scale: this.scale, style: {
         opacity: this.editingEnabled ? "0" : "1",
-        width: this.editingEnabled ? "0" : "inherit"
+        width: this.editingEnabled ? "0" : "inherit",
       }, type: "button",
       // eslint-disable-next-line react/jsx-sort-props
       ref: (el) => (this.enableEditingButton = el) }), this.shouldShowControls && [
@@ -187,7 +186,7 @@ const InlineEditable = class {
         ref: (el) => (this.cancelEditingButton = el) })),
       index.h("calcite-button", { appearance: "solid", class: CSS.confirmChangesButton, disabled: this.disabled, iconStart: "check", kind: "brand", label: this.messages.confirmChanges, loading: this.loading, onClick: this.confirmChangesHandler, scale: this.scale, type: "button",
         // eslint-disable-next-line react/jsx-sort-props
-        ref: (el) => (this.confirmEditingButton = el) })
+        ref: (el) => (this.confirmEditingButton = el) }),
     ])));
   }
   //--------------------------------------------------------------------------
@@ -211,7 +210,7 @@ const InlineEditable = class {
   /** Sets focus on the component. */
   async setFocus() {
     var _a;
-    await loadable.componentLoaded(this);
+    await loadable.componentFocusable(this);
     (_a = this.el) === null || _a === void 0 ? void 0 : _a.focus();
   }
   //--------------------------------------------------------------------------
@@ -229,7 +228,7 @@ const InlineEditable = class {
   }
   updateSlottedInput() {
     const inputElement = dom.getSlotted(this.el, {
-      matches: "calcite-input"
+      matches: "calcite-input",
     });
     this.inputElement = inputElement;
     if (!inputElement) {