@esri/solutions-components 0.6.1 → 0.6.2

package/dist/components/tr.js

@@ -0,0 +1,46 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { d as dayjs } from './calcite-input-time-picker.js';
+
+// Turkish [tr]
+var locale = {
+  name: 'tr',
+  weekdays: 'Pazar_Pazartesi_Salı_Çarşamba_Perşembe_Cuma_Cumartesi'.split('_'),
+  weekdaysShort: 'Paz_Pts_Sal_Çar_Per_Cum_Cts'.split('_'),
+  weekdaysMin: 'Pz_Pt_Sa_Ça_Pe_Cu_Ct'.split('_'),
+  months: 'Ocak_Şubat_Mart_Nisan_Mayıs_Haziran_Temmuz_Ağustos_Eylül_Ekim_Kasım_Aralık'.split('_'),
+  monthsShort: 'Oca_Şub_Mar_Nis_May_Haz_Tem_Ağu_Eyl_Eki_Kas_Ara'.split('_'),
+  weekStart: 1,
+  formats: {
+    LT: 'HH:mm',
+    LTS: 'HH:mm:ss',
+    L: 'DD.MM.YYYY',
+    LL: 'D MMMM YYYY',
+    LLL: 'D MMMM YYYY HH:mm',
+    LLLL: 'dddd, D MMMM YYYY HH:mm'
+  },
+  relativeTime: {
+    future: '%s sonra',
+    past: '%s önce',
+    s: 'birkaç saniye',
+    m: 'bir dakika',
+    mm: '%d dakika',
+    h: 'bir saat',
+    hh: '%d saat',
+    d: 'bir gün',
+    dd: '%d gün',
+    M: 'bir ay',
+    MM: '%d ay',
+    y: 'bir yıl',
+    yy: '%d yıl'
+  },
+  ordinal: function ordinal(n) {
+    return n + ".";
+  }
+};
+dayjs.locale(locale, null, true);
+
+export default locale;

package/dist/components/tree-item.js

@@ -4,7 +4,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { b as getSlotted, s as slotChangeHasAssignedElement, c as getElementDir, C as CSS_UTILITY, t as toAriaBoolean, r as filterDirectChildren, p as nodeListToArray } from './dom.js';
+import { b as getSlotted, e as slotChangeHasAssignedElement, c as getElementDir, C as CSS_UTILITY, t as toAriaBoolean, r as filterDirectChildren, p as nodeListToArray } from './dom.js';
 import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot.js';
 import { u as updateHostInteraction } from './interactive.js';
 import { o as onToggleOpenCloseComponent } from './openCloseComponent.js';
@@ -14,7 +14,7 @@ import { d as defineCustomElement$1 } from './icon.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.2.0
+ * v1.4.2
  */
 const CSS = {
   actionsEnd: "actions-end",
@@ -40,7 +40,7 @@ const ICONS = {
   blank: "blank"
 };
 
-const treeItemCss = "@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-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-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:600}:host([hidden]){display:none}:host([disabled]){pointer-events:none;cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host{display:block;max-inline-size:100%;cursor:pointer;color:var(--calcite-ui-text-3)}[hidden]{display:none}.node-actions-container{display:flex;justify-content:space-between}:host([calcite-hydrated-hidden]){visibility:hidden !important;pointer-events:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}:host([scale=s]){font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=s]) .node-actions-container{min-block-size:1.5rem}:host([scale=s]) .node-actions-container .node-container .checkbox,:host([scale=s]) .node-actions-container .node-container .chevron,:host([scale=s]) .node-actions-container .node-container .checkmark,:host([scale=s]) .node-actions-container .node-container .bullet-point{margin-inline:0.25rem}:host([scale=s]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([scale=m]){font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=m]) .node-actions-container{min-block-size:2rem}:host([scale=m]) .node-actions-container .node-container .checkbox,:host([scale=m]) .node-actions-container .node-container .chevron,:host([scale=m]) .node-actions-container .node-container .checkmark,:host([scale=m]) .node-actions-container .node-container .bullet-point{margin-inline:0.5rem}:host([scale=m]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([scale=l]){font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([scale=l]) .node-actions-container{min-block-size:2.75rem}:host([scale=l]) .node-actions-container .node-container .checkbox,:host([scale=l]) .node-actions-container .node-container .chevron,:host([scale=l]) .node-actions-container .node-container .checkmark,:host([scale=l]) .node-actions-container .node-container .bullet-point{margin-inline:0.75rem}:host([scale=l]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([lines]) .children-container:after{position:absolute;inset-block-start:0px;z-index:1;inline-size:1px;transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;block-size:96%;content:\"\";background-color:var(--calcite-ui-border-2)}:host(:not([lines])) .node-container:after{display:none}::slotted(*){min-inline-size:0px;max-inline-size:100%;overflow-wrap:break-word;color:inherit;text-decoration:none !important}::slotted(*):hover{text-decoration:none !important}::slotted(a){inline-size:100%;-webkit-text-decoration-line:none;text-decoration-line:none}:host{outline-color:transparent}:host:focus,:host:active{outline:2px solid transparent;outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}:host(:focus:not([disabled])){outline:2px solid transparent;outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}.actions-end{display:flex;flex-direction:row;align-items:center;align-self:stretch}.checkbox{line-height:0}.checkbox-label{pointer-events:none;display:flex;align-items:center}.checkbox:focus{outline:2px solid transparent;outline-offset:2px}.children-container{position:relative;block-size:0px;overflow:hidden;-webkit-margin-start:1.25rem;margin-inline-start:1.25rem;transform:scaleY(0);opacity:0;transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;transform-origin:top}.item--expanded>.children-container{overflow:visible;opacity:1;block-size:auto}.node-container{position:relative;display:flex;min-inline-size:0px;align-items:center}.node-container .checkmark,.node-container .bullet-point{opacity:0;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;color:var(--calcite-ui-border-1)}.node-container:hover .checkmark,.node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark,:host([selected]) .node-container:hover .bullet-point,:host(:focus:not([disabled])) .node-container .checkmark,:host(:focus:not([disabled])) .node-container .bullet-point{opacity:1}:host([selected]) .node-container,:host([selected]) .node-container:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([selected]) .node-container .bullet-point,:host([selected]) .node-container .checkmark,:host([selected]) .node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark{opacity:1;color:var(--calcite-ui-brand)}:host([selection-mode=none]:not([has-children])):host([scale=s]) .node-container{-webkit-padding-start:0.5rem;padding-inline-start:0.5rem}:host([selection-mode=none]:not([has-children])):host([scale=m]) .node-container{-webkit-padding-start:1rem;padding-inline-start:1rem}:host([selection-mode=none]:not([has-children])):host([scale=l]) .node-container{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}:host(:not([has-children])):host([scale=s]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.25rem;padding-inline-start:1.25rem}:host(:not([has-children])):host([scale=m]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}:host(:not([has-children])):host([scale=l]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}:host([has-children]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-margin-start:0;margin-inline-start:0}:host([has-children]) .node-container .bullet-point,:host([has-children]) .node-container .checkmark{display:none}:host([has-children][expanded]:not([selected]):not([selection-mode=none])) .node-container ::slotted(*){font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([has-children][selected]) .node-container[data-selection-mode=children],:host([has-children][selected]) .node-container[data-selection-mode=multichildren]{color:var(--calcite-ui-brand)}.chevron{position:relative;align-self:center;color:var(--calcite-ui-text-3);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;flex:0 0 auto;transform:rotate(0deg)}.calcite--rtl .chevron{transform:rotate(180deg)}.item--expanded .node-container>.chevron{transform:rotate(90deg)}:host([selected]) .checkmark,:host([selected]) .bullet-point{color:var(--calcite-ui-brand)}";
+const treeItemCss = "@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;max-inline-size:100%;cursor:pointer;color:var(--calcite-ui-text-3)}[hidden]{display:none}.node-actions-container{display:flex;justify-content:space-between}:host([calcite-hydrated-hidden]){visibility:hidden !important;pointer-events:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}:host([scale=s]){font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=s]) .node-actions-container{min-block-size:1.5rem}:host([scale=s]) .node-actions-container .node-container .checkbox,:host([scale=s]) .node-actions-container .node-container .chevron,:host([scale=s]) .node-actions-container .node-container .checkmark,:host([scale=s]) .node-actions-container .node-container .bullet-point{margin-inline:0.25rem}:host([scale=s]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([scale=m]){font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=m]) .node-actions-container{min-block-size:2rem}:host([scale=m]) .node-actions-container .node-container .checkbox,:host([scale=m]) .node-actions-container .node-container .chevron,:host([scale=m]) .node-actions-container .node-container .checkmark,:host([scale=m]) .node-actions-container .node-container .bullet-point{margin-inline:0.5rem}:host([scale=m]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([scale=l]){font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([scale=l]) .node-actions-container{min-block-size:2.75rem}:host([scale=l]) .node-actions-container .node-container .checkbox,:host([scale=l]) .node-actions-container .node-container .chevron,:host([scale=l]) .node-actions-container .node-container .checkmark,:host([scale=l]) .node-actions-container .node-container .bullet-point{margin-inline:0.75rem}:host([scale=l]) .node-actions-container .node-container .icon-start{margin-inline:0.75rem}:host([lines]) .children-container:after{position:absolute;inset-block-start:0px;z-index:var(--calcite-app-z-index);inline-size:1px;transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;block-size:96%;content:\"\";background-color:var(--calcite-ui-border-2)}:host(:not([lines])) .node-container:after{display:none}::slotted(*){min-inline-size:0px;max-inline-size:100%;overflow-wrap:break-word;color:inherit;text-decoration:none !important}::slotted(*):hover{text-decoration:none !important}::slotted(a){inline-size:100%;-webkit-text-decoration-line:none;text-decoration-line:none}:host{outline-color:transparent}:host:focus,:host:active{outline:2px solid transparent;outline-offset:2px;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          )}:host(:focus:not([disabled])){outline:2px solid transparent;outline-offset:2px;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          )}.actions-end{display:flex;flex-direction:row;align-items:center;align-self:stretch}.checkbox{line-height:0}.checkbox-label{pointer-events:none;display:flex;align-items:center}.checkbox:focus{outline:2px solid transparent;outline-offset:2px}.children-container{position:relative;block-size:0px;overflow:hidden;-webkit-margin-start:1.25rem;margin-inline-start:1.25rem;transform:scaleY(0);opacity:0;transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;transform-origin:top}.item--expanded>.children-container{overflow:visible;opacity:1;block-size:auto}.node-container{position:relative;display:flex;min-inline-size:0px;align-items:center}.node-container .checkmark,.node-container .bullet-point{opacity:0;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;color:var(--calcite-ui-border-1)}.node-container:hover .checkmark,.node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark,:host([selected]) .node-container:hover .bullet-point,:host(:focus:not([disabled])) .node-container .checkmark,:host(:focus:not([disabled])) .node-container .bullet-point{opacity:1}:host([selected]) .node-container,:host([selected]) .node-container:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([selected]) .node-container .bullet-point,:host([selected]) .node-container .checkmark,:host([selected]) .node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark{opacity:1;color:var(--calcite-ui-brand)}:host([selection-mode=none]:not([has-children])):host([scale=s]) .node-container{-webkit-padding-start:0.5rem;padding-inline-start:0.5rem}:host([selection-mode=none]:not([has-children])):host([scale=m]) .node-container{-webkit-padding-start:1rem;padding-inline-start:1rem}:host([selection-mode=none]:not([has-children])):host([scale=l]) .node-container{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}:host(:not([has-children])):host([scale=s]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.25rem;padding-inline-start:1.25rem}:host(:not([has-children])):host([scale=m]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}:host(:not([has-children])):host([scale=l]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}:host([has-children]) .node-container[data-selection-mode=ancestors] .checkbox{-webkit-margin-start:0;margin-inline-start:0}:host([has-children]) .node-container .bullet-point,:host([has-children]) .node-container .checkmark{display:none}:host([has-children][expanded]:not([selected]):not([selection-mode=none])) .node-container ::slotted(*){font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([has-children][selected]) .node-container[data-selection-mode=children],:host([has-children][selected]) .node-container[data-selection-mode=multichildren]{color:var(--calcite-ui-brand)}.chevron{position:relative;align-self:center;color:var(--calcite-ui-text-3);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;flex:0 0 auto;transform:rotate(0deg)}.calcite--rtl .chevron{transform:rotate(180deg)}.item--expanded .node-container>.chevron{transform:rotate(90deg)}:host([selected]) .checkmark,:host([selected]) .bullet-point{color:var(--calcite-ui-brand)}";
 
 const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -55,11 +55,6 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       this.expanded = !this.expanded;
     };
     this.childrenClickHandler = (event) => event.stopPropagation();
-    //--------------------------------------------------------------------------
-    //
-    //  Private Methods
-    //
-    //--------------------------------------------------------------------------
     this.updateParentIsExpanded = (el, expanded) => {
       const items = getSlotted(el, SLOTS.children, {
         all: true,
@@ -67,19 +62,6 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       });
       items.forEach((item) => (item.parentExpanded = expanded));
     };
-    this.updateAncestorTree = () => {
-      var _a;
-      if (this.selected && this.selectionMode === "ancestors") {
-        const ancestors = [];
-        let parent = this.parentTreeItem;
-        while (parent) {
-          ancestors.push(parent);
-          parent = (_a = parent.parentElement) === null || _a === void 0 ? void 0 : _a.closest("calcite-tree-item");
-        }
-        ancestors.forEach((item) => (item.indeterminate = true));
-        return;
-      }
-    };
     this.actionsEndSlotChangeHandler = (event) => {
       this.hasEndActions = slotChangeHasAssignedElement(event);
     };
@@ -93,7 +75,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.hasChildren = null;
     this.lines = undefined;
     this.scale = undefined;
-    this.indeterminate = undefined;
+    this.indeterminate = false;
     this.selectionMode = undefined;
     this.updateAfterInitialRender = false;
     this.hasEndActions = false;
@@ -215,7 +197,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
         [CSS_UTILITY.rtl]: rtl
       }, "data-selection-mode": this.selectionMode,
       // eslint-disable-next-line react/jsx-sort-props
-      ref: (el) => (this.defaultSlotWrapper = el) }, chevron, itemIndicator, this.iconStart ? iconStartEl : null, checkbox ? checkbox : defaultSlotNode), h("div", { class: CSS.actionsEnd, hidden: !hasEndActions }, slotNode)), h("div", { class: {
+      ref: (el) => (this.defaultSlotWrapper = el) }, chevron, itemIndicator, this.iconStart ? iconStartEl : null, checkbox ? checkbox : defaultSlotNode), h("div", { class: CSS.actionsEnd, hidden: !hasEndActions, ref: (el) => (this.actionSlotWrapper = el) }, slotNode)), h("div", { class: {
         [CSS.childrenContainer]: true,
         [CSS_UTILITY.rtl]: rtl
       }, "data-test-id": "calcite-tree-children", onClick: this.childrenClickHandler, role: this.hasChildren ? "group" : undefined,
@@ -231,6 +213,9 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //
   //--------------------------------------------------------------------------
   onClick(event) {
+    if (this.disabled || this.isActionEndEvent(event)) {
+      return;
+    }
     // Solve for if the item is clicked somewhere outside the slotted anchor.
     // Anchor is triggered anywhere you click
     const [link] = filterDirectChildren(this.el, "a");
@@ -245,6 +230,9 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   keyDownHandler(event) {
     let root;
+    if (this.isActionEndEvent(event)) {
+      return;
+    }
     switch (event.key) {
       case " ":
         if (this.selectionMode === "none") {
@@ -291,6 +279,43 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
         break;
     }
   }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  isActionEndEvent(event) {
+    const composedPath = event.composedPath();
+    return composedPath.includes(this.actionSlotWrapper);
+  }
+  /**
+   * This is meant to be called in `componentDidLoad` in order to take advantage of the hierarchical component lifecycle
+   * and help check for item selection as items are initialized
+   *
+   * @private
+   */
+  updateAncestorTree() {
+    const parentItem = this.parentTreeItem;
+    if (this.selectionMode !== "ancestors" || !parentItem) {
+      return;
+    }
+    if (this.selected) {
+      const parentTree = this.el.parentElement;
+      const siblings = Array.from(parentTree === null || parentTree === void 0 ? void 0 : parentTree.children);
+      const selectedSiblings = siblings.filter((child) => child.selected);
+      if (siblings.length === selectedSiblings.length) {
+        parentItem.selected = true;
+        parentItem.indeterminate = false;
+      }
+      else if (selectedSiblings.length > 0) {
+        parentItem.indeterminate = true;
+      }
+    }
+    else if (this.indeterminate) {
+      const parentItem = this.parentTreeItem;
+      parentItem.indeterminate = true;
+    }
+  }
   get el() { return this; }
   static get watchers() { return {
     "expanded": ["expandedHandler"],

package/dist/components/tree.js

@@ -4,12 +4,12 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { h as focusElement, p as nodeListToArray, u as getRootNode } from './dom.js';
+import { j as focusElement, p as nodeListToArray, v as getRootNode } from './dom.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.2.0
+ * v1.4.2
  */
 function isTreeItem(element) {
   return element?.matches("calcite-tree-item");
@@ -28,7 +28,7 @@ function getEnabledSiblingItem(el, direction) {
   return enabledEl;
 }
 
-const treeCss = "@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-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-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:600}:host([hidden]){display:none}:host{display:block}:host(:focus){outline:2px solid transparent;outline-offset:2px}";
+const treeCss = "@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}:host(:focus){outline:2px solid transparent;outline-offset:2px}";
 
 const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -103,26 +103,24 @@ const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       (!target.hasChildren ||
         (target.hasChildren &&
           (this.selectionMode === "children" || this.selectionMode === "multichildren")));
+    const shouldDeselectAllChildren = this.selectionMode === "multichildren" && target.hasChildren;
     const shouldModifyToCurrentSelection = !isNoneSelectionMode &&
       event.detail.modifyCurrentSelection &&
       (this.selectionMode === "multiple" || this.selectionMode === "multichildren");
-    const shouldSelectChildren = this.selectionMode === "multichildren" || this.selectionMode === "children";
     const shouldClearCurrentSelection = !shouldModifyToCurrentSelection &&
       (((this.selectionMode === "single" || this.selectionMode === "multiple") &&
         childItems.length <= 0) ||
         this.selectionMode === "children" ||
         this.selectionMode === "multichildren");
-    const shouldExpandTarget = this.selectionMode === "children" || this.selectionMode === "multichildren";
+    const shouldUpdateExpand = ["children", "multichildren"].includes(this.selectionMode) ||
+      (["single", "multiple"].includes(this.selectionMode) &&
+        target.hasChildren &&
+        !event.detail.forceToggle);
     if (!this.child) {
       const targetItems = [];
       if (shouldSelect) {
         targetItems.push(target);
       }
-      if (shouldSelectChildren) {
-        childItems.forEach((treeItem) => {
-          targetItems.push(treeItem);
-        });
-      }
       if (shouldClearCurrentSelection) {
         const selectedItems = nodeListToArray(this.el.querySelectorAll("calcite-tree-item[selected]"));
         selectedItems.forEach((treeItem) => {
@@ -131,14 +129,29 @@ const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
           }
         });
       }
-      if (shouldExpandTarget && !event.detail.forceToggle) {
-        target.expanded = true;
+      if (shouldUpdateExpand) {
+        if (["single", "multiple"].includes(this.selectionMode)) {
+          target.expanded = !target.expanded;
+        }
+        else if (this.selectionMode === "multichildren") {
+          target.expanded = !target.selected;
+        }
+        else if (this.selectionMode === "children") {
+          target.expanded = target.selected ? !target.expanded : true;
+        }
+      }
+      if (shouldDeselectAllChildren) {
+        childItems.forEach((item) => {
+          item.selected = false;
+          if (item.hasChildren) {
+            item.expanded = false;
+          }
+        });
       }
       if (shouldModifyToCurrentSelection) {
         window.getSelection().removeAllRanges();
       }
-      if ((shouldModifyToCurrentSelection && target.selected) ||
-        (shouldSelectChildren && event.detail.forceToggle)) {
+      if ((shouldModifyToCurrentSelection && target.selected) || event.detail.forceToggle) {
         targetItems.forEach((treeItem) => {
           if (!treeItem.disabled) {
             treeItem.selected = false;

package/dist/components/uk.js

@@ -0,0 +1,84 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { d as dayjs } from './calcite-input-time-picker.js';
+
+// Ukrainian [uk]
+var monthFormat = 'січня_лютого_березня_квітня_травня_червня_липня_серпня_вересня_жовтня_листопада_грудня'.split('_');
+var monthStandalone = 'січень_лютий_березень_квітень_травень_червень_липень_серпень_вересень_жовтень_листопад_грудень'.split('_');
+var MONTHS_IN_FORMAT = /D[oD]?(\[[^[\]]*\]|\s)+MMMM?/;
+
+function plural(word, num) {
+  var forms = word.split('_');
+  return num % 10 === 1 && num % 100 !== 11 ? forms[0] : num % 10 >= 2 && num % 10 <= 4 && (num % 100 < 10 || num % 100 >= 20) ? forms[1] : forms[2]; // eslint-disable-line
+}
+
+function relativeTimeWithPlural(number, withoutSuffix, key) {
+  var format = {
+    ss: withoutSuffix ? 'секунда_секунди_секунд' : 'секунду_секунди_секунд',
+    mm: withoutSuffix ? 'хвилина_хвилини_хвилин' : 'хвилину_хвилини_хвилин',
+    hh: withoutSuffix ? 'година_години_годин' : 'годину_години_годин',
+    dd: 'день_дні_днів',
+    MM: 'місяць_місяці_місяців',
+    yy: 'рік_роки_років'
+  };
+
+  if (key === 'm') {
+    return withoutSuffix ? 'хвилина' : 'хвилину';
+  } else if (key === 'h') {
+    return withoutSuffix ? 'година' : 'годину';
+  }
+
+  return number + " " + plural(format[key], +number);
+}
+
+var months = function months(dayjsInstance, format) {
+  if (MONTHS_IN_FORMAT.test(format)) {
+    return monthFormat[dayjsInstance.month()];
+  }
+
+  return monthStandalone[dayjsInstance.month()];
+};
+
+months.s = monthStandalone;
+months.f = monthFormat;
+var locale = {
+  name: 'uk',
+  weekdays: 'неділя_понеділок_вівторок_середа_четвер_п’ятниця_субота'.split('_'),
+  weekdaysShort: 'ндл_пнд_втр_срд_чтв_птн_сбт'.split('_'),
+  weekdaysMin: 'нд_пн_вт_ср_чт_пт_сб'.split('_'),
+  months: months,
+  monthsShort: 'січ_лют_бер_квіт_трав_черв_лип_серп_вер_жовт_лист_груд'.split('_'),
+  weekStart: 1,
+  relativeTime: {
+    future: 'за %s',
+    past: '%s тому',
+    s: 'декілька секунд',
+    m: relativeTimeWithPlural,
+    mm: relativeTimeWithPlural,
+    h: relativeTimeWithPlural,
+    hh: relativeTimeWithPlural,
+    d: 'день',
+    dd: relativeTimeWithPlural,
+    M: 'місяць',
+    MM: relativeTimeWithPlural,
+    y: 'рік',
+    yy: relativeTimeWithPlural
+  },
+  ordinal: function ordinal(n) {
+    return n;
+  },
+  formats: {
+    LT: 'HH:mm',
+    LTS: 'HH:mm:ss',
+    L: 'DD.MM.YYYY',
+    LL: 'D MMMM YYYY р.',
+    LLL: 'D MMMM YYYY р., HH:mm',
+    LLLL: 'dddd, D MMMM YYYY р., HH:mm'
+  }
+};
+dayjs.locale(locale, null, true);
+
+export default locale;

package/dist/components/utils.js

@@ -6,52 +6,93 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.2.0
+ * v1.4.2
  */
-function rgbToHex(color) {
-  const { r, g, b } = color;
-  return `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b
-    .toString(16)
-    .padStart(2, "0")}`.toLowerCase();
-}
 const hexChar = /^[0-9A-F]$/i;
-const shortHandHex = /^#[0-9A-F]{3}$/i;
+const shorthandHex = /^#[0-9A-F]{3}$/i;
 const longhandHex = /^#[0-9A-F]{6}$/i;
-function isValidHex(hex) {
-  return isShorthandHex(hex) || isLonghandHex(hex);
+const shorthandHexWithAlpha = /^#[0-9A-F]{4}$/i;
+const longhandHexWithAlpha = /^#[0-9A-F]{8}$/i;
+const alphaToOpacity = (alpha) => Number((alpha * 100).toFixed());
+const opacityToAlpha = (opacity) => Number((opacity / 100).toFixed(2));
+function isValidHex(hex, hasAlpha = false) {
+  return isShorthandHex(hex, hasAlpha) || isLonghandHex(hex, hasAlpha);
+}
+function evaluateHex(hex, length, pattern) {
+  if (!hex) {
+    return false;
+  }
+  return hex.length === length && pattern.test(hex);
 }
-function isShorthandHex(hex) {
-  return hex && hex.length === 4 && shortHandHex.test(hex);
+function isShorthandHex(hex, hasAlpha = false) {
+  const hexLength = hasAlpha ? 5 : 4;
+  const hexPattern = hasAlpha ? shorthandHexWithAlpha : shorthandHex;
+  return evaluateHex(hex, hexLength, hexPattern);
 }
-function isLonghandHex(hex) {
-  return hex && hex.length === 7 && longhandHex.test(hex);
+function isLonghandHex(hex, hasAlpha = false) {
+  const hexLength = hasAlpha ? 9 : 7;
+  const hexPattern = hasAlpha ? longhandHexWithAlpha : longhandHex;
+  return evaluateHex(hex, hexLength, hexPattern);
 }
-function normalizeHex(hex) {
+function normalizeHex(hex, hasAlpha = false, convertFromHexToHexa = false) {
   hex = hex.toLowerCase();
   if (!hex.startsWith("#")) {
     hex = `#${hex}`;
   }
-  if (isShorthandHex(hex)) {
-    return rgbToHex(hexToRGB(hex));
+  if (isShorthandHex(hex, hasAlpha)) {
+    return rgbToHex(hexToRGB(hex, hasAlpha));
+  }
+  if (hasAlpha && convertFromHexToHexa && isValidHex(hex, false /* we only care about RGB hex for conversion */)) {
+    const isShorthand = isShorthandHex(hex, false);
+    return rgbToHex(hexToRGB(`${hex}${isShorthand ? "f" : "ff"}`, true));
   }
   return hex;
 }
-function hexToRGB(hex) {
-  if (!isValidHex(hex)) {
+function hexify(color, hasAlpha = false) {
+  return hasAlpha ? color.hexa() : color.hex();
+}
+function rgbToHex(color) {
+  const { r, g, b } = color;
+  const rChars = numToHex(r);
+  const gChars = numToHex(g);
+  const bChars = numToHex(b);
+  const alphaChars = "a" in color ? numToHex(color.a * 255) : "";
+  return `#${rChars}${gChars}${bChars}${alphaChars}`.toLowerCase();
+}
+function numToHex(num) {
+  return num.toString(16).padStart(2, "0");
+}
+function normalizeAlpha(colorObject) {
+  const normalized = { ...colorObject, a: colorObject.alpha ?? 1 /* Color() will omit alpha if 1 */ };
+  delete normalized.alpha;
+  return normalized;
+}
+function normalizeColor(alphaColorObject) {
+  const normalized = { ...alphaColorObject, alpha: alphaColorObject.a ?? 1 };
+  delete normalized.a;
+  return normalized;
+}
+function hexToRGB(hex, hasAlpha = false) {
+  if (!isValidHex(hex, hasAlpha)) {
     return null;
   }
   hex = hex.replace("#", "");
-  if (hex.length === 3) {
-    const [first, second, third] = hex.split("");
-    const r = parseInt(`${first}${first}`, 16);
-    const g = parseInt(`${second}${second}`, 16);
-    const b = parseInt(`${third}${third}`, 16);
-    return { r, g, b };
+  let r, g, b, a;
+  const isShorthand = hex.length === 3 || hex.length === 4;
+  if (isShorthand) {
+    const [first, second, third, fourth] = hex.split("");
+    r = parseInt(`${first}${first}`, 16);
+    g = parseInt(`${second}${second}`, 16);
+    b = parseInt(`${third}${third}`, 16);
+    a = parseInt(`${fourth}${fourth}`, 16) / 255;
   }
-  const r = parseInt(hex.slice(0, 2), 16);
-  const g = parseInt(hex.slice(2, 4), 16);
-  const b = parseInt(hex.slice(4, 6), 16);
-  return { r, g, b };
+  else {
+    r = parseInt(hex.slice(0, 2), 16);
+    g = parseInt(hex.slice(2, 4), 16);
+    b = parseInt(hex.slice(4, 6), 16);
+    a = parseInt(hex.slice(6, 8), 16) / 255;
+  }
+  return isNaN(a) ? { r, g, b } : { r, g, b, a };
 }
 // these utils allow users to pass enum values as strings without having to access the enum
 // based on the approach suggested by https://github.com/microsoft/TypeScript/issues/17690#issuecomment-321365759,
@@ -113,7 +154,47 @@ function hasChannels(colorObject, ...channels) {
   return channels.every((channel) => channel && colorObject && `${channel}` in colorObject);
 }
 function colorEqual(value1, value2) {
-  return value1?.rgbNumber() === value2?.rgbNumber();
+  return value1?.rgb().array().toString() === value2?.rgb().array().toString();
+}
+function alphaCompatible(mode) {
+  return (mode === CSSColorMode.HEXA ||
+    mode === CSSColorMode.RGBA_CSS ||
+    mode === CSSColorMode.HSLA_CSS ||
+    mode === ObjectColorMode.RGBA ||
+    mode === ObjectColorMode.HSLA ||
+    mode === ObjectColorMode.HSVA);
+}
+function toAlphaMode(mode) {
+  const alphaMode = mode === CSSColorMode.HEX
+    ? CSSColorMode.HEXA
+    : mode === CSSColorMode.RGB_CSS
+      ? CSSColorMode.RGBA_CSS
+      : mode === CSSColorMode.HSL_CSS
+        ? CSSColorMode.HSLA_CSS
+        : mode === ObjectColorMode.RGB
+          ? ObjectColorMode.RGBA
+          : mode === ObjectColorMode.HSL
+            ? ObjectColorMode.HSLA
+            : mode === ObjectColorMode.HSV
+              ? ObjectColorMode.HSVA
+              : mode;
+  return alphaMode;
+}
+function toNonAlphaMode(mode) {
+  const nonAlphaMode = mode === CSSColorMode.HEXA
+    ? CSSColorMode.HEX
+    : mode === CSSColorMode.RGBA_CSS
+      ? CSSColorMode.RGB_CSS
+      : mode === CSSColorMode.HSLA_CSS
+        ? CSSColorMode.HSL_CSS
+        : mode === ObjectColorMode.RGBA
+          ? ObjectColorMode.RGB
+          : mode === ObjectColorMode.HSLA
+            ? ObjectColorMode.HSL
+            : mode === ObjectColorMode.HSVA
+              ? ObjectColorMode.HSV
+              : mode;
+  return nonAlphaMode;
 }
 
-export { CSSColorMode as C, isLonghandHex as a, hexChar as b, colorEqual as c, hexToRGB as h, isValidHex as i, normalizeHex as n, parseMode as p, rgbToHex as r };
+export { CSSColorMode as C, alphaCompatible as a, alphaToOpacity as b, colorEqual as c, normalizeAlpha as d, normalizeColor as e, toAlphaMode as f, hexToRGB as g, hexify as h, isValidHex as i, isLonghandHex as j, hexChar as k, normalizeHex as n, opacityToAlpha as o, parseMode as p, rgbToHex as r, toNonAlphaMode as t };

package/dist/components/utils2.js

@@ -9,16 +9,19 @@ import { Build } from '@stencil/core/internal/client';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.2.0
+ * v1.4.2
  */
 const ComboboxItem = "CALCITE-COMBOBOX-ITEM";
 const ComboboxItemGroup = "CALCITE-COMBOBOX-ITEM-GROUP";
 const ComboboxChildSelector = `${ComboboxItem}, ${ComboboxItemGroup}`;
+const CSS = {
+  listContainer: "list-container"
+};
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.2.0
+ * v1.4.2
  */
 function getAncestors(element) {
   const parent = element.parentElement?.closest(ComboboxChildSelector);
@@ -39,8 +42,8 @@ function getDepth(element) {
   if (!Build.isBrowser) {
     return 0;
   }
-  const result = document.evaluate("ancestor::calcite-combobox-item", element, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
+  const result = document.evaluate("ancestor::calcite-combobox-item | ancestor::calcite-combobox-item-group", element, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
   return result.snapshotLength;
 }
 
-export { ComboboxItemGroup as C, getDepth as a, ComboboxChildSelector as b, getItemAncestors as c, getItemChildren as d, ComboboxItem as e, getAncestors as g, hasActiveChildren as h };
+export { ComboboxItemGroup as C, getDepth as a, ComboboxChildSelector as b, getItemAncestors as c, getItemChildren as d, ComboboxItem as e, CSS as f, getAncestors as g, hasActiveChildren as h };

package/dist/components/utils3.js

@@ -8,7 +8,7 @@ import { Build } from '@stencil/core/internal/client';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.2.0
+ * v1.4.2
  */
 const CSS = {
   container: "container",
@@ -45,13 +45,14 @@ const ICONS = {
   closedLTR: "caret-right",
   closedRTL: "caret-left",
   open: "caret-down",
-  blank: "blank"
+  blank: "blank",
+  close: "x"
 };
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.2.0
+ * v1.4.2
  */
 const listItemGroupSelector = "calcite-list-item-group";
 const listItemSelector = "calcite-list-item";