@genexus/genexus-ide-ui 0.0.98 → 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 (224) 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-container_2.cjs.entry.js → gx-ide-container_3.cjs.entry.js} +53 -127
  5. package/dist/cjs/gx-ide-container_3.cjs.entry.js.map +1 -0
  6. package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js +2 -2
  7. package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js.map +1 -1
  8. package/dist/cjs/gx-ide-data-selector.cjs.entry.js +175 -0
  9. package/dist/cjs/gx-ide-data-selector.cjs.entry.js.map +1 -0
  10. package/dist/cjs/{gx-ide-recent-news.cjs.entry.js → gx-ide-empty-state_2.cjs.entry.js} +64 -2
  11. package/dist/cjs/gx-ide-empty-state_2.cjs.entry.js.map +1 -0
  12. package/dist/cjs/gx-ide-import-from-design.cjs.entry.js +2 -9
  13. package/dist/cjs/gx-ide-import-from-design.cjs.entry.js.map +1 -1
  14. package/dist/cjs/gx-ide-start-page.cjs.entry.js +9 -5
  15. package/dist/cjs/gx-ide-start-page.cjs.entry.js.map +1 -1
  16. package/dist/cjs/gx-ide-status-buttons_2.cjs.entry.js +41 -27
  17. package/dist/cjs/gx-ide-status-buttons_2.cjs.entry.js.map +1 -1
  18. package/dist/cjs/gxg-card_2.cjs.entry.js +10 -5
  19. package/dist/cjs/gxg-card_2.cjs.entry.js.map +1 -1
  20. package/dist/cjs/gxg-combo-box_2.cjs.entry.js +62 -24
  21. package/dist/cjs/gxg-combo-box_2.cjs.entry.js.map +1 -1
  22. package/dist/cjs/gxg-form-checkbox.cjs.entry.js +151 -0
  23. package/dist/cjs/gxg-form-checkbox.cjs.entry.js.map +1 -0
  24. package/dist/cjs/gxg-list-box_2.cjs.entry.js +28 -3
  25. package/dist/cjs/gxg-list-box_2.cjs.entry.js.map +1 -1
  26. package/dist/cjs/gxg-menu-item.cjs.entry.js +1 -1
  27. package/dist/cjs/gxg-menu-item.cjs.entry.js.map +1 -1
  28. package/dist/cjs/gxg-pill.cjs.entry.js +5 -5
  29. package/dist/cjs/gxg-pill.cjs.entry.js.map +1 -1
  30. package/dist/cjs/gxg-pills.cjs.entry.js +1 -1
  31. package/dist/cjs/gxg-pills.cjs.entry.js.map +1 -1
  32. package/dist/cjs/gxg-tab_4.cjs.entry.js +97 -17
  33. package/dist/cjs/gxg-tab_4.cjs.entry.js.map +1 -1
  34. package/dist/cjs/gxg-window-v2.cjs.entry.js +28 -0
  35. package/dist/cjs/gxg-window-v2.cjs.entry.js.map +1 -0
  36. package/dist/cjs/loader.cjs.js +1 -1
  37. package/dist/collection/collection-manifest.json +4 -1
  38. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.css +40 -0
  39. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js +180 -0
  40. package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js.map +1 -0
  41. package/dist/collection/components/_helpers/list-selector/list-selector-item/list-selector-item.js +1 -1
  42. package/dist/collection/components/_helpers/list-selector/list-selector.js +1 -1
  43. package/dist/collection/components/dashboard-home/dashboard-home.css +5 -0
  44. package/dist/collection/components/dashboard-home/dashboard-home.js +1 -1
  45. package/dist/collection/components/dashboard-home/dashboard-home.js.map +1 -1
  46. package/dist/collection/components/data-selector/data-selector.css +261 -0
  47. package/dist/collection/components/data-selector/data-selector.js +441 -0
  48. package/dist/collection/components/data-selector/data-selector.js.map +1 -0
  49. package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.en.json +23 -0
  50. package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.ja.json +3 -0
  51. package/dist/collection/components/data-selector/gx-ide-assets/data-selector/langs/data-selector.lang.zh.json +3 -0
  52. package/dist/collection/components/data-selector/gx-ide-assets/data-selector/shortcuts.json +15 -0
  53. package/dist/collection/components/import-from-design/import-from-design.js +3 -12
  54. package/dist/collection/components/import-from-design/import-from-design.js.map +1 -1
  55. package/dist/collection/components/start-page/recent-news.css +1 -1
  56. package/dist/collection/components/start-page/start-page.css +4 -0
  57. package/dist/collection/components/start-page/start-page.js +8 -4
  58. package/dist/collection/components/start-page/start-page.js.map +1 -1
  59. package/dist/components/card.js +11 -5
  60. package/dist/components/card.js.map +1 -1
  61. package/dist/components/combo-box.js +62 -24
  62. package/dist/components/combo-box.js.map +1 -1
  63. package/dist/components/gx-ide-dashboard-home.js +2 -2
  64. package/dist/components/gx-ide-dashboard-home.js.map +1 -1
  65. package/dist/components/gx-ide-data-selector.d.ts +11 -0
  66. package/dist/components/gx-ide-data-selector.js +347 -0
  67. package/dist/components/gx-ide-data-selector.js.map +1 -0
  68. package/dist/components/gx-ide-empty-state.d.ts +11 -0
  69. package/dist/components/gx-ide-empty-state.js +8 -0
  70. package/dist/components/gx-ide-empty-state.js.map +1 -0
  71. package/dist/components/gx-ide-empty-state2.js +126 -0
  72. package/dist/components/gx-ide-empty-state2.js.map +1 -0
  73. package/dist/components/gx-ide-import-from-design.js +3 -11
  74. package/dist/components/gx-ide-import-from-design.js.map +1 -1
  75. package/dist/components/gx-ide-start-page.js +21 -11
  76. package/dist/components/gx-ide-start-page.js.map +1 -1
  77. package/dist/components/gxg-menu-item.js +1 -1
  78. package/dist/components/gxg-menu-item.js.map +1 -1
  79. package/dist/components/gxg-pills.js +1 -1
  80. package/dist/components/gxg-pills.js.map +1 -1
  81. package/dist/components/gxg-top-state-bar2.js +46 -30
  82. package/dist/components/gxg-top-state-bar2.js.map +1 -1
  83. package/dist/components/gxg-window-v2.js +44 -0
  84. package/dist/components/gxg-window-v2.js.map +1 -0
  85. package/dist/components/icon2.js +3 -2
  86. package/dist/components/icon2.js.map +1 -1
  87. package/dist/components/list-box.js +27 -1
  88. package/dist/components/list-box.js.map +1 -1
  89. package/dist/components/pill.js +5 -5
  90. package/dist/components/pill.js.map +1 -1
  91. package/dist/components/recent-news.js +1 -1
  92. package/dist/components/recent-news.js.map +1 -1
  93. package/dist/components/tab-bar.js +17 -9
  94. package/dist/components/tab-bar.js.map +1 -1
  95. package/dist/components/tab-button.js +11 -4
  96. package/dist/components/tab-button.js.map +1 -1
  97. package/dist/components/tab.js +6 -3
  98. package/dist/components/tab.js.map +1 -1
  99. package/dist/components/tabs.js +73 -4
  100. package/dist/components/tabs.js.map +1 -1
  101. package/dist/esm/ch-icon_5.entry.js +3 -2
  102. package/dist/esm/ch-icon_5.entry.js.map +1 -1
  103. package/dist/esm/genexus-ide-ui.js +1 -1
  104. package/dist/esm/{gx-ide-container_2.entry.js → gx-ide-container_3.entry.js} +53 -128
  105. package/dist/esm/gx-ide-container_3.entry.js.map +1 -0
  106. package/dist/esm/gx-ide-dashboard-home.entry.js +2 -2
  107. package/dist/esm/gx-ide-dashboard-home.entry.js.map +1 -1
  108. package/dist/esm/gx-ide-data-selector.entry.js +171 -0
  109. package/dist/esm/gx-ide-data-selector.entry.js.map +1 -0
  110. package/dist/esm/{gx-ide-recent-news.entry.js → gx-ide-empty-state_2.entry.js} +64 -3
  111. package/dist/esm/gx-ide-empty-state_2.entry.js.map +1 -0
  112. package/dist/esm/gx-ide-import-from-design.entry.js +2 -9
  113. package/dist/esm/gx-ide-import-from-design.entry.js.map +1 -1
  114. package/dist/esm/gx-ide-start-page.entry.js +9 -5
  115. package/dist/esm/gx-ide-start-page.entry.js.map +1 -1
  116. package/dist/esm/gx-ide-status-buttons_2.entry.js +41 -27
  117. package/dist/esm/gx-ide-status-buttons_2.entry.js.map +1 -1
  118. package/dist/esm/gxg-card_2.entry.js +10 -5
  119. package/dist/esm/gxg-card_2.entry.js.map +1 -1
  120. package/dist/esm/gxg-combo-box_2.entry.js +62 -24
  121. package/dist/esm/gxg-combo-box_2.entry.js.map +1 -1
  122. package/dist/esm/gxg-form-checkbox.entry.js +147 -0
  123. package/dist/esm/gxg-form-checkbox.entry.js.map +1 -0
  124. package/dist/esm/gxg-list-box_2.entry.js +27 -2
  125. package/dist/esm/gxg-list-box_2.entry.js.map +1 -1
  126. package/dist/esm/gxg-menu-item.entry.js +1 -1
  127. package/dist/esm/gxg-menu-item.entry.js.map +1 -1
  128. package/dist/esm/gxg-pill.entry.js +5 -5
  129. package/dist/esm/gxg-pill.entry.js.map +1 -1
  130. package/dist/esm/gxg-pills.entry.js +1 -1
  131. package/dist/esm/gxg-pills.entry.js.map +1 -1
  132. package/dist/esm/gxg-tab_4.entry.js +97 -17
  133. package/dist/esm/gxg-tab_4.entry.js.map +1 -1
  134. package/dist/esm/gxg-window-v2.entry.js +24 -0
  135. package/dist/esm/gxg-window-v2.entry.js.map +1 -0
  136. package/dist/esm/loader.js +1 -1
  137. package/dist/genexus-ide-ui/genexus-ide-ui.css +74 -7
  138. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  139. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js.map +1 -1
  140. package/dist/genexus-ide-ui/gx-ide-assets/data-selector/langs/data-selector.lang.en.json +23 -0
  141. package/dist/genexus-ide-ui/gx-ide-assets/data-selector/langs/data-selector.lang.ja.json +3 -0
  142. package/dist/genexus-ide-ui/gx-ide-assets/data-selector/langs/data-selector.lang.zh.json +3 -0
  143. package/dist/genexus-ide-ui/gx-ide-assets/data-selector/shortcuts.json +15 -0
  144. package/dist/genexus-ide-ui/icon-assets/mercury/tests/balanza-path.svg +3 -0
  145. package/dist/genexus-ide-ui/icon-assets/mercury/tests/balanza-stroke.svg +9 -0
  146. package/dist/genexus-ide-ui/icon-assets/mercury/tests/folder-2.svg +3 -0
  147. package/dist/genexus-ide-ui/{p-b8fc93f4.entry.js → p-2c8afaa6.entry.js} +147 -112
  148. package/dist/genexus-ide-ui/p-2c8afaa6.entry.js.map +1 -0
  149. package/dist/genexus-ide-ui/{p-9b96b515.entry.js → p-40f21d2d.entry.js} +116 -192
  150. package/dist/genexus-ide-ui/p-40f21d2d.entry.js.map +1 -0
  151. package/dist/genexus-ide-ui/{p-5ca84a03.entry.js → p-4e155cd5.entry.js} +27 -4
  152. package/dist/genexus-ide-ui/p-4e155cd5.entry.js.map +1 -0
  153. package/dist/genexus-ide-ui/p-4fc6d6a7.entry.js +24 -0
  154. package/dist/genexus-ide-ui/p-4fc6d6a7.entry.js.map +1 -0
  155. package/dist/genexus-ide-ui/p-54e4b362.entry.js +270 -0
  156. package/dist/genexus-ide-ui/p-54e4b362.entry.js.map +1 -0
  157. package/dist/genexus-ide-ui/{p-73aa4e69.entry.js → p-71f8aba2.entry.js} +13 -13
  158. package/dist/genexus-ide-ui/{p-73aa4e69.entry.js.map → p-71f8aba2.entry.js.map} +1 -1
  159. package/dist/genexus-ide-ui/p-75f0ba9d.entry.js +273 -0
  160. package/dist/genexus-ide-ui/p-75f0ba9d.entry.js.map +1 -0
  161. package/dist/genexus-ide-ui/{p-545291ad.entry.js → p-7dc3a137.entry.js} +4 -3
  162. package/dist/genexus-ide-ui/{p-545291ad.entry.js.map → p-7dc3a137.entry.js.map} +1 -1
  163. package/dist/genexus-ide-ui/{p-f186adfd.entry.js → p-85639fa5.entry.js} +100 -22
  164. package/dist/genexus-ide-ui/p-85639fa5.entry.js.map +1 -0
  165. package/dist/genexus-ide-ui/{p-30365c44.entry.js → p-a3e07b86.entry.js} +6 -7
  166. package/dist/genexus-ide-ui/p-a3e07b86.entry.js.map +1 -0
  167. package/dist/genexus-ide-ui/{p-9c6c5a61.entry.js → p-a592930e.entry.js} +37 -32
  168. package/dist/genexus-ide-ui/p-a592930e.entry.js.map +1 -0
  169. package/dist/genexus-ide-ui/p-b0e539fe.entry.js +41 -0
  170. package/dist/genexus-ide-ui/p-b0e539fe.entry.js.map +1 -0
  171. package/dist/genexus-ide-ui/{p-a439149b.entry.js → p-bff2603a.entry.js} +8 -3
  172. package/dist/genexus-ide-ui/p-bff2603a.entry.js.map +1 -0
  173. package/dist/genexus-ide-ui/{p-050bc199.entry.js → p-e0924e3f.entry.js} +96 -6
  174. package/dist/genexus-ide-ui/p-e0924e3f.entry.js.map +1 -0
  175. package/dist/genexus-ide-ui/{p-58cad79d.entry.js → p-e240361a.entry.js} +58 -68
  176. package/dist/genexus-ide-ui/p-e240361a.entry.js.map +1 -0
  177. package/dist/genexus-ide-ui/{p-e585f550.entry.js → p-e3925761.entry.js} +4 -5
  178. package/dist/genexus-ide-ui/{p-e585f550.entry.js.map → p-e3925761.entry.js.map} +1 -1
  179. package/dist/genexus-ide-ui/{p-219d7b29.entry.js → p-eeb35622.entry.js} +165 -89
  180. package/dist/genexus-ide-ui/p-eeb35622.entry.js.map +1 -0
  181. package/dist/node_modules/@genexus/gemini/dist/collection/components/card/card.css +13 -1
  182. package/dist/node_modules/@genexus/gemini/dist/collection/components/pills/pill.css +16 -51
  183. package/dist/node_modules/@genexus/gemini/dist/collection/components/pills/pills.css +1 -8
  184. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab/tab.css +7 -0
  185. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.css +18 -0
  186. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.css +17 -0
  187. package/dist/node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.css +64 -13
  188. package/dist/node_modules/@genexus/gemini/dist/collection/components/top-state-bar/gxg-top-state-bar.css +120 -43
  189. package/dist/node_modules/@genexus/gemini/dist/collection/components/window-v2/window.css +3 -0
  190. package/dist/types/components/_helpers/empty-state/gx-ide-empty-state.d.ts +34 -0
  191. package/dist/types/components/data-selector/data-selector.d.ts +109 -0
  192. package/dist/types/components/import-from-design/import-from-design.d.ts +1 -3
  193. package/dist/types/components.d.ts +220 -40
  194. package/package.json +3 -3
  195. package/dist/cjs/gx-ide-container_2.cjs.entry.js.map +0 -1
  196. package/dist/cjs/gx-ide-recent-news.cjs.entry.js.map +0 -1
  197. package/dist/cjs/gx-ide-title_2.cjs.entry.js +0 -77
  198. package/dist/cjs/gx-ide-title_2.cjs.entry.js.map +0 -1
  199. package/dist/cjs/reposition-scroll-86d8fac5.js +0 -33
  200. package/dist/cjs/reposition-scroll-86d8fac5.js.map +0 -1
  201. package/dist/components/reposition-scroll.js +0 -31
  202. package/dist/components/reposition-scroll.js.map +0 -1
  203. package/dist/esm/gx-ide-container_2.entry.js.map +0 -1
  204. package/dist/esm/gx-ide-recent-news.entry.js.map +0 -1
  205. package/dist/esm/gx-ide-title_2.entry.js +0 -72
  206. package/dist/esm/gx-ide-title_2.entry.js.map +0 -1
  207. package/dist/esm/reposition-scroll-cfff7017.js +0 -31
  208. package/dist/esm/reposition-scroll-cfff7017.js.map +0 -1
  209. package/dist/genexus-ide-ui/p-050bc199.entry.js.map +0 -1
  210. package/dist/genexus-ide-ui/p-219d7b29.entry.js.map +0 -1
  211. package/dist/genexus-ide-ui/p-30365c44.entry.js.map +0 -1
  212. package/dist/genexus-ide-ui/p-3e87257c.entry.js +0 -41
  213. package/dist/genexus-ide-ui/p-3e87257c.entry.js.map +0 -1
  214. package/dist/genexus-ide-ui/p-58cad79d.entry.js.map +0 -1
  215. package/dist/genexus-ide-ui/p-5ca84a03.entry.js.map +0 -1
  216. package/dist/genexus-ide-ui/p-9b96b515.entry.js.map +0 -1
  217. package/dist/genexus-ide-ui/p-9c6c5a61.entry.js.map +0 -1
  218. package/dist/genexus-ide-ui/p-a439149b.entry.js.map +0 -1
  219. package/dist/genexus-ide-ui/p-b8fc93f4.entry.js.map +0 -1
  220. package/dist/genexus-ide-ui/p-efa273d7.js +0 -27
  221. package/dist/genexus-ide-ui/p-efa273d7.js.map +0 -1
  222. package/dist/genexus-ide-ui/p-f186adfd.entry.js.map +0 -1
  223. package/dist/genexus-ide-ui/p-f5034221.entry.js +0 -258
  224. package/dist/genexus-ide-ui/p-f5034221.entry.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"names":["pillsCss","GxgPills","getPills","onlyEnabled","pillsIds","pills","Array","from","this","el","querySelectorAll","filter","pill","disabled","forEach","push","id","render","h","Host","class","mercury","state"],"sources":["node_modules/@genexus/gemini/dist/collection/components/pills/pills.css?tag=gxg-pills&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/pills/pills.js"],"sourcesContent":[":host {\n display: block;\n}\n\n.pills-wrapper {\n display: flex;\n gap: var(--spacing-comp-02);\n flex-wrap: wrap;\n}\n\n/*********************************************\nMercury\n**********************************************/\n:host(.mercury) .pills-wrapper {\n gap: var(--spacing-comp-04);\n}","import { Host, h } from \"@stencil/core\";\nimport state from \"../store\";\nexport class GxgPills {\n el;\n /**\n * Returns an array with the id's of all the pills\n */\n async getPills(onlyEnabled = true) {\n const pillsIds = [];\n let pills = Array.from(this.el.querySelectorAll(\"gxg-pill\"));\n if (onlyEnabled) {\n pills = pills.filter((pill) => !pill.disabled);\n }\n pills.forEach((pill) => {\n pillsIds.push(pill.id);\n });\n return pillsIds;\n }\n render() {\n return (h(Host, { class: { mercury: state.mercury } }, h(\"div\", { class: \"pills-wrapper\" }, h(\"slot\", null))));\n }\n static get is() { return \"gxg-pills\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"pills.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"pills.css\"]\n };\n }\n static get methods() {\n return {\n \"getPills\": {\n \"complexType\": {\n \"signature\": \"(onlyEnabled?: boolean) => Promise<string[]>\",\n \"parameters\": [{\n \"name\": \"onlyEnabled\",\n \"type\": \"boolean\",\n \"docs\": \"\"\n }],\n \"references\": {\n \"Promise\": {\n \"location\": \"global\",\n \"id\": \"global::Promise\"\n }\n },\n \"return\": \"Promise<string[]>\"\n },\n \"docs\": {\n \"text\": \"Returns an array with the id's of all the pills\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n}\n//# sourceMappingURL=pills.js.map\n"],"mappings":";;;;AAAA,MAAMA,IAAW;;MCEJC,IAAQ;;;;;;;;;SAKjB,cAAMC,CAASC,IAAc;IACzB,MAAMC,IAAW;IACjB,IAAIC,IAAQC,MAAMC,KAAKC,KAAKC,GAAGC,iBAAiB;IAChD,IAAIP,GAAa;MACbE,IAAQA,EAAMM,QAAQC,MAAUA,EAAKC;;IAEzCR,EAAMS,SAASF;MACXR,EAASW,KAAKH,EAAKI;AAAG;IAE1B,OAAOZ;;EAEX,MAAAa;IACI,OAAQC,EAAEC,GAAM;MAAEC,OAAO;QAAEC,SAASC,EAAMD;;OAAaH,EAAE,OAAO;MAAEE,OAAO;OAAmBF,EAAE,QAAQ"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["importFromDesignCss","DESIGN_DATA_TYPE_PANELS","DESIGN_DATA_TYPE_STENCILS","DESIGN_DATA_TYPE_IMAGES","DESIGN_DATA_TYPE_DESIGN_SYSTEM","DESIGN_DATA_TYPE_FONTS","GxIdeImportFromDesign","this","renderedFirstTime","loadedItems","Map","panelsSelected","stencilsSelected","fontsSelected","attachTreeMouseListeners","treeDataEl","addEventListener","treeMouseEnter","treeMouseLeave","removeTreeMouseListeners","removeEventListener","shrunkenTree","messageType","message","type","objectsTreeSelectedItemsChangedHandler","async","event","detail","length","item","_a","itemComposedId","id","idList","split","itemId","itemDesignType","selectedDesignType","loadedItem","getLoadedItem","designDataDetail","getDesignDataDetail","set","designType","selectedDesignItem","getCodeFactory","renderDetailDataTree","get","objectsTreeCheckedItemsChangedHandler","items","Array","from","values","currentParentId","result","startsWith","checked","parentId","push","fonts","panels","stencils","selectFile","optionPathEl","openFile","pathOnInputHandler","e","path","pathOnFileSelected","selectedFile","fileName","name","evaluateAccessToken","showAccessToken","requiresAccessTokenCallback","value","loadData","isLoading","source","token","accessTokenEl","undefined","designData","loadCallback","messageCallback","then","messages","map","loadFn","loadImageCallback","loadDesignSystemCallback","loadFontCallback","loadPanelDataCallback","returnedData","data","confirm","confirmCallback","moduleId","_b","filterModuleEl","styleName","optionStyleEl","importAsWebPanels","optionImportAsEl","cancel","cancelCallback","fitImagesHandler","fitImages","shrinkTreeHandler","shrinkTree","renderOptions","h","class","_componentLocale","options","onInput","onFileSelected","onBlur","ref","el","part","disabled","acceptFile","extensions","placeholder","pathPlaceholder","onClick","btnLoad","accessToken","style","styles","renderFormItems","module","defaultModule","defaultValue","selectEntityCallback","selectModuleCallback","label","importAs","designDataTreeDataModel","onChange","toggleTree","renderMessages","messagesList","text","renderMain","main","renderDesignTree","renderDesignTabs","renderNoDesignData","textAlign","config","gxgMessage","common","padding","maxWidth","noDesignSelected","selectDesign","treeModel","dragDisabled","dropDisabled","toggleCheckboxes","checkbox","onCheckedItemsChange","onSelectedItemsChange","renderFooter","slot","footer","btnOk","btnCancel","renderPanelTab","renderControlsTree","detailTreeModel","composition","preview","src","alt","renderImageTab","counter","noPadding","buttonsBorderAbove","tabsEl","hidden","tabs","tokens","tab","key","code","tokensFactoryRenderEl","stylesFactoryRenderEl","codeFactoryRenderEl","watchDesignDataHandler","newDesignData","leaf","caption","tree","leftImgSrc","expanded","images","designSystem","watchCounterHandler","setFirstActiveTab","watchShrinkTreeHandler","shrink","componentWillLoad","Locale","getComponentStrings","componentDidRender","componentDidRenderFirstTime","emit","componentName","disconnectedCallback","watchMessagesHandler","newValue","oldValue","scrollTop","scrollHeight","validate","isValid","loadTreeItemCompositionModel","controls","modelList","control","model","Object","assign","textEditorFactoryCallback","render","Host","noContentPadding","noContentGap","displayBorderBottom","slimmerFooter","gxIdeContainer","containerTitle","displayTitle"],"sources":["src/components/import-from-design/import-from-design.scss?tag=gx-ide-import-from-design&encapsulation=shadow","src/components/import-from-design/import-from-design.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n@import \"~@genexus/gemini/dist/collection/globals/mixins.scss\";\n\n:host {\n}\n\n/*--- Options ---*/\n.options {\n padding: var(--gx-ide-container__padding);\n border-block-end: 1px solid var(--gx-ide-container-border-color);\n grid-template-columns: auto 1fr;\n grid-template-areas:\n \"path-url-label path-url-wrapper\"\n \"access-token-label access-token\"\n \"style-label style\"\n \"module-label module\"\n \"checkboxes-options checkboxes-options\";\n\n .path-url-label {\n grid-area: path-url-label;\n }\n .path-url-wrapper {\n grid-area: path-url-wrapper;\n display: flex;\n flex-direction: row;\n gap: var(--gx-ide-grid-row-gap);\n\n &__buttons-container {\n display: flex;\n flex-direction: row;\n gap: var(--gx-ide-container-elements-spacing);\n }\n }\n .access-token-label {\n grid-area: access-token-label;\n }\n .access-token {\n grid-area: access-token;\n }\n .style-label {\n grid-area: style-label;\n }\n .style {\n grid-area: style;\n }\n .module-label {\n grid-area: module-label;\n }\n .module {\n grid-area: module;\n }\n .checkboxes-options {\n grid-area: checkboxes-options;\n }\n\n &--hide-access-token {\n grid-template-areas:\n \"path-url-label path-url-wrapper\"\n \"style-label style\"\n \"module-label module\"\n \"checkboxes-options checkboxes-options\";\n }\n\n .checkboxes-options {\n display: flex;\n justify-content: space-between;\n gap: var(--gx-ide-grid-row-gap);\n\n &__col-right {\n display: flex;\n opacity: 1;\n transition: opacity 200ms;\n gap: var(--gx-ide-grid-row-gap);\n &--hidden {\n opacity: 0;\n }\n }\n }\n}\n\n/*--- Messages Grid ---*/\n.messages-container {\n padding: var(--gx-ide-container__padding);\n height: 100%;\n overflow-y: auto;\n @include gxg-scrollbar;\n}\n\n/*--- Main ---*/\n.main {\n display: flex;\n height: 100%;\n justify-content: center;\n overflow: auto;\n .design-tree,\n .design-tabs {\n transition: flex 200ms;\n }\n .tree-container {\n flex: 1;\n }\n .design-tabs {\n flex: 2;\n\n &--fit-images {\n img {\n object-fit: contain;\n width: 100%;\n height: 100%;\n }\n }\n img {\n display: block;\n }\n }\n &--shrunken-tree {\n .tree-container {\n flex: 0.5;\n }\n .design-tabs {\n flex: 2.5;\n }\n }\n}\n.panel-tab {\n height: 100%;\n display: grid;\n grid-template-columns: 1fr 1fr;\n\n .panel-item {\n width: 100%;\n height: 100%;\n overflow: auto;\n @include gxg-scrollbar;\n font-size: var(--mer-font__size--xxs);\n line-height: normal;\n }\n}\n\n/*--- Tabs ---*/\n.tab--hidden {\n display: none;\n}\n","/* STENCIL IMPORTS */\nimport {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n Watch\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport {\n TextAlign,\n TextPadding,\n TextType\n} from \"@genexus/gemini/dist/types/components/text/text\";\nimport { TreeViewItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/tree-view/tree-view/types\";\nimport { TreeViewItemModelExtended } from \"@genexus/chameleon-controls-library/dist/types/components/renders/tree-view/types\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\nimport { renderFormItems } from \"../../common/common\";\nimport { EntityData, GxOption } from \"../../common/types\";\nimport { CheckboxInfo } from \"@genexus/gemini\";\n\nconst DESIGN_DATA_TYPE_PANELS = \"panels\";\nconst DESIGN_DATA_TYPE_STENCILS = \"stencils\";\nconst DESIGN_DATA_TYPE_IMAGES = \"images\";\nconst DESIGN_DATA_TYPE_DESIGN_SYSTEM = \"design_system\";\nconst DESIGN_DATA_TYPE_FONTS = \"fonts\";\n\n@Component({\n tag: \"gx-ide-import-from-design\",\n styleUrl: \"import-from-design.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/import-from-design\"]\n})\nexport class GxIdeImportFromDesign {\n /*\nINDEX:\n1.OWN PROPERTIES\n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE EVENTS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n // 1.OWN PROPERTIES //\n\n /**\n * The component hard-coded strings translations.\n */\n private _componentLocale: any;\n private renderedFirstTime = false;\n /**\n * An array that keeps track of the tree items id's (design system data type + item id) along with the content, that will be used to save and retrieve items information, in order to avoid using a callback to get items information that was already get. loadedItemsArray will be reset every time a new design is loaded.\n */\n private loadedItems: Map<string, ItemLoadedInfo> = new Map();\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeImportFromDesignElement;\n\n /* References needed to collect data */\n private optionPathEl!: HTMLGxgFormTextElement;\n private accessTokenEl!: HTMLGxgFormTextElement;\n private optionStyleEl!: HTMLGxgComboBoxElement;\n private optionImportAsEl!: HTMLGxgFormCheckboxElement;\n private filterModuleEl!: HTMLGxIdeEntitySelectorElement;\n private messagesList: HTMLElement;\n private panelsSelected: string[] = [];\n private stencilsSelected: string[] = [];\n // private imagesSelected: string[] = [];\n // private designSystemSelected: string[] = [];\n private fontsSelected: string[] = [];\n private codeFactoryRenderEl!: HTMLElement;\n private tokensFactoryRenderEl!: HTMLElement;\n private stylesFactoryRenderEl!: HTMLElement;\n private treeDataEl!: HTMLGxgTreeViewElement;\n private tabsEl!: HTMLGxgTabsElement;\n\n // 3.STATE() VARIABLES //\n\n /**\n * The design data loaded from file\n */\n @State() designData: DesignData = null;\n @Watch(\"designData\")\n watchDesignDataHandler(newDesignData: DesignData) {\n if (newDesignData) {\n this.designDataTreeDataModel = [\n {\n id: `parent@${DESIGN_DATA_TYPE_PANELS}`,\n class: \"category tree-view-item\",\n leaf: false,\n caption: this._componentLocale.tree.panels,\n leftImgSrc: \"general/knowledge-base\",\n checkbox: true,\n checked: true,\n expanded: true,\n items: this.designData.panels.map(item => ({\n id: `${item.id}@${DESIGN_DATA_TYPE_PANELS}`,\n class: \"object tree-view-item\",\n leaf: true,\n caption: item.name,\n leftImgSrc: \"general/generator\",\n checkbox: true,\n checked: true\n }))\n },\n {\n id: `parent@${DESIGN_DATA_TYPE_STENCILS}`,\n class: \"category tree-view-item\",\n leaf: false,\n caption: this._componentLocale.tree.stencils,\n leftImgSrc: \"general/knowledge-base\",\n checkbox: true,\n checked: true,\n expanded: true,\n items: this.designData.stencils.map(item => ({\n id: `${item.id}@${DESIGN_DATA_TYPE_STENCILS}`,\n class: \"object tree-view-item\",\n leaf: true,\n caption: item.name,\n leftImgSrc: \"general/generator\",\n checkbox: true,\n checked: true\n }))\n },\n {\n id: `parent@${DESIGN_DATA_TYPE_IMAGES}`,\n class: \"category tree-view-item\",\n leaf: false,\n caption: this._componentLocale.tree.images,\n leftImgSrc: \"general/knowledge-base\",\n checkbox: true,\n checked: true,\n expanded: true,\n items: this.designData.images.map(item => ({\n id: `${item.id}@${DESIGN_DATA_TYPE_IMAGES}`,\n class: \"object tree-view-item\",\n leaf: true,\n caption: item.name,\n leftImgSrc: \"general/generator\",\n checkbox: true,\n checked: true\n }))\n },\n {\n id: `parent@${DESIGN_DATA_TYPE_DESIGN_SYSTEM}`,\n class: \"category tree-view-item\",\n leaf: false,\n caption: this._componentLocale.tree.designSystem,\n leftImgSrc: \"general/knowledge-base\",\n checkbox: true,\n checked: true,\n expanded: true,\n items: this.designData.designSystem.map(item => ({\n class: \"object tree-view-item\",\n leaf: true,\n id: `${item.id}@${DESIGN_DATA_TYPE_DESIGN_SYSTEM}`,\n caption: item.name,\n leftImgSrc: \"general/generator\",\n checkbox: true,\n checked: true\n }))\n },\n {\n id: `parent@${DESIGN_DATA_TYPE_FONTS}`,\n class: \"category tree-view-item\",\n leaf: false,\n caption: this._componentLocale.tree.fonts,\n leftImgSrc: \"general/knowledge-base\",\n checkbox: true,\n checked: true,\n expanded: true,\n items: this.designData.fonts.map(item => ({\n id: `${item.id}@${DESIGN_DATA_TYPE_FONTS}`,\n class: \"object tree-view-item\",\n leaf: true,\n caption: item.name,\n leftImgSrc: \"general/generator\",\n checkbox: true,\n checked: true\n }))\n }\n ];\n }\n }\n\n /**\n * The model data loaded into the detail tree\n */\n @State() detailTreeModel: TreeViewItemModel[] = [];\n\n /**\n * If the design data is loading or not, for disabled actions\n */\n @State() isLoading = false;\n\n /**\n * The messages receive when the file is loading\n */\n @State() messages: MessageData[] = [];\n\n /**\n * The path/URL for load the design data\n */\n @State() path = \"\";\n\n /**\n * The file selected for load the design data\n */\n @State() selectedFile: File;\n\n /**\n * The type of the design data selected for show it visual tabs\n */\n @State() selectedDesignType: DesignType;\n\n /**\n * The item of the design data selected for show its contents on visual tabs\n */\n @State() selectedDesignItem: any;\n\n /**\n * When show or not the acces token input field\n */\n @State() showAccessToken: any;\n\n /**\n * the design data tree view data model\n */\n @State() designDataTreeDataModel: TreeViewItemModel[] = [];\n\n /**\n * Used to trigger a re-render after an item has been selected on renderDesignTree, in order to set the first tab as the active tab (setFirstActiveTab()), since calling this method inside objectsTreeSelectedItemsChangedHandler does not always work without a setTimeOut.\n */\n @State() counter = 0;\n @Watch(\"counter\")\n watchCounterHandler() {\n if (this.tabsEl) {\n this.tabsEl.setFirstActiveTab();\n }\n }\n\n /**\n * If true, images will be fitted in the container\n */\n @State() fitImages = false;\n\n /**\n * If true, the left tree will be shrink and expanded to allow more space for the content\n */\n @State() shrinkTree = false;\n @Watch(\"shrinkTree\")\n watchShrinkTreeHandler(shrink: boolean) {\n if (shrink) {\n this.attachTreeMouseListeners();\n } else {\n this.removeTreeMouseListeners();\n }\n }\n\n /**\n * If true the left tree will be shrunken\n */\n @State() shrunkenTree = false;\n\n @State() treeSh = false;\n\n // 4.PUBLIC PROPERTY API //\n\n /**\n * If true it displays the component title on the header\n */\n @Prop() readonly displayTitle = false;\n\n /**\n * The valid extensions for the files that will be loaded in Path/URL (ie.: \".fig, .sketch\")\n */\n @Prop() readonly extensions!: string;\n\n /**\n * The default value for the module/folder filter\n */\n @Prop() readonly defaultModule: EntityData;\n\n /**\n * Callback invoked when the action is executed in the Module/Folder filter. It returns the information of the selected object (id and name) or 'undefined' if it was canceled.\n */\n @Prop() readonly selectModuleCallback: SelectModuleCallback;\n\n /**\n * This is a function provided by the developer that cancel the load operation.\n */\n @Prop() readonly cancelCallback!: CancelCallback;\n\n /**\n * This is a function provided by the developer that init the process of import a design.\n */\n @Prop() readonly confirmCallback!: ConfirmCallback;\n\n /**\n * This is a function provided by the developer that return the list of types of data loaded from file or url.\n */\n @Prop() readonly loadCallback!: LoadCallback;\n\n /**\n * This is a function provided by the developer that return the information of a Design System type of data.\n */\n // eslint-disable-next-line prettier/prettier\n @Prop() readonly loadDesignSystemCallback!: LoadDesignSystemCallback;\n\n /**\n * This is a function provided by the developer that return the information of a Font type of data.\n */\n @Prop() readonly loadFontCallback!: LoadFontCallback;\n\n /**\n * This is a function provided by the developer that return the information of an Image System type of data.\n */\n @Prop() readonly loadImageCallback!: LoadImageCallback;\n\n /**\n * This is a function provided by the developer that return the information of a Panel type of data.\n */\n @Prop() readonly loadPanelDataCallback!: LoadPanelDataCallback;\n\n /**\n * Callback invoked to determinate if accessing to a design requires an authentication token\n */\n @Prop() readonly requiresAccessTokenCallback!: RequiresAccessTokenCallback;\n\n /**\n * Applies a shadow all around\n */\n @Prop() readonly shadow = false;\n\n /**\n * The styles render in the option style selector\n */\n @Prop() readonly styles!: GxOption[];\n\n /**\n * This is a function provided by the developer for create an instance of a text editor.\n */\n // eslint-disable-next-line prettier/prettier\n @Prop() readonly textEditorFactoryCallback!: TextEditorFactoryCallback;\n\n // 5.EVENTS (EMIT) //\n\n /**\n * This event is emitted once just after the component is fully loaded and the first render() occurs\n */\n @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n // 6.COMPONENT LIFECYCLE EVENTS //\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n }\n\n componentDidRender() {\n if (!this.renderedFirstTime) {\n this.componentDidRenderFirstTime.emit(\n this._componentLocale.componentName\n );\n this.renderedFirstTime = true;\n }\n }\n\n disconnectedCallback() {\n this.removeTreeMouseListeners();\n }\n\n // 7.LISTENERS //\n\n @Watch(\"messages\")\n watchMessagesHandler(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n if (this.messagesList) {\n this.messagesList.scrollTop = this.messagesList.scrollHeight;\n }\n }\n }\n\n // 8.PUBLIC METHODS API //\n\n /**\n * Validate necessary data input\n */\n @Method()\n async validate(): Promise<boolean> {\n const isValid = true;\n return isValid;\n }\n\n // 9.LOCAL METHODS //\n\n private attachTreeMouseListeners = () => {\n this.treeDataEl.addEventListener(\"mouseenter\", this.treeMouseEnter);\n this.treeDataEl.addEventListener(\"mouseleave\", this.treeMouseLeave);\n };\n private removeTreeMouseListeners = () => {\n this.treeDataEl.removeEventListener(\"mouseenter\", this.treeMouseEnter);\n this.treeDataEl.removeEventListener(\"mouseleave\", this.treeMouseLeave);\n };\n private treeMouseEnter = () => {\n this.shrunkenTree = false;\n };\n private treeMouseLeave = () => {\n this.shrunkenTree = true;\n };\n\n private messageType = (message: MessageData): TextType => {\n if (message.type === \"error\") {\n return \"text-alert-error\";\n } else if (message.type === \"warning\") {\n return \"text-alert-warning\";\n } else {\n return \"text-gray\";\n }\n };\n\n private loadTreeItemCompositionModel(\n controls: DesignPanelControlData[]\n ): TreeViewItemModel[] {\n const modelList: TreeViewItemModel[] = [];\n for (const control of controls) {\n let model: TreeViewItemModel = {\n id: control.name,\n caption: control.name,\n leftImgSrc: control.type,\n checkbox: false,\n expanded: true,\n leaf: control.leaf\n };\n if (control.controls) {\n model = {\n ...model,\n items: this.loadTreeItemCompositionModel(control.controls)\n };\n }\n modelList.push(model);\n }\n return modelList;\n }\n\n private objectsTreeSelectedItemsChangedHandler = async (\n event: CustomEvent<TreeViewItemModelExtended[]>\n ) => {\n if (event.detail.length) {\n const item = event.detail[0]?.item;\n const itemComposedId = item.id;\n const idList = itemComposedId.split(\"@\");\n const itemId = idList[0];\n const itemDesignType: DesignType = idList[1] as DesignType;\n if (itemId && itemId !== \"parent\") {\n this.selectedDesignType = itemDesignType;\n const loadedItem = this.getLoadedItem(itemComposedId);\n if (!loadedItem) {\n const designDataDetail: DesignItemDataDetail =\n await this.getDesignDataDetail(itemId, this.selectedDesignType);\n this.loadedItems.set(itemComposedId, {\n designType: this.selectedDesignType,\n designDataDetail: designDataDetail\n });\n } else {\n /* Item has been queried already. The item content exists already. */\n this.selectedDesignType = loadedItem.designType;\n this.selectedDesignItem = loadedItem.designDataDetail;\n this.getCodeFactory(loadedItem.designType);\n this.renderDetailDataTree(loadedItem.designType);\n }\n }\n }\n };\n\n private getLoadedItem = (id: string): ItemLoadedInfo | undefined => {\n return this.loadedItems?.get(id);\n };\n\n private objectsTreeCheckedItemsChangedHandler = (\n event: CustomEvent<Map<string, TreeViewItemModelExtended>>\n ) => {\n const items = Array.from(event.detail.values());\n let currentParentId = null;\n const result: { [key: string]: string[] } = {};\n\n for (const item of items) {\n if (item.item.id.startsWith(\"parent@\")) {\n currentParentId = item.item.id.split(\"@\")[1];\n result[currentParentId] = [];\n } else if (item.item.checked && currentParentId) {\n const parentId = item.item.id.split(\"@\")[1];\n if (parentId === currentParentId) {\n const id = item.item.id.split(\"@\")[0];\n result[currentParentId].push(id);\n }\n }\n }\n // const { designSystem, fonts, images, panels, stencils } = result;\n const { fonts, panels, stencils } = result;\n\n // this.designSystemSelected = designSystem;\n this.fontsSelected = fonts;\n // this.imagesSelected = images;\n this.panelsSelected = panels;\n this.stencilsSelected = stencils;\n };\n\n private selectFile = (): void => {\n this.optionPathEl.openFile();\n };\n\n private pathOnInputHandler = (e: any) => {\n this.path = e.detail;\n };\n\n private pathOnFileSelected = (e: any) => {\n this.selectedFile = e.detail[0];\n const fileName = e.detail[0].name;\n this.path = fileName;\n\n this.evaluateAccessToken();\n };\n\n private evaluateAccessToken = async () => {\n this.showAccessToken = await this.requiresAccessTokenCallback(\n this.optionPathEl.value\n );\n };\n\n private loadData = async (): Promise<void> => {\n this.isLoading = true;\n const source = this.selectedFile ? this.selectedFile : this.path;\n const token = this.accessTokenEl ? this.accessTokenEl.value : undefined;\n this.designData = null;\n await this.loadCallback(source, token, this.messageCallback).then(\n (designData: DesignData) => {\n // this.isLoading = false;\n this.messages = [];\n this.designData = designData;\n if (this.designData) {\n this.panelsSelected = [\n ...this.designData.panels.map(item => item.id)\n ];\n this.stencilsSelected = [\n ...this.designData.stencils.map(item => item.id)\n ];\n // this.imagesSelected = [\n // ...this.designData.images.map(item => item.id)\n // ];\n // this.designSystemSelected = [\n // ...this.designData.designSystem.map(item => item.id)\n // ];\n this.fontsSelected = [...this.designData.fonts.map(item => item.id)];\n } else {\n // There was probably an error\n this.panelsSelected = [];\n this.stencilsSelected = [];\n // this.imagesSelected = [];\n // this.designSystemSelected = [];\n this.fontsSelected = [];\n }\n }\n );\n this.isLoading = false;\n };\n\n private messageCallback: LoadMessageCallback = message => {\n this.messages = [...this.messages, message];\n };\n\n private getDesignDataDetail = async (\n id: string,\n designType: DesignType\n ): Promise<DesignItemDataDetail> => {\n let loadFn:\n | LoadPanelDataCallback\n | LoadImageCallback\n | LoadFontCallback\n | LoadDesignSystemCallback;\n\n switch (designType) {\n case DESIGN_DATA_TYPE_IMAGES:\n loadFn = this.loadImageCallback;\n break;\n case DESIGN_DATA_TYPE_DESIGN_SYSTEM:\n loadFn = this.loadDesignSystemCallback;\n break;\n case DESIGN_DATA_TYPE_FONTS:\n loadFn = this.loadFontCallback;\n break;\n case DESIGN_DATA_TYPE_PANELS:\n case DESIGN_DATA_TYPE_STENCILS:\n loadFn = this.loadPanelDataCallback;\n break;\n }\n\n let returnedData: DesignItemDataDetail;\n await loadFn(id).then((data: DesignItemDataDetail) => {\n this.selectedDesignType = designType;\n this.selectedDesignItem = data;\n this.getCodeFactory(designType);\n this.renderDetailDataTree(designType);\n returnedData = data;\n });\n\n return returnedData;\n };\n\n private getCodeFactory(designType: string) {\n switch (designType) {\n case DESIGN_DATA_TYPE_PANELS:\n case DESIGN_DATA_TYPE_STENCILS:\n this.textEditorFactoryCallback(\n \"html\",\n this.codeFactoryRenderEl,\n this.selectedDesignItem.code\n );\n break;\n case DESIGN_DATA_TYPE_DESIGN_SYSTEM:\n this.textEditorFactoryCallback(\n \"tokens\",\n this.tokensFactoryRenderEl,\n this.selectedDesignItem.tokens\n );\n this.textEditorFactoryCallback(\n \"styles\",\n this.stylesFactoryRenderEl,\n this.selectedDesignItem.styles\n );\n break;\n }\n }\n\n private confirm = (): void => {\n this.confirmCallback({\n panels: this.panelsSelected,\n stencils: this.stencilsSelected,\n fonts: this.fontsSelected,\n /* images: this.imagesSelected, */\n moduleId: this.filterModuleEl?.value?.id,\n styleName: this.optionStyleEl.value,\n importAsWebPanels: this.optionImportAsEl.checked\n });\n };\n\n private cancel = (): void => {\n this.cancelCallback();\n this.isLoading = false;\n };\n\n private fitImagesHandler = (e: CustomEvent<CheckboxInfo>) => {\n this.fitImages = e.detail.value;\n };\n\n private shrinkTreeHandler = (e: CustomEvent<CheckboxInfo>) => {\n const checked = e.detail.value;\n this.shrinkTree = checked;\n if (checked) {\n this.shrunkenTree = true;\n } else {\n this.shrunkenTree = false;\n }\n };\n\n // 9.LOCAL METHODS -> RENDERS //\n\n private renderOptions = (): Element => {\n return (\n <div\n class={{\n \"options grid\": true,\n \"options--hide-access-token\": !this.showAccessToken\n }}\n >\n {/* #path/url label*/}\n <gxg-label class=\"path-url-label\">\n {this._componentLocale.options.path}\n </gxg-label>\n\n <div class=\"path-url-wrapper\">\n {/* #path/url input*/}\n <gxg-form-text\n value={this.path}\n onInput={this.pathOnInputHandler}\n onFileSelected={this.pathOnFileSelected}\n onBlur={this.evaluateAccessToken}\n ref={(el: HTMLGxgFormTextElement) =>\n (this.optionPathEl = el as HTMLGxgFormTextElement)\n }\n part=\"option-path\"\n disabled={this.isLoading}\n type=\"file\"\n acceptFile={this.extensions}\n class=\"path-url\"\n placeholder={this._componentLocale.options.pathPlaceholder}\n ></gxg-form-text>\n\n <div class=\"path-url-wrapper__buttons-container\">\n {/* #select file button*/}\n <gxg-button\n id=\"button-select-file\"\n type=\"primary-text-only\"\n onClick={this.selectFile}\n part=\"gxg-button gxg-button--select-file\"\n disabled={this.isLoading}\n class=\"select-file\"\n >\n ...\n </gxg-button>\n\n {/* #load file button*/}\n <gxg-button\n id=\"button-load\"\n type=\"primary-text-only\"\n onClick={this.loadData}\n part=\"gxg-button gxg-button--load\"\n disabled={this.path.length === 0 || this.isLoading}\n class=\"load-file\"\n >\n {this._componentLocale.options.btnLoad}\n </gxg-button>\n </div>\n </div>\n\n {/* #access token*/}\n {this.showAccessToken\n ? [\n <gxg-label class={{ \"access-token-label\": true }}>\n {this._componentLocale.options.accessToken}\n </gxg-label>,\n <gxg-form-text\n class={{ \"access-token\": true }}\n ref={(el: HTMLGxgFormTextElement) =>\n (this.accessTokenEl = el as HTMLGxgFormTextElement)\n }\n part=\"access-token\"\n disabled={this.isLoading}\n ></gxg-form-text>\n ]\n : null}\n\n {/* #style label*/}\n <gxg-label class=\"style-label\">\n {this._componentLocale.options.style}\n </gxg-label>\n\n {/* #style*/}\n <gxg-combo-box\n disabled={!this.styles || this.isLoading}\n display-validation-styles\n display-validation-message\n ref={(el: HTMLGxgComboBoxElement) =>\n (this.optionStyleEl = el as HTMLGxgComboBoxElement)\n }\n part=\"option-style\"\n class=\"style\"\n >\n {renderFormItems(\"gxg-combo-box-item\", this.styles ?? [])}\n </gxg-combo-box>\n\n {/* #module label*/}\n <gxg-label class=\"module-label\">\n {this._componentLocale.options.module}\n </gxg-label>\n\n {/* #module*/}\n <gx-ide-entity-selector\n value={this.defaultModule}\n defaultValue={this.defaultModule}\n selectEntityCallback={this.selectModuleCallback}\n ref={(el: HTMLGxIdeEntitySelectorElement) =>\n (this.filterModuleEl = el as HTMLGxIdeEntitySelectorElement)\n }\n class=\"module\"\n ></gx-ide-entity-selector>\n <div class=\"checkboxes-options\">\n {/* # import as web panels*/}\n <gxg-form-checkbox\n label={this._componentLocale.options.importAs}\n class=\"import-as-web-panels\"\n ref={(el: HTMLGxgFormCheckboxElement) =>\n (this.optionImportAsEl = el as HTMLGxgFormCheckboxElement)\n }\n part=\"option-import-as-web-panels\"\n disabled={this.isLoading}\n ></gxg-form-checkbox>\n\n <div\n class={{\n \"checkboxes-options__col-right\": true,\n \"checkboxes-options__col-right--hidden\":\n !this.designDataTreeDataModel.length\n }}\n >\n {/* # fit images*/}\n <gxg-form-checkbox\n label={this._componentLocale.options.fitImages}\n part=\"fit-images-checkbox\"\n disabled={this.isLoading || !this.designDataTreeDataModel.length}\n onChange={this.fitImagesHandler}\n ></gxg-form-checkbox>\n\n {/* # shrink tree*/}\n <gxg-form-checkbox\n label={this._componentLocale.options.toggleTree}\n part=\"shrink-tree-checkbox\"\n disabled={this.isLoading || !this.designDataTreeDataModel.length}\n onChange={this.shrinkTreeHandler}\n ></gxg-form-checkbox>\n </div>\n </div>\n </div>\n );\n };\n\n private renderMessages = (): Element => {\n return this.messages.length > 0 ? (\n <div\n class=\"messages-container\"\n ref={(el: HTMLElement) => (this.messagesList = el as HTMLElement)}\n >\n {this.messages.map(message => (\n <gxg-text type={this.messageType(message)}>\n {message.type}: {message.text}\n </gxg-text>\n ))}\n </div>\n ) : null;\n };\n\n private renderDetailDataTree(designType: string) {\n switch (designType) {\n case DESIGN_DATA_TYPE_PANELS:\n case DESIGN_DATA_TYPE_STENCILS:\n this.detailTreeModel = this.loadTreeItemCompositionModel(\n this.selectedDesignItem.composition.controls\n );\n break;\n }\n }\n\n private renderMain = () => {\n if (this.designData) {\n return (\n /* #main*/\n <main\n class={{ \"main\": true, \"main--shrunken-tree\": this.shrunkenTree }}\n >\n {[this.renderDesignTree(), this.renderDesignTabs()]}\n </main>\n );\n } else if (!this.isLoading) {\n return <main class=\"main\">{this.renderNoDesignData()}</main>;\n } else {\n return this.renderMessages();\n }\n };\n\n private renderNoDesignData = () => {\n if (!this.isLoading) {\n return (\n <gxg-text\n textAlign={config.gxgMessage.common.textAlign as TextAlign}\n padding={config.gxgMessage.common.textAlign as TextPadding}\n type={config.gxgMessage.common.type as TextType}\n maxWidth={config.gxgMessage.common.maxWidth}\n part=\"no-design-selected\"\n >\n {this._componentLocale.messages.noDesignSelected} <br />\n <gxg-text\n type=\"text-link-no-line\"\n onClick={this.selectFile}\n part=\"begin-by-loading-one\"\n >\n {this._componentLocale.messages.selectDesign}\n </gxg-text>\n </gxg-text>\n );\n }\n };\n\n private renderDesignTree = (): HTMLGxgTreeViewElement => {\n return (\n <div class=\"tree-container\">\n <gxg-tree-view\n part=\"data-tree\"\n class=\"design-tree\"\n id=\"data-tree\"\n treeModel={this.designDataTreeDataModel}\n dragDisabled={true}\n dropDisabled={true}\n toggleCheckboxes={true}\n checkbox={true}\n checked={true}\n onCheckedItemsChange={this.objectsTreeCheckedItemsChangedHandler}\n onSelectedItemsChange={this.objectsTreeSelectedItemsChangedHandler}\n ref={el => (this.treeDataEl = el as HTMLGxgTreeViewElement)}\n ></gxg-tree-view>\n </div>\n );\n };\n\n private renderFooter = () => {\n return [\n <gxg-button\n id=\"button-ok\"\n type=\"primary-text-only\"\n onClick={this.confirm}\n part=\"gxg-button gxg-button--ok\"\n disabled={this.isLoading}\n slot=\"footer-end\"\n >\n {this._componentLocale.footer.btnOk}\n </gxg-button>,\n <gxg-button\n id=\"button-cancel\"\n type=\"outlined\"\n onClick={this.cancel}\n part=\"gxg-button gxg-button--cancel\"\n slot=\"footer-end\"\n >\n {this._componentLocale.footer.btnCancel}\n </gxg-button>\n ];\n };\n\n private renderPanelTab = (): Element => {\n const renderControlsTree =\n (this.selectedDesignType === DESIGN_DATA_TYPE_PANELS ||\n this.selectedDesignType === DESIGN_DATA_TYPE_STENCILS) &&\n this.detailTreeModel.length > 0;\n\n return (\n <div\n class={{\n \"panel-tab\": true,\n \"panel-tab--controls-tree\": renderControlsTree\n }}\n part=\"data-panel-composition-container\"\n >\n {this.selectedDesignItem &&\n this.selectedDesignItem.composition &&\n this.selectedDesignItem.composition.preview ? (\n <div part=\"data-panel-composition-preview\" class=\"panel-item\">\n <img\n src={\n this.selectedDesignItem && this.selectedDesignItem.composition\n ? this.selectedDesignItem.composition.preview\n : undefined\n }\n alt=\"Preview\"\n />\n </div>\n ) : null}\n\n {renderControlsTree ? (\n <gxg-tree-view\n part=\"data-panel-composition-tree\"\n class=\"panel-item\"\n id=\"gxg-tree-panel-data\"\n treeModel={this.detailTreeModel}\n dragDisabled={true}\n dropDisabled={true}\n ></gxg-tree-view>\n ) : null}\n </div>\n );\n };\n\n private renderImageTab = () => {\n return (\n <div part=\"data-panel-composition-preview\" class=\"data-preview\">\n <img\n src={this.selectedDesignItem ? this.selectedDesignItem : undefined}\n alt=\"Preview\"\n />\n </div>\n );\n };\n\n private renderDesignTabs = (): Element => {\n this.counter++;\n return (\n <gxg-tabs\n class={{\n \"design-tabs\": true,\n \"design-tabs--fit-images\": this.fitImages\n }}\n part=\"data-tabs\"\n no-border\n noPadding\n buttonsBorderAbove\n ref={(el: HTMLGxgTabsElement) =>\n (this.tabsEl = el as HTMLGxgTabsElement)\n }\n >\n <gxg-tab-bar slot=\"tab-bar-container\">\n {/* tokens*/}\n <gxg-tab-button\n hidden={\n !this.selectedDesignType ||\n this.selectedDesignType !== DESIGN_DATA_TYPE_DESIGN_SYSTEM\n }\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.tokens}\n tab=\"tokens\"\n key=\"tokens\"\n is-selected\n ></gxg-tab-button>\n {/* styles*/}\n <gxg-tab-button\n hidden={\n !this.selectedDesignType ||\n this.selectedDesignType !== DESIGN_DATA_TYPE_DESIGN_SYSTEM\n }\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.styles}\n tab=\"styles\"\n key=\"styles\"\n ></gxg-tab-button>\n {/* composition*/}\n <gxg-tab-button\n hidden={\n !this.selectedDesignType ||\n this.selectedDesignType === DESIGN_DATA_TYPE_DESIGN_SYSTEM\n }\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.composition}\n tab=\"composition\"\n key=\"composition\"\n is-selected\n ></gxg-tab-button>\n {/* code*/}\n <gxg-tab-button\n hidden={\n !this.selectedDesignType ||\n (this.selectedDesignType !== DESIGN_DATA_TYPE_PANELS &&\n this.selectedDesignType !== DESIGN_DATA_TYPE_STENCILS)\n }\n slot=\"tab-bar\"\n tab-label={this._componentLocale.tabs.code}\n tab=\"code\"\n key=\"code\"\n ></gxg-tab-button>\n </gxg-tab-bar>\n {/* tokens */}\n <gxg-tab tab=\"tokens\" key=\"tokens\">\n <div\n ref={(el: HTMLElement) =>\n (this.tokensFactoryRenderEl = el as HTMLElement)\n }\n ></div>\n </gxg-tab>\n {/* styles */}\n <gxg-tab tab=\"styles\" key=\"styles\">\n <div\n ref={(el: HTMLElement) =>\n (this.stylesFactoryRenderEl = el as HTMLElement)\n }\n ></div>\n </gxg-tab>\n {/* composition */}\n <gxg-tab tab=\"composition\" key=\"composition\">\n {this.selectedDesignType === DESIGN_DATA_TYPE_IMAGES ||\n this.selectedDesignType === DESIGN_DATA_TYPE_FONTS\n ? this.renderImageTab()\n : this.renderPanelTab()}\n </gxg-tab>\n {/* code */}\n <gxg-tab tab=\"code\" key=\"code\">\n <div\n ref={(el: HTMLElement) =>\n (this.codeFactoryRenderEl = el as HTMLElement)\n }\n ></div>\n </gxg-tab>\n </gxg-tabs>\n );\n };\n\n // 10.RENDER() FUNCTION //\n\n render(): void {\n return (\n <Host class=\"gx-ide-component\">\n <div class=\"gx-ide-main-wrapper\">\n <gx-ide-container\n noContentPadding\n noContentGap\n displayBorderBottom\n part=\"options-container\"\n slimmerFooter={config.gxIdeContainer.slimmerFooter}\n containerTitle={\n this.displayTitle ? this._componentLocale.componentName : null\n }\n >\n {this.renderOptions()}\n {this.renderMain()}\n {this.renderFooter()}\n </gx-ide-container>\n </div>\n </Host>\n );\n }\n}\n\nexport type LoadMessageCallback = (message: MessageData) => void;\nexport type LoadCallback = (\n source: string | File,\n token: string | undefined,\n onMessage: LoadMessageCallback\n) => Promise<DesignData | undefined>;\nexport type LoadPanelDataCallback = (id: string) => Promise<DesignPanelData>;\nexport type LoadImageCallback = (id: string) => Promise<string>;\nexport type LoadFontCallback = (id: string) => Promise<string>;\nexport type LoadDesignSystemCallback = (\n id: string\n) => Promise<DesignSystemData>;\nexport type TextEditorFactoryCallback = (\n type: TextEditorType,\n parent: HTMLElement,\n text: string\n) => Promise<void>;\nexport type SelectModuleCallback = () => Promise<EntityData | undefined>;\n\nexport type RequiresAccessTokenCallback = (source: string) => Promise<boolean>;\nexport type ConfirmCallback = (data: DesignImportData) => Promise<boolean>;\nexport type CancelCallback = () => Promise<void>;\n\nexport interface MessageData {\n type: \"error\" | \"warning\" | \"info\";\n text: string;\n}\n\nexport interface DesignData {\n panels: DesignItemData[];\n stencils: DesignItemData[];\n images: DesignItemData[];\n designSystem: DesignItemData[];\n fonts: DesignItemData[];\n}\n\nexport interface DesignItemData {\n id: string;\n name: string;\n}\n\nexport interface DesignPanelData {\n composition: DesignPanelCompositionData;\n code?: string;\n}\n\nexport interface DesignPanelCompositionData {\n preview?: string;\n controls: DesignPanelControlData[];\n}\n\nexport interface DesignPanelControlData {\n name: string;\n type: string;\n leaf?: boolean;\n controls: DesignPanelControlData[];\n}\n\nexport interface DesignSystemData {\n tokens: string;\n styles: string;\n}\n\ntype DesignItemDataDetail = DesignPanelData | DesignSystemData | string;\n\nexport interface DesignImportData {\n panels: string[];\n stencils: string[];\n fonts: string[];\n moduleId: string;\n /* images: string[]; */\n styleName: string;\n importAsWebPanels: boolean;\n}\n\nexport type DesignType =\n | typeof DESIGN_DATA_TYPE_PANELS\n | typeof DESIGN_DATA_TYPE_STENCILS\n | typeof DESIGN_DATA_TYPE_IMAGES\n | typeof DESIGN_DATA_TYPE_DESIGN_SYSTEM\n | typeof DESIGN_DATA_TYPE_FONTS;\n\nexport type ItemLoadedInfo = {\n designType: DesignType;\n designDataDetail: DesignItemDataDetail;\n};\n\ntype TextEditorType = \"html\" | \"styles\" | \"tokens\";\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"names":["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","activeItem","disabled","disabledHandler","checkboxes","checkbox","handleKeyDown","e","ctrlKey","cmdKey","metaKey","shiftKey","code","preventDefault","handleArrow","unselectHighlightedItems","clearSelectedItems","selectItems","clearHighlightedItems","checked","highlightAll","direction","newElement","activeElement","getNextItem","getPrevItem","unhighlightAll","setActiveItem","highlightItem","repositionScroll","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","clientHeight","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/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":[":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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"}