@esri/calcite-components 1.5.0-next.8 → 1.5.0

package/dist/components/panel.js

@@ -1,12 +1,12 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client/index.js';
-import { s as slotChangeGetAssignedElements, i as focusFirstTabbable, t as toAriaBoolean } from './dom.js';
+import { c as slotChangeHasAssignedElement, s as slotChangeGetAssignedElements, f as focusFirstTabbable, t as toAriaBoolean } from './dom.js';
 import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive } from './interactive.js';
-import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentLoaded } from './loadable.js';
+import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as createObserver } from './observers.js';
 import { S as SLOTS$1, d as defineCustomElement$5 } from './action-menu.js';
 import { H as Heading } from './Heading.js';
@@ -23,6 +23,7 @@ const CSS = {
   backButton: "back-button",
   container: "container",
   header: "header",
+  bottomSeparator: "bottom-separator",
   heading: "heading",
   summary: "summary",
   description: "description",
@@ -32,15 +33,14 @@ const CSS = {
   headerActionsStart: "header-actions--start",
   contentWrapper: "content-wrapper",
   contentContainer: "content-container",
-  contentHeight: "content-height",
   fabContainer: "fab-container",
-  footer: "footer"
+  footer: "footer",
 };
 const ICONS = {
   close: "x",
   menu: "ellipsis",
   backLeft: "chevron-left",
-  backRight: "chevron-right"
+  backRight: "chevron-right",
 };
 const SLOTS = {
   actionBar: "action-bar",
@@ -50,10 +50,10 @@ const SLOTS = {
   headerContent: "header-content",
   fab: "fab",
   footer: "footer",
-  footerActions: "footer-actions"
+  footerActions: "footer-actions",
 };
 
-const panelCss = "@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;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;block-size:100%;inline-size:100%;flex:1 1 auto;overflow:hidden;--calcite-min-header-height:calc(var(--calcite-icon-size) * 3);--calcite-panel-footer-padding:0.5rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.container{margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;background-color:var(--calcite-ui-background);padding:0px;transition:max-block-size var(--calcite-animation-timing), inline-size var(--calcite-animation-timing)}.container[hidden]{display:none}.header{border-block-end:1px solid;z-index:var(--calcite-app-z-index-header);inline-size:100%;align-items:stretch;justify-content:flex-start;background-color:var(--calcite-ui-foreground-1);border-block-end-color:var(--calcite-ui-border-3);flex:0 0 auto}.action-bar-container{border-block-end:1px solid;z-index:var(--calcite-app-z-index-header);inline-size:100%;border-block-end-color:var(--calcite-ui-border-3)}.action-bar-container ::slotted(calcite-action-bar){inline-size:100%}.header-content{display:flex;flex-direction:column;overflow:hidden;padding-inline:0.75rem;padding-block:0.875rem;margin-inline-end:auto}.header-content .heading,.header-content .description{display:block;overflow-wrap:break-word;padding:0px}.header-content .heading{margin-inline:0px;margin-block:0px 0.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-medium)}.header-content .heading:only-child{margin-block-end:0px}.header-content .description{font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}.header-actions{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch}.header-actions--end{margin-inline-start:auto}.content-wrapper{overflow:auto}.content-height{block-size:100%}.content-container{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;align-items:stretch;background-color:var(--calcite-ui-background)}.footer{border-block-start:1px solid;display:flex;inline-size:100%;justify-content:space-evenly;background-color:var(--calcite-ui-foreground-1);border-block-start-color:var(--calcite-ui-border-3);flex:0 0 auto;padding:var(--calcite-panel-footer-padding)}.fab-container{position:sticky;inset-block-end:0px;z-index:var(--calcite-app-z-index-sticky);margin-block:0px;margin-inline:auto;display:block;padding:0.5rem;inset-inline:0;inline-size:-moz-fit-content;inline-size:fit-content}[hidden]{display:none}";
+const panelCss = ":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;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;block-size:100%;inline-size:100%;flex:1 1 auto;overflow:hidden;--calcite-min-header-height:calc(var(--calcite-icon-size) * 3);--calcite-panel-footer-padding:0.5rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.container{margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;background-color:var(--calcite-ui-background);padding:0px;transition:max-block-size var(--calcite-animation-timing), inline-size var(--calcite-animation-timing)}.container[hidden]{display:none}.header{z-index:var(--calcite-app-z-index-header);inline-size:100%;align-items:stretch;justify-content:flex-start;background-color:var(--calcite-ui-foreground-1);flex:0 0 auto}.action-bar-container{z-index:var(--calcite-app-z-index-header);inline-size:100%}.bottom-separator{border-block-end:1px solid var(--calcite-ui-border-3)}.action-bar-container ::slotted(calcite-action-bar){inline-size:100%}.header-content{display:flex;flex-direction:column;overflow:hidden;padding-inline:0.75rem;padding-block:0.875rem;margin-inline-end:auto}.header-content .heading,.header-content .description{display:block;overflow-wrap:break-word;padding:0px}.header-content .heading{margin-inline:0px;margin-block:0px 0.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-medium)}.header-content .heading:only-child{margin-block-end:0px}.header-content .description{font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}.header-actions{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch}.header-actions--end{margin-inline-start:auto}.content-wrapper{block-size:100%;overflow:auto}.content-container{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;align-items:stretch;background-color:var(--calcite-ui-background)}.footer{display:flex;inline-size:100%;justify-content:space-evenly;background-color:var(--calcite-ui-foreground-1);flex:0 0 auto;padding:var(--calcite-panel-footer-padding);border-block-start:1px solid var(--calcite-ui-border-3)}.fab-container{position:sticky;inset-block-end:0px;z-index:var(--calcite-app-z-index-sticky);margin-block:0px;margin-inline:auto;display:block;padding:0.5rem;inset-inline:0;inline-size:-moz-fit-content;inline-size:fit-content}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -99,23 +99,17 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.panelScrollHandler = () => {
       this.calcitePanelScroll.emit();
     };
+    this.handleDefaultSlotChange = (event) => {
+      this.hasDefaultContent = slotChangeHasAssignedElement(event);
+    };
     this.handleHeaderActionsStartSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasStartActions = !!elements.length;
+      this.hasStartActions = slotChangeHasAssignedElement(event);
     };
     this.handleHeaderActionsEndSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasEndActions = !!elements.length;
+      this.hasEndActions = slotChangeHasAssignedElement(event);
     };
     this.handleHeaderMenuActionsSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasMenuItems = !!elements.length;
+      this.hasMenuItems = slotChangeHasAssignedElement(event);
     };
     this.handleActionBarSlotChange = (event) => {
       const actionBars = slotChangeGetAssignedElements(event).filter((el) => el?.matches("calcite-action-bar"));
@@ -123,28 +117,16 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       this.hasActionBar = !!actionBars.length;
     };
     this.handleHeaderContentSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasHeaderContent = !!elements.length;
+      this.hasHeaderContent = slotChangeHasAssignedElement(event);
     };
     this.handleFooterSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasFooterContent = !!elements.length;
+      this.hasFooterContent = slotChangeHasAssignedElement(event);
     };
     this.handleFooterActionsSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasFooterActions = !!elements.length;
+      this.hasFooterActions = slotChangeHasAssignedElement(event);
     };
     this.handleFabSlotChange = (event) => {
-      const elements = event.target.assignedElements({
-        flatten: true
-      });
-      this.hasFab = !!elements.length;
+      this.hasFab = slotChangeHasAssignedElement(event);
     };
     this.setPanelScrollEl = (el) => {
       this.panelScrollEl = el;
@@ -164,6 +146,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.menuOpen = false;
     this.messageOverrides = undefined;
     this.messages = undefined;
+    this.hasDefaultContent = false;
     this.hasStartActions = false;
     this.hasEndActions = false;
     this.hasMenuItems = false;
@@ -216,7 +199,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    * Sets focus on the component's first focusable element.
    */
   async setFocus() {
-    await componentLoaded(this);
+    await componentFocusable(this);
     focusFirstTabbable(this.containerEl);
   }
   /**
@@ -245,7 +228,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return !hasHeaderContent && (headingNode || descriptionNode) ? (h("div", { class: CSS.headerContent, key: "header-content" }, headingNode, descriptionNode)) : null;
   }
   renderActionBar() {
-    return (h("div", { class: CSS.actionBarContainer, hidden: !this.hasActionBar }, h("slot", { name: SLOTS.actionBar, onSlotchange: this.handleActionBarSlotChange })));
+    return (h("div", { class: { [CSS.actionBarContainer]: true, [CSS.bottomSeparator]: this.hasDefaultContent }, hidden: !this.hasActionBar }, h("slot", { name: SLOTS.actionBar, onSlotchange: this.handleActionBarSlotChange })));
   }
   /**
    * Allows user to override the entire header-content node.
@@ -272,7 +255,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h("calcite-action-menu", { flipPlacements: ["top", "bottom"], hidden: !hasMenuItems, key: "menu", label: messages.options, open: menuOpen, placement: "bottom-end" }, h("calcite-action", { icon: ICONS.menu, slot: SLOTS$1.trigger, text: messages.options }), h("slot", { name: SLOTS.headerMenuActions, onSlotchange: this.handleHeaderMenuActionsSlotChange })));
   }
   renderHeaderNode() {
-    const { hasHeaderContent, hasStartActions, hasEndActions, closable, hasMenuItems } = this;
+    const { hasHeaderContent, hasStartActions, hasEndActions, closable, hasMenuItems, hasDefaultContent, hasActionBar, } = this;
     const headerContentNode = this.renderHeaderContent();
     const showHeader = hasHeaderContent ||
       headerContentNode ||
@@ -280,7 +263,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       hasEndActions ||
       closable ||
       hasMenuItems;
-    return (h("header", { class: CSS.header, hidden: !showHeader }, this.renderHeaderStartActions(), this.renderHeaderSlottedContent(), headerContentNode, this.renderHeaderActionsEnd()));
+    return (h("header", { class: { [CSS.header]: true, [CSS.bottomSeparator]: hasDefaultContent || hasActionBar }, hidden: !showHeader }, this.renderHeaderStartActions(), this.renderHeaderSlottedContent(), headerContentNode, this.renderHeaderActionsEnd()));
   }
   renderFooterNode() {
     const { hasFooterContent, hasFooterActions } = this;
@@ -288,16 +271,9 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h("footer", { class: CSS.footer, hidden: !showFooter }, h("slot", { key: "footer-slot", name: SLOTS.footer, onSlotchange: this.handleFooterSlotChange }), h("slot", { key: "footer-actions-slot", name: SLOTS.footerActions, onSlotchange: this.handleFooterActionsSlotChange })));
   }
   renderContent() {
-    const { hasFab } = this;
-    const defaultSlotNode = h("slot", { key: "default-slot" });
-    const containerNode = hasFab ? (h("section", { class: CSS.contentContainer }, defaultSlotNode)) : (defaultSlotNode);
-    return (h("div", { class: {
-        [CSS.contentWrapper]: true,
-        [CSS.contentContainer]: !hasFab,
-        [CSS.contentHeight]: hasFab
-      }, onScroll: this.panelScrollHandler,
+    return (h("div", { class: CSS.contentWrapper, onScroll: this.panelScrollHandler,
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setPanelScrollEl }, containerNode, this.renderFab()));
+      ref: this.setPanelScrollEl }, h("section", { class: CSS.contentContainer }, h("slot", { onSlotchange: this.handleDefaultSlotChange })), this.renderFab()));
   }
   renderFab() {
     return (h("div", { class: CSS.fabContainer, hidden: !this.hasFab }, h("slot", { name: SLOTS.fab, onSlotchange: this.handleFabSlotChange })));
@@ -327,6 +303,7 @@ const Panel = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "menuOpen": [516, "menu-open"],
     "messageOverrides": [1040],
     "messages": [1040],
+    "hasDefaultContent": [32],
     "hasStartActions": [32],
     "hasEndActions": [32],
     "hasMenuItems": [32],

package/dist/components/pick-list-item.js

@@ -1,13 +1,13 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client/index.js';
 import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot.js';
-import { b as getSlotted, t as toAriaBoolean } from './dom.js';
+import { g as getSlotted, t as toAriaBoolean } from './dom.js';
 import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction } from './interactive.js';
-import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentLoaded } from './loadable.js';
+import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
 import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n.js';
 import { I as ICON_TYPES } from './resources2.js';
@@ -28,18 +28,18 @@ const CSS = {
   label: "label",
   remove: "remove",
   title: "title",
-  textContainer: "text-container"
+  textContainer: "text-container",
 };
 const ICONS = {
   checked: "check",
-  remove: "x"
+  remove: "x",
 };
 const SLOTS = {
   actionsEnd: "actions-end",
-  actionsStart: "actions-start"
+  actionsStart: "actions-start",
 };
 
-const pickListItemCss = "@charset \"UTF-8\";@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;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{margin:0px;margin-block-end:1px;box-sizing:border-box;display:flex;align-items:stretch;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-1);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition:background-color var(--calcite-animation-timing);animation:calcite-fade-in var(--calcite-animation-timing)}:host *{box-sizing:border-box}.label{display:flex;flex:1 1 auto;cursor:pointer;align-items:center;background-color:transparent;outline-color:transparent}.label:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          )}.label:hover{background-color:var(--calcite-ui-foreground-2)}:host([non-interactive]:hover){background-color:var(--calcite-ui-foreground-1)}:host([non-interactive]) .label,:host([non-interactive]) .icon{pointer-events:none}.icon{margin-block:0px;display:flex;cursor:pointer;align-items:center;padding:0.25rem;color:var(--calcite-ui-brand);flex:0 0 auto;line-height:0}.icon:hover{background-color:var(--calcite-ui-foreground-2)}.icon-dot{display:flex;inline-size:1.5rem;align-items:center;padding:0.5rem}.icon-dot:before{opacity:0;content:\"•\"}.icon calcite-icon{opacity:0}:host([selected]) .icon-dot:before,:host([selected]) .icon calcite-icon{transition:opacity var(--calcite-animation-timing);opacity:1}.text-container{pointer-events:none;display:flex;flex-direction:column;flex-wrap:nowrap;overflow:hidden;padding-block:0.5rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--2);line-height:1.375;word-wrap:break-word;word-break:break-word}.title{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-1)}.description{margin-block-start:0.125rem;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}.actions{margin:0px;display:flex;flex:0 1 auto;align-items:stretch;justify-content:flex-end}.actions--start~.label{padding-inline-start:0.25rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}";
+const pickListItemCss = "@charset \"UTF-8\";:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{margin:0px;margin-block-end:1px;box-sizing:border-box;display:flex;align-items:stretch;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-1);--tw-shadow:0 1px 0 var(--calcite-ui-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition:background-color var(--calcite-animation-timing);animation:calcite-fade-in var(--calcite-animation-timing)}:host *{box-sizing:border-box}.label{display:flex;flex:1 1 auto;cursor:pointer;align-items:center;background-color:transparent;outline-color:transparent}.label:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          )}.label:hover{background-color:var(--calcite-ui-foreground-2)}:host([non-interactive]:hover){background-color:var(--calcite-ui-foreground-1)}:host([non-interactive]) .label,:host([non-interactive]) .icon{pointer-events:none}.icon{margin-block:0px;display:flex;cursor:pointer;align-items:center;padding:0.25rem;color:var(--calcite-ui-brand);flex:0 0 auto;line-height:0}.icon:hover{background-color:var(--calcite-ui-foreground-2)}.icon-dot{display:flex;inline-size:1.5rem;align-items:center;padding:0.5rem}.icon-dot:before{opacity:0;content:\"•\"}.icon calcite-icon{opacity:0}:host([selected]) .icon-dot:before,:host([selected]) .icon calcite-icon{transition:opacity var(--calcite-animation-timing);opacity:1}.text-container{pointer-events:none;display:flex;flex-direction:column;flex-wrap:nowrap;overflow:hidden;padding-block:0.5rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--2);line-height:1.375;word-wrap:break-word;word-break:break-word}.title{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-1)}.description{margin-block-start:0.125rem;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-3)}.actions{margin:0px;display:flex;flex:0 1 auto;align-items:stretch;justify-content:flex-end}.actions--start~.label{padding-inline-start:0.25rem}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}:host([hidden]){display:none}[hidden]{display:none}";
 
 const PickListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -107,7 +107,7 @@ const PickListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
       item: this.el,
       value: this.value,
       selected: this.selected,
-      shiftPressed: this.shiftPressed
+      shiftPressed: this.shiftPressed,
     });
     this.shiftPressed = false;
   }
@@ -160,7 +160,7 @@ const PickListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /** Sets focus on the component. */
   async setFocus() {
-    await componentLoaded(this);
+    await componentFocusable(this);
     this.focusEl?.focus();
   }
   // --------------------------------------------------------------------------
@@ -175,7 +175,7 @@ const PickListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     }
     return (h("span", { class: {
         [CSS.icon]: true,
-        [CSS.iconDot]: icon === ICON_TYPES.circle
+        [CSS.iconDot]: icon === ICON_TYPES.circle,
       }, onClick: this.pickListClickHandler }, icon === ICON_TYPES.square ? (h("calcite-icon", { flipRtl: iconFlipRtl, icon: ICONS.checked, scale: "s" })) : null));
   }
   renderRemoveAction() {

package/dist/components/pl.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/popover.js

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client/index.js';
 import { f as filterComputedPlacements, c as connectFloatingUI, b as defaultOffsetDistance, a as disconnectFloatingUI, r as reposition, F as FloatingCSS } from './floating-ui.js';
 import { d as deactivateFocusTrap, a as activateFocusTrap, c as connectFocusTrap, u as updateFocusTrapElements } from './focusTrapComponent.js';
-import { k as isPrimaryPointerButton, t as toAriaBoolean, i as focusFirstTabbable, u as queryElementRoots } from './dom.js';
+import { i as isPrimaryPointerButton, t as toAriaBoolean, f as focusFirstTabbable, u as queryElementRoots } from './dom.js';
 import { g as guid } from './guid.js';
-import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent.js';
+import { o as onToggleOpenCloseComponent } from './openCloseComponent.js';
 import { H as Heading } from './Heading.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
 import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n.js';
 import { i as isActivationKey } from './key.js';
-import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentLoaded } from './loadable.js';
+import { a as setUpLoadableComponent, s as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as createObserver } from './observers.js';
 import { F as FloatingArrow } from './FloatingArrow.js';
 import { d as defineCustomElement$3 } from './action.js';
@@ -29,7 +29,7 @@ const CSS = {
   hasHeader: "has-header",
   header: "header",
   headerContent: "header-content",
-  heading: "heading"
+  heading: "heading",
 };
 const defaultPopoverPlacement = "auto";
 const ARIA_CONTROLS = "aria-controls";
@@ -114,7 +114,7 @@ class PopoverManager {
   }
 }
 
-const popoverCss = "@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{--calcite-floating-ui-z-index:var(--calcite-popover-z-index, var(--calcite-app-z-index-popup));display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index)}.calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-app-z-index);border-radius:0.25rem}:host([data-placement^=bottom]) .calcite-floating-ui-anim{transform:translateY(-5px)}:host([data-placement^=top]) .calcite-floating-ui-anim{transform:translateY(5px)}:host([data-placement^=left]) .calcite-floating-ui-anim{transform:translateX(5px)}:host([data-placement^=right]) .calcite-floating-ui-anim{transform:translateX(-5px)}:host([data-placement]) .calcite-floating-ui-anim--active{opacity:1;transform:translate(0)}:host([calcite-hydrated-hidden]){visibility:hidden !important;pointer-events:none}.calcite-floating-ui-arrow{pointer-events:none;position:absolute;z-index:calc(var(--calcite-app-z-index) * -1);fill:var(--calcite-ui-foreground-1)}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-ui-border-3)}:host([scale=s]) .heading{padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1.375}:host([scale=m]) .heading{padding-inline:1rem;padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375}:host([scale=l]) .heading{padding-inline:1.25rem;padding-block:1rem;font-size:var(--calcite-font-size-1);line-height:1.375}:host{pointer-events:none}:host([open]){pointer-events:initial}.calcite-floating-ui-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}.header{display:flex;flex:1 1 auto;align-items:stretch;justify-content:flex-start;border-width:0px;border-block-end-width:1px;border-style:solid;border-block-end-color:var(--calcite-ui-border-3)}.heading{margin:0px;display:block;flex:1 1 auto;align-self:center;white-space:normal;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}.container{position:relative;display:flex;block-size:100%;flex-direction:row;flex-wrap:nowrap;border-radius:0.25rem;color:var(--calcite-ui-text-1)}.container.has-header{flex-direction:column}.content{display:flex;block-size:100%;inline-size:100%;flex-direction:column;flex-wrap:nowrap;align-self:center;word-wrap:break-word;word-break:break-word}.close-button-container{display:flex;overflow:hidden;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}::slotted(calcite-panel),::slotted(calcite-flow){block-size:100%}";
+const popoverCss = ":host{--calcite-floating-ui-z-index:var(--calcite-popover-z-index, var(--calcite-app-z-index-popup));display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index)}.calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-app-z-index);border-radius:0.25rem}:host([data-placement^=bottom]) .calcite-floating-ui-anim{transform:translateY(-5px)}:host([data-placement^=top]) .calcite-floating-ui-anim{transform:translateY(5px)}:host([data-placement^=left]) .calcite-floating-ui-anim{transform:translateX(5px)}:host([data-placement^=right]) .calcite-floating-ui-anim{transform:translateX(-5px)}:host([data-placement]) .calcite-floating-ui-anim--active{opacity:1;transform:translate(0)}:host([calcite-hydrated-hidden]){visibility:hidden !important;pointer-events:none}.calcite-floating-ui-arrow{pointer-events:none;position:absolute;z-index:calc(var(--calcite-app-z-index) * -1);fill:var(--calcite-ui-foreground-1)}.calcite-floating-ui-arrow__stroke{stroke:var(--calcite-ui-border-3)}:host([scale=s]) .heading{padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1.375}:host([scale=m]) .heading{padding-inline:1rem;padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375}:host([scale=l]) .heading{padding-inline:1.25rem;padding-block:1rem;font-size:var(--calcite-font-size-1);line-height:1.375}:host{pointer-events:none}:host([open]){pointer-events:initial}.calcite-floating-ui-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}.header{display:flex;flex:1 1 auto;align-items:stretch;justify-content:flex-start;border-width:0px;border-block-end-width:1px;border-style:solid;border-block-end-color:var(--calcite-ui-border-3)}.heading{margin:0px;display:block;flex:1 1 auto;align-self:center;white-space:normal;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}.container{position:relative;display:flex;block-size:100%;flex-direction:row;flex-wrap:nowrap;border-radius:0.25rem;color:var(--calcite-ui-text-1)}.container.has-header{flex-direction:column}.content{display:flex;block-size:100%;inline-size:100%;flex-direction:column;flex-wrap:nowrap;align-self:center;word-wrap:break-word;word-break:break-word}.close-button-container{display:flex;overflow:hidden;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}::slotted(calcite-panel),::slotted(calcite-flow){block-size:100%}:host([hidden]){display:none}[hidden]{display:none}";
 
 const manager = new PopoverManager();
 const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -142,7 +142,6 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     // --------------------------------------------------------------------------
     this.setTransitionEl = (el) => {
       this.transitionEl = el;
-      connectOpenCloseComponent(this);
     };
     this.setFilteredPlacements = () => {
       const { el, flipPlacements } = this;
@@ -157,7 +156,7 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       const { el, referenceElement, effectiveReferenceElement } = this;
       if (warn && referenceElement && !effectiveReferenceElement) {
         console.warn(`${el.tagName}: reference-element id "${referenceElement}" was not found.`, {
-          el
+          el,
         });
       }
       this.addReferences();
@@ -228,7 +227,7 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.effectiveReferenceElement = undefined;
     this.defaultMessages = undefined;
   }
-  handlefocusTrapDisabled(focusTrapDisabled) {
+  handleFocusTrapDisabled(focusTrapDisabled) {
     if (!this.open) {
       return;
     }
@@ -248,6 +247,7 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.reposition(true);
   }
   openHandler(value) {
+    onToggleOpenCloseComponent(this);
     if (value) {
       this.reposition(true);
     }
@@ -275,9 +275,11 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.setFilteredPlacements();
     connectLocalized(this);
     connectMessages(this);
-    connectOpenCloseComponent(this);
     this.setUpReferenceElement(this.hasLoaded);
     connectFocusTrap(this);
+    if (this.open) {
+      onToggleOpenCloseComponent(this);
+    }
   }
   async componentWillLoad() {
     await setUpMessages(this);
@@ -296,7 +298,6 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     disconnectLocalized(this);
     disconnectMessages(this);
     disconnectFloatingUI(this, this.effectiveReferenceElement, this.el);
-    disconnectOpenCloseComponent(this);
     deactivateFocusTrap(this);
   }
   // --------------------------------------------------------------------------
@@ -310,7 +311,7 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    * @param delayed
    */
   async reposition(delayed = false) {
-    const { el, effectiveReferenceElement, placement, overlayPositioning, flipDisabled, filteredFlipPlacements, offsetDistance, offsetSkidding, arrowEl } = this;
+    const { el, effectiveReferenceElement, placement, overlayPositioning, flipDisabled, filteredFlipPlacements, offsetDistance, offsetSkidding, arrowEl, } = this;
     return reposition(this, {
       floatingEl: el,
       referenceEl: effectiveReferenceElement,
@@ -321,14 +322,14 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       offsetDistance,
       offsetSkidding,
       arrowEl,
-      type: "popover"
+      type: "popover",
     }, delayed);
   }
   /**
    * Sets focus on the component's first focusable element.
    */
   async setFocus() {
-    await componentLoaded(this);
+    await componentFocusable(this);
     forceUpdate(this.el);
     focusFirstTabbable(this.el);
   }
@@ -383,18 +384,18 @@ const Popover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       ref: this.storeArrowEl })) : null;
     return (h(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "aria-live": "polite", "calcite-hydrated-hidden": hidden, id: this.getId(), role: "dialog" }, h("div", { class: {
         [FloatingCSS.animation]: true,
-        [FloatingCSS.animationActive]: displayed
+        [FloatingCSS.animationActive]: displayed,
       },
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setTransitionEl }, arrowNode, h("div", { class: {
         [CSS.hasHeader]: !!heading,
-        [CSS.container]: true
+        [CSS.container]: true,
       } }, this.renderHeader(), h("div", { class: CSS.content }, h("slot", null)), !heading ? this.renderCloseButton() : null))));
   }
   static get assetsDirs() { return ["assets"]; }
   get el() { return this; }
   static get watchers() { return {
-    "focusTrapDisabled": ["handlefocusTrapDisabled"],
+    "focusTrapDisabled": ["handleFocusTrapDisabled"],
     "flipPlacements": ["flipPlacementsHandler"],
     "messageOverrides": ["onMessagesChange"],
     "offsetDistance": ["offsetDistanceOffsetHandler"],

package/dist/components/progress.js

@@ -1,11 +1,11 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client/index.js';
 
-const progressCss = "@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}@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{position:relative;display:block;inline-size:100%}.track,.bar{position:absolute;inset-block-start:0px;block-size:2px}.track{z-index:var(--calcite-app-z-index);inline-size:100%;overflow:hidden;background:var(--calcite-ui-border-3)}.bar{z-index:var(--calcite-app-z-index);background-color:var(--calcite-ui-brand)}@media (forced-colors: active){.track{background-color:highlightText}.bar{background-color:linkText}}.indeterminate{inline-size:20%;animation:looping-progress-bar-ani calc(var(--calcite-internal-animation-timing-medium) / var(--calcite-internal-duration-factor) * 11 / var(--calcite-internal-duration-factor)) linear infinite}.reversed{animation-direction:reverse}.text{padding-inline:0px;padding-block:1rem 0px;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2)}@keyframes looping-progress-bar-ani{0%{transform:translate3d(-100%, 0, 0)}50%{inline-size:40%}100%{transform:translate3d(600%, 0, 0)}}";
+const progressCss = ":host{position:relative;display:block;inline-size:100%}.track,.bar{position:absolute;inset-block-start:0px;block-size:2px}.track{z-index:var(--calcite-app-z-index);inline-size:100%;overflow:hidden;background:var(--calcite-ui-border-3)}.bar{z-index:var(--calcite-app-z-index);background-color:var(--calcite-ui-brand)}@media (forced-colors: active){.track{background-color:highlightText}.bar{background-color:linkText}}.indeterminate{inline-size:20%;animation:looping-progress-bar-ani calc(var(--calcite-internal-animation-timing-medium) / var(--calcite-internal-duration-factor) * 11 / var(--calcite-internal-duration-factor)) linear infinite}.reversed{animation-direction:reverse}.text{padding-inline:0px;padding-block:1rem 0px;text-align:center;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-2)}@keyframes looping-progress-bar-ani{0%{transform:translate3d(-100%, 0, 0)}50%{inline-size:40%}100%{transform:translate3d(600%, 0, 0)}}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Progress = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -24,7 +24,7 @@ const Progress = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h("div", { "aria-label": this.label || this.text, "aria-valuemax": 1, "aria-valuemin": 0, "aria-valuenow": this.value, role: "progressbar" }, h("div", { class: "track" }, h("div", { class: {
         bar: true,
         indeterminate: this.type === "indeterminate",
-        reversed: this.reversed
+        reversed: this.reversed,
       }, style: barStyles })), this.text ? h("div", { class: "text" }, this.text) : null));
   }
   get el() { return this; }

package/dist/components/pt-br.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/pt.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 var KindIcons;
 (function (KindIcons) {

package/dist/components/resources2.js

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 const CSS = {
-  sticky: "sticky-pos"
+  sticky: "sticky-pos",
 };
 var ICON_TYPES;
 (function (ICON_TYPES) {
@@ -13,7 +13,7 @@ var ICON_TYPES;
   ICON_TYPES["grip"] = "grip";
 })(ICON_TYPES || (ICON_TYPES = {}));
 const SLOTS = {
-  menuActions: "menu-actions"
+  menuActions: "menu-actions",
 };
 
 export { CSS as C, ICON_TYPES as I, SLOTS as S };

package/dist/components/resources3.js

@@ -1,15 +1,15 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 const CSS = {
   heading: "heading",
   container: "container",
-  indented: "container--indented"
+  indented: "container--indented",
 };
 const SLOTS = {
-  parentItem: "parent-item"
+  parentItem: "parent-item",
 };
 
 export { CSS as C, SLOTS as S };

package/dist/components/ro.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/ru.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/scrim.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client/index.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
@@ -11,15 +11,15 @@ import { d as defineCustomElement$1 } from './loader.js';
 
 const CSS = {
   scrim: "scrim",
-  content: "content"
+  content: "content",
 };
 const BREAKPOINTS = {
   s: 72,
   // medium is assumed default.
-  l: 480 // Greater than or equal to 480px.
+  l: 480, // Greater than or equal to 480px.
 };
 
-const scrimCss = "@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{position:absolute;inset:0px;z-index:var(--calcite-app-z-index-overlay);display:flex;block-size:100%;inline-size:100%;flex-direction:column;align-items:stretch}@keyframes calcite-scrim-fade-in{0%{--tw-bg-opacity:0}100%{--tw-text-opacity:1}}.scrim{position:absolute;inset:0px;display:flex;flex-direction:column;align-content:center;align-items:center;justify-content:center;overflow:hidden;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-scrim-background, var(--calcite-scrim-background-internal))}.content{padding:1rem}";
+const scrimCss = ":host{position:absolute;inset:0px;z-index:var(--calcite-app-z-index-overlay);display:flex;block-size:100%;inline-size:100%;flex-direction:column;align-items:stretch}@keyframes calcite-scrim-fade-in{0%{--tw-bg-opacity:0}100%{--tw-text-opacity:1}}.scrim{position:absolute;inset:0px;display:flex;flex-direction:column;align-content:center;align-items:center;justify-content:center;overflow:hidden;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-scrim-background, var(--calcite-scrim-background-internal))}.content{padding:1rem}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Scrim = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -57,6 +57,7 @@ const Scrim = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   connectedCallback() {
     connectLocalized(this);
     connectMessages(this);
+    this.resizeObserver?.observe(this.el);
   }
   async componentWillLoad() {
     await setUpMessages(this);
@@ -64,6 +65,7 @@ const Scrim = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   disconnectedCallback() {
     disconnectLocalized(this);
     disconnectMessages(this);
+    this.resizeObserver?.disconnect();
   }
   // --------------------------------------------------------------------------
   //