reneco-hierarchized-picker 0.4.3-beta.21 → 0.4.3-beta.23

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 (11) hide show
  1. package/dist/cjs/reneco-hierarchized-picker_2.cjs.entry.js +10 -14
  2. package/dist/collection/components/hierarchized-picker/hierarchized-picker.js +5 -8
  3. package/dist/collection/features/keyboard-navigation/keyboard-navigation.js +6 -4
  4. package/dist/custom-elements/index.js +10 -14
  5. package/dist/esm/reneco-hierarchized-picker_2.entry.js +10 -14
  6. package/dist/esm-es5/reneco-hierarchized-picker_2.entry.js +1 -1
  7. package/dist/reneco-hierarchized-picker/{p-486e928d.system.entry.js → p-2af3a4ba.system.entry.js} +1 -1
  8. package/dist/reneco-hierarchized-picker/{p-9bf0e475.entry.js → p-2e0123d1.entry.js} +1 -1
  9. package/dist/reneco-hierarchized-picker/p-73168a50.system.js +1 -1
  10. package/dist/reneco-hierarchized-picker/reneco-hierarchized-picker.esm.js +1 -1
  11. package/package.json +1 -1
package/dist/cjs/reneco-hierarchized-picker_2.cjs.entry.js CHANGED
@@ -18622,7 +18622,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18622
18622
  if (component && component.loadedTreeJs && component.loadedTreeJs.liElementsById && component.loadedTreeJs.treeNodes) {
18623
18623
  focusNode(component.loadedTreeJs.liElementsById, component.loadedTreeJs.liElementsById[component.loadedTreeJs.treeNodes[focusedNodeIndex].id]);
18624
18624
  }
18625
- component.el._hasKeydownListener = true;
18626
18625
  if (!component._keydownListenerAdded) {
18627
18626
  component._keydownListenerAdded = true;
18628
18627
  component.el.addEventListener('keydown', (event) => {
@@ -18642,8 +18641,12 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18642
18641
  event.preventDefault();
18643
18642
  { //(spaceNode?.nodeId) {
18644
18643
  component.setNodeAsSelected(spaceNode.nodeId, component.loadedTreeJs, true);
18645
- component.showTree('hide');
18646
- setTimeout(() => focusMainInput(), 100);
18644
+ if (optionsManager.getOptions().mode != "tree" && !optionsManager.getOptions().multiple) {
18645
+ setTimeout(() => {
18646
+ component.showTree('hide');
18647
+ // TODO put back? >> focusMainInput(component);
18648
+ }, 100);
18649
+ }
18647
18650
  }
18648
18651
  break;
18649
18652
  case 'arrowup':
@@ -18683,10 +18686,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18683
18686
  }
18684
18687
  }
18685
18688
 
18686
- // Utility functions
18687
- function isInsidePicker(component, target) {
18688
- return target !== null && component.el.contains(target);
18689
- }
18690
18689
  // Focus management
18691
18690
  async function focusSearchInput(component) {
18692
18691
  const searchInput = component.el.querySelector('search-input input');
@@ -18912,13 +18911,11 @@ const HierarchizedPickerComponent = class {
18912
18911
  if (oldValue && JSON.stringify(newValue.options) != JSON.stringify(oldValue.options)) {
18913
18912
  this.value = [];
18914
18913
  }
18915
- console.log("Setnewoptions 01", newValue, oldValue);
18916
18914
  if ((newValue === null || newValue === void 0 ? void 0 : newValue.loading) == 'display' || (newValue && !newValue.loading)) {
18917
18915
  if ((oldValue && this.isChangeInOptions(newValue, oldValue)) || !oldValue) {
18918
18916
  if (!oldValue) {
18919
18917
  oldValue = savedOldValue;
18920
18918
  }
18921
- console.log("Setnewoptions 02");
18922
18919
  const propDiffs = this.diffKeys(oldValue, this.optionsManager.initializeOptions(newValue));
18923
18920
  const noReloadProps = ["multiple"];
18924
18921
  const ignoredProps = ["token"];
@@ -19245,8 +19242,9 @@ const HierarchizedPickerComponent = class {
19245
19242
  console.timeEnd = function () { };
19246
19243
  }
19247
19244
  // Setup component unique ID
19248
- if (this.optionsManager.getOptions().id)
19245
+ if (this.optionsManager.getOptions().id) {
19249
19246
  this.componentID = this.optionsManager.getOptions().id;
19247
+ }
19250
19248
  else if (!this.componentID) {
19251
19249
  let componentID = (Array.from(document.querySelectorAll('reneco-hierarchized-picker')).indexOf(this.el) + 1);
19252
19250
  while (document.querySelectorAll(`#hierarchized-picker-${componentID}`).length > 0) {
@@ -19589,7 +19587,6 @@ const HierarchizedPickerComponent = class {
19589
19587
  this.itemContextMenuItemClick.emit(e);
19590
19588
  }
19591
19589
  setNodeAsSelected(id, treeToUpdate, userClick) {
19592
- console.log("setNodeAsSelected", id);
19593
19590
  // TODO Temporarily ignores disabled mode for selecting nodes if mode is tree
19594
19591
  if (((this.isDisabled && this.optionsManager.getOptions().mode != "tree") && this.shownTree && this.setValueOnClick) ||
19595
19592
  (this.loadedTreeJs.liElementsById[id] && this.loadedTreeJs.liElementsById[id].classList.value && this.loadedTreeJs.liElementsById[id].classList.value.indexOf('readonly_node') != -1)) {
@@ -19666,7 +19663,7 @@ const HierarchizedPickerComponent = class {
19666
19663
  clearAutocomplete();
19667
19664
  if (!this.canload || !this.optionsManager.getOptions().displayTree)
19668
19665
  return;
19669
- const isStillInsidePicker = isInsidePicker(this, document.activeElement);
19666
+ const isStillInsidePicker = false; // TODO put back? >> isInsidePicker(this, document.activeElement);
19670
19667
  if ((focused === 'hide' || this.isDisabled) && !isStillInsidePicker) {
19671
19668
  this.hasFocus = ['hide'];
19672
19669
  const elem = document.querySelector('#hierarchized-picker-' + this.componentID + ' input.hierarchized-picker-search');
@@ -19849,7 +19846,6 @@ const HierarchizedPickerComponent = class {
19849
19846
  this.translateDataForTree(this.rawDataManager.getData());
19850
19847
  }
19851
19848
  checkFields(values, allowSetValueOnClick = true) {
19852
- console.log("checkFields", values);
19853
19849
  if (!this.loadedTreeJs)
19854
19850
  return;
19855
19851
  this.setValueOnClick = allowSetValueOnClick;
@@ -19979,7 +19975,7 @@ const HierarchizedPickerComponent = class {
19979
19975
  clickPickerModalArea(this);
19980
19976
  } }, index.h("div", { class: "loader", ref: el => {
19981
19977
  this.loader = el;
19982
- } }, index.h("div", { class: "loader-inner" }, "Loading...")), index.h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "" + this.componentID }, index.h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), index.h("ul", { id: "autocomplete-results-area" }), index.h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (index.h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "" + this.componentID, onClick: event => {
19978
+ } }, index.h("div", { class: "loader-inner" }, "Loading...")), index.h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "0" }, index.h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), index.h("ul", { id: "autocomplete-results-area" }), index.h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (index.h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "0", onClick: event => {
19983
19979
  clickPickerModalArea(this);
19984
19980
  } }, index.h("div", { class: "loader", ref: el => {
19985
19981
  this.loader = el;
package/dist/collection/components/hierarchized-picker/hierarchized-picker.js CHANGED
@@ -9,7 +9,7 @@ import { RawDataManager } from '../../core/raw-data-manager';
9
9
  import { OptionsManager } from '../../core/options-manager';
10
10
  import { fillTreeWithObject, completeCurrentTreeWithTree, getPropertyFromNode } from '../../features/tree/tree-utils';
11
11
  import { displayAutocompleteWithResults, clearAutocomplete } from '../../features/autocomplete/autocomplete';
12
- import { focusSearchInput, focusMainInput, focusInSearchEvent, focusOutSearchEvent, clickPickerModalArea, isInsidePicker } from '../../features/events/focus-handlers';
12
+ import { focusSearchInput, focusMainInput, focusInSearchEvent, focusOutSearchEvent, clickPickerModalArea } from '../../features/events/focus-handlers';
13
13
  import { setupKeyboardNavigation } from '../../features/keyboard-navigation/keyboard-navigation';
14
14
  export class HierarchizedPickerComponent {
15
15
  /**
@@ -183,13 +183,11 @@ export class HierarchizedPickerComponent {
183
183
  if (oldValue && JSON.stringify(newValue.options) != JSON.stringify(oldValue.options)) {
184
184
  this.value = [];
185
185
  }
186
- console.log("Setnewoptions 01", newValue, oldValue);
187
186
  if ((newValue === null || newValue === void 0 ? void 0 : newValue.loading) == 'display' || (newValue && !newValue.loading)) {
188
187
  if ((oldValue && this.isChangeInOptions(newValue, oldValue)) || !oldValue) {
189
188
  if (!oldValue) {
190
189
  oldValue = savedOldValue;
191
190
  }
192
- console.log("Setnewoptions 02");
193
191
  const propDiffs = this.diffKeys(oldValue, this.optionsManager.initializeOptions(newValue));
194
192
  const noReloadProps = ["multiple"];
195
193
  const ignoredProps = ["token"];
@@ -512,8 +510,9 @@ export class HierarchizedPickerComponent {
512
510
  this.mylog('----- HIERARCHIZED-PICKER DEBUG MODE ON -----');
513
511
  }
514
512
  // Setup component unique ID
515
- if (this.optionsManager.getOptions().id)
513
+ if (this.optionsManager.getOptions().id) {
516
514
  this.componentID = this.optionsManager.getOptions().id;
515
+ }
517
516
  else if (!this.componentID) {
518
517
  let componentID = (Array.from(document.querySelectorAll('reneco-hierarchized-picker')).indexOf(this.el) + 1);
519
518
  while (document.querySelectorAll(`#hierarchized-picker-${componentID}`).length > 0) {
@@ -856,7 +855,6 @@ export class HierarchizedPickerComponent {
856
855
  this.itemContextMenuItemClick.emit(e);
857
856
  }
858
857
  setNodeAsSelected(id, treeToUpdate, userClick) {
859
- console.log("setNodeAsSelected", id);
860
858
  // TODO Temporarily ignores disabled mode for selecting nodes if mode is tree
861
859
  if (((this.isDisabled && this.optionsManager.getOptions().mode != "tree") && this.shownTree && this.setValueOnClick) ||
862
860
  (this.loadedTreeJs.liElementsById[id] && this.loadedTreeJs.liElementsById[id].classList.value && this.loadedTreeJs.liElementsById[id].classList.value.indexOf('readonly_node') != -1)) {
@@ -933,7 +931,7 @@ export class HierarchizedPickerComponent {
933
931
  clearAutocomplete();
934
932
  if (!this.canload || !this.optionsManager.getOptions().displayTree)
935
933
  return;
936
- const isStillInsidePicker = isInsidePicker(this, document.activeElement);
934
+ const isStillInsidePicker = false; // TODO put back? >> isInsidePicker(this, document.activeElement);
937
935
  if ((focused === 'hide' || this.isDisabled) && !isStillInsidePicker) {
938
936
  this.hasFocus = ['hide'];
939
937
  const elem = document.querySelector('#hierarchized-picker-' + this.componentID + ' input.hierarchized-picker-search');
@@ -1116,7 +1114,6 @@ export class HierarchizedPickerComponent {
1116
1114
  this.translateDataForTree(this.rawDataManager.getData());
1117
1115
  }
1118
1116
  checkFields(values, allowSetValueOnClick = true) {
1119
- console.log("checkFields", values);
1120
1117
  if (!this.loadedTreeJs)
1121
1118
  return;
1122
1119
  this.setValueOnClick = allowSetValueOnClick;
@@ -1246,7 +1243,7 @@ export class HierarchizedPickerComponent {
1246
1243
  clickPickerModalArea(this, event);
1247
1244
  } }, h("div", { class: "loader", ref: el => {
1248
1245
  this.loader = el;
1249
- } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "" + this.componentID }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "" + this.componentID, onClick: event => {
1246
+ } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "0" }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "0", onClick: event => {
1250
1247
  clickPickerModalArea(this, event);
1251
1248
  } }, h("div", { class: "loader", ref: el => {
1252
1249
  this.loader = el;
package/dist/collection/features/keyboard-navigation/keyboard-navigation.js CHANGED
@@ -1,4 +1,3 @@
1
- import { focusMainInput } from "../events/focus-handlers";
2
1
  let focusedNodeIndex = 0;
3
2
  export function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
4
3
  if (!optionsManager.getOptions().keyboardNavigation)
@@ -29,7 +28,6 @@ export function setupKeyboardNavigation(component, optionsManager, navigateInTre
29
28
  if (component && component.loadedTreeJs && component.loadedTreeJs.liElementsById && component.loadedTreeJs.treeNodes) {
30
29
  focusNode(component.loadedTreeJs.liElementsById, component.loadedTreeJs.liElementsById[component.loadedTreeJs.treeNodes[focusedNodeIndex].id]);
31
30
  }
32
- component.el._hasKeydownListener = true;
33
31
  if (!component._keydownListenerAdded) {
34
32
  component._keydownListenerAdded = true;
35
33
  component.el.addEventListener('keydown', (event) => {
@@ -49,8 +47,12 @@ export function setupKeyboardNavigation(component, optionsManager, navigateInTre
49
47
  event.preventDefault();
50
48
  if (true) { //(spaceNode?.nodeId) {
51
49
  component.setNodeAsSelected(spaceNode.nodeId, component.loadedTreeJs, true);
52
- component.showTree('hide');
53
- setTimeout(() => focusMainInput(component), 100);
50
+ if (optionsManager.getOptions().mode != "tree" && !optionsManager.getOptions().multiple) {
51
+ setTimeout(() => {
52
+ component.showTree('hide');
53
+ // TODO put back? >> focusMainInput(component);
54
+ }, 100);
55
+ }
54
56
  }
55
57
  break;
56
58
  case 'arrowup':
package/dist/custom-elements/index.js CHANGED
@@ -18619,7 +18619,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18619
18619
  if (component && component.loadedTreeJs && component.loadedTreeJs.liElementsById && component.loadedTreeJs.treeNodes) {
18620
18620
  focusNode(component.loadedTreeJs.liElementsById, component.loadedTreeJs.liElementsById[component.loadedTreeJs.treeNodes[focusedNodeIndex].id]);
18621
18621
  }
18622
- component.el._hasKeydownListener = true;
18623
18622
  if (!component._keydownListenerAdded) {
18624
18623
  component._keydownListenerAdded = true;
18625
18624
  component.el.addEventListener('keydown', (event) => {
@@ -18639,8 +18638,12 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18639
18638
  event.preventDefault();
18640
18639
  { //(spaceNode?.nodeId) {
18641
18640
  component.setNodeAsSelected(spaceNode.nodeId, component.loadedTreeJs, true);
18642
- component.showTree('hide');
18643
- setTimeout(() => focusMainInput(), 100);
18641
+ if (optionsManager.getOptions().mode != "tree" && !optionsManager.getOptions().multiple) {
18642
+ setTimeout(() => {
18643
+ component.showTree('hide');
18644
+ // TODO put back? >> focusMainInput(component);
18645
+ }, 100);
18646
+ }
18644
18647
  }
18645
18648
  break;
18646
18649
  case 'arrowup':
@@ -18680,10 +18683,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18680
18683
  }
18681
18684
  }
18682
18685
 
18683
- // Utility functions
18684
- function isInsidePicker(component, target) {
18685
- return target !== null && component.el.contains(target);
18686
- }
18687
18686
  // Focus management
18688
18687
  async function focusSearchInput(component) {
18689
18688
  const searchInput = component.el.querySelector('search-input input');
@@ -18909,13 +18908,11 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18909
18908
  if (oldValue && JSON.stringify(newValue.options) != JSON.stringify(oldValue.options)) {
18910
18909
  this.value = [];
18911
18910
  }
18912
- console.log("Setnewoptions 01", newValue, oldValue);
18913
18911
  if ((newValue === null || newValue === void 0 ? void 0 : newValue.loading) == 'display' || (newValue && !newValue.loading)) {
18914
18912
  if ((oldValue && this.isChangeInOptions(newValue, oldValue)) || !oldValue) {
18915
18913
  if (!oldValue) {
18916
18914
  oldValue = savedOldValue;
18917
18915
  }
18918
- console.log("Setnewoptions 02");
18919
18916
  const propDiffs = this.diffKeys(oldValue, this.optionsManager.initializeOptions(newValue));
18920
18917
  const noReloadProps = ["multiple"];
18921
18918
  const ignoredProps = ["token"];
@@ -19243,8 +19240,9 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19243
19240
  console.timeEnd = function () { };
19244
19241
  }
19245
19242
  // Setup component unique ID
19246
- if (this.optionsManager.getOptions().id)
19243
+ if (this.optionsManager.getOptions().id) {
19247
19244
  this.componentID = this.optionsManager.getOptions().id;
19245
+ }
19248
19246
  else if (!this.componentID) {
19249
19247
  let componentID = (Array.from(document.querySelectorAll('reneco-hierarchized-picker')).indexOf(this.el) + 1);
19250
19248
  while (document.querySelectorAll(`#hierarchized-picker-${componentID}`).length > 0) {
@@ -19587,7 +19585,6 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19587
19585
  this.itemContextMenuItemClick.emit(e);
19588
19586
  }
19589
19587
  setNodeAsSelected(id, treeToUpdate, userClick) {
19590
- console.log("setNodeAsSelected", id);
19591
19588
  // TODO Temporarily ignores disabled mode for selecting nodes if mode is tree
19592
19589
  if (((this.isDisabled && this.optionsManager.getOptions().mode != "tree") && this.shownTree && this.setValueOnClick) ||
19593
19590
  (this.loadedTreeJs.liElementsById[id] && this.loadedTreeJs.liElementsById[id].classList.value && this.loadedTreeJs.liElementsById[id].classList.value.indexOf('readonly_node') != -1)) {
@@ -19664,7 +19661,7 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19664
19661
  clearAutocomplete();
19665
19662
  if (!this.canload || !this.optionsManager.getOptions().displayTree)
19666
19663
  return;
19667
- const isStillInsidePicker = isInsidePicker(this, document.activeElement);
19664
+ const isStillInsidePicker = false; // TODO put back? >> isInsidePicker(this, document.activeElement);
19668
19665
  if ((focused === 'hide' || this.isDisabled) && !isStillInsidePicker) {
19669
19666
  this.hasFocus = ['hide'];
19670
19667
  const elem = document.querySelector('#hierarchized-picker-' + this.componentID + ' input.hierarchized-picker-search');
@@ -19847,7 +19844,6 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19847
19844
  this.translateDataForTree(this.rawDataManager.getData());
19848
19845
  }
19849
19846
  checkFields(values, allowSetValueOnClick = true) {
19850
- console.log("checkFields", values);
19851
19847
  if (!this.loadedTreeJs)
19852
19848
  return;
19853
19849
  this.setValueOnClick = allowSetValueOnClick;
@@ -19977,7 +19973,7 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19977
19973
  clickPickerModalArea(this);
19978
19974
  } }, h("div", { class: "loader", ref: el => {
19979
19975
  this.loader = el;
19980
- } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "" + this.componentID }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "" + this.componentID, onClick: event => {
19976
+ } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "0" }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "0", onClick: event => {
19981
19977
  clickPickerModalArea(this);
19982
19978
  } }, h("div", { class: "loader", ref: el => {
19983
19979
  this.loader = el;
package/dist/esm/reneco-hierarchized-picker_2.entry.js CHANGED
@@ -18618,7 +18618,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18618
18618
  if (component && component.loadedTreeJs && component.loadedTreeJs.liElementsById && component.loadedTreeJs.treeNodes) {
18619
18619
  focusNode(component.loadedTreeJs.liElementsById, component.loadedTreeJs.liElementsById[component.loadedTreeJs.treeNodes[focusedNodeIndex].id]);
18620
18620
  }
18621
- component.el._hasKeydownListener = true;
18622
18621
  if (!component._keydownListenerAdded) {
18623
18622
  component._keydownListenerAdded = true;
18624
18623
  component.el.addEventListener('keydown', (event) => {
@@ -18638,8 +18637,12 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18638
18637
  event.preventDefault();
18639
18638
  { //(spaceNode?.nodeId) {
18640
18639
  component.setNodeAsSelected(spaceNode.nodeId, component.loadedTreeJs, true);
18641
- component.showTree('hide');
18642
- setTimeout(() => focusMainInput(), 100);
18640
+ if (optionsManager.getOptions().mode != "tree" && !optionsManager.getOptions().multiple) {
18641
+ setTimeout(() => {
18642
+ component.showTree('hide');
18643
+ // TODO put back? >> focusMainInput(component);
18644
+ }, 100);
18645
+ }
18643
18646
  }
18644
18647
  break;
18645
18648
  case 'arrowup':
@@ -18679,10 +18682,6 @@ function setupKeyboardNavigation(component, optionsManager, navigateInTree) {
18679
18682
  }
18680
18683
  }
18681
18684
 
18682
- // Utility functions
18683
- function isInsidePicker(component, target) {
18684
- return target !== null && component.el.contains(target);
18685
- }
18686
18685
  // Focus management
18687
18686
  async function focusSearchInput(component) {
18688
18687
  const searchInput = component.el.querySelector('search-input input');
@@ -18908,13 +18907,11 @@ const HierarchizedPickerComponent = class {
18908
18907
  if (oldValue && JSON.stringify(newValue.options) != JSON.stringify(oldValue.options)) {
18909
18908
  this.value = [];
18910
18909
  }
18911
- console.log("Setnewoptions 01", newValue, oldValue);
18912
18910
  if ((newValue === null || newValue === void 0 ? void 0 : newValue.loading) == 'display' || (newValue && !newValue.loading)) {
18913
18911
  if ((oldValue && this.isChangeInOptions(newValue, oldValue)) || !oldValue) {
18914
18912
  if (!oldValue) {
18915
18913
  oldValue = savedOldValue;
18916
18914
  }
18917
- console.log("Setnewoptions 02");
18918
18915
  const propDiffs = this.diffKeys(oldValue, this.optionsManager.initializeOptions(newValue));
18919
18916
  const noReloadProps = ["multiple"];
18920
18917
  const ignoredProps = ["token"];
@@ -19241,8 +19238,9 @@ const HierarchizedPickerComponent = class {
19241
19238
  console.timeEnd = function () { };
19242
19239
  }
19243
19240
  // Setup component unique ID
19244
- if (this.optionsManager.getOptions().id)
19241
+ if (this.optionsManager.getOptions().id) {
19245
19242
  this.componentID = this.optionsManager.getOptions().id;
19243
+ }
19246
19244
  else if (!this.componentID) {
19247
19245
  let componentID = (Array.from(document.querySelectorAll('reneco-hierarchized-picker')).indexOf(this.el) + 1);
19248
19246
  while (document.querySelectorAll(`#hierarchized-picker-${componentID}`).length > 0) {
@@ -19585,7 +19583,6 @@ const HierarchizedPickerComponent = class {
19585
19583
  this.itemContextMenuItemClick.emit(e);
19586
19584
  }
19587
19585
  setNodeAsSelected(id, treeToUpdate, userClick) {
19588
- console.log("setNodeAsSelected", id);
19589
19586
  // TODO Temporarily ignores disabled mode for selecting nodes if mode is tree
19590
19587
  if (((this.isDisabled && this.optionsManager.getOptions().mode != "tree") && this.shownTree && this.setValueOnClick) ||
19591
19588
  (this.loadedTreeJs.liElementsById[id] && this.loadedTreeJs.liElementsById[id].classList.value && this.loadedTreeJs.liElementsById[id].classList.value.indexOf('readonly_node') != -1)) {
@@ -19662,7 +19659,7 @@ const HierarchizedPickerComponent = class {
19662
19659
  clearAutocomplete();
19663
19660
  if (!this.canload || !this.optionsManager.getOptions().displayTree)
19664
19661
  return;
19665
- const isStillInsidePicker = isInsidePicker(this, document.activeElement);
19662
+ const isStillInsidePicker = false; // TODO put back? >> isInsidePicker(this, document.activeElement);
19666
19663
  if ((focused === 'hide' || this.isDisabled) && !isStillInsidePicker) {
19667
19664
  this.hasFocus = ['hide'];
19668
19665
  const elem = document.querySelector('#hierarchized-picker-' + this.componentID + ' input.hierarchized-picker-search');
@@ -19845,7 +19842,6 @@ const HierarchizedPickerComponent = class {
19845
19842
  this.translateDataForTree(this.rawDataManager.getData());
19846
19843
  }
19847
19844
  checkFields(values, allowSetValueOnClick = true) {
19848
- console.log("checkFields", values);
19849
19845
  if (!this.loadedTreeJs)
19850
19846
  return;
19851
19847
  this.setValueOnClick = allowSetValueOnClick;
@@ -19975,7 +19971,7 @@ const HierarchizedPickerComponent = class {
19975
19971
  clickPickerModalArea(this);
19976
19972
  } }, h("div", { class: "loader", ref: el => {
19977
19973
  this.loader = el;
19978
- } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "" + this.componentID }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "" + this.componentID, onClick: event => {
19974
+ } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}`, tabindex: "0" }, h("search-input", { placeholder: getLanguageValue(this.optionsManager.getOptions().searchPlaceholder, this.optionsManager.getOptions().language, defaultLanguage), onInputFocus: () => focusInSearchEvent(this), onInputBlur: () => focusOutSearchEvent(this, event), onSearch: (event) => this.search(event.detail) }), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))) : (h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? ' readonly' : ''), tabindex: "0", onClick: event => {
19979
19975
  clickPickerModalArea(this);
19980
19976
  } }, h("div", { class: "loader", ref: el => {
19981
19977
  this.loader = el;