@esri/calcite-components 1.0.0-next.408 → 1.0.0-next.409

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.
@@ -145,6 +145,61 @@ export class Tree {
145
145
  selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
146
146
  });
147
147
  }
148
+ keyDownHandler(event) {
149
+ var _a;
150
+ const root = this.el.closest("calcite-tree:not([child])");
151
+ const target = event.target;
152
+ if (root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target)) {
153
+ switch (event.key) {
154
+ case "ArrowDown":
155
+ const next = target.nextElementSibling;
156
+ if (next && next.matches("calcite-tree-item")) {
157
+ next.focus();
158
+ event.preventDefault();
159
+ }
160
+ break;
161
+ case "ArrowLeft":
162
+ // When focus is on an open node, closes the node.
163
+ if (target.hasChildren && target.expanded) {
164
+ target.expanded = false;
165
+ event.preventDefault();
166
+ break;
167
+ }
168
+ // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
169
+ const parentItem = target.parentElement.closest("calcite-tree-item");
170
+ if (parentItem && (!target.hasChildren || target.expanded === false)) {
171
+ parentItem.focus();
172
+ event.preventDefault();
173
+ break;
174
+ }
175
+ // When focus is on a root node that is also either an end node or a closed node, does nothing.
176
+ break;
177
+ case "ArrowRight":
178
+ if (!target.hasChildren) {
179
+ break;
180
+ }
181
+ if (target.expanded && document.activeElement === target) {
182
+ // When focus is on an open node, moves focus to the first child node.
183
+ (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
184
+ event.preventDefault();
185
+ }
186
+ else {
187
+ // When focus is on a closed node, opens the node; focus does not move.
188
+ target.expanded = true;
189
+ event.preventDefault();
190
+ }
191
+ // When focus is on an end node, does nothing.
192
+ break;
193
+ case "ArrowUp":
194
+ const previous = target.previousElementSibling;
195
+ if (previous && previous.matches("calcite-tree-item")) {
196
+ previous.focus();
197
+ event.preventDefault();
198
+ }
199
+ break;
200
+ }
201
+ }
202
+ }
148
203
  updateAncestorTree(e) {
149
204
  const item = e.target;
150
205
  const children = item.querySelectorAll("calcite-tree-item");
@@ -358,5 +413,11 @@ export class Tree {
358
413
  "target": undefined,
359
414
  "capture": false,
360
415
  "passive": false
416
+ }, {
417
+ "name": "keydown",
418
+ "method": "keyDownHandler",
419
+ "target": undefined,
420
+ "capture": false,
421
+ "passive": false
361
422
  }]; }
362
423
  }
@@ -32,12 +32,6 @@ export class TreeItem {
32
32
  this.iconClickHandler = (event) => {
33
33
  event.stopPropagation();
34
34
  this.expanded = !this.expanded;
35
- if (this.selectionMode !== TreeSelectionMode.Ancestors) {
36
- this.calciteTreeItemSelect.emit({
37
- modifyCurrentSelection: this.isSelectionMultiLike,
38
- forceToggle: true
39
- });
40
- }
41
35
  };
42
36
  this.childrenClickHandler = (event) => event.stopPropagation();
43
37
  //--------------------------------------------------------------------------
@@ -172,7 +166,6 @@ export class TreeItem {
172
166
  });
173
167
  }
174
168
  keyDownHandler(e) {
175
- var _a;
176
169
  let root;
177
170
  switch (e.key) {
178
171
  case " ":
@@ -181,7 +174,6 @@ export class TreeItem {
181
174
  forceToggle: false
182
175
  });
183
176
  e.preventDefault();
184
- e.stopPropagation();
185
177
  break;
186
178
  case "Enter":
187
179
  // activates a node, i.e., performs its default action. For parent nodes, one possible default action is to open or close the node. In single-select trees where selection does not follow focus (see note below), the default action is typically to select the focused node.
@@ -197,53 +189,6 @@ export class TreeItem {
197
189
  });
198
190
  }
199
191
  e.preventDefault();
200
- e.stopPropagation();
201
- break;
202
- case "ArrowLeft":
203
- // When focus is on an open node, closes the node.
204
- if (this.hasChildren && this.expanded) {
205
- this.expanded = false;
206
- e.preventDefault();
207
- e.stopPropagation();
208
- break;
209
- }
210
- // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
211
- const parentItem = this.parentTreeItem;
212
- if (parentItem && (!this.hasChildren || this.expanded === false)) {
213
- parentItem.focus();
214
- e.preventDefault();
215
- e.stopPropagation();
216
- break;
217
- }
218
- // When focus is on a root node that is also either an end node or a closed node, does nothing.
219
- break;
220
- case "ArrowRight":
221
- // When focus is on a closed node, opens the node; focus does not move.
222
- if (this.hasChildren && this.expanded === false) {
223
- this.expanded = true;
224
- e.preventDefault();
225
- e.stopPropagation();
226
- break;
227
- }
228
- // When focus is on a open node, moves focus to the first child node.
229
- if (this.hasChildren && this.expanded) {
230
- (_a = this.el.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
231
- e.stopPropagation();
232
- break;
233
- }
234
- // When focus is on an end node, does nothing.
235
- break;
236
- case "ArrowUp":
237
- const previous = this.el.previousElementSibling;
238
- if (previous && previous.matches("calcite-tree-item")) {
239
- previous.focus();
240
- }
241
- break;
242
- case "ArrowDown":
243
- const next = this.el.nextElementSibling;
244
- if (next && next.matches("calcite-tree-item")) {
245
- next.focus();
246
- }
247
192
  break;
248
193
  case "Home":
249
194
  root = this.el.closest("calcite-tree:not([child])");
@@ -53,12 +53,6 @@ let TreeItem = class extends HTMLElement {
53
53
  this.iconClickHandler = (event) => {
54
54
  event.stopPropagation();
55
55
  this.expanded = !this.expanded;
56
- if (this.selectionMode !== TreeSelectionMode.Ancestors) {
57
- this.calciteTreeItemSelect.emit({
58
- modifyCurrentSelection: this.isSelectionMultiLike,
59
- forceToggle: true
60
- });
61
- }
62
56
  };
63
57
  this.childrenClickHandler = (event) => event.stopPropagation();
64
58
  //--------------------------------------------------------------------------
@@ -185,7 +179,6 @@ let TreeItem = class extends HTMLElement {
185
179
  });
186
180
  }
187
181
  keyDownHandler(e) {
188
- var _a;
189
182
  let root;
190
183
  switch (e.key) {
191
184
  case " ":
@@ -194,7 +187,6 @@ let TreeItem = class extends HTMLElement {
194
187
  forceToggle: false
195
188
  });
196
189
  e.preventDefault();
197
- e.stopPropagation();
198
190
  break;
199
191
  case "Enter":
200
192
  // activates a node, i.e., performs its default action. For parent nodes, one possible default action is to open or close the node. In single-select trees where selection does not follow focus (see note below), the default action is typically to select the focused node.
@@ -210,53 +202,6 @@ let TreeItem = class extends HTMLElement {
210
202
  });
211
203
  }
212
204
  e.preventDefault();
213
- e.stopPropagation();
214
- break;
215
- case "ArrowLeft":
216
- // When focus is on an open node, closes the node.
217
- if (this.hasChildren && this.expanded) {
218
- this.expanded = false;
219
- e.preventDefault();
220
- e.stopPropagation();
221
- break;
222
- }
223
- // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
224
- const parentItem = this.parentTreeItem;
225
- if (parentItem && (!this.hasChildren || this.expanded === false)) {
226
- parentItem.focus();
227
- e.preventDefault();
228
- e.stopPropagation();
229
- break;
230
- }
231
- // When focus is on a root node that is also either an end node or a closed node, does nothing.
232
- break;
233
- case "ArrowRight":
234
- // When focus is on a closed node, opens the node; focus does not move.
235
- if (this.hasChildren && this.expanded === false) {
236
- this.expanded = true;
237
- e.preventDefault();
238
- e.stopPropagation();
239
- break;
240
- }
241
- // When focus is on a open node, moves focus to the first child node.
242
- if (this.hasChildren && this.expanded) {
243
- (_a = this.el.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
244
- e.stopPropagation();
245
- break;
246
- }
247
- // When focus is on an end node, does nothing.
248
- break;
249
- case "ArrowUp":
250
- const previous = this.el.previousElementSibling;
251
- if (previous && previous.matches("calcite-tree-item")) {
252
- previous.focus();
253
- }
254
- break;
255
- case "ArrowDown":
256
- const next = this.el.nextElementSibling;
257
- if (next && next.matches("calcite-tree-item")) {
258
- next.focus();
259
- }
260
205
  break;
261
206
  case "Home":
262
207
  root = this.el.closest("calcite-tree:not([child])");
@@ -148,6 +148,61 @@ let Tree = class extends HTMLElement {
148
148
  selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
149
149
  });
150
150
  }
151
+ keyDownHandler(event) {
152
+ var _a;
153
+ const root = this.el.closest("calcite-tree:not([child])");
154
+ const target = event.target;
155
+ if (root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target)) {
156
+ switch (event.key) {
157
+ case "ArrowDown":
158
+ const next = target.nextElementSibling;
159
+ if (next && next.matches("calcite-tree-item")) {
160
+ next.focus();
161
+ event.preventDefault();
162
+ }
163
+ break;
164
+ case "ArrowLeft":
165
+ // When focus is on an open node, closes the node.
166
+ if (target.hasChildren && target.expanded) {
167
+ target.expanded = false;
168
+ event.preventDefault();
169
+ break;
170
+ }
171
+ // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
172
+ const parentItem = target.parentElement.closest("calcite-tree-item");
173
+ if (parentItem && (!target.hasChildren || target.expanded === false)) {
174
+ parentItem.focus();
175
+ event.preventDefault();
176
+ break;
177
+ }
178
+ // When focus is on a root node that is also either an end node or a closed node, does nothing.
179
+ break;
180
+ case "ArrowRight":
181
+ if (!target.hasChildren) {
182
+ break;
183
+ }
184
+ if (target.expanded && document.activeElement === target) {
185
+ // When focus is on an open node, moves focus to the first child node.
186
+ (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
187
+ event.preventDefault();
188
+ }
189
+ else {
190
+ // When focus is on a closed node, opens the node; focus does not move.
191
+ target.expanded = true;
192
+ event.preventDefault();
193
+ }
194
+ // When focus is on an end node, does nothing.
195
+ break;
196
+ case "ArrowUp":
197
+ const previous = target.previousElementSibling;
198
+ if (previous && previous.matches("calcite-tree-item")) {
199
+ previous.focus();
200
+ event.preventDefault();
201
+ }
202
+ break;
203
+ }
204
+ }
205
+ }
151
206
  updateAncestorTree(e) {
152
207
  const item = e.target;
153
208
  const children = item.querySelectorAll("calcite-tree-item");
@@ -200,7 +255,7 @@ Tree = /*@__PURE__*/ proxyCustomElement(Tree, [1, "calcite-tree", {
200
255
  "child": [1540],
201
256
  "scale": [1537],
202
257
  "selectionMode": [1537, "selection-mode"]
203
- }, [[0, "focus", "onFocus"], [0, "focusin", "onFocusIn"], [0, "focusout", "onFocusOut"], [0, "calciteTreeItemSelect", "onClick"]]]);
258
+ }, [[0, "focus", "onFocus"], [0, "focusin", "onFocusIn"], [0, "focusout", "onFocusOut"], [0, "calciteTreeItemSelect", "onClick"], [0, "keydown", "keyDownHandler"]]]);
204
259
  function defineCustomElement$1() {
205
260
  if (typeof customElements === "undefined") {
206
261
  return;
@@ -24921,6 +24921,61 @@ let Tree = class extends HTMLElement$1 {
24921
24921
  selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
24922
24922
  });
24923
24923
  }
24924
+ keyDownHandler(event) {
24925
+ var _a;
24926
+ const root = this.el.closest("calcite-tree:not([child])");
24927
+ const target = event.target;
24928
+ if (root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target)) {
24929
+ switch (event.key) {
24930
+ case "ArrowDown":
24931
+ const next = target.nextElementSibling;
24932
+ if (next && next.matches("calcite-tree-item")) {
24933
+ next.focus();
24934
+ event.preventDefault();
24935
+ }
24936
+ break;
24937
+ case "ArrowLeft":
24938
+ // When focus is on an open node, closes the node.
24939
+ if (target.hasChildren && target.expanded) {
24940
+ target.expanded = false;
24941
+ event.preventDefault();
24942
+ break;
24943
+ }
24944
+ // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
24945
+ const parentItem = target.parentElement.closest("calcite-tree-item");
24946
+ if (parentItem && (!target.hasChildren || target.expanded === false)) {
24947
+ parentItem.focus();
24948
+ event.preventDefault();
24949
+ break;
24950
+ }
24951
+ // When focus is on a root node that is also either an end node or a closed node, does nothing.
24952
+ break;
24953
+ case "ArrowRight":
24954
+ if (!target.hasChildren) {
24955
+ break;
24956
+ }
24957
+ if (target.expanded && document.activeElement === target) {
24958
+ // When focus is on an open node, moves focus to the first child node.
24959
+ (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
24960
+ event.preventDefault();
24961
+ }
24962
+ else {
24963
+ // When focus is on a closed node, opens the node; focus does not move.
24964
+ target.expanded = true;
24965
+ event.preventDefault();
24966
+ }
24967
+ // When focus is on an end node, does nothing.
24968
+ break;
24969
+ case "ArrowUp":
24970
+ const previous = target.previousElementSibling;
24971
+ if (previous && previous.matches("calcite-tree-item")) {
24972
+ previous.focus();
24973
+ event.preventDefault();
24974
+ }
24975
+ break;
24976
+ }
24977
+ }
24978
+ }
24924
24979
  updateAncestorTree(e) {
24925
24980
  const item = e.target;
24926
24981
  const children = item.querySelectorAll("calcite-tree-item");
@@ -25012,12 +25067,6 @@ let TreeItem = class extends HTMLElement$1 {
25012
25067
  this.iconClickHandler = (event) => {
25013
25068
  event.stopPropagation();
25014
25069
  this.expanded = !this.expanded;
25015
- if (this.selectionMode !== TreeSelectionMode.Ancestors) {
25016
- this.calciteTreeItemSelect.emit({
25017
- modifyCurrentSelection: this.isSelectionMultiLike,
25018
- forceToggle: true
25019
- });
25020
- }
25021
25070
  };
25022
25071
  this.childrenClickHandler = (event) => event.stopPropagation();
25023
25072
  //--------------------------------------------------------------------------
@@ -25144,7 +25193,6 @@ let TreeItem = class extends HTMLElement$1 {
25144
25193
  });
25145
25194
  }
25146
25195
  keyDownHandler(e) {
25147
- var _a;
25148
25196
  let root;
25149
25197
  switch (e.key) {
25150
25198
  case " ":
@@ -25153,7 +25201,6 @@ let TreeItem = class extends HTMLElement$1 {
25153
25201
  forceToggle: false
25154
25202
  });
25155
25203
  e.preventDefault();
25156
- e.stopPropagation();
25157
25204
  break;
25158
25205
  case "Enter":
25159
25206
  // activates a node, i.e., performs its default action. For parent nodes, one possible default action is to open or close the node. In single-select trees where selection does not follow focus (see note below), the default action is typically to select the focused node.
@@ -25169,53 +25216,6 @@ let TreeItem = class extends HTMLElement$1 {
25169
25216
  });
25170
25217
  }
25171
25218
  e.preventDefault();
25172
- e.stopPropagation();
25173
- break;
25174
- case "ArrowLeft":
25175
- // When focus is on an open node, closes the node.
25176
- if (this.hasChildren && this.expanded) {
25177
- this.expanded = false;
25178
- e.preventDefault();
25179
- e.stopPropagation();
25180
- break;
25181
- }
25182
- // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
25183
- const parentItem = this.parentTreeItem;
25184
- if (parentItem && (!this.hasChildren || this.expanded === false)) {
25185
- parentItem.focus();
25186
- e.preventDefault();
25187
- e.stopPropagation();
25188
- break;
25189
- }
25190
- // When focus is on a root node that is also either an end node or a closed node, does nothing.
25191
- break;
25192
- case "ArrowRight":
25193
- // When focus is on a closed node, opens the node; focus does not move.
25194
- if (this.hasChildren && this.expanded === false) {
25195
- this.expanded = true;
25196
- e.preventDefault();
25197
- e.stopPropagation();
25198
- break;
25199
- }
25200
- // When focus is on a open node, moves focus to the first child node.
25201
- if (this.hasChildren && this.expanded) {
25202
- (_a = this.el.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
25203
- e.stopPropagation();
25204
- break;
25205
- }
25206
- // When focus is on an end node, does nothing.
25207
- break;
25208
- case "ArrowUp":
25209
- const previous = this.el.previousElementSibling;
25210
- if (previous && previous.matches("calcite-tree-item")) {
25211
- previous.focus();
25212
- }
25213
- break;
25214
- case "ArrowDown":
25215
- const next = this.el.nextElementSibling;
25216
- if (next && next.matches("calcite-tree-item")) {
25217
- next.focus();
25218
- }
25219
25219
  break;
25220
25220
  case "Home":
25221
25221
  root = this.el.closest("calcite-tree:not([child])");
@@ -25659,7 +25659,7 @@ const CalciteTipGroup = /*@__PURE__*/proxyCustomElement(TipGroup, [1,"calcite-ti
25659
25659
  const CalciteTipManager = /*@__PURE__*/proxyCustomElement(TipManager, [1,"calcite-tip-manager",{"closed":[1540],"headingLevel":[2,"heading-level"],"intlClose":[1,"intl-close"],"intlDefaultTitle":[1,"intl-default-title"],"intlNext":[1,"intl-next"],"intlPaginationLabel":[1,"intl-pagination-label"],"intlPrevious":[1,"intl-previous"],"selectedIndex":[32],"tips":[32],"total":[32],"direction":[32],"groupTitle":[32]}]);
25660
25660
  const CalciteTooltip = /*@__PURE__*/proxyCustomElement(Tooltip, [1,"calcite-tooltip",{"label":[1],"offsetDistance":[514,"offset-distance"],"offsetSkidding":[514,"offset-skidding"],"open":[516],"overlayPositioning":[1,"overlay-positioning"],"placement":[513],"referenceElement":[1,"reference-element"],"effectiveReferenceElement":[32]}]);
25661
25661
  const CalciteTooltipManager = /*@__PURE__*/proxyCustomElement(TooltipManager, [1,"calcite-tooltip-manager",{"selector":[1]},[[4,"keyup","keyUpHandler"],[3,"mouseover","mouseEnterShow"],[3,"mouseout","mouseLeaveHide"],[2,"click","clickHandler"],[2,"focus","focusShow"],[2,"blur","blurHide"]]]);
25662
- const CalciteTree = /*@__PURE__*/proxyCustomElement(Tree, [1,"calcite-tree",{"lines":[1540],"inputEnabled":[4,"input-enabled"],"child":[1540],"scale":[1537],"selectionMode":[1537,"selection-mode"]},[[0,"focus","onFocus"],[0,"focusin","onFocusIn"],[0,"focusout","onFocusOut"],[0,"calciteTreeItemSelect","onClick"]]]);
25662
+ const CalciteTree = /*@__PURE__*/proxyCustomElement(Tree, [1,"calcite-tree",{"lines":[1540],"inputEnabled":[4,"input-enabled"],"child":[1540],"scale":[1537],"selectionMode":[1537,"selection-mode"]},[[0,"focus","onFocus"],[0,"focusin","onFocusIn"],[0,"focusout","onFocusOut"],[0,"calciteTreeItemSelect","onClick"],[0,"keydown","keyDownHandler"]]]);
25663
25663
  const CalciteTreeItem = /*@__PURE__*/proxyCustomElement(TreeItem, [1,"calcite-tree-item",{"selected":[1540],"expanded":[1540],"parentExpanded":[4,"parent-expanded"],"depth":[1538],"hasChildren":[1540,"has-children"],"lines":[1540],"inputEnabled":[4,"input-enabled"],"scale":[1537],"indeterminate":[516],"selectionMode":[1025,"selection-mode"]},[[0,"click","onClick"],[0,"keydown","keyDownHandler"]]]);
25664
25664
  const CalciteValueList = /*@__PURE__*/proxyCustomElement(ValueList, [1,"calcite-value-list",{"disabled":[516],"dragEnabled":[516,"drag-enabled"],"filterEnabled":[516,"filter-enabled"],"filterPlaceholder":[513,"filter-placeholder"],"group":[1],"loading":[516],"multiple":[516],"selectionFollowsFocus":[4,"selection-follows-focus"],"selectedValues":[32],"dataForFilter":[32]},[[0,"calciteListItemRemove","calciteListItemRemoveHandler"],[0,"calciteListItemChange","calciteListItemChangeHandler"],[0,"calciteListItemPropsChange","calciteListItemPropsChangeHandler"],[0,"calciteListItemValueChange","calciteListItemValueChangeHandler"]]]);
25665
25665
  const CalciteValueListItem = /*@__PURE__*/proxyCustomElement(ValueListItem, [1,"calcite-value-list-item",{"description":[513],"disabled":[516],"disableDeselect":[4,"disable-deselect"],"nonInteractive":[516,"non-interactive"],"handleActivated":[1028,"handle-activated"],"icon":[513],"label":[513],"metadata":[16],"removable":[516],"selected":[1540],"value":[8]},[[0,"calciteListItemChange","calciteListItemChangeHandler"]]]);
@@ -157,6 +157,61 @@ let Tree = class {
157
157
  selected: nodeListToArray(this.el.querySelectorAll("calcite-tree-item")).filter((i) => i.selected)
158
158
  });
159
159
  }
160
+ keyDownHandler(event) {
161
+ var _a;
162
+ const root = this.el.closest("calcite-tree:not([child])");
163
+ const target = event.target;
164
+ if (root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target)) {
165
+ switch (event.key) {
166
+ case "ArrowDown":
167
+ const next = target.nextElementSibling;
168
+ if (next && next.matches("calcite-tree-item")) {
169
+ next.focus();
170
+ event.preventDefault();
171
+ }
172
+ break;
173
+ case "ArrowLeft":
174
+ // When focus is on an open node, closes the node.
175
+ if (target.hasChildren && target.expanded) {
176
+ target.expanded = false;
177
+ event.preventDefault();
178
+ break;
179
+ }
180
+ // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
181
+ const parentItem = target.parentElement.closest("calcite-tree-item");
182
+ if (parentItem && (!target.hasChildren || target.expanded === false)) {
183
+ parentItem.focus();
184
+ event.preventDefault();
185
+ break;
186
+ }
187
+ // When focus is on a root node that is also either an end node or a closed node, does nothing.
188
+ break;
189
+ case "ArrowRight":
190
+ if (!target.hasChildren) {
191
+ break;
192
+ }
193
+ if (target.expanded && document.activeElement === target) {
194
+ // When focus is on an open node, moves focus to the first child node.
195
+ (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
196
+ event.preventDefault();
197
+ }
198
+ else {
199
+ // When focus is on a closed node, opens the node; focus does not move.
200
+ target.expanded = true;
201
+ event.preventDefault();
202
+ }
203
+ // When focus is on an end node, does nothing.
204
+ break;
205
+ case "ArrowUp":
206
+ const previous = target.previousElementSibling;
207
+ if (previous && previous.matches("calcite-tree-item")) {
208
+ previous.focus();
209
+ event.preventDefault();
210
+ }
211
+ break;
212
+ }
213
+ }
214
+ }
160
215
  updateAncestorTree(e) {
161
216
  const item = e.target;
162
217
  const children = item.querySelectorAll("calcite-tree-item");
@@ -246,12 +301,6 @@ let TreeItem = class {
246
301
  this.iconClickHandler = (event) => {
247
302
  event.stopPropagation();
248
303
  this.expanded = !this.expanded;
249
- if (this.selectionMode !== TreeSelectionMode.Ancestors) {
250
- this.calciteTreeItemSelect.emit({
251
- modifyCurrentSelection: this.isSelectionMultiLike,
252
- forceToggle: true
253
- });
254
- }
255
304
  };
256
305
  this.childrenClickHandler = (event) => event.stopPropagation();
257
306
  //--------------------------------------------------------------------------
@@ -378,7 +427,6 @@ let TreeItem = class {
378
427
  });
379
428
  }
380
429
  keyDownHandler(e) {
381
- var _a;
382
430
  let root;
383
431
  switch (e.key) {
384
432
  case " ":
@@ -387,7 +435,6 @@ let TreeItem = class {
387
435
  forceToggle: false
388
436
  });
389
437
  e.preventDefault();
390
- e.stopPropagation();
391
438
  break;
392
439
  case "Enter":
393
440
  // activates a node, i.e., performs its default action. For parent nodes, one possible default action is to open or close the node. In single-select trees where selection does not follow focus (see note below), the default action is typically to select the focused node.
@@ -403,53 +450,6 @@ let TreeItem = class {
403
450
  });
404
451
  }
405
452
  e.preventDefault();
406
- e.stopPropagation();
407
- break;
408
- case "ArrowLeft":
409
- // When focus is on an open node, closes the node.
410
- if (this.hasChildren && this.expanded) {
411
- this.expanded = false;
412
- e.preventDefault();
413
- e.stopPropagation();
414
- break;
415
- }
416
- // When focus is on a child node that is also either an end node or a closed node, moves focus to its parent node.
417
- const parentItem = this.parentTreeItem;
418
- if (parentItem && (!this.hasChildren || this.expanded === false)) {
419
- parentItem.focus();
420
- e.preventDefault();
421
- e.stopPropagation();
422
- break;
423
- }
424
- // When focus is on a root node that is also either an end node or a closed node, does nothing.
425
- break;
426
- case "ArrowRight":
427
- // When focus is on a closed node, opens the node; focus does not move.
428
- if (this.hasChildren && this.expanded === false) {
429
- this.expanded = true;
430
- e.preventDefault();
431
- e.stopPropagation();
432
- break;
433
- }
434
- // When focus is on a open node, moves focus to the first child node.
435
- if (this.hasChildren && this.expanded) {
436
- (_a = this.el.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
437
- e.stopPropagation();
438
- break;
439
- }
440
- // When focus is on an end node, does nothing.
441
- break;
442
- case "ArrowUp":
443
- const previous = this.el.previousElementSibling;
444
- if (previous && previous.matches("calcite-tree-item")) {
445
- previous.focus();
446
- }
447
- break;
448
- case "ArrowDown":
449
- const next = this.el.nextElementSibling;
450
- if (next && next.matches("calcite-tree-item")) {
451
- next.focus();
452
- }
453
453
  break;
454
454
  case "Home":
455
455
  root = this.el.closest("calcite-tree:not([child])");