reneco-hierarchized-picker 0.3.4 → 0.3.5-beta.2

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 (15) hide show
  1. package/dist/cjs/reneco-hierarchized-picker.cjs.entry.js +43 -13
  2. package/dist/collection/components/hierarchized-picker/hierarchized-picker.js +40 -12
  3. package/dist/collection/components/hierarchized-picker/treejs/index.js +3 -1
  4. package/dist/custom-elements/index.js +43 -13
  5. package/dist/esm/reneco-hierarchized-picker.entry.js +43 -13
  6. package/dist/esm-es5/reneco-hierarchized-picker.entry.js +1 -1
  7. package/dist/reneco-hierarchized-picker/p-73168a50.system.js +1 -1
  8. package/dist/reneco-hierarchized-picker/p-817853ca.system.entry.js +3 -0
  9. package/dist/reneco-hierarchized-picker/p-dc98084e.entry.js +1 -0
  10. package/dist/reneco-hierarchized-picker/reneco-hierarchized-picker.esm.js +1 -1
  11. package/dist/types/components/hierarchized-picker/hierarchized-picker.d.ts +2 -1
  12. package/dist/types/utils/utils.d.ts +10 -2
  13. package/package.json +1 -1
  14. package/dist/reneco-hierarchized-picker/p-69efaff8.entry.js +0 -1
  15. package/dist/reneco-hierarchized-picker/p-d8ea47a5.system.entry.js +0 -3
package/dist/cjs/reneco-hierarchized-picker.cjs.entry.js CHANGED
@@ -202,7 +202,9 @@ Tree.prototype.bindEvent = function (ele) {
202
202
  }) }));
203
203
  }
204
204
  }
205
- ele.addEventListener('click', e => {
205
+ ele.addEventListener('mousedown', e => {
206
+ if (e.button != 0 && e.button != 2)
207
+ return;
206
208
  const { target } = e;
207
209
  if (target.nodeName === 'SPAN' && (target.classList.contains('treejs-checkbox') || target.classList.contains('treejs-label'))) {
208
210
  this.onItemClick(target.parentNode.nodeId);
@@ -17778,6 +17780,7 @@ var browser = XMLHttpRequest;
17778
17780
  const hierarchizedPickerCss = "reneco-hierarchized-picker .hierarchized-picker-raw-tree-area{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader{position:absolute;z-index:1;min-width:100%;min-height:100%;background:#FFFFFF99;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader .loader-inner{background:#FFF;padding:20px;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader:not(.loading){display:none}reneco-hierarchized-picker .scrollable{overflow-y:auto;position:relative}reneco-hierarchized-picker .treejs{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:var(--mui-typography-tree-font-size, 14px) !important;font-weight:var(--mui-typography-tree-font-weight, 400) !important}reneco-hierarchized-picker .treejs *:after,reneco-hierarchized-picker .treejs *:before{-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .treejs>.treejs-node{padding-left:0}reneco-hierarchized-picker .treejs .treejs-nodes{list-style:none;padding-left:20px;overflow:hidden;-webkit-transition:height 150ms ease-out, opacity 150ms ease-out;-o-transition:height 150ms ease-out, opacity 150ms ease-out;transition:height 150ms ease-out, opacity 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-node{cursor:pointer;overflow:hidden;position:relative}reneco-hierarchized-picker .treejs .treejs-node.treejs-placeholder{padding-left:20px}reneco-hierarchized-picker .treejs .treejs-switcher{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative;-webkit-transition:-webkit-transform 150ms ease-out;transition:-webkit-transform 150ms ease-out;-o-transition:transform 150ms ease-out;transition:transform 150ms ease-out;transition:transform 150ms ease-out, -webkit-transform 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-switcher:before{position:absolute;top:8px;left:6px;display:block;content:' ';border:4px solid transparent;border-top:4px solid rgba(0, 0, 0, 0.4);-webkit-transition:border-color 150ms;-o-transition:border-color 150ms;transition:border-color 150ms}reneco-hierarchized-picker .treejs .treejs-switcher:hover:before{border-top:4px solid rgba(0, 0, 0, 0.65)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-switcher{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-nodes{height:0}reneco-hierarchized-picker .treejs .treejs-checkbox{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;cursor:pointer;position:absolute;top:2px;content:' ';display:block;width:16px;height:16px;border:1px solid #d9d9d9;border-radius:2px}reneco-hierarchized-picker .treejs .treejs-checkbox:hover:before{-webkit-box-shadow:0 0 2px 1px #1890ff;box-shadow:0 0 2px 1px #1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:4px;left:5px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:9px;left:3px;width:10px;height:2px;background-color:#fff}reneco-hierarchized-picker .treejs .treejs-node__disabled{cursor:not-allowed;color:rgba(0, 0, 0, 0.25)}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox{cursor:not-allowed}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:before{cursor:not-allowed;border-color:#d9d9d9 !important;background-color:#f5f5f5 !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:hover:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-label{vertical-align:middle}reneco-hierarchized-picker .treejs .treejs-node__deprecated>.treejs-label{text-decoration:line-through}reneco-hierarchized-picker .treejs .treejs-node__desaturated>.treejs-label{opacity:.5}reneco-hierarchized-picker .treejs .treejs-node__searchmatch>.treejs-label{font-weight:bolder}reneco-hierarchized-picker .treejs .dragging{background:yellow;display:inline;opacity:.9;padding:11px 0px;display:block}reneco-hierarchized-picker .treejs .dragover{background:#CCC}reneco-hierarchized-picker .treejs .dragover-over::after{content:\"\";display:block;width:2px;height:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-before::after{content:\"\";display:block;height:2px;width:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-after::after{content:\"\";display:block;height:2px;width:100%;position:absolute;bottom:0;left:0;background:red}reneco-hierarchized-picker .fieldError{color:red !important}reneco-hierarchized-picker .hidden{display:none;opacity:0}reneco-hierarchized-picker ul.treejs-nodes:first-child{padding-left:0px !important;margin-top:0px !important;margin-left:0px !important}reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){margin:0 !important;padding-left:15px !important;background-color:var(--ion-color-light-tint, #FFF)}reneco-hierarchized-picker ul.treejs-nodes{margin-left:15px !important;padding-left:0px !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node ul.treejs-nodes{margin:11px 0 0 0 !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node__close ul.treejs-nodes{margin:0 !important}reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-light, #FAFAFA)}reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-medium, #bdbdbd7d);padding-bottom:0px !important}reneco-hierarchized-picker li:not(.treejs-node__close) ul.treejs-nodes li{margin-top:2px !important}reneco-hierarchized-picker ul li:last-child{margin-bottom:0px !important}reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)))}reneco-hierarchized-picker li.treejs-node{padding:2px 0px;margin-bottom:2px}reneco-hierarchized-picker .treejs-node.readonly_node{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:darkgrey}reneco-hierarchized-picker .treejs-node:not(.readonly_node){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:black}reneco-hierarchized-picker .hierarchized-picker-container{position:relative;width:100%}reneco-hierarchized-picker .hierarchized-picker-input-area{background-color:transparent !important;display:inline;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}reneco-hierarchized-picker .hierarchized-picker-input-area .input-wrapper{padding-left:10px !important}reneco-hierarchized-picker .hierarchized-picker-input{-ms-flex:2;flex:2}reneco-hierarchized-picker .hierarchized-picker-input.readonly{pointer-events:none;cursor:initial}reneco-hierarchized-picker .hierarchized-picker-input.hierarchized-picker-icon{margin-left:8px}reneco-hierarchized-picker .hierarchized-picker-label{position:stacked;margin-left:5px}reneco-hierarchized-picker .hierarchized-picker-input input,reneco-hierarchized-picker .hierarchized-picker-search input{padding-left:5px !important;text-overflow:ellipsis !important;border:0;background:transparent;outline:none;font-size:var(--mui-typography-body-font-size, 14px) !important;font-weight:var(--mui-typography-body-font-weight, 400) !important}reneco-hierarchized-picker .hierarchized-picker-search input{width:90%}reneco-hierarchized-picker .hierarchized-picker-search{background-color:var(--ion-color-medium-tint, #E0E0E0);position:absolute !important;width:333px !important;margin-top:10px;border-radius:4px;padding:8.5px}reneco-hierarchized-picker .hierarchized-picker-tree-area{width:333px !important;padding-top:48px}reneco-hierarchized-picker .hierarchized-picker-modal-area{background-color:var(--ion-color-light-tint, #FFF) !important;position:absolute;z-index:10;padding-left:15px;overflow:scroll;top:20px;min-height:100px;max-height:200px;-webkit-box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);border-radius:4px;margin-right:0px !important}reneco-hierarchized-picker .hierarchized-picker-modal{display:inline-block;width:357px}reneco-hierarchized-picker .hierarchized-picker{display:-ms-flexbox;display:flex;width:100%;font-family:'Roboto', sans-serif}reneco-hierarchized-picker .hierarchized-picker-spinner{margin:35px 0px 0px 145px}reneco-hierarchized-picker .reneco:before{position:relative;top:1px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco{padding:10px 15px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco:hover{cursor:pointer}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco-close{-webkit-transform:translate(5px, -8px);transform:translate(5px, -8px);color:var(--ion-color-danger, red) !important}reneco-hierarchized-picker .treejs .treejs-switcher:before{border-top:4px solid var(--ion-color-dark-shade, #121212)}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before,reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;border-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #searchInTree{padding:8.5px 8px;background:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));border:none !important;border-radius:4px}reneco-hierarchized-picker #searchInTree:focus{border:none !important;outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #autocomplete-results-area{position:absolute;margin-top:48px;background-color:white;left:15px;z-index:10;padding:0px 5px;max-width:340px;max-height:110px;overflow:auto}reneco-hierarchized-picker #autocomplete-results-area li{list-style-type:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;margin:1px}reneco-hierarchized-picker .hierarchized-picker-raw-tree-area li.treejs-node{padding:11px 0px;display:block}.hierarchized-picker-raw-tree-area.readonly li.treejs-node{cursor:initial;pointer-events:none}.hierarchized-picker-raw-tree-area.readonly li.treejs-node .treejs-switcher{pointer-events:all}::-webkit-scrollbar-thumb{background:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433));width:8px;margin:5px;border-radius:5px}::-webkit-scrollbar{background:var(--ion-color-medium-tint, #E0E0E0);width:8px;height:8px;margin:5px;cursor:pointer;border-radius:5px}::-webkit-scrollbar-corner{background-color:var(--ion-color-light-tint, #FFF)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-dark-tint, #424242);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-dark, #212121);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));color:var(--ion-color-primary-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker .treejs-switcher:before{border-top-color:var(--ion-color-dark-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked .treejs-switcher:before{color:var(--ion-color-light-contrast, #111111) !important}[class$=\"-dark\"] reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){background-color:var(--ion-color-light-contrast, #111111) !important}";
17779
17781
 
17780
17782
  const waitBeforeTriggerSearch = 1000;
17783
+ const defaultLanguage = "en";
17781
17784
  const defaultPickerTheme = {
17782
17785
  palette: {
17783
17786
  primary: {
@@ -18003,11 +18006,11 @@ const HierarchizedPickerComponent = class {
18003
18006
  if (!((!object.mode && typeof object.mode != 'boolean') || (typeof object.mode == 'string' && ['tree', 'input'].indexOf(object.mode) > -1))) {
18004
18007
  this.errorToLog = "options.mode value '" + object.mode + "' doesn't meet interface IConf requirements";
18005
18008
  }
18006
- if (!((!object.label && typeof object.label != "boolean") || typeof object.label == 'string')) {
18009
+ if (!((!object.label && typeof object.label != "boolean") || (typeof object.label == 'string' || typeof object.label == 'object'))) {
18007
18010
  toret = false;
18008
18011
  this.errorToLog = "options.label value '" + object.label + "' doesn't meet interface IConf requirements";
18009
18012
  }
18010
- if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || typeof object.searchPlaceholder == 'string')) {
18013
+ if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || (typeof object.searchPlaceholder == 'string' || typeof object.searchPlaceholder == 'object'))) {
18011
18014
  toret = false;
18012
18015
  this.errorToLog = "options.searchPlaceholder value '" + object.searchPlaceholder + "' doesn't meet interface IConf requirements";
18013
18016
  }
@@ -18074,6 +18077,13 @@ const HierarchizedPickerComponent = class {
18074
18077
  toret = false;
18075
18078
  this.errorToLog = "options.theme value doesn't meet interface IConf requirements";
18076
18079
  }
18080
+ const isLanguage = (value) => {
18081
+ return value === "fr" || value === "en";
18082
+ };
18083
+ if (!((!object.language && typeof object.language != 'string') || (typeof object.language == 'string' && isLanguage(object.language)))) {
18084
+ toret = false;
18085
+ this.errorToLog = "options.language value '" + object.language + "' doesn't meet interface IConf requirements ('fr' or 'en')";
18086
+ }
18077
18087
  return toret;
18078
18088
  }
18079
18089
  async initComponent() {
@@ -18424,13 +18434,10 @@ const HierarchizedPickerComponent = class {
18424
18434
  targetURL += '&searchedValue=' + options.search.searchedValue;
18425
18435
  }
18426
18436
  else {
18427
- let urloptions = '';
18437
+ let urloptions = '/?isDeprecated=' + (options.IsDeprecated ? "true" : "false");
18428
18438
  if (options.Reach && init) {
18429
18439
  urloptions += (urloptions.length == 0 ? '/?' : '&') + 'reach=' + options.Reach;
18430
18440
  }
18431
- if (options.IsDeprecated) {
18432
- urloptions += (urloptions.length == 0 ? '/?' : '&') + 'isDeprecated=' + options.IsDeprecated;
18433
- }
18434
18441
  targetURL += '/' + options.startNode + urloptions;
18435
18442
  }
18436
18443
  let getDataPromise = new Promise((resolve, reject) => {
@@ -18870,9 +18877,9 @@ const HierarchizedPickerComponent = class {
18870
18877
  let objToPush = {
18871
18878
  id: that.getPropertyFromNode(value, 'ID'),
18872
18879
  depth: depth,
18873
- text: that.getPropertyFromNode(value, 'Name'),
18880
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18874
18881
  fullpath: that.getPropertyFromNode(value, 'Properties').FullPath,
18875
- fullpathTranslated: that.getPropertyFromNode(value, 'Properties').FullPath,
18882
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18876
18883
  children: (that.getPropertyFromNode(value, "hasChildren", false) &&
18877
18884
  that.getPropertyFromNode(value, "children").length == 0 ? [{}] : []),
18878
18885
  deprecated: that.getPropertyFromNode(value, 'Properties').Is_Deprecated,
@@ -18934,9 +18941,9 @@ const HierarchizedPickerComponent = class {
18934
18941
  id: that.getPropertyFromNode(value, 'ID'),
18935
18942
  depth: depth,
18936
18943
  parent: parent,
18937
- text: that.getPropertyFromNode(value, 'Name'),
18944
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18938
18945
  fullpath: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18939
- fullpathTranslated: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18946
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18940
18947
  children: that.getPropertyFromNode(value, 'hasChildren', false) && that.getPropertyFromNode(value, 'children').length == 0 ? [{}] : [],
18941
18948
  deprecated: that.getPropertyFromNode(value.Properties, 'Is_Deprecated', false),
18942
18949
  };
@@ -19592,6 +19599,29 @@ const HierarchizedPickerComponent = class {
19592
19599
  keyUpPickerSearchInput(event) {
19593
19600
  this.search(event.target.value);
19594
19601
  }
19602
+ getLanguageValue(item) {
19603
+ if (item) {
19604
+ switch (typeof item) {
19605
+ case "string":
19606
+ return item;
19607
+ case "object":
19608
+ if (this.theOptions.language) {
19609
+ return item.filter(obj => obj.language == this.theOptions.language)[0].value;
19610
+ }
19611
+ else {
19612
+ const defaultLanguageItem = item.filter(obj => obj.language == defaultLanguage);
19613
+ if (defaultLanguageItem[0]) {
19614
+ return defaultLanguageItem[0].value;
19615
+ }
19616
+ else {
19617
+ this.logError("Missing language value in component configuration! It happened when requesting item text.");
19618
+ }
19619
+ }
19620
+ break;
19621
+ }
19622
+ }
19623
+ return "";
19624
+ }
19595
19625
  render() {
19596
19626
  return (this.theOptions
19597
19627
  ?
@@ -19599,7 +19629,7 @@ const HierarchizedPickerComponent = class {
19599
19629
  ?
19600
19630
  index.h("div", { class: "hierarchized-picker-container" }, index.h("div", { style: { display: "none" }, ref: (el => {
19601
19631
  this.loader = el;
19602
- }) }), index.h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? index.h("label", { class: "hierarchized-picker-label" }, this.theOptions.label) : '', index.h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19632
+ }) }), index.h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? index.h("label", { class: "hierarchized-picker-label" }, this.getLanguageValue(this.theOptions.label)) : '', index.h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19603
19633
  ' reneco ' + (this.theOptions.icon ? this.theOptions.icon : "") + (this.isDisabled ? " readonly " : "") +
19604
19634
  ' sc-ion-input-md-h sc-ion-input-md-s md ', id: 'hierarchized-picker-input-' + this.componentID, onClick: _event => {
19605
19635
  this.showTree("picker");
@@ -19623,7 +19653,7 @@ const HierarchizedPickerComponent = class {
19623
19653
  this.focusInSearchEvent(event);
19624
19654
  }, onFocusout: event => {
19625
19655
  this.focusOutSearchEvent(event);
19626
- } }, index.h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.theOptions.searchPlaceholder, spellcheck: "false", type: "text" })), 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 }))))
19656
+ } }, index.h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.getLanguageValue(this.theOptions.searchPlaceholder), spellcheck: "false", type: "text" })), 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 }))))
19627
19657
  :
19628
19658
  index.h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? " readonly" : ""), onClick: event => {
19629
19659
  this.clickPickerModalArea(event);
package/dist/collection/components/hierarchized-picker/hierarchized-picker.js CHANGED
@@ -4,6 +4,7 @@ import _ from "lodash";
4
4
  import XMLHttpRequest from 'xhr2';
5
5
  const waitBeforeTriggerSearch = 1000;
6
6
  const debug = false;
7
+ const defaultLanguage = "en";
7
8
  const defaultPickerTheme = {
8
9
  palette: {
9
10
  primary: {
@@ -225,11 +226,11 @@ export class HierarchizedPickerComponent {
225
226
  if (!((!object.mode && typeof object.mode != 'boolean') || (typeof object.mode == 'string' && ['tree', 'input'].indexOf(object.mode) > -1))) {
226
227
  this.errorToLog = "options.mode value '" + object.mode + "' doesn't meet interface IConf requirements";
227
228
  }
228
- if (!((!object.label && typeof object.label != "boolean") || typeof object.label == 'string')) {
229
+ if (!((!object.label && typeof object.label != "boolean") || (typeof object.label == 'string' || typeof object.label == 'object'))) {
229
230
  toret = false;
230
231
  this.errorToLog = "options.label value '" + object.label + "' doesn't meet interface IConf requirements";
231
232
  }
232
- if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || typeof object.searchPlaceholder == 'string')) {
233
+ if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || (typeof object.searchPlaceholder == 'string' || typeof object.searchPlaceholder == 'object'))) {
233
234
  toret = false;
234
235
  this.errorToLog = "options.searchPlaceholder value '" + object.searchPlaceholder + "' doesn't meet interface IConf requirements";
235
236
  }
@@ -296,6 +297,13 @@ export class HierarchizedPickerComponent {
296
297
  toret = false;
297
298
  this.errorToLog = "options.theme value doesn't meet interface IConf requirements";
298
299
  }
300
+ const isLanguage = (value) => {
301
+ return value === "fr" || value === "en";
302
+ };
303
+ if (!((!object.language && typeof object.language != 'string') || (typeof object.language == 'string' && isLanguage(object.language)))) {
304
+ toret = false;
305
+ this.errorToLog = "options.language value '" + object.language + "' doesn't meet interface IConf requirements ('fr' or 'en')";
306
+ }
299
307
  return toret;
300
308
  }
301
309
  async initComponent() {
@@ -649,13 +657,10 @@ export class HierarchizedPickerComponent {
649
657
  targetURL += '&searchedValue=' + options.search.searchedValue;
650
658
  }
651
659
  else {
652
- let urloptions = '';
660
+ let urloptions = '/?isDeprecated=' + (options.IsDeprecated ? "true" : "false");
653
661
  if (options.Reach && init) {
654
662
  urloptions += (urloptions.length == 0 ? '/?' : '&') + 'reach=' + options.Reach;
655
663
  }
656
- if (options.IsDeprecated) {
657
- urloptions += (urloptions.length == 0 ? '/?' : '&') + 'isDeprecated=' + options.IsDeprecated;
658
- }
659
664
  targetURL += '/' + options.startNode + urloptions;
660
665
  }
661
666
  let getDataPromise = new Promise((resolve, reject) => {
@@ -1095,9 +1100,9 @@ export class HierarchizedPickerComponent {
1095
1100
  let objToPush = {
1096
1101
  id: that.getPropertyFromNode(value, 'ID'),
1097
1102
  depth: depth,
1098
- text: that.getPropertyFromNode(value, 'Name'),
1103
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
1099
1104
  fullpath: that.getPropertyFromNode(value, 'Properties').FullPath,
1100
- fullpathTranslated: that.getPropertyFromNode(value, 'Properties').FullPath,
1105
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
1101
1106
  children: (that.getPropertyFromNode(value, "hasChildren", false) &&
1102
1107
  that.getPropertyFromNode(value, "children").length == 0 ? [{}] : []),
1103
1108
  deprecated: that.getPropertyFromNode(value, 'Properties').Is_Deprecated,
@@ -1159,9 +1164,9 @@ export class HierarchizedPickerComponent {
1159
1164
  id: that.getPropertyFromNode(value, 'ID'),
1160
1165
  depth: depth,
1161
1166
  parent: parent,
1162
- text: that.getPropertyFromNode(value, 'Name'),
1167
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
1163
1168
  fullpath: that.getPropertyFromNode(value.Properties, 'Fullpath'),
1164
- fullpathTranslated: that.getPropertyFromNode(value.Properties, 'Fullpath'),
1169
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
1165
1170
  children: that.getPropertyFromNode(value, 'hasChildren', false) && that.getPropertyFromNode(value, 'children').length == 0 ? [{}] : [],
1166
1171
  deprecated: that.getPropertyFromNode(value.Properties, 'Is_Deprecated', false),
1167
1172
  };
@@ -1817,6 +1822,29 @@ export class HierarchizedPickerComponent {
1817
1822
  keyUpPickerSearchInput(event) {
1818
1823
  this.search(event.target.value);
1819
1824
  }
1825
+ getLanguageValue(item) {
1826
+ if (item) {
1827
+ switch (typeof item) {
1828
+ case "string":
1829
+ return item;
1830
+ case "object":
1831
+ if (this.theOptions.language) {
1832
+ return item.filter(obj => obj.language == this.theOptions.language)[0].value;
1833
+ }
1834
+ else {
1835
+ const defaultLanguageItem = item.filter(obj => obj.language == defaultLanguage);
1836
+ if (defaultLanguageItem[0]) {
1837
+ return defaultLanguageItem[0].value;
1838
+ }
1839
+ else {
1840
+ this.logError("Missing language value in component configuration! It happened when requesting item text.");
1841
+ }
1842
+ }
1843
+ break;
1844
+ }
1845
+ }
1846
+ return "";
1847
+ }
1820
1848
  render() {
1821
1849
  return (this.theOptions
1822
1850
  ?
@@ -1824,7 +1852,7 @@ export class HierarchizedPickerComponent {
1824
1852
  ?
1825
1853
  h("div", { class: "hierarchized-picker-container" }, h("div", { style: { display: "none" }, ref: (el => {
1826
1854
  this.loader = el;
1827
- }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.theOptions.label) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
1855
+ }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.getLanguageValue(this.theOptions.label)) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
1828
1856
  ' reneco ' + (this.theOptions.icon ? this.theOptions.icon : "") + (this.isDisabled ? " readonly " : "") +
1829
1857
  ' sc-ion-input-md-h sc-ion-input-md-s md ', id: 'hierarchized-picker-input-' + this.componentID, onClick: _event => {
1830
1858
  this.showTree("picker");
@@ -1848,7 +1876,7 @@ export class HierarchizedPickerComponent {
1848
1876
  this.focusInSearchEvent(event);
1849
1877
  }, onFocusout: event => {
1850
1878
  this.focusOutSearchEvent(event);
1851
- } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.theOptions.searchPlaceholder, spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
1879
+ } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.getLanguageValue(this.theOptions.searchPlaceholder), spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
1852
1880
  :
1853
1881
  h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? " readonly" : ""), onClick: event => {
1854
1882
  this.clickPickerModalArea(event);
package/dist/collection/components/hierarchized-picker/treejs/index.js CHANGED
@@ -170,7 +170,9 @@ Tree.prototype.bindEvent = function (ele) {
170
170
  }) }));
171
171
  }
172
172
  }
173
- ele.addEventListener('click', e => {
173
+ ele.addEventListener('mousedown', e => {
174
+ if (e.button != 0 && e.button != 2)
175
+ return;
174
176
  const { target } = e;
175
177
  if (target.nodeName === 'SPAN' && (target.classList.contains('treejs-checkbox') || target.classList.contains('treejs-label'))) {
176
178
  this.onItemClick(target.parentNode.nodeId);
package/dist/custom-elements/index.js CHANGED
@@ -199,7 +199,9 @@ Tree.prototype.bindEvent = function (ele) {
199
199
  }) }));
200
200
  }
201
201
  }
202
- ele.addEventListener('click', e => {
202
+ ele.addEventListener('mousedown', e => {
203
+ if (e.button != 0 && e.button != 2)
204
+ return;
203
205
  const { target } = e;
204
206
  if (target.nodeName === 'SPAN' && (target.classList.contains('treejs-checkbox') || target.classList.contains('treejs-label'))) {
205
207
  this.onItemClick(target.parentNode.nodeId);
@@ -17775,6 +17777,7 @@ var browser = XMLHttpRequest;
17775
17777
  const hierarchizedPickerCss = "reneco-hierarchized-picker .hierarchized-picker-raw-tree-area{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader{position:absolute;z-index:1;min-width:100%;min-height:100%;background:#FFFFFF99;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader .loader-inner{background:#FFF;padding:20px;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader:not(.loading){display:none}reneco-hierarchized-picker .scrollable{overflow-y:auto;position:relative}reneco-hierarchized-picker .treejs{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:var(--mui-typography-tree-font-size, 14px) !important;font-weight:var(--mui-typography-tree-font-weight, 400) !important}reneco-hierarchized-picker .treejs *:after,reneco-hierarchized-picker .treejs *:before{-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .treejs>.treejs-node{padding-left:0}reneco-hierarchized-picker .treejs .treejs-nodes{list-style:none;padding-left:20px;overflow:hidden;-webkit-transition:height 150ms ease-out, opacity 150ms ease-out;-o-transition:height 150ms ease-out, opacity 150ms ease-out;transition:height 150ms ease-out, opacity 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-node{cursor:pointer;overflow:hidden;position:relative}reneco-hierarchized-picker .treejs .treejs-node.treejs-placeholder{padding-left:20px}reneco-hierarchized-picker .treejs .treejs-switcher{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative;-webkit-transition:-webkit-transform 150ms ease-out;transition:-webkit-transform 150ms ease-out;-o-transition:transform 150ms ease-out;transition:transform 150ms ease-out;transition:transform 150ms ease-out, -webkit-transform 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-switcher:before{position:absolute;top:8px;left:6px;display:block;content:' ';border:4px solid transparent;border-top:4px solid rgba(0, 0, 0, 0.4);-webkit-transition:border-color 150ms;-o-transition:border-color 150ms;transition:border-color 150ms}reneco-hierarchized-picker .treejs .treejs-switcher:hover:before{border-top:4px solid rgba(0, 0, 0, 0.65)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-switcher{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-nodes{height:0}reneco-hierarchized-picker .treejs .treejs-checkbox{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;cursor:pointer;position:absolute;top:2px;content:' ';display:block;width:16px;height:16px;border:1px solid #d9d9d9;border-radius:2px}reneco-hierarchized-picker .treejs .treejs-checkbox:hover:before{-webkit-box-shadow:0 0 2px 1px #1890ff;box-shadow:0 0 2px 1px #1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:4px;left:5px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:9px;left:3px;width:10px;height:2px;background-color:#fff}reneco-hierarchized-picker .treejs .treejs-node__disabled{cursor:not-allowed;color:rgba(0, 0, 0, 0.25)}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox{cursor:not-allowed}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:before{cursor:not-allowed;border-color:#d9d9d9 !important;background-color:#f5f5f5 !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:hover:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-label{vertical-align:middle}reneco-hierarchized-picker .treejs .treejs-node__deprecated>.treejs-label{text-decoration:line-through}reneco-hierarchized-picker .treejs .treejs-node__desaturated>.treejs-label{opacity:.5}reneco-hierarchized-picker .treejs .treejs-node__searchmatch>.treejs-label{font-weight:bolder}reneco-hierarchized-picker .treejs .dragging{background:yellow;display:inline;opacity:.9;padding:11px 0px;display:block}reneco-hierarchized-picker .treejs .dragover{background:#CCC}reneco-hierarchized-picker .treejs .dragover-over::after{content:\"\";display:block;width:2px;height:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-before::after{content:\"\";display:block;height:2px;width:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-after::after{content:\"\";display:block;height:2px;width:100%;position:absolute;bottom:0;left:0;background:red}reneco-hierarchized-picker .fieldError{color:red !important}reneco-hierarchized-picker .hidden{display:none;opacity:0}reneco-hierarchized-picker ul.treejs-nodes:first-child{padding-left:0px !important;margin-top:0px !important;margin-left:0px !important}reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){margin:0 !important;padding-left:15px !important;background-color:var(--ion-color-light-tint, #FFF)}reneco-hierarchized-picker ul.treejs-nodes{margin-left:15px !important;padding-left:0px !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node ul.treejs-nodes{margin:11px 0 0 0 !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node__close ul.treejs-nodes{margin:0 !important}reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-light, #FAFAFA)}reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-medium, #bdbdbd7d);padding-bottom:0px !important}reneco-hierarchized-picker li:not(.treejs-node__close) ul.treejs-nodes li{margin-top:2px !important}reneco-hierarchized-picker ul li:last-child{margin-bottom:0px !important}reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)))}reneco-hierarchized-picker li.treejs-node{padding:2px 0px;margin-bottom:2px}reneco-hierarchized-picker .treejs-node.readonly_node{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:darkgrey}reneco-hierarchized-picker .treejs-node:not(.readonly_node){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:black}reneco-hierarchized-picker .hierarchized-picker-container{position:relative;width:100%}reneco-hierarchized-picker .hierarchized-picker-input-area{background-color:transparent !important;display:inline;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}reneco-hierarchized-picker .hierarchized-picker-input-area .input-wrapper{padding-left:10px !important}reneco-hierarchized-picker .hierarchized-picker-input{-ms-flex:2;flex:2}reneco-hierarchized-picker .hierarchized-picker-input.readonly{pointer-events:none;cursor:initial}reneco-hierarchized-picker .hierarchized-picker-input.hierarchized-picker-icon{margin-left:8px}reneco-hierarchized-picker .hierarchized-picker-label{position:stacked;margin-left:5px}reneco-hierarchized-picker .hierarchized-picker-input input,reneco-hierarchized-picker .hierarchized-picker-search input{padding-left:5px !important;text-overflow:ellipsis !important;border:0;background:transparent;outline:none;font-size:var(--mui-typography-body-font-size, 14px) !important;font-weight:var(--mui-typography-body-font-weight, 400) !important}reneco-hierarchized-picker .hierarchized-picker-search input{width:90%}reneco-hierarchized-picker .hierarchized-picker-search{background-color:var(--ion-color-medium-tint, #E0E0E0);position:absolute !important;width:333px !important;margin-top:10px;border-radius:4px;padding:8.5px}reneco-hierarchized-picker .hierarchized-picker-tree-area{width:333px !important;padding-top:48px}reneco-hierarchized-picker .hierarchized-picker-modal-area{background-color:var(--ion-color-light-tint, #FFF) !important;position:absolute;z-index:10;padding-left:15px;overflow:scroll;top:20px;min-height:100px;max-height:200px;-webkit-box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);border-radius:4px;margin-right:0px !important}reneco-hierarchized-picker .hierarchized-picker-modal{display:inline-block;width:357px}reneco-hierarchized-picker .hierarchized-picker{display:-ms-flexbox;display:flex;width:100%;font-family:'Roboto', sans-serif}reneco-hierarchized-picker .hierarchized-picker-spinner{margin:35px 0px 0px 145px}reneco-hierarchized-picker .reneco:before{position:relative;top:1px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco{padding:10px 15px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco:hover{cursor:pointer}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco-close{-webkit-transform:translate(5px, -8px);transform:translate(5px, -8px);color:var(--ion-color-danger, red) !important}reneco-hierarchized-picker .treejs .treejs-switcher:before{border-top:4px solid var(--ion-color-dark-shade, #121212)}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before,reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;border-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #searchInTree{padding:8.5px 8px;background:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));border:none !important;border-radius:4px}reneco-hierarchized-picker #searchInTree:focus{border:none !important;outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #autocomplete-results-area{position:absolute;margin-top:48px;background-color:white;left:15px;z-index:10;padding:0px 5px;max-width:340px;max-height:110px;overflow:auto}reneco-hierarchized-picker #autocomplete-results-area li{list-style-type:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;margin:1px}reneco-hierarchized-picker .hierarchized-picker-raw-tree-area li.treejs-node{padding:11px 0px;display:block}.hierarchized-picker-raw-tree-area.readonly li.treejs-node{cursor:initial;pointer-events:none}.hierarchized-picker-raw-tree-area.readonly li.treejs-node .treejs-switcher{pointer-events:all}::-webkit-scrollbar-thumb{background:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433));width:8px;margin:5px;border-radius:5px}::-webkit-scrollbar{background:var(--ion-color-medium-tint, #E0E0E0);width:8px;height:8px;margin:5px;cursor:pointer;border-radius:5px}::-webkit-scrollbar-corner{background-color:var(--ion-color-light-tint, #FFF)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-dark-tint, #424242);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-dark, #212121);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));color:var(--ion-color-primary-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker .treejs-switcher:before{border-top-color:var(--ion-color-dark-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked .treejs-switcher:before{color:var(--ion-color-light-contrast, #111111) !important}[class$=\"-dark\"] reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){background-color:var(--ion-color-light-contrast, #111111) !important}";
17776
17778
 
17777
17779
  const waitBeforeTriggerSearch = 1000;
17780
+ const defaultLanguage = "en";
17778
17781
  const defaultPickerTheme = {
17779
17782
  palette: {
17780
17783
  primary: {
@@ -18001,11 +18004,11 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18001
18004
  if (!((!object.mode && typeof object.mode != 'boolean') || (typeof object.mode == 'string' && ['tree', 'input'].indexOf(object.mode) > -1))) {
18002
18005
  this.errorToLog = "options.mode value '" + object.mode + "' doesn't meet interface IConf requirements";
18003
18006
  }
18004
- if (!((!object.label && typeof object.label != "boolean") || typeof object.label == 'string')) {
18007
+ if (!((!object.label && typeof object.label != "boolean") || (typeof object.label == 'string' || typeof object.label == 'object'))) {
18005
18008
  toret = false;
18006
18009
  this.errorToLog = "options.label value '" + object.label + "' doesn't meet interface IConf requirements";
18007
18010
  }
18008
- if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || typeof object.searchPlaceholder == 'string')) {
18011
+ if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || (typeof object.searchPlaceholder == 'string' || typeof object.searchPlaceholder == 'object'))) {
18009
18012
  toret = false;
18010
18013
  this.errorToLog = "options.searchPlaceholder value '" + object.searchPlaceholder + "' doesn't meet interface IConf requirements";
18011
18014
  }
@@ -18072,6 +18075,13 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18072
18075
  toret = false;
18073
18076
  this.errorToLog = "options.theme value doesn't meet interface IConf requirements";
18074
18077
  }
18078
+ const isLanguage = (value) => {
18079
+ return value === "fr" || value === "en";
18080
+ };
18081
+ if (!((!object.language && typeof object.language != 'string') || (typeof object.language == 'string' && isLanguage(object.language)))) {
18082
+ toret = false;
18083
+ this.errorToLog = "options.language value '" + object.language + "' doesn't meet interface IConf requirements ('fr' or 'en')";
18084
+ }
18075
18085
  return toret;
18076
18086
  }
18077
18087
  async initComponent() {
@@ -18422,13 +18432,10 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18422
18432
  targetURL += '&searchedValue=' + options.search.searchedValue;
18423
18433
  }
18424
18434
  else {
18425
- let urloptions = '';
18435
+ let urloptions = '/?isDeprecated=' + (options.IsDeprecated ? "true" : "false");
18426
18436
  if (options.Reach && init) {
18427
18437
  urloptions += (urloptions.length == 0 ? '/?' : '&') + 'reach=' + options.Reach;
18428
18438
  }
18429
- if (options.IsDeprecated) {
18430
- urloptions += (urloptions.length == 0 ? '/?' : '&') + 'isDeprecated=' + options.IsDeprecated;
18431
- }
18432
18439
  targetURL += '/' + options.startNode + urloptions;
18433
18440
  }
18434
18441
  let getDataPromise = new Promise((resolve, reject) => {
@@ -18868,9 +18875,9 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18868
18875
  let objToPush = {
18869
18876
  id: that.getPropertyFromNode(value, 'ID'),
18870
18877
  depth: depth,
18871
- text: that.getPropertyFromNode(value, 'Name'),
18878
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18872
18879
  fullpath: that.getPropertyFromNode(value, 'Properties').FullPath,
18873
- fullpathTranslated: that.getPropertyFromNode(value, 'Properties').FullPath,
18880
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18874
18881
  children: (that.getPropertyFromNode(value, "hasChildren", false) &&
18875
18882
  that.getPropertyFromNode(value, "children").length == 0 ? [{}] : []),
18876
18883
  deprecated: that.getPropertyFromNode(value, 'Properties').Is_Deprecated,
@@ -18932,9 +18939,9 @@ const HierarchizedPickerComponent = class extends HTMLElement {
18932
18939
  id: that.getPropertyFromNode(value, 'ID'),
18933
18940
  depth: depth,
18934
18941
  parent: parent,
18935
- text: that.getPropertyFromNode(value, 'Name'),
18942
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18936
18943
  fullpath: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18937
- fullpathTranslated: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18944
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18938
18945
  children: that.getPropertyFromNode(value, 'hasChildren', false) && that.getPropertyFromNode(value, 'children').length == 0 ? [{}] : [],
18939
18946
  deprecated: that.getPropertyFromNode(value.Properties, 'Is_Deprecated', false),
18940
18947
  };
@@ -19590,6 +19597,29 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19590
19597
  keyUpPickerSearchInput(event) {
19591
19598
  this.search(event.target.value);
19592
19599
  }
19600
+ getLanguageValue(item) {
19601
+ if (item) {
19602
+ switch (typeof item) {
19603
+ case "string":
19604
+ return item;
19605
+ case "object":
19606
+ if (this.theOptions.language) {
19607
+ return item.filter(obj => obj.language == this.theOptions.language)[0].value;
19608
+ }
19609
+ else {
19610
+ const defaultLanguageItem = item.filter(obj => obj.language == defaultLanguage);
19611
+ if (defaultLanguageItem[0]) {
19612
+ return defaultLanguageItem[0].value;
19613
+ }
19614
+ else {
19615
+ this.logError("Missing language value in component configuration! It happened when requesting item text.");
19616
+ }
19617
+ }
19618
+ break;
19619
+ }
19620
+ }
19621
+ return "";
19622
+ }
19593
19623
  render() {
19594
19624
  return (this.theOptions
19595
19625
  ?
@@ -19597,7 +19627,7 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19597
19627
  ?
19598
19628
  h("div", { class: "hierarchized-picker-container" }, h("div", { style: { display: "none" }, ref: (el => {
19599
19629
  this.loader = el;
19600
- }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.theOptions.label) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19630
+ }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.getLanguageValue(this.theOptions.label)) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19601
19631
  ' reneco ' + (this.theOptions.icon ? this.theOptions.icon : "") + (this.isDisabled ? " readonly " : "") +
19602
19632
  ' sc-ion-input-md-h sc-ion-input-md-s md ', id: 'hierarchized-picker-input-' + this.componentID, onClick: _event => {
19603
19633
  this.showTree("picker");
@@ -19621,7 +19651,7 @@ const HierarchizedPickerComponent = class extends HTMLElement {
19621
19651
  this.focusInSearchEvent(event);
19622
19652
  }, onFocusout: event => {
19623
19653
  this.focusOutSearchEvent(event);
19624
- } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.theOptions.searchPlaceholder, spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
19654
+ } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.getLanguageValue(this.theOptions.searchPlaceholder), spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
19625
19655
  :
19626
19656
  h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? " readonly" : ""), onClick: event => {
19627
19657
  this.clickPickerModalArea(event);
package/dist/esm/reneco-hierarchized-picker.entry.js CHANGED
@@ -198,7 +198,9 @@ Tree.prototype.bindEvent = function (ele) {
198
198
  }) }));
199
199
  }
200
200
  }
201
- ele.addEventListener('click', e => {
201
+ ele.addEventListener('mousedown', e => {
202
+ if (e.button != 0 && e.button != 2)
203
+ return;
202
204
  const { target } = e;
203
205
  if (target.nodeName === 'SPAN' && (target.classList.contains('treejs-checkbox') || target.classList.contains('treejs-label'))) {
204
206
  this.onItemClick(target.parentNode.nodeId);
@@ -17774,6 +17776,7 @@ var browser = XMLHttpRequest;
17774
17776
  const hierarchizedPickerCss = "reneco-hierarchized-picker .hierarchized-picker-raw-tree-area{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader{position:absolute;z-index:1;min-width:100%;min-height:100%;background:#FFFFFF99;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:10px;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader .loader-inner{background:#FFF;padding:20px;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .loader:not(.loading){display:none}reneco-hierarchized-picker .scrollable{overflow-y:auto;position:relative}reneco-hierarchized-picker .treejs{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:var(--mui-typography-tree-font-size, 14px) !important;font-weight:var(--mui-typography-tree-font-weight, 400) !important}reneco-hierarchized-picker .treejs *:after,reneco-hierarchized-picker .treejs *:before{-webkit-box-sizing:border-box;box-sizing:border-box}reneco-hierarchized-picker .treejs>.treejs-node{padding-left:0}reneco-hierarchized-picker .treejs .treejs-nodes{list-style:none;padding-left:20px;overflow:hidden;-webkit-transition:height 150ms ease-out, opacity 150ms ease-out;-o-transition:height 150ms ease-out, opacity 150ms ease-out;transition:height 150ms ease-out, opacity 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-node{cursor:pointer;overflow:hidden;position:relative}reneco-hierarchized-picker .treejs .treejs-node.treejs-placeholder{padding-left:20px}reneco-hierarchized-picker .treejs .treejs-switcher{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative;-webkit-transition:-webkit-transform 150ms ease-out;transition:-webkit-transform 150ms ease-out;-o-transition:transform 150ms ease-out;transition:transform 150ms ease-out;transition:transform 150ms ease-out, -webkit-transform 150ms ease-out}reneco-hierarchized-picker .treejs .treejs-switcher:before{position:absolute;top:8px;left:6px;display:block;content:' ';border:4px solid transparent;border-top:4px solid rgba(0, 0, 0, 0.4);-webkit-transition:border-color 150ms;-o-transition:border-color 150ms;transition:border-color 150ms}reneco-hierarchized-picker .treejs .treejs-switcher:hover:before{border-top:4px solid rgba(0, 0, 0, 0.65)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-switcher{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}reneco-hierarchized-picker .treejs .treejs-node__close>.treejs-nodes{height:0}reneco-hierarchized-picker .treejs .treejs-checkbox{display:inline-block;vertical-align:middle;width:20px;height:20px;cursor:pointer;position:relative}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;cursor:pointer;position:absolute;top:2px;content:' ';display:block;width:16px;height:16px;border:1px solid #d9d9d9;border-radius:2px}reneco-hierarchized-picker .treejs .treejs-checkbox:hover:before{-webkit-box-shadow:0 0 2px 1px #1890ff;box-shadow:0 0 2px 1px #1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:4px;left:5px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:#1890ff;border-color:#1890ff}reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:after{position:absolute;content:' ';display:block;top:9px;left:3px;width:10px;height:2px;background-color:#fff}reneco-hierarchized-picker .treejs .treejs-node__disabled{cursor:not-allowed;color:rgba(0, 0, 0, 0.25)}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox{cursor:not-allowed}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:before{cursor:not-allowed;border-color:#d9d9d9 !important;background-color:#f5f5f5 !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-checkbox:hover:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled .treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__checked>.treejs-checkbox:after{border-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-node__disabled.treejs-node__halfchecked>.treejs-checkbox:after{background-color:#d9d9d9}reneco-hierarchized-picker .treejs .treejs-label{vertical-align:middle}reneco-hierarchized-picker .treejs .treejs-node__deprecated>.treejs-label{text-decoration:line-through}reneco-hierarchized-picker .treejs .treejs-node__desaturated>.treejs-label{opacity:.5}reneco-hierarchized-picker .treejs .treejs-node__searchmatch>.treejs-label{font-weight:bolder}reneco-hierarchized-picker .treejs .dragging{background:yellow;display:inline;opacity:.9;padding:11px 0px;display:block}reneco-hierarchized-picker .treejs .dragover{background:#CCC}reneco-hierarchized-picker .treejs .dragover-over::after{content:\"\";display:block;width:2px;height:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-before::after{content:\"\";display:block;height:2px;width:100%;position:absolute;top:0;left:0;background:red}reneco-hierarchized-picker .treejs .dragover-after::after{content:\"\";display:block;height:2px;width:100%;position:absolute;bottom:0;left:0;background:red}reneco-hierarchized-picker .fieldError{color:red !important}reneco-hierarchized-picker .hidden{display:none;opacity:0}reneco-hierarchized-picker ul.treejs-nodes:first-child{padding-left:0px !important;margin-top:0px !important;margin-left:0px !important}reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){margin:0 !important;padding-left:15px !important;background-color:var(--ion-color-light-tint, #FFF)}reneco-hierarchized-picker ul.treejs-nodes{margin-left:15px !important;padding-left:0px !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node ul.treejs-nodes{margin:11px 0 0 0 !important}reneco-hierarchized-picker .hierarchized-picker-raw-tree li.treejs-node__close ul.treejs-nodes{margin:0 !important}reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-light, #FAFAFA)}reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-medium, #bdbdbd7d);padding-bottom:0px !important}reneco-hierarchized-picker li:not(.treejs-node__close) ul.treejs-nodes li{margin-top:2px !important}reneco-hierarchized-picker ul li:last-child{margin-bottom:0px !important}reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)))}reneco-hierarchized-picker li.treejs-node{padding:2px 0px;margin-bottom:2px}reneco-hierarchized-picker .treejs-node.readonly_node{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:darkgrey}reneco-hierarchized-picker .treejs-node:not(.readonly_node){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:black}reneco-hierarchized-picker .hierarchized-picker-container{position:relative;width:100%}reneco-hierarchized-picker .hierarchized-picker-input-area{background-color:transparent !important;display:inline;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}reneco-hierarchized-picker .hierarchized-picker-input-area .input-wrapper{padding-left:10px !important}reneco-hierarchized-picker .hierarchized-picker-input{-ms-flex:2;flex:2}reneco-hierarchized-picker .hierarchized-picker-input.readonly{pointer-events:none;cursor:initial}reneco-hierarchized-picker .hierarchized-picker-input.hierarchized-picker-icon{margin-left:8px}reneco-hierarchized-picker .hierarchized-picker-label{position:stacked;margin-left:5px}reneco-hierarchized-picker .hierarchized-picker-input input,reneco-hierarchized-picker .hierarchized-picker-search input{padding-left:5px !important;text-overflow:ellipsis !important;border:0;background:transparent;outline:none;font-size:var(--mui-typography-body-font-size, 14px) !important;font-weight:var(--mui-typography-body-font-weight, 400) !important}reneco-hierarchized-picker .hierarchized-picker-search input{width:90%}reneco-hierarchized-picker .hierarchized-picker-search{background-color:var(--ion-color-medium-tint, #E0E0E0);position:absolute !important;width:333px !important;margin-top:10px;border-radius:4px;padding:8.5px}reneco-hierarchized-picker .hierarchized-picker-tree-area{width:333px !important;padding-top:48px}reneco-hierarchized-picker .hierarchized-picker-modal-area{background-color:var(--ion-color-light-tint, #FFF) !important;position:absolute;z-index:10;padding-left:15px;overflow:scroll;top:20px;min-height:100px;max-height:200px;-webkit-box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 0px 15px 0 rgba(0, 0, 0, 0.2);border-radius:4px;margin-right:0px !important}reneco-hierarchized-picker .hierarchized-picker-modal{display:inline-block;width:357px}reneco-hierarchized-picker .hierarchized-picker{display:-ms-flexbox;display:flex;width:100%;font-family:'Roboto', sans-serif}reneco-hierarchized-picker .hierarchized-picker-spinner{margin:35px 0px 0px 145px}reneco-hierarchized-picker .reneco:before{position:relative;top:1px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco{padding:10px 15px}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco:hover{cursor:pointer}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco-close{-webkit-transform:translate(5px, -8px);transform:translate(5px, -8px);color:var(--ion-color-danger, red) !important}reneco-hierarchized-picker .treejs .treejs-switcher:before{border-top:4px solid var(--ion-color-dark-shade, #121212)}reneco-hierarchized-picker .treejs .treejs-checkbox:before{-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .treejs .treejs-node__checked>.treejs-checkbox:before,reneco-hierarchized-picker .treejs .treejs-node__halfchecked>.treejs-checkbox:before{background-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;border-color:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433)) !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #searchInTree{padding:8.5px 8px;background:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));border:none !important;border-radius:4px}reneco-hierarchized-picker #searchInTree:focus{border:none !important;outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker #autocomplete-results-area{position:absolute;margin-top:48px;background-color:white;left:15px;z-index:10;padding:0px 5px;max-width:340px;max-height:110px;overflow:auto}reneco-hierarchized-picker #autocomplete-results-area li{list-style-type:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;margin:1px}reneco-hierarchized-picker .hierarchized-picker-raw-tree-area li.treejs-node{padding:11px 0px;display:block}.hierarchized-picker-raw-tree-area.readonly li.treejs-node{cursor:initial;pointer-events:none}.hierarchized-picker-raw-tree-area.readonly li.treejs-node .treejs-switcher{pointer-events:all}::-webkit-scrollbar-thumb{background:var(--ion-color-primary, var(--mui-palette-primary-main, #d58433));width:8px;margin:5px;border-radius:5px}::-webkit-scrollbar{background:var(--ion-color-medium-tint, #E0E0E0);width:8px;height:8px;margin:5px;cursor:pointer;border-radius:5px}::-webkit-scrollbar-corner{background-color:var(--ion-color-light-tint, #FFF)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__close{background-color:var(--ion-color-dark-tint, #424242);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--ion-color-dark, #212121);color:var(--ion-color-dark-contrast, #fff)}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked{background-color:var(--ion-color-background, var(--mui-palette-background-default, rgba(221, 169, 37, 0.18)));color:var(--ion-color-primary-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker .treejs-switcher:before{border-top-color:var(--ion-color-dark-contrast, #fff) !important}[class$=\"-dark\"] reneco-hierarchized-picker li.treejs-node__checked .treejs-switcher:before{color:var(--ion-color-light-contrast, #111111) !important}[class$=\"-dark\"] reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){background-color:var(--ion-color-light-contrast, #111111) !important}";
17775
17777
 
17776
17778
  const waitBeforeTriggerSearch = 1000;
17779
+ const defaultLanguage = "en";
17777
17780
  const defaultPickerTheme = {
17778
17781
  palette: {
17779
17782
  primary: {
@@ -17999,11 +18002,11 @@ const HierarchizedPickerComponent = class {
17999
18002
  if (!((!object.mode && typeof object.mode != 'boolean') || (typeof object.mode == 'string' && ['tree', 'input'].indexOf(object.mode) > -1))) {
18000
18003
  this.errorToLog = "options.mode value '" + object.mode + "' doesn't meet interface IConf requirements";
18001
18004
  }
18002
- if (!((!object.label && typeof object.label != "boolean") || typeof object.label == 'string')) {
18005
+ if (!((!object.label && typeof object.label != "boolean") || (typeof object.label == 'string' || typeof object.label == 'object'))) {
18003
18006
  toret = false;
18004
18007
  this.errorToLog = "options.label value '" + object.label + "' doesn't meet interface IConf requirements";
18005
18008
  }
18006
- if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || typeof object.searchPlaceholder == 'string')) {
18009
+ if (!((!object.searchPlaceholder && typeof object.searchPlaceholder != 'boolean') || (typeof object.searchPlaceholder == 'string' || typeof object.searchPlaceholder == 'object'))) {
18007
18010
  toret = false;
18008
18011
  this.errorToLog = "options.searchPlaceholder value '" + object.searchPlaceholder + "' doesn't meet interface IConf requirements";
18009
18012
  }
@@ -18070,6 +18073,13 @@ const HierarchizedPickerComponent = class {
18070
18073
  toret = false;
18071
18074
  this.errorToLog = "options.theme value doesn't meet interface IConf requirements";
18072
18075
  }
18076
+ const isLanguage = (value) => {
18077
+ return value === "fr" || value === "en";
18078
+ };
18079
+ if (!((!object.language && typeof object.language != 'string') || (typeof object.language == 'string' && isLanguage(object.language)))) {
18080
+ toret = false;
18081
+ this.errorToLog = "options.language value '" + object.language + "' doesn't meet interface IConf requirements ('fr' or 'en')";
18082
+ }
18073
18083
  return toret;
18074
18084
  }
18075
18085
  async initComponent() {
@@ -18420,13 +18430,10 @@ const HierarchizedPickerComponent = class {
18420
18430
  targetURL += '&searchedValue=' + options.search.searchedValue;
18421
18431
  }
18422
18432
  else {
18423
- let urloptions = '';
18433
+ let urloptions = '/?isDeprecated=' + (options.IsDeprecated ? "true" : "false");
18424
18434
  if (options.Reach && init) {
18425
18435
  urloptions += (urloptions.length == 0 ? '/?' : '&') + 'reach=' + options.Reach;
18426
18436
  }
18427
- if (options.IsDeprecated) {
18428
- urloptions += (urloptions.length == 0 ? '/?' : '&') + 'isDeprecated=' + options.IsDeprecated;
18429
- }
18430
18437
  targetURL += '/' + options.startNode + urloptions;
18431
18438
  }
18432
18439
  let getDataPromise = new Promise((resolve, reject) => {
@@ -18866,9 +18873,9 @@ const HierarchizedPickerComponent = class {
18866
18873
  let objToPush = {
18867
18874
  id: that.getPropertyFromNode(value, 'ID'),
18868
18875
  depth: depth,
18869
- text: that.getPropertyFromNode(value, 'Name'),
18876
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18870
18877
  fullpath: that.getPropertyFromNode(value, 'Properties').FullPath,
18871
- fullpathTranslated: that.getPropertyFromNode(value, 'Properties').FullPath,
18878
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18872
18879
  children: (that.getPropertyFromNode(value, "hasChildren", false) &&
18873
18880
  that.getPropertyFromNode(value, "children").length == 0 ? [{}] : []),
18874
18881
  deprecated: that.getPropertyFromNode(value, 'Properties').Is_Deprecated,
@@ -18930,9 +18937,9 @@ const HierarchizedPickerComponent = class {
18930
18937
  id: that.getPropertyFromNode(value, 'ID'),
18931
18938
  depth: depth,
18932
18939
  parent: parent,
18933
- text: that.getPropertyFromNode(value, 'Name'),
18940
+ text: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_name,
18934
18941
  fullpath: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18935
- fullpathTranslated: that.getPropertyFromNode(value.Properties, 'Fullpath'),
18942
+ fullpathTranslated: that.getPropertyFromNode(value, 'Translations')[that.theOptions.language || defaultLanguage].translated_fullpath,
18936
18943
  children: that.getPropertyFromNode(value, 'hasChildren', false) && that.getPropertyFromNode(value, 'children').length == 0 ? [{}] : [],
18937
18944
  deprecated: that.getPropertyFromNode(value.Properties, 'Is_Deprecated', false),
18938
18945
  };
@@ -19588,6 +19595,29 @@ const HierarchizedPickerComponent = class {
19588
19595
  keyUpPickerSearchInput(event) {
19589
19596
  this.search(event.target.value);
19590
19597
  }
19598
+ getLanguageValue(item) {
19599
+ if (item) {
19600
+ switch (typeof item) {
19601
+ case "string":
19602
+ return item;
19603
+ case "object":
19604
+ if (this.theOptions.language) {
19605
+ return item.filter(obj => obj.language == this.theOptions.language)[0].value;
19606
+ }
19607
+ else {
19608
+ const defaultLanguageItem = item.filter(obj => obj.language == defaultLanguage);
19609
+ if (defaultLanguageItem[0]) {
19610
+ return defaultLanguageItem[0].value;
19611
+ }
19612
+ else {
19613
+ this.logError("Missing language value in component configuration! It happened when requesting item text.");
19614
+ }
19615
+ }
19616
+ break;
19617
+ }
19618
+ }
19619
+ return "";
19620
+ }
19591
19621
  render() {
19592
19622
  return (this.theOptions
19593
19623
  ?
@@ -19595,7 +19625,7 @@ const HierarchizedPickerComponent = class {
19595
19625
  ?
19596
19626
  h("div", { class: "hierarchized-picker-container" }, h("div", { style: { display: "none" }, ref: (el => {
19597
19627
  this.loader = el;
19598
- }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.theOptions.label) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19628
+ }) }), h("div", { class: "hierarchized-picker-input-area" }, this.theOptions.label ? h("label", { class: "hierarchized-picker-label" }, this.getLanguageValue(this.theOptions.label)) : '', h("span", { class: 'hierarchized-picker-input ' + (this.theOptions.icon && this.theOptions.icon.length > 0 ? "hierarchized-picker-icon" : "") +
19599
19629
  ' reneco ' + (this.theOptions.icon ? this.theOptions.icon : "") + (this.isDisabled ? " readonly " : "") +
19600
19630
  ' sc-ion-input-md-h sc-ion-input-md-s md ', id: 'hierarchized-picker-input-' + this.componentID, onClick: _event => {
19601
19631
  this.showTree("picker");
@@ -19619,7 +19649,7 @@ const HierarchizedPickerComponent = class {
19619
19649
  this.focusInSearchEvent(event);
19620
19650
  }, onFocusout: event => {
19621
19651
  this.focusOutSearchEvent(event);
19622
- } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.theOptions.searchPlaceholder, spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
19652
+ } }, h("input", { class: "native-input sc-ion-input-md", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-0", placeholder: this.getLanguageValue(this.theOptions.searchPlaceholder), spellcheck: "false", type: "text" })), h("ul", { id: "autocomplete-results-area" }), h("div", { id: 'tree-area-' + this.componentID, class: 'hierarchized-picker-tree hierarchized-picker-tree-area ' + this.pickerClass }))))
19623
19653
  :
19624
19654
  h("div", { class: 'hierarchized-picker-raw-tree-area' + (this.isDisabled ? " readonly" : ""), onClick: event => {
19625
19655
  this.clickPickerModalArea(event);