@genexus/genexus-ide-ui 0.0.99 → 0.0.100

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 (183) hide show
  1. package/dist/cjs/ch-icon_5.cjs.entry.js +3 -2
  2. package/dist/cjs/ch-icon_5.cjs.entry.js.map +1 -1
  3. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  4. package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js +2 -2
  5. package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js.map +1 -1
  6. package/dist/cjs/{gx-ide-recent-news.cjs.entry.js → gx-ide-empty-state_2.cjs.entry.js} +64 -2
  7. package/dist/cjs/gx-ide-empty-state_2.cjs.entry.js.map +1 -0
  8. package/dist/cjs/gx-ide-import-from-design.cjs.entry.js +2 -9
  9. package/dist/cjs/gx-ide-import-from-design.cjs.entry.js.map +1 -1
  10. package/dist/cjs/gx-ide-start-page.cjs.entry.js +9 -5
  11. package/dist/cjs/gx-ide-start-page.cjs.entry.js.map +1 -1
  12. package/dist/cjs/gx-ide-status-buttons_2.cjs.entry.js +41 -27
  13. package/dist/cjs/gx-ide-status-buttons_2.cjs.entry.js.map +1 -1
  14. package/dist/cjs/gxg-card_2.cjs.entry.js +10 -5
  15. package/dist/cjs/gxg-card_2.cjs.entry.js.map +1 -1
  16. package/dist/cjs/gxg-combo-box_2.cjs.entry.js +62 -24
  17. package/dist/cjs/gxg-combo-box_2.cjs.entry.js.map +1 -1
  18. package/dist/cjs/gxg-list-box_2.cjs.entry.js +28 -3
  19. package/dist/cjs/gxg-list-box_2.cjs.entry.js.map +1 -1
  20. package/dist/cjs/gxg-menu-item.cjs.entry.js +1 -1
  21. package/dist/cjs/gxg-menu-item.cjs.entry.js.map +1 -1
  22. package/dist/cjs/gxg-pill.cjs.entry.js +5 -5
  23. package/dist/cjs/gxg-pill.cjs.entry.js.map +1 -1
  24. package/dist/cjs/gxg-pills.cjs.entry.js +1 -1
  25. package/dist/cjs/gxg-pills.cjs.entry.js.map +1 -1
  26. package/dist/cjs/gxg-tab_4.cjs.entry.js +97 -17
  27. package/dist/cjs/gxg-tab_4.cjs.entry.js.map +1 -1
  28. package/dist/cjs/gxg-window-v2.cjs.entry.js +28 -0
  29. package/dist/cjs/gxg-window-v2.cjs.entry.js.map +1 -0
  30. package/dist/cjs/loader.cjs.js +1 -1
  31. package/dist/collection/collection-manifest.json +3 -1
  32. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.css +40 -0
  33. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js +180 -0
  34. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js.map +1 -0
  35. package/dist/collection/components/_helpers/list-selector/list-selector-item/list-selector-item.js +1 -1
  36. package/dist/collection/components/_helpers/list-selector/list-selector.js +1 -1
  37. package/dist/collection/components/dashboard-home/dashboard-home.css +5 -0
  38. package/dist/collection/components/dashboard-home/dashboard-home.js +1 -1
  39. package/dist/collection/components/dashboard-home/dashboard-home.js.map +1 -1
  40. package/dist/collection/components/import-from-design/import-from-design.js +3 -12
  41. package/dist/collection/components/import-from-design/import-from-design.js.map +1 -1
  42. package/dist/collection/components/start-page/recent-news.css +1 -1
  43. package/dist/collection/components/start-page/start-page.css +4 -0
  44. package/dist/collection/components/start-page/start-page.js +8 -4
  45. package/dist/collection/components/start-page/start-page.js.map +1 -1
  46. package/dist/components/card.js +11 -5
  47. package/dist/components/card.js.map +1 -1
  48. package/dist/components/combo-box.js +62 -24
  49. package/dist/components/combo-box.js.map +1 -1
  50. package/dist/components/gx-ide-dashboard-home.js +2 -2
  51. package/dist/components/gx-ide-dashboard-home.js.map +1 -1
  52. package/dist/components/gx-ide-empty-state.d.ts +11 -0
  53. package/dist/components/gx-ide-empty-state.js +8 -0
  54. package/dist/components/gx-ide-empty-state.js.map +1 -0
  55. package/dist/components/gx-ide-empty-state2.js +126 -0
  56. package/dist/components/gx-ide-empty-state2.js.map +1 -0
  57. package/dist/components/gx-ide-import-from-design.js +3 -11
  58. package/dist/components/gx-ide-import-from-design.js.map +1 -1
  59. package/dist/components/gx-ide-start-page.js +21 -11
  60. package/dist/components/gx-ide-start-page.js.map +1 -1
  61. package/dist/components/gxg-menu-item.js +1 -1
  62. package/dist/components/gxg-menu-item.js.map +1 -1
  63. package/dist/components/gxg-pills.js +1 -1
  64. package/dist/components/gxg-pills.js.map +1 -1
  65. package/dist/components/gxg-top-state-bar2.js +46 -30
  66. package/dist/components/gxg-top-state-bar2.js.map +1 -1
  67. package/dist/components/gxg-window-v2.js +44 -0
  68. package/dist/components/gxg-window-v2.js.map +1 -0
  69. package/dist/components/icon2.js +3 -2
  70. package/dist/components/icon2.js.map +1 -1
  71. package/dist/components/list-box.js +27 -1
  72. package/dist/components/list-box.js.map +1 -1
  73. package/dist/components/pill.js +5 -5
  74. package/dist/components/pill.js.map +1 -1
  75. package/dist/components/recent-news.js +1 -1
  76. package/dist/components/recent-news.js.map +1 -1
  77. package/dist/components/tab-bar.js +17 -9
  78. package/dist/components/tab-bar.js.map +1 -1
  79. package/dist/components/tab-button.js +11 -4
  80. package/dist/components/tab-button.js.map +1 -1
  81. package/dist/components/tab.js +6 -3
  82. package/dist/components/tab.js.map +1 -1
  83. package/dist/components/tabs.js +73 -4
  84. package/dist/components/tabs.js.map +1 -1
  85. package/dist/esm/ch-icon_5.entry.js +3 -2
  86. package/dist/esm/ch-icon_5.entry.js.map +1 -1
  87. package/dist/esm/genexus-ide-ui.js +1 -1
  88. package/dist/esm/gx-ide-dashboard-home.entry.js +2 -2
  89. package/dist/esm/gx-ide-dashboard-home.entry.js.map +1 -1
  90. package/dist/esm/{gx-ide-recent-news.entry.js → gx-ide-empty-state_2.entry.js} +64 -3
  91. package/dist/esm/gx-ide-empty-state_2.entry.js.map +1 -0
  92. package/dist/esm/gx-ide-import-from-design.entry.js +2 -9
  93. package/dist/esm/gx-ide-import-from-design.entry.js.map +1 -1
  94. package/dist/esm/gx-ide-start-page.entry.js +9 -5
  95. package/dist/esm/gx-ide-start-page.entry.js.map +1 -1
  96. package/dist/esm/gx-ide-status-buttons_2.entry.js +41 -27
  97. package/dist/esm/gx-ide-status-buttons_2.entry.js.map +1 -1
  98. package/dist/esm/gxg-card_2.entry.js +10 -5
  99. package/dist/esm/gxg-card_2.entry.js.map +1 -1
  100. package/dist/esm/gxg-combo-box_2.entry.js +62 -24
  101. package/dist/esm/gxg-combo-box_2.entry.js.map +1 -1
  102. package/dist/esm/gxg-list-box_2.entry.js +27 -2
  103. package/dist/esm/gxg-list-box_2.entry.js.map +1 -1
  104. package/dist/esm/gxg-menu-item.entry.js +1 -1
  105. package/dist/esm/gxg-menu-item.entry.js.map +1 -1
  106. package/dist/esm/gxg-pill.entry.js +5 -5
  107. package/dist/esm/gxg-pill.entry.js.map +1 -1
  108. package/dist/esm/gxg-pills.entry.js +1 -1
  109. package/dist/esm/gxg-pills.entry.js.map +1 -1
  110. package/dist/esm/gxg-tab_4.entry.js +97 -17
  111. package/dist/esm/gxg-tab_4.entry.js.map +1 -1
  112. package/dist/esm/gxg-window-v2.entry.js +24 -0
  113. package/dist/esm/gxg-window-v2.entry.js.map +1 -0
  114. package/dist/esm/loader.js +1 -1
  115. package/dist/genexus-ide-ui/genexus-ide-ui.css +74 -7
  116. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  117. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js.map +1 -1
  118. package/dist/genexus-ide-ui/icon-assets/mercury/tests/balanza-path.svg +3 -0
  119. package/dist/genexus-ide-ui/icon-assets/mercury/tests/balanza-stroke.svg +9 -0
  120. package/dist/genexus-ide-ui/icon-assets/mercury/tests/folder-2.svg +3 -0
  121. package/dist/genexus-ide-ui/{p-b8fc93f4.entry.js → p-2c8afaa6.entry.js} +147 -112
  122. package/dist/genexus-ide-ui/p-2c8afaa6.entry.js.map +1 -0
  123. package/dist/genexus-ide-ui/{p-5ca84a03.entry.js → p-4e155cd5.entry.js} +27 -4
  124. package/dist/genexus-ide-ui/p-4e155cd5.entry.js.map +1 -0
  125. package/dist/genexus-ide-ui/p-4fc6d6a7.entry.js +24 -0
  126. package/dist/genexus-ide-ui/p-4fc6d6a7.entry.js.map +1 -0
  127. package/dist/genexus-ide-ui/p-54e4b362.entry.js +270 -0
  128. package/dist/genexus-ide-ui/p-54e4b362.entry.js.map +1 -0
  129. package/dist/genexus-ide-ui/{p-73aa4e69.entry.js → p-71f8aba2.entry.js} +13 -13
  130. package/dist/genexus-ide-ui/{p-73aa4e69.entry.js.map → p-71f8aba2.entry.js.map} +1 -1
  131. package/dist/genexus-ide-ui/{p-545291ad.entry.js → p-7dc3a137.entry.js} +4 -3
  132. package/dist/genexus-ide-ui/{p-545291ad.entry.js.map → p-7dc3a137.entry.js.map} +1 -1
  133. package/dist/genexus-ide-ui/{p-f186adfd.entry.js → p-85639fa5.entry.js} +100 -22
  134. package/dist/genexus-ide-ui/p-85639fa5.entry.js.map +1 -0
  135. package/dist/genexus-ide-ui/{p-30365c44.entry.js → p-a3e07b86.entry.js} +6 -7
  136. package/dist/genexus-ide-ui/p-a3e07b86.entry.js.map +1 -0
  137. package/dist/genexus-ide-ui/{p-9c6c5a61.entry.js → p-a592930e.entry.js} +37 -32
  138. package/dist/genexus-ide-ui/p-a592930e.entry.js.map +1 -0
  139. package/dist/genexus-ide-ui/p-b0e539fe.entry.js +41 -0
  140. package/dist/genexus-ide-ui/p-b0e539fe.entry.js.map +1 -0
  141. package/dist/genexus-ide-ui/{p-a439149b.entry.js → p-bff2603a.entry.js} +8 -3
  142. package/dist/genexus-ide-ui/p-bff2603a.entry.js.map +1 -0
  143. package/dist/genexus-ide-ui/{p-050bc199.entry.js → p-e0924e3f.entry.js} +96 -6
  144. package/dist/genexus-ide-ui/p-e0924e3f.entry.js.map +1 -0
  145. package/dist/genexus-ide-ui/{p-58cad79d.entry.js → p-e240361a.entry.js} +58 -68
  146. package/dist/genexus-ide-ui/p-e240361a.entry.js.map +1 -0
  147. package/dist/genexus-ide-ui/{p-e585f550.entry.js → p-e3925761.entry.js} +4 -5
  148. package/dist/genexus-ide-ui/{p-e585f550.entry.js.map → p-e3925761.entry.js.map} +1 -1
  149. package/dist/node_modules/@genexus/gemini/dist/collection/components/card/card.css +13 -1
  150. package/dist/node_modules/@genexus/gemini/dist/collection/components/pills/pill.css +16 -51
  151. package/dist/node_modules/@genexus/gemini/dist/collection/components/pills/pills.css +1 -8
  152. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab/tab.css +7 -0
  153. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.css +18 -0
  154. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.css +17 -0
  155. package/dist/node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.css +64 -13
  156. package/dist/node_modules/@genexus/gemini/dist/collection/components/top-state-bar/gxg-top-state-bar.css +120 -43
  157. package/dist/node_modules/@genexus/gemini/dist/collection/components/window-v2/window.css +3 -0
  158. package/dist/types/components/_helpers/empty-state/gx-ide-empty-state.d.ts +34 -0
  159. package/dist/types/components/import-from-design/import-from-design.d.ts +1 -3
  160. package/dist/types/components.d.ts +61 -0
  161. package/package.json +3 -3
  162. package/dist/cjs/gx-ide-recent-news.cjs.entry.js.map +0 -1
  163. package/dist/cjs/reposition-scroll-86d8fac5.js +0 -33
  164. package/dist/cjs/reposition-scroll-86d8fac5.js.map +0 -1
  165. package/dist/components/reposition-scroll.js +0 -31
  166. package/dist/components/reposition-scroll.js.map +0 -1
  167. package/dist/esm/gx-ide-recent-news.entry.js.map +0 -1
  168. package/dist/esm/reposition-scroll-cfff7017.js +0 -31
  169. package/dist/esm/reposition-scroll-cfff7017.js.map +0 -1
  170. package/dist/genexus-ide-ui/p-050bc199.entry.js.map +0 -1
  171. package/dist/genexus-ide-ui/p-30365c44.entry.js.map +0 -1
  172. package/dist/genexus-ide-ui/p-3e87257c.entry.js +0 -41
  173. package/dist/genexus-ide-ui/p-3e87257c.entry.js.map +0 -1
  174. package/dist/genexus-ide-ui/p-58cad79d.entry.js.map +0 -1
  175. package/dist/genexus-ide-ui/p-5ca84a03.entry.js.map +0 -1
  176. package/dist/genexus-ide-ui/p-9c6c5a61.entry.js.map +0 -1
  177. package/dist/genexus-ide-ui/p-a439149b.entry.js.map +0 -1
  178. package/dist/genexus-ide-ui/p-b8fc93f4.entry.js.map +0 -1
  179. package/dist/genexus-ide-ui/p-efa273d7.js +0 -27
  180. package/dist/genexus-ide-ui/p-efa273d7.js.map +0 -1
  181. package/dist/genexus-ide-ui/p-f186adfd.entry.js.map +0 -1
  182. package/dist/genexus-ide-ui/p-f5034221.entry.js +0 -258
  183. package/dist/genexus-ide-ui/p-f5034221.entry.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"names":["repositionScroll","scollableElementRef","activeItem","direction","scrollableElement","hasVerticalScrollbar","scrollHeight","clientHeight","scrollableElementScrollTop","scrollTop","KK","ARROW_UP","scrollableElementTop","getBoundingClientRect","top","selectedItemTop","offset","scrollTo","ARROW_DOWN","scrollableElementBottom","bottom","selectedItemBottom","console","log","listBoxCss","GxgListBox","constructor","hostRef","this","userUsedKeyboard","selectedItemsState","formMessageLogic","setIndexes","allItems","getAllItems","forEach","item","i","index","initialSetup","enabledItems","getEnabledItems","selectedItemsLength","selectItem","allowsEmpty","firstDeselectedItem","find","selected","singleSelection","selectedItems","getSelectedItemsFunc","selectedItem","currentActiveItem","getActiveItem","firstEnabledItem","active","disabled","disabledHandler","checkboxes","checkbox","handleKeyDown","e","ctrlKey","cmdKey","metaKey","shiftKey","code","preventDefault","handleArrow","unselectHighlightedItems","clearSelectedItems","selectItems","clearHighlightedItems","checked","highlightAll","newElement","activeElement","getNextItem","getPrevItem","unhighlightAll","setActiveItem","highlightItem","main","setSiblingSelected","async","length","siblingIsSelected","getIndexByElement","el","element","evaluateSelectedItems","selectedItemsArray","selectedItemsArrayFullInfo","getSelectedItems","then","result","push","value","arraysDiffer","JSON","stringify","updateSelectedItems","allItemsArray","querySelectorAll","theTitle","undefined","emitEmptySelection","keyboardSuggestions","checkCheckbox","uncheckCheckbox","disableSuggestions","noBorder","borderTop","borderEnd","borderBottom","borderStart","checkedItems","hideKeyboardSuggestions","headerHeight","required","validationStatus","validationMessage","informationMessage","selectedItemsInformation","textContent","componentDidRender","header","componentDidLoad","checkboxClickedHandler","containerEl","focus","itemLoadedHandler","itemClickedHandler","event","clickedItem","unselectItems","fromIndex","toIndex","activeItemIndex","selectMultipleItems","unhighlightItem","toggleItem","selectedItemsHandler","newArray","selectionChanged","emit","items","checkedItemsHandler","checkedChanged","disabledItems","getDisabledItems","hideKeyboardSuggestionsHandler","newValue","oldValue","localStorage","setItem","itemSelectedHandler","checkboxStateChangedHandler","checkedItemEl","detail","checkedItem","checkedItemValue","checkedItemsArray","enabledItem","getItem","ignoreHighlighted","actualSelectedItems","doNotActivate","highlighted","ignoreActiveItem","toggleHighlightedItems","highlightedItems","getHighlightedItems","selectHighlightedItems","spacePressed","highlightedItemsArray","getHighlightedItemsLength","highlightedItemsLength","getItemByIndex","itemByIndex","currentActive","enabledActiveItemIndex","findIndex","Array","isArray","unselected","clearActiveItem","enabledItemsArray","disabledItemsArray","setCheckboxState","check","changed","getFirstEnabledItem","getFirstSelectedItem","comparator","fromIndexCopy","renderKeyboardSuggestions","Object","keys","itemsArray","key","listItem","h","class","type","icon","onClick","render","Host","large","state","formClasses","commonClassesNames","onKeyDown","container","tabindex","ref","style","height","listBoxItemCss","GxgListboxItem","parts","handleCheckboxClick","checkboxClicked","stopPropagation","target","attachExportParts","part","getAttribute","exportPartsResult","exportParts","exportparts","emitCheckboxChange","mouseOver","watchPropHandler","itemSelected","checkedChangedHandler","checkboxChangedHandler","checkboxStateChanged","iconColor","componentWillLoad","itemLoaded","itemClickedFunc","itemClicked","onMouseOver","onMouseOut","bind","color","size"],"sources":["node_modules/@genexus/gemini/dist/collection/common/reposition-scroll.js","node_modules/@genexus/gemini/dist/collection/components/list-box/list-box.css?tag=gxg-list-box&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/list-box/list-box.js","node_modules/@genexus/gemini/dist/collection/components/list-box-item/list-box-item.css?tag=gxg-list-box-item&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/list-box-item/list-box-item.js"],"sourcesContent":["import { KeyboardKeys as KK } from \"./types\";\nexport const repositionScroll = (scollableElementRef, activeItem, direction) => {\n const scrollableElement = scollableElementRef;\n const hasVerticalScrollbar = scrollableElement?.scrollHeight > scrollableElement?.clientHeight;\n if (hasVerticalScrollbar && activeItem) {\n const scrollableElementScrollTop = scrollableElement.scrollTop;\n if (direction === KK.ARROW_UP) {\n const scrollableElementTop = scrollableElement.getBoundingClientRect().top;\n const selectedItemTop = activeItem.getBoundingClientRect().top;\n if (selectedItemTop < scrollableElementTop) {\n const offset = scrollableElementTop - selectedItemTop;\n scrollableElement.scrollTo(0, scrollableElementScrollTop - offset);\n }\n }\n else if (direction === KK.ARROW_DOWN) {\n const scrollableElementBottom = scrollableElement.getBoundingClientRect().bottom;\n const selectedItemBottom = activeItem.getBoundingClientRect().bottom;\n if (selectedItemBottom > scrollableElementBottom) {\n console.log(\"selectedItemBottom\", selectedItemBottom);\n console.log(\"scrollableElementBottom\", scrollableElementBottom);\n const offset = selectedItemBottom - scrollableElementBottom;\n scrollableElement.scrollTo(0, scrollableElementScrollTop + offset);\n }\n }\n }\n};\n//# sourceMappingURL=reposition-scroll.js.map\n",":host(.gxg--disabled) .form-element,\n:host(.gxg--disabled.form-element) {\n pointer-events: none;\n background-color: var(--ds-background-color-disabled) !important;\n color: var(--ds-color--disabled) !important;\n border-color: var(--ds-border-color-disabled) !important;\n cursor: default !important;\n}\n\n:root {\n --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n font-style: italic;\n}\n\n.gxg-quote--negative {\n color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n}\n.gxg-link:hover {\n color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--error);\n display: inline-block;\n}\n\n.gxg-alert-warning {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--warning);\n display: inline-block;\n}\n\n.gxg-alert-success {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--success);\n display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--gxg-label-font-weight);\n font-size: var(--gxg-label-font-size);\n color: var(--gxg-label-color);\n text-align: center;\n line-height: 1.455em;\n display: flex;\n align-items: center;\n}\n.gxg-label:hover {\n color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n color: var(--color-primary-active);\n}\n.gxg-label:active {\n color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n/*Warning*/\n:host(.gxg-validation--warning) .form-element {\n border-color: var(--ds-border-color--warning);\n}\n:host(.gxg-validation--warning) .form-element:focus {\n outline-color: var(--ds-border-color--warning);\n border-color: var(--ds-border-color--warning);\n}\n:host(.gxg-validation--warning) .form-element:focus + .checkmark {\n --checkmark-border-color: var(--ds-border-color--warning);\n}\n\n/*Error*/\n:host(.gxg-validation--error) .form-element {\n border-color: var(--ds-border-color--error);\n}\n:host(.gxg-validation--error) .form-element:focus {\n outline-color: var(--ds-border-color--error);\n border-color: var(--ds-border-color--error);\n}\n:host(.gxg-validation--error) .form-element:focus + .checkmark {\n --checkmark-border-color: var(--ds-border-color--error);\n}\n\n/*Success*/\n:host(.gxg-validation--success) .form-element {\n border-color: var(--ds-border-color--success);\n}\n:host(.gxg-validation--success) .form-element:focus {\n outline-color: var(--ds-border-color--success);\n border-color: var(--ds-border-color--success);\n}\n:host(.gxg-validation--success) .form-element:focus + .checkmark {\n --checkmark-border-color: var(--ds-border-color--success);\n}\n\n/*Tooltip*/\n.tooltip-outer-wrapper {\n display: grid;\n grid-template-columns: 0fr;\n transition: grid-template-columns var(--timing-02);\n}\n\n:host(.tooltip--visible) .tooltip-outer-wrapper {\n grid-template-columns: 1fr;\n}\n\n.tooltip-inner-wrapper {\n --margin-inline-start: 6px;\n overflow: hidden;\n transition: 150ms width;\n width: 0;\n}\n.tooltip-inner-wrapper gxg-icon {\n display: flex;\n position: relative !important;\n top: 0 !important;\n transform: none !important;\n margin-inline-start: var(--margin-inline-start);\n box-sizing: border-box;\n}\n.tooltip-inner-wrapper--visible {\n width: calc(var(--ds-icon-size-box--small) + var(--margin-inline-start));\n}\n.tooltip-inner-wrapper--hidden {\n display: none;\n}\n\n:host {\n display: block;\n font-size: var(--ds-base-font-size);\n font-family: var(--ds-base-font-family-primary);\n background-color: var(--ds-base-background-color);\n color: var(--ds-base-font-color);\n height: 100%;\n}\n:host .container {\n height: 100%;\n border: var(--gxg-list-box-container__border);\n border-radius: var(--gxg-list-box-general__border-radius);\n overflow: hidden;\n box-sizing: border-box;\n}\n:host .header {\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n background-color: var(--gxg-list-box-header__background-color);\n border-bottom: var(--ds-border-common-styles);\n padding: var(--gxg-list-box-header__padding);\n text-transform: capitalize;\n font-size: inherit;\n font-weight: var(--gxg-list-box-header__font-weight);\n color: var(--gxg-list-box-header__color);\n}\n:host .icon {\n margin-inline-end: var(--spacing-comp-01);\n}\n:host .checkbox {\n margin-inline-end: var(--spacing-comp-01);\n}\n\n.main {\n overflow-y: auto;\n /* Track */\n /* Handle */\n /* Handle on hover */\n padding: var(--gxg-list-box-main__padding);\n box-sizing: border-box;\n}\n.main::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n.main::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.main::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.main::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.main::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n.main--no-border {\n border: none;\n}\n\n.container:focus-within {\n outline: none;\n}\n\n.container:not(:focus-within) {\n --ds-border-color-control--focused: transparent;\n --ds-border-color--focused: transparent;\n --ds-focus-border-color: transparent;\n}\n\n:host([no-border]) .container {\n border: none;\n}\n\n/*SUGGESTION LIST*/\n.suggestions__container {\n background-color: var(--gxg-list-box-suggestions-container__background-color);\n color: var(--gxg-list-box-suggestions-container__color);\n font-family: inherit;\n font-size: var(--gxg-list-box-suggestions-container__font-size);\n padding: var(--gxg-list-box-suggestions-container__padding);\n display: flex;\n gap: var(--gxg-list-box-suggestions-container__gap);\n align-items: center;\n}\n.suggestions__list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n flex-grow: 1;\n}\n\n/*BORDERS*/\n:host([no-border]) .container {\n border: none;\n}\n\n:host([border-top]) .container {\n border-top: 1px solid var(--ds-border-color--regular);\n}\n\n:host([border-end]) .container {\n border-inline-end: 1px solid var(--ds-border-color--regular);\n}\n\n:host([border-bottom]) .container {\n border-bottom: 1px solid var(--ds-border-color--regular);\n}\n\n:host([border-start]) .container {\n border-inline-start: 1px solid var(--ds-border-color--regular);\n}\n\n/*Disabled*/\n:host(.gxg--disabled) .header {\n color: var(--ds-color--disabled);\n border-bottom-color: var(--ds-border-color-disabled);\n}\n\n/*********************************************\nVALIDATION\n**********************************************/\n.messages-wrapper {\n margin-top: var(--spacing-comp-02);\n display: flex;\n gap: var(--spacing-comp-01);\n flex-direction: column;\n}","import { Host, h } from \"@stencil/core\";\nimport { formMessageLogic } from \"../../common/form\";\nimport { formClasses } from \"../../common/classesNames\";\nimport { commonClassesNames } from \"../../common/classesNames\";\nimport { repositionScroll } from \"../../common/reposition-scroll\";\nimport state from \"../store\";\nexport class GxgListBox {\n constructor() {\n this.theTitle = undefined;\n this.checkboxes = false;\n this.singleSelection = false;\n this.allowsEmpty = false;\n this.emitEmptySelection = false;\n this.keyboardSuggestions = {\n checkCheckbox: \"to check a checkbox press (shift + space)\",\n uncheckCheckbox: \"to uncheck a checkbox press (shift + ctrl + space)\"\n };\n this.disableSuggestions = false;\n this.noBorder = false;\n this.borderTop = false;\n this.borderEnd = false;\n this.borderBottom = false;\n this.borderStart = false;\n this.selectedItems = [];\n this.checkedItems = [];\n this.hideKeyboardSuggestions = true;\n this.headerHeight = 0;\n this.disabled = false;\n this.required = false;\n this.validationStatus = \"indeterminate\";\n this.validationMessage = undefined;\n this.informationMessage = undefined;\n }\n /**\n * This event emits the items that are currently selected. event.detail contains the selected items as objects. Each object contains the item idex and the item value. If value was not provided, the value will be the item innerText.\n */\n selectionChanged;\n checkedChanged;\n el;\n header;\n main;\n containerEl;\n /**\n * This is needed to evaluate if keyboard suggestions should be displayed.\n */\n userUsedKeyboard = false;\n activeItem;\n selectedItemsState = [];\n /*VALIDATION*/\n formMessageLogic = formMessageLogic;\n /*********************************\n METHODS\n *********************************/\n async getSelectedItems() {\n const selectedItems = this.getSelectedItemsFunc();\n const selectedItemsInformation = [];\n selectedItems.forEach(selectedItem => {\n selectedItemsInformation.push({\n active: selectedItem.active,\n selected: selectedItem.selected,\n checked: selectedItem.checked,\n index: selectedItem.index,\n value: selectedItem.value || selectedItem.textContent\n });\n });\n return selectedItemsInformation;\n }\n componentDidRender() {\n if (this.theTitle) {\n this.headerHeight = this.header.clientHeight;\n }\n }\n componentDidLoad() {\n //this.setInitialActive();\n }\n setIndexes = () => {\n const allItems = this.getAllItems();\n allItems.forEach((item, i) => {\n item.index = i;\n });\n };\n initialSetup = () => {\n const enabledItems = this.getEnabledItems();\n const selectedItemsLength = this.selectedItemsLength();\n //1. Select item if allowsEmpty is false and no item is currently selected\n const selectItem = !this.allowsEmpty && selectedItemsLength === 0;\n if (selectItem) {\n const firstDeselectedItem = enabledItems.find(item => {\n return !item.selected;\n });\n firstDeselectedItem && (firstDeselectedItem.selected = true);\n }\n else if (this.singleSelection && selectedItemsLength > 1) {\n //Only one item can be selected. Unselect every selected items, except the first one.\n const selectedItems = this.getSelectedItemsFunc();\n selectedItems.forEach((selectedItem, i) => {\n if (i !== 0) {\n selectedItem.selected = false;\n }\n });\n }\n //2. Set active item, if not active item exists yet\n const currentActiveItem = this.getActiveItem();\n if (!currentActiveItem) {\n const firstEnabledItem = this.getEnabledItems()[0];\n if (firstEnabledItem) {\n firstEnabledItem.active = true;\n this.activeItem = firstEnabledItem;\n }\n }\n //3. Set index on every item\n this.setIndexes();\n //4. disable items\n if (this.disabled) {\n this.disabledHandler(true);\n }\n //5. set checkboxes\n if (this.checkboxes) {\n const allItems = this.getAllItems();\n allItems.forEach(item => {\n item.checkbox = true;\n });\n }\n };\n checkboxClickedHandler() {\n this.containerEl.focus();\n }\n itemLoadedHandler() {\n this.initialSetup();\n this.updateSelectedItems();\n }\n itemClickedHandler(event) {\n const { clickedItem, ctrlKey, cmdKey, shiftKey, index } = event[\"detail\"];\n if (this.singleSelection) {\n this.setActiveItem(clickedItem);\n }\n this.containerEl.focus();\n //this.clearActiveItem();\n if (this.singleSelection) {\n if (clickedItem.selected &&\n !this.allowsEmpty) {\n /*same item. do nothing.*/\n return;\n }\n if (this.allowsEmpty && (ctrlKey || cmdKey)) {\n this.unselectItems(clickedItem);\n }\n else {\n this.clearHighlightedItems();\n this.clearSelectedItems();\n this.selectItems(clickedItem);\n this.highlightItem(clickedItem);\n }\n }\n else {\n /*multiple-selection allowed*/\n if (shiftKey || (!cmdKey && !cmdKey)) {\n this.clearHighlightedItems();\n this.clearSelectedItems();\n }\n if (shiftKey) {\n if (this.activeItem === clickedItem)\n return;\n let fromIndex;\n const toIndex = index;\n if (this.activeItem) {\n const activeItemIndex = this.getIndexByElement(this.activeItem);\n if (index === activeItemIndex) {\n return;\n }\n fromIndex = activeItemIndex;\n }\n else {\n fromIndex = 0;\n }\n this.selectMultipleItems(fromIndex, toIndex);\n }\n else if (ctrlKey || cmdKey) {\n if (!this.allowsEmpty &&\n this.selectedItemsLength() === 1 &&\n clickedItem.selected) {\n return;\n }\n this.unhighlightItem(this.activeItem);\n this.toggleItem(clickedItem);\n this.highlightItem(clickedItem);\n }\n else {\n this.selectItems(clickedItem);\n this.highlightItem(clickedItem);\n }\n }\n this.setActiveItem(clickedItem);\n this.evaluateSelectedItems();\n }\n selectedItemsHandler(newArray) {\n this.selectionChanged.emit({ items: newArray });\n }\n checkedItemsHandler(newArray) {\n this.checkedChanged.emit(newArray);\n }\n disabledHandler(disabled) {\n if (disabled) {\n const enabledItems = this.getEnabledItems();\n enabledItems?.forEach(item => {\n item.disabled = true;\n });\n }\n else {\n const disabledItems = this.getDisabledItems();\n disabledItems?.forEach(item => {\n item.disabled = false;\n });\n }\n }\n hideKeyboardSuggestionsHandler(newValue, oldValue) {\n newValue === true &&\n oldValue === false &&\n localStorage.setItem(\"gxg-list-box-hide-keyboard-suggestions\", \"true\");\n }\n itemSelectedHandler() {\n this.setSiblingSelected();\n }\n checkboxStateChangedHandler(e) {\n const checkedItemEl = e.detail.checkedItem;\n const checkedItemValue = e.detail.checked;\n /*Update checkboxes array*/\n const checkedItemsArray = [];\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n enabledItems.forEach(enabledItem => {\n let item;\n if (enabledItem === checkedItemEl) {\n item = checkedItemEl;\n }\n else {\n item = enabledItem;\n }\n const checked = enabledItem === checkedItemEl ? checkedItemValue : item.checked;\n if (item && checked) {\n checkedItemsArray.push({\n active: item.active,\n selected: item.selected,\n checked: checked,\n index: item.index,\n value: item.value || item.textContent\n });\n }\n });\n this.checkedItems = checkedItemsArray;\n }\n /*Local Storage*/\n const localStorageExists = localStorage.getItem(\"gxg-list-box-hide-keyboard-suggestions\");\n if (!localStorageExists &&\n !this.disableSuggestions &&\n this.userUsedKeyboard) {\n // this.hideKeyboardSuggestions = false;\n }\n }\n handleKeyDown = (e) => {\n this.userUsedKeyboard = true;\n const ctrlKey = e.ctrlKey;\n const cmdKey = e.metaKey;\n const shiftKey = e.shiftKey;\n //const activeItemIndex = this.getIndexByElement(this.activeItem);\n if (e.code === \"ArrowDown\" ||\n e.code === \"ArrowUp\" ||\n e.code === \"Space\" ||\n e.code === \"Backspace\" ||\n e.code === \"Delete\" ||\n e.code === \"KeyA\") {\n e.preventDefault();\n }\n if (e.code === \"ArrowDown\" || e.code === \"ArrowUp\") {\n this.handleArrow(e.code, shiftKey);\n }\n else if (e.code === \"Space\") {\n if (shiftKey && ctrlKey) {\n /*uncheck checkbox*/\n // const changedLength = this.setCheckboxState(\n // this.getHighlightedItems(),\n // false\n // );\n //changedLength > 0 && (this.hideKeyboardSuggestions = true);\n }\n else if (shiftKey && (!ctrlKey || !cmdKey)) {\n // const changedLength = this.setCheckboxState(\n // this.getHighlightedItems(),\n // true\n // );\n // changedLength > 0 && (this.hideKeyboardSuggestions = true);\n }\n else if (!shiftKey &&\n (ctrlKey || cmdKey) &&\n this.selectedItemsLength() >= 1) {\n this.unselectHighlightedItems(true);\n }\n else if (!ctrlKey && !cmdKey) {\n if (this.singleSelection) {\n if (this.activeItem === this.getSelectedItemsFunc()[0]) {\n return;\n }\n this.clearSelectedItems();\n this.selectItems(this.activeItem);\n }\n else {\n /*multi-select allowed*/\n if (ctrlKey || cmdKey) {\n this.clearHighlightedItems();\n }\n else {\n this.selectItems(this.activeItem);\n //this.selectHighlightedItems();\n }\n }\n }\n const selectedItems = this.getSelectedItemsFunc();\n if (!ctrlKey || !cmdKey) {\n selectedItems.forEach(item => {\n item.checked = true;\n });\n }\n else {\n selectedItems.forEach(item => {\n item.checked = false;\n });\n }\n }\n else if (e.code === \"KeyA\" &&\n (ctrlKey || cmdKey) &&\n !this.singleSelection) {\n /*highlight all*/\n this.highlightAll();\n }\n else if (e.code === \"Delete\" || e.code === \"Backspace\") {\n /*Deselect highlighted items*/\n this.unselectHighlightedItems();\n }\n //this.evaluateSelectedItems();\n };\n handleArrow = (direction, shiftKey) => {\n /*Get the next element*/\n let newElement;\n const activeElement = this.getActiveItem();\n newElement =\n direction === \"ArrowDown\"\n ? (newElement = this.getNextItem(activeElement))\n : (newElement = this.getPrevItem(activeElement));\n /*Handle*/\n if (newElement) {\n this.singleSelection &&\n !this.allowsEmpty &&\n newElement !== this.getSelectedItemsFunc()[0] &&\n this.clearSelectedItems();\n if (shiftKey && !this.singleSelection) {\n !this.activeItem.selected && this.selectItems(this.activeItem);\n !newElement.selected && this.selectItems(newElement);\n }\n this.unhighlightAll();\n this.setActiveItem(newElement);\n this.highlightItem(newElement);\n if (shiftKey && !this.singleSelection) {\n //this.selectItems(this.activeItem);\n }\n if ((this.singleSelection || (!this.singleSelection && shiftKey)) &&\n !newElement.selected &&\n !this.allowsEmpty) {\n this.selectItems(newElement);\n }\n else if (this.singleSelection) {\n }\n repositionScroll(this.main, newElement, direction);\n }\n };\n /* SELECTED */\n setSiblingSelected = async () => {\n const allItems = this.getAllItems();\n allItems.forEach((item, i) => {\n if (i === allItems.length - 1) {\n item.siblingIsSelected = false;\n }\n else {\n if (allItems[i + 1].selected) {\n item.siblingIsSelected = true;\n }\n else {\n item.siblingIsSelected = false;\n }\n }\n });\n };\n clearSelectedItems(ignoreHighlighted = false) {\n const actualSelectedItems = ignoreHighlighted\n ? this.el.querySelectorAll(\"gxg-list-box-item[selected]:not([highlighted])\")\n : this.el.querySelectorAll(\"gxg-list-box-item[selected]\");\n if (actualSelectedItems.length > 0) {\n actualSelectedItems.forEach(item => {\n this.unselectItems(item);\n });\n }\n }\n selectedItemsLength = () => {\n return this.getSelectedItemsFunc().length;\n };\n getSelectedItemsFunc() {\n const selectedItemsArray = [];\n const enabledItems = this.getAllItems();\n if (enabledItems?.length) {\n enabledItems.forEach(item => {\n item.selected && selectedItemsArray.push(item);\n });\n }\n return selectedItemsArray;\n }\n /* HIGHLIGHTED */\n highlightItem(item, doNotActivate = false) {\n if (item) {\n this.singleSelection && this.clearHighlightedItems();\n item.highlighted = true;\n !doNotActivate && (this.activeItem = item);\n }\n }\n unhighlightItem(item) {\n if (item) {\n item.highlighted = false;\n }\n }\n unhighlightAll(ignoreActiveItem = false) {\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n enabledItems.forEach(item => {\n ignoreActiveItem && item === this.activeItem\n ? null\n : (item.highlighted = false);\n });\n return enabledItems.length;\n }\n return 0;\n }\n toggleHighlightedItems() {\n const highlightedItems = this.getHighlightedItems();\n highlightedItems.forEach(item => {\n this.toggleItem(item);\n });\n }\n selectHighlightedItems() {\n const selectedItems = this.selectItems(this.getHighlightedItems());\n return selectedItems;\n }\n unselectHighlightedItems(spacePressed = false) {\n const length = this.unselectItems(this.getHighlightedItems(), spacePressed);\n return length;\n }\n clearHighlightedItems() {\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n enabledItems.forEach(item => {\n item.highlighted && this.unhighlightItem(item);\n });\n }\n }\n getHighlightedItems() {\n const highlightedItemsArray = [];\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n enabledItems.forEach(item => {\n item.highlighted && highlightedItemsArray.push(item);\n });\n }\n return highlightedItemsArray;\n }\n getHighlightedItemsLength() {\n return this.getHighlightedItems().length;\n }\n highlightAll() {\n let highlightedItemsLength = 0;\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n enabledItems.forEach(item => {\n this.highlightItem(item, true);\n highlightedItemsLength++;\n });\n }\n return highlightedItemsLength;\n }\n /* INDEX */\n getItemByIndex(index) {\n const enabledItems = this.getEnabledItems();\n let itemByIndex;\n if (enabledItems?.length) {\n itemByIndex = enabledItems.find(item => item.index === index);\n }\n return itemByIndex;\n }\n getIndexByElement = (el) => {\n let index;\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length) {\n const element = enabledItems.find(item => item === el);\n element && (index = element.index);\n }\n return index;\n };\n /* PREV/NEXT */\n getNextItem(currentActive) {\n const enabledItems = this.getEnabledItems();\n const enabledActiveItemIndex = enabledItems.findIndex(enabledItem => {\n return enabledItem === currentActive;\n });\n //If is the last item, do nothing\n if (enabledActiveItemIndex === enabledItems.length - 1) {\n return null;\n }\n else {\n return enabledItems[enabledActiveItemIndex + 1];\n }\n }\n getPrevItem(currentActive) {\n const enabledItems = this.getEnabledItems();\n const enabledActiveItemIndex = enabledItems.findIndex(enabledItem => {\n return enabledItem === currentActive;\n });\n //If is the first item, do nothing\n if (enabledActiveItemIndex === 0) {\n return null;\n }\n else {\n return enabledItems[enabledActiveItemIndex - 1];\n }\n }\n /* SELECTED */\n selectItems(items) {\n let selected = 0;\n if (items && Array.isArray(items) && items.length > 0) {\n items.forEach(item => {\n if (!item.selected && !item.disabled) {\n (item.selected = true) && selected++;\n }\n this.activeItem !== item && this.unhighlightItem(item);\n });\n }\n else if (items && !Array.isArray(items)) {\n if (!items.selected && !items.disabled) {\n (items.selected = true) && selected++;\n }\n this.activeItem !== items && this.unhighlightItem(items);\n }\n //this.updateSelectedItems();\n return selected;\n }\n unselectItems(items, spacePressed = false) {\n let unselected = 0;\n let selectedItemsLength = this.selectedItemsLength();\n if (items &&\n Array.isArray(items) &&\n items.length > 0 &&\n selectedItemsLength > 0) {\n items.forEach(item => {\n if (item.selected && !item.disabled) {\n if (this.allowsEmpty) {\n item.selected = false;\n unselected++;\n }\n else {\n /*al least one item has to stay selected*/\n if (selectedItemsLength > 1) {\n item.selected = false;\n unselected++;\n selectedItemsLength--;\n }\n }\n }\n this.activeItem !== item && this.unhighlightItem(item);\n if (spacePressed) {\n item.checked = false;\n }\n });\n }\n else if (items && !Array.isArray(items)) {\n if (items.selected && !items.disabled) {\n items.selected = false;\n if (spacePressed) {\n items.checked = false;\n }\n unselected++;\n }\n this.activeItem !== items && this.unhighlightItem(items);\n }\n //unselected > 0 && this.updateSelectedItems();\n return unselected;\n }\n toggleItem(item) {\n if (item?.selected) {\n this.unselectItems(item);\n }\n else {\n this.selectItems(item);\n }\n }\n evaluateSelectedItems = () => {\n const selectedItemsArray = [];\n const selectedItemsArrayFullInfo = [];\n const selectedItems = this.getSelectedItems();\n selectedItems.then(result => {\n result.forEach(item => {\n selectedItemsArray.push(item.value);\n selectedItemsArrayFullInfo.push({\n active: item.active,\n selected: item.selected,\n checked: item.checked,\n index: item.index,\n value: item.value\n });\n });\n const arraysDiffer = JSON.stringify(this.selectedItemsState) !==\n JSON.stringify(selectedItemsArray);\n if (arraysDiffer) {\n this.selectedItemsState = selectedItemsArray;\n this.selectedItems = [...selectedItemsArrayFullInfo];\n }\n });\n };\n updateSelectedItems = () => {\n const selectedItemsArray = [];\n const selectedItems = this.getSelectedItems();\n selectedItems.then(result => {\n result.forEach(item => {\n selectedItemsArray.push(item.value);\n });\n const arraysDiffer = JSON.stringify(this.selectedItemsState) !==\n JSON.stringify(selectedItemsArray);\n if (arraysDiffer) {\n this.selectedItemsState = selectedItemsArray;\n }\n });\n };\n /* ACTIVE */\n getActiveItem() {\n const enabledItems = this.getEnabledItems();\n return enabledItems.find(item => item.active);\n }\n setActiveItem(item) {\n if (item) {\n this.clearActiveItem(); /*Only one active item allowed at a time*/\n item.active = true;\n this.activeItem = item;\n return true;\n }\n return false;\n }\n clearActiveItem() {\n const activeItem = this.getActiveItem();\n if (activeItem) {\n activeItem.active = false;\n return true;\n }\n return false;\n }\n /* ENABLED */\n getEnabledItems() {\n const enabledItemsArray = [];\n const enabledItems = this.el.querySelectorAll(\"gxg-list-box-item\");\n enabledItems.forEach(item => {\n !item.disabled && enabledItemsArray.push(item);\n });\n return enabledItemsArray;\n }\n /* DISABLED*/\n getDisabledItems() {\n const disabledItemsArray = [];\n const allItems = this.el.querySelectorAll(\"gxg-list-box-item\");\n allItems.forEach(item => {\n item.disabled && disabledItemsArray.push(item);\n });\n return disabledItemsArray;\n }\n /* CHECKBOX */\n setCheckboxState(items, check = true) {\n if (items && Array.isArray(items) && items.length !== 0) {\n let changed = 0;\n items.forEach(item => {\n if (!item.checked && check) {\n item.checked = true;\n changed++;\n }\n else if (item.checked && !check) {\n item.checked = false;\n changed++;\n }\n });\n return changed;\n }\n else if (!(items && Array.isArray(items))) {\n const item = items;\n if (!item.checked && check) {\n item.checked = true;\n return 1;\n }\n else if (item.checked && !check) {\n item.checked = false;\n return 1;\n }\n }\n return 0;\n }\n /* OTHER */\n getAllItems = () => {\n const allItemsArray = [];\n const allItems = this.el.querySelectorAll(\"gxg-list-box-item\");\n if (allItems?.length) {\n allItems.forEach(item => {\n allItemsArray.push(item);\n });\n }\n return allItemsArray;\n };\n getFirstEnabledItem() {\n return this.getEnabledItems()[0] || null;\n }\n getFirstSelectedItem() {\n const enabledItems = this.getEnabledItems();\n if (enabledItems?.length && enabledItems[0].selected) {\n return enabledItems[0];\n }\n return undefined;\n }\n selectMultipleItems(fromIndex, toIndex) {\n let comparator = toIndex;\n const selectedItems = [];\n if (fromIndex === toIndex) {\n return;\n }\n else if (fromIndex > toIndex) {\n const fromIndexCopy = fromIndex;\n fromIndex = toIndex;\n toIndex = fromIndexCopy;\n comparator = fromIndex;\n }\n for (let i = fromIndex; i <= toIndex; i++) {\n const item = this.getItemByIndex(i);\n item && selectedItems.push(item);\n if (i === comparator) {\n this.highlightItem(item);\n }\n }\n if (selectedItems?.length > 0) {\n this.selectItems(selectedItems);\n }\n }\n renderKeyboardSuggestions() {\n if (Object.keys(this.keyboardSuggestions).length) {\n const itemsArray = [];\n for (const key in this.keyboardSuggestions) {\n const listItem = (h(\"li\", { class: \"suggestions-__list-item\" }, this.keyboardSuggestions[key]));\n itemsArray.push(listItem);\n }\n return (h(\"div\", { class: \"suggestions suggestions__container\" }, h(\"ul\", { class: \"suggestions__list\" }, itemsArray), h(\"gxg-button\", { class: \"suggestions__button\", type: \"secondary-icon-only\", icon: \"gemini-tools/close\", onClick: () => (this.hideKeyboardSuggestions = true) })));\n }\n }\n /* RENDER */\n render() {\n return (h(Host, { class: {\n large: state.large,\n \"has-title\": !!this.theTitle,\n [formClasses[\"VALIDATION_INDETERMINATE_CLASS\"]]: this.validationStatus === \"indeterminate\",\n [formClasses[\"VALIDATION_WARNING_CLASS\"]]: this.validationStatus === \"warning\",\n [formClasses[\"VALIDATION_ERROR_CLASS\"]]: this.validationStatus === \"error\",\n [formClasses[\"VALIDATION_SUCCESS_CLASS\"]]: this.validationStatus === \"success\",\n [commonClassesNames[\"DISABLED_CLASS\"]]: this.disabled\n }, onKeyDown: this.handleKeyDown }, h(\"div\", { class: { container: true, \"form-element\": true }, tabindex: this.disabled ? \"-1\" : \"0\", ref: el => (this.containerEl = el) }, this.theTitle ? (h(\"header\", { class: { header: true }, ref: el => (this.header = el) }, this.theTitle)) : null, !this.disableSuggestions && !this.hideKeyboardSuggestions\n ? this.renderKeyboardSuggestions()\n : null, h(\"main\", { class: {\n main: true\n }, style: {\n height: `calc(100% - ${this.headerHeight}px)`\n }, ref: el => (this.main = el) }, h(\"slot\", null))), formMessageLogic(this)));\n }\n static get is() { return \"gxg-list-box\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"list-box.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"list-box.css\"]\n };\n }\n static get properties() {\n return {\n \"theTitle\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The listbox title that appears on the header\"\n },\n \"attribute\": \"the-title\",\n \"reflect\": false\n },\n \"checkboxes\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute will display a checkbox for every item\"\n },\n \"attribute\": \"checkboxes\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"singleSelection\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute will deactivate multi-selection\"\n },\n \"attribute\": \"single-selection\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"allowsEmpty\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute allows the list-box to not have any list-box-item selected\"\n },\n \"attribute\": \"allows-empty\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"emitEmptySelection\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute prevents 'selectionChanged' event from being emitted if the selection is empty.\"\n },\n \"attribute\": \"emit-empty-selection\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"keyboardSuggestions\": {\n \"type\": \"unknown\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"KeyboardSuggestions\",\n \"resolved\": \"{ checkCheckbox: string; uncheckCheckbox: string; }\",\n \"references\": {\n \"KeyboardSuggestions\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/list-box/list-box.tsx\",\n \"id\": \"src/components/list-box/list-box.tsx::KeyboardSuggestions\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An object with suggestions about the possible keyboard combinations\"\n },\n \"defaultValue\": \"{\\n checkCheckbox: \\\"to check a checkbox press (shift + space)\\\",\\n uncheckCheckbox: \\\"to uncheck a checkbox press (shift + ctrl + space)\\\"\\n }\"\n },\n \"disableSuggestions\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Disable suggestions about keyboard combinations\"\n },\n \"attribute\": \"disable-suggestions\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"noBorder\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute disables the border all around\"\n },\n \"attribute\": \"no-border\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"borderTop\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute adds a border to the top\"\n },\n \"attribute\": \"border-top\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"borderEnd\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute adds a border to the end\"\n },\n \"attribute\": \"border-end\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"borderBottom\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute adds a border to the bottom\"\n },\n \"attribute\": \"border-bottom\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"borderStart\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute adds a border to the start\"\n },\n \"attribute\": \"border-start\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"disabled\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute makes the component disabled\"\n },\n \"attribute\": \"disabled\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"required\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Make the radio-buttons required\"\n },\n \"attribute\": \"required\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"validationStatus\": {\n \"type\": \"string\",\n \"mutable\": true,\n \"complexType\": {\n \"original\": \"ValidationStatus\",\n \"resolved\": \"\\\"error\\\" | \\\"indeterminate\\\" | \\\"success\\\" | \\\"warning\\\"\",\n \"references\": {\n \"ValidationStatus\": {\n \"location\": \"import\",\n \"path\": \"../../common/types\",\n \"id\": \"src/common/types.ts::ValidationStatus\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The validation status\"\n },\n \"attribute\": \"validation-status\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"indeterminate\\\"\"\n },\n \"validationMessage\": {\n \"type\": \"string\",\n \"mutable\": true,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The required message if this input is required and no value is provided (optional). If this is not provided, the default browser required message will show up\"\n },\n \"attribute\": \"validation-message\",\n \"reflect\": false\n },\n \"informationMessage\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An informative message to help the user filling the information\"\n },\n \"attribute\": \"information-message\",\n \"reflect\": false\n }\n };\n }\n static get states() {\n return {\n \"selectedItems\": {},\n \"checkedItems\": {},\n \"hideKeyboardSuggestions\": {},\n \"headerHeight\": {}\n };\n }\n static get events() {\n return [{\n \"method\": \"selectionChanged\",\n \"name\": \"selectionChanged\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This event emits the items that are currently selected. event.detail contains the selected items as objects. Each object contains the item idex and the item value. If value was not provided, the value will be the item innerText.\"\n },\n \"complexType\": {\n \"original\": \"SelectionChangedEvent\",\n \"resolved\": \"{ items: ItemsInformation[]; }\",\n \"references\": {\n \"SelectionChangedEvent\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/list-box/list-box.tsx\",\n \"id\": \"src/components/list-box/list-box.tsx::SelectionChangedEvent\"\n }\n }\n }\n }, {\n \"method\": \"checkedChanged\",\n \"name\": \"checkedChanged\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }];\n }\n static get methods() {\n return {\n \"getSelectedItems\": {\n \"complexType\": {\n \"signature\": \"() => Promise<ItemsInformation[]>\",\n \"parameters\": [],\n \"references\": {\n \"Promise\": {\n \"location\": \"global\",\n \"id\": \"global::Promise\"\n },\n \"ItemsInformation\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/list-box/list-box.tsx\",\n \"id\": \"src/components/list-box/list-box.tsx::ItemsInformation\"\n },\n \"HTMLGxgListBoxItemElement\": {\n \"location\": \"global\",\n \"id\": \"global::HTMLGxgListBoxItemElement\"\n }\n },\n \"return\": \"Promise<ItemsInformation[]>\"\n },\n \"docs\": {\n \"text\": \"*******************************\\nMETHODS\\n*******************************\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"selectedItems\",\n \"methodName\": \"selectedItemsHandler\"\n }, {\n \"propName\": \"checkedItems\",\n \"methodName\": \"checkedItemsHandler\"\n }, {\n \"propName\": \"disabled\",\n \"methodName\": \"disabledHandler\"\n }, {\n \"propName\": \"hideKeyboardSuggestions\",\n \"methodName\": \"hideKeyboardSuggestionsHandler\"\n }];\n }\n static get listeners() {\n return [{\n \"name\": \"checkboxClicked\",\n \"method\": \"checkboxClickedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }, {\n \"name\": \"itemLoaded\",\n \"method\": \"itemLoadedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }, {\n \"name\": \"itemClicked\",\n \"method\": \"itemClickedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }, {\n \"name\": \"itemSelected\",\n \"method\": \"itemSelectedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }, {\n \"name\": \"checkboxStateChanged\",\n \"method\": \"checkboxStateChangedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }];\n }\n}\n//# sourceMappingURL=list-box.js.map\n",":host(.gxg--disabled) .form-element,\n:host(.gxg--disabled.form-element) {\n pointer-events: none;\n background-color: var(--ds-background-color-disabled) !important;\n color: var(--ds-color--disabled) !important;\n border-color: var(--ds-border-color-disabled) !important;\n cursor: default !important;\n}\n\n:root {\n --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n font-style: italic;\n}\n\n.gxg-quote--negative {\n color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n}\n.gxg-link:hover {\n color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--error);\n display: inline-block;\n}\n\n.gxg-alert-warning {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--warning);\n display: inline-block;\n}\n\n.gxg-alert-success {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--success);\n display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--gxg-label-font-weight);\n font-size: var(--gxg-label-font-size);\n color: var(--gxg-label-color);\n text-align: center;\n line-height: 1.455em;\n display: flex;\n align-items: center;\n}\n.gxg-label:hover {\n color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n color: var(--color-primary-active);\n}\n.gxg-label:active {\n color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n:host {\n --ds-icon-size-box--regular: var(--gxg-list-box-item-icon__size-box--regular);\n --ds-icon-size--regular: var(--gxg-list-box-item-icon__size--regular);\n display: block;\n font-family: var(--ds-base-font-family-primary);\n font-size: inherit;\n color: inherit;\n display: flex;\n box-sizing: border-box;\n align-items: center;\n -moz-user-select: none;\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -o-user-select: none;\n outline: none;\n border-bottom: var(--gxg-list-box-item__border) !important;\n}\n:host .container {\n display: flex;\n align-items: center;\n padding: var(--gxg-list-box-item-container__padding);\n width: 100%;\n height: var(--ds-list-item-height--spaced);\n box-sizing: border-box;\n}\n:host .icon {\n margin-inline-end: var(--gxg-list-box-item-icon__margin-inline-end);\n flex-shrink: 0;\n}\n:host gxg-form-checkbox::part(box) {\n outline: none;\n}\n\n.checkbox {\n margin-inline-end: 8px;\n}\n\n:host(:not([disabled])) {\n cursor: pointer !important;\n}\n\n:host([disabled]) {\n pointer-events: none;\n border-bottom: transparent;\n color: var(--ds-color-on-disabled);\n}\n\n:host(:hover:not([selected])) {\n background-color: var(--gxg-list-box-item__background-color--hover);\n}\n\n:host(.has-icon.no-checkbox) .container {\n padding-inline-start: calc(var(--gxg-list-box-item-container-icon-no-checkbox__padding-inline-start) * 1.5);\n}\n\n.description {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n /* Adjust as needed */\n}\n\n/*HIGHLIGHTED*/\n/*ACTIVE*/\n:host([active]) {\n outline: var(--ds-focus-border-width) solid var(--ds-border-color-control--focused);\n outline-offset: -1px;\n outline-offset: 0;\n color: var(--ds-item-color--hover);\n outline-offset: var(--gxg-tree-view-item__outline-offset--active);\n}\n\n/*SELECTED*/\n:host([selected]:not(.gxg--disabled)) {\n background-color: var(--ds-item-background-color--selected);\n color: var(--gxg-grid-row-cell__color--selected);\n}\n\n:host([selected][sibling-is-selected]:not(.gxg--disabled)) {\n border-bottom-color: var(--ds-item-border-color--selected) !important;\n}\n\n:host([selected]:hover) {\n background-color: var(--ds-item-background-color--selected-hover);\n}\n\n:host:last-child {\n border-bottom: none;\n}","import { Host, h } from \"@stencil/core\";\nimport state from \"../store\";\nimport { commonClassesNames } from \"../../common/classesNames\";\nimport { exportParts } from \"../../common/export-parts\";\nexport class GxgListboxItem {\n constructor() {\n this.disabled = undefined;\n this.icon = undefined;\n this.selected = false;\n this.siblingIsSelected = false;\n this.highlighted = false;\n this.active = false;\n this.index = null;\n this.emitCheckboxChange = true;\n this.value = undefined;\n this.checkbox = false;\n this.checked = false;\n this.mouseOver = false;\n }\n parts = {\n checkbox: \"checkbox\"\n };\n exportparts;\n el;\n /**\n * (This event is for internal use.)\n */\n itemClicked;\n /**\n * (This event is for internal use.)\n */\n itemLoaded;\n /**\n * (This event is for internal use.)\n */\n itemSelected;\n /**\n * (This event is for internal use.)\n */\n checkboxStateChanged;\n /**\n * (This event is for internal use.)\n */\n checkboxClicked;\n watchPropHandler() {\n this.itemSelected.emit();\n }\n checkedChangedHandler(e) {\n this.checked = e;\n }\n checkboxChangedHandler(e) {\n const checked = e.detail.value;\n this.emitCheckboxChange &&\n this.checkboxStateChanged.emit({\n checkedItem: this.el,\n checked: checked\n });\n }\n handleCheckboxClick = (e) => {\n this.checkboxClicked.emit(this.el);\n e.stopPropagation();\n e.target.checked\n ? (this.checked = true)\n : (this.checked = false);\n };\n iconColor() {\n if (this.disabled) {\n return \"disabled\";\n }\n else if (this.selected) {\n return \"primary-enabled\";\n }\n else {\n return \"auto\";\n }\n }\n componentWillLoad() {\n this.attachExportParts();\n }\n attachExportParts = () => {\n const part = this.el.getAttribute(\"part\");\n const exportPartsResult = exportParts(part, this.parts);\n exportPartsResult.length && (this.exportparts = exportPartsResult);\n };\n componentDidLoad() {\n this.itemLoaded.emit({ value: this.value });\n }\n itemClickedFunc(e) {\n this.itemClicked.emit({\n clickedItem: this.el,\n ctrlKey: e.ctrlKey,\n cmdKey: e.metaKey,\n shiftKey: e.shiftKey,\n index: this.index\n });\n }\n onMouseOver() {\n this.mouseOver = true;\n }\n onMouseOut() {\n this.mouseOver = false;\n }\n render() {\n return (h(Host, { class: {\n \"has-icon\": this.icon !== undefined,\n \"no-checkbox\": !this.checkbox,\n large: state.large,\n [commonClassesNames[\"DISABLED_CLASS\"]]: this.disabled\n }, onClick: this.itemClickedFunc.bind(this),\n // onMouseOver={this.onMouseOver.bind(this)}\n // onMouseOut={this.onMouseOut.bind(this)}\n exportParts: this.exportparts ? this.exportparts : null }, h(\"div\", { class: { container: true, \"form-element\": true } }, this.checkbox && !this.disabled ? (h(\"gxg-form-checkbox\", { tabindex: \"-1\", checked: this.checked, onClick: this.handleCheckboxClick, disabled: this.disabled, part: this.parts.checkbox, class: \"checkbox\" })) : null, this.icon !== undefined ? (h(\"gxg-icon\", { class: \"icon\", color: this.iconColor(), size: \"regular\", type: this.icon })) : null, h(\"div\", { class: \"description\" }, h(\"slot\", null)))));\n }\n static get is() { return \"gxg-list-box-item\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"list-box-item.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"list-box-item.css\"]\n };\n }\n static get properties() {\n return {\n \"disabled\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute disabled the list-box-item\"\n },\n \"attribute\": \"disabled\",\n \"reflect\": true\n },\n \"icon\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Any icon that belongs to Gemini icon library: https://gx-gemini.netlify.app/?path=/story/icons\"\n },\n \"attribute\": \"icon\",\n \"reflect\": false,\n \"defaultValue\": \"undefined\"\n },\n \"selected\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute sets this item as selected\"\n },\n \"attribute\": \"selected\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"siblingIsSelected\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This property is for internal use\"\n },\n \"attribute\": \"sibling-is-selected\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"highlighted\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute sets this item as highlighted\"\n },\n \"attribute\": \"highlighted\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"active\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute sets this item as active (it is as if it was focused)\\nOnly one item at a time should be active.\"\n },\n \"attribute\": \"active\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"index\": {\n \"type\": \"number\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"number\",\n \"resolved\": \"number\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This property is set by the list-box item. It should not be set by the user.\"\n },\n \"attribute\": \"index\",\n \"reflect\": true,\n \"defaultValue\": \"null\"\n },\n \"emitCheckboxChange\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute emits the 'checkboxChanged' event every time a checkbox value is changed.\"\n },\n \"attribute\": \"emit-checkbox-change\",\n \"reflect\": false,\n \"defaultValue\": \"true\"\n },\n \"value\": {\n \"type\": \"any\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The item value. If value is not provided, the value will be the item innerHTML.\"\n },\n \"attribute\": \"value\",\n \"reflect\": false,\n \"defaultValue\": \"undefined\"\n },\n \"checkbox\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute will add a checkbox to the item.\"\n },\n \"attribute\": \"checkbox\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"checked\": {\n \"type\": \"boolean\",\n \"mutable\": true,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The presence of this attribute will make the checkbox checked.\"\n },\n \"attribute\": \"checked\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n }\n };\n }\n static get states() {\n return {\n \"mouseOver\": {}\n };\n }\n static get events() {\n return [{\n \"method\": \"itemClicked\",\n \"name\": \"itemClicked\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"(This event is for internal use.)\"\n },\n \"complexType\": {\n \"original\": \"ItemClicked\",\n \"resolved\": \"{ clickedItem: HTMLGxgListBoxItemElement; ctrlKey: boolean; cmdKey: boolean; shiftKey: boolean; index: number; }\",\n \"references\": {\n \"ItemClicked\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/list-box-item/list-box-item.tsx\",\n \"id\": \"src/components/list-box-item/list-box-item.tsx::ItemClicked\"\n }\n }\n }\n }, {\n \"method\": \"itemLoaded\",\n \"name\": \"itemLoaded\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"(This event is for internal use.)\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }, {\n \"method\": \"itemSelected\",\n \"name\": \"itemSelected\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"(This event is for internal use.)\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }, {\n \"method\": \"checkboxStateChanged\",\n \"name\": \"checkboxStateChanged\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"(This event is for internal use.)\"\n },\n \"complexType\": {\n \"original\": \"ItemChecked\",\n \"resolved\": \"{ checkedItem: HTMLGxgListBoxItemElement; checked: boolean; }\",\n \"references\": {\n \"ItemChecked\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/list-box-item/list-box-item.tsx\",\n \"id\": \"src/components/list-box-item/list-box-item.tsx::ItemChecked\"\n }\n }\n }\n }, {\n \"method\": \"checkboxClicked\",\n \"name\": \"checkboxClicked\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"(This event is for internal use.)\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }];\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"selected\",\n \"methodName\": \"watchPropHandler\"\n }];\n }\n static get listeners() {\n return [{\n \"name\": \"checked\",\n \"method\": \"checkedChangedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }, {\n \"name\": \"change\",\n \"method\": \"checkboxChangedHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }];\n }\n}\n//# sourceMappingURL=list-box-item.js.map\n"],"mappings":"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"}
@@ -0,0 +1,24 @@
1
+ import { r as s, h as o, H as r } from "./p-2776d2f9.js";
2
+
3
+ const t = ":host{display:block}";
4
+
5
+ const n = class {
6
+ constructor(o) {
7
+ s(this, o);
8
+ this.displayTitle = false;
9
+ }
10
+ // 5.EVENTS (EMIT) //
11
+ // 6.COMPONENT LIFECYCLE METHODS //
12
+ // 7.LISTENERS //
13
+ // 8.PUBLIC METHODS API //
14
+ // 9.LOCAL METHODS //
15
+ // 10.RENDER() FUNCTION //
16
+ render() {
17
+ return o(r, null, "window");
18
+ }
19
+ };
20
+
21
+ n.style = t;
22
+
23
+ export { n as gxg_window_v2 };
24
+ //# sourceMappingURL=p-4fc6d6a7.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["windowCss","GxgWindowV2","constructor","hostRef","this","displayTitle","render","h","Host"],"sources":["node_modules/@genexus/gemini/dist/collection/components/window-v2/window.css?tag=gxg-window-v2&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/window-v2/window-v2.js"],"sourcesContent":[":host {\n display: block;\n}","import { Host, h } from \"@stencil/core\";\nexport class GxgWindowV2 {\n constructor() {\n this.displayTitle = false;\n }\n // 5.EVENTS (EMIT) //\n // 6.COMPONENT LIFECYCLE METHODS //\n // 7.LISTENERS //\n // 8.PUBLIC METHODS API //\n // 9.LOCAL METHODS //\n // 10.RENDER() FUNCTION //\n render() {\n return h(Host, null, \"window\");\n }\n static get is() { return \"gxg-window-v2\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"window.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"window.css\"]\n };\n }\n static get properties() {\n return {\n \"displayTitle\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"false\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"If true it displays the component title on the header\"\n },\n \"attribute\": \"display-title\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n }\n };\n }\n}\n//# sourceMappingURL=window-v2.js.map\n"],"mappings":";;AAAA,MAAMA,IAAY;;MCCLC,IAAW;EACpB,WAAAC,CAAAC;;IACIC,KAAKC,eAAe;;;;;;;;EAQxB,MAAAC;IACI,OAAOC,EAAEC,GAAM,MAAM"}
@@ -0,0 +1,270 @@
1
+ import { r as e, c as t, h as r, H as s, g as i } from "./p-2776d2f9.js";
2
+
3
+ import { L as o } from "./p-74d59062.js";
4
+
5
+ const a = ":host{display:block;border:1px solid var(--gx-ide-container-border-color);border-radius:var(--ds-form-control-border-radius);--status-buttons-label-color:var(--mer-text__on-surface)}gx-ide-list-selector::part(list){display:flex;flex-direction:row}gx-ide-list-selector-item{border-block-start:none !important;flex:1;text-align:center;}gx-ide-list-selector-item.not-zero{font-weight:var(--mer-font__weight--semi-bold)}gx-ide-list-selector-item:not(:last-child){border-inline-end:1px solid var(--gx-ide-container-border-color)}gx-ide-list-selector-item .label__wrapper{display:inline-flex;width:auto;min-height:0}gx-ide-list-selector-item .label__description{color:var(--status-buttons-label-color);margin-inline-start:var(--mer-spacing--xxs)}gx-ide-list-selector-item .active-indicator{display:inline-block;width:var(--mer-spacing--xs);height:var(--mer-spacing--xs);border:1px solid var(--mer-border-color__dim);border-radius:calc(var(--mer-spacing--xs) / 2);background-color:var(--mer-border-color__dim)}gx-ide-list-selector-item input:checked+.label{--status-buttons-label-color:var(--mer-text__on-surface);background-color:inherit}gx-ide-list-selector-item input:checked+.label .active-indicator{background-color:var(--mer-icon__primary);border-color:var(--mer-icon__primary)}gx-ide-list-selector-item:hover input:checked+.label{background-color:var(--ds-item-background-color--hover) !important}:host([compact]) gx-ide-list-selector-item{font-size:var(--mer-font__size--xxs)}:host([compact]) .label__wrapper{gap:var(--mer-spacing--xxs);padding:var(--mer-spacing--xxxs) var(--mer-spacing--xs) var(--mer-spacing--xxxs) var(--mer-spacing--xxs)}:host([compact]) .label__universal-slot{margin-inline-end:var(--mer-spacing--xxxs)}:host([no-border]){border:none}:host([no-border-top]){border-top:none}:host([no-border-end]){border-inline-end:none}:host([no-border-bottom]){border-bottom:none}:host([no-border-start]){border-inline-start:none}:host([no-inner-borders]) gx-ide-list-selector-item{border-inline-end:none}";
6
+
7
+ const n = class {
8
+ constructor(r) {
9
+ e(this, r);
10
+ this.selectionChanged = t(this, "selectionChanged", 7);
11
+ // 7.LISTENERS //
12
+ // 8.PUBLIC METHODS API //
13
+ // 9.LOCAL METHODS //
14
+ this.evaluateIconsSize = () => {
15
+ if (this.compact) {
16
+ this.iconsSize = "small";
17
+ }
18
+ };
19
+ this.evaluateLabel = e => {
20
+ const t = this[e];
21
+ if (this.minimal) {
22
+ return `${t}`;
23
+ } else {
24
+ const r = t === 1;
25
+ return r ? `${t} ${this._componentLocale[e]["singular"]}` : `${t} ${this._componentLocale[e]["plural"]}`;
26
+ }
27
+ };
28
+ this.selectionChangedHandler = e => {
29
+ e.stopPropagation();
30
+ this.selectionChanged.emit(e.detail);
31
+ };
32
+ this.active = false;
33
+ this.errors = 0;
34
+ this.hideError = false;
35
+ this.warnings = 0;
36
+ this.hideWarning = false;
37
+ this.successes = 0;
38
+ this.hideSuccess = false;
39
+ this.messages = 0;
40
+ this.hideMessage = false;
41
+ this.minimal = false;
42
+ this.compact = false;
43
+ this.noBorder = false;
44
+ this.noInnerBorders = false;
45
+ this.noBorderTop = false;
46
+ this.noBorderEnd = false;
47
+ this.noBorderBottom = false;
48
+ this.noBorderStart = false;
49
+ this.iconsSize = "small";
50
+ }
51
+ // 6.COMPONENT LIFECYCLE METHODS //
52
+ async componentWillLoad() {
53
+ this._componentLocale = await o.getComponentStrings(this.el);
54
+ this.evaluateIconsSize();
55
+ }
56
+ // 10.RENDER() FUNCTION //
57
+ render() {
58
+ return r(s, null, r("gx-ide-list-selector", {
59
+ type: "multi-selection",
60
+ listName: "status-buttons",
61
+ noListBorder: true,
62
+ ellipsis: true,
63
+ iconsSize: this.iconsSize,
64
+ onSelectionChanged: this.selectionChangedHandler
65
+ }, !this.hideError ? r("gx-ide-list-selector-item", {
66
+ itemId: "errors",
67
+ itemValue: this.evaluateLabel("errors"),
68
+ icon: "gx-test/result-exception",
69
+ iconColor: this.errors === 0 ? "disabled" : "auto",
70
+ class: {
71
+ error: true,
72
+ "not-zero": this.errors !== 0
73
+ },
74
+ itemChecked: true
75
+ }, r("span", {
76
+ slot: "universal",
77
+ class: {
78
+ "active-indicator": true
79
+ }
80
+ })) : null, !this.hideWarning ? r("gx-ide-list-selector-item", {
81
+ itemId: "warnings",
82
+ itemValue: this.evaluateLabel("warnings"),
83
+ icon: "gx-test/result-warning",
84
+ iconColor: this.warnings === 0 ? "disabled" : "auto",
85
+ class: {
86
+ warning: true,
87
+ "not-zero": this.warnings !== 0
88
+ },
89
+ itemChecked: true
90
+ }, r("span", {
91
+ slot: "universal",
92
+ class: {
93
+ "active-indicator": true
94
+ }
95
+ })) : null, !this.hideSuccess ? r("gx-ide-list-selector-item", {
96
+ itemId: "successes",
97
+ itemValue: this.evaluateLabel("successes"),
98
+ icon: "gx-test/result-ok",
99
+ iconColor: this.successes === 0 ? "disabled" : "auto",
100
+ class: {
101
+ success: true,
102
+ "not-zero": this.successes !== 0
103
+ },
104
+ itemChecked: true
105
+ }, r("span", {
106
+ slot: "universal",
107
+ class: {
108
+ "active-indicator": true
109
+ }
110
+ })) : null, !this.hideMessage ? r("gx-ide-list-selector-item", {
111
+ itemId: "messages",
112
+ itemValue: this.evaluateLabel("messages"),
113
+ icon: "gx-test/screenshot-viewer",
114
+ iconColor: this.messages === 0 ? "disabled" : "auto",
115
+ class: {
116
+ message: true,
117
+ "not-zero": this.messages !== 0
118
+ },
119
+ itemChecked: true
120
+ }, r("span", {
121
+ slot: "universal",
122
+ class: {
123
+ "active-indicator": true
124
+ }
125
+ })) : null));
126
+ }
127
+ static get assetsDirs() {
128
+ return [ "gx-ide-assets/status-buttons" ];
129
+ }
130
+ get el() {
131
+ return i(this);
132
+ }
133
+ };
134
+
135
+ n.style = a;
136
+
137
+ const l = ':host{--top-bar-progress:0%;display:grid;grid-template-rows:0fr;transition:200ms grid-template-rows}:host>*{overflow:hidden}:host(.visible){grid-template-rows:1fr}.top-state-bar{position:relative;border-radius:var(--mer-border__width--lg);list-style:var(--mer-font__size--xxs);display:flex;opacity:0;transition:150ms opacity;}.top-state-bar:before{content:"";width:100%;height:100%;position:absolute;background-color:var(--mer-color__elevation--04);z-index:-1}.top-state-bar:after{content:"";left:var(--mer-border__width--sm);top:var(--mer-border__width--sm);width:calc(100% - var(--mer-border__width--sm) * 2);height:calc(100% - var(--mer-border__width--sm) * 2);position:absolute;background-color:var(--mer-color__surface);z-index:0;border-radius:var(--mer-border__width--lg)}.top-state-bar>*{position:relative;z-index:1}.top-state-bar__wrapper{flex:1;display:flex;flex-direction:column;gap:var(--mer-spacing--xs);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.top-state-bar__caption{color:var(--mer-text__on-message);font-family:var(--ds-base-font-family-primary);font-size:var(--mer-font__size--xxs);line-height:var(--mer-font__size--xxs);font-weight:var(--mer-font__weight--regular);display:flex;align-items:baseline;font-style:italic}.top-state-bar__progress-wrapper{height:var(--mer-spacing--xxs);background-color:var(--mer-color__elevation--04)}.top-state-bar__close-wrapper{cursor:pointer;border-inline-start:1px solid var(--mer-color__elevation--04);display:flex;align-items:center;transition:200ms background-color}.top-state-bar__close-wrapper:hover .top-state-bar__close{opacity:0.75}.top-state-bar__close-wrapper:active .top-state-bar__close{opacity:0.5}.top-state-bar--accent .progress-bar{background-color:var(--mer-accent__primary)}.top-state-bar--accent .top-state-bar__caption{color:var(--mer-accent__primary)}.top-state-bar--success .progress-bar{background-color:var(--mer-color__message-green--100)}.top-state-bar--success .top-state-bar__caption{color:var(--mer-color__message-green--100)}.top-state-bar--warning .progress-bar{background-color:var(--mer-color__message-yellow--100)}.top-state-bar--warning .top-state-bar__caption{color:var(--mer-color__message-yellow--100)}.top-state-bar--error .progress-bar{background-color:var(--mer-color__message-red--100)}.top-state-bar--error .top-state-bar__caption{color:var(--mer-color__message-red--100)}.top-state-bar--in-progress:before{height:0;width:120%;padding-top:60%;padding-bottom:60%;background:linear-gradient(90deg, #5ba7ff 0%, #3fa89b 100%);top:50%;left:50%;transform:translate(-50%, -50%);-webkit-animation:inProgressBackgroundColor 1s linear infinite;animation:inProgressBackgroundColor 1s linear infinite}.top-state-bar--in-progress .top-state-bar__close-wrapper{border-inline-start-color:#3fa89b;-webkit-animation:inProgressBorderColor 1s linear infinite;animation:inProgressBorderColor 1s linear infinite}.top-state-bar--in-progress .progress-bar{position:relative;overflow:hidden;z-index:1}.top-state-bar--in-progress .progress-bar:after{content:"";position:absolute;z-index:0;width:300%;height:100%;left:0;background:linear-gradient(90deg, #93f5eb 0%, #1aa3ff 33%, #93f5eb 66%, #1aa3ff 100%);animation-name:inProgressBar;animation-duration:2s;animation-iteration-count:infinite}.top-state-bar--in-progress .top-state-bar__caption{color:#3fa89b}.top-state-bar--visible{opacity:1}@-webkit-keyframes inProgressBorderColor{0%{border-inline-start-color:#3fa89b}100%{border-inline-start-color:#5ba7ff}}@-webkit-keyframes inProgressBackgroundColor{0%{transform:translate(-50%, -50%) rotate(0)}100%{transform:translate(-50%, -50%) rotate(1turn)}}@-webkit-keyframes inProgressBar{0%{left:0%}100%{left:-200%}}@-moz-keyframes inProgressBar{0%{left:0%}100%{left:200%}}@keyframes inProgressBar{0%{left:0%}100%{left:-200%}}.progress-bar{display:block;transition:all 200ms;width:var(--top-bar-progress);border-radius:calc(var(--mer-spacing--xxs) / 2);height:100%}:host([no-border]) .top-state-bar{position:relative}:host([no-border]) .top-state-bar:before,:host([no-border]) .top-state-bar:after{display:none}:host([no-border]) .top-state-bar__close-wrapper{border-inline-start:none}';
138
+
139
+ const c = class {
140
+ constructor(t) {
141
+ // 7.LISTENERS //
142
+ // 8.PUBLIC METHODS API //
143
+ // 9.LOCAL METHODS //
144
+ this.evaluateInitialProgress = () => {
145
+ if (this.progress === undefined && (this.stateType === "error" || this.stateType === "warning" || this.stateType === "success")) {
146
+ this.progress = 100;
147
+ } else if (this.progress === undefined && this.stateType === "in-progress") {
148
+ this.progress = 0;
149
+ }
150
+ this.el.style.setProperty("--top-bar-progress", `${this.progress}%`);
151
+ };
152
+ this.evaluateWithAction = () => {
153
+ if (this.withClose === undefined && (this.stateType === "error" || this.stateType === "warning" || this.stateType === "success")) {
154
+ this.withClose = true;
155
+ }
156
+ };
157
+ this.closeButtonHandler = () => {
158
+ this.active = false;
159
+ };
160
+ e(this, t);
161
+ this.topStateBarVisible = false;
162
+ this.visible = false;
163
+ this.caption = undefined;
164
+ this.minimal = false;
165
+ this.active = false;
166
+ this.stateType = "in-progress";
167
+ this.progress = undefined;
168
+ this.withClose = undefined;
169
+ this.autoClose = false;
170
+ this.noBorder = false;
171
+ this.closedCallback = false;
172
+ }
173
+ get el() {
174
+ return i(this);
175
+ }
176
+ watchActiveHandler(e) {
177
+ if (e) {
178
+ this.visible = true;
179
+ setTimeout((() => {
180
+ this.topStateBarVisible = true;
181
+ }), 300);
182
+ } else {
183
+ this.topStateBarVisible = false;
184
+ setTimeout((() => {
185
+ this.visible = false;
186
+ }), 300);
187
+ }
188
+ }
189
+ watchStateTypeHandler() {
190
+ this.evaluateWithAction();
191
+ }
192
+ watchProgressHandler(e) {
193
+ if (e => 0) {
194
+ this.el.style.setProperty("--top-bar-progress", `${e}%`);
195
+ }
196
+ if (e === 100 && this.autoClose) {
197
+ setTimeout((() => {
198
+ this.active = false;
199
+ }), 200);
200
+ }
201
+ }
202
+ // 5.EVENTS (EMIT) //
203
+ // 6.COMPONENT LIFECYCLE EVENTS //
204
+ componentWillLoad() {
205
+ this.evaluateWithAction();
206
+ this.evaluateInitialProgress();
207
+ if (this.active) {
208
+ this.visible = true;
209
+ this.topStateBarVisible = true;
210
+ }
211
+ }
212
+ // 10.RENDER() FUNCTION //
213
+ render() {
214
+ return r(s, {
215
+ class: {
216
+ visible: this.visible
217
+ },
218
+ "aria-hidden": !this.active
219
+ }, r("div", {
220
+ role: "status",
221
+ "aria-labelledby": "label",
222
+ "aria-hidden": !this.active,
223
+ class: {
224
+ "top-state-bar": true,
225
+ [`top-state-bar--${this.stateType}`]: true,
226
+ "top-state-bar--with-close": this.withClose,
227
+ "top-state-bar--visible": this.topStateBarVisible
228
+ }
229
+ }, r("div", {
230
+ class: "top-state-bar__wrapper"
231
+ }, !this.minimal ? r("label", {
232
+ id: "label",
233
+ class: {
234
+ "top-state-bar__caption": true
235
+ },
236
+ part: "label"
237
+ }, this.caption) : null, r("div", {
238
+ class: {
239
+ "top-state-bar__progress-wrapper": true
240
+ },
241
+ part: "progress-wrapper"
242
+ }, r("span", {
243
+ class: "progress-bar"
244
+ }))), this.withClose && !this.minimal ? r("div", {
245
+ class: "top-state-bar__close-wrapper",
246
+ onClick: this.closeButtonHandler
247
+ }, r("gxg-icon", {
248
+ class: {
249
+ "top-state-bar__close": true
250
+ },
251
+ role: "button",
252
+ "aria-label": "close",
253
+ type: "gemini-tools/close",
254
+ color: "mercury-primary",
255
+ tabIndex: 0
256
+ })) : null));
257
+ }
258
+ static get watchers() {
259
+ return {
260
+ active: [ "watchActiveHandler" ],
261
+ stateType: [ "watchStateTypeHandler" ],
262
+ progress: [ "watchProgressHandler" ]
263
+ };
264
+ }
265
+ };
266
+
267
+ c.style = l;
268
+
269
+ export { n as gx_ide_status_buttons, c as gxg_top_state_bar };
270
+ //# sourceMappingURL=p-54e4b362.entry.js.map