reneco-hierarchized-picker 0.4.3-beta.4 → 0.4.3-beta.5

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 (17) hide show
  1. package/dist/cjs/reneco-hierarchized-picker_2.cjs.entry.js +31 -7
  2. package/dist/collection/components/hierarchized-picker/hierarchized-picker.css +18 -17
  3. package/dist/collection/components/hierarchized-picker/hierarchized-picker.js +20 -3
  4. package/dist/collection/components/search-input/search-input.css +13 -17
  5. package/dist/collection/components/search-input/search-input.js +4 -2
  6. package/dist/collection/utils/constants.js +3 -0
  7. package/dist/collection/utils/theme-utils.js +2 -0
  8. package/dist/custom-elements/index.js +31 -7
  9. package/dist/esm/reneco-hierarchized-picker_2.entry.js +31 -7
  10. package/dist/esm-es5/reneco-hierarchized-picker_2.entry.js +2 -2
  11. package/dist/reneco-hierarchized-picker/{p-4c73096f.entry.js → p-452c37d2.entry.js} +1 -1
  12. package/dist/reneco-hierarchized-picker/p-73168a50.system.js +1 -1
  13. package/dist/reneco-hierarchized-picker/{p-69b953d4.system.entry.js → p-ce429605.system.entry.js} +2 -2
  14. package/dist/reneco-hierarchized-picker/reneco-hierarchized-picker.esm.js +1 -1
  15. package/dist/types/components/hierarchized-picker/hierarchized-picker.d.ts +3 -0
  16. package/dist/types/utils/constants.d.ts +3 -0
  17. package/package.json +1 -1
package/dist/esm/reneco-hierarchized-picker_2.entry.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { r as registerInstance, c as createEvent, h, g as getElement } from './index-ef964604.js';
2
2
 
3
3
  function applyPickerTheme(theme, defaultTheme) {
4
+ var _a;
4
5
  const docstyle = document.documentElement.style;
5
6
  docstyle.setProperty('--hpicker-theme-palette-primary-main', (theme === null || theme === void 0 ? void 0 : theme.palette.primary.main) || defaultTheme.palette.primary.main);
6
7
  docstyle.setProperty('--hpicker-theme-palette-primary-light', (theme === null || theme === void 0 ? void 0 : theme.palette.primary.light) || defaultTheme.palette.primary.light);
@@ -11,6 +12,7 @@ function applyPickerTheme(theme, defaultTheme) {
11
12
  docstyle.setProperty('--hpicker-theme-typography-body-font-size', (theme === null || theme === void 0 ? void 0 : theme.typography.body.fontSize) || defaultTheme.typography.body.fontSize);
12
13
  docstyle.setProperty('--hpicker-theme-typography-body-font-weight', (theme === null || theme === void 0 ? void 0 : theme.typography.body.fontWeight) || defaultTheme.typography.body.fontWeight);
13
14
  docstyle.setProperty('--hpicker-theme-palette-font-color', (theme === null || theme === void 0 ? void 0 : theme.palette.text.primary) || defaultTheme.palette.text.primary);
15
+ docstyle.setProperty('--hpicker-theme-modal-height', ((_a = theme === null || theme === void 0 ? void 0 : theme.modale) === null || _a === void 0 ? void 0 : _a.height) || defaultTheme.modale.height);
14
16
  }
15
17
 
16
18
  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -18102,6 +18104,9 @@ const defaultPickerTheme = {
18102
18104
  fontWeight: '400',
18103
18105
  },
18104
18106
  },
18107
+ modale: {
18108
+ height: "200px",
18109
+ }
18105
18110
  };
18106
18111
  // const defaultPickerTheme = {
18107
18112
  // palette: {
@@ -18694,7 +18699,7 @@ function setupKeyboardNavigation(component) {
18694
18699
  focusNode(focusedNodeIndex);
18695
18700
  }
18696
18701
 
18697
- 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(--hpicker-theme-typography-tree-font-size, 14px) !important;font-weight:var(--hpicker-theme-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 var(--hpicker-theme-palette-font-color)}reneco-hierarchized-picker .treejs-node__checked>.treejs-switcher:before{border-top:4px solid var(--hpicker-theme-palette-primary-contrastText) !important}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{background-color:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, #e8a86c))}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:var(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, #e8a86c));display:inline;opacity:.9;padding:11px 0px;display:block}reneco-hierarchized-picker .treejs .dragover{background:var(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, #e8a86c))}reneco-hierarchized-picker .treejs .dragover-over::after{content:\"\";display:block;width:2px;height:100%;position:absolute;top:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}reneco-hierarchized-picker .treejs .dragover-before::after{content:\"\";display:block;height:2px;width:100%;position:absolute;top:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}reneco-hierarchized-picker .treejs .dragover-after::after{content:\"\";display:block;height:2px;width:100%;position:absolute;bottom:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}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;background-color:var(--hpicker-theme-palette-background-dark)}reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){margin:0 !important;padding-left:15px !important;background-color:var(--hpicker-theme-palette-background-dark, var(--mui-palette-background-dark, 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(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, var(--ion-color-light, #FAFAFA)))}reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, #e8a86c));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(--hpicker-theme-palette-primary-light) !important;color:var(--hpicker-theme-palette-primary-ContrastText, var(--mui-palette-primary-ContrastText, var(--ion-color-primary-contrast, #000)))!important}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:var(--hpicker-theme-palette-font-color, var(--mui-palette-font-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-tree-area{width:333px !important;padding-top:48px}reneco-hierarchized-picker .hierarchized-picker-modal-area{background-color:var(--hpicker-theme-palette-background-dark, var(--mui-palette-background-dark, 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(--hpicker-theme-palette-font-color, var(--mui-palette-font-color, 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(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #d58433))) !important;border-color:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #d58433))) !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}reneco-hierarchized-picker input[title]{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.hierarchized-picker-raw-tree-area.readonly li.treejs-node .treejs-switcher{pointer-events:all}::-webkit-scrollbar-thumb{background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #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(--hpicker-theme-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}";
18702
+ 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(--hpicker-theme-typography-tree-font-size, 14px) !important;font-weight:var(--hpicker-theme-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 var(--hpicker-theme-palette-font-color)}reneco-hierarchized-picker .treejs-node__checked>.treejs-switcher:before{border-top:4px solid var(--hpicker-theme-palette-primary-contrastText) !important}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{background-color:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, #e8a86c))}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:var(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, #e8a86c));display:inline;opacity:.9;padding:11px 0px;display:block}reneco-hierarchized-picker .treejs .dragover{background:var(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, #e8a86c))}reneco-hierarchized-picker .treejs .dragover-over::after{content:\"\";display:block;width:2px;height:100%;position:absolute;top:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}reneco-hierarchized-picker .treejs .dragover-before::after{content:\"\";display:block;height:2px;width:100%;position:absolute;top:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}reneco-hierarchized-picker .treejs .dragover-after::after{content:\"\";display:block;height:2px;width:100%;position:absolute;bottom:0;left:0;background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, #d58433))}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;background-color:var(--hpicker-theme-palette-background-dark)}reneco-hierarchized-picker ul.treejs-nodes:not(:first-child){margin:0 !important;padding-left:15px !important;background-color:var(--hpicker-theme-palette-background-dark, var(--mui-palette-background-dark, 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(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, var(--ion-color-light, #FAFAFA)))}reneco-hierarchized-picker li:not(.treejs-node__close){background-color:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, #e8a86c));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(--hpicker-theme-palette-primary-light) !important;color:var(--hpicker-theme-palette-primary-ContrastText, var(--mui-palette-primary-ContrastText, var(--ion-color-primary-contrast, #000)))!important}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:var(--hpicker-theme-palette-font-color, var(--mui-palette-font-color, black))}reneco-hierarchized-picker .hierarchized-picker-container{position:relative;width:100%}reneco-hierarchized-picker .hierarchized-picker-input-area{background-color:transparent !important;display:-ms-flexbox;display:flex;width:100%;-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 input{width:100%}reneco-hierarchized-picker .hierarchized-picker-input.readonly{pointer-events:none;cursor:initial}reneco-hierarchized-picker .hierarchized-picker-label{position:stacked;margin-left:5px}reneco-hierarchized-picker .hierarchized-picker-tree-area{padding-top:10px}reneco-hierarchized-picker .hierarchized-picker-modal-area{position:absolute;width:100%;background-color:var(--hpicker-theme-palette-background-dark, var(--mui-palette-background-dark, var(--ion-color-light-tint, #FFF))) !important;z-index:10;overflow:scroll;top:20px;min-height:100px;max-height:var(--hpicker-theme-modal-height, \"200px\") !important;-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-area.display-modale-top{bottom:30px !important;top:unset !important}reneco-hierarchized-picker .hierarchized-picker-modal{padding:0px 15px}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:hover{cursor:pointer}reneco-hierarchized-picker .hierarchized-picker-input-area span.reneco-close{color:var(--ion-color-danger, red) !important;padding-left:10px}reneco-hierarchized-picker .treejs .treejs-switcher:before{border-top:4px solid var(--hpicker-theme-palette-font-color, var(--mui-palette-font-color, 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(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #d58433))) !important;border-color:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #d58433))) !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}reneco-hierarchized-picker input[title]{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.hierarchized-picker-raw-tree-area.readonly li.treejs-node .treejs-switcher{pointer-events:all}::-webkit-scrollbar-thumb{background:var(--hpicker-theme-palette-primary-main, var(--mui-palette-primary-main, var(--ion-color-primary, #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(--hpicker-theme-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}";
18698
18703
 
18699
18704
  const HierarchizedPickerComponent = class {
18700
18705
  /**
@@ -18878,6 +18883,8 @@ const HierarchizedPickerComponent = class {
18878
18883
  this.itemDropped = createEvent(this, "itemDropped", 7);
18879
18884
  this.itemContextMenuItemClick = createEvent(this, "itemContextMenuItemClick", 7);
18880
18885
  this.searchResult = createEvent(this, "searchResult", 7);
18886
+ this.modaleHeight = 200;
18887
+ this.modalePosition = 'bottom';
18881
18888
  this.canload = true; // Determines wether the component may be loaded
18882
18889
  this.ready = false; // State to determine if all the elements of the component have been loaded
18883
18890
  this.searchToDisplay = 0; // Counter to trigger the research on proper time
@@ -19081,7 +19088,9 @@ const HierarchizedPickerComponent = class {
19081
19088
  this.canload = result.toret;
19082
19089
  this.errorToLog = result.errorToLog;
19083
19090
  await this.initComponent();
19084
- applyPickerTheme(this.optionsManager.getOptions().theme, defaultPickerTheme);
19091
+ let defaultPickerThemeForInit = defaultPickerTheme;
19092
+ defaultPickerTheme.modale.height = this.modaleHeight + "px";
19093
+ applyPickerTheme(this.optionsManager.getOptions().theme, defaultPickerThemeForInit);
19085
19094
  // Displays option values
19086
19095
  this.mylog(this.optionsManager.getOptions());
19087
19096
  window.addEventListener('click', (evt) => {
@@ -19503,6 +19512,14 @@ const HierarchizedPickerComponent = class {
19503
19512
  const previousShownTree = this.shownTree;
19504
19513
  this.shownTree = this.hasFocus.length > 0;
19505
19514
  if (this.shownTree && !previousShownTree) {
19515
+ console.log("component value", document.querySelector('#hierarchized-picker-input-' + this.componentID));
19516
+ console.log("shouldOpenModalAbove", this.shouldOpenModalAbove(document.querySelector('#hierarchized-picker-input-' + this.componentID), this.modaleHeight));
19517
+ if (this.shouldOpenModalAbove(document.querySelector('#hierarchized-picker-input-' + this.componentID), this.modaleHeight)) {
19518
+ this.modalePosition = 'top';
19519
+ }
19520
+ else {
19521
+ this.modalePosition = 'bottom';
19522
+ }
19506
19523
  focusSearchInput(this);
19507
19524
  }
19508
19525
  }
@@ -19739,6 +19756,11 @@ const HierarchizedPickerComponent = class {
19739
19756
  .map(item => { var _a, _b; return (_b = (_a = this.getShortenedFullpath(item.fullpathTranslated)) !== null && _a !== void 0 ? _a : item.fullpath) !== null && _b !== void 0 ? _b : `Node ${item.nodeid}`; })
19740
19757
  .join('; ');
19741
19758
  }
19759
+ shouldOpenModalAbove(inputElement, modaleHeight) {
19760
+ const inputRect = inputElement.getBoundingClientRect();
19761
+ const spaceLeft = window.innerHeight - inputRect.y;
19762
+ return spaceLeft < modaleHeight;
19763
+ }
19742
19764
  render() {
19743
19765
  return this.optionsManager.getOptions() ? (h("div", { id: 'hierarchized-picker-' + this.componentID, class: 'hierarchized-picker ' + (this.isDisabled ? 'readonly-mode' : '') }, this.optionsManager.getOptions().mode == 'input' ? (h("div", { class: "hierarchized-picker-container" }, h("div", { style: { display: 'none' }, ref: el => {
19744
19766
  this.loader = el;
@@ -19754,11 +19776,11 @@ const HierarchizedPickerComponent = class {
19754
19776
  } }, h("input", { class: "native-input sc-ion-input-md", "aria-labelledby": "ion-input-13-lbl", autocapitalize: "off", autocomplete: "off", autocorrect: "off", name: "ion-input-13", placeholder: "", readonly: "", spellcheck: "false", type: "text", value: this.displayedValue, title: this.getFullpathTooltip() })), this.displayedValue && !this.isDisabled && this.canload ? h("span", { class: "reneco reneco-close", onClick: () => this.clearPicker() }) : ''), h("div", { ref: el => {
19755
19777
  // Uncomment if you want the modale of picker in input mode to scroll to selected node on openning >>>
19756
19778
  this.scrollable = el;
19757
- }, class: 'hierarchized-picker-modal-area ' + (!this.shownTree ? ' hidden ' : ''), onClick: event => {
19779
+ }, class: `hierarchized-picker-modal-area ${!this.shownTree ? ' hidden ' : ''} ${this.modalePosition == 'top' ? "display-modale-top" : ""}`, onClick: event => {
19758
19780
  clickPickerModalArea(this);
19759
19781
  } }, h("div", { class: "loader", ref: el => {
19760
19782
  this.loader = el;
19761
- } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: 'hierarchized-picker-modal ' + (!this.ready ? 'hidden' : '') }, 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' : ''), onClick: event => {
19783
+ } }, h("div", { class: "loader-inner" }, "Loading...")), h("div", { class: `hierarchized-picker-modal ${!this.ready ? 'hidden' : ''}` }, 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' : ''), onClick: event => {
19762
19784
  clickPickerModalArea(this);
19763
19785
  } }, h("div", { class: "loader", ref: el => {
19764
19786
  this.loader = el;
@@ -19778,7 +19800,7 @@ const HierarchizedPickerComponent = class {
19778
19800
  };
19779
19801
  HierarchizedPickerComponent.style = hierarchizedPickerCss;
19780
19802
 
19781
- const searchInputCss = ".search-input-container{width:100%;margin:0}.search-input{width:100%;border:none}.search-input:focus{border:none !important;outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .hierarchized-picker-input-area .input-wrapper{padding-left:10px !important}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(--hpicker-theme-typography-body-font-size, var(--mui-typography-body-font-size, 14px)) !important;font-weight:var(--hpicker-theme-typography-body-font-weight, var(--mui-typography-body-font-weight, 400)) !important}reneco-hierarchized-picker .hierarchized-picker-search input{width:90%;color:var(--hpicker-theme-palette-font-color, var(--mui-palette-font-color, var(--ion-color-light-tint, #fff))) !important}reneco-hierarchized-picker .hierarchized-picker-search{background-color:var(--hpicker-theme-palette-background-light, var(--mui-palette-background-light, var(--ion-color-medium-tint, #E0E0E0)));position:absolute !important;width:333px !important;margin-top:10px;border-radius:4px;padding:8.5px}reneco-hierarchized-picker #searchInTree{padding:8.5px 8px;background:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, var(--ion-color-background, 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}";
19803
+ const searchInputCss = ".search-input-container{display:-ms-flexbox;display:flex;gap:8px;margin-top:10px}.search-input-container .reneco-search{margin-top:3px}.search-input-container input{border-radius:4px;padding:5px}.search-input{width:100%;border:none}.search-input:focus{border:none !important;outline:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}reneco-hierarchized-picker .hierarchized-picker-input-area .input-wrapper{padding-left:10px !important}reneco-hierarchized-picker .hierarchized-picker-input input,reneco-hierarchized-picker .hierarchized-picker-search input{font-size:var(--hpicker-theme-typography-body-font-size, var(--mui-typography-body-font-size, 14px)) !important;font-weight:var(--hpicker-theme-typography-body-font-weight, var(--mui-typography-body-font-weight, 400)) !important}reneco-hierarchized-picker .hierarchized-picker-search input{color:var(--hpicker-theme-palette-font-color, var(--mui-palette-font-color, var(--ion-color-light-tint, #fff))) !important}reneco-hierarchized-picker #searchInTree{padding:8.5px 8px;background:var(--hpicker-theme-palette-background-default, var(--mui-palette-background-default, var(--ion-color-background, 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}";
19782
19804
 
19783
19805
  const SearchInput = class {
19784
19806
  constructor(hostRef) {
@@ -19814,9 +19836,11 @@ const SearchInput = class {
19814
19836
  }
19815
19837
  }
19816
19838
  render() {
19817
- return (h("div", { id: "hierarchized-picker-input-search-",
19839
+ return (h("div", { id: "hierarchized-picker-input-search",
19818
19840
  // TODO: need component ID ?
19819
- class: "search-input-container reneco reneco-search", ref: (el) => (this.rootElement = el) }, h("input", { ref: (el) => (this.inputElement = el), type: "text", class: "native-input search-input hierarchized-picker-search reneco reneco-search sc-ion-input-md-h sc-ion-input-md-s md", placeholder: this.placeholder, onFocus: () => this.handleFocus(), onBlur: (event) => this.handleBlur(event), onInput: (event) => this.handleInput(event) })));
19841
+ class: "search-input-container", ref: (el) => (this.rootElement = el) }, h("div", { class: "reneco reneco-search" }), h("input", { ref: (el) => (this.inputElement = el), type: "text", class: "native-input sc-ion-input-md-h sc-ion-input-md-s md search-input hierarchized-picker-search",
19842
+ //class="native-input search-input hierarchized-picker-search sc-ion-input-md-h sc-ion-input-md-s md"
19843
+ placeholder: this.placeholder, onFocus: () => this.handleFocus(), onBlur: (event) => this.handleBlur(event), onInput: (event) => this.handleInput(event) })));
19820
19844
  }
19821
19845
  };
19822
19846
  SearchInput.style = searchInputCss;