@genexus/genexus-ide-ui 0.0.45 → 0.0.47

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 (208) hide show
  1. package/dist/cjs/{ch-tree-x_3.cjs.entry.js → ch-checkbox_4.cjs.entry.js} +249 -184
  2. package/dist/cjs/ch-global-stylesheet-0e78f960.js +20 -0
  3. package/dist/cjs/ch-grid-action-refresh_6.cjs.entry.js +43 -37
  4. package/dist/cjs/ch-grid-infinite-scroll.cjs.entry.js +57 -0
  5. package/dist/cjs/ch-grid-virtual-scroller.cjs.entry.js +31 -25
  6. package/dist/cjs/ch-grid_8.cjs.entry.js +30 -21
  7. package/dist/cjs/ch-style.cjs.entry.js +5 -5
  8. package/dist/cjs/ch-suggest_4.cjs.entry.js +1 -1
  9. package/dist/cjs/ch-test-tree-x.cjs.entry.js +26 -6
  10. package/dist/cjs/ch-window_2.cjs.entry.js +2 -2
  11. package/dist/cjs/{common-facb7f18.js → common-5d08e273.js} +10 -4
  12. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  13. package/dist/cjs/gx-ide-container_5.cjs.entry.js +2 -2
  14. package/dist/cjs/gx-ide-create-kb-from-server.cjs.entry.js +2 -2
  15. package/dist/cjs/gx-ide-entity-selector_2.cjs.entry.js +2 -2
  16. package/dist/cjs/gx-ide-new-environment.cjs.entry.js +1 -1
  17. package/dist/cjs/gx-ide-new-kb.cjs.entry.js +40 -55
  18. package/dist/cjs/gx-ide-new-object.cjs.entry.js +1 -4
  19. package/dist/cjs/gx-ide-team-dev-select-recent-comment.cjs.entry.js +1 -1
  20. package/dist/cjs/gx-ide-ww-images.cjs.entry.js +1 -1
  21. package/dist/cjs/gxg-button.cjs.entry.js +1 -1
  22. package/dist/cjs/gxg-combo-box_2.cjs.entry.js +39 -42
  23. package/dist/cjs/gxg-drop-down.cjs.entry.js +1 -1
  24. package/dist/cjs/gxg-form-checkbox.cjs.entry.js +1 -1
  25. package/dist/cjs/gxg-form-text.cjs.entry.js +3 -2
  26. package/dist/cjs/gxg-form-textarea.cjs.entry.js +1 -1
  27. package/dist/cjs/gxg-label_2.cjs.entry.js +1 -1
  28. package/dist/cjs/gxg-list-box_2.cjs.entry.js +71 -60
  29. package/dist/cjs/gxg-menu-slim-item.cjs.entry.js +1 -1
  30. package/dist/cjs/gxg-option.cjs.entry.js +1 -1
  31. package/dist/cjs/gxg-select.cjs.entry.js +1 -1
  32. package/dist/cjs/gxg-test.cjs.entry.js +86 -79
  33. package/dist/cjs/gxg-tree-view.cjs.entry.js +342 -0
  34. package/dist/cjs/gxg-tree_2.cjs.entry.js +1 -1
  35. package/dist/cjs/{helpers-8845f008.js → helpers-291cb1cb.js} +10 -0
  36. package/dist/cjs/loader.cjs.js +1 -1
  37. package/dist/collection/collection-manifest.json +2 -0
  38. package/dist/collection/common/common.js +10 -4
  39. package/dist/collection/components/container/container.css +5 -0
  40. package/dist/collection/components/create-kb-from-server/create-kb-from-server.js +1 -1
  41. package/dist/collection/components/entity-selector/entity-selector.css +1 -1
  42. package/dist/collection/components/new-kb/gx-ide-assets/new-kb/langs/new-kb.lang.en.json +50 -10
  43. package/dist/collection/components/new-kb/new-kb.js +39 -54
  44. package/dist/collection/components/new-object/new-object.js +1 -4
  45. package/dist/collection/components/team-dev-select-recent-comment/team-dev-select-recent-comment.js +1 -1
  46. package/dist/components/button.js +1 -1
  47. package/dist/components/ch-global-stylesheet.js +14 -1
  48. package/dist/components/ch-grid-infinite-scroll.js +75 -0
  49. package/dist/components/ch-grid-rowset-legend.js +32 -1
  50. package/dist/components/ch-grid-virtual-scroller.js +32 -25
  51. package/dist/components/ch-grid2.js +30 -21
  52. package/dist/components/ch-paginator2.js +43 -37
  53. package/dist/components/ch-style.js +5 -5
  54. package/dist/components/ch-test-tree-x.js +29 -7
  55. package/dist/components/ch-window2.js +2 -2
  56. package/dist/components/combo-box-item.js +2 -2
  57. package/dist/components/combo-box.js +37 -41
  58. package/dist/components/common.js +10 -4
  59. package/dist/components/container.js +1 -1
  60. package/dist/components/date-picker.js +1 -1
  61. package/dist/components/entity-selector.js +1 -1
  62. package/dist/components/form-checkbox.js +1 -1
  63. package/dist/components/form-text.js +3 -2
  64. package/dist/components/form-textarea.js +1 -1
  65. package/dist/components/gx-ide-create-kb-from-server.js +1 -1
  66. package/dist/components/gx-ide-new-kb.js +40 -55
  67. package/dist/components/gx-ide-new-object.js +1 -4
  68. package/dist/components/gx-ide-team-dev-select-recent-comment.js +1 -1
  69. package/dist/components/gxg-drop-down.js +1 -1
  70. package/dist/components/gxg-label2.js +1 -1
  71. package/dist/components/gxg-menu-slim-item.js +1 -1
  72. package/dist/components/gxg-option.js +1 -1
  73. package/dist/components/gxg-select.js +1 -1
  74. package/dist/components/gxg-test.js +106 -145
  75. package/dist/components/gxg-tree-item2.js +1 -1
  76. package/dist/components/gxg-tree-view.js +393 -0
  77. package/dist/components/helpers.js +10 -1
  78. package/dist/components/index.js +2 -0
  79. package/dist/components/list-box-item.js +15 -18
  80. package/dist/components/list-box.js +58 -46
  81. package/dist/components/suggest.js +1 -1
  82. package/dist/components/tab-button.js +1 -1
  83. package/dist/components/tree-x-list-item.js +42 -48
  84. package/dist/components/tree-x-list.js +2 -51
  85. package/dist/components/tree-x.js +124 -91
  86. package/dist/esm/{ch-tree-x_3.entry.js → ch-checkbox_4.entry.js} +249 -185
  87. package/dist/esm/ch-global-stylesheet-4638bea5.js +16 -0
  88. package/dist/esm/ch-grid-action-refresh_6.entry.js +43 -37
  89. package/dist/esm/ch-grid-infinite-scroll.entry.js +53 -0
  90. package/dist/esm/ch-grid-virtual-scroller.entry.js +31 -25
  91. package/dist/esm/ch-grid_8.entry.js +30 -21
  92. package/dist/esm/ch-style.entry.js +5 -5
  93. package/dist/esm/ch-suggest_4.entry.js +1 -1
  94. package/dist/esm/ch-test-tree-x.entry.js +26 -6
  95. package/dist/esm/ch-window_2.entry.js +2 -2
  96. package/dist/esm/{common-a3df0966.js → common-ec35ec2f.js} +10 -4
  97. package/dist/esm/genexus-ide-ui.js +1 -1
  98. package/dist/esm/gx-ide-container_5.entry.js +2 -2
  99. package/dist/esm/gx-ide-create-kb-from-server.entry.js +2 -2
  100. package/dist/esm/gx-ide-entity-selector_2.entry.js +2 -2
  101. package/dist/esm/gx-ide-new-environment.entry.js +1 -1
  102. package/dist/esm/gx-ide-new-kb.entry.js +40 -55
  103. package/dist/esm/gx-ide-new-object.entry.js +1 -4
  104. package/dist/esm/gx-ide-team-dev-select-recent-comment.entry.js +1 -1
  105. package/dist/esm/gx-ide-ww-images.entry.js +1 -1
  106. package/dist/esm/gxg-button.entry.js +1 -1
  107. package/dist/esm/gxg-combo-box_2.entry.js +39 -42
  108. package/dist/esm/gxg-drop-down.entry.js +1 -1
  109. package/dist/esm/gxg-form-checkbox.entry.js +1 -1
  110. package/dist/esm/gxg-form-text.entry.js +3 -2
  111. package/dist/esm/gxg-form-textarea.entry.js +1 -1
  112. package/dist/esm/gxg-label_2.entry.js +1 -1
  113. package/dist/esm/gxg-list-box_2.entry.js +71 -60
  114. package/dist/esm/gxg-menu-slim-item.entry.js +1 -1
  115. package/dist/esm/gxg-option.entry.js +1 -1
  116. package/dist/esm/gxg-select.entry.js +1 -1
  117. package/dist/esm/gxg-test.entry.js +87 -80
  118. package/dist/esm/gxg-tree-view.entry.js +338 -0
  119. package/dist/esm/gxg-tree_2.entry.js +1 -1
  120. package/dist/esm/{helpers-56190205.js → helpers-1ecd5e26.js} +10 -1
  121. package/dist/esm/loader.js +1 -1
  122. package/dist/genexus-ide-ui/genexus-ide-ui.css +2 -2
  123. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  124. package/dist/genexus-ide-ui/gx-ide-assets/new-kb/langs/new-kb.lang.en.json +50 -10
  125. package/dist/genexus-ide-ui/p-052744b8.entry.js +1 -0
  126. package/dist/genexus-ide-ui/{p-9014609e.entry.js → p-059830b9.entry.js} +1 -1
  127. package/dist/genexus-ide-ui/{p-e5a3e3b9.entry.js → p-282b73f8.entry.js} +1 -1
  128. package/dist/genexus-ide-ui/{p-6da13f78.entry.js → p-2aeae374.entry.js} +1 -1
  129. package/dist/genexus-ide-ui/p-437069b0.entry.js +1 -0
  130. package/dist/genexus-ide-ui/p-447c3a31.entry.js +1 -0
  131. package/dist/genexus-ide-ui/p-4ff84cb2.entry.js +1 -0
  132. package/dist/genexus-ide-ui/{p-c38c6957.entry.js → p-54d15f4d.entry.js} +1 -1
  133. package/dist/genexus-ide-ui/p-5c0cb73d.entry.js +1 -0
  134. package/dist/genexus-ide-ui/{p-0141cbce.entry.js → p-5cb871e3.entry.js} +1 -1
  135. package/dist/genexus-ide-ui/{p-a82042ee.entry.js → p-64cbe277.entry.js} +1 -1
  136. package/dist/genexus-ide-ui/{p-50c603e6.entry.js → p-7c88194a.entry.js} +1 -1
  137. package/dist/genexus-ide-ui/p-7dbe195c.entry.js +1 -0
  138. package/dist/genexus-ide-ui/p-8c4b08ea.entry.js +1 -0
  139. package/dist/genexus-ide-ui/p-93b1e1e9.entry.js +1 -0
  140. package/dist/genexus-ide-ui/p-98c6b820.entry.js +1 -0
  141. package/dist/genexus-ide-ui/p-9aa2dd17.entry.js +1 -0
  142. package/dist/genexus-ide-ui/p-9ba292a0.entry.js +1 -0
  143. package/dist/genexus-ide-ui/p-a2fa3132.entry.js +1 -0
  144. package/dist/genexus-ide-ui/p-b374d112.js +1 -0
  145. package/dist/genexus-ide-ui/p-b5dc509f.entry.js +1 -0
  146. package/dist/genexus-ide-ui/p-b8d5c561.js +1 -0
  147. package/dist/genexus-ide-ui/p-c0edbeb5.entry.js +1 -0
  148. package/dist/genexus-ide-ui/{p-f1116ac5.entry.js → p-cbeac1ab.entry.js} +1 -1
  149. package/dist/genexus-ide-ui/p-cd5482fa.entry.js +1 -0
  150. package/dist/genexus-ide-ui/{p-6c825ffc.entry.js → p-ce7a7b5f.entry.js} +1 -1
  151. package/dist/genexus-ide-ui/p-d02f6ce4.entry.js +1 -0
  152. package/dist/genexus-ide-ui/p-d30c5a8e.entry.js +1 -0
  153. package/dist/genexus-ide-ui/p-d312fe25.entry.js +1 -0
  154. package/dist/genexus-ide-ui/p-d557b2fe.entry.js +1 -0
  155. package/dist/genexus-ide-ui/{p-72e1b9d5.entry.js → p-e586d05e.entry.js} +1 -1
  156. package/dist/genexus-ide-ui/p-e6ae0460.entry.js +1 -0
  157. package/dist/genexus-ide-ui/p-eb8f4ad5.js +1 -0
  158. package/dist/genexus-ide-ui/p-eddf8a1e.entry.js +1 -0
  159. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/grid/grid-infinite-scroll/ch-grid-infinite-scroll.css +9 -0
  160. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-tree-x.css +1 -1
  161. package/dist/node_modules/@genexus/gemini/dist/collection/components/button/button.css +1 -1
  162. package/dist/node_modules/@genexus/gemini/dist/collection/components/combo-box-item/combo-box-item.css +9 -5
  163. package/dist/node_modules/@genexus/gemini/dist/collection/components/date-picker/date-picker.css +1 -1
  164. package/dist/node_modules/@genexus/gemini/dist/collection/components/drop-down/drop-down.css +1 -1
  165. package/dist/node_modules/@genexus/gemini/dist/collection/components/form-checkbox/form-checkbox.css +3 -3
  166. package/dist/node_modules/@genexus/gemini/dist/collection/components/form-option/option.css +1 -1
  167. package/dist/node_modules/@genexus/gemini/dist/collection/components/form-select/select.css +1 -1
  168. package/dist/node_modules/@genexus/gemini/dist/collection/components/form-text/form-text.css +7 -7
  169. package/dist/node_modules/@genexus/gemini/dist/collection/components/form-textarea/form-textarea.css +3 -3
  170. package/dist/node_modules/@genexus/gemini/dist/collection/components/label/gxg-label.css +1 -1
  171. package/dist/node_modules/@genexus/gemini/dist/collection/components/list-box/list-box.css +16 -9
  172. package/dist/node_modules/@genexus/gemini/dist/collection/components/list-box-item/list-box-item.css +27 -9
  173. package/dist/node_modules/@genexus/gemini/dist/collection/components/menu-slim/item/item.css +6 -6
  174. package/dist/node_modules/@genexus/gemini/dist/collection/components/suggest/styles.css +5 -5
  175. package/dist/node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.css +1 -1
  176. package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-item/gxg-tree-item.css +4 -4
  177. package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-view/tree-view.css +49 -0
  178. package/dist/types/common/common.d.ts +1 -1
  179. package/dist/types/components/new-kb/new-kb.d.ts +0 -9
  180. package/package.json +3 -3
  181. package/dist/cjs/ch-checkbox.cjs.entry.js +0 -93
  182. package/dist/cjs/ch-global-stylesheet-145c4b20.js +0 -5
  183. package/dist/components/ch-grid-rowset-legend2.js +0 -34
  184. package/dist/esm/ch-checkbox.entry.js +0 -89
  185. package/dist/esm/ch-global-stylesheet-f8bbf095.js +0 -3
  186. package/dist/genexus-ide-ui/p-04f69ecc.entry.js +0 -1
  187. package/dist/genexus-ide-ui/p-080f6c41.js +0 -1
  188. package/dist/genexus-ide-ui/p-1ccf523f.entry.js +0 -1
  189. package/dist/genexus-ide-ui/p-24f47ee2.entry.js +0 -1
  190. package/dist/genexus-ide-ui/p-28d0afda.entry.js +0 -1
  191. package/dist/genexus-ide-ui/p-44964acf.js +0 -1
  192. package/dist/genexus-ide-ui/p-4b7f7425.entry.js +0 -1
  193. package/dist/genexus-ide-ui/p-597a1d43.entry.js +0 -1
  194. package/dist/genexus-ide-ui/p-6afc6187.entry.js +0 -1
  195. package/dist/genexus-ide-ui/p-70489f0c.entry.js +0 -1
  196. package/dist/genexus-ide-ui/p-84e91b37.entry.js +0 -1
  197. package/dist/genexus-ide-ui/p-87e8eb72.js +0 -1
  198. package/dist/genexus-ide-ui/p-8bf7f0e1.entry.js +0 -1
  199. package/dist/genexus-ide-ui/p-8c2ab053.entry.js +0 -1
  200. package/dist/genexus-ide-ui/p-917c5696.entry.js +0 -1
  201. package/dist/genexus-ide-ui/p-92e84fcc.entry.js +0 -1
  202. package/dist/genexus-ide-ui/p-9dc36eb3.entry.js +0 -1
  203. package/dist/genexus-ide-ui/p-ad9fdfdf.entry.js +0 -1
  204. package/dist/genexus-ide-ui/p-bb1809cb.entry.js +0 -1
  205. package/dist/genexus-ide-ui/p-c056d050.entry.js +0 -1
  206. package/dist/genexus-ide-ui/p-c6ad49cc.entry.js +0 -1
  207. package/dist/genexus-ide-ui/p-e1cd9135.entry.js +0 -1
  208. package/dist/genexus-ide-ui/p-f28601c2.entry.js +0 -1
@@ -10,32 +10,13 @@ const store = require('./store-0866de9f.js');
10
10
  const exportParts = require('./export-parts-931a23ad.js');
11
11
  require('./types-e04c9098.js');
12
12
 
13
- const listBoxCss = ":host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--color-background-disabled) !important;color:var(--color-on-background--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg-validation--warning) .form-element{border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-warning-dark)}:host(.gxg-validation--error) .form-element{border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-error-dark)}:host(.gxg-validation--success) .form-element{border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus{outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-success-dark)}:host{display:block;font-size:var(--font-size-sm);font-family:var(--font-family-primary);background-color:var(--color-background);color:var(--color-on-background)}:host .container{height:100%;border:var(--border-radius-xs) var(--border-style-regular) var(--gray-02)}:host .header{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;background-color:var(--gray-02);padding:var(--spacing-comp-01) var(--spacing-comp-02);text-transform:uppercase;font-size:inherit;font-weight:var(--font-weight-bold);color:var(--color-on-background)}:host .main{overflow-y:auto;}:host .main::-webkit-scrollbar{width:6px;height:6px}:host .main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host .main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host .main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host .main--no-border{border:none}:host .icon{margin-inline-end:var(--spacing-comp-01)}:host .checkbox{margin-inline-end:var(--spacing-comp-01)}:host.selected{background-color:var(--color-secondary-active);color:var(--color-always-white)}.container:focus-within{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:0}.suggestions__container{background-color:var(--gray-01);color:var(--gray-06);font-family:inherit;font-size:var(--font-size-sm);padding:var(--spacing-comp-01) var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);align-items:center}.suggestions__list{margin:0;padding:0;list-style-type:none;flex-grow:1}.messages-wrapper{margin-top:var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);flex-direction:column}:host(.large){font-size:var(--font-size-lg)}";
13
+ const listBoxCss = ":host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--gxg-background-color--disabled) !important;color:var(--gxg-color--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg-validation--warning) .form-element{border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host(.gxg-validation--warning) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-warning-dark)}:host(.gxg-validation--error) .form-element{border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host(.gxg-validation--error) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-error-dark)}:host(.gxg-validation--success) .form-element{border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus{outline-color:var(--color-success-dark);border-color:var(--color-success-dark)}:host(.gxg-validation--success) .form-element:focus+.checkmark{--checkmark-border-color:var(--color-success-dark)}:host{display:block;font-size:var(--font-size-sm);font-family:var(--font-family-primary);background-color:var(--color-background);color:var(--color-on-background);height:100%}:host .container{height:100%;border:var(--border-radius-xs) var(--border-style-regular) var(--gray-02)}:host .header{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;background-color:var(--gray-01);border-bottom:var(--gxg-border-common-styles);padding:var(--spacing-comp-01) var(--spacing-comp-02);text-transform:capitalize;font-size:inherit;font-weight:var(--font-weight-semibold);color:var(--color-on-background)}:host .main{overflow-y:auto;}:host .main::-webkit-scrollbar{width:6px;height:6px}:host .main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host .main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host .main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host .main--no-border{border:none}:host .icon{margin-inline-end:var(--spacing-comp-01)}:host .checkbox{margin-inline-end:var(--spacing-comp-01)}:host.selected{background-color:var(--color-secondary-active);color:var(--color-always-white)}.container:focus-within{outline:none}.container:not(:focus-within){--gxg-border-color--focused:transparent}:host([no-border]) .container{border:none}.suggestions__container{background-color:var(--gray-01);color:var(--gray-06);font-family:inherit;font-size:var(--font-size-sm);padding:var(--spacing-comp-01) var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);align-items:center}.suggestions__list{margin:0;padding:0;list-style-type:none;flex-grow:1}.messages-wrapper{margin-top:var(--spacing-comp-02);display:flex;gap:var(--spacing-comp-01);flex-direction:column}:host(.large){font-size:var(--font-size-lg)}";
14
14
 
15
15
  const GxgListBox = class {
16
16
  constructor(hostRef) {
17
17
  index.registerInstance(this, hostRef);
18
18
  this.selectionChanged = index.createEvent(this, "selectionChanged", 7);
19
19
  this.checkedChanged = index.createEvent(this, "checkedChanged", 7);
20
- /*********************************
21
- PROPERTIES & STATE
22
- *********************************/
23
- /**
24
- * The listbox title that appears on the header
25
- */
26
- this.theTitle = "";
27
- /**
28
- * The list-box min-height
29
- */
30
- this.minHeight = "0";
31
- /**
32
- * The list-box height
33
- */
34
- this.height = "100%";
35
- /**
36
- * The list-box max-height
37
- */
38
- this.maxHeight = "100%";
39
20
  /**
40
21
  * The presence of this attribute will display a checkbox for every item
41
22
  */
@@ -80,6 +61,7 @@ const GxgListBox = class {
80
61
  */
81
62
  this.userUsedKeyboard = false;
82
63
  this.headerHeight = 0;
64
+ this.firstChange = true;
83
65
  /*********************************
84
66
  PROPERTIES FOR VALIDATION
85
67
  *********************************/
@@ -99,6 +81,12 @@ const GxgListBox = class {
99
81
  */
100
82
  this.validationStatus = "indeterminate";
101
83
  this.initialSetup = () => {
84
+ /*set index to every item*/
85
+ const allItems = this.getAllItems();
86
+ if (allItems === null || allItems === void 0 ? void 0 : allItems.length)
87
+ allItems.forEach((item, i) => {
88
+ item.index = i;
89
+ });
102
90
  /*conditions to do setup*/
103
91
  const selectItem = !this.allowsEmpty && this.selectedItemsLength() === 0;
104
92
  const unselectItems = this.singleSelection && this.selectedItemsLength() > 1;
@@ -138,6 +126,12 @@ const GxgListBox = class {
138
126
  /*Do updateSelectedItems to initialize this.getSelectedItems array*/
139
127
  this.selectedItemsLength() > 0 && this.updateSelectedItems();
140
128
  };
129
+ this.setInitialActive = () => {
130
+ const firstSelectedItem = this.getFirstSelectedItem();
131
+ if (firstSelectedItem) {
132
+ this.setActiveItem(firstSelectedItem);
133
+ }
134
+ };
141
135
  this.handleKeyDown = (e) => {
142
136
  this.userUsedKeyboard = true;
143
137
  const ctrlKey = e.ctrlKey;
@@ -235,6 +229,23 @@ const GxgListBox = class {
235
229
  repositionScroll.repositionScroll(this.main, newElement, direction);
236
230
  }
237
231
  };
232
+ /* SELECTED */
233
+ this.setSiblingSelected = async () => {
234
+ const allItems = this.getAllItems();
235
+ allItems.forEach((item, i) => {
236
+ if (i === allItems.length - 1) {
237
+ item.siblingIsSelected = false;
238
+ }
239
+ else {
240
+ if (allItems[i + 1].selected) {
241
+ item.siblingIsSelected = true;
242
+ }
243
+ else {
244
+ item.siblingIsSelected = false;
245
+ }
246
+ }
247
+ });
248
+ };
238
249
  this.selectedItemsLength = () => {
239
250
  return this.getSelectedItemsFunc().length;
240
251
  };
@@ -251,27 +262,16 @@ const GxgListBox = class {
251
262
  const selectedItemsArray = [];
252
263
  const selectedItems = this.getSelectedItemsFunc();
253
264
  selectedItems.forEach((item) => {
254
- const index = this.getItemIndex(item);
255
265
  selectedItemsArray.push({
256
266
  active: item.active,
257
267
  selected: item.selected,
258
268
  checked: item.checked,
259
- highlighted: item.highlighted,
260
- index: index,
269
+ index: item.index,
261
270
  value: item.value || item.textContent,
262
271
  });
263
272
  });
264
273
  this.selectedItems = [...selectedItemsArray];
265
274
  };
266
- this.getItemIndex = (itemEl) => {
267
- if (itemEl) {
268
- const allListBoxItems = this.el.querySelectorAll("gxg-list-box-item");
269
- const index = Array.from(allListBoxItems).findIndex((item) => {
270
- return item === itemEl;
271
- });
272
- return index;
273
- }
274
- };
275
275
  /* OTHER */
276
276
  this.getAllItems = () => {
277
277
  const allItemsArray = [];
@@ -291,7 +291,18 @@ const GxgListBox = class {
291
291
  if (this.disabled) {
292
292
  return null;
293
293
  }
294
- return this.selectedItems;
294
+ const selectedItems = this.getSelectedItemsFunc();
295
+ const selectedItemsInformation = [];
296
+ selectedItems.forEach((selectedItem) => {
297
+ selectedItemsInformation.push({
298
+ active: selectedItem.active,
299
+ selected: selectedItem.selected,
300
+ checked: selectedItem.checked,
301
+ index: selectedItem.index,
302
+ value: selectedItem.value,
303
+ });
304
+ });
305
+ return selectedItemsInformation;
295
306
  }
296
307
  componentDidRender() {
297
308
  if (this.theTitle) {
@@ -301,10 +312,14 @@ const GxgListBox = class {
301
312
  componentWillLoad() {
302
313
  this.initialSetup();
303
314
  }
315
+ componentDidLoad() {
316
+ this.setInitialActive();
317
+ }
304
318
  itemLoadedHandler() {
305
319
  //this.initialSetup();
306
320
  }
307
321
  itemClickedHandler(event) {
322
+ this.containerEl.focus();
308
323
  const { clickedItem, ctrlKey, cmdKey, shiftKey, index } = event["detail"];
309
324
  //this.clearActiveItem();
310
325
  if (this.singleSelection) {
@@ -363,7 +378,10 @@ const GxgListBox = class {
363
378
  this.setActiveItem(clickedItem);
364
379
  }
365
380
  selectedItemsHandler(newArray) {
366
- this.selectionChanged.emit({ items: newArray });
381
+ if (!this.firstChange) {
382
+ this.selectionChanged.emit({ items: newArray });
383
+ }
384
+ this.firstChange = false;
367
385
  }
368
386
  checkedItemsHandler(newArray) {
369
387
  this.checkedChanged.emit(newArray);
@@ -381,6 +399,9 @@ const GxgListBox = class {
381
399
  oldValue === false &&
382
400
  localStorage.setItem("gxg-list-box-hide-keyboard-suggestions", "true");
383
401
  }
402
+ itemSelectedHandler() {
403
+ this.setSiblingSelected();
404
+ }
384
405
  checkboxStateChangedHandler(e) {
385
406
  const checkedItemEl = e.detail.checkedItem;
386
407
  const checkedItemValue = e.detail.checked;
@@ -402,7 +423,6 @@ const GxgListBox = class {
402
423
  active: item.active,
403
424
  selected: item.selected,
404
425
  checked: checked,
405
- highlighted: item.highlighted,
406
426
  index: item.index,
407
427
  value: item.value || item.textContent,
408
428
  });
@@ -418,7 +438,6 @@ const GxgListBox = class {
418
438
  this.hideKeyboardSuggestions = false;
419
439
  }
420
440
  }
421
- /* SELECTED */
422
441
  clearSelectedItems(ignoreHighlighted = false) {
423
442
  const actualSelectedItems = ignoreHighlighted
424
443
  ? this.el.querySelectorAll("gxg-list-box-item[selected]:not([highlighted])")
@@ -716,20 +735,16 @@ const GxgListBox = class {
716
735
  render() {
717
736
  return (index.h(index.Host, { class: {
718
737
  large: store.state.large,
738
+ "has-title": !!this.theTitle,
719
739
  [classesNames.formClasses["VALIDATION_INDETERMINATE_CLASS"]]: this.validationStatus === "indeterminate",
720
740
  [classesNames.formClasses["VALIDATION_WARNING_CLASS"]]: this.validationStatus === "warning",
721
741
  [classesNames.formClasses["VALIDATION_ERROR_CLASS"]]: this.validationStatus === "error",
722
742
  [classesNames.formClasses["VALIDATION_SUCCESS_CLASS"]]: this.validationStatus === "success",
723
743
  [classesNames.commonClassesNames["DISABLED_CLASS"]]: this.disabled,
724
- }, onKeyDown: this.handleKeyDown, style: {
725
- minHeight: this.minHeight,
726
- height: this.height,
727
- maxHeight: this.maxHeight,
728
- } }, index.h("div", { class: { container: true, "form-element": true }, tabindex: this.disabled ? "-1" : "0" }, this.theTitle ? (index.h("header", { class: { header: true }, ref: (el) => (this.header = el) }, this.theTitle)) : null, !this.disableSuggestions && !this.hideKeyboardSuggestions
744
+ }, onKeyDown: this.handleKeyDown }, index.h("div", { class: { container: true, "form-element": true }, tabindex: this.disabled ? "-1" : "0", ref: (el) => (this.containerEl = el) }, this.theTitle ? (index.h("header", { class: { header: true }, ref: (el) => (this.header = el) }, this.theTitle)) : null, !this.disableSuggestions && !this.hideKeyboardSuggestions
729
745
  ? this.renderKeyboardSuggestions()
730
746
  : null, index.h("main", { class: {
731
747
  main: true,
732
- "main--no-border": this.noBorder,
733
748
  }, style: {
734
749
  height: `calc(100% - ${this.headerHeight}px)`,
735
750
  }, ref: (el) => (this.main = el) }, index.h("slot", null))), form.formMessageLogic(this)));
@@ -744,7 +759,7 @@ const GxgListBox = class {
744
759
  };
745
760
  GxgListBox.style = listBoxCss;
746
761
 
747
- const listBoxItemCss = ":host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--color-background-disabled) !important;color:var(--color-on-background--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{display:block;font-family:var(--font-family-primary);font-size:inherit;color:inherit;display:flex;box-sizing:border-box;align-items:center;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;-o-user-select:none;outline:none}:host .container{display:flex;align-items:center;padding:var(--spacing-comp-00) var(--spacing-comp-02);width:100%;height:var(--gxg-list-item-height--spaced);box-sizing:border-box}:host .icon{margin-inline-end:var(--spacing-comp-01);flex-shrink:0}:host gxg-form-checkbox{margin-inline-end:var(--spacing-comp-01)}:host gxg-form-checkbox::part(box){outline:none}:host(:not([disabled])){cursor:pointer !important}:host(:hover:not([selected])){background-color:var(--gxg-background-color-item-hover)}:host(.has-icon.no-checkbox) .container{padding-inline-start:var(--spacing-comp-01)}.description{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;}:host([highlighted]){background-color:var(--gxg-background-color-item-selected);color:var(--color-on-background)}:host([selected]){background-color:var(--gxg-background-color-item-active);color:var(--gxg-color-item-active)}:host(.large) .container{padding:var(--spacing-comp-01)}";
762
+ const listBoxItemCss = ":host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--gxg-background-color--disabled) !important;color:var(--gxg-color--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{display:block;font-family:var(--font-family-primary);font-size:inherit;color:inherit;display:flex;box-sizing:border-box;align-items:center;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;-o-user-select:none;outline:none;border-bottom:1px solid transparent}:host .container{display:flex;align-items:center;padding:var(--spacing-comp-00) var(--spacing-comp-02);width:100%;height:var(--gxg-list-item-height--spaced);box-sizing:border-box}:host .icon{margin-inline-end:var(--spacing-comp-01);flex-shrink:0}:host gxg-form-checkbox{margin-inline-end:var(--spacing-comp-01)}:host gxg-form-checkbox::part(box){outline:none}:host(:not([disabled])){cursor:pointer !important}:host([disabled]){pointer-events:none}:host(:hover:not([selected])){background-color:var(--gxg-background-color--hover)}:host(.has-icon.no-checkbox) .container{padding-inline-start:var(--spacing-comp-01)}.description{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;}:host([active]){outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px;background-color:var(--gxg-background-color--hover);color:var(--gxg-color--hover)}:host([selected]){background-color:var(--gxg-background-color--selected);color:var(--gxg-color--selected);border-bottom-color:var(--color-secondary-hover)}:host([selected]:hover){background-color:var(--gxg-background-color--selected-hover)}:host(:not([sibling-is-selected])){border-bottom-color:transparent}:host(.large) .container{padding:var(--spacing-comp-01)}";
748
763
 
749
764
  const GxgListboxItem = class {
750
765
  constructor(hostRef) {
@@ -764,6 +779,10 @@ const GxgListboxItem = class {
764
779
  * The presence of this attribute sets this item as selected
765
780
  */
766
781
  this.selected = false;
782
+ /**
783
+ * This property is for internal use
784
+ */
785
+ this.siblingIsSelected = false;
767
786
  /**
768
787
  * The presence of this attribute sets this item as highlighted
769
788
  */
@@ -805,19 +824,9 @@ const GxgListboxItem = class {
805
824
  const exportPartsResult = exportParts.exportParts(part, this.parts);
806
825
  exportPartsResult.length && (this.exportparts = exportPartsResult);
807
826
  };
808
- this.getIndex = () => {
809
- const listBox = this.el.parentElement;
810
- const listBoxItems = listBox.querySelectorAll("gxg-list-box-item");
811
- const itemIndex = Array.from(listBoxItems).findIndex((item) => {
812
- return item === this.el;
813
- });
814
- if (itemIndex !== -1) {
815
- return itemIndex;
816
- }
817
- else {
818
- return undefined;
819
- }
820
- };
827
+ }
828
+ watchPropHandler() {
829
+ this.itemSelected.emit();
821
830
  }
822
831
  checkboxChangedHandler(e) {
823
832
  const checked = e.detail.value;
@@ -831,8 +840,8 @@ const GxgListboxItem = class {
831
840
  if (this.disabled) {
832
841
  return "disabled";
833
842
  }
834
- else if (this.selected || this.highlighted || this.mouseOver) {
835
- return "negative";
843
+ else if (this.selected) {
844
+ return "primary-enabled";
836
845
  }
837
846
  else {
838
847
  return "auto";
@@ -845,13 +854,12 @@ const GxgListboxItem = class {
845
854
  this.itemLoaded.emit();
846
855
  }
847
856
  itemClickedFunc(e) {
848
- const index = this.getIndex();
849
857
  this.itemClicked.emit({
850
858
  clickedItem: this.el,
851
859
  ctrlKey: e.ctrlKey,
852
860
  cmdKey: e.metaKey,
853
861
  shiftKey: e.shiftKey,
854
- index: index,
862
+ index: this.index,
855
863
  });
856
864
  }
857
865
  onMouseOver() {
@@ -872,6 +880,9 @@ const GxgListboxItem = class {
872
880
  exportParts: this.exportparts ? this.exportparts : null }, index.h("div", { class: { container: true, "form-element": true } }, this.checkbox && !this.disabled ? (index.h("gxg-form-checkbox", { tabindex: "-1", checked: this.checked, onClick: this.handleCheckboxClick, disabled: this.disabled, part: this.parts.checkbox })) : null, this.icon !== undefined ? (index.h("gxg-icon", { class: "icon", color: this.iconColor(), size: "regular", type: this.icon })) : null, index.h("div", { class: "description" }, index.h("slot", null)))));
873
881
  }
874
882
  get el() { return index.getElement(this); }
883
+ static get watchers() { return {
884
+ "selected": ["watchPropHandler"]
885
+ }; }
875
886
  };
876
887
  GxgListboxItem.style = listBoxItemCss;
877
888
 
@@ -6,7 +6,7 @@ const index = require('./index-5a32426a.js');
6
6
  const classesNames = require('./classesNames-5b7c6ad4.js');
7
7
  const types = require('./types-e04c9098.js');
8
8
 
9
- const itemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--color-background-disabled) !important;color:var(--color-on-background--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:host .menu-item{position:relative}:host .menu-item:before{content:\"\";display:block;height:100%;width:2px;background-color:transparent;position:absolute}:host .menu-item--ellipsis .menu-item__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host .menu-item__button{all:unset;color:var(--color-on-background);padding:0 var(--spacing-comp-01);min-height:var(--gxg-list-item-height);width:100%;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:var(--spacing-comp-02);border-radius:var(--border-width-md);overflow:hidden}:host .menu-item__button:hover{background-color:var(--gxg-background-color-item-hover)}:host .menu-item__button:focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}:host :menu-item--tab{font-weight:var(--font-weight-semibold)}:host([active]) .menu-item__button{color:var(--gxg-color-selected);background-color:var(--gxg-background-color-item-selected)}";
9
+ const itemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host(.gxg--disabled) .form-element,:host(.gxg--disabled.form-element){pointer-events:none;background-color:var(--gxg-background-color--disabled) !important;color:var(--gxg-color--disabled) !important;border-color:var(--gxg-border-color--disabled) !important;cursor:default !important}:host .menu-item{position:relative}:host .menu-item:before{content:\"\";display:block;height:100%;width:2px;background-color:transparent;position:absolute}:host .menu-item--ellipsis .menu-item__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}:host .menu-item__button{all:unset;color:var(--color-on-background);padding:0 var(--spacing-comp-01);min-height:var(--gxg-list-item-height);width:100%;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:var(--spacing-comp-02);border-radius:var(--border-width-md);overflow:hidden}:host .menu-item__button:hover{background-color:var(--gxg-background-color--hover)}:host .menu-item__button:focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}:host :menu-item--tab{font-weight:var(--font-weight-semibold)}:host([active]) .menu-item__button{color:var(--gxg-color--selected);background-color:var(--gxg-background-color--selected)}";
10
10
 
11
11
  const GxgMenuSlimItem = class {
12
12
  constructor(hostRef) {
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-5a32426a.js');
6
6
 
7
- const optionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{--size:3}:host{display:flex;flex-direction:column}:host([full-width]){display:block;width:100% !important}:host([full-width]) .outer-wrapper{width:100%}:host .outer-wrapper{position:relative;width:100%}:host label{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default}:host textarea{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}:host{}:host .custom-select{position:relative;font-family:var(--font-family-primary)}:host .custom-select select{display:none;}:host .select-selected{background-color:var(--color-on-primary);border-width:var(--border-width-sm);border-color:var(--gray-04);border-style:var(--border-style-regular)}:host .select-selected:focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px}:host .select-selected[disabled]{pointer-events:none;background-color:var(--gray-01);color:var(--color-on-disabled)}:host .select-selected:after,:host .select-selected:before{position:absolute;content:\"\";right:6px;width:0;height:0;border:4px solid transparent;border-color:var(--gray-05) transparent transparent transparent}:host .select-selected:after{top:15px}:host .select-selected:before{top:3px;transform:rotate(180deg)}:host .select-selected:hover:after,:host .select-selected:hover:before{border-color:var(--gray-04) transparent transparent transparent}:host .select-items div,:host .select-selected{color:var(--color-on-background);padding:var(--spacing-comp-01);cursor:pointer;font-size:var(--font-size-md);line-height:1.4em}:host .select-items div{border-color:transparent transparent rgba(0, 0, 0, 0.1) transparent;border:1px solid transparent}:host .select-items{color:var(--color-on-background);position:absolute;background-color:var(--color-on-primary);top:100%;left:0;right:0;z-index:99;border-width:var(--border-width-sm);border-color:var(--gray-04);border-style:var(--border-style-regular);border-top:0;overflow-y:scroll;border-bottom-right-radius:var(--border-radius-md);border-bottom-left-radius:var(--border-radius-md);max-height:calc( var(--size) * 25px )}:host .select-hide{display:none}:host .select-items div:hover{background-color:var(--color-secondary-hover);color:var(--color-on-primary)}:host .select-items div.same-as-selected{background-color:var(--color-secondary-active);color:var(--color-on-primary)}:host{}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}";
7
+ const optionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{--size:3}:host{display:flex;flex-direction:column}:host([full-width]){display:block;width:100% !important}:host([full-width]) .outer-wrapper{width:100%}:host .outer-wrapper{position:relative;width:100%}:host label{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default}:host textarea{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}:host{}:host .custom-select{position:relative;font-family:var(--font-family-primary)}:host .custom-select select{display:none;}:host .select-selected{background-color:var(--color-on-primary);border-width:var(--border-width-sm);border-color:var(--gray-04);border-style:var(--border-style-regular)}:host .select-selected:focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px}:host .select-selected[disabled]{pointer-events:none;background-color:var(--gray-01);color:var(--color-on-disabled)}:host .select-selected:after,:host .select-selected:before{position:absolute;content:\"\";right:6px;width:0;height:0;border:4px solid transparent;border-color:var(--gray-05) transparent transparent transparent}:host .select-selected:after{top:15px}:host .select-selected:before{top:3px;transform:rotate(180deg)}:host .select-selected:hover:after,:host .select-selected:hover:before{border-color:var(--gray-04) transparent transparent transparent}:host .select-items div,:host .select-selected{color:var(--color-on-background);padding:var(--spacing-comp-01);cursor:pointer;font-size:var(--font-size-md);line-height:1.4em}:host .select-items div{border-color:transparent transparent rgba(0, 0, 0, 0.1) transparent;border:1px solid transparent}:host .select-items{color:var(--color-on-background);position:absolute;background-color:var(--color-on-primary);top:100%;left:0;right:0;z-index:99;border-width:var(--border-width-sm);border-color:var(--gray-04);border-style:var(--border-style-regular);border-top:0;overflow-y:scroll;border-bottom-right-radius:var(--border-radius-md);border-bottom-left-radius:var(--border-radius-md);max-height:calc( var(--size) * 25px )}:host .select-hide{display:none}:host .select-items div:hover{background-color:var(--color-secondary-hover);color:var(--color-on-primary)}:host .select-items div.same-as-selected{background-color:var(--color-secondary-active);color:var(--color-on-primary)}:host{}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}";
8
8
 
9
9
  const GxgFormOption = class {
10
10
  constructor(hostRef) {
@@ -6,7 +6,7 @@ const index = require('./index-5a32426a.js');
6
6
  const form = require('./form-a22de8f3.js');
7
7
  const store = require('./store-0866de9f.js');
8
8
 
9
- const selectCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{--size:3;display:block}:host .outer-wrapper{position:relative;width:100%}:host label{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default}:host label .required{padding-left:2px}:host textarea{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}:host{}:host .custom-select{position:relative;font-family:var(--font-family-primary)}:host .custom-select select{display:none;}:host .select-selected{background-color:var(--color-on-primary);border-width:var(--border-width-sm);border-color:var(--gray-02);border-style:var(--border-style-regular);height:10px}:host .select-selected:focus{outline-style:solid;outline-color:var(--color-primary-active);outline-width:var(--border-width-md);outline-offset:-2px;border-color:transparent}:host .select-selected:after,:host .select-selected:before{position:absolute;content:\"\";right:6px;width:0;height:0;border:4px solid transparent;border-color:var(--gray-06) transparent transparent transparent}:host .select-selected:after{top:12px}:host .select-selected:before{top:1px;transform:rotate(180deg)}:host .select-selected:hover:after,:host .select-selected:hover:before{border-color:var(--gray-04) transparent transparent transparent}:host .select-items div,:host .select-selected{color:var(--color-on-background);padding:var(--spacing-comp-01);cursor:pointer;font-size:var(--font-size-sm);line-height:0.95em}:host .select-items div{border-color:transparent transparent rgba(0, 0, 0, 0.1) transparent;border:1px solid transparent}:host .select-items{color:var(--color-on-background);position:absolute;background-color:var(--color-on-primary);top:100%;left:0;right:0;z-index:99;border-width:var(--border-width-sm);border-color:var(--gray-02);border-style:var(--border-style-regular);border-top:0;overflow-y:scroll;border-bottom-right-radius:var(--border-radius-md);border-bottom-left-radius:var(--border-radius-md);max-height:calc( var(--size) * 20px )}:host .select-items div{height:10px}:host .select-hide{display:none}:host .select-items div:hover{background-color:var(--color-secondary-enabled);color:var(--color-on-secondary)}:host .select-items div.same-as-selected{background-color:var(--color-secondary-hover);color:var(--color-on-secondary)}:host([disabled]) .select-selected{pointer-events:none;background-color:var(--gray-01);color:var(--color-on-disabled)}:host([disabled]) .custom-select{cursor:not-allowed}:host(.rtl) .select-selected:after,:host(.rtl) .select-selected:before{left:6px;right:auto}:host([minimal]) .select-selected:not(:focus){border-color:transparent;background-color:transparent}:host{}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host .select--error .select-selected{border-color:var(--color-error-dark);background-color:var(--color-error-light);margin-bottom:0}:host .select--error .select-selected:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host .select--warning .select-selected{border-color:var(--color-warning-dark);background-color:var(--color-warning-light);margin-bottom:0}:host .select--warning .select-selected:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host([label-position=start]) .outer-wrapper{display:flex;align-items:center}:host([label-position=start]) .custom-select{width:100%}:host([label-position=start]) .label{margin-bottom:0;margin-inline-end:var(--spacing-comp-02);flex-shrink:0}:host(.large) label{font-size:var(--font-size-lg)}:host(.large) .select-selected{height:var(--spacing-comp-05);box-sizing:border-box;display:flex;align-items:center;font-size:var(--font-size-lg)}:host(.large) .select-selected:before{top:3px}:host(.large) .select-selected:after{top:14px}:host(.large) .select-items{max-height:calc(var(--size) * var(--spacing-comp-05))}:host(.large) .select-items div{height:14px;display:flex;align-items:center;font-size:var(--font-size-lg)}";
9
+ const selectCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-01--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-02{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-02--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-03{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em}.gxg-title-03--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;text-transform:uppercase;line-height:1.556em;color:var(--color-on-primary)}.gxg-title-04{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-title-04--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:var(--letter-spacing-md);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-title-05{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em}.gxg-title-05--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-sm);color:var(--color-on-background);text-align:start;line-height:1.556em;color:var(--color-on-primary)}.gxg-text{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}.gxg-text--negative{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-on-primary)}.gxg-text--gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--gray-05)}.gxg-quote{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;font-style:italic}.gxg-quote--negative{color:var(--color-on-primary)}.gxg-link{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--color-primary-hover)}.gxg-link:active{color:var(--color-primary-active)}.gxg-link-gray{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04)}.gxg-link-gray:hover{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-primary);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--gray-04);color:var(--gray-06)}.gxg-alert-error{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-error-dark);display:inline-block}.gxg-alert-warning{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-warning-dark);display:inline-block}.gxg-alert-success{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;color:var(--color-success-dark);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-button-styles{font-family:var(--font-family-primary) !important;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm) !important;letter-spacing:var(--letter-spacing-xs);color:var(--color-primary-enabled);text-align:center;line-height:1.455em}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:6px;height:6px}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host{--size:3;display:block}:host .outer-wrapper{position:relative;width:100%}:host label{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em;display:flex;align-items:center;cursor:default}:host label .required{padding-left:2px}:host textarea{font-family:var(--font-family-primary);font-weight:var(--font-weight-regular);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-xs);color:var(--color-on-background);text-align:start;line-height:1.455em}:host{}:host .custom-select{position:relative;font-family:var(--font-family-primary)}:host .custom-select select{display:none;}:host .select-selected{background-color:var(--color-on-primary);border-width:var(--border-width-sm);border-color:var(--gray-02);border-style:var(--border-style-regular);height:10px}:host .select-selected:focus{outline-style:solid;outline-color:var(--gxg-border-color--focused);outline-width:var(--border-width-md);outline-offset:-2px;border-color:transparent}:host .select-selected:after,:host .select-selected:before{position:absolute;content:\"\";right:6px;width:0;height:0;border:4px solid transparent;border-color:var(--gray-06) transparent transparent transparent}:host .select-selected:after{top:12px}:host .select-selected:before{top:1px;transform:rotate(180deg)}:host .select-selected:hover:after,:host .select-selected:hover:before{border-color:var(--gray-04) transparent transparent transparent}:host .select-items div,:host .select-selected{color:var(--color-on-background);padding:var(--spacing-comp-01);cursor:pointer;font-size:var(--font-size-sm);line-height:0.95em}:host .select-items div{border-color:transparent transparent rgba(0, 0, 0, 0.1) transparent;border:1px solid transparent}:host .select-items{color:var(--color-on-background);position:absolute;background-color:var(--color-on-primary);top:100%;left:0;right:0;z-index:99;border-width:var(--border-width-sm);border-color:var(--gray-02);border-style:var(--border-style-regular);border-top:0;overflow-y:scroll;border-bottom-right-radius:var(--border-radius-md);border-bottom-left-radius:var(--border-radius-md);max-height:calc( var(--size) * 20px )}:host .select-items div{height:10px}:host .select-hide{display:none}:host .select-items div:hover{background-color:var(--color-secondary-enabled);color:var(--color-on-secondary)}:host .select-items div.same-as-selected{background-color:var(--color-secondary-hover);color:var(--color-on-secondary)}:host([disabled]) .select-selected{pointer-events:none;background-color:var(--gray-01);color:var(--color-on-disabled)}:host([disabled]) .custom-select{cursor:not-allowed}:host(.rtl) .select-selected:after,:host(.rtl) .select-selected:before{left:6px;right:auto}:host([minimal]) .select-selected:not(:focus){border-color:transparent;background-color:transparent}:host{}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}:host ::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}:host ::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}:host .select--error .select-selected{border-color:var(--color-error-dark);background-color:var(--color-error-light);margin-bottom:0}:host .select--error .select-selected:focus{outline-color:var(--color-error-dark);border-color:var(--color-error-dark)}:host .select--warning .select-selected{border-color:var(--color-warning-dark);background-color:var(--color-warning-light);margin-bottom:0}:host .select--warning .select-selected:focus{outline-color:var(--color-warning-dark);border-color:var(--color-warning-dark)}:host([label-position=start]) .outer-wrapper{display:flex;align-items:center}:host([label-position=start]) .custom-select{width:100%}:host([label-position=start]) .label{margin-bottom:0;margin-inline-end:var(--spacing-comp-02);flex-shrink:0}:host(.large) label{font-size:var(--font-size-lg)}:host(.large) .select-selected{height:var(--spacing-comp-05);box-sizing:border-box;display:flex;align-items:center;font-size:var(--font-size-lg)}:host(.large) .select-selected:before{top:3px}:host(.large) .select-selected:after{top:14px}:host(.large) .select-items{max-height:calc(var(--size) * var(--spacing-comp-05))}:host(.large) .select-items div{height:14px;display:flex;align-items:center;font-size:var(--font-size-lg)}";
10
10
 
11
11
  const GxgFormSelect = class {
12
12
  constructor(hostRef) {