npm - @esri/calcite-components - Versions diffs - 1.1.0-next.3 → 1.1.0 - Mend

@esri/calcite-components 1.1.0-next.3 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (894) hide show

package/dist/collection/components/modal/modal.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */
@@ -107,6 +108,11 @@
   --calcite-modal-scrim-background-internal: rgba(0, 0, 0, 0.85);
 }
+.content-top[hidden],
+.content-bottom[hidden] {
+  display: none;
+}
 .container {
   position: fixed;
   inset: 0px;
@@ -191,12 +197,12 @@
   transition-delay: 0ms;
 }
-:host([open]) .container {
+.container--open {
   opacity: 1;
   visibility: visible !important;
   transition-delay: 0ms;
 }
-:host([open]) .container .modal--open {
+.container--open .modal {
   pointer-events: auto;
   visibility: visible;
   opacity: 1;
@@ -278,12 +284,43 @@ slot[name=header]::slotted(*),
   block-size: 100%;
   overflow: auto;
   padding: 0px;
-  max-block-size: 100%;
   background-color: var(--calcite-modal-content-background, var(--calcite-ui-foreground-1));
-  padding-block: var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal));
-  padding-inline: var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal));
+  max-block-size: 100%;
+  padding: var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal));
 }
+.content-top,
+.content-bottom {
+  z-index: 400;
+  display: flex;
+  border-width: 0px;
+  border-style: solid;
+  border-color: var(--calcite-ui-border-3);
+  background-color: var(--calcite-ui-foreground-1);
+  flex: 0 0 auto;
+  padding: var(--calcite-modal-padding-internal);
+}
+.content-top {
+  min-inline-size: 0px;
+  max-inline-size: 100%;
+  border-block-end-width: 1px;
+}
+.content-bottom {
+  margin-block-start: auto;
+  box-sizing: border-box;
+  inline-size: 100%;
+  justify-content: space-between;
+  border-block-start-width: 1px;
+}
+.content-top:not(.header ~ .content-top) {
+  border-start-start-radius: 0.25rem;
+  border-start-end-radius: 0.25rem;
+}
+.content-bottom:not(.content-bottom ~ .footer),
 .content--no-footer {
   border-end-end-radius: 0.25rem;
   border-end-start-radius: 0.25rem;
@@ -432,10 +469,10 @@ slot[name=primary] {
   flex: 1 1 auto;
 }
-:host([open][fullscreen]) .header {
-  border-radius: 0;
-}
-:host([open][fullscreen]) .footer {
+:host([open][fullscreen]) .header,
+:host([open][fullscreen]) .footer,
+:host([open][fullscreen]) .content-top,
+:host([open][fullscreen]) .content-bottom {
   border-radius: 0;
 }
@@ -483,10 +520,15 @@ slot[name=primary] {
   border-style: solid;
 }
 :host([kind=brand]) .header,
+:host([kind=brand]) .content-top,
 :host([kind=danger]) .header,
+:host([kind=danger]) .content-top,
 :host([kind=info]) .header,
+:host([kind=info]) .content-top,
 :host([kind=success]) .header,
-:host([kind=warning]) .header {
+:host([kind=success]) .content-top,
+:host([kind=warning]) .header,
+:host([kind=warning]) .content-top {
   border-radius: 0.25rem;
   border-end-end-radius: 0px;
   border-end-start-radius: 0px;
@@ -496,12 +538,13 @@ slot[name=primary] {
  * Tablet
  */
 @media screen and (max-width: 860px) {
-  slot[name=header]::slotted(*),
-*::slotted([slot=header]) {
+  * slot[name=header]::slotted(content-top),
+* content-top::slotted([slot=header]) {
     font-size: var(--calcite-font-size-1);
   }
-  .footer {
+  .footer,
+.content-bottom {
     position: sticky;
     inset-block-end: 0px;
   }
@@ -510,7 +553,8 @@ slot[name=primary] {
  * Mobile
  */
 @media screen and (max-width: 480px) {
-  .footer {
+  .footer,
+.content-bottom {
     flex-direction: column;
   }

package/dist/collection/components/modal/modal.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { h, Host } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
-import { ensureId, focusFirstTabbable, getSlotted } from "../../utils/dom";
+import { ensureId, focusFirstTabbable, getSlotted, slotChangeHasAssignedElement } from "../../utils/dom";
 import { activateFocusTrap, connectFocusTrap, deactivateFocusTrap, updateFocusTrapElements } from "../../utils/focusTrapComponent";
 import { componentLoaded, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
 import { createObserver } from "../../utils/observers";
@@ -16,6 +16,8 @@ import { connectMessages, disconnectMessages, setUpMessages, updateMessages } fr
 /**
  * @slot header - A slot for adding header text.
  * @slot content - A slot for adding the component's content.
+ * @slot contentTop - A slot for adding the component's content header.
+ * @slot contentBottom - A slot for adding the component's content footer.
  * @slot primary - A slot for adding a primary button.
  * @slot secondary - A slot for adding a secondary button.
  * @slot back - A slot for adding a back button.
@@ -64,6 +66,12 @@ export class Modal {
       this.cssWidth = getComputedStyle(this.el).getPropertyValue("--calcite-modal-width");
       this.cssHeight = getComputedStyle(this.el).getPropertyValue("--calcite-modal-height");
     };
+    this.contentTopSlotChangeHandler = (event) => {
+      this.hasContentTop = slotChangeHasAssignedElement(event);
+    };
+    this.contentBottomSlotChangeHandler = (event) => {
+      this.hasContentBottom = slotChangeHasAssignedElement(event);
+    };
     this.open = false;
     this.beforeClose = () => Promise.resolve();
     this.closeButtonDisabled = false;
@@ -81,6 +89,8 @@ export class Modal {
     this.cssWidth = undefined;
     this.cssHeight = undefined;
     this.hasFooter = true;
+    this.hasContentTop = false;
+    this.hasContentBottom = false;
     this.isOpen = false;
     this.effectiveLocale = undefined;
     this.defaultMessages = undefined;
@@ -114,8 +124,8 @@ export class Modal {
   connectedCallback() {
     this.mutationObserver?.observe(this.el, { childList: true, subtree: true });
     this.cssVarObserver?.observe(this.el, { attributeFilter: ["style"] });
-    this.updateFooterVisibility();
     this.updateSizeCssVars();
+    this.updateFooterVisibility();
     connectConditionalSlotComponent(this);
     connectLocalized(this);
     connectMessages(this);
@@ -133,20 +143,32 @@ export class Modal {
   render() {
     return (h(Host, { "aria-describedby": this.contentId, "aria-labelledby": this.titleId, "aria-modal": "true", role: "dialog" }, h("div", { class: {
         [CSS.container]: true,
+        [CSS.containerOpen]: this.isOpen,
         [CSS.slottedInShell]: this.slottedInShell
       } }, h("calcite-scrim", { class: CSS.scrim, onClick: this.handleOutsideClose }), this.renderStyle(), h("div", { class: {
-        [CSS.modal]: true,
-        [CSS.modalOpen]: this.isOpen
-      }, ref: this.setTransitionEl }, h("div", { class: CSS.header }, this.renderCloseButton(), h("header", { class: CSS.title }, h("slot", { name: CSS.header }))), h("div", { class: {
+        [CSS.modal]: true
+      },
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: this.setTransitionEl }, h("div", { class: CSS.header }, this.renderCloseButton(), h("header", { class: CSS.title }, h("slot", { name: CSS.header }))), this.renderContentTop(), h("div", { class: {
         [CSS.content]: true,
         [CSS.contentNoFooter]: !this.hasFooter
-      }, ref: (el) => (this.modalContent = el) }, h("slot", { name: SLOTS.content })), this.renderFooter()))));
+      },
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: (el) => (this.modalContent = el) }, h("slot", { name: SLOTS.content })), this.renderContentBottom(), this.renderFooter()))));
   }
   renderFooter() {
     return this.hasFooter ? (h("div", { class: CSS.footer, key: "footer" }, h("span", { class: CSS.back }, h("slot", { name: SLOTS.back })), h("span", { class: CSS.secondary }, h("slot", { name: SLOTS.secondary })), h("span", { class: CSS.primary }, h("slot", { name: SLOTS.primary })))) : null;
   }
+  renderContentTop() {
+    return (h("div", { class: CSS.contentTop, hidden: !this.hasContentTop }, h("slot", { name: SLOTS.contentTop, onSlotchange: this.contentTopSlotChangeHandler })));
+  }
+  renderContentBottom() {
+    return (h("div", { class: CSS.contentBottom, hidden: !this.hasContentBottom }, h("slot", { name: SLOTS.contentBottom, onSlotchange: this.contentBottomSlotChangeHandler })));
+  }
   renderCloseButton() {
-    return !this.closeButtonDisabled ? (h("button", { "aria-label": this.messages.close, class: CSS.close, key: "button", onClick: this.close, ref: (el) => (this.closeButtonEl = el), title: this.messages.close }, h("calcite-icon", { icon: ICONS.close, scale: this.scale === "s" ? "s" : this.scale === "m" ? "m" : this.scale === "l" ? "l" : null }))) : null;
+    return !this.closeButtonDisabled ? (h("button", { "aria-label": this.messages.close, class: CSS.close, key: "button", onClick: this.close, title: this.messages.close,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: (el) => (this.closeButtonEl = el) }, h("calcite-icon", { icon: ICONS.close, scale: this.scale === "s" ? "s" : this.scale === "m" ? "m" : this.scale === "l" ? "l" : null }))) : null;
   }
   renderStyle() {
     if (!this.fullscreen && (this.cssWidth || this.cssHeight)) {
@@ -580,6 +602,8 @@ export class Modal {
       "cssWidth": {},
       "cssHeight": {},
       "hasFooter": {},
+      "hasContentTop": {},
+      "hasContentBottom": {},
       "isOpen": {},
       "effectiveLocale": {},
       "defaultMessages": {}

package/dist/collection/components/modal/resources.js CHANGED Viewed

@@ -1,11 +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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   modal: "modal",
-  modalOpen: "modal--open",
   title: "title",
   header: "header",
   footer: "footer",
@@ -16,8 +15,11 @@ export const CSS = {
   primary: "primary",
   overflowHidden: "overflow-hidden",
   container: "container",
+  containerOpen: "container--open",
   content: "content",
   contentNoFooter: "content--no-footer",
+  contentBottom: "content-bottom",
+  contentTop: "content-top",
   slottedInShell: "slotted-in-shell",
   // these classes help apply the animation in phases to only set transform on open/close
   // this helps avoid a positioning issue for any floating-ui-owning children
@@ -37,6 +39,8 @@ export const ICONS = {
 };
 export const SLOTS = {
   content: "content",
+  contentBottom: "content-bottom",
+  contentTop: "content-top",
   header: "header",
   back: "back",
   secondary: "secondary",

package/dist/collection/components/notice/notice.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/notice/notice.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
@@ -77,7 +77,9 @@ export class Notice {
   }
   render() {
     const { el } = this;
-    const closeButton = (h("button", { "aria-label": this.messages.close, class: CSS.close, onClick: this.close, ref: (el) => (this.closeButton = el) }, h("calcite-icon", { icon: "x", scale: this.scale === "l" ? "m" : "s" })));
+    const closeButton = (h("button", { "aria-label": this.messages.close, class: CSS.close, onClick: this.close,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: (el) => (this.closeButton = el) }, h("calcite-icon", { icon: "x", scale: this.scale === "l" ? "m" : "s" })));
     const hasActionEnd = getSlotted(el, SLOTS.actionsEnd);
     return (h("div", { class: CSS.container }, this.requestedIcon ? (h("div", { class: CSS.icon }, h("calcite-icon", { flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: this.scale === "l" ? "m" : "s" }))) : null, h("div", { class: CSS.content }, h("slot", { name: SLOTS.title }), h("slot", { name: SLOTS.message }), h("slot", { name: SLOTS.link })), hasActionEnd ? (h("div", { class: CSS.actionsEnd }, h("slot", { name: SLOTS.actionsEnd }))) : null, this.closable ? closeButton : null));
   }

package/dist/collection/components/notice/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const SLOTS = {
   title: "title",

package/dist/collection/components/option/option.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/option/option.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { h } from "@stencil/core";
 import { createObserver } from "../../utils/observers";

package/dist/collection/components/option-group/option-group.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/option-group/option-group.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { Fragment, h } from "@stencil/core";
 /**

package/dist/collection/components/pagination/pagination.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/pagination/pagination.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { Fragment, h } from "@stencil/core";
 import { connectLocalized, disconnectLocalized, numberStringFormatter } from "../../utils/locale";

package/dist/collection/components/pagination/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   page: "page",

package/dist/collection/components/panel/panel.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/panel/panel.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { Fragment, h } from "@stencil/core";
 import { focusFirstTabbable, toAriaBoolean } from "../../utils/dom";
@@ -212,7 +212,9 @@ export class Panel {
   renderHeaderActionsEnd() {
     const { close, hasEndActions, messages, closable } = this;
     const text = messages.close;
-    const closableNode = closable ? (h("calcite-action", { "aria-label": text, icon: ICONS.close, onClick: close, ref: this.setCloseRef, text: text })) : null;
+    const closableNode = closable ? (h("calcite-action", { "aria-label": text, icon: ICONS.close, onClick: close, text: text,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: this.setCloseRef })) : null;
     const slotNode = (h("slot", { name: SLOTS.headerActionsEnd, onSlotchange: this.handleHeaderActionsEndSlotChange }));
     const showContainer = hasEndActions || closableNode;
     return (h("div", { class: { [CSS.headerActionsEnd]: true, [CSS.headerActions]: true }, hidden: !showContainer, key: "header-actions-end" }, slotNode, closableNode));
@@ -245,14 +247,18 @@ export class Panel {
         [CSS.contentWrapper]: true,
         [CSS.contentContainer]: !hasFab,
         [CSS.contentHeight]: hasFab
-      }, onScroll: this.panelScrollHandler, ref: this.setPanelScrollEl }, containerNode, this.renderFab()));
+      }, onScroll: this.panelScrollHandler,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: this.setPanelScrollEl }, containerNode, this.renderFab()));
   }
   renderFab() {
     return (h("div", { class: CSS.fabContainer, hidden: !this.hasFab }, h("slot", { name: SLOTS.fab, onSlotchange: this.handleFabSlotChange })));
   }
   render() {
     const { loading, panelKeyDownHandler, closed, closable } = this;
-    const panelNode = (h("article", { "aria-busy": toAriaBoolean(loading), class: CSS.container, hidden: closed, onKeyDown: panelKeyDownHandler, ref: this.setContainerRef, tabIndex: closable ? 0 : -1 }, this.renderHeaderNode(), this.renderContent(), this.renderFooterNode()));
+    const panelNode = (h("article", { "aria-busy": toAriaBoolean(loading), class: CSS.container, hidden: closed, onKeyDown: panelKeyDownHandler, tabIndex: closable ? 0 : -1,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: this.setContainerRef }, this.renderHeaderNode(), this.renderContent(), this.renderFooterNode()));
     return (h(Fragment, null, loading ? h("calcite-scrim", { loading: loading }) : null, panelNode));
   }
   static get is() { return "calcite-panel"; }

package/dist/collection/components/panel/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   backButton: "back-button",

package/dist/collection/components/pick-list/pick-list.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/pick-list/pick-list.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { h } from "@stencil/core";
 import { updateHostInteraction } from "../../utils/interactive";

package/dist/collection/components/pick-list/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   sticky: "sticky-pos"

package/dist/collection/components/pick-list/shared-list-logic.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { debounce } from "lodash-es";
 import { getRoundRobinIndex } from "../../utils/array";

package/dist/collection/components/pick-list/shared-list-render.js CHANGED Viewed

@@ -1,13 +1,17 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.1.0-next.3
+ * v1.1.0
  */
 import { h, Host } from "@stencil/core";
 import { toAriaBoolean } from "../../utils/dom";
 import { CSS, SLOTS } from "./resources";
 export const List = ({ props: { disabled, loading, filterEnabled, dataForFilter, handleFilterEvent, filterPlaceholder, filterText, setFilterEl, dragEnabled, storeAssistiveEl }, ...rest }) => {
   const defaultSlot = h("slot", null);
-  return (h(Host, { "aria-busy": toAriaBoolean(loading), role: "menu", ...rest }, h("section", null, dragEnabled ? (h("span", { "aria-live": "assertive", class: "assistive-text", ref: storeAssistiveEl })) : null, h("header", { class: { [CSS.sticky]: true } }, filterEnabled ? (h("calcite-filter", { "aria-label": filterPlaceholder, disabled: loading || disabled, items: dataForFilter, onCalciteFilterChange: handleFilterEvent, placeholder: filterPlaceholder, ref: setFilterEl, value: filterText })) : null, h("slot", { name: SLOTS.menuActions })), loading ? h("calcite-scrim", { loading: loading }) : null, defaultSlot)));
+  return (h(Host, { "aria-busy": toAriaBoolean(loading), role: "menu", ...rest }, h("section", null, dragEnabled ? (h("span", { "aria-live": "assertive", class: "assistive-text",
+    // eslint-disable-next-line react/jsx-sort-props
+    ref: storeAssistiveEl })) : null, h("header", { class: { [CSS.sticky]: true } }, filterEnabled ? (h("calcite-filter", { "aria-label": filterPlaceholder, disabled: loading || disabled, items: dataForFilter, onCalciteFilterChange: handleFilterEvent, placeholder: filterPlaceholder, value: filterText,
+    // eslint-disable-next-line react/jsx-sort-props
+    ref: setFilterEl })) : null, h("slot", { name: SLOTS.menuActions })), loading ? h("calcite-scrim", { loading: loading }) : null, defaultSlot)));
 };
 export default List;

package/dist/collection/components/pick-list-group/pick-list-group.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/pick-list-group/pick-list-group.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/pick-list-group/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   heading: "heading",

package/dist/collection/components/pick-list-item/pick-list-item.css CHANGED Viewed

@@ -70,9 +70,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */

package/dist/collection/components/pick-list-item/pick-list-item.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
@@ -160,7 +160,9 @@ export class PickListItem {
   }
   render() {
     const { description, label } = this;
-    return (h(Fragment, null, this.renderIcon(), this.renderActionsStart(), h("label", { "aria-label": label, class: CSS.label, onClick: this.pickListClickHandler, onKeyDown: this.pickListKeyDownHandler, ref: (focusEl) => (this.focusEl = focusEl), tabIndex: 0 }, h("div", { "aria-checked": toAriaBoolean(this.selected), class: CSS.textContainer, role: "menuitemcheckbox" }, h("span", { class: CSS.title }, label), description ? h("span", { class: CSS.description }, description) : null)), this.renderActionsEnd()));
+    return (h(Fragment, null, this.renderIcon(), this.renderActionsStart(), h("label", { "aria-label": label, class: CSS.label, onClick: this.pickListClickHandler, onKeyDown: this.pickListKeyDownHandler, tabIndex: 0,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: (focusEl) => (this.focusEl = focusEl) }, h("div", { "aria-checked": toAriaBoolean(this.selected), class: CSS.textContainer, role: "menuitemcheckbox" }, h("span", { class: CSS.title }, label), description ? h("span", { class: CSS.description }, description) : null)), this.renderActionsEnd()));
   }
   static get is() { return "calcite-pick-list-item"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/pick-list-item/resources.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 export const CSS = {
   actions: "actions",

package/dist/collection/components/popover/PopoverManager.js CHANGED Viewed

@@ -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.1.0-next.3
+ * v1.1.0
  */
 import { isPrimaryPointerButton } from "../../utils/dom";
 import { isActivationKey } from "../../utils/key";

package/dist/collection/components/popover/popover.css CHANGED Viewed

@@ -69,9 +69,10 @@
 @media (prefers-reduced-motion: reduce) {
   :root {
-    --calcite-internal-duration-factor: 0;
+    --calcite-internal-duration-factor: 0.01;
   }
 }
+/* helper to properly scale internal durations */
 /**
 * Currently only used in Checkbox.
 */