globuswebcomponents 2.4.9 → 2.5.1

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 (631) hide show
  1. package/dist/cjs/gb-avatar-label-group_2.cjs.entry.js +1 -1
  2. package/dist/cjs/gb-avatar_25.cjs.entry.js +1538 -0
  3. package/dist/cjs/gb-avatar_25.cjs.entry.js.map +1 -0
  4. package/dist/cjs/gb-checkbox-group-item.cjs.entry.js +148 -0
  5. package/dist/cjs/gb-checkbox-group-item.cjs.entry.js.map +1 -0
  6. package/dist/cjs/gb-checkbox-group-item.entry.cjs.js.map +1 -0
  7. package/dist/cjs/gb-dropdown-items-with-shortcut.cjs.entry.js +11 -2
  8. package/dist/cjs/gb-dropdown-items-with-shortcut.cjs.entry.js.map +1 -1
  9. package/dist/cjs/gb-dropdown-items-with-shortcut.entry.cjs.js.map +1 -1
  10. package/dist/cjs/gb-featured-icon_3.cjs.entry.js +2 -2
  11. package/dist/cjs/gb-file-type-icon_2.cjs.entry.js +1 -1
  12. package/dist/cjs/gb-header-icon.cjs.entry.js +1 -1
  13. package/dist/cjs/gb-header.cjs.entry.js +12 -4
  14. package/dist/cjs/gb-header.cjs.entry.js.map +1 -1
  15. package/dist/cjs/gb-header.entry.cjs.js.map +1 -1
  16. package/dist/cjs/gb-help-dropdown.cjs.entry.js +1 -1
  17. package/dist/cjs/gb-horizontal-tabs.cjs.entry.js +19 -25
  18. package/dist/cjs/gb-horizontal-tabs.cjs.entry.js.map +1 -1
  19. package/dist/cjs/gb-horizontal-tabs.entry.cjs.js.map +1 -1
  20. package/dist/cjs/gb-icon-button-base.cjs.entry.js +1 -1
  21. package/dist/cjs/gb-input-dropdown.gb-pagination-button-group-base.gb-pagination-number-base.entry.cjs.js.map +1 -1
  22. package/dist/cjs/gb-input-dropdown_3.cjs.entry.js +6 -5
  23. package/dist/cjs/gb-input-dropdown_3.cjs.entry.js.map +1 -1
  24. package/dist/cjs/gb-mega-input-field-base.cjs.entry.js +2 -2
  25. package/dist/cjs/{gb-top-bar-item.cjs.entry.js → gb-nav-bar-item.cjs.entry.js} +11 -7
  26. package/dist/cjs/gb-nav-bar-item.cjs.entry.js.map +1 -0
  27. package/dist/cjs/gb-nav-bar-item.entry.cjs.js.map +1 -0
  28. package/dist/cjs/gb-nav-bar-sidemenu.cjs.entry.js +55 -0
  29. package/dist/cjs/gb-nav-bar-sidemenu.cjs.entry.js.map +1 -0
  30. package/dist/cjs/gb-nav-bar-sidemenu.entry.cjs.js.map +1 -0
  31. package/dist/cjs/gb-nav-bar.cjs.entry.js +185 -0
  32. package/dist/cjs/gb-nav-bar.cjs.entry.js.map +1 -0
  33. package/dist/cjs/gb-nav-bar.entry.cjs.js.map +1 -0
  34. package/dist/cjs/gb-notification-content.cjs.entry.js +1 -1
  35. package/dist/cjs/gb-notification-pane.cjs.entry.js +3 -3
  36. package/dist/cjs/gb-pagination-dot-group.cjs.entry.js +1 -1
  37. package/dist/cjs/gb-pagination-dot-indicator.cjs.entry.js +1 -1
  38. package/dist/cjs/gb-pagination.cjs.entry.js +4 -4
  39. package/dist/cjs/gb-progress-circle.cjs.entry.js +1 -1
  40. package/dist/cjs/gb-quick-action-card.cjs.entry.js +1 -1
  41. package/dist/cjs/gb-quick-action-icon.cjs.entry.js +1 -1
  42. package/dist/cjs/gb-scrollbar.cjs.entry.js +1 -1
  43. package/dist/cjs/gb-slider-control-handle.cjs.entry.js +1 -1
  44. package/dist/cjs/gb-slider.cjs.entry.js +1 -1
  45. package/dist/cjs/gb-stepper-horizontal-icons-centered.cjs.entry.js +1 -1
  46. package/dist/cjs/gb-stepper-horizontal-icons-connected.cjs.entry.js +1 -1
  47. package/dist/cjs/gb-stepper-horizontal-line-with-text.cjs.entry.js +1 -1
  48. package/dist/cjs/gb-stepper-horizontal-minimal-icons.cjs.entry.js +1 -1
  49. package/dist/cjs/gb-stepper-vertical-icons-with-text.cjs.entry.js +1 -1
  50. package/dist/cjs/gb-tab-button-base.cjs.entry.js +3 -3
  51. package/dist/cjs/gb-table-cell.cjs.entry.js +1 -1
  52. package/dist/cjs/gb-table-header.cjs.entry.js +1 -1
  53. package/dist/cjs/gb-textarea-input-field.cjs.entry.js +10 -4
  54. package/dist/cjs/gb-textarea-input-field.cjs.entry.js.map +1 -1
  55. package/dist/cjs/gb-textarea-input-field.entry.cjs.js.map +1 -1
  56. package/dist/cjs/gb-toast-button.cjs.entry.js +1 -1
  57. package/dist/cjs/gb-toast.cjs.entry.js +1 -1
  58. package/dist/cjs/gb-toggle-base.cjs.entry.js +2 -2
  59. package/dist/cjs/gb-toggle.cjs.entry.js +1 -1
  60. package/dist/cjs/gb-token-field-compact.cjs.entry.js +1 -1
  61. package/dist/cjs/gb-token-field-compressed.cjs.entry.js +2 -2
  62. package/dist/cjs/gb-vertical-tabs.cjs.entry.js +18 -22
  63. package/dist/cjs/gb-vertical-tabs.cjs.entry.js.map +1 -1
  64. package/dist/cjs/gb-vertical-tabs.entry.cjs.js.map +1 -1
  65. package/dist/cjs/gb-wysiwyg-editor-icon.cjs.entry.js +1 -1
  66. package/dist/cjs/gb-wysiwyg-tooltip.cjs.entry.js +1 -1
  67. package/dist/cjs/globuscomponents.cjs.js +1 -1
  68. package/dist/cjs/loader.cjs.js +1 -1
  69. package/dist/cjs/test-input-tag.cjs.entry.js +2 -2
  70. package/dist/collection/assets/more.svg +9 -0
  71. package/dist/collection/collection-manifest.json +3 -3
  72. package/dist/collection/components/gb-dropdown-items-with-shortcut/gb-dropdown-items-with-shortcut.css +4 -0
  73. package/dist/collection/components/gb-dropdown-items-with-shortcut/gb-dropdown-items-with-shortcut.js +10 -1
  74. package/dist/collection/components/gb-dropdown-items-with-shortcut/gb-dropdown-items-with-shortcut.js.map +1 -1
  75. package/dist/collection/components/gb-header/gb-header.css +45 -38
  76. package/dist/collection/components/gb-header/gb-header.js +89 -6
  77. package/dist/collection/components/gb-header/gb-header.js.map +1 -1
  78. package/dist/collection/components/gb-header-icon/gb-header-icon.js +1 -1
  79. package/dist/collection/components/gb-help-dropdown/gb-help-dropdown.js +1 -1
  80. package/dist/collection/components/gb-help-tooltip/gb-help-tooltip.js +1 -1
  81. package/dist/collection/components/gb-horizontal-tabs/gb-horizontal-tabs.js +33 -418
  82. package/dist/collection/components/gb-horizontal-tabs/gb-horizontal-tabs.js.map +1 -1
  83. package/dist/collection/components/gb-icon-button-base/gb-icon-button-base.js +1 -1
  84. package/dist/collection/components/gb-input-dropdown/gb-input-dropdown.js +24 -3
  85. package/dist/collection/components/gb-input-dropdown/gb-input-dropdown.js.map +1 -1
  86. package/dist/collection/components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.js +2 -2
  87. package/dist/collection/components/gb-input-field/gb-input-field.css +8 -0
  88. package/dist/collection/components/gb-input-field/gb-input-field.js +33 -12
  89. package/dist/collection/components/gb-input-field/gb-input-field.js.map +1 -1
  90. package/dist/collection/components/gb-mega-input-field-base/gb-mega-input-field-base.js +2 -2
  91. package/dist/collection/components/gb-metric-card/gb-metric-card.js +43 -1
  92. package/dist/collection/components/gb-metric-card/gb-metric-card.js.map +1 -1
  93. package/dist/collection/components/gb-metric-featured-icon/gb-metric-featured-icon.js +1 -1
  94. package/dist/collection/components/gb-nav-bar/gb-nav-bar.css +82 -0
  95. package/dist/collection/components/gb-nav-bar/gb-nav-bar.js +303 -0
  96. package/dist/collection/components/gb-nav-bar/gb-nav-bar.js.map +1 -0
  97. package/dist/collection/components/{gb-top-bar-item/gb-top-bar-item.css → gb-nav-bar-item/gb-nav-bar-item.css} +7 -3
  98. package/dist/collection/components/{gb-top-bar-item/gb-top-bar-item.js → gb-nav-bar-item/gb-nav-bar-item.js} +10 -6
  99. package/dist/collection/components/gb-nav-bar-item/gb-nav-bar-item.js.map +1 -0
  100. package/dist/collection/components/{gb-top-bar-sidemenu/gb-top-bar-sidemenu.css → gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.css} +1 -1
  101. package/dist/collection/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.js +160 -0
  102. package/dist/collection/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.js.map +1 -0
  103. package/dist/collection/components/gb-notification-content/gb-notification-content.js +1 -1
  104. package/dist/collection/components/gb-notification-pane/gb-notification-pane.js +3 -3
  105. package/dist/collection/components/gb-pagination/gb-pagination.js +4 -4
  106. package/dist/collection/components/gb-pagination-button-group-base/gb-pagination-button-group-base.js +1 -1
  107. package/dist/collection/components/gb-pagination-dot-group/gb-pagination-dot-group.js +1 -1
  108. package/dist/collection/components/gb-pagination-dot-indicator/gb-pagination-dot-indicator.js +1 -1
  109. package/dist/collection/components/gb-pagination-number-base/gb-pagination-number-base.js +1 -1
  110. package/dist/collection/components/gb-password-button/gb-password-button.js +1 -1
  111. package/dist/collection/components/gb-progress-bar/gb-progress-bar.js +1 -1
  112. package/dist/collection/components/gb-progress-circle/gb-progress-circle.js +1 -1
  113. package/dist/collection/components/gb-quick-action-card/gb-quick-action-card.js +1 -1
  114. package/dist/collection/components/gb-quick-action-icon/gb-quick-action-icon.js +1 -1
  115. package/dist/collection/components/gb-scrollbar/gb-scrollbar.js +1 -1
  116. package/dist/collection/components/gb-sidebar/gb-sidebar.css +5 -0
  117. package/dist/collection/components/gb-sidebar/gb-sidebar.js +1 -1
  118. package/dist/collection/components/gb-sidebar/gb-sidebar.js.map +1 -1
  119. package/dist/collection/components/gb-simple-side-bar-item/gb-simple-side-bar-item.js +5 -1
  120. package/dist/collection/components/gb-simple-side-bar-item/gb-simple-side-bar-item.js.map +1 -1
  121. package/dist/collection/components/gb-slider/gb-slider.js +1 -1
  122. package/dist/collection/components/gb-slider-control-handle/gb-slider-control-handle.js +1 -1
  123. package/dist/collection/components/gb-status-indicator/gb-status-indicator.js +1 -1
  124. package/dist/collection/components/gb-step-base/gb-step-base.js +1 -1
  125. package/dist/collection/components/gb-step-icon-base/gb-step-icon-base.js +1 -1
  126. package/dist/collection/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.js +1 -1
  127. package/dist/collection/components/gb-stepper-horizontal-icons-connected/gb-stepper-horizontal-icons-connected.js +1 -1
  128. package/dist/collection/components/gb-stepper-horizontal-line-with-text/gb-stepper-horizontal-line-with-text.js +1 -1
  129. package/dist/collection/components/gb-stepper-horizontal-minimal-icons/gb-stepper-horizontal-minimal-icons.js +1 -1
  130. package/dist/collection/components/gb-stepper-vertical-icons-with-text/gb-stepper-vertical-icons-with-text.js +1 -1
  131. package/dist/collection/components/gb-tab-button-base/gb-tab-button-base.js +3 -3
  132. package/dist/collection/components/gb-table-cell/gb-table-cell.js +1 -1
  133. package/dist/collection/components/gb-table-header/gb-table-header.js +1 -1
  134. package/dist/collection/components/gb-tag/gb-tag.js +1 -1
  135. package/dist/collection/components/gb-tag-checkbox/gb-tag-checkbox.js +1 -1
  136. package/dist/collection/components/gb-tag-close/gb-tag-close.js +1 -1
  137. package/dist/collection/components/gb-tag-count/gb-tag-count.js +1 -1
  138. package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.js +30 -4
  139. package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.js.map +1 -1
  140. package/dist/collection/components/gb-theme-tab/gb-theme-tab.js +1 -1
  141. package/dist/collection/components/gb-toast/gb-toast.js +1 -1
  142. package/dist/collection/components/gb-toast-button/gb-toast-button.js +1 -1
  143. package/dist/collection/components/gb-toggle/gb-toggle.js +1 -1
  144. package/dist/collection/components/gb-toggle-base/gb-toggle-base.js +2 -2
  145. package/dist/collection/components/gb-token-field-compact/gb-token-field-compact.js +1 -1
  146. package/dist/collection/components/gb-token-field-compressed/gb-token-field-compressed.js +2 -2
  147. package/dist/collection/components/gb-tooltip/gb-tooltip.js +1 -1
  148. package/dist/collection/components/gb-vertical-tabs/gb-vertical-tabs.js +39 -417
  149. package/dist/collection/components/gb-vertical-tabs/gb-vertical-tabs.js.map +1 -1
  150. package/dist/collection/components/gb-wysiwyg-editor-icon/gb-wysiwyg-editor-icon.js +1 -1
  151. package/dist/collection/components/gb-wysiwyg-tooltip/gb-wysiwyg-tooltip.js +1 -1
  152. package/dist/collection/components/test-input-tag/test-input-tag.js +2 -2
  153. package/dist/components/gb-avatar-add-button.js +1 -1
  154. package/dist/components/gb-avatar-dropdown.js +8 -8
  155. package/dist/components/gb-avatar-group.js +4 -4
  156. package/dist/components/gb-avatar-label-group.js +1 -1
  157. package/dist/components/gb-avatar-profile-photo.js +2 -2
  158. package/dist/components/gb-avatar.js +1 -1
  159. package/dist/components/gb-badge.js +1 -1
  160. package/dist/components/gb-checkbox-group-item.js +1 -1
  161. package/dist/components/gb-checkbox-group.js +3 -3
  162. package/dist/components/gb-collapse-button.js +1 -1
  163. package/dist/components/gb-complex-primary-side-bar-item.js +1 -1
  164. package/dist/components/gb-complex-secondary-side-bar-item.js +1 -1
  165. package/dist/components/gb-detail-cell.js +4 -4
  166. package/dist/components/gb-dropdown-items-with-shortcut.js +1 -1
  167. package/dist/components/gb-file-upload-item-base.js +1 -1
  168. package/dist/components/gb-file-upload.js +3 -3
  169. package/dist/components/gb-filter-button.js +1 -1
  170. package/dist/components/gb-header-icon.js +1 -1
  171. package/dist/components/gb-header.js +101 -12
  172. package/dist/components/gb-header.js.map +1 -1
  173. package/dist/components/gb-help-dropdown.js +2 -2
  174. package/dist/components/gb-help-tooltip.js +1 -1
  175. package/dist/components/gb-horizontal-tabs.js +27 -50
  176. package/dist/components/gb-horizontal-tabs.js.map +1 -1
  177. package/dist/components/gb-icon-button-base.js +1 -1
  178. package/dist/components/gb-input-dropdown-menu-item.js +1 -1
  179. package/dist/components/gb-input-dropdown.js +1 -1
  180. package/dist/components/gb-input-field.js +1 -1
  181. package/dist/components/gb-mega-input-field-base.js +1 -1
  182. package/dist/components/gb-metric-card.js +10 -6
  183. package/dist/components/gb-metric-card.js.map +1 -1
  184. package/dist/components/gb-metric-featured-icon.js +1 -1
  185. package/dist/components/{gb-top-bar-item.d.ts → gb-nav-bar-item.d.ts} +4 -4
  186. package/dist/components/gb-nav-bar-item.js +9 -0
  187. package/dist/components/gb-nav-bar-item.js.map +1 -0
  188. package/dist/components/{gb-top-bar-sidemenu.d.ts → gb-nav-bar-sidemenu.d.ts} +4 -4
  189. package/dist/components/gb-nav-bar-sidemenu.js +120 -0
  190. package/dist/components/gb-nav-bar-sidemenu.js.map +1 -0
  191. package/dist/components/{gb-top-bar.d.ts → gb-nav-bar.d.ts} +4 -4
  192. package/dist/components/gb-nav-bar.js +245 -0
  193. package/dist/components/gb-nav-bar.js.map +1 -0
  194. package/dist/components/gb-notification-content.js +1 -1
  195. package/dist/components/gb-notification-pane.js +4 -4
  196. package/dist/components/gb-pagination-button-group-base.js +1 -1
  197. package/dist/components/gb-pagination-dot-group.js +1 -1
  198. package/dist/components/gb-pagination-dot-indicator.js +1 -1
  199. package/dist/components/gb-pagination-number-base.js +1 -1
  200. package/dist/components/gb-pagination.js +18 -18
  201. package/dist/components/gb-password-button.js +1 -1
  202. package/dist/components/gb-progress-bar.js +1 -1
  203. package/dist/components/gb-progress-circle.js +1 -1
  204. package/dist/components/gb-quick-action-card.js +1 -1
  205. package/dist/components/gb-quick-action-icon.js +1 -1
  206. package/dist/components/gb-scrollbar.js +1 -1
  207. package/dist/components/gb-sidebar.js +10 -10
  208. package/dist/components/gb-sidebar.js.map +1 -1
  209. package/dist/components/gb-simple-side-bar-item.js +1 -1
  210. package/dist/components/gb-slider-control-handle.js +1 -1
  211. package/dist/components/gb-slider.js +3 -3
  212. package/dist/components/gb-status-indicator.js +1 -1
  213. package/dist/components/gb-step-base.js +1 -1
  214. package/dist/components/gb-step-icon-base.js +1 -1
  215. package/dist/components/gb-stepper-horizontal-icons-centered.js +3 -3
  216. package/dist/components/gb-stepper-horizontal-icons-connected.js +1 -1
  217. package/dist/components/gb-stepper-horizontal-line-with-text.js +3 -3
  218. package/dist/components/gb-stepper-horizontal-minimal-icons.js +2 -2
  219. package/dist/components/gb-stepper-vertical-icons-with-text.js +3 -3
  220. package/dist/components/gb-tab-button-base.js +1 -1
  221. package/dist/components/gb-table-cell.js +1 -1
  222. package/dist/components/gb-table-header.js +14 -14
  223. package/dist/components/gb-tag-checkbox.js +1 -1
  224. package/dist/components/gb-tag-close.js +1 -1
  225. package/dist/components/gb-tag-count.js +1 -1
  226. package/dist/components/gb-tag.js +1 -1
  227. package/dist/components/gb-textarea-input-field.js +18 -11
  228. package/dist/components/gb-textarea-input-field.js.map +1 -1
  229. package/dist/components/gb-theme-tab.js +1 -1
  230. package/dist/components/gb-toast-button.js +1 -1
  231. package/dist/components/gb-toast.js +2 -2
  232. package/dist/components/gb-toggle-base.js +1 -1
  233. package/dist/components/gb-toggle.js +2 -2
  234. package/dist/components/gb-token-field-compact.js +1 -1
  235. package/dist/components/gb-token-field-compressed.js +3 -3
  236. package/dist/components/gb-tooltip.js +1 -1
  237. package/dist/components/gb-vertical-tabs.js +1 -1
  238. package/dist/components/gb-wysiwyg-editor-icon.js +1 -1
  239. package/dist/components/gb-wysiwyg-tooltip.js +2 -2
  240. package/dist/components/{p-COMhU3i-.js → p-BEi8B0ba.js} +3 -3
  241. package/dist/components/{p-COMhU3i-.js.map → p-BEi8B0ba.js.map} +1 -1
  242. package/dist/components/{p-DiuvoxSN.js → p-BGv2320n.js} +3 -3
  243. package/dist/components/{p-DiuvoxSN.js.map → p-BGv2320n.js.map} +1 -1
  244. package/dist/components/{p-DjOQCrPe.js → p-BOsBGsXy.js} +3 -3
  245. package/dist/components/{p-DjOQCrPe.js.map → p-BOsBGsXy.js.map} +1 -1
  246. package/dist/components/{p-BHFFVzVD.js → p-BPn73l91.js} +16 -12
  247. package/dist/components/p-BPn73l91.js.map +1 -0
  248. package/dist/components/{p-C8sFWX91.js → p-BZ1mH78n.js} +4 -4
  249. package/dist/components/{p-C8sFWX91.js.map → p-BZ1mH78n.js.map} +1 -1
  250. package/dist/components/{p-K8L3X442.js → p-BbYiE_Ws.js} +13 -4
  251. package/dist/components/p-BbYiE_Ws.js.map +1 -0
  252. package/dist/components/{p-oo6gmYsi.js → p-Bbk8oig3.js} +3 -3
  253. package/dist/components/{p-oo6gmYsi.js.map → p-Bbk8oig3.js.map} +1 -1
  254. package/dist/components/{p-CNbsRfAA.js → p-BdEUHRwK.js} +5 -5
  255. package/dist/components/{p-CNbsRfAA.js.map → p-BdEUHRwK.js.map} +1 -1
  256. package/dist/components/{p-C3MnB-mv.js → p-BiwC-xCD.js} +3 -3
  257. package/dist/components/{p-C3MnB-mv.js.map → p-BiwC-xCD.js.map} +1 -1
  258. package/dist/components/{p-DzSc4bzU.js → p-BnFFEa0u.js} +6 -6
  259. package/dist/components/{p-DzSc4bzU.js.map → p-BnFFEa0u.js.map} +1 -1
  260. package/dist/components/{p-CQtb6hf7.js → p-BswrDy0Z.js} +3 -3
  261. package/dist/components/{p-CQtb6hf7.js.map → p-BswrDy0Z.js.map} +1 -1
  262. package/dist/components/{p-B4Zk0zIW.js → p-C47pgbwk.js} +3 -3
  263. package/dist/components/{p-B4Zk0zIW.js.map → p-C47pgbwk.js.map} +1 -1
  264. package/dist/components/{p-DI3CRl5i.js → p-C4Wqp2ub.js} +3 -3
  265. package/dist/components/{p-DI3CRl5i.js.map → p-C4Wqp2ub.js.map} +1 -1
  266. package/dist/components/p-C59Bge1L.js +101 -0
  267. package/dist/components/p-C59Bge1L.js.map +1 -0
  268. package/dist/components/{p-CDATEaai.js → p-C5hfsfyl.js} +3 -3
  269. package/dist/components/{p-CDATEaai.js.map → p-C5hfsfyl.js.map} +1 -1
  270. package/dist/components/{p-NbsppXwR.js → p-CBztft9m.js} +8 -8
  271. package/dist/components/{p-NbsppXwR.js.map → p-CBztft9m.js.map} +1 -1
  272. package/dist/components/{p-BLbIMqN3.js → p-CCsxDeGv.js} +3 -3
  273. package/dist/components/{p-BLbIMqN3.js.map → p-CCsxDeGv.js.map} +1 -1
  274. package/dist/components/{p-D0gt9QUj.js → p-CEdTZzy-.js} +4 -4
  275. package/dist/components/{p-D0gt9QUj.js.map → p-CEdTZzy-.js.map} +1 -1
  276. package/dist/components/{p-CkYe2e9d.js → p-CTddvX8z.js} +3 -3
  277. package/dist/components/{p-CkYe2e9d.js.map → p-CTddvX8z.js.map} +1 -1
  278. package/dist/components/{p-CFvpAbXd.js → p-CWPswiLC.js} +4 -4
  279. package/dist/components/{p-CFvpAbXd.js.map → p-CWPswiLC.js.map} +1 -1
  280. package/dist/components/{p-Bb9vJuLT.js → p-CZ3smMnl.js} +18 -16
  281. package/dist/components/p-CZ3smMnl.js.map +1 -0
  282. package/dist/components/{p-C4buNZJc.js → p-CjMyK3tT.js} +3 -3
  283. package/dist/components/{p-C4buNZJc.js.map → p-CjMyK3tT.js.map} +1 -1
  284. package/dist/components/{p-DZueqOlF.js → p-CllCou_l.js} +3 -3
  285. package/dist/components/{p-DZueqOlF.js.map → p-CllCou_l.js.map} +1 -1
  286. package/dist/components/{p-D84ECuQ1.js → p-CoASAB-G.js} +4 -4
  287. package/dist/components/{p-D84ECuQ1.js.map → p-CoASAB-G.js.map} +1 -1
  288. package/dist/components/{p-geu2VU2x.js → p-CvJHKkAK.js} +4 -4
  289. package/dist/components/{p-geu2VU2x.js.map → p-CvJHKkAK.js.map} +1 -1
  290. package/dist/components/{p-BTXwbKAW.js → p-Cwh9x1wZ.js} +11 -7
  291. package/dist/components/p-Cwh9x1wZ.js.map +1 -0
  292. package/dist/components/{p-paqSaxGO.js → p-DI2bdAKN.js} +8 -8
  293. package/dist/components/{p-paqSaxGO.js.map → p-DI2bdAKN.js.map} +1 -1
  294. package/dist/components/{p-CZbcFA8n.js → p-DLTKp444.js} +3 -3
  295. package/dist/components/{p-CZbcFA8n.js.map → p-DLTKp444.js.map} +1 -1
  296. package/dist/components/{p-BWSqFonT.js → p-DcbS97OK.js} +3 -3
  297. package/dist/components/{p-BWSqFonT.js.map → p-DcbS97OK.js.map} +1 -1
  298. package/dist/components/{p-C3ueNYea.js → p-DrPbTpq9.js} +3 -3
  299. package/dist/components/{p-C3ueNYea.js.map → p-DrPbTpq9.js.map} +1 -1
  300. package/dist/components/{p-EP9XnK3Q.js → p-Du5S3uEN.js} +4 -4
  301. package/dist/components/{p-EP9XnK3Q.js.map → p-Du5S3uEN.js.map} +1 -1
  302. package/dist/components/{p-DRnUvgrX.js → p-Dzq2ZwfA.js} +4 -4
  303. package/dist/components/{p-DRnUvgrX.js.map → p-Dzq2ZwfA.js.map} +1 -1
  304. package/dist/components/{p-2iwcIBBs.js → p-EGfRX9m-.js} +3 -3
  305. package/dist/components/{p-2iwcIBBs.js.map → p-EGfRX9m-.js.map} +1 -1
  306. package/dist/components/{p-BovH1ixz.js → p-OLaa8Yku.js} +4 -4
  307. package/dist/components/{p-BovH1ixz.js.map → p-OLaa8Yku.js.map} +1 -1
  308. package/dist/components/{p-CrylTnn9.js → p-XjW4rAiY.js} +3 -3
  309. package/dist/components/{p-CrylTnn9.js.map → p-XjW4rAiY.js.map} +1 -1
  310. package/dist/components/{p-C6n_ZxhO.js → p-ZjoFesPY.js} +5 -5
  311. package/dist/components/{p-C6n_ZxhO.js.map → p-ZjoFesPY.js.map} +1 -1
  312. package/dist/components/{p-Dnh98lXd.js → p-_YFiwVxe.js} +4 -4
  313. package/dist/components/{p-Dnh98lXd.js.map → p-_YFiwVxe.js.map} +1 -1
  314. package/dist/components/{p-Cm-uLVvE.js → p-g3Ffd3n9.js} +3 -3
  315. package/dist/components/{p-Cm-uLVvE.js.map → p-g3Ffd3n9.js.map} +1 -1
  316. package/dist/components/{p-Wn-YPzZ7.js → p-r5HizPK6.js} +27 -25
  317. package/dist/components/p-r5HizPK6.js.map +1 -0
  318. package/dist/components/{p-oH8n2qsq.js → p-v-wX8-Qu.js} +4 -4
  319. package/dist/components/{p-oH8n2qsq.js.map → p-v-wX8-Qu.js.map} +1 -1
  320. package/dist/components/{p-DAq7WFid.js → p-x0_pwfAX.js} +4 -4
  321. package/dist/components/{p-DAq7WFid.js.map → p-x0_pwfAX.js.map} +1 -1
  322. package/dist/components/test-input-tag.js +9 -9
  323. package/dist/docs.json +6271 -7487
  324. package/dist/esm/gb-avatar-label-group_2.entry.js +1 -1
  325. package/dist/esm/gb-avatar_25.entry.js +1512 -0
  326. package/dist/esm/gb-avatar_25.entry.js.map +1 -0
  327. package/dist/esm/gb-checkbox-group-item.entry.js +146 -0
  328. package/dist/esm/gb-checkbox-group-item.entry.js.map +1 -0
  329. package/dist/esm/gb-dropdown-items-with-shortcut.entry.js +11 -2
  330. package/dist/esm/gb-dropdown-items-with-shortcut.entry.js.map +1 -1
  331. package/dist/esm/gb-featured-icon_3.entry.js +2 -2
  332. package/dist/esm/gb-file-type-icon_2.entry.js +1 -1
  333. package/dist/esm/gb-header-icon.entry.js +1 -1
  334. package/dist/esm/gb-header.entry.js +12 -4
  335. package/dist/esm/gb-header.entry.js.map +1 -1
  336. package/dist/esm/gb-help-dropdown.entry.js +1 -1
  337. package/dist/esm/gb-horizontal-tabs.entry.js +19 -25
  338. package/dist/esm/gb-horizontal-tabs.entry.js.map +1 -1
  339. package/dist/esm/gb-icon-button-base.entry.js +1 -1
  340. package/dist/esm/gb-input-dropdown.gb-pagination-button-group-base.gb-pagination-number-base.entry.js.map +1 -1
  341. package/dist/esm/gb-input-dropdown_3.entry.js +6 -5
  342. package/dist/esm/gb-input-dropdown_3.entry.js.map +1 -1
  343. package/dist/esm/gb-mega-input-field-base.entry.js +2 -2
  344. package/dist/esm/{gb-top-bar-item.entry.js → gb-nav-bar-item.entry.js} +11 -7
  345. package/dist/esm/gb-nav-bar-item.entry.js.map +1 -0
  346. package/dist/esm/gb-nav-bar-sidemenu.entry.js +53 -0
  347. package/dist/esm/gb-nav-bar-sidemenu.entry.js.map +1 -0
  348. package/dist/esm/gb-nav-bar.entry.js +183 -0
  349. package/dist/esm/gb-nav-bar.entry.js.map +1 -0
  350. package/dist/esm/gb-notification-content.entry.js +1 -1
  351. package/dist/esm/gb-notification-pane.entry.js +3 -3
  352. package/dist/esm/gb-pagination-dot-group.entry.js +1 -1
  353. package/dist/esm/gb-pagination-dot-indicator.entry.js +1 -1
  354. package/dist/esm/gb-pagination.entry.js +4 -4
  355. package/dist/esm/gb-progress-circle.entry.js +1 -1
  356. package/dist/esm/gb-quick-action-card.entry.js +1 -1
  357. package/dist/esm/gb-quick-action-icon.entry.js +1 -1
  358. package/dist/esm/gb-scrollbar.entry.js +1 -1
  359. package/dist/esm/gb-slider-control-handle.entry.js +1 -1
  360. package/dist/esm/gb-slider.entry.js +1 -1
  361. package/dist/esm/gb-stepper-horizontal-icons-centered.entry.js +1 -1
  362. package/dist/esm/gb-stepper-horizontal-icons-connected.entry.js +1 -1
  363. package/dist/esm/gb-stepper-horizontal-line-with-text.entry.js +1 -1
  364. package/dist/esm/gb-stepper-horizontal-minimal-icons.entry.js +1 -1
  365. package/dist/esm/gb-stepper-vertical-icons-with-text.entry.js +1 -1
  366. package/dist/esm/gb-tab-button-base.entry.js +3 -3
  367. package/dist/esm/gb-table-cell.entry.js +1 -1
  368. package/dist/esm/gb-table-header.entry.js +1 -1
  369. package/dist/esm/gb-textarea-input-field.entry.js +10 -4
  370. package/dist/esm/gb-textarea-input-field.entry.js.map +1 -1
  371. package/dist/esm/gb-toast-button.entry.js +1 -1
  372. package/dist/esm/gb-toast.entry.js +1 -1
  373. package/dist/esm/gb-toggle-base.entry.js +2 -2
  374. package/dist/esm/gb-toggle.entry.js +1 -1
  375. package/dist/esm/gb-token-field-compact.entry.js +1 -1
  376. package/dist/esm/gb-token-field-compressed.entry.js +2 -2
  377. package/dist/esm/gb-vertical-tabs.entry.js +18 -22
  378. package/dist/esm/gb-vertical-tabs.entry.js.map +1 -1
  379. package/dist/esm/gb-wysiwyg-editor-icon.entry.js +1 -1
  380. package/dist/esm/gb-wysiwyg-tooltip.entry.js +1 -1
  381. package/dist/esm/globuscomponents.js +1 -1
  382. package/dist/esm/loader.js +1 -1
  383. package/dist/esm/test-input-tag.entry.js +2 -2
  384. package/dist/globuscomponents/assets/more.svg +9 -0
  385. package/dist/globuscomponents/gb-checkbox-group-item.entry.esm.js.map +1 -0
  386. package/dist/globuscomponents/gb-dropdown-items-with-shortcut.entry.esm.js.map +1 -1
  387. package/dist/globuscomponents/gb-header.entry.esm.js.map +1 -1
  388. package/dist/globuscomponents/gb-horizontal-tabs.entry.esm.js.map +1 -1
  389. package/dist/globuscomponents/gb-input-dropdown.gb-pagination-button-group-base.gb-pagination-number-base.entry.esm.js.map +1 -1
  390. package/dist/globuscomponents/gb-nav-bar-item.entry.esm.js.map +1 -0
  391. package/dist/globuscomponents/gb-nav-bar-sidemenu.entry.esm.js.map +1 -0
  392. package/dist/globuscomponents/gb-nav-bar.entry.esm.js.map +1 -0
  393. package/dist/globuscomponents/gb-textarea-input-field.entry.esm.js.map +1 -1
  394. package/dist/globuscomponents/gb-vertical-tabs.entry.esm.js.map +1 -1
  395. package/dist/globuscomponents/globuscomponents.esm.js +1 -1
  396. package/dist/globuscomponents/{p-0484f78b.entry.js → p-05a36742.entry.js} +2 -2
  397. package/dist/globuscomponents/p-05a36742.entry.js.map +1 -0
  398. package/dist/globuscomponents/{p-6451a9ce.entry.js → p-05ea26dc.entry.js} +2 -2
  399. package/dist/globuscomponents/{p-17b16971.entry.js → p-05f77672.entry.js} +2 -2
  400. package/dist/globuscomponents/p-09b37d23.entry.js +2 -0
  401. package/dist/globuscomponents/p-09b37d23.entry.js.map +1 -0
  402. package/dist/globuscomponents/{p-24fd4c77.entry.js → p-0d111efe.entry.js} +2 -2
  403. package/dist/globuscomponents/p-1656c630.entry.js +2 -0
  404. package/dist/globuscomponents/{p-d5b2ed1b.entry.js → p-1ea19c48.entry.js} +2 -2
  405. package/dist/globuscomponents/p-1f29eff6.entry.js +2 -0
  406. package/dist/globuscomponents/p-1f29eff6.entry.js.map +1 -0
  407. package/dist/globuscomponents/p-1fecb9bc.entry.js +2 -0
  408. package/dist/globuscomponents/p-1fecb9bc.entry.js.map +1 -0
  409. package/dist/globuscomponents/p-2f022da6.entry.js +2 -0
  410. package/dist/globuscomponents/p-2f022da6.entry.js.map +1 -0
  411. package/dist/globuscomponents/p-325682b7.entry.js +2 -0
  412. package/dist/globuscomponents/p-325682b7.entry.js.map +1 -0
  413. package/dist/globuscomponents/{p-03024240.entry.js → p-368da9a1.entry.js} +2 -2
  414. package/dist/globuscomponents/{p-e9474978.entry.js → p-47f1553c.entry.js} +2 -2
  415. package/dist/globuscomponents/{p-7658a033.entry.js → p-4be40100.entry.js} +2 -2
  416. package/dist/globuscomponents/{p-fa20bf82.entry.js → p-5339db78.entry.js} +2 -2
  417. package/dist/globuscomponents/{p-20eba1a1.entry.js → p-543b79c2.entry.js} +2 -2
  418. package/dist/globuscomponents/{p-ff6ca3b0.entry.js → p-61f35bc1.entry.js} +2 -2
  419. package/dist/globuscomponents/{p-c566e88b.entry.js → p-66dd9b74.entry.js} +2 -2
  420. package/dist/globuscomponents/p-6b081d70.entry.js +2 -0
  421. package/dist/globuscomponents/{p-2a118717.entry.js → p-6c54fe01.entry.js} +2 -2
  422. package/dist/globuscomponents/{p-ba3f9eb1.entry.js → p-771977ec.entry.js} +2 -2
  423. package/dist/globuscomponents/p-799e67d0.entry.js +2 -0
  424. package/dist/globuscomponents/{p-8dcc77ca.entry.js → p-853a4f0d.entry.js} +2 -2
  425. package/dist/globuscomponents/{p-3f167798.entry.js → p-8938964a.entry.js} +2 -2
  426. package/dist/globuscomponents/{p-69bed830.entry.js → p-8c4c85ed.entry.js} +2 -2
  427. package/dist/globuscomponents/{p-fbddd3e7.entry.js → p-9a84e3d5.entry.js} +2 -2
  428. package/dist/globuscomponents/p-9a84e3d5.entry.js.map +1 -0
  429. package/dist/globuscomponents/{p-a7a52e60.entry.js → p-9c72435d.entry.js} +2 -2
  430. package/dist/globuscomponents/p-a0480cfd.entry.js +2 -0
  431. package/dist/globuscomponents/{p-ed997c44.entry.js → p-a105b6d7.entry.js} +2 -2
  432. package/dist/globuscomponents/{p-d83762d3.entry.js → p-a17eb580.entry.js} +2 -2
  433. package/dist/globuscomponents/p-a4b2d7f5.entry.js +2 -0
  434. package/dist/globuscomponents/p-a4b2d7f5.entry.js.map +1 -0
  435. package/dist/globuscomponents/{p-92a863a5.entry.js → p-a596fae9.entry.js} +2 -2
  436. package/dist/globuscomponents/{p-4f4a0e17.entry.js → p-a7499971.entry.js} +2 -2
  437. package/dist/globuscomponents/{p-b7a9764f.entry.js → p-ace1a2cb.entry.js} +2 -2
  438. package/dist/globuscomponents/{p-7581f0f4.entry.js → p-afc39c5f.entry.js} +2 -2
  439. package/dist/globuscomponents/p-afc39c5f.entry.js.map +1 -0
  440. package/dist/globuscomponents/p-afed55ea.entry.js +2 -0
  441. package/dist/globuscomponents/p-afed55ea.entry.js.map +1 -0
  442. package/dist/globuscomponents/{p-15fec19a.entry.js → p-b655af13.entry.js} +2 -2
  443. package/dist/globuscomponents/{p-78eb8c69.entry.js → p-b6fdb570.entry.js} +2 -2
  444. package/dist/globuscomponents/{p-9f7b06f7.entry.js → p-bc8f7e54.entry.js} +2 -2
  445. package/dist/globuscomponents/{p-7aaa111a.entry.js → p-c5b2179d.entry.js} +2 -2
  446. package/dist/globuscomponents/{p-01acc661.entry.js → p-d4673bdd.entry.js} +2 -2
  447. package/dist/globuscomponents/{p-a60c8538.entry.js → p-ddcf6ca2.entry.js} +2 -2
  448. package/dist/globuscomponents/{p-f6d022c1.entry.js → p-e2728e93.entry.js} +2 -2
  449. package/dist/globuscomponents/{p-c095840c.entry.js → p-e288e951.entry.js} +2 -2
  450. package/dist/globuscomponents/p-e81bd2be.entry.js +2 -0
  451. package/dist/globuscomponents/p-e81bd2be.entry.js.map +1 -0
  452. package/dist/globuscomponents/{p-ead40573.entry.js → p-fbac81bb.entry.js} +2 -2
  453. package/dist/types/components/gb-header/gb-header.d.ts +7 -2
  454. package/dist/types/components/gb-horizontal-tabs/gb-horizontal-tabs.d.ts +15 -20
  455. package/dist/types/components/gb-input-dropdown/gb-input-dropdown.d.ts +1 -0
  456. package/dist/types/components/gb-input-field/gb-input-field.d.ts +1 -0
  457. package/dist/types/components/gb-metric-card/gb-metric-card.d.ts +2 -0
  458. package/dist/types/components/gb-nav-bar/gb-nav-bar.d.ts +40 -0
  459. package/dist/types/components/{gb-top-bar-item/gb-top-bar-item.d.ts → gb-nav-bar-item/gb-nav-bar-item.d.ts} +1 -1
  460. package/dist/types/components/{gb-top-bar-sidemenu/gb-top-bar-sidemenu.d.ts → gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.d.ts} +6 -7
  461. package/dist/types/components/gb-textarea-input-field/gb-textarea-input-field.d.ts +2 -0
  462. package/dist/types/components/gb-vertical-tabs/gb-vertical-tabs.d.ts +14 -22
  463. package/dist/types/components.d.ts +121 -225
  464. package/package.json +1 -1
  465. package/dist/cjs/gb-avatar.gb-avatar-contrast-inner-border.gb-btn.gb-button.gb-checkbox.gb-checkbox-base.gb-checkbox-group-item.gb-status-indicator.entry.cjs.js.map +0 -1
  466. package/dist/cjs/gb-avatar_8.cjs.entry.js +0 -653
  467. package/dist/cjs/gb-avatar_8.cjs.entry.js.map +0 -1
  468. package/dist/cjs/gb-badge.gb-badge-close.entry.cjs.js.map +0 -1
  469. package/dist/cjs/gb-badge_2.cjs.entry.js +0 -100
  470. package/dist/cjs/gb-badge_2.cjs.entry.js.map +0 -1
  471. package/dist/cjs/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.cjs.js.map +0 -1
  472. package/dist/cjs/gb-collapse-button_4.cjs.entry.js +0 -155
  473. package/dist/cjs/gb-collapse-button_4.cjs.entry.js.map +0 -1
  474. package/dist/cjs/gb-help-tooltip.gb-input-field.gb-password-button.entry.cjs.js.map +0 -1
  475. package/dist/cjs/gb-help-tooltip_3.cjs.entry.js +0 -433
  476. package/dist/cjs/gb-help-tooltip_3.cjs.entry.js.map +0 -1
  477. package/dist/cjs/gb-input-dropdown-menu-item.gb-tag.gb-tag-checkbox.gb-tag-close.gb-tag-count.entry.cjs.js.map +0 -1
  478. package/dist/cjs/gb-input-dropdown-menu-item_5.cjs.entry.js +0 -151
  479. package/dist/cjs/gb-input-dropdown-menu-item_5.cjs.entry.js.map +0 -1
  480. package/dist/cjs/gb-metric-card.cjs.entry.js +0 -21
  481. package/dist/cjs/gb-metric-card.cjs.entry.js.map +0 -1
  482. package/dist/cjs/gb-metric-card.entry.cjs.js.map +0 -1
  483. package/dist/cjs/gb-metric-featured-icon.cjs.entry.js +0 -30
  484. package/dist/cjs/gb-metric-featured-icon.cjs.entry.js.map +0 -1
  485. package/dist/cjs/gb-metric-featured-icon.entry.cjs.js.map +0 -1
  486. package/dist/cjs/gb-sidebar.cjs.entry.js +0 -142
  487. package/dist/cjs/gb-sidebar.cjs.entry.js.map +0 -1
  488. package/dist/cjs/gb-sidebar.entry.cjs.js.map +0 -1
  489. package/dist/cjs/gb-tooltip.cjs.entry.js +0 -44
  490. package/dist/cjs/gb-tooltip.cjs.entry.js.map +0 -1
  491. package/dist/cjs/gb-tooltip.entry.cjs.js.map +0 -1
  492. package/dist/cjs/gb-top-bar-item.cjs.entry.js.map +0 -1
  493. package/dist/cjs/gb-top-bar-item.entry.cjs.js.map +0 -1
  494. package/dist/cjs/gb-top-bar-sidemenu.cjs.entry.js +0 -50
  495. package/dist/cjs/gb-top-bar-sidemenu.cjs.entry.js.map +0 -1
  496. package/dist/cjs/gb-top-bar-sidemenu.entry.cjs.js.map +0 -1
  497. package/dist/cjs/gb-top-bar.cjs.entry.js +0 -48
  498. package/dist/cjs/gb-top-bar.cjs.entry.js.map +0 -1
  499. package/dist/cjs/gb-top-bar.entry.cjs.js.map +0 -1
  500. package/dist/collection/components/gb-top-bar/gb-top-bar.css +0 -45
  501. package/dist/collection/components/gb-top-bar/gb-top-bar.js +0 -535
  502. package/dist/collection/components/gb-top-bar/gb-top-bar.js.map +0 -1
  503. package/dist/collection/components/gb-top-bar-item/gb-top-bar-item.js.map +0 -1
  504. package/dist/collection/components/gb-top-bar-sidemenu/gb-top-bar-sidemenu.js +0 -237
  505. package/dist/collection/components/gb-top-bar-sidemenu/gb-top-bar-sidemenu.js.map +0 -1
  506. package/dist/components/gb-top-bar-item.js +0 -9
  507. package/dist/components/gb-top-bar-item.js.map +0 -1
  508. package/dist/components/gb-top-bar-sidemenu.js +0 -119
  509. package/dist/components/gb-top-bar-sidemenu.js.map +0 -1
  510. package/dist/components/gb-top-bar.js +0 -101
  511. package/dist/components/gb-top-bar.js.map +0 -1
  512. package/dist/components/p-BHFFVzVD.js.map +0 -1
  513. package/dist/components/p-BTXwbKAW.js.map +0 -1
  514. package/dist/components/p-Bb9vJuLT.js.map +0 -1
  515. package/dist/components/p-DtROzirg.js +0 -121
  516. package/dist/components/p-DtROzirg.js.map +0 -1
  517. package/dist/components/p-K8L3X442.js.map +0 -1
  518. package/dist/components/p-Wn-YPzZ7.js.map +0 -1
  519. package/dist/esm/gb-avatar.gb-avatar-contrast-inner-border.gb-btn.gb-button.gb-checkbox.gb-checkbox-base.gb-checkbox-group-item.gb-status-indicator.entry.js.map +0 -1
  520. package/dist/esm/gb-avatar_8.entry.js +0 -644
  521. package/dist/esm/gb-avatar_8.entry.js.map +0 -1
  522. package/dist/esm/gb-badge.gb-badge-close.entry.js.map +0 -1
  523. package/dist/esm/gb-badge_2.entry.js +0 -97
  524. package/dist/esm/gb-badge_2.entry.js.map +0 -1
  525. package/dist/esm/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.js.map +0 -1
  526. package/dist/esm/gb-collapse-button_4.entry.js +0 -150
  527. package/dist/esm/gb-collapse-button_4.entry.js.map +0 -1
  528. package/dist/esm/gb-help-tooltip.gb-input-field.gb-password-button.entry.js.map +0 -1
  529. package/dist/esm/gb-help-tooltip_3.entry.js +0 -429
  530. package/dist/esm/gb-help-tooltip_3.entry.js.map +0 -1
  531. package/dist/esm/gb-input-dropdown-menu-item.gb-tag.gb-tag-checkbox.gb-tag-close.gb-tag-count.entry.js.map +0 -1
  532. package/dist/esm/gb-input-dropdown-menu-item_5.entry.js +0 -145
  533. package/dist/esm/gb-input-dropdown-menu-item_5.entry.js.map +0 -1
  534. package/dist/esm/gb-metric-card.entry.js +0 -19
  535. package/dist/esm/gb-metric-card.entry.js.map +0 -1
  536. package/dist/esm/gb-metric-featured-icon.entry.js +0 -28
  537. package/dist/esm/gb-metric-featured-icon.entry.js.map +0 -1
  538. package/dist/esm/gb-sidebar.entry.js +0 -140
  539. package/dist/esm/gb-sidebar.entry.js.map +0 -1
  540. package/dist/esm/gb-tooltip.entry.js +0 -42
  541. package/dist/esm/gb-tooltip.entry.js.map +0 -1
  542. package/dist/esm/gb-top-bar-item.entry.js.map +0 -1
  543. package/dist/esm/gb-top-bar-sidemenu.entry.js +0 -48
  544. package/dist/esm/gb-top-bar-sidemenu.entry.js.map +0 -1
  545. package/dist/esm/gb-top-bar.entry.js +0 -46
  546. package/dist/esm/gb-top-bar.entry.js.map +0 -1
  547. package/dist/globuscomponents/gb-avatar.gb-avatar-contrast-inner-border.gb-btn.gb-button.gb-checkbox.gb-checkbox-base.gb-checkbox-group-item.gb-status-indicator.entry.esm.js.map +0 -1
  548. package/dist/globuscomponents/gb-badge.gb-badge-close.entry.esm.js.map +0 -1
  549. package/dist/globuscomponents/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.esm.js.map +0 -1
  550. package/dist/globuscomponents/gb-help-tooltip.gb-input-field.gb-password-button.entry.esm.js.map +0 -1
  551. package/dist/globuscomponents/gb-input-dropdown-menu-item.gb-tag.gb-tag-checkbox.gb-tag-close.gb-tag-count.entry.esm.js.map +0 -1
  552. package/dist/globuscomponents/gb-metric-card.entry.esm.js.map +0 -1
  553. package/dist/globuscomponents/gb-metric-featured-icon.entry.esm.js.map +0 -1
  554. package/dist/globuscomponents/gb-sidebar.entry.esm.js.map +0 -1
  555. package/dist/globuscomponents/gb-tooltip.entry.esm.js.map +0 -1
  556. package/dist/globuscomponents/gb-top-bar-item.entry.esm.js.map +0 -1
  557. package/dist/globuscomponents/gb-top-bar-sidemenu.entry.esm.js.map +0 -1
  558. package/dist/globuscomponents/gb-top-bar.entry.esm.js.map +0 -1
  559. package/dist/globuscomponents/p-0484f78b.entry.js.map +0 -1
  560. package/dist/globuscomponents/p-135694a3.entry.js +0 -2
  561. package/dist/globuscomponents/p-14c4f052.entry.js +0 -2
  562. package/dist/globuscomponents/p-14c4f052.entry.js.map +0 -1
  563. package/dist/globuscomponents/p-25d3db65.entry.js +0 -2
  564. package/dist/globuscomponents/p-2acb52f8.entry.js +0 -2
  565. package/dist/globuscomponents/p-2acb52f8.entry.js.map +0 -1
  566. package/dist/globuscomponents/p-31b33a00.entry.js +0 -2
  567. package/dist/globuscomponents/p-31b33a00.entry.js.map +0 -1
  568. package/dist/globuscomponents/p-3eb1d3bf.entry.js +0 -2
  569. package/dist/globuscomponents/p-3eb1d3bf.entry.js.map +0 -1
  570. package/dist/globuscomponents/p-611937a7.entry.js +0 -2
  571. package/dist/globuscomponents/p-6d7163b2.entry.js +0 -2
  572. package/dist/globuscomponents/p-6d7163b2.entry.js.map +0 -1
  573. package/dist/globuscomponents/p-7581f0f4.entry.js.map +0 -1
  574. package/dist/globuscomponents/p-8a2b3ed8.entry.js +0 -2
  575. package/dist/globuscomponents/p-8a2b3ed8.entry.js.map +0 -1
  576. package/dist/globuscomponents/p-8eb44bfb.entry.js +0 -2
  577. package/dist/globuscomponents/p-8eb44bfb.entry.js.map +0 -1
  578. package/dist/globuscomponents/p-c1b147dc.entry.js +0 -2
  579. package/dist/globuscomponents/p-d05fc371.entry.js +0 -2
  580. package/dist/globuscomponents/p-d05fc371.entry.js.map +0 -1
  581. package/dist/globuscomponents/p-d4384e78.entry.js +0 -2
  582. package/dist/globuscomponents/p-d4384e78.entry.js.map +0 -1
  583. package/dist/globuscomponents/p-da9094b4.entry.js +0 -2
  584. package/dist/globuscomponents/p-da9094b4.entry.js.map +0 -1
  585. package/dist/globuscomponents/p-e7ecec28.entry.js +0 -2
  586. package/dist/globuscomponents/p-e7ecec28.entry.js.map +0 -1
  587. package/dist/globuscomponents/p-f5be77fd.entry.js +0 -2
  588. package/dist/globuscomponents/p-f5be77fd.entry.js.map +0 -1
  589. package/dist/globuscomponents/p-f71ed1e5.entry.js +0 -2
  590. package/dist/globuscomponents/p-f71ed1e5.entry.js.map +0 -1
  591. package/dist/globuscomponents/p-f9532e39.entry.js +0 -2
  592. package/dist/globuscomponents/p-f9532e39.entry.js.map +0 -1
  593. package/dist/globuscomponents/p-fa99bc25.entry.js +0 -2
  594. package/dist/globuscomponents/p-fa99bc25.entry.js.map +0 -1
  595. package/dist/globuscomponents/p-fbddd3e7.entry.js.map +0 -1
  596. package/dist/types/components/gb-top-bar/gb-top-bar.d.ts +0 -30
  597. /package/dist/globuscomponents/{p-6451a9ce.entry.js.map → p-05ea26dc.entry.js.map} +0 -0
  598. /package/dist/globuscomponents/{p-17b16971.entry.js.map → p-05f77672.entry.js.map} +0 -0
  599. /package/dist/globuscomponents/{p-24fd4c77.entry.js.map → p-0d111efe.entry.js.map} +0 -0
  600. /package/dist/globuscomponents/{p-25d3db65.entry.js.map → p-1656c630.entry.js.map} +0 -0
  601. /package/dist/globuscomponents/{p-d5b2ed1b.entry.js.map → p-1ea19c48.entry.js.map} +0 -0
  602. /package/dist/globuscomponents/{p-03024240.entry.js.map → p-368da9a1.entry.js.map} +0 -0
  603. /package/dist/globuscomponents/{p-e9474978.entry.js.map → p-47f1553c.entry.js.map} +0 -0
  604. /package/dist/globuscomponents/{p-7658a033.entry.js.map → p-4be40100.entry.js.map} +0 -0
  605. /package/dist/globuscomponents/{p-fa20bf82.entry.js.map → p-5339db78.entry.js.map} +0 -0
  606. /package/dist/globuscomponents/{p-20eba1a1.entry.js.map → p-543b79c2.entry.js.map} +0 -0
  607. /package/dist/globuscomponents/{p-ff6ca3b0.entry.js.map → p-61f35bc1.entry.js.map} +0 -0
  608. /package/dist/globuscomponents/{p-c566e88b.entry.js.map → p-66dd9b74.entry.js.map} +0 -0
  609. /package/dist/globuscomponents/{p-c1b147dc.entry.js.map → p-6b081d70.entry.js.map} +0 -0
  610. /package/dist/globuscomponents/{p-2a118717.entry.js.map → p-6c54fe01.entry.js.map} +0 -0
  611. /package/dist/globuscomponents/{p-ba3f9eb1.entry.js.map → p-771977ec.entry.js.map} +0 -0
  612. /package/dist/globuscomponents/{p-135694a3.entry.js.map → p-799e67d0.entry.js.map} +0 -0
  613. /package/dist/globuscomponents/{p-8dcc77ca.entry.js.map → p-853a4f0d.entry.js.map} +0 -0
  614. /package/dist/globuscomponents/{p-3f167798.entry.js.map → p-8938964a.entry.js.map} +0 -0
  615. /package/dist/globuscomponents/{p-69bed830.entry.js.map → p-8c4c85ed.entry.js.map} +0 -0
  616. /package/dist/globuscomponents/{p-a7a52e60.entry.js.map → p-9c72435d.entry.js.map} +0 -0
  617. /package/dist/globuscomponents/{p-611937a7.entry.js.map → p-a0480cfd.entry.js.map} +0 -0
  618. /package/dist/globuscomponents/{p-ed997c44.entry.js.map → p-a105b6d7.entry.js.map} +0 -0
  619. /package/dist/globuscomponents/{p-d83762d3.entry.js.map → p-a17eb580.entry.js.map} +0 -0
  620. /package/dist/globuscomponents/{p-92a863a5.entry.js.map → p-a596fae9.entry.js.map} +0 -0
  621. /package/dist/globuscomponents/{p-4f4a0e17.entry.js.map → p-a7499971.entry.js.map} +0 -0
  622. /package/dist/globuscomponents/{p-b7a9764f.entry.js.map → p-ace1a2cb.entry.js.map} +0 -0
  623. /package/dist/globuscomponents/{p-15fec19a.entry.js.map → p-b655af13.entry.js.map} +0 -0
  624. /package/dist/globuscomponents/{p-78eb8c69.entry.js.map → p-b6fdb570.entry.js.map} +0 -0
  625. /package/dist/globuscomponents/{p-9f7b06f7.entry.js.map → p-bc8f7e54.entry.js.map} +0 -0
  626. /package/dist/globuscomponents/{p-7aaa111a.entry.js.map → p-c5b2179d.entry.js.map} +0 -0
  627. /package/dist/globuscomponents/{p-01acc661.entry.js.map → p-d4673bdd.entry.js.map} +0 -0
  628. /package/dist/globuscomponents/{p-a60c8538.entry.js.map → p-ddcf6ca2.entry.js.map} +0 -0
  629. /package/dist/globuscomponents/{p-f6d022c1.entry.js.map → p-e2728e93.entry.js.map} +0 -0
  630. /package/dist/globuscomponents/{p-c095840c.entry.js.map → p-e288e951.entry.js.map} +0 -0
  631. /package/dist/globuscomponents/{p-ead40573.entry.js.map → p-fbac81bb.entry.js.map} +0 -0
package/dist/globuscomponents/p-a4b2d7f5.entry.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"names":["gbAvatarCss","GbAvatar","constructor","hostRef","this","placeholder","text","statusIcon","state","OnlineIndicatorStates","Online","icon","showBorder","weight","BorderWeights","Light","colorClasses","getInitialsSize","size","setWeight","Regular","VeryLight","applyColorToInitials","color","getRandomColorClass","randomIndex","Math","floor","random","length","componentDidLoad","slottedInitials","el","querySelector","classList","add","assignedColorClass","componentWillLoad","toLowerCase","render","classes","h","key","class","name","xmlns","width","height","viewBox","fill","d","gbAvatarContrastInnerBorderCss","GbAvatarContrastInnerBorder","Heavy","gbBadgeCss","GbBadges","closeButton","getDotColor","colorMap","gray","primary","error","warning","success","discovery","information","pink","purple","type","iconLeadingSwap","iconLeadingSrc","getAssetPath","leadingIconContent","fetchSvgContent","iconTrailingSwap","iconTrailingSrc","trailingIconContent","src","response","fetch","ok","console","getTextClass","slottedContent","badge","flagSwap","dotColor","cx","cy","r","innerHTML","alt","slot","id","stroke","gbBadgeCloseCss","BadgeClose","gbBtnCss","GbButton","destructive","iconLeading","iconTrailing","leadingIconSvg","trailingIconSvg","loadIcon","buttonSlot","getButtonTextClasses","iconName","iconPath","svg","getButtonClasses","button","hierarchy","disabled","default","only","renderLeadingIcon","renderTrailingIcon","gbButtonCss","internalButtonState","internalIconLeadingState","internalIconTrailingState","updateButtonState","newValue","componentWillRender","oneicon","gbCheckboxCss","GbCheckbox","checked","indeterminate","supportingText","getMainTextClass","getSupportingTextClass","mainTextSlot","supportingTextSlot","onCheckboxClicked","event","checkboxClicked","emit","detail","bind","gbCheckboxBaseCss","GbCheckboxBase","renderSVG","renderCheckbox","renderCircle","renderRadio","x","y","rx","toggleCheckboxState","toggleCheckCircleState","toggleRadioButtonState","onClick","gbCollapseButtonCss","GbCollapseButton","isCollapsed","action","isHovered","toggleIcon","collapseSidebar","expandSidebar","onMouseOver","onMouseOut","arrow","gbComplexPrimarySideBarItemCss","GbComplexPrimarySideBarItem","label","showTooltip","redBarSrc","whiteBarSrc","redCompactBarSrc","whiteCompactBarSrc","Fragment","itemStyle","category","onMouseEnter","onMouseLeave","gbComplexSecondarySideBarItemCss","GbComplexSecondarySideBarItem","gbHelpTooltipCss","GbHelpTooltip","showHelpTooltip","showArrow","showSupportingText","gbInputDropdownMenuItemCss","GbInputDropdownMenuItem","selected","parser","DOMParser","svgDoc","parseFromString","svgElement","documentElement","elementsWithOpacity","querySelectorAll","forEach","modifiedSvg","outerHTML","nameSlot","initialsSlot","handleClick","dropdownItemClicked","checkbox","role","gbInputFieldCss","GbInputField","inputType","showLabel","showHintText","hintText","errorText","showPlaceholder","showHelpIcon","showValidation","showCountryIcon","showCloseButton","options","isReadOnly","results","value","required","loading","formatLabel","inputValue","tags","isPasswordVisible","showDropdown","selectedItem","selectedItems","unselectedItems","paddingLeft","paddingTop","dropdownOpen","show","showSpinner","internalLoading","minWidth","isDestructive","isNotDestructive","formResetCallback","internals","setValidity","setFormValue","handleTagInput","target","inputValueChanged","trim","setTimeout","updateInputWidth","selectDropdownItem","item","isObject","isSelected","some","i","objectName","filter","log","updateStyles","handleTagRemove","index","slice","resultsDisplayElement","resultsWidth","offsetWidth","inputWidth","inputElement","exportSelectedStaff","onButtonClicked","buttonClicked","onPlusButtonClicked","plusButtonClicked","onMinusButtonClicked","minusButtonClicked","handleClickOutside","contains","handleInput","combined","prefix","handleInputFocus","clearInput","inputRef","togglePasswordVisibility","optionsChanged","newOptions","onLoadingChanged","newLoading","isItemSelected","option","isTagItemSelected","handleItemSelect","updateSelectedItems","Array","isArray","objectValues","val","primitiveValues","JSON","stringify","includes","iconSwap","textSlot","document","addEventListener","hiddenSpan","input","shadowRoot","calculatedWidth","max","style","handleWrapperClick","focus","charAt","toUpperCase","minLength","maxLength","onInput","onFocus","ref","menuPosition","dropdownRef","map","StateEnum","Default","inputGroupElement","split","part","idOfInput","readOnly","onBlur","objectValue","gbMetricCardCss","GbMetricCard","showBadge","percentage","radius","featuredIconStyle","featuredIconColor","metric","gbMetricFeaturedIconCss","GbMetricFeaturedIcon","gbPasswordButtonCss","GbPasswordButton","gbSidebarCss","GbSidebar","showSecondCategory","iconInstance","firstItemIcon","secondItemIcon","thirdItemIcon","fourthItemIcon","fifthItemIcon","sixthItemIcon","seventhItemIcon","eighthItemIcon","ninthItemIcon","tenthItemIcon","firstItemLabel","secondItemLabel","thirdItemLabel","fourthItemLabel","fifthItemLabel","sixthItemLabel","seventhItemLabel","eighthItemLabel","ninthItemLabel","tenthItemLabel","complexSidebarData","Recruitment","items","Staff","activePrimaryItem","activeSecondaryItem","hasInfo","email","phoneNumber","theme","isDarkTheme","collapseSideBar","sidebarState","expandSideBar","sideBarItemClicked","activeIndex","simpleSidebarItemClicked","handlePrimaryClick","_index","handleSecondaryClick","applicationName","changeTheme","window","matchMedia","matches","textClass","patternSrc","logoSrc","blueLogoSrc","whiteLogoSrc","opacity","navItemStyle","Object","keys","primaryItem","secondaryItem","gbSimpleSideBarItemCss","GbSimpleSideBarItem","internalIcon","gWithOpacity","g","updateSidebarIcon","_oldValue","onSideBarItemClicked","gbStatusIndicatorCss","GbStatusIndicator","Offline","indicatorStateClass","gbTagCss","GbTag","onTagClose","labelSlot","gbTagCheckboxCss","GbTagCheckbox","gbTagCloseCss","GbTagClose","gbTagCountCss","GbTagCount","gbTooltipCss","GbTooltip","noWrap","getArrowClass"],"sources":["src/components/gb-avatar/gb-avatar.css?tag=gb-avatar&encapsulation=shadow","src/components/gb-avatar/gb-avatar.tsx","src/components/gb-avatar-contrast-inner-border/gb-avatar-contrast-inner-border.css?tag=gb-avatar-contrast-inner-border&encapsulation=shadow","src/components/gb-avatar-contrast-inner-border/gb-avatar-contrast-inner-border.tsx","src/components/gb-badge/gb-badge.css?tag=gb-badge&encapsulation=shadow","src/components/gb-badge/gb-badge.tsx","src/components/gb-badge-close/gb-badge-close.css?tag=gb-badge-close&encapsulation=shadow","src/components/gb-badge-close/gb-badge-close.tsx","src/components/gb-btn/gb-btn.css?tag=gb-btn","src/components/gb-btn/gb-btn.tsx","src/components/gb-button/gb-button.css?tag=gb-button&encapsulation=shadow","src/components/gb-button/gb-button.tsx","src/components/gb-checkbox/gb-checkbox.css?tag=gb-checkbox&encapsulation=shadow","src/components/gb-checkbox/gb-checkbox.tsx","src/components/gb-checkbox-base/gb-checkbox-base.css?tag=gb-checkbox-base&encapsulation=shadow","src/components/gb-checkbox-base/gb-checkbox-base.tsx","src/components/gb-collapse-button/gb-collapse-button.css?tag=gb-collapse-button&encapsulation=shadow","src/components/gb-collapse-button/gb-collapse-button.tsx","src/components/gb-complex-primary-side-bar-item/gb-complex-primary-side-bar-item.css?tag=gb-complex-primary-side-bar-item&encapsulation=shadow","src/components/gb-complex-primary-side-bar-item/gb-complex-primary-side-bar-item.tsx","src/components/gb-complex-secondary-side-bar-item/gb-complex-secondary-side-bar-item.css?tag=gb-complex-secondary-side-bar-item&encapsulation=shadow","src/components/gb-complex-secondary-side-bar-item/gb-complex-secondary-side-bar-item.tsx","src/components/gb-help-tooltip/gb-help-tooltip.css?tag=gb-help-tooltip&encapsulation=shadow","src/components/gb-help-tooltip/gb-help-tooltip.tsx","src/components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.css?tag=gb-input-dropdown-menu-item&encapsulation=shadow","src/components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.tsx","src/components/gb-input-field/gb-input-field.css?tag=gb-input-field&encapsulation=shadow","src/components/gb-input-field/gb-input-field.tsx","src/components/gb-metric-card/gb-metric-card.css?tag=gb-metric-card&encapsulation=shadow","src/components/gb-metric-card/gb-metric-card.tsx","src/components/gb-metric-featured-icon/gb-metric-featured-icon.css?tag=gb-metric-featured-icon&encapsulation=shadow","src/components/gb-metric-featured-icon/gb-metric-featured-icon.tsx","src/components/gb-password-button/gb-password-button.css?tag=gb-password-button&encapsulation=shadow","src/components/gb-password-button/gb-password-button.tsx","src/components/gb-sidebar/gb-sidebar.css?tag=gb-sidebar&encapsulation=shadow","src/components/gb-sidebar/gb-sidebar.tsx","src/components/gb-simple-side-bar-item/gb-simple-side-bar-item.css?tag=gb-simple-side-bar-item&encapsulation=shadow","src/components/gb-simple-side-bar-item/gb-simple-side-bar-item.tsx","src/components/gb-status-indicator/gb-status-indicator.css?tag=gb-status-indicator&encapsulation=shadow","src/components/gb-status-indicator/gb-status-indicator.tsx","src/components/gb-tag/gb-tag.css?tag=gb-tag&encapsulation=shadow","src/components/gb-tag/gb-tag.tsx","src/components/gb-tag-checkbox/gb-tag-checkbox.css?tag=gb-tag-checkbox&encapsulation=shadow","src/components/gb-tag-checkbox/gb-tag-checkbox.tsx","src/components/gb-tag-close/gb-tag-close.css?tag=gb-tag-close&encapsulation=shadow","src/components/gb-tag-close/gb-tag-close.tsx","src/components/gb-tag-count/gb-tag-count.css?tag=gb-tag-count&encapsulation=shadow","src/components/gb-tag-count/gb-tag-count.tsx","src/components/gb-tooltip/gb-tooltip.css?tag=gb-tooltip&encapsulation=shadow","src/components/gb-tooltip/gb-tooltip.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n:host{\r\n width: fit-content;\r\n}\r\n\r\n.avatar{\r\n position: relative;\r\n width: fit-content;\r\n border-radius: var(--rounded-full);\r\n cursor: pointer;\r\n}\r\n\r\n.inner_content.xxs{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.inner_content.xs{\r\n width: 1.5rem;\r\n height: 1.5rem;\r\n}\r\n\r\n.inner_content.sm{\r\n width: 2rem;\r\n height: 2rem;\r\n}\r\n\r\n.inner_content.md{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\n.inner_content.lg{\r\n width: 3rem;\r\n height: 3rem;\r\n}\r\n\r\n.inner_content.xl{\r\n width: 3.5rem;\r\n height: 3.5rem;\r\n}\r\n\r\n.inner_content.xl2{\r\n width: 4rem;\r\n height: 4rem;\r\n}\r\n\r\n.inner_content.profile_sm{\r\n width: 4.5rem;\r\n height: 4.5rem;\r\n}\r\n\r\n.inner_content.profile_md{\r\n width: 6rem;\r\n height: 6rem;\r\n}\r\n\r\n.inner_content.profile_lg{\r\n width: 10rem;\r\n height: 10rem;\r\n}\r\n\r\n::slotted(img){\r\n width: 100%;\r\n height: 100%;\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n.placeholder,\r\n.initials{\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n.indicator{\r\n position: absolute;\r\n bottom: -0.1rem;\r\n right: -0.03rem;\r\n}\r\n\r\n/* Size Styles */\r\n.user_avatar.xxs{\r\n width: 0.75rem;\r\n height: 0.75rem;\r\n}\r\n\r\n.user_avatar.xs{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n.user_avatar.sm{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n.user_avatar.md{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.user_avatar.lg{\r\n width: 1.75rem;\r\n height: 1.75rem;\r\n}\r\n\r\n.user_avatar.xl{\r\n width: 2rem;\r\n height: 2rem;\r\n}\r\n\r\n.user_avatar.xl2{\r\n width: 2rem;\r\n height: 2rem;\r\n}\r\n\r\n.user_avatar.profile_sm{\r\n width: 2.25rem;\r\n height: 2.25rem;\r\n}\r\n\r\n.user_avatar.profile_md{\r\n width: 3rem;\r\n height: 3rem;\r\n}\r\n\r\n.user_avatar.profile_lg{\r\n width: 5rem;\r\n height: 5rem;\r\n}\r\n\r\n/* Avatar Color Styles */\r\n.initials.gray,\r\n.placeholder.gray{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.initials.gray:hover,\r\n.placeholder.gray:hover{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\n.initials.gray:active,\r\n.placeholder.gray:active{\r\n background-color: var(--color-background-gray-subtlest, #F6F8FA);\r\n}\r\n\r\n.initials.blue,\r\n.placeholder.blue{\r\n background-color: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\n.initials.blue:hover,\r\n.placeholder.blue:hover{\r\n background-color: var(--color-background-information-subtle, #9AC7F4);\r\n}\r\n\r\n.initials.blue:active,\r\n.placeholder.blue:active{\r\n background-color: var(--color-background-information-subtlest, #E4F0FC);\r\n}\r\n\r\n.initials.cyan,\r\n.placeholder.cyan{\r\n background-color: var(--color-background-discovery-subtler, #E0F2FE);\r\n}\r\n\r\n.initials.cyan:hover,\r\n.placeholder.cyan:hover{\r\n background-color: var(--color-background-discovery-subtle, #B9E6FE);\r\n}\r\n\r\n.initials.cyan:active,\r\n.placeholder.cyan:active{\r\n background-color: var(--color-background-discovery-subtlest, #F0F9FF);\r\n}\r\n\r\n.initials.pink,\r\n.placeholder.pink{\r\n background-color: var(--color-background-pink-subtler, #FCE7F6);\r\n}\r\n\r\n.initials.pink:hover,\r\n.placeholder.pink:hover{\r\n background-color: var(--color-background-pink-subtle, #FCCEEE);\r\n}\r\n\r\n.initials.pink:active,\r\n.placeholder.pink:active{\r\n background-color: var(--color-background-pink-subtlest, #FDF2FA);\r\n}\r\n\r\n.initials.purple,\r\n.placeholder.purple{\r\n background-color: var(--color-background-purple-subtler, #EBE9FE);\r\n}\r\n\r\n.initials.purple:hover,\r\n.placeholder.purple:hover{\r\n background-color: var(--color-background-purple-subtle, #D9D6FE);\r\n}\r\n\r\n.initials.purple:active,\r\n.placeholder.purple:active{\r\n background-color: var(--color-background-purple-subtlest, #F4F3FF);\r\n}\r\n\r\n.initials.green,\r\n.placeholder.green{\r\n background-color: var(--color-background-success-subtler, #DCFAE6);\r\n}\r\n\r\n.initials.green:hover,\r\n.placeholder.green:hover{\r\n background-color: var(--color-background-success-subtle, #A9EFC5);\r\n}\r\n\r\n.initials.green:active,\r\n.placeholder.green:active{\r\n background-color: var(--color-background-success-subtlest, #ECFDF3);\r\n}\r\n\r\n.initials.yellow,\r\n.placeholder.yellow{\r\n background-color: var(--color-background-warning-subtler, #FEF0C7);\r\n}\r\n\r\n.initials.yellow:hover,\r\n.placeholder.yellow:hover{\r\n background-color: var(--color-background-warning-subtle, #FEDF89);\r\n}\r\n\r\n.initials.yellow:active,\r\n.placeholder.yellow:active{\r\n background-color: var(--color-background-warning-subtlest, #FFFAEB);\r\n}\r\n\r\n::slotted([slot=\"initials\"].gray){\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n::slotted([slot=\"initials\"].blue){\r\n color: var(--color-text-information, #064E94);\r\n}\r\n\r\n::slotted([slot=\"initials\"].cyan){\r\n color: var(--color-text-discovery, #0086C9);\r\n}\r\n\r\n::slotted([slot=\"initials\"].pink){\r\n color: var(--color-text-pink, #DD2590);\r\n}\r\n\r\n::slotted([slot=\"initials\"].purple){\r\n color: var(--color-text-purple, #6938EF);\r\n}\r\n\r\n::slotted([slot=\"initials\"].green){\r\n color: var(--color-text-success, #079455);\r\n}\r\n\r\n::slotted([slot=\"initials\"].yellow){\r\n color: var(--color-text-warning, #DC6803);\r\n}\r\n\r\n.user_avatar.gray path{\r\n fill: var(--color-icon-subtle, #697586);\r\n}\r\n\r\n.user_avatar.blue path{\r\n fill: var(--color-icon-information, #064E94);\r\n}\r\n\r\n.user_avatar.cyan path{\r\n fill: var(--color-icon-discovery, #0086C9);\r\n}\r\n\r\n.user_avatar.pink path{\r\n fill: var(--color-icon-pink, #DD2590);\r\n}\r\n\r\n.user_avatar.purple path{\r\n fill: var(--color-icon-purple, #6938EF);\r\n}\r\n\r\n.user_avatar.green path{\r\n fill: var(--color-icon-success, #079455);\r\n}\r\n\r\n.user_avatar.yellow path{\r\n fill: var(--color-icon-warning, #DC6803);\r\n}","import { Component, Element, h, Prop, State } from \"@stencil/core\";\r\nimport { ColorTypes, BorderWeights, GeneralSizes, OnlineIndicatorStates } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-avatar',\r\n styleUrl: 'gb-avatar.css',\r\n shadow: true,\r\n})\r\nexport class GbAvatar {\r\n @Prop() size: GeneralSizes;\r\n @Prop() placeholder: boolean = false;\r\n @Prop() text: boolean = true;\r\n @Prop() statusIcon: string = '';\r\n @Prop() state: OnlineIndicatorStates = OnlineIndicatorStates.Online;\r\n @Prop() icon: 'user' = 'user';\r\n @Prop() color: ColorTypes;\r\n @Prop() showBorder: boolean = false;\r\n @Element() el: HTMLElement;\r\n @Prop() weight: BorderWeights = BorderWeights.Light;\r\n @State() assignedColorClass: string;\r\n\r\n private colorClasses = [\r\n 'gray', // Red\r\n 'blue', // Green\r\n 'cyan', // Blue\r\n 'green', // Pink\r\n 'purple', // Yellow\r\n 'pink', // Purple\r\n 'yellow', // Teal\r\n ];\r\n\r\n getInitialsSize() {\r\n switch (this.size) {\r\n case 'xl2':\r\n return 'display-xs-semi-bold';\r\n case 'xl':\r\n return 'text-xl-semi-bold';\r\n case 'lg':\r\n return 'text-lg-semi-bold';\r\n case 'md':\r\n return 'text-md-semi-bold';\r\n case 'sm':\r\n return 'text-sm-semi-bold';\r\n case 'xs':\r\n return 'text-xs-semi-bold';\r\n case 'xxs':\r\n return 'text-xxs-semi-bold';\r\n }\r\n }\r\n\r\n setWeight() {\r\n if (this.showBorder) {\r\n switch (this.size) {\r\n case 'xl2':\r\n return BorderWeights.Regular;\r\n case 'xl':\r\n return BorderWeights.Regular;\r\n case 'lg':\r\n return BorderWeights.Regular;\r\n case 'md':\r\n return BorderWeights.Regular;\r\n case 'sm':\r\n return BorderWeights.Light;\r\n case 'xs':\r\n return BorderWeights.Light;\r\n case 'xxs':\r\n return BorderWeights.VeryLight;\r\n }\r\n }\r\n }\r\n\r\n applyColorToInitials() {\r\n switch (this.color) {\r\n case 'gray':\r\n return 'gray';\r\n case 'blue':\r\n return 'blue';\r\n case 'cyan':\r\n return 'cyan';\r\n case 'pink':\r\n return 'pink';\r\n case 'purple':\r\n return 'purple';\r\n case 'green':\r\n return 'green';\r\n case 'yellow':\r\n return 'yellow';\r\n }\r\n }\r\n\r\n private getRandomColorClass(): string {\r\n const randomIndex = Math.floor(Math.random() * this.colorClasses.length);\r\n return this.colorClasses[randomIndex];\r\n }\r\n\r\n componentDidLoad() {\r\n const slottedInitials = this.el.querySelector('h1');\r\n\r\n if (slottedInitials) {\r\n slottedInitials.classList.add(this.getInitialsSize());\r\n slottedInitials.classList.add(this.assignedColorClass);\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n if (!this.color) {\r\n this.assignedColorClass = this.getRandomColorClass();\r\n } else {\r\n this.assignedColorClass = this.color.toLowerCase();\r\n }\r\n }\r\n\r\n render() {\r\n const classes = `${this.assignedColorClass}`;\r\n\r\n return [\r\n <div class=\"avatar\">\r\n <gb-avatar-contrast-inner-border show-border={this.showBorder} size={this.size} weight={this.weight}>\r\n <div class={`inner_content ${this.size}`}>\r\n {this.text ? (\r\n // ${!this.color ? 'gray' : this.color}\r\n <div class={`initials ${classes}`}>\r\n <slot name=\"initials\"></slot>\r\n </div>\r\n ) : (\r\n <slot name=\"image\"></slot>\r\n )}\r\n {this.placeholder && (\r\n <div class={`placeholder ${classes}`}>\r\n {this.icon === 'user' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class={`user_avatar ${this.size} ${classes}`}>\r\n <path\r\n d=\"M11.8706 9.89137C11.9482 9.93754 12.044 9.99158 12.1524 10.0528C12.6276 10.3209 13.3459 10.7261 13.8381 11.2078C14.1458 11.5091 14.4383 11.9061 14.4914 12.3924C14.548 12.9097 14.3223 13.395 13.8697 13.8263C13.0887 14.5703 12.1515 15.1666 10.9393 15.1666H5.06045C3.84825 15.1666 2.91106 14.5703 2.13009 13.8263C1.67741 13.395 1.45177 12.9097 1.50831 12.3924C1.56147 11.9061 1.85391 11.5091 2.16169 11.2078C2.6538 10.7261 3.37214 10.3209 3.84735 10.0528C3.95578 9.99158 4.05158 9.93754 4.12912 9.89137C6.49848 8.48055 9.50126 8.48055 11.8706 9.89137Z\"\r\n fill=\"#697586\"\r\n />\r\n <path\r\n d=\"M4.49987 4.33325C4.49987 2.40026 6.06688 0.833252 7.99987 0.833252C9.93287 0.833252 11.4999 2.40026 11.4999 4.33325C11.4999 6.26625 9.93287 7.83325 7.99987 7.83325C6.06688 7.83325 4.49987 6.26625 4.49987 4.33325Z\"\r\n fill=\"#697586\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </gb-avatar-contrast-inner-border>\r\n <gb-status-indicator class={`indicator ${this.size}`} status-icon={this.statusIcon} size={this.size} state={this.state}></gb-status-indicator>\r\n </div>,\r\n ];\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.inner_border{\r\n border-radius: var(--rounded-full);\r\n width: fit-content;\r\n height: fit-content;\r\n}\r\n\r\n.inner_border.very_light.no_border{\r\n border: 0.3px solid transparent;\r\n}\r\n\r\n.inner_border.light.no_border{\r\n border: 0.5px solid transparent;\r\n}\r\n\r\n.inner_border.regular.no_border{\r\n border: 0.75px solid transparent;\r\n}\r\n\r\n.inner_border.heavy.no_border{\r\n border: 1px solid transparent;\r\n}\r\n\r\n/* Weights */\r\n.inner_border.very_light{\r\n border: 0.3px solid var(--color-blanket-subtler, rgba(33, 44, 101, 0.2));\r\n}\r\n\r\n.inner_border.light{\r\n border: 0.5px solid var(--color-blanket-subtler, rgba(33, 44, 101, 0.2));\r\n}\r\n\r\n.inner_border.regular{\r\n border: 0.75px solid var(--color-blanket-subtler, rgba(33, 44, 101, 0.2));\r\n}\r\n\r\n.inner_border.heavy{\r\n border: 1px solid var(--color-blanket-subtler, rgba(33, 44, 101, 0.2));\r\n}","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { BorderWeights, GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-avatar-contrast-inner-border',\r\n styleUrl: 'gb-avatar-contrast-inner-border.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbAvatarContrastInnerBorder {\r\n @Prop() weight: BorderWeights;\r\n @Prop() size: GeneralSizes;\r\n @Prop() showBorder: boolean = false;\r\n\r\n setWeight() {\r\n if(this.showBorder){\r\n switch (this.size) {\r\n case 'xl2':\r\n return BorderWeights.Regular;\r\n case 'xl':\r\n return BorderWeights.Regular;\r\n case 'lg':\r\n return BorderWeights.Regular;\r\n case 'md':\r\n return BorderWeights.Regular;\r\n case 'sm':\r\n return BorderWeights.Light;\r\n case 'xs':\r\n return BorderWeights.Light;\r\n case 'xxs':\r\n return BorderWeights.VeryLight;\r\n case 'profile_lg':\r\n return BorderWeights.Heavy;\r\n case 'profile_md':\r\n return BorderWeights.Heavy;\r\n case 'profile_sm':\r\n return BorderWeights.Regular;\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`inner_border ${this.size} ${this.weight} ${!this.showBorder ? 'no_border' : ''}`}>\r\n <slot></slot>\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host{\r\n display: flex;\r\n align-items: center;\r\n width: fit-content;\r\n}\r\n\r\ndiv{\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0px;\r\n flex-shrink: 0;\r\n text-align: center;\r\n}\r\n\r\n.label {\r\n padding: 2px;\r\n}\r\n\r\n.icon {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\ndiv.sm{\r\n height: 22px;\r\n min-height: 22px;\r\n gap: 0.25rem;\r\n padding: var(--spacing-none) var(--spacing-2);\r\n}\r\n\r\ndiv.md {\r\n height: var(--spacing-6);\r\n min-height: var(--spacing-6);\r\n padding: var(--spacing-none) var(--spacing-2);\r\n gap: 0.38rem;\r\n}\r\n\r\ndiv.lg {\r\n height: 28px;\r\n min-height: 28px;\r\n gap: 0.38rem;\r\n padding: var(--spacing-none) var(--spacing-2);\r\n}\r\n\r\ndiv.pill_color {\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\ndiv.pill_color.gray,\r\n.badge_color.gray {\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n background: var(--color-background-gray-subtler, #EEF2F6);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.pill_color.primary,\r\n.badge_color.primary {\r\n border: 1px solid #C8E0F9 /*Color/Border/border-information-subtler*/;\r\n background: var(--color-background-information-subtlest, #E4F0FC); \r\n color: var(--color-text-brandDarkBlue, #212C65);\r\n}\r\n\r\n.pill_color.error,\r\n.badge_color.error {\r\n border: 1px solid var(--color-border-danger-subtler, #FDE3E5);\r\n background: var(--color-background-danger-subtlest, #FEF1F2 );\r\n color: var(--color-text-danger, #B51726);\r\n}\r\n\r\n.pill_color.warning,\r\n.badge_color.warning {\r\n border: 1px solid var(--color-border-warning-subtler, #FEF0C7);\r\n background: var(--color-background-warning-subtlest, #FFFAEB);\r\n color: var(--color-text-warning, #DC6803);\r\n}\r\n\r\n.pill_color.success,\r\n.badge_color.success {\r\n border: 1px solid var(--color-border-success-subtler, #DCFAE6);\r\n background: var(--color-background-success-subtlest, #ECFDF3);\r\n color: var(--color-text-success, #079455);\r\n}\r\n\r\n.pill_color.discovery,\r\n.badge_color.discovery {\r\n border: 1px solid var(--color-border-discovery-subtler, #E0F2FE);\r\n background: var(--color-background-discovery-subtlest,#F0F9FF);\r\n color: var(--color-text-discovery, #0086C9);\r\n}\r\n\r\n.pill_color.information,\r\n.badge_color.information {\r\n border: 1px solid var(--color-border-information-subtler, #C8E0F9);\r\n background: var(--color-background-information-subtlest, #E4F0FC);\r\n color: var(--color-text-information, #064E94);\r\n}\r\n\r\n.pill_color.pink,\r\n.badge_color.pink {\r\n border: 1px solid var(--color-border-pink-subtler, #FCE7F6);\r\n background: var(--color-background-pink-subtlest, #FDF2FA);\r\n color: var(--color-text-pink, #DD2590);\r\n}\r\n\r\n.pill_color.purple,\r\n.badge_color.purple {\r\n border: 1px solid var(--color-border-purple-subtler, #EBE9FE);\r\n background: var(--color-background-purple-subtlest, #F4F3FF);\r\n color: var(--color-text-purple, #6938EF);\r\n}\r\n\r\n.pill_color svg,\r\n.badge_color svg,\r\n.pill_outline svg,\r\n.badge_modern svg {\r\n width: var(--spacing-2);\r\n height: var(--spacing-2);\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.gray svg path[stroke] {\r\n stroke: var(--color-icon, #4B5565) /*var(--color-icon)*/;\r\n}\r\n\r\n.gray svg path[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.primary svg path[stroke] {\r\n stroke: var(--color-icon-brandDarkBlue, #212C65);\r\n}\r\n\r\n.primary svg path[fill] {\r\n fill: var(--color-icon-brandDarkBlue, #212C65);\r\n}\r\n\r\n.error svg path[stroke] {\r\n stroke: var(--color-icon-danger, #B51726);\r\n}\r\n\r\n.error svg path[fill] {\r\n fill: var(--color-icon-danger, #B51726);\r\n}\r\n\r\n.warning svg path[stroke] {\r\n stroke: var(--color-icon-warning, #DC6803);\r\n}\r\n\r\n.warning svg path[fill] {\r\n fill: var(--color-icon-warning, #DC6803);\r\n}\r\n\r\n.icon.success svg path[stroke] {\r\n stroke: var(--color-icon-success, #079455);\r\n}\r\n\r\n.success svg path[fill] {\r\n fill: var(--color-icon-success, #079455);\r\n}\r\n\r\n.discovery svg path[stroke] {\r\n stroke: var(--color-icon-discovery, #0086C9);\r\n}\r\n\r\n.discovery svg path[fill] {\r\n fill: var(--color-icon-discovery, #0086C9);\r\n}\r\n\r\n.information svg path[stroke] {\r\n stroke: var(--color-icon-information, #064E94);\r\n}\r\n\r\n.information svg path[fill] {\r\n fill: var(--color-icon-information, #064E94);\r\n}\r\n\r\n.pink svg path[stroke] {\r\n stroke: var(--color-icon-pink, #DD2590);\r\n}\r\n\r\n.pink svg path[fill] {\r\n fill: var(--color-icon-pink, #DD2590);\r\n}\r\n\r\n.purple svg path[stroke] {\r\n stroke: var(--color-icon-purple, #6938EF);\r\n}\r\n\r\n.purple svg path[fill] {\r\n fill: var(--color-icon-purple, #6938EF);\r\n}\r\n\r\n.pill_outline {\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n.pill_outline.gray {\r\n border: 1.5px solid var(--color-text, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.pill_outline.primary {\r\n border: 1.5px solid var(--color-text-brandDarkBlue, #212C65);\r\n color:var(--color-text-brandDarkBlue, #212C65);\r\n}\r\n\r\n.pill_outline.error {\r\n border: 1.5px solid var(--color-text-danger, #B51726);\r\n color:var(--color-text-danger, #B51726);\r\n}\r\n\r\n.pill_outline.warning {\r\n border: 1.5px solid var(--color-text-warning, #DC6803);\r\n color:var(--color-text-warning, #DC6803);\r\n}\r\n\r\n.pill_outline.success {\r\n border: 1.5px solid var(--color-text-success, #079455);\r\n color:var(--color-text-success, #079455);\r\n}\r\n\r\n.pill_outline.discovery {\r\n border: 1.5px solid var(--color-text-discovery, #0086C9);\r\n color: var(--color-text-discovery, #0086C9);\r\n}\r\n\r\n.pill_outline.information {\r\n border: 1.5px solid var(--color-text-information, #064E94);\r\n color: var(--color-text-information, #064E94);\r\n}\r\n\r\n.pill_outline.pink {\r\n border: 1.5px solid var(--color-text-pink, #DD2590);\r\n color: var(--color-text-pink, #DD2590);\r\n}\r\n\r\n.pill_outline.purple {\r\n border: 1.5px solid var(--color-text-purple, #6938EF);\r\n color: var(--color-text-purple, #6938EF);\r\n}\r\n\r\n.badge_color {\r\n border-radius: var(--rounded-xs);\r\n}\r\n\r\n.badge_modern {\r\n border-radius: var(--rounded-xs);\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.badge_modern svg path {\r\n stroke: inherit; /* Inherit color from the parent, but set in the component */\r\n fill: inherit;\r\n}\r\n\r\n.icon svg {\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n margin-top: -2px;\r\n}\r\n\r\n.icon svg path[stroke] {\r\n stroke: currentColor;\r\n}\r\n\r\n.icon svg path[fill] {\r\n fill: currentColor;\r\n}\r\n\r\n#icon-only svg {\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\ndiv.md #icon-only svg {\r\n padding: 2px;\r\n}\r\n\r\n#icon-only {\r\n display: flex;\r\n padding: var(--spacing-none);\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n flex-shrink: 0;\r\n border-radius: var(--rounded-full);\r\n}","import { Component, Prop, getAssetPath, h, State, Element } from '@stencil/core';\r\nimport { BadgeIconTypes, BadgeTypes, GeneralColors, GeneralSizes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-badge',\r\n styleUrl: 'gb-badge.css',\r\n shadow: true,\r\n assetsDirs: ['assets'],\r\n})\r\nexport class GbBadges {\r\n @Prop() size!: GeneralSizes;\r\n @Prop() icon: BadgeIconTypes;\r\n @Prop() iconLeadingSwap?: string;\r\n @Prop() iconTrailingSwap?: string;\r\n @Prop() flagSwap: string;\r\n @Prop() color!: GeneralColors;\r\n @Prop() type!: BadgeTypes;\r\n @Prop() closeButton?: boolean = false;\r\n @State() leadingIconContent: string;\r\n @State() trailingIconContent: string;\r\n @Element() el: HTMLElement;\r\n\r\n private getDotColor(color: GeneralColors): string {\r\n const colorMap = {\r\n gray: '#4B5565',\r\n primary: '#212C65',\r\n error: '#B51726',\r\n warning: '#DC6803',\r\n success: '#079455',\r\n discovery: '#0BA5EC',\r\n information: '#064E94',\r\n pink: '#DD2590',\r\n purple: '#6938EF',\r\n };\r\n\r\n if (this.type === 'badge_modern') {\r\n return colorMap[color] || color;\r\n }\r\n\r\n return 'currentColor';\r\n }\r\n\r\n async componentWillLoad() {\r\n if (this.iconLeadingSwap) {\r\n const iconLeadingSrc = getAssetPath(`${this.iconLeadingSwap}`);\r\n this.leadingIconContent = await this.fetchSvgContent(iconLeadingSrc);\r\n }\r\n\r\n if (this.iconTrailingSwap) {\r\n const iconTrailingSrc = getAssetPath(`${this.iconTrailingSwap}`);\r\n this.trailingIconContent = await this.fetchSvgContent(iconTrailingSrc);\r\n }\r\n }\r\n\r\n private async fetchSvgContent(src: string): Promise<string> {\r\n try {\r\n const response = await fetch(src);\r\n if (response.ok) {\r\n return await response.text();\r\n }\r\n return '';\r\n } catch (error) {\r\n console.error('Error fetching SVG:', error);\r\n return '';\r\n }\r\n }\r\n\r\n getTextClass() {\r\n switch (this.size) {\r\n case 'sm':\r\n return 'text-xs-medium';\r\n case 'md':\r\n return 'text-sm-medium';\r\n case 'lg':\r\n return 'text-sm-medium';\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n const slottedContent = this.el.querySelector('p');\r\n\r\n if (slottedContent) {\r\n slottedContent.classList.add(this.getTextClass());\r\n }\r\n }\r\n\r\n render() {\r\n const classes = {\r\n badge: true,\r\n [this.type]: true,\r\n [this.color]: true,\r\n [this.size]: true,\r\n };\r\n\r\n const flagSwap = getAssetPath(`${this.flagSwap}`);\r\n const dotColor = this.type === 'badge_modern' ? this.getDotColor(this.color) : 'currentColor';\r\n\r\n return (\r\n <div class={classes}>\r\n {this.icon === 'dot' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill={dotColor}>\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" />\r\n </svg>\r\n )}\r\n {this.icon === 'icon_leading' && this.iconLeadingSwap && <div class={`icon left-icon`} innerHTML={this.leadingIconContent}></div>}\r\n {this.icon === 'country' && <img src={flagSwap} alt=\"Country Icon\" />}\r\n {this.icon === 'avatar' && (\r\n <gb-avatar class=\"avatar-icon\" size=\"xxs\" status-icon=\"false\">\r\n <slot name=\"image\" slot=\"image\"></slot>\r\n </gb-avatar>\r\n )}\r\n {this.icon !== 'only' && <slot></slot>}\r\n {this.icon === 'icon_trailing' && this.iconTrailingSwap && <div class={`icon right-icon`} innerHTML={this.trailingIconContent}></div>}\r\n {this.icon === 'only' && (\r\n <div id=\"icon-only\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" stroke={dotColor}>\r\n <path d=\"M6 2L6 10M10 6L2 6\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div>\r\n )}\r\n {this.closeButton && this.icon !== 'only' && <gb-badge-close color={this.color} type=\"rounded\"></gb-badge-close>}\r\n </div>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\ndiv {\r\n display: flex;\r\n padding: var(--spacing-half);\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-none);\r\n height: fit-content;\r\n width: fit-content;\r\n cursor: pointer;\r\n}\r\n\r\ndiv svg{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\ndiv.square {\r\n border-radius: 3px;\r\n}\r\n\r\ndiv.rounded {\r\n border-radius: 8px;\r\n}\r\n\r\ndiv.gray, div.primary, div.error, div.warning, div.success, div.discovery, div.information, div.pink {\r\n background-color: transparent;\r\n}\r\n\r\ndiv.gray path{\r\n stroke: var(--color-icon, #4B5565); \r\n}\r\n\r\ndiv.primary path{\r\n stroke: var(--color-icon-brandDarkBlue, #212C65);\r\n}\r\n\r\ndiv.error path{\r\n stroke: var(--color-icon-danger, #B51726);\r\n}\r\n\r\ndiv.warning path{\r\n stroke: var(--color-icon-warning, #DC6803);\r\n}\r\n\r\ndiv.success path{\r\n stroke: var(--color-icon-success, #079455); \r\n}\r\n\r\ndiv.discovery path{\r\n stroke: var(--color-icon-discovery, #0086C9);\r\n}\r\n\r\ndiv.information path{\r\n stroke: var(--color-icon-information, #064E94);\r\n}\r\n\r\ndiv.pink path{\r\n stroke: var(--color-icon-pink, #DD2590); \r\n}\r\n\r\ndiv.gray:hover {\r\n background: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\ndiv.primary:hover {\r\n background: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\ndiv.error:hover {\r\n background: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\ndiv.warning:hover {\r\n background: var(--color-background-warning-subtler, #FEF0C7);\r\n}\r\n\r\ndiv.success:hover {\r\n background: var(--color-background-success-subtler, #DCFAE6);\r\n}\r\n\r\ndiv.discovery:hover {\r\n background: var(--color-background-discovery-subtler, #E0F2FE);\r\n}\r\n\r\ndiv.information:hover {\r\n background: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\ndiv.pink:hover {\r\n background: var(--color-background-pink-subtler, #FCE7F6);\r\n}","import { Component, Prop, h } from '@stencil/core';\r\nimport { GeneralColors } from '../../models/reusableModels';\r\n\r\n@Component ({\r\n tag: 'gb-badge-close',\r\n styleUrl: 'gb-badge-close.css',\r\n shadow: true\r\n})\r\n\r\nexport class BadgeClose {\r\n @Prop() color: GeneralColors;\r\n @Prop() type: 'square' | 'rounded';\r\n\r\n render() {\r\n return (\r\n <div class={`${this.color} ${this.type}`}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9.50024 2.5L2.50024 9.5M2.50024 2.5L9.50024 9.5\" stroke=\"#4B5565\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n );\r\n }\r\n} ","@import './../../global/global.css';\r\n\r\n/* *{box-sizing: border-box; margin: 0; padding: 0;} */\r\n:host {\r\n --button-color: var(--primary-color);\r\n --icon-color: var(--primary-color);\r\n}\r\n\r\nbutton {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: none;\r\n cursor: pointer;\r\n border-radius: var(--rounded-sm);\r\n width: 100%;\r\n}\r\n\r\nbutton.only{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\nbutton .icon {\r\n display: inline-flex;\r\n width: auto;\r\n height: auto;\r\n}\r\n\r\nbutton .icon svg path[fill] {\r\n fill: var(--icon-color);\r\n}\r\n\r\nbutton .icon svg path[stroke] {\r\n stroke: var(--icon-color);\r\n}\r\n\r\nbutton .icon svg circle {\r\n stroke: var(--icon-color);\r\n}\r\n\r\n/* Button Sizes Styles */\r\nbutton.xl2{\r\n padding: var(--spacing-none) var(--spacing-6);\r\n height: 3.5rem;\r\n gap: var(--spacing-3);\r\n}\r\n\r\nbutton.xl{\r\n padding: var(--spacing-none) var(--spacing-5);\r\n height: 3rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.lg{\r\n padding: 0.625rem 1.125rem;\r\n height: 2.75rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.md{\r\n padding: var(--spacing-none) var(--spacing-4);\r\n height: 2.5rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.sm{\r\n padding: var(--spacing-none) var(--spacing-3);\r\n height: 2.25rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.only.xl2{\r\n width: 3.5rem;\r\n height: 3.5rem;\r\n}\r\n\r\nbutton.only.xl{\r\n width: 3rem;\r\n height: 3rem;\r\n}\r\n\r\nbutton.only.lg{\r\n width: 2.75rem;\r\n height: 2.75rem;\r\n}\r\n\r\nbutton.only.md{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\nbutton.only.sm{\r\n width: 2.25rem;\r\n height: 2.25rem;\r\n}\r\n\r\nbutton.xl2 .icon svg{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\nbutton.xl .icon svg,\r\nbutton.lg .icon svg,\r\nbutton.md .icon svg,\r\nbutton.sm .icon svg{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n/* Hierarchy Styles */\r\nbutton.primary {\r\n background-color: var(--color-background-brandRed, #E21B2E);\r\n --icon-color: var(--color-icon-inverse, #FFFFFF);\r\n color: var(--color-text-inverse, #FFFFFF);\r\n}\r\n\r\nbutton.secondary_gray {\r\n background-color: transparent;\r\n border: 1px solid var(--color-border, #9AA4B2);\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\nbutton.secondary_color {\r\n background-color: transparent;\r\n border: 1px solid var(--color-border-brandRed, #E21B2E);\r\n --icon-color: var(--color-icon-brandRed, #E21B2E);\r\n color: var(--color-text-brandRed, #E21B2E);\r\n}\r\n\r\nbutton.tertiary_gray {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\nbutton.tertiary_color {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon-brandRed, #E21B2E);\r\n color: var(--color-text-brandRed, #E21B2E);\r\n}\r\n\r\nbutton.link_gray {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n height: fit-content;\r\n}\r\n\r\nbutton.link_color {\r\n background-color: transparent;\r\n --icon-color: var(--color-link, #075DB2);\r\n color: var(--color-link, #075DB2);\r\n padding: var(--spacing-none);\r\n height: fit-content;\r\n}\r\n\r\n/* Button Destructive Styles */\r\nbutton.primary.destructive{\r\n background-color: var(--color-background-danger, #B51726);\r\n color: var(--color-text-inverse, #FFFFFF);\r\n --icon-color: var(--color-icon-danger-inverse, #FFFFFF);\r\n}\r\n\r\nbutton.secondary_gray.destructive, button.secondary_color.destructive{\r\n border: 1px solid var(--color-border-danger, #B51726);\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\nbutton.tertiary_gray.destructive,\r\nbutton.tertiary_color.destructive{\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\nbutton.link_gray.destructive, \r\nbutton.link_color.destructive{\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\n/* Button States Styles */\r\nbutton.primary:hover{\r\n background-color: var(--color-background-brandRed-hover, #CC1A2A);\r\n}\r\n\r\nbutton.primary:active{\r\n background-color: var(--color-background-brandRed-pressed, #B51726);\r\n}\r\n\r\nbutton.secondary_gray:hover{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\nbutton.secondary_gray:active{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\nbutton.secondary_color:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.secondary_color:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.tertiary_gray:hover{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\nbutton.tertiary_gray:active{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\nbutton.tertiary_color:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.tertiary_color:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.link_gray:hover,\r\nbutton.link_color:hover{\r\n text-decoration: underline;\r\n}\r\n\r\nbutton.link_gray:active{\r\n text-decoration: none;\r\n color: var(--color-text-bold, #202939);\r\n}\r\n\r\nbutton.link_color:active{\r\n text-decoration: none;\r\n color: var(--color-link-pressed, #064E94);\r\n}\r\n\r\nbutton.primary.destructive:hover{\r\n background-color: var(--color-background-danger-bold, #8C121D);\r\n}\r\n\r\nbutton.primary.destructive:active{\r\n background-color: var(--color-background-brandRed-hover, #CC1A2A); /* ask Mr Gideon about this */\r\n}\r\n\r\nbutton.secondary_gray.destructive:hover, \r\nbutton.secondary_color.destructive:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.secondary_gray.destructive:active, \r\nbutton.secondary_color.destructive:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.tertiary_gray.destructive:hover, \r\nbutton.tertiary_color.destructive:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.tertiary_gray.destructive:active, \r\nbutton.tertiary_color.destructive:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.link_gray.destructive:active{\r\n color: var(--color-text-danger-bold, #8C121D);\r\n}\r\n\r\nbutton.link_color.destructive:active{\r\n color: var(--color-text-warning-bold, #93370D);\r\n}\r\n\r\n/* Button Disabled Styles */\r\nbutton.disabled{\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\nbutton.primary.disabled {\r\n background-color: var(--color-background-disabled, #F6F8FA);\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n}\r\n\r\nbutton.secondary_gray.disabled,\r\nbutton.secondary_color.disabled{\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n border-color: var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\nbutton.tertiary_gray.disabled,\r\nbutton.tertiary_color.disabled,\r\nbutton.link_gray.disabled,\r\nbutton.link_color.disabled{\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n}\r\n\r\n.btn_text{\r\n white-space: nowrap;\r\n display: flex;\r\n align-items: center;\r\n}","import { Component, Element, getAssetPath, h, Prop, State } from \"@stencil/core\";\r\nimport { GeneralHierarchies, GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-btn',\r\n styleUrl: 'gb-btn.css',\r\n})\r\nexport class GbButton {\r\n @Prop() size: GeneralSizes;\r\n @Prop() hierarchy: GeneralHierarchies;\r\n @Prop() icon: 'default' | 'only';\r\n @Prop() destructive: boolean = false;\r\n @Prop() state: 'default' | 'disabled';\r\n @Prop() iconLeading: boolean = false;\r\n @Prop() iconLeadingSwap: string;\r\n @Prop() iconTrailing: boolean = false;\r\n @Prop() iconTrailingSwap: string;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @State() trailingIconSvg: string = '';\r\n\r\n componentWillLoad() {\r\n if (this.iconLeading && this.iconLeadingSwap) {\r\n this.loadIcon(this.iconLeadingSwap, 'leading');\r\n }\r\n if (this.iconTrailing && this.iconTrailingSwap) {\r\n this.loadIcon(this.iconTrailingSwap, 'trailing');\r\n }\r\n\r\n const buttonSlot = this.el.querySelector('p');\r\n\r\n if (buttonSlot) {\r\n buttonSlot.classList.add(this.getButtonTextClasses());\r\n buttonSlot.classList.add('nowrap');\r\n }\r\n }\r\n\r\n async loadIcon(iconName: string, type: 'leading' | 'trailing') {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n if (type === 'leading') {\r\n this.leadingIconSvg = svg;\r\n } else {\r\n this.trailingIconSvg = svg;\r\n }\r\n }\r\n\r\n // Helper to apply color styles based on the button state\r\n getButtonClasses() {\r\n return {\r\n button: true,\r\n [this.size]: true,\r\n [this.hierarchy]: true,\r\n destructive: this.destructive,\r\n disabled: this.state === 'disabled',\r\n default: this.icon === 'default',\r\n only: this.icon === 'only',\r\n // leftandrighticon: this.iconLeading && this.iconTrailing\r\n };\r\n }\r\n\r\n getButtonTextClasses() {\r\n switch (this.size) {\r\n case 'xl2':\r\n return 'text-lg-semi-bold';\r\n case 'xl':\r\n return 'text-md-semi-bold';\r\n case 'lg':\r\n return 'text-md-semi-bold';\r\n case 'md':\r\n return 'text-sm-semi-bold';\r\n case 'sm':\r\n return 'text-sm-semi-bold';\r\n }\r\n }\r\n\r\n renderLeadingIcon() {\r\n return <div class={`icon left-icon ${this.size}`} innerHTML={this.leadingIconSvg}></div>;\r\n }\r\n\r\n renderTrailingIcon() {\r\n return <div class=\"icon right-icon\" innerHTML={this.trailingIconSvg}></div>;\r\n }\r\n\r\n render() {\r\n return (\r\n <button class={this.getButtonClasses()}>\r\n {this.iconLeading && this.icon === 'default' && this.renderLeadingIcon()}\r\n {this.icon === 'default' && (\r\n <div class={`btn_text`}>\r\n <slot></slot>\r\n </div>\r\n )}\r\n {this.iconTrailing && this.renderTrailingIcon()}\r\n {this.icon === 'only' && this.renderLeadingIcon()}\r\n </button>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host {\r\n --button-color: var(--primary-color);\r\n --icon-color: var(--primary-color);\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\nbutton {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: none;\r\n cursor: pointer;\r\n border-radius: var(--rounded-sm);\r\n width: 100%;\r\n}\r\n\r\nbutton.only{\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\nbutton .icon {\r\n display: inline-flex;\r\n width: auto;\r\n height: auto;\r\n}\r\n\r\nbutton .icon svg path[fill] {\r\n fill: var(--icon-color);\r\n}\r\n\r\nbutton .icon svg path[stroke] {\r\n stroke: var(--icon-color);\r\n}\r\n\r\nbutton .icon svg circle {\r\n stroke: var(--icon-color);\r\n}\r\n\r\n/* Button Sizes Styles */\r\nbutton.xl2{\r\n padding: var(--spacing-none) var(--spacing-6);\r\n height: 3.5rem;\r\n gap: var(--spacing-3);\r\n}\r\n\r\nbutton.xl{\r\n padding: var(--spacing-none) var(--spacing-5);\r\n height: 3rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.lg{\r\n padding: 0.625rem 1.125rem;\r\n height: 2.75rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.md{\r\n padding: var(--spacing-none) var(--spacing-4);\r\n height: 2.5rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.sm{\r\n padding: var(--spacing-none) var(--spacing-3);\r\n height: 2.25rem;\r\n gap: var(--spacing-2);\r\n}\r\n\r\nbutton.only.xl2{\r\n width: 3.5rem;\r\n height: 3.5rem;\r\n}\r\n\r\nbutton.only.xl{\r\n width: 3rem;\r\n height: 3rem;\r\n}\r\n\r\nbutton.only.lg{\r\n width: 2.75rem;\r\n height: 2.75rem;\r\n}\r\n\r\nbutton.only.md{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\nbutton.only.sm{\r\n width: 2.25rem;\r\n height: 2.25rem;\r\n}\r\n\r\nbutton.xl2 .icon svg{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\nbutton.xl .icon svg,\r\nbutton.lg .icon svg,\r\nbutton.md .icon svg,\r\nbutton.sm .icon svg{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n/* Hierarchy Styles */\r\nbutton.primary {\r\n background-color: var(--color-background-brandRed, #E21B2E);\r\n --icon-color: var(--color-icon-inverse, #FFFFFF);\r\n color: var(--color-text-inverse, #FFFFFF);\r\n}\r\n\r\nbutton.secondary_gray {\r\n background-color: transparent;\r\n border: 1px solid var(--color-border, #9AA4B2);\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\nbutton.secondary_color {\r\n background-color: transparent;\r\n border: 1px solid var(--color-border-brandRed, #E21B2E);\r\n --icon-color: var(--color-icon-brandRed, #E21B2E);\r\n color: var(--color-text-brandRed, #E21B2E);\r\n}\r\n\r\nbutton.tertiary_gray {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\nbutton.tertiary_color {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon-brandRed, #E21B2E);\r\n color: var(--color-text-brandRed, #E21B2E);\r\n}\r\n\r\nbutton.link_gray {\r\n background-color: transparent;\r\n --icon-color: var(--color-icon, #4B5565);\r\n color: var(--color-text, #4B5565);\r\n padding: var(--spacing-none);\r\n height: fit-content;\r\n justify-content: flex-start;\r\n}\r\n\r\nbutton.link_color {\r\n background-color: transparent;\r\n --icon-color: var(--color-link, #075DB2);\r\n color: var(--color-link, #075DB2);\r\n padding: var(--spacing-none);\r\n height: fit-content;\r\n justify-content: flex-start;\r\n}\r\n\r\n/* Button Destructive Styles */\r\nbutton.primary.destructive{\r\n background-color: var(--color-background-danger, #B51726);\r\n color: var(--color-text-inverse, #FFFFFF);\r\n --icon-color: var(--color-icon-danger-inverse, #FFFFFF);\r\n}\r\n\r\nbutton.secondary_gray.destructive, button.secondary_color.destructive{\r\n border: 1px solid var(--color-border-danger, #B51726);\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\nbutton.tertiary_gray.destructive,\r\nbutton.tertiary_color.destructive{\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\nbutton.link_gray.destructive, \r\nbutton.link_color.destructive{\r\n color: var(--color-text-danger, #B51726);\r\n --icon-color: var(--color-icon-danger, #B51726);\r\n}\r\n\r\n/* Button States Styles */\r\nbutton.primary:hover{\r\n background-color: var(--color-background-brandRed-hover, #CC1A2A);\r\n}\r\n\r\nbutton.primary:active{\r\n background-color: var(--color-background-brandRed-pressed, #B51726);\r\n}\r\n\r\nbutton.secondary_gray:hover{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\nbutton.secondary_gray:active{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\nbutton.secondary_color:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.secondary_color:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.tertiary_gray:hover{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\nbutton.tertiary_gray:active{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\nbutton.tertiary_color:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.tertiary_color:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.link_gray:hover,\r\nbutton.link_color:hover{\r\n text-decoration: underline;\r\n}\r\n\r\nbutton.link_gray:active{\r\n text-decoration: none;\r\n color: var(--color-text-bold, #202939);\r\n}\r\n\r\nbutton.link_color:active{\r\n text-decoration: none;\r\n color: var(--color-link-pressed, #064E94);\r\n}\r\n\r\nbutton.primary.destructive:hover{\r\n background-color: var(--color-background-danger-bold, #8C121D);\r\n}\r\n\r\nbutton.primary.destructive:active{\r\n background-color: var(--color-background-brandRed-hover, #CC1A2A); /* ask Mr Gideon about this */\r\n}\r\n\r\nbutton.secondary_gray.destructive:hover, \r\nbutton.secondary_color.destructive:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.secondary_gray.destructive:active, \r\nbutton.secondary_color.destructive:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.tertiary_gray.destructive:hover, \r\nbutton.tertiary_color.destructive:hover{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n}\r\n\r\nbutton.tertiary_gray.destructive:active, \r\nbutton.tertiary_color.destructive:active{\r\n background-color: var(--color-background-danger-subtler, #FDE3E5);\r\n}\r\n\r\nbutton.link_gray.destructive:active{\r\n color: var(--color-text-danger-bold, #8C121D);\r\n}\r\n\r\nbutton.link_color.destructive:active{\r\n color: var(--color-text-warning-bold, #93370D);\r\n}\r\n\r\n/* Button Disabled Styles */\r\nbutton.disabled{\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\nbutton.primary.disabled {\r\n background-color: var(--color-background-btn-disabled, #eef2f6);\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n}\r\n\r\nbutton.secondary_gray.disabled,\r\nbutton.secondary_color.disabled{\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n border-color: var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\nbutton.tertiary_gray.disabled,\r\nbutton.tertiary_color.disabled,\r\nbutton.link_gray.disabled,\r\nbutton.link_color.disabled{\r\n --icon-color: var(--color-icon-disabled, #9aa4b2);\r\n color: var(--color-text-disabled, #9aa4b2);\r\n}\r\n\r\n.btn_text{\r\n white-space: nowrap;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.btn_text::first-letter{\r\n text-transform: uppercase;\r\n}","import { Component, Element, getAssetPath, h, Prop, State, Watch } from '@stencil/core';\r\nimport { GeneralHierarchies, GeneralSizes, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-button',\r\n styleUrl: 'gb-button.css',\r\n shadow: true,\r\n assetsDirs: [''],\r\n})\r\nexport class GbButton {\r\n @Prop() size!: GeneralSizes;\r\n @Prop() hierarchy!: GeneralHierarchies;\r\n @Prop() icon!: 'default' | 'only';\r\n @Prop() destructive: boolean = false;\r\n @Prop() state: StateType;\r\n @Prop() iconLeading: boolean = false;\r\n @Prop() iconLeadingSwap: string;\r\n @Prop() iconTrailing: boolean = false;\r\n @Prop() iconTrailingSwap: string;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @State() trailingIconSvg: string = '';\r\n @State() internalButtonState: string = '';\r\n @State() internalIconLeadingState: string = '';\r\n @State() internalIconTrailingState: string = '';\r\n\r\n componentWillLoad() {\r\n if (this.iconLeading && this.iconLeadingSwap) {\r\n this.loadIcon(this.iconLeadingSwap, 'leading');\r\n }\r\n if (this.iconTrailing && this.iconTrailingSwap) { \r\n this.loadIcon(this.iconTrailingSwap, 'trailing');\r\n }\r\n\r\n const buttonSlot = this.el.querySelector('p');\r\n\r\n if (buttonSlot) {\r\n buttonSlot.classList.add(this.getButtonTextClasses());\r\n buttonSlot.classList.add('nowrap');\r\n }\r\n\r\n // if (!this.iconLeading && !this.iconTrailing) {\r\n // buttonSlot.classList.add('center');\r\n // }\r\n }\r\n\r\n @Watch('state')\r\n updateButtonState(newValue: string) {\r\n this.internalButtonState = newValue;\r\n }\r\n\r\n componentWillRender() {\r\n this.internalButtonState = this.state;\r\n }\r\n\r\n async loadIcon(iconName: string, type: 'leading' | 'trailing') {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n if (type === 'leading') {\r\n this.leadingIconSvg = svg;\r\n } else {\r\n this.trailingIconSvg = svg;\r\n }\r\n }\r\n\r\n // Helper to apply color styles based on the button state\r\n getButtonClasses() {\r\n return {\r\n button: true,\r\n [this.size]: true,\r\n [this.hierarchy]: true,\r\n destructive: this.destructive,\r\n disabled: this.internalButtonState === 'disabled',\r\n default: this.icon === 'default',\r\n only: this.icon === 'only',\r\n oneicon: this.iconLeading || this.iconTrailing,\r\n };\r\n }\r\n\r\n getButtonTextClasses() {\r\n switch (this.size) {\r\n case 'xl2':\r\n return 'text-lg-semi-bold';\r\n case 'xl':\r\n return 'text-md-semi-bold';\r\n case 'lg':\r\n return 'text-md-semi-bold';\r\n case 'md':\r\n return 'text-sm-semi-bold';\r\n case 'sm':\r\n return 'text-sm-semi-bold';\r\n }\r\n }\r\n\r\n renderLeadingIcon() {\r\n return <div class={`icon left-icon ${this.size}`} innerHTML={this.leadingIconSvg}></div>;\r\n }\r\n\r\n renderTrailingIcon() {\r\n return <div class=\"icon right-icon\" innerHTML={this.trailingIconSvg}></div>;\r\n }\r\n\r\n render() {\r\n return (\r\n <button disabled={this.internalButtonState === 'disabled'} class={this.getButtonClasses()}>\r\n {this.iconLeading && this.icon === 'default' && this.renderLeadingIcon()}\r\n {this.icon === 'default' && <slot></slot>}\r\n {this.iconTrailing && this.renderTrailingIcon()}\r\n {this.icon === 'only' && this.renderLeadingIcon()}\r\n </button>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n.checkbox_div{\r\n display: flex;\r\n justify-content: space-between;\r\n width: fit-content;\r\n}\r\n\r\n.checkbox_div{\r\n gap: var(--spacing-none);\r\n}\r\n\r\n.checkbox_div.text_class.sm{\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.checkbox_div.text_class.md{\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.checkbox_base.checkbox_no_supporting_text{\r\n margin-top: 0.22rem;\r\n}\r\n\r\n.text{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.text.no_supporting_text{\r\n justify-content: center;\r\n}\r\n\r\n::slotted(p){\r\n color: var(--color-text, #4B5565);\r\n}","import { Component, Element, Event, EventEmitter, h, Prop } from \"@stencil/core\";\r\nimport { CheckBoxVariants, GeneralSizes, StateType } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-checkbox',\r\n styleUrl: 'gb-checkbox.css',\r\n shadow: true,\r\n})\r\nexport class GbCheckbox {\r\n @Prop() checked: boolean = false;\r\n @Prop() indeterminate: boolean = false;\r\n @Prop() size: GeneralSizes;\r\n @Prop() type: CheckBoxVariants; \r\n @Prop() state: StateType;\r\n @Prop() text: boolean = false;\r\n @Prop() supportingText: boolean = false;\r\n @Element() el: HTMLElement;\r\n @Event() checkboxClicked: EventEmitter<boolean>;\r\n\r\n getMainTextClass() {\r\n switch (this.size) {\r\n case 'sm':\r\n return `text-sm-medium`;\r\n case 'md':\r\n return `text-md-medium`;\r\n }\r\n }\r\n\r\n getSupportingTextClass() {\r\n switch (this.size) {\r\n case 'sm':\r\n return 'text-xs-regular';\r\n case 'md':\r\n return 'text-sm-regular';\r\n }\r\n }\r\n\r\n componentDidLoad() {\r\n const mainTextSlot = this.el.querySelector('[slot=\"label\"]');\r\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"]');\r\n\r\n if (mainTextSlot) {\r\n mainTextSlot.classList.add(this.getMainTextClass());\r\n }\r\n\r\n if (supportingTextSlot) {\r\n supportingTextSlot.classList.add(this.getSupportingTextClass());\r\n }\r\n }\r\n\r\n onCheckboxClicked(event) : void {\r\n this.checkboxClicked.emit(event.detail);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`checkbox_div ${this.size} ${this.text ? 'text_class' : ''}`}>\r\n <div class={`checkbox_base ${!this.supportingText ? 'checkbox_no_supporting_text' : ''}`}>\r\n <gb-checkbox-base size={this.size} type={this.type} state={this.state} indeterminate={this.indeterminate} onCheckboxClicked={this.onCheckboxClicked.bind(this)} checked={this.checked}></gb-checkbox-base>\r\n </div>\r\n {this.text && (\r\n <div class={`text ${!this.supportingText ? 'no_supporting_text' : ''}`}>\r\n <slot name=\"label\"></slot>\r\n {this.supportingText && <slot name=\"supporting_text\"></slot>}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host{\r\n width: fit-content;\r\n}\r\n\r\n/* Checkbox Styles */\r\n.checkbox_container{\r\n width: fit-content;\r\n height: fit-content;\r\n cursor: pointer;\r\n}\r\n\r\nsvg.sm{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\nsvg.md{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n.checkbox_default_unchecked.hover:hover path{\r\n stroke: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.checkbox_default_checked:hover path, .checkbox_default_indeterminate:hover path{\r\n fill: var(--color-background-information, #064E94);\r\n}\r\n\r\n.checkbox_default_checked:hover .border, .checkbox_default_indeterminate:hover .border{\r\n stroke: var(--color-border-information, #064E94);\r\n}\r\n\r\n/* Radio Styles */\r\n.radio_default_unchecked:hover rect{\r\n stroke: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n/* Check Circle Styles */\r\n.circle_default_unchecked:hover rect{\r\n stroke: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.circle_default_checked:hover rect{\r\n stroke: var(--color-border-information, #064E94);\r\n}\r\n\r\n.circle_default_checked:hover .background {\r\n fill: var(--color-background-information, #064E94);\r\n}","import { Component, Event, EventEmitter, h, Prop } from \"@stencil/core\";\r\nimport { CheckBoxVariants, GeneralSizes, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-checkbox-base',\r\n styleUrl: 'gb-checkbox-base.css',\r\n shadow: true,\r\n})\r\nexport class GbCheckboxBase {\r\n @Prop({ mutable: true }) state: StateType;\r\n @Prop() size: GeneralSizes;\r\n @Prop() type: CheckBoxVariants;\r\n @Prop({ mutable: true }) checked: boolean = false;\r\n @Prop({ mutable: true }) indeterminate: boolean = false;\r\n @Event() checkboxClicked: EventEmitter<boolean>;\r\n\r\n private renderSVG() {\r\n switch (this.type) {\r\n case 'checkbox':\r\n return this.renderCheckbox();\r\n case 'check_circle':\r\n return this.renderCircle();\r\n case 'radio':\r\n return this.renderRadio();\r\n default:\r\n return null;\r\n }\r\n }\r\n\r\n private renderCheckbox() {\r\n if (this.state === \"default\" && this.checked) {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`checkbox_default_checked ${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n fill=\"#075DB2\"\r\n />\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n stroke=\"#075DB2\"\r\n class=\"border\"\r\n />\r\n <path d=\"M4.5 9.25C4.5 9.25 5.25 9.25 6.25 11C6.25 11 9.02941 6.41667 11.5 5.5\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n );\r\n } else if (this.state === \"default\" && this.indeterminate) {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`checkbox_default_indeterminate ${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n fill=\"#075DB2\"\r\n />\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n stroke=\"#075DB2\"\r\n class=\"border\"\r\n />\r\n <path d=\"M12 8L4 8\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n );\r\n } else if (this.state === \"disabled\" && !this.checked) {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`checkbox_disabled_unchecked ${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n fill=\"#F6F8FA\"\r\n />\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n stroke=\"#E3E8EF\"\r\n />\r\n </svg>\r\n );\r\n } else if (this.state === \"disabled\" && this.checked) {\r\n return (\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5H12C13.8998 0.5 15.2743 0.501062 16.3225 0.641988C17.3563 0.78098 17.9975 1.04772 18.4749 1.52513C18.9523 2.00253 19.219 2.64373 19.358 3.67754C19.4989 4.72573 19.5 6.10025 19.5 8V12C19.5 13.8998 19.4989 15.2743 19.358 16.3225C19.219 17.3563 18.9523 17.9975 18.4749 18.4749C17.9975 18.9523 17.3563 19.219 16.3225 19.358C15.2743 19.4989 13.8998 19.5 12 19.5H8C6.10025 19.5 4.72573 19.4989 3.67754 19.358C2.64373 19.219 2.00253 18.9523 1.52513 18.4749C1.04772 17.9975 0.78098 17.3563 0.641988 16.3225C0.501062 15.2743 0.5 13.8998 0.5 12V8Z\"\r\n fill=\"#9AA4B2\"\r\n />\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5H12C13.8998 0.5 15.2743 0.501062 16.3225 0.641988C17.3563 0.78098 17.9975 1.04772 18.4749 1.52513C18.9523 2.00253 19.219 2.64373 19.358 3.67754C19.4989 4.72573 19.5 6.10025 19.5 8V12C19.5 13.8998 19.4989 15.2743 19.358 16.3225C19.219 17.3563 18.9523 17.9975 18.4749 18.4749C17.9975 18.9523 17.3563 19.219 16.3225 19.358C15.2743 19.4989 13.8998 19.5 12 19.5H8C6.10025 19.5 4.72573 19.4989 3.67754 19.358C2.64373 19.219 2.00253 18.9523 1.52513 18.4749C1.04772 17.9975 0.78098 17.3563 0.641988 16.3225C0.501062 15.2743 0.5 13.8998 0.5 12V8Z\"\r\n stroke=\"#9AA4B2\"\r\n />\r\n <path\r\n d=\"M5.3335 11.6667C5.3335 11.6667 6.3335 11.6667 7.66683 14C7.66683 14 11.3727 7.88888 14.6668 6.66666\"\r\n stroke=\"#E3E8EF\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n );\r\n } else if (this.state === \"disabled\" && this.indeterminate) {\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5H12C13.8998 0.5 15.2743 0.501062 16.3225 0.641988C17.3563 0.78098 17.9975 1.04772 18.4749 1.52513C18.9523 2.00253 19.219 2.64373 19.358 3.67754C19.4989 4.72573 19.5 6.10025 19.5 8V12C19.5 13.8998 19.4989 15.2743 19.358 16.3225C19.219 17.3563 18.9523 17.9975 18.4749 18.4749C17.9975 18.9523 17.3563 19.219 16.3225 19.358C15.2743 19.4989 13.8998 19.5 12 19.5H8C6.10025 19.5 4.72573 19.4989 3.67754 19.358C2.64373 19.219 2.00253 18.9523 1.52513 18.4749C1.04772 17.9975 0.78098 17.3563 0.641988 16.3225C0.501062 15.2743 0.5 13.8998 0.5 12V8Z\"\r\n fill=\"#9AA4B2\"\r\n />\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5H12C13.8998 0.5 15.2743 0.501062 16.3225 0.641988C17.3563 0.78098 17.9975 1.04772 18.4749 1.52513C18.9523 2.00253 19.219 2.64373 19.358 3.67754C19.4989 4.72573 19.5 6.10025 19.5 8V12C19.5 13.8998 19.4989 15.2743 19.358 16.3225C19.219 17.3563 18.9523 17.9975 18.4749 18.4749C17.9975 18.9523 17.3563 19.219 16.3225 19.358C15.2743 19.4989 13.8998 19.5 12 19.5H8C6.10025 19.5 4.72573 19.4989 3.67754 19.358C2.64373 19.219 2.00253 18.9523 1.52513 18.4749C1.04772 17.9975 0.78098 17.3563 0.641988 16.3225C0.501062 15.2743 0.5 13.8998 0.5 12V8Z\"\r\n stroke=\"#9AA4B2\"\r\n />\r\n <path d=\"M15.3335 10L4.66683 10\" stroke=\"#E3E8EF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>;\r\n } else {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`checkbox_default_unchecked ${this.size}`}>\r\n <path\r\n d=\"M0.5 8C0.5 6.10025 0.501062 4.72573 0.641988 3.67754C0.78098 2.64373 1.04772 2.00253 1.52513 1.52513C2.00253 1.04772 2.64373 0.78098 3.67754 0.641988C4.72573 0.501062 6.10025 0.5 8 0.5C9.89975 0.5 11.2743 0.501062 12.3225 0.641988C13.3563 0.78098 13.9975 1.04772 14.4749 1.52513C14.9523 2.00253 15.219 2.64373 15.358 3.67754C15.4989 4.72573 15.5 6.10025 15.5 8C15.5 9.89975 15.4989 11.2743 15.358 12.3225C15.219 13.3563 14.9523 13.9975 14.4749 14.4749C13.9975 14.9523 13.3563 15.219 12.3225 15.358C11.2743 15.4989 9.89975 15.5 8 15.5C6.10025 15.5 4.72573 15.4989 3.67754 15.358C2.64373 15.219 2.00253 14.9523 1.52513 14.4749C1.04772 13.9975 0.78098 13.3563 0.641988 12.3225C0.501062 11.2743 0.5 9.89975 0.5 8Z\"\r\n stroke=\"#CDD5DF\"\r\n />\r\n </svg>\r\n );\r\n }\r\n }\r\n\r\n private renderCircle() {\r\n if (this.checked && this.state === \"default\") {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`circle_default_checked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" fill=\"#075DB2\" class=\"background\" />\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#075DB2\" />\r\n <path\r\n d=\"M5.0835 9.04166C5.0835 9.04166 5.7085 9.04166 6.54183 10.5C6.54183 10.5 8.85801 6.68055 10.9168 5.91666\"\r\n stroke=\"white\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n );\r\n } else if (!this.checked && this.state === \"default\") {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`circle_default_unchecked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#CDD5DF\" />\r\n </svg>\r\n );\r\n } else if (this.checked && this.state === \"disabled\") {\r\n return (\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`circle_disabled_checked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"19\" height=\"19\" rx=\"9.5\" fill=\"#9AA4B2\" />\r\n <rect x=\"0.5\" y=\"0.5\" width=\"19\" height=\"19\" rx=\"9.5\" stroke=\"#9AA4B2\" />\r\n <path\r\n d=\"M5.9165 11.4583C5.9165 11.4583 6.7915 11.4583 7.95817 13.5C7.95817 13.5 11.2008 8.15279 14.0832 7.08334\"\r\n stroke=\"#E3E8EF\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n );\r\n } else if (!this.checked && this.state === \"disabled\") {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`circle_disabled_unchecked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#E3E8EF\" />\r\n </svg>\r\n );\r\n }\r\n }\r\n\r\n private renderRadio() {\r\n if (this.state === \"default\" && this.checked) {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`radio_default_checked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#075DB2\" />\r\n <circle cx=\"8\" cy=\"8\" r=\"3\" fill=\"#075DB2\" />\r\n </svg>\r\n );\r\n } else if (this.state === \"disabled\" && !this.checked) {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`radio_disabled_unchecked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#E3E8EF\" />\r\n </svg>\r\n );\r\n } else if (this.state === \"disabled\" && this.checked) {\r\n return (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" class={`radio_disabled_checked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"19\" height=\"19\" rx=\"9.5\" stroke=\"#9AA4B2\" />\r\n <circle cx=\"10\" cy=\"10\" r=\"4\" fill=\"#9AA4B2\" />\r\n </svg>\r\n );\r\n } else {\r\n return (\r\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class={`radio_default_unchecked ${this.size}`}>\r\n <rect x=\"0.5\" y=\"0.5\" width=\"15\" height=\"15\" rx=\"7.5\" stroke=\"#CDD5DF\" />\r\n </svg>\r\n );\r\n }\r\n }\r\n\r\n private toggleCheckboxState() {\r\n if (this.state === \"default\" && !this.checked) {\r\n this.checked = true;\r\n // console.log(this.checked)\r\n this.checkboxClicked.emit(this.checked);\r\n } else if (this.state === \"default\" && this.checked) {\r\n this.checked = false;\r\n // console.log(this.checked);\r\n this.checkboxClicked.emit(this.checked);\r\n }\r\n }\r\n\r\n private toggleCheckCircleState() {\r\n if ((this.state === \"disabled\" && this.checked) || (this.state === \"disabled\" && !this.checked)) {\r\n return;\r\n }\r\n\r\n if (this.state === \"default\" && !this.checked) {\r\n this.checked = true;\r\n this.checkboxClicked.emit(this.checked);\r\n } else if (this.state == \"default\" && this.checked) {\r\n this.checked = false;\r\n this.checkboxClicked.emit(this.checked);\r\n }\r\n }\r\n\r\n private toggleRadioButtonState() {\r\n if ((this.state === \"disabled\" && !this.checked) || (this.state === \"disabled\" && this.checked)) {\r\n return;\r\n }\r\n if (this.state === \"default\" && !this.checked) {\r\n this.checked = true;\r\n this.checkboxClicked.emit(this.checked);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div\r\n class={`checkbox_container ${this.size}`}\r\n onClick={() => {\r\n if (this.type === 'checkbox') {\r\n return this.toggleCheckboxState();\r\n } else if (this.type === 'check_circle') {\r\n return this.toggleCheckCircleState();\r\n } else if (this.type === 'radio') {\r\n return this.toggleRadioButtonState();\r\n }\r\n }}\r\n >\r\n {this.renderSVG()}\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host{\r\n position: relative;\r\n}\r\n\r\n.collapse_btn{\r\n background-color: transparent;\r\n border-radius: var(--rounded-full);\r\n display: flex;\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n padding: var(--spacing-2);\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n cursor: pointer;\r\n}\r\n\r\n.collapse_btn.gray:hover{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n cursor: pointer;\r\n}\r\n\r\n.collapse_btn.gray:active{\r\n background-color: var(--color-background-gray-subtle, #E3E8EF);\r\n}\r\n\r\n.collapse_btn.white:hover{\r\n background-color: var(--color-blanket-subtle, rgba(33, 44, 101, 0.3));\r\n cursor: pointer;\r\n}\r\n\r\n.collapse_btn.white:active{\r\n background-color: var(--color-blanket, rgba(33, 44, 101, 0.4));\r\n}\r\n\r\n.icon.gray path{\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.white path{\r\n stroke: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.tooltip{\r\n position: absolute;\r\n left: 3.5rem;\r\n bottom: 2.7rem;\r\n}\r\n\r\n.text-xs-semi-bold{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-semi-bold::before,\r\n.text-xs-semi-bold::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-xs-semi-bold::before{\r\n margin-bottom: -0.321em;\r\n}\r\n\r\n.text-xs-semi-bold::after{\r\n margin-top: -0.416em;\r\n}","import { Component, Method, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: 'gb-collapse-button',\r\n styleUrl: 'gb-collapse-button.css',\r\n shadow: true,\r\n})\r\nexport class GbCollapseButton {\r\n @Prop() color: 'gray' | 'white';\r\n @Prop({ mutable: true }) isCollapsed: boolean = false;\r\n @Prop({ mutable: true }) action: string = 'collapse';\r\n @Prop({ mutable: true }) isHovered: boolean = false;\r\n\r\n toggleIcon() {\r\n if (this.action === 'collapse') {\r\n this.action = 'expand';\r\n this.isHovered = false;\r\n } else if (this.action === 'expand') {\r\n this.action = 'collapse';\r\n this.isHovered = false;\r\n }\r\n }\r\n\r\n @Method()\r\n async collapseSidebar() {\r\n this.isCollapsed = true;\r\n }\r\n\r\n @Method()\r\n async expandSidebar() {\r\n this.isCollapsed = false;\r\n }\r\n\r\n render() {\r\n return [\r\n <div>\r\n <div class={`collapse_btn ${this.color}`} onClick={this.toggleIcon.bind(this)} onMouseOver={() => (this.isHovered = true)} onMouseOut={() => (this.isHovered = false)}>\r\n {this.action === 'collapse' && [\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" class={`icon ${this.color}`}>\r\n <path\r\n d=\"M9.58321 15C9.58321 15 4.58326 11.3176 4.58325 9.99996C4.58324 8.68237 9.58325 5 9.58325 5M15.4165 15C15.4165 15 10.4166 11.3176 10.4166 9.99996C10.4166 8.68237 15.4166 5 15.4166 5\"\r\n stroke=\"#4B5565\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>,\r\n ]}\r\n {this.action === 'expand' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" class={`icon ${this.color}`}>\r\n <path\r\n d=\"M10.4166 15C10.4166 15 15.4166 11.3176 15.4166 9.99996C15.4166 8.68237 10.4166 5 10.4166 5M4.58329 15C4.58329 15 9.58324 11.3176 9.58325 9.99996C9.58326 8.68237 4.58325 5 4.58325 5\"\r\n stroke=\"#4B5565\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n {this.isHovered && this.action === 'collapse' ? (\r\n <gb-tooltip class=\"tooltip\" show-arrow={true} arrow=\"left\">\r\n <p slot=\"label\" class=\"text-xs-semi-bold\">\r\n Collapse\r\n </p>\r\n </gb-tooltip>\r\n ) : this.isHovered && this.action === 'expand' ? (\r\n <gb-tooltip class=\"tooltip\" show-arrow={true} arrow=\"left\">\r\n <p slot=\"label\" class=\"text-xs-semi-bold\">\r\n Expand\r\n </p>\r\n </gb-tooltip>\r\n ) : null}\r\n </div>,\r\n ];\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.container{\r\n display: flex;\r\n width: 6rem;\r\n padding: var(--spacing-2) var(--spacing-none);\r\n flex-direction: column;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n cursor: pointer;\r\n}\r\n\r\n.wrapper{\r\n display: flex;\r\n height: 3rem;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.25rem;\r\n}\r\n\r\n.bar{\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n height: 100%;\r\n}\r\n\r\n.icon{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.icon svg{\r\n width: 1.5rem;\r\n height: 1.5rem;\r\n}\r\n\r\n.container{\r\n position: relative;\r\n}\r\n\r\n/* State Styles*/\r\n.container.default.colored_background:hover{\r\n background: var(--color-blanket, rgba(33, 44, 101, 0.2));\r\n}\r\n\r\n.container.colored_background.active{\r\n background: var(--color-background-information-bold, #042F59);\r\n}\r\n\r\n.container.default.plain_background:hover{\r\n background: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.container.plain_background.active{\r\n background: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\n/* Icon Color Styles */\r\n.icon.plain_background path[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.plain_background.active path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.plain_background.active path[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.plain_background path#Icon[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.plain_background circle[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.plain_background.active circle[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.colored_background path[stroke] {\r\n stroke: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.colored_background.active path[fill] {\r\n fill: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.colored_background path#Icon[fill] {\r\n fill: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[fill] {\r\n fill: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.colored_background circle[stroke] {\r\n stroke: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.colored_background.active circle[fill] {\r\n fill: var(--color-icon-inverse, #FFFFFF);\r\n}\r\n\r\n.icon.plain_background.default path[fill],\r\n.icon.colored_background.default path[fill],\r\n.icon.plain_background.default circle[fill],\r\n.icon.colored_background.default circle[fill] {\r\n fill: transparent;\r\n}\r\n\r\n/* Text Styles */\r\n.label_text.colored_background {\r\n color: #FFFFFF; /**/\r\n}\r\n\r\n.label_text.plain_background {\r\n color: var(--color-text, #4B5565); \r\n} \r\n\r\n.label_text.plain_background.active {\r\n color: var(--color-text-information-bold, #042F59);\r\n}\r\n\r\n/* Compact Item Styles */\r\n.compact_container{\r\n display: flex;\r\n width: 6rem;\r\n padding: var(--spacing-2) 0rem;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.compact_wrapper{\r\n display: flex;\r\n width: 3rem;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.5rem;\r\n border-radius: var(--rounded-sm);\r\n position: relative;\r\n cursor: pointer;\r\n}\r\n\r\n.compact_bar{\r\n position: absolute;\r\n top: 0.72rem;\r\n left: 0;\r\n}\r\n\r\n.compact_wrapper.colored_background:hover{\r\n background: var(--color-blanket, rgba(33, 44, 101, 0.2));\r\n}\r\n\r\n.compact_wrapper.colored_background.active{\r\n background: #042F59;\r\n}\r\n\r\n.compact_wrapper.plain_background:hover{\r\n background: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.compact_wrapper.plain_background.active{\r\n background: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\n.compact_icon_container{\r\n display: flex;\r\n height: 3rem;\r\n padding: var(--spacing-none) var(--spacing-5);\r\n justify-content: center;\r\n align-items: center;\r\n flex: 1 0 0;\r\n border-radius: 62.4375rem;\r\n}\r\n\r\n.tooltip{\r\n position: absolute;\r\n top: 0.4rem;\r\n left: 3.3rem;\r\n}","import { Component, Element, Prop, State, getAssetPath, h, Fragment } from \"@stencil/core\";\r\nimport { GeneralBackgroundCategories } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-complex-primary-side-bar-item',\r\n styleUrl: 'gb-complex-primary-side-bar-item.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbComplexPrimarySideBarItem {\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() itemStyle: 'standard' | 'compact';\r\n @Prop() state: 'default' | 'active';\r\n @Prop() icon: string = '';\r\n @Prop() label: string = 'Recruitment';\r\n @Prop({ mutable: true }) showTooltip: boolean = false;\r\n @State() leadingIconSvg: string = '';\r\n @Element() el: HTMLElement;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.icon);\r\n }\r\n\r\n // componentDidLoad() {\r\n \r\n // }\r\n\r\n render() {\r\n const redBarSrc = getAssetPath(`assets/complex_bar_red.svg`);\r\n const whiteBarSrc = getAssetPath(`assets/complex_bar_white.svg`);\r\n const redCompactBarSrc = getAssetPath(`assets/compact_bar_red.svg`);\r\n const whiteCompactBarSrc = getAssetPath(`assets/compact_bar_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.itemStyle === 'standard' && (\r\n <div class={`container ${this.state} ${this.category}`}>\r\n <div class={`wrapper ${this.state} ${this.category}`}>\r\n {this.state === 'active' && this.category === 'plain_background' && <img src={redBarSrc} alt=\"\" class=\"bar\" />}\r\n {this.state === 'active' && this.category === 'colored_background' && <img src={whiteBarSrc} alt=\"\" class=\"bar\" />}\r\n <div class=\"icon_container\">\r\n <div class={`icon ${this.state} ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n </div>\r\n <p class={`label_text ${this.state} ${this.category} ${this.state === 'active' ? 'text-xs-semi-bold' : 'text-xs-regular'}`}>{this.label}</p>\r\n </div>\r\n </div>\r\n )}\r\n {this.itemStyle === 'compact' && (\r\n <div class=\"compact_container\">\r\n <div class={`compact_wrapper ${this.state} ${this.category}`} onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n {this.state === 'active' && this.category === 'plain_background' && <img src={redCompactBarSrc} alt=\"\" class=\"compact_bar\" />}\r\n {this.state === 'active' && this.category === 'colored_background' && <img src={whiteCompactBarSrc} alt=\"\" class=\"compact_bar\" />}\r\n <div class=\"compact_icon_container\">\r\n <div class={`icon ${this.state} ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n </div>\r\n {this.itemStyle === 'compact' && this.showTooltip && (\r\n <gb-tooltip show-arrow={true} arrow=\"left\" class=\"tooltip\">\r\n <p slot=\"label\">{this.label}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host {\r\n position: relative;\r\n}\r\n\r\n.container {\r\n display: flex;\r\n padding: var(--spacing-none) var(--spacing-4);\r\n flex-direction: column;\r\n gap: 0.5rem;\r\n}\r\n\r\n.icon{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.container.full_with_label {\r\n width: 14.875rem;\r\n}\r\n\r\n.container.icon_only {\r\n width: fit-content;\r\n}\r\n\r\n.secondary_side_bar_item_div {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-3);\r\n border-radius: var(--rounded-sm);\r\n padding: var(--spacing-2) var(--spacing-4);\r\n cursor: pointer;\r\n}\r\n\r\n.secondary_side_bar_item_div.icon_only {\r\n width: fit-content;\r\n}\r\n\r\n/* Category Styles */\r\n.secondary_side_bar_item_div.colored_background.default,\r\n.secondary_side_bar_item_div.plain_background.default {\r\n background: transparent;\r\n}\r\n\r\n.secondary_side_bar_item_div.colored_background.default:hover {\r\n background: var(--color-background-information-subtler, #c8e0f9);\r\n}\r\n\r\n.secondary_side_bar_item_div.colored_background.active {\r\n background: var(--color-background-information-subtle, #9ac7f4);\r\n}\r\n\r\n.secondary_side_bar_item_div.plain_background.default:hover {\r\n background: var(--color-background-gray-subtler, #eef2f6);\r\n}\r\n\r\n.secondary_side_bar_item_div.plain_background.active {\r\n background: var(--color-background-information-subtler, #c8e0f9);\r\n}\r\n\r\n/* Icon Color Styles */\r\n.icon.plain_background path[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background path#Icon[fill] {\r\n fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background circle[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active circle[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.colored_background path[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.colored_background.active path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.colored_background.active path[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.colored_background path#Icon[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.colored_background.active path#Icon[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.colored_background circle[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon.colored_background.active circle[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.icon.plain_background.default path[fill],\r\n.icon.colored_background.default path[fill],\r\n.icon.plain_background.default circle[fill],\r\n.icon.colored_background.default circle[fill] {\r\n fill: transparent;\r\n}\r\n\r\n/* Text Styles */\r\n.label_text.colored_background,\r\n.label_text.plain_background {\r\n color: var(--color-text, #4b5565); /**/\r\n}\r\n\r\n.label_text.colored_background.active,\r\n.label_text.plain_background.active {\r\n color: var(--color-text-information-bold, #042f59);\r\n}\r\n\r\n.tooltip {\r\n position: absolute;\r\n top: 0.3rem;\r\n left: 4.8rem;\r\n}\r\n","import { Component, Element, Prop, State, getAssetPath, h } from \"@stencil/core\";\r\nimport { GeneralBackgroundCategories } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-complex-secondary-side-bar-item',\r\n styleUrl: 'gb-complex-secondary-side-bar-item.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbComplexSecondarySideBarItem {\r\n @Prop() state: 'default' | 'active';\r\n @Prop() type: 'full_with_label' | 'icon_only';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() label: string = 'Appraisal';\r\n @Prop() icon: string = '';\r\n @Prop({ mutable: true }) showTooltip: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n componentDidLoad() {\r\n this.loadIcon(this.icon);\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`container ${this.type}`}>\r\n <div\r\n class={`secondary_side_bar_item_div ${this.state} ${this.type} ${this.category}`}\r\n onMouseEnter={() => (this.showTooltip = true)}\r\n onMouseLeave={() => (this.showTooltip = false)}\r\n >\r\n <div class=\"icon\">\r\n <div class=\"icon_container\">\r\n <div class={`icon ${this.state} ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n </div>\r\n </div>\r\n {this.type === 'full_with_label' && (\r\n <div class=\"text\">\r\n <p class={`label_text ${this.state} ${this.category} ${this.state !== 'active' ? 'text-md-medium' : 'text-md-semi-bold'}`}>{this.label}</p>\r\n </div>\r\n )}\r\n {this.type === 'icon_only' && this.showTooltip && (\r\n <gb-tooltip show-arrow={true} arrow=\"left\" class=\"tooltip\">\r\n <p slot=\"label\">{this.label}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.help_tooltip{\r\n display: flex;\r\n position: relative;\r\n width: fit-content;\r\n height: fit-content;\r\n}\r\n\r\n.tooltip{\r\n position: absolute;\r\n top: -7rem;\r\n right: 5.75rem;\r\n}","import { Component, Prop, h, State, Element } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: 'gb-help-tooltip',\r\n styleUrl: 'gb-help-tooltip.css',\r\n shadow: true,\r\n})\r\nexport class GbHelpTooltip {\r\n @State() showHelpTooltip: boolean = false;\r\n @Prop() showArrow: boolean = false;\r\n @Prop() showSupportingText: boolean = false;\r\n @Element() el: HTMLElement;\r\n\r\n componentDidLoad() {\r\n const mainTextSlot = this.el.querySelector('[slot=\"label\"]');\r\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"]');\r\n\r\n if (mainTextSlot) {\r\n mainTextSlot.classList.add('text-xs-semi-bold');\r\n }\r\n\r\n if (supportingTextSlot) {\r\n supportingTextSlot.classList.add('text-xs-regular');\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`help_tooltip`}>\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"16\"\r\n height=\"16\"\r\n viewBox=\"0 0 16 16\"\r\n fill=\"none\"\r\n onMouseEnter={() => (this.showHelpTooltip = true)}\r\n onMouseLeave={() => (this.showHelpTooltip = false)}\r\n class=\"help_circle\"\r\n >\r\n <path\r\n d=\"M6.66659 6C6.66659 5.26362 7.26354 4.66666 7.99992 4.66666C8.7363 4.66666 9.33325 5.26362 9.33325 6C9.33325 6.26543 9.25569 6.51275 9.12199 6.72052C8.72352 7.33978 7.99992 7.93028 7.99992 8.66666V9M7.99458 11.3333H8.00057M14.6666 8C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8C1.33325 4.3181 4.31802 1.33333 7.99992 1.33333C11.6818 1.33333 14.6666 4.3181 14.6666 8Z\"\r\n stroke=\"#697586\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n {this.showHelpTooltip && (\r\n <gb-tooltip show-arrow={true} arrow=\"bottom_right\" show-supporting-text={this.showSupportingText} class=\"tooltip\">\r\n <slot name=\"label\" slot=\"label\"></slot>\r\n <slot name=\"supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.dropdown-container {\r\n display: flex;\r\n padding: var(--spacing-1);\r\n align-items: center;\r\n gap: var(--spacing-none);\r\n border-radius: var(--rounded-none);\r\n cursor: pointer;\r\n}\r\n\r\n.dropdown-item {\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n flex: 1 0 0;\r\n min-width: 0;\r\n border-radius: var(--rounded-xs);\r\n cursor: pointer;\r\n color: var(--color-text, #4b5565);\r\n font-family: var(--Font-Family-Body, Sora);\r\n font-style: normal;\r\n letter-spacing: var(--Font-Letter-spacing-T-md, 0px);\r\n}\r\n\r\n/* .name_text{\r\n max-width: 5rem;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n} */\r\n\r\n.content {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.5rem; /* if needed */\r\n min-width: 0; /* ❗ critical for ellipsis to work */\r\n}\r\n\r\n::slotted([slot='name']) {\r\n width: 100%;\r\n /* max-width: 15rem; */\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n flex: 1 1 auto;\r\n white-space: nowrap;\r\n}\r\n\r\n::slotted([slot='name'].no_wrap) {\r\n white-space: nowrap;\r\n}\r\n\r\n::slotted([slot='supporting_text']) {\r\n font-size: var(--Font-Size-T-sm, 14px);\r\n font-weight: var(--Font-Weight-Regular, 400);\r\n line-height: var(--Font-Line-height-T-sm, 20px); /* 142.857% */\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n}\r\n\r\n/* Icon Styles */\r\n.icon_leading {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n\r\n.icon_leading svg {\r\n width: 1.25rem;\r\n height: 1.25rem;\r\n}\r\n\r\n.icon_leading path[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading path[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading path#Icon[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading path#Icon[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading path#Accent[fill] {\r\n fill: var(--color-Accent, #4B5565);\r\n}\r\n\r\n.icon_leading path#Icon[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading circle[fill] {\r\n fill: var(--color-icon, #4B5565);\r\n}\r\n\r\n.icon_leading circle[stroke] {\r\n stroke: var(--color-icon, #4B5565);\r\n}\r\n\r\n/* State Styles */\r\n.dropdown-item:hover {\r\n background-color: var(--color-background-gray-subtler, #eef2f6);\r\n}\r\n\r\n.dropdown-item:active {\r\n background-color: var(--color-background-gray-subtle, #e3e8ef);\r\n}\r\n\r\n.dropdown-item.default.selected,\r\n.dropdown-item.icon_leading.selected,\r\n.dropdown-item.avatar_leading.selected,\r\n.dropdown-item.dot_leading.selected {\r\n background-color: var(--color-background-information-subtlest, #e4f0fc);\r\n}\r\n\r\n.dropdown-item.default.selected:hover,\r\n.dropdown-item.icon_leading.selected:hover,\r\n.dropdown-item.avatar_leading.selected:hover,\r\n.dropdown-item.dot_leading.selected:hover {\r\n background-color: var(--color-background-discovery-subtlest, #f0f9ff);\r\n}\r\n\r\n.dropdown-item.default.selected:active,\r\n.dropdown-item.icon_leading.selected:active,\r\n.dropdown-item.avatar_leading.selected:active,\r\n.dropdown-item.dot_leading.selected:active {\r\n background-color: var(--color-background-information-subtler, #c8e0f9);\r\n}\r\n\r\n.dropdown-item.default.selected.disabled,\r\n.dropdown-item.icon_leading.selected.disabled,\r\n.dropdown-item.avatar_leading.selected.disabled,\r\n.dropdown-item.dot_leading.selected.disabled,\r\n.dropdown-item.checkbox.selected.disabled {\r\n background-color: transparent;\r\n color: var(--color-text-disabled, #cdd5df);\r\n}\r\n\r\n.content {\r\n display: flex;\r\n min-height: 2.5rem;\r\n padding: 0 var(--spacing-2);\r\n justify-content: flex-start;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n flex: 1 0 0;\r\n}\r\n\r\n.dropdown-item--selected slot {\r\n flex-grow: 1;\r\n margin-right: 8px;\r\n}\r\n\r\n.dropdown-item--selected svg:last-of-type {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.tick {\r\n display: flex;\r\n align-items: center;\r\n padding-right: var(--spacing-2);\r\n}\r\n","import { Component, Element, Prop, h, Fragment, Event, EventEmitter, State, getAssetPath } from '@stencil/core';\r\nimport { ColorTypes, DropdownTypes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-input-dropdown-menu-item',\r\n styleUrl: 'gb-input-dropdown-menu-item.css',\r\n shadow: true,\r\n})\r\nexport class GbInputDropdownMenuItem {\r\n @Prop() type: DropdownTypes;\r\n @Prop() supportingText: boolean = false;\r\n @Prop({ mutable: true }) selected: boolean = false;\r\n @Prop() state: StateEnum;\r\n @Prop() color: ColorTypes;\r\n @Prop() iconLeading: boolean = false;\r\n @Prop() iconLeadingSwap: string = '';\r\n @State() leadingIconSvg: string = '';\r\n @Event() dropdownItemClicked: EventEmitter<void>;\r\n\r\n @Element() el: HTMLElement;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n\r\n const parser = new DOMParser();\r\n const svgDoc = parser.parseFromString(svg, 'image/svg+xml');\r\n const svgElement = svgDoc.documentElement;\r\n\r\n // Add `has-opacity` class to all elements that have an opacity attribute\r\n const elementsWithOpacity = svgElement.querySelectorAll('[opacity]');\r\n elementsWithOpacity.forEach(el => {\r\n el.classList.add('has_opacity');\r\n });\r\n\r\n // Serialize and store\r\n const modifiedSvg = svgElement.outerHTML;\r\n // console.log(modifiedSvg)\r\n this.leadingIconSvg = modifiedSvg;\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconLeadingSwap);\r\n }\r\n\r\n componentDidLoad() {\r\n const nameSlot = this.el.querySelector('[slot=\"name\"]');\r\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"]');\r\n const initialsSlot = this.el.querySelector('[slot=\"initials\"]');\r\n\r\n if (nameSlot) {\r\n nameSlot.classList.add('text-md-medium');\r\n nameSlot.classList.add('no_wrap');\r\n }\r\n\r\n if (initialsSlot) {\r\n initialsSlot.classList.add('text-xs-semi-bold');\r\n }\r\n\r\n if (supportingTextSlot) {\r\n supportingTextSlot.classList.add('text-sm-regular');\r\n }\r\n }\r\n\r\n async handleClick() {\r\n this.dropdownItemClicked.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n // <div class=\"dropdown-container\" onClick={() => (this.selected = !this.selected)}>\r\n <div class=\"dropdown-container\" onClick={() => this.handleClick()}>\r\n <div\r\n class={{\r\n 'dropdown-item': true,\r\n 'selected': this.selected,\r\n 'disabled': this.state === 'disabled',\r\n 'checkbox': this.type === 'checkbox',\r\n [this.type]: true,\r\n }}\r\n role=\"option\"\r\n aria-selected={this.selected ? 'true' : 'false'}\r\n aria-disabled={this.state === 'disabled' ? 'true' : 'false'}\r\n >\r\n <div class=\"content\">\r\n {this.type === 'icon_leading' && this.iconLeading && <div class={`icon_leading ${this.state}`} innerHTML={this.leadingIconSvg}></div>}\r\n {this.type === 'avatar_leading' && (\r\n <gb-avatar class=\"avatar-icon\" size=\"xs\" color={this.color} text={true}>\r\n <slot name=\"initials\" slot=\"initials\"></slot>\r\n </gb-avatar>\r\n )}\r\n {this.type === 'dot_leading' && (\r\n <>\r\n {this.state === 'default' ? (\r\n <svg id=\"icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 10 10\" fill=\"none\">\r\n <circle cx=\"5\" cy=\"5\" r=\"4\" fill=\"#17B26A\" />\r\n </svg>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\">\r\n <circle cx=\"5\" cy=\"5\" r=\"4\" fill=\"#EEF2F6\" />\r\n </svg>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'checkbox' && <gb-checkbox class=\"checkbox\" size=\"md\" type=\"checkbox\" state={this.state} checked={this.selected}></gb-checkbox>}\r\n <slot name=\"name\"></slot>\r\n {this.supportingText && (\r\n <span>\r\n <slot name=\"supporting_text\"></slot>\r\n </span>\r\n )}\r\n </div>\r\n {this.selected && this.type !== 'checkbox' && (\r\n <div class={`tick`}>\r\n {this.state !== 'disabled' ? (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" class={`${this.state}`}>\r\n <path\r\n d=\"M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337\"\r\n stroke=\"#075DB2\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337\"\r\n stroke=\"#CDD5DF\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n:host {\r\n position: relative;\r\n}\r\n\r\ninput {\r\n background: transparent;\r\n border: none;\r\n outline: none;\r\n}\r\n\r\n/* Target Chrome/Edge/Safari autofill */\r\ninput:-webkit-autofill,\r\ninput:-webkit-autofill:hover,\r\ninput:-webkit-autofill:focus,\r\ninput:-webkit-autofill:active {\r\n /* Make the text use your normal color */ \r\n -webkit-text-fill-color: var(--color-text, #4b5565);\r\n\r\n /* Remove the yellow background Chrome applies by covering it */\r\n transition: background-color 9999s ease-in-out 0s;\r\n\r\n /* Or explicitly paint your own background */\r\n box-shadow: 0 0 0 1000px transparent inset !important;\r\n}\r\n\r\n/* Firefox */\r\ninput:autofill {\r\n background-color: transparent !important;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n\r\n.input_container,\r\n.input_with_label {\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.label {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.hint_text {\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.error_text {\r\n color: var(--color-text-danger, #b51726);\r\n}\r\n\r\n.content {\r\n width: 100%;\r\n height: 100%;\r\n border: none;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.content::placeholder,\r\n.input_like::placeholder {\r\n color: var(--color-text-disabled, #cdd5df);\r\n}\r\n\r\n.content:focus,\r\n.input_like:focus {\r\n outline: none;\r\n}\r\n\r\n.icon {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.input {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n}\r\n\r\n.input,\r\n.input.icon_leading,\r\n.password_input {\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n background: var(--color-background-card, #ffffff);\r\n}\r\n\r\n.input.leading_text {\r\n flex-grow: 1;\r\n border-radius: var(--rounded-none, 0rem) 0.5rem 0.5rem var(--rounded-none, 0rem);\r\n}\r\n\r\n.leading_text_input {\r\n display: flex;\r\n gap: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n}\r\n\r\n.add_on {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n border-right: none;\r\n padding: var(--spacing-2) var(--spacing-3);\r\n border-radius: 0.5rem var(--rounded-none) var(--rounded-none) 0.5rem;\r\n}\r\n\r\n.text_input {\r\n flex-grow: 1;\r\n height: 100%;\r\n}\r\n\r\n.trailing_button_text_input,\r\n.leading_dropdown_text_input {\r\n display: flex;\r\n flex-grow: 1;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.trailing_button_text_input.sm,\r\n.trailing_button_text_input.md {\r\n padding: var(--spacing-none) 0 0 var(--spacing-3);\r\n}\r\n\r\n.input.trailing_button.sm.default,\r\n.input.trailing_button.md.default {\r\n padding: 0;\r\n}\r\n\r\n.leading_dropdown_dropdown,\r\n.trailing_dropdown_dropdown {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n cursor: pointer;\r\n}\r\n\r\n.dropdown_arrow {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.tick {\r\n width: 1.25rem;\r\n height: 1.25rem;\r\n}\r\n\r\n.help_circle {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n/* .input.tags{\r\n position: relative;\r\n} */\r\n\r\n/* Size Styles */\r\n.input.sm {\r\n min-height: 2.5rem;\r\n}\r\n\r\n.input.md {\r\n min-height: 3rem;\r\n}\r\n\r\n.input.sm.default,\r\n.input.sm.password_icon_leading {\r\n padding: var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.sm.icon_leading {\r\n position: relative;\r\n padding: var(--spacing-none) var(--spacing-2) var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.sm.payment_input {\r\n padding: var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.md.default {\r\n padding: var(--spacing-none) 0.875rem var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.md.icon_leading {\r\n position: relative;\r\n padding: var(--spacing-none) var(--spacing-2) var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.md.password_icon_leading {\r\n padding: var(--spacing-none) var(--spacing-2) var(--spacing-none) var(--spacing-3);\r\n}\r\n\r\n.input.md.payment_input {\r\n padding: 0 0.875rem 0 var(--spacing-3);\r\n}\r\n\r\n/* State Styles */\r\n.input:focus-within,\r\n.password_input:focus-within,\r\n.count_text_input:focus-within,\r\n.input_like_parent:focus-within {\r\n border: 1.3px solid var(--color-border-selected, #075db2);\r\n}\r\n\r\n.input.disabled,\r\n.password_input.disabled,\r\n.count_text_input.disabled,\r\n.action.disabled,\r\n.input_like_parent.disabled {\r\n border: 1px solid var(--color-border-disabled, #e3e8ef);\r\n}\r\n\r\n.input.disabled,\r\n.content.disabled,\r\n.password_input.disabled,\r\n.count_text_input.disabled,\r\n.input_like_parent.disabled,\r\n.input_like.disabled {\r\n background: var(--color-background-disabled, #f6f8fa);\r\n color: var(--color-text-subtle, #697586);\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.input_group.disabled {\r\n cursor: not-allowed;\r\n pointer-events: none;\r\n}\r\n\r\n.icon path[fill] {\r\n fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon path[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.disabled path[stroke] {\r\n stroke: var(--color-icon-disabled, #cdd5df);\r\n}\r\n\r\n.input.destructive,\r\n.input.icon_leading.destructive,\r\n.count_text_input.destructive,\r\n.input_like_parent.destructive {\r\n border: 1px solid var(--color-border-danger, #b51726);\r\n}\r\n\r\n::slotted([slot='tooltip_label']) {\r\n white-space: nowrap;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n::slotted([slot='tooltip_supporting_text']) {\r\n min-width: fit-content;\r\n max-width: 18.5rem;\r\n color: var(--color-text-subtle, #697586);\r\n margin-top: 5rem;\r\n}\r\n\r\n::slotted([slot='text'].text_slot) {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n::slotted([slot='text'].text_slot.disabled) {\r\n color: var(--color-text-disabled, #cdd5df);\r\n}\r\n\r\n/* Type Styles */\r\n.password_input {\r\n display: flex;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n}\r\n\r\n.password_content {\r\n display: flex;\r\n gap: var(--spacing-2);\r\n padding: 0.625rem var(--spacing-none) 0.625rem 0.875rem;\r\n flex-grow: 1;\r\n}\r\n\r\n.dropdown {\r\n padding-right: var(--spacing-half);\r\n padding-left: var(--spacing-3);\r\n}\r\n\r\n.password_icon_leading_content {\r\n display: flex;\r\n align-items: center;\r\n flex-grow: 1;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.count_input {\r\n display: flex;\r\n gap: var(--spacing-none);\r\n}\r\n\r\n.count_text_input {\r\n display: flex;\r\n padding: var(--spacing-none) var(--spacing-3);\r\n align-items: center;\r\n gap: var(--spacing-2);\r\n flex: 1 0 0;\r\n align-self: stretch;\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n border-radius: 0.5rem var(--rounded-none) var(--rounded-none) 0.5rem;\r\n}\r\n\r\n.action {\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n border-left: none;\r\n display: flex;\r\n /* padding-right: var(--spacing-1); */\r\n align-items: center;\r\n gap: var(--spacing-none);\r\n align-self: stretch;\r\n border-radius: var(--rounded-none) 0.5rem 0.5rem var(--rounded-none);\r\n}\r\n\r\n/* hr{\r\n height: 100%;\r\n border-right: 0.5px solid var(--color-border-input, #CDD5DF);\r\n} */\r\n\r\n.vertical_line {\r\n width: 1px;\r\n height: 100%;\r\n background-color: var(--color-border-input, #CDD5DF);\r\n /* border-right: 1px solid var(--color-border-input, #CDD5DF); */\r\n}\r\n\r\n.trailing_dropdown_content {\r\n display: flex;\r\n align-items: center;\r\n flex-grow: 1;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.country_icon {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.dropdown_menu {\r\n display: flex;\r\n width: fit-content;\r\n padding: var(--spacing-none);\r\n flex-direction: column;\r\n align-items: flex-start;\r\n align-items: stretch;\r\n border-radius: var(--rounded-sm);\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n background: var(--color-surface, #ffffff);\r\n box-shadow: var(--shadow-sm);\r\n position: absolute;\r\n z-index: 10;\r\n gap: var(--spacing-none);\r\n}\r\n\r\n.dropdown_menu.leading_dropdown,\r\n.dropdown_menu.trailing_dropdown{\r\n height: 10rem;\r\n overflow-y: auto;\r\n}\r\n\r\n.dropdown_menu.leading_dropdown.top.sm {\r\n bottom: 4rem;\r\n left: 0;\r\n}\r\n\r\n.dropdown_menu.leading_dropdown.top.md {\r\n bottom: 4.5rem;\r\n left: 0;\r\n}\r\n\r\n.dropdown_menu.leading_dropdown.bottom.sm {\r\n top: 4rem;\r\n left: 0;\r\n}\r\n\r\n.dropdown_menu.leading_dropdown.bottom.md {\r\n top: 4.5rem;\r\n left: 0;\r\n}\r\n\r\n.dropdown_menu.trailing_dropdown.top.sm {\r\n bottom: 3rem;\r\n right: 0;\r\n}\r\n\r\n.dropdown_menu.trailing_dropdown.top.md {\r\n bottom: 3.5rem;\r\n right: 0;\r\n}\r\n\r\n.dropdown_menu.trailing_dropdown.bottom.sm {\r\n top: 4rem;\r\n right: 0;\r\n}\r\n\r\n.dropdown_menu.trailing_dropdown.bottom.md {\r\n top: 4.5rem;\r\n right: 0;\r\n}\r\n\r\n/* Input Tags Styles */\r\n.input_group {\r\n --height: auto;\r\n --inputheight: 4.5rem;\r\n --weight: 100%;\r\n /* flex-direction: row-reverse; */\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n}\r\n\r\n.input_like_parent {\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n border-radius: var(--rounded-sm);\r\n display: flex;\r\n cursor: pointer;\r\n /* flex-wrap: wrap; */\r\n}\r\n\r\n.input_like_parent.sm {\r\n padding: 0.5rem 0.75rem 0.5rem var(--spacing-3);\r\n}\r\n\r\n.input_like_parent.md {\r\n padding: 0.625rem 0.875rem 0.625rem var(--spacing-3);\r\n}\r\n\r\n.input_field {\r\n display: flex;\r\n gap: var(--spacing-2);\r\n align-items: center;\r\n}\r\n\r\n.hidden-span {\r\n visibility: hidden;\r\n position: absolute;\r\n max-width: 100%;\r\n white-space: pre; /* Preserves spaces */\r\n}\r\n\r\n.input_like {\r\n border: none;\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.results_display {\r\n display: flex;\r\n flex-wrap: wrap;\r\n position: relative;\r\n gap: 0.5rem;\r\n background-color: var(--color-surface, #ffffff);\r\n}\r\n\r\n.results_display.disabled {\r\n background: var(--color-background-disabled, #f6f8fa);\r\n}\r\n\r\n.tags {\r\n padding-top: 1rem;\r\n}\r\n\r\n.dropdown_list.show {\r\n display: block;\r\n}\r\n\r\n.tags_dropdown_menu {\r\n display: flex;\r\n min-width: 100%;\r\n width: fit-content;\r\n max-height: 15rem;\r\n padding: var(--spacing-none);\r\n flex-direction: column;\r\n align-items: stretch;\r\n border-radius: var(--rounded-sm);\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n background: var(--color-surface, #ffffff);\r\n box-shadow: var(--shadow-sm);\r\n position: absolute;\r\n z-index: 99999;\r\n gap: var(--spacing-none);\r\n transition: 1s ease-in-out;\r\n overflow-y: auto;\r\n}\r\n\r\n.tags_dropdown_menu.top {\r\n bottom: 105%;\r\n}\r\n\r\n.tags_dropdown_menu.bottom {\r\n top: 105%;\r\n}\r\n\r\n.input_close_button {\r\n position: absolute;\r\n z-index: 9999;\r\n}\r\n\r\n.input_close_button.sm {\r\n right: 0.2rem;\r\n top: 0.15rem;\r\n}\r\n\r\n.input_close_button.md {\r\n right: 0.3rem;\r\n top: 0.25rem;\r\n}\r\n\r\n.loader {\r\n border: 3px solid var(--color-background-gray, #cdd5df); /* Light grey */\r\n border-top: 3px solid var(--color-background-selected, #075db2); /* Blue */\r\n border-radius: 50%;\r\n width: 10px;\r\n height: 10px;\r\n animation: spin 2s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n 0% {\r\n transform: rotate(0deg);\r\n }\r\n 100% {\r\n transform: rotate(360deg);\r\n }\r\n}\r\n","import { Component, Prop, h, State, Event, EventEmitter, Fragment, Element, getAssetPath, Watch, Listen, AttachInternals, Method } from '@stencil/core';\r\nimport { GeneralSizes, InputFieldTypes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-input-field',\r\n styleUrl: 'gb-input-field.css',\r\n shadow: true,\r\n formAssociated: true,\r\n})\r\nexport class GbInputField {\r\n @AttachInternals() internals: ElementInternals;\r\n @Prop() size: GeneralSizes;\r\n @Prop() type: InputFieldTypes;\r\n @Prop() inputType: string = 'text';\r\n @Prop() minLength: number;\r\n @Prop() maxLength: number;\r\n @Prop({ mutable: true }) destructive: boolean = false;\r\n @Prop() state: 'default' | 'filled' | 'active' | 'disabled';\r\n @Prop() showLabel: boolean = false;\r\n @Prop() label: string = '';\r\n @Prop() showHintText: boolean = false;\r\n @Prop() hintText: string = '';\r\n @Prop() errorText: string = '';\r\n @Prop() showPlaceholder: boolean = false;\r\n @Prop() placeholder: string = '';\r\n @Prop() showHelpIcon: boolean = false;\r\n @Prop() showValidation: boolean = false;\r\n @Prop() showCountryIcon: boolean = false;\r\n @Prop() iconSwap?: string;\r\n @Prop({ mutable: true }) showCloseButton?: boolean = false;\r\n @Prop({ mutable: true }) options: string[] = [\r\n // '+234', 'NGN', 'CAD', '+234', 'NGN', 'CAD', '+234', 'NGN', 'CAD', '+234', 'NGN', 'CAD', '+234', 'NGN', 'CAD'\r\n ];\r\n @Prop({ reflect: true }) idOfInput: string;\r\n @Prop({ reflect: true }) labelText: string;\r\n @Prop({ reflect: true }) isReadOnly: boolean = false;\r\n @Prop({ mutable: true }) results: any[] = [\r\n // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n // { objectName: 'Gideon Ogunkola', objectValue: 'gideon@example.com' },\r\n // 10,\r\n // 20,\r\n // 30,\r\n // 40,\r\n // 50,\r\n ];\r\n @Prop() menuPosition: 'top' | 'bottom';\r\n @Prop() icon: 'country' | 'avatar' | 'dot' | 'false';\r\n @Prop({ mutable: true }) value: any = [\r\n // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n // 10,\r\n ];\r\n @Prop({ reflect: true }) required: boolean = false;\r\n @Prop({ mutable: true }) loading: boolean = false;\r\n @Prop() formatLabel: boolean = true;\r\n @State() inputValue: string = '';\r\n @State() tags: string[] = [];\r\n @State() leadingIconSvg: string = '';\r\n @State() isPasswordVisible: boolean = false;\r\n @State() showDropdown: boolean = false;\r\n @State() selectedItem: string = '';\r\n @State() selectedItems: any[] = [];\r\n @State() unselectedItems: any[] = [];\r\n @State() paddingLeft: string = '1rem';\r\n @State() paddingTop: string = '0rem';\r\n @State() dropdownOpen: boolean = false;\r\n @State() show: boolean = false;\r\n @State() showSpinner: boolean = false;\r\n @State() internalLoading: boolean = this.loading;\r\n @Event() inputValueChanged: EventEmitter<any>;\r\n @Event() buttonClicked: EventEmitter<void>;\r\n @Event() plusButtonClicked: EventEmitter<void>;\r\n @Event() minusButtonClicked: EventEmitter<void>;\r\n @Element() el: HTMLElement;\r\n\r\n private hiddenSpan: HTMLElement;\r\n private minWidth: number = 10;\r\n\r\n inputRef: HTMLInputElement;\r\n dropdownRef!: HTMLElement;\r\n inputElement!: HTMLInputElement;\r\n resultsDisplayElement!: HTMLDivElement;\r\n inputGroupElement!: HTMLDivElement;\r\n\r\n @Method()\r\n async isDestructive() {\r\n this.destructive = true;\r\n }\r\n\r\n @Method()\r\n async isNotDestructive() {\r\n this.destructive = false;\r\n }\r\n\r\n // formAssociatedCallback() {\r\n // // console.log('✅ formAssociatedCallback triggered');\r\n\r\n // this.internals.setValidity({});\r\n\r\n // // Optional: store reference to form\r\n // // const form = this.internals?.form;\r\n // // if (form) {\r\n // // console.log('🔗 Associated form:', form);\r\n // // }\r\n // }\r\n\r\n formResetCallback() {\r\n this.inputValue = '';\r\n this.value = '';\r\n this.internals.setValidity({});\r\n this.internals.setFormValue('');\r\n }\r\n\r\n // formDisabledCallback(disabled: boolean) {\r\n // if (disabled) {\r\n // this.state = 'disabled';\r\n // }\r\n // }\r\n\r\n // private runValidation() {\r\n // if (this.required && !this.inputValue.trim()) {\r\n // this.internals.setValidity({ valueMissing: true }, 'This field is required.', this.el.shadowRoot.querySelector('input'));\r\n // this.destructive = true;\r\n // } else {\r\n // this.internals.setValidity({});\r\n // this.destructive = false;\r\n // }\r\n // }\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n handleTagInput(event: Event) {\r\n const target = event.target as HTMLInputElement;\r\n this.inputValue = target.value; // Update the value\r\n // this.internals.setFormValue(this.inputValue);\r\n // this.runValidation();\r\n this.inputValueChanged.emit(this.inputValue);\r\n\r\n if (this.inputValue.trim() === '') {\r\n this.showDropdown = false;\r\n // this.results = [];\r\n return;\r\n }\r\n\r\n this.showSpinner = true;\r\n\r\n // Simulate API call\r\n setTimeout(() => {\r\n // this.results = this.mockStaffSearch(this.inputValue);\r\n this.showDropdown = this.results.length > 0;\r\n }, 1000);\r\n\r\n this.updateInputWidth();\r\n }\r\n\r\n // mockStaffSearch(query: string) {\r\n // const mockData = this.results;\r\n\r\n // return mockData.filter(staff => staff.name.toLowerCase().includes(query.toLowerCase()));\r\n // }\r\n\r\n selectDropdownItem(item: any) {\r\n if (this.value.length === 0) {\r\n const isObject = typeof item === 'object';\r\n const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n if (isSelected) {\r\n // Unselect item: Move it from selectedItems to unselectedItems\r\n this.selectedItems = this.selectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n if (!this.unselectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item))) {\r\n this.unselectedItems = [...this.unselectedItems, item];\r\n }\r\n console.log(this.selectedItems);\r\n this.inputValueChanged.emit(this.selectedItems);\r\n } else {\r\n // Select item: Move it from unselectedItems to selectedItems\r\n this.selectedItems = [...this.selectedItems, item];\r\n this.unselectedItems = this.unselectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n console.log(this.selectedItems);\r\n this.inputValueChanged.emit(this.selectedItems);\r\n }\r\n } else {\r\n const isObject = typeof item === 'object';\r\n const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n\r\n if (isSelected) {\r\n this.value = this.value.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n console.log(this.value);\r\n this.inputValueChanged.emit(this.value);\r\n } else {\r\n this.value = [...this.value, item]; // Add item to array\r\n console.log(this.value);\r\n this.inputValueChanged.emit(this.value);\r\n }\r\n }\r\n\r\n this.updateStyles();\r\n }\r\n\r\n handleTagRemove(index: number) {\r\n if (this.value.length > 0) {\r\n this.value = [...this.value.slice(0, index), ...this.value.slice(index + 1)];\r\n console.log(this.value);\r\n // this.updateStyles();\r\n } else {\r\n this.selectedItems = [...this.selectedItems.slice(0, index), ...this.selectedItems.slice(index + 1)];\r\n this.updateStyles();\r\n }\r\n }\r\n\r\n updateStyles() {\r\n setTimeout(() => {\r\n if (this.resultsDisplayElement) {\r\n const resultsWidth = this.resultsDisplayElement.offsetWidth;\r\n const inputWidth = this.inputElement.offsetWidth;\r\n\r\n this.paddingLeft = this.selectedItems.length === 0 ? '1rem' : `${resultsWidth + 10}px`;\r\n\r\n this.paddingTop = this.selectedItems.length > 2 ? '1rem' : `${inputWidth + 10}px`;\r\n }\r\n });\r\n\r\n if (this.destructive) {\r\n this.destructive = false;\r\n }\r\n this.inputValue = '';\r\n }\r\n\r\n exportSelectedStaff() {\r\n this.inputValueChanged.emit(this.selectedItems);\r\n }\r\n\r\n // private copyToClipboard = () => {\r\n // if (this.inputRef) {\r\n // this.inputRef.select();\r\n // document.execCommand('copy'); // Deprecated but works in most browsers\r\n // // For modern browsers:\r\n // navigator.clipboard.writeText(this.inputRef.value);\r\n // }\r\n // };\r\n\r\n onButtonClicked() {\r\n this.buttonClicked.emit();\r\n }\r\n\r\n onPlusButtonClicked() {\r\n this.plusButtonClicked.emit();\r\n }\r\n\r\n onMinusButtonClicked() {\r\n this.minusButtonClicked.emit();\r\n }\r\n\r\n @Listen('click', { target: 'document' })\r\n handleClickOutside(event: MouseEvent) {\r\n if (this.showDropdown && !this.el.contains(event.target as Node)) {\r\n this.showDropdown = false;\r\n }\r\n }\r\n\r\n /* Function to handle and emit the inputted values */\r\n handleInput(event: Event) {\r\n const target = event.target as HTMLInputElement;\r\n this.inputValue = target.value;\r\n this.internals.setFormValue(this.inputValue);\r\n\r\n // this.runValidation();\r\n if (this.inputValue) {\r\n this.showCloseButton = true;\r\n } else {\r\n this.showCloseButton = false;\r\n }\r\n if (this.type === 'leading_dropdown') {\r\n this.inputValueChanged.emit({ combined: `${this.selectedItem}${this.inputValue}`, prefix: this.selectedItem, value: this.inputValue });\r\n } else {\r\n this.inputValueChanged.emit(this.inputValue);\r\n }\r\n }\r\n\r\n handleInputFocus() {\r\n if (this.destructive) {\r\n this.destructive = false;\r\n }\r\n }\r\n\r\n clearInput() {\r\n if (this.inputRef) {\r\n this.inputRef.value = '';\r\n this.inputValue = this.inputRef.value;\r\n this.showCloseButton = false;\r\n this.inputValueChanged.emit(this.inputValue);\r\n }\r\n }\r\n\r\n /* Function to handle and emit the inputted values */\r\n togglePasswordVisibility() {\r\n this.isPasswordVisible = !this.isPasswordVisible;\r\n }\r\n\r\n @Watch('options')\r\n optionsChanged(newOptions: string[]) {\r\n // Update selectedItem when options are loaded or changed\r\n if (newOptions.length > 0 && !this.selectedItem) {\r\n this.selectedItem = newOptions[0];\r\n }\r\n }\r\n\r\n @Watch('loading')\r\n onLoadingChanged(newLoading: boolean) {\r\n this.internalLoading = newLoading;\r\n }\r\n\r\n isItemSelected(option) {\r\n return this.selectedItem === option;\r\n }\r\n\r\n isTagItemSelected(item) {\r\n // return this.selectedStaff.some(i => i.name === item.name);\r\n\r\n const isObject = typeof item === 'object';\r\n return this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n }\r\n\r\n handleItemSelect(option) {\r\n // For other types, allow only one selection\r\n this.selectedItem = option;\r\n this.showDropdown = false; // Close the dropdown\r\n }\r\n\r\n @Watch('value')\r\n updateSelectedItems(newValue: any[]) {\r\n if (Array.isArray(newValue) && newValue.length > 0) {\r\n this.selectedItems = [];\r\n this.unselectedItems = [];\r\n\r\n const objectValues = newValue.filter(val => typeof val === 'object' && val !== null);\r\n const primitiveValues = newValue.filter(val => typeof val !== 'object');\r\n\r\n this.selectedItems = this.results.filter(item =>\r\n typeof item === 'object' && item !== null\r\n ? objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) // Avoid object reference issues\r\n : primitiveValues.includes(item),\r\n );\r\n\r\n this.unselectedItems = this.results.filter(item =>\r\n typeof item === 'object' && item !== null ? !objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) : !primitiveValues.includes(item),\r\n );\r\n } else {\r\n this.selectedItems = [];\r\n this.unselectedItems = [...this.results];\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n // setTimeout(() => {\r\n // this.loading = true;\r\n // }, 3000);\r\n\r\n this.selectedItem = this.options[0];\r\n\r\n this.loadIcon(this.iconSwap);\r\n\r\n if (this.type !== 'tags') {\r\n this.selectedItem = null; // For single selection types\r\n }\r\n\r\n this.updateSelectedItems(this.value);\r\n\r\n // console.log('Selected Items:', this.selectedItems);\r\n // console.log('Unselected Items:', this.unselectedItems);\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.options && this.options.length > 0) {\r\n this.selectedItem = this.options[0]; // Set the first item as default\r\n }\r\n\r\n const mainTextSlot = this.el.querySelector('[slot=\"tooltip_label\"]');\r\n const supportingTextSlot = this.el.querySelector('[slot=\"tooltip_supporting_text\"]');\r\n const textSlot = this.el.querySelector('[slot=\"text\"]');\r\n\r\n if (mainTextSlot) {\r\n mainTextSlot.classList.add('text-xs-semi-bold');\r\n }\r\n\r\n if (supportingTextSlot) {\r\n supportingTextSlot.classList.add('text-xs-regular');\r\n }\r\n\r\n if (textSlot) {\r\n textSlot.classList.add('text_slot');\r\n\r\n if (this.state === 'disabled') {\r\n textSlot.classList.add('disabled');\r\n }\r\n\r\n textSlot.classList.add('text-md-regular');\r\n }\r\n\r\n if (this.type === 'tags') {\r\n document.addEventListener('click', this.handleClickOutside);\r\n }\r\n // this.inputElement.addEventListener('input', this.handleTagInput.bind(this));\r\n this.updateInputWidth();\r\n }\r\n\r\n updateInputWidth() {\r\n if (this.hiddenSpan) {\r\n const input = this.el.shadowRoot.querySelector('input') as HTMLInputElement;\r\n\r\n // Update input width based on span's width or use minimum width\r\n const calculatedWidth = Math.max(this.hiddenSpan.offsetWidth + 10, this.minWidth);\r\n input.style.width = `${calculatedWidth}px`;\r\n }\r\n }\r\n\r\n handleWrapperClick() {\r\n this.inputElement.focus(); // Focus the input field\r\n }\r\n\r\n // disconnectedCallback() {\r\n // document.removeEventListener('click', this.handleClickOutside);\r\n // this.inputElement.removeEventListener('input', this.handleTagInput.bind(this));\r\n // }\r\n\r\n render() {\r\n return (\r\n <div class={`input_container`}>\r\n <div class={`input_with_label`}>\r\n {this.showLabel && (\r\n <>\r\n {this.formatLabel ? (\r\n <p class=\"label text-sm-medium\">{this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase()}</p>\r\n ) : (\r\n <p class=\"label text-sm-medium\">{this.label}</p>\r\n )}\r\n </>\r\n )}\r\n {this.type === 'default' && [\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <input\r\n class={`content text-md-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n onFocus={() => this.handleInputFocus()}\r\n value={this.value}\r\n />\r\n <>\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </>\r\n </div>,\r\n ]}\r\n {this.type === 'icon_leading' && [\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`icon ${this.size} ${this.state}`} innerHTML={this.leadingIconSvg}></div>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n ref={el => (this.inputRef = el as HTMLInputElement)}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n <>\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n {this.showCloseButton && !this.destructive && (\r\n <gb-button\r\n size={this.size}\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n state=\"default\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/cancel-01.svg\"\r\n onClick={() => this.clearInput()}\r\n class={`input_close_button ${this.size}`}\r\n ></gb-button>\r\n )}\r\n </>\r\n </div>,\r\n ]}\r\n {this.type === 'leading_dropdown' && [\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`leading_dropdown_dropdown`} onClick={() => (this.showDropdown = !this.showDropdown)}>\r\n {this.showCountryIcon && (\r\n <div class={`country_icon`}>\r\n <img src=\"build/assets/NG.svg\" alt=\"\" />\r\n </div>\r\n )}\r\n <div class={`dropdown_text`}>\r\n <p class={`text-${this.size}-regular`} style={{ color: 'var(--color-text, #4B5565)' }}>\r\n {this.selectedItem}\r\n </p>\r\n </div>\r\n <div class={`dropdown_arrow`}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5\"\r\n stroke=\"#4B5565\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class={`leading_dropdown_text_input`}>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>,\r\n <>\r\n {this.showDropdown && (\r\n <div class={`dropdown_menu ${this.type} ${this.size} ${this.menuPosition}`} ref={el => (this.dropdownRef = el)}>\r\n {this.options.map(option => (\r\n <gb-input-dropdown-menu-item type=\"default\" state={StateEnum.Default} selected={this.isItemSelected(option)} onClick={() => this.handleItemSelect(option)}>\r\n <p slot=\"name\">{option}</p>\r\n </gb-input-dropdown-menu-item>\r\n ))}\r\n </div>\r\n )}\r\n </>,\r\n ]}\r\n {this.type === 'trailing_dropdown' && [\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`trailing_dropdown_content`}>\r\n <p class={`text-${this.size}-regular`} style={{ color: 'var(--color-text, #4B5565)' }}>\r\n $\r\n </p>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n // onBlur={() => this.runValidation()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n <div class={`trailing_dropdown_dropdown`} onClick={() => (this.showDropdown = !this.showDropdown)}>\r\n <div class={`dropdown_text`}>\r\n <p class={`text-${this.size}-regular`} style={{ color: 'var(--color-text, #4B5565)' }}>\r\n {this.selectedItem}\r\n </p>\r\n </div>\r\n <div class={`dropdown_arrow`}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5\"\r\n stroke=\"#4B5565\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n </div>,\r\n <>\r\n {this.showDropdown && (\r\n <div class={`dropdown_menu ${this.type} ${this.size} ${this.menuPosition}`} ref={el => (this.dropdownRef = el)}>\r\n {this.options.map(option => (\r\n <gb-input-dropdown-menu-item type=\"default\" state={StateEnum.Default} selected={this.isItemSelected(option)} onClick={() => this.handleItemSelect(option)}>\r\n <p slot=\"name\">{option}</p>\r\n </gb-input-dropdown-menu-item>\r\n ))}\r\n </div>\r\n )}\r\n </>,\r\n ]}\r\n {this.type === 'leading_text' && [\r\n <div class=\"leading_text_input\">\r\n <div class={`add_on`}>\r\n {/* <p class={`text-${this.size}-regular`} style={{ color: this.state === 'disabled' ? 'var(--color-text-disabled, #CDD5DF)' : 'var(--color-text, #4B5565)' }}>\r\n http://\r\n </p> */}\r\n <slot name=\"text\"></slot>\r\n </div>\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n // onBlur={() => this.runValidation()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n </div>,\r\n ]}\r\n {this.type === 'payment_input' && (\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"23\" height=\"14\" viewBox=\"0 0 23 14\" fill=\"none\">\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M11.179 11.8294C9.99493 12.8275 8.45902 13.43 6.78069 13.43C3.03582 13.43 0 10.4303 0 6.72997C0 3.02966 3.03582 0.0299683 6.78069 0.0299683C8.45902 0.0299683 9.99493 0.632466 11.179 1.63051C12.363 0.632466 13.8989 0.0299683 15.5773 0.0299683C19.3221 0.0299683 22.358 3.02966 22.358 6.72997C22.358 10.4303 19.3221 13.43 15.5773 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z\"\r\n fill=\"#ED0006\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M11.179 11.8294C12.6369 10.6005 13.5614 8.77192 13.5614 6.72997C13.5614 4.68801 12.6369 2.85941 11.179 1.63051C12.363 0.632465 13.8989 0.0299683 15.5772 0.0299683C19.3221 0.0299683 22.3579 3.02966 22.3579 6.72997C22.3579 10.4303 19.3221 13.43 15.5772 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z\"\r\n fill=\"#F9A000\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M11.179 11.8294C12.6369 10.6005 13.5614 8.77193 13.5614 6.72999C13.5614 4.68805 12.6369 2.85946 11.179 1.63055C9.72109 2.85946 8.79663 4.68805 8.79663 6.72999C8.79663 8.77193 9.72109 10.6005 11.179 11.8294Z\"\r\n fill=\"#FF5E00\"\r\n />\r\n </svg>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n <>\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </>\r\n </div>\r\n )}\r\n {this.type === 'trailing_button' && (\r\n <div class={`input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`trailing_button_text_input ${this.size}`}>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n ref={el => (this.inputRef = el as HTMLInputElement)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n // onBlur={() => this.runValidation()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n {this.loading && <div class=\"loader\"></div>}\r\n <gb-button\r\n size=\"lg\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n state={this.state === 'disabled' ? 'disabled' : 'default'}\r\n icon-leading={true}\r\n icon-leading-swap={this.iconSwap}\r\n onClick={() => this.onButtonClicked()}\r\n ></gb-button>\r\n </div>\r\n )}\r\n {this.type === 'password' && (\r\n <div class={`password_input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`password_content`}>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.isPasswordVisible ? 'text' : 'password'}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n <div class={`dropdown`}>\r\n <gb-password-button onClick={() => this.togglePasswordVisibility()}></gb-password-button>\r\n </div>\r\n </div>\r\n )}\r\n {this.type === 'password_icon_leading' && (\r\n <div class={`password_icon_leading_input input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`}>\r\n <div class={`password_icon_leading_content`}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M12.0759 12.1667C11.6617 12.1667 11.3259 12.5025 11.3259 12.9167C11.3259 13.3309 11.6617 13.6667 12.0759 13.6667V12.1667ZM12.0833 13.6667C12.4976 13.6667 12.8333 13.3309 12.8333 12.9167C12.8333 12.5025 12.4976 12.1667 12.0833 12.1667V13.6667ZM7.91668 12.1667C7.50246 12.1667 7.16668 12.5025 7.16668 12.9167C7.16668 13.3309 7.50246 13.6667 7.91668 13.6667V12.1667ZM7.92415 13.6667C8.33836 13.6667 8.67415 13.3309 8.67415 12.9167C8.67415 12.5025 8.33836 12.1667 7.92415 12.1667V13.6667ZM16.4435 10.1294L17.1868 10.0293L16.4435 10.1294ZM13.7003 7.58258L13.7347 6.83337L13.7003 7.58258ZM13.7003 18.2508L13.7347 19L13.7003 18.2508ZM16.4435 15.704L15.7002 15.6039L16.4435 15.704ZM6.29973 7.58258L6.33417 8.33179L6.29973 7.58258ZM3.55652 10.1294L2.81323 10.0293L3.55652 10.1294ZM6.29973 18.2508L6.33417 17.5015L6.29973 18.2508ZM3.55652 15.704L4.29981 15.6039L3.55652 15.704ZM5.50001 7.5C5.50001 7.91422 5.8358 8.25 6.25001 8.25C6.66422 8.25 7.00001 7.91422 7.00001 7.5H5.50001ZM13 7.5C13 7.91422 13.3358 8.25 13.75 8.25C14.1642 8.25 14.5 7.91422 14.5 7.5H13ZM12.0759 13.6667H12.0833V12.1667H12.0759V13.6667ZM7.91668 13.6667H7.92415V12.1667H7.91668V13.6667ZM10 17.5833C8.69057 17.5833 7.50287 17.5553 6.33417 17.5015L6.26528 19C7.45761 19.0548 8.66829 19.0833 10 19.0833V17.5833ZM13.6659 17.5015C12.4972 17.5553 11.3094 17.5833 10 17.5833V19.0833C11.3317 19.0833 12.5424 19.0548 13.7347 19L13.6659 17.5015ZM17.1868 15.804C17.3105 14.8853 17.4167 13.9152 17.4167 12.9167H15.9167C15.9167 13.8142 15.8211 14.7058 15.7002 15.6039L17.1868 15.804ZM17.4167 12.9167C17.4167 11.9181 17.3105 10.948 17.1868 10.0293L15.7002 10.2295C15.8211 11.1275 15.9167 12.0192 15.9167 12.9167H17.4167ZM10 8.25C11.3095 8.25 12.4972 8.27806 13.6659 8.33179L13.7347 6.83337C12.5424 6.77856 11.3317 6.75 10 6.75V8.25ZM6.33417 8.33179C7.50287 8.27806 8.69057 8.25 10 8.25V6.75C8.66829 6.75 7.45761 6.77856 6.26528 6.83337L6.33417 8.33179ZM2.81323 10.0293C2.68953 10.948 2.58334 11.9181 2.58334 12.9167H4.08334C4.08334 12.0192 4.1789 11.1275 4.29981 10.2295L2.81323 10.0293ZM2.58334 12.9167C2.58334 13.9152 2.68953 14.8853 2.81323 15.804L4.29981 15.6039C4.1789 14.7058 4.08334 13.8142 4.08334 12.9167H2.58334ZM17.1868 10.0293C16.9527 8.29067 15.5122 6.91509 13.7347 6.83337L13.6659 8.33179C14.6943 8.37907 15.5595 9.18437 15.7002 10.2295L17.1868 10.0293ZM13.7347 19C15.5122 18.9183 16.9527 17.5427 17.1868 15.804L15.7002 15.6039C15.5595 16.649 14.6943 17.4543 13.6659 17.5015L13.7347 19ZM6.26528 6.83337C4.48781 6.91508 3.04732 8.29067 2.81323 10.0293L4.29981 10.2295C4.44052 9.18437 5.30576 8.37907 6.33417 8.33179L6.26528 6.83337ZM6.33417 17.5015C5.30576 17.4543 4.44052 16.649 4.29981 15.6039L2.81323 15.804C3.04732 17.5427 4.48782 18.9183 6.26528 19L6.33417 17.5015ZM7.00001 7.5V5.41667H5.50001V7.5H7.00001ZM13 5.41667V7.5H14.5V5.41667H13ZM10 2.41667C11.6569 2.41667 13 3.75981 13 5.41667H14.5C14.5 2.93139 12.4853 0.916668 10 0.916668V2.41667ZM7.00001 5.41667C7.00001 3.75981 8.34316 2.41667 10 2.41667V0.916668C7.51473 0.916668 5.50001 2.93139 5.50001 5.41667H7.00001Z\"\r\n fill=\"#4B5565\"\r\n />\r\n </svg>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.isPasswordVisible ? 'text' : 'password'}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n />\r\n </div>\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M7.03831 9.9735C6.6785 9.76829 6.22047 9.89362 6.01526 10.2534C5.81005 10.6132 5.93538 11.0713 6.29518 11.2765L7.03831 9.9735ZM8.66675 12.5L8.0231 12.885C8.16612 13.1241 8.42989 13.2642 8.70808 13.2489C8.98627 13.2335 9.23302 13.0652 9.34885 12.8118L8.66675 12.5ZM13.6933 7.32469C14.0567 7.12594 14.1902 6.67022 13.9914 6.3068C13.7927 5.94338 13.337 5.80988 12.9736 6.00863L13.6933 7.32469ZM19.0834 9.99999C19.0834 4.9834 15.0167 0.916656 10.0001 0.916656V2.41666C14.1882 2.41666 17.5834 5.81183 17.5834 9.99999H19.0834ZM10.0001 0.916656C4.98349 0.916656 0.916748 4.9834 0.916748 9.99999H2.41675C2.41675 5.81183 5.81192 2.41666 10.0001 2.41666V0.916656ZM0.916748 9.99999C0.916748 15.0166 4.98349 19.0833 10.0001 19.0833V17.5833C5.81192 17.5833 2.41675 14.1881 2.41675 9.99999H0.916748ZM10.0001 19.0833C15.0167 19.0833 19.0834 15.0166 19.0834 9.99999H17.5834C17.5834 14.1881 14.1882 17.5833 10.0001 17.5833V19.0833ZM6.66675 10.625C6.29518 11.2765 6.29506 11.2764 6.29494 11.2763C6.2949 11.2763 6.29478 11.2763 6.29472 11.2762C6.29458 11.2761 6.29446 11.2761 6.29437 11.276C6.29417 11.2759 6.29406 11.2758 6.29402 11.2758C6.29394 11.2758 6.29418 11.2759 6.29472 11.2762C6.2958 11.2768 6.2981 11.2782 6.30155 11.2802C6.30845 11.2843 6.31994 11.2911 6.33556 11.3006C6.36683 11.3196 6.41441 11.3492 6.47453 11.3886C6.59518 11.4676 6.76402 11.5846 6.9516 11.7329C7.33643 12.0371 7.75673 12.4397 8.0231 12.885L9.31039 12.115C8.9101 11.4458 8.3304 10.9108 7.8819 10.5562C7.65281 10.3751 7.44665 10.2322 7.29647 10.1338C7.22117 10.0845 7.15938 10.046 7.11512 10.0191C7.09298 10.0056 7.07518 9.99502 7.06222 9.98739C7.05574 9.98358 7.05047 9.98051 7.04646 9.97819C7.04446 9.97703 7.04278 9.97606 7.04142 9.97528C7.04073 9.97489 7.04013 9.97454 7.03962 9.97425C7.03936 9.9741 7.03912 9.97396 7.0389 9.97384C7.03879 9.97377 7.03865 9.97369 7.03859 9.97366C7.03845 9.97358 7.03831 9.9735 6.66675 10.625ZM8.66675 12.5C9.34885 12.8118 9.3488 12.8119 9.34876 12.812C9.34876 12.812 9.34872 12.8121 9.34871 12.8121C9.3487 12.8122 9.34871 12.8121 9.34876 12.812C9.34884 12.8118 9.34905 12.8114 9.34938 12.8107C9.35003 12.8092 9.35117 12.8068 9.35277 12.8033C9.35599 12.7964 9.36109 12.7855 9.36805 12.7708C9.38196 12.7413 9.40327 12.6967 9.43164 12.6386C9.48841 12.5226 9.57333 12.3531 9.68378 12.1445C9.90507 11.7264 10.2268 11.1546 10.628 10.5403C11.4489 9.28341 12.5314 7.96007 13.6933 7.32469L12.9736 6.00863C11.4687 6.83158 10.218 8.4249 9.37213 9.72011C8.93998 10.3818 8.59509 10.9949 8.35805 11.4427C8.23933 11.667 8.14717 11.8508 8.08415 11.9797C8.05262 12.0441 8.02836 12.0949 8.01167 12.1303C8.00333 12.1479 7.99688 12.1617 7.99236 12.1715C7.9901 12.1763 7.98833 12.1802 7.98704 12.183C7.98639 12.1844 7.98587 12.1855 7.98547 12.1864C7.98527 12.1868 7.9851 12.1872 7.98496 12.1875C7.9849 12.1876 7.98482 12.1878 7.98478 12.1879C7.98471 12.188 7.98464 12.1882 8.66675 12.5Z\"\r\n fill=\"#079455\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n <gb-password-button onClick={() => this.togglePasswordVisibility()}></gb-password-button>\r\n </div>\r\n )}\r\n {this.type === 'count' && [\r\n <div class={`count_input`}>\r\n <div class={`count_text_input ${this.destructive ? 'destructive' : ''} ${this.state}`}>\r\n <input\r\n class={`content text-${this.size}-regular ${this.type} ${this.state}`}\r\n type={this.inputType}\r\n minLength={this.minLength}\r\n maxLength={this.maxLength}\r\n placeholder={this.placeholder ? this.placeholder : ''}\r\n onInput={event => this.handleInput(event)}\r\n value={this.value}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n {this.loading && <div class=\"loader\"></div>}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <gb-help-tooltip show-supporting-text={true}>\r\n <slot name=\"tooltip_label\" slot=\"label\"></slot>\r\n <slot name=\"tooltip_supporting_text\" slot=\"supporting_text\"></slot>\r\n </gb-help-tooltip>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n <div class={`action ${this.state}`}>\r\n <gb-button\r\n size=\"xl\"\r\n state={this.state === 'disabled' ? 'disabled' : 'default'}\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/minus_sign.svg\"\r\n onClick={() => this.onMinusButtonClicked()}\r\n ></gb-button>\r\n {/* <hr /> */}\r\n <div class=\"vertical_line\"></div>\r\n <gb-button\r\n size=\"xl\"\r\n state={this.state === 'disabled' ? 'disabled' : 'default'}\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading=\"true\"\r\n icon-leading-swap=\"assets/plus_sign.svg\"\r\n onClick={() => this.onPlusButtonClicked()}\r\n ></gb-button>\r\n </div>\r\n </div>,\r\n ]}\r\n {this.type === 'tags' && (\r\n <div class={`input_group ${this.state}`} ref={el => (this.inputGroupElement = el as HTMLDivElement)} onClick={() => this.handleWrapperClick()}>\r\n <div class={`input_like_parent ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}`} onClick={() => (this.dropdownOpen = !this.dropdownOpen)}>\r\n {/* ${this.selectedStaff.length >= 1 ? 'show_results' : ''} */}\r\n <div class={`results_display ${this.state === 'disabled' ? 'disabled' : ''}`} ref={el => (this.resultsDisplayElement = el as HTMLDivElement)}>\r\n {this.value.length === 0 ? (\r\n <>\r\n {this.selectedItems.map((item, index) => (\r\n <>\r\n {typeof item === 'object' ? (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)}>\r\n <h1 class=\"text-xxs-semi-bold\" slot=\"initials\">\r\n {item.objectName.split(' ').map(part => part.charAt(0).toUpperCase())}\r\n </h1>\r\n <p>{item.objectName.split(' ')[0]}</p>\r\n </gb-tag>\r\n ) : (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)}>\r\n <p>{item}</p>\r\n </gb-tag>\r\n )}\r\n </>\r\n ))}\r\n </>\r\n ) : (\r\n <>\r\n {this.value.map((val, index) => (\r\n <>\r\n {typeof val === 'object' ? (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)}>\r\n <h1 class=\"text-xxs-semi-bold\" slot=\"initials\">\r\n {val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())}\r\n </h1>\r\n <p>{val.objectName.split(' ')[0]}</p>\r\n </gb-tag>\r\n ) : (\r\n <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)}>\r\n <p>{val}</p>\r\n </gb-tag>\r\n )}\r\n </>\r\n ))}\r\n </>\r\n )}\r\n <span class=\"hidden-span\" ref={el => (this.hiddenSpan = el as HTMLElement)}>\r\n {this.inputValue || ' '}\r\n </span>\r\n <div class=\"input_field\">\r\n <input\r\n id={this.idOfInput}\r\n class={`input_like text-${this.size}-regular ${this.state}`}\r\n type=\"text\"\r\n // placeholder={this.placeholder && this.selectedStaff.length === 0 ? this.placeholder : ''}\r\n value={this.inputValue}\r\n readOnly={this.isReadOnly}\r\n ref={el => (this.inputElement = el as HTMLInputElement)}\r\n onBlur={() => this.exportSelectedStaff()}\r\n onInput={event => this.handleTagInput(event)}\r\n onFocus={() => this.handleInputFocus()}\r\n />\r\n </div>\r\n </div>\r\n {/* {this.showValidation && !this.destructive && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334\"\r\n stroke=\"#079455\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n {this.showHelpIcon && (\r\n <div class={`help_circle`}>\r\n {!this.destructive ? (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M6.66668 5.99998C6.66668 5.2636 7.26363 4.66665 8.00001 4.66665C8.73639 4.66665 9.33334 5.2636 9.33334 5.99998C9.33334 6.26541 9.25578 6.51273 9.12209 6.72051C8.72361 7.33976 8.00001 7.93027 8.00001 8.66665V8.99998M7.99467 11.3333H8.00066M14.6667 7.99998C14.6667 11.6819 11.6819 14.6666 8.00001 14.6666C4.31811 14.6666 1.33334 11.6819 1.33334 7.99998C1.33334 4.31808 4.31811 1.33331 8.00001 1.33331C11.6819 1.33331 14.6667 4.31808 14.6667 7.99998Z\"\r\n stroke=\"#697586\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n ) : (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z\"\r\n stroke=\"#B51726\"\r\n stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </div>\r\n )} */}\r\n </div>\r\n {this.showDropdown && (\r\n <div class={`tags_dropdown_menu ${this.show ? 'show' : ''} ${this.menuPosition}`}>\r\n {this.results.map(item => (\r\n <gb-input-dropdown-menu-item\r\n type=\"checkbox\"\r\n supporting-text={true}\r\n state={StateEnum.Default}\r\n onClick={() => this.selectDropdownItem(item)}\r\n selected={this.isTagItemSelected(item)}\r\n >\r\n {typeof item === 'object'\r\n ? [<p slot=\"name\">{item.objectName}</p>, <p slot=\"supporting_text\">{item.objectValue}</p>]\r\n : typeof item !== 'object' && <p slot=\"name\">{item}</p>}\r\n </gb-input-dropdown-menu-item>\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n {this.showHintText && <>{!this.destructive ? <p class=\"hint_text text-sm-regular\">{this.hintText}</p> : <p class=\"error_text text-sm-regular\">{this.errorText}</p>}</>}\r\n </div>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n.metric_card_wrapper {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n background: var(--color-background-card, #ffffff);\r\n}\r\n\r\n.metric_card_wrapper.sm {\r\n width: 13.0625rem;\r\n gap: var(--spacing-4);\r\n padding: var(--spacing-4);\r\n}\r\n\r\n.metric_card_wrapper.md {\r\n width: 18.75rem;\r\n min-width: 18.75rem;\r\n gap: var(--spacing-7);\r\n box-shadow: var(--shadow-xs);\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.metric_card_wrapper.radius_xs {\r\n border-radius: var(--rounded-xs);\r\n}\r\n\r\n.metric_card_wrapper.radius_md {\r\n border-radius: var(--rounded-md);\r\n}\r\n\r\n.icon_and_label.md {\r\n display: flex;\r\n align-items: center;\r\n gap: 1rem;\r\n align-self: stretch;\r\n}\r\n\r\n.featured_icon{\r\n width: 3rem;\r\n}\r\n\r\n.heading_and_number {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: var(--spacing-5);\r\n align-self: stretch;\r\n}\r\n\r\n.heading {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.number_and_badge {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-end;\r\n gap: 1rem;\r\n align-self: stretch;\r\n}\r\n\r\n.number {\r\n color: var(--color-text-bold);\r\n}\r\n","import { Component, Prop, h } from '@stencil/core';\r\nimport { ColorTypes, GeneralSizes, MetricFeaturedIconTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-metric-card',\r\n styleUrl: 'gb-metric-card.css',\r\n shadow: true,\r\n})\r\nexport class GbMetricCard {\r\n @Prop() size: GeneralSizes;\r\n @Prop() radius: GeneralSizes;\r\n @Prop() label: string;\r\n @Prop() metric: string;\r\n @Prop() showBadge: boolean = false;\r\n @Prop() featuredIconStyle: MetricFeaturedIconTypes;\r\n @Prop() featuredIconColor: ColorTypes;\r\n @Prop() icon: string = '';\r\n @Prop() percentage: string = '';\r\n\r\n render() {\r\n return (\r\n <div class={`metric_card_wrapper ${this.size} ${'radius_' + this.radius}`}>\r\n <div class={`icon_and_label ${this.size}`}>\r\n <div class=\"featured_icon\">\r\n <gb-metric-featured-icon\r\n size={this.size}\r\n featured-icon-style={this.featuredIconStyle}\r\n icon={this.icon}\r\n color={this.featuredIconColor}\r\n ></gb-metric-featured-icon>\r\n </div>\r\n {this.size === 'md' && <p class=\"heading text-sm-medium\">{this.label}</p>}\r\n </div>\r\n <div class=\"heading_and_number\">\r\n {this.size === 'sm' && <p class=\"heading text-sm-medium\">{this.label}</p>}\r\n <div class=\"number_and_badge\">\r\n <p class=\"number display-md-semi-bold\">{this.metric}</p>\r\n {this.showBadge && (\r\n <gb-badge size=\"lg\" type=\"pill_color\" color=\"gray\">\r\n <p>{this.percentage}</p>\r\n </gb-badge>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n:host {\r\n width: fit-content;\r\n position: relative;\r\n}\r\n\r\n.metric_featured_icon_wrapper {\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n flex-shrink: 0;\r\n /* aspect-ratio: 1/1; */\r\n display: block;\r\n}\r\n\r\n.icon_glass {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-shrink: 0;\r\n /* aspect-ratio: 1/1; */\r\n border-radius: var(--rounded-sm);\r\n border: 1px solid var(--color-surface-transparent50, rgba(255, 255, 255, 0.5));\r\n background: var(--color-surface-transparent50, rgba(255, 255, 255, 0.5));\r\n /* Backgroun Blur/Bg blur md */\r\n backdrop-filter: blur(8px);\r\n position: relative;\r\n z-index: 1;\r\n}\r\n\r\n.icon_glass.sm {\r\n /* width: 2.05131rem;\r\n height: 2.05131rem; */\r\n padding: 0.4375rem 0.48881rem 0.48881rem 0.4375rem;\r\n}\r\n\r\n.icon_glass.md {\r\n /* width: 2.46156rem;\r\n height: 2.46156rem; */\r\n padding: 0.50644rem 0.46156rem 0.45513rem 0.5rem;\r\n}\r\n\r\n.icon_background {\r\n transform: rotate(15deg);\r\n flex-shrink: 0;\r\n border-radius: var(--rounded-sm);\r\n position: absolute;\r\n}\r\n\r\n.icon_background.sm {\r\n width: 2.05131rem;\r\n height: 2.05131rem;\r\n left: 0.9rem;\r\n bottom: 0.8rem;\r\n}\r\n\r\n.icon_background.md {\r\n width: 2.46156rem;\r\n height: 2.46156rem;\r\n left: 0.7rem;\r\n bottom: 0.5rem;\r\n}\r\n\r\n.icon_background.yellow {\r\n background: var(--color-background-warning, #dc6803);\r\n}\r\n\r\n.icon_background.purple {\r\n background: var(--color-background-purple, #6938ef);\r\n}\r\n\r\n.icon_background.red {\r\n background: var(--color-background-danger, #b51726);\r\n}\r\n\r\n.icon_background.green {\r\n background: var(--color-background-success, #079455);\r\n}\r\n\r\n.icon_background.gray {\r\n background: var(--color-background-gray-bold, #808c9e);\r\n}\r\n\r\n.icon_background.blue {\r\n background: var(--color-background-information, #064e94);\r\n}\r\n\r\n/* Icon Styles */\r\n.icon {\r\n display: flex;\r\n /* padding: 0.09375rem 0.1875rem; */\r\n justify-content: center;\r\n align-items: center;\r\n flex-shrink: 0;\r\n /* aspect-ratio: 1/1; */\r\n}\r\n\r\n.icon.sm svg {\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.icon.md svg {\r\n width: 1.5rem;\r\n height: 1.5rem;\r\n}\r\n\r\n.icon.yellow path[fill] {\r\n fill: var(--color-icon-warning-bold, #93370d);\r\n}\r\n\r\n.icon.yellow path[stroke] {\r\n stroke: var(--color-icon-warning-bold, #93370d);\r\n}\r\n\r\n.icon.purple path[fill] {\r\n fill: var(--color-icon-purple-bold, #4a1fb8);\r\n}\r\n\r\n.icon.purple path[stroke] {\r\n stroke: var(--color-icon-purple-bold, #4a1fb8);\r\n}\r\n\r\n.icon.red path[fill] {\r\n fill: var(--color-icon-danger-bold, #8c121d);\r\n}\r\n\r\n.icon.red path[stroke] {\r\n stroke: var(--color-icon-danger-bold, #8c121d);\r\n}\r\n\r\n.icon.green path[fill] {\r\n fill: var(--color-icon-success-bold, #085d3a);\r\n}\r\n\r\n.icon.green path[stroke] {\r\n stroke: var(--color-icon-success-bold, #085d3a);\r\n}\r\n\r\n.icon.gray path[fill] {\r\n fill: var(--color-icon-bold, #202939);\r\n}\r\n\r\n.icon.gray path[stroke] {\r\n stroke: var(--color-icon-bold, #202939);\r\n}\r\n\r\n.icon.blue path[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.blue path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n/* Circular Filled Styles */\r\n.circular_filled_outer {\r\n display: inline-flex;\r\n padding: var(--spacing-1);\r\n align-items: center;\r\n gap: 0.5rem;\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n.circular_filled_outer.yellow {\r\n background-color: var(--color-background-warning-subtler, #FEF0C7);\r\n}\r\n\r\n.circular_filled_outer.purple {\r\n background-color: var(--color-background-purple-subtler, #EBE9FE);\r\n}\r\n\r\n.circular_filled_outer.red {\r\n background-color: var(--color-background-danger-subtler, #EBE9FE);\r\n}\r\n\r\n.circular_filled_outer.green {\r\n background-color: var(--color-background-success-subtler, #dcfae6);\r\n}\r\n\r\n.circular_filled_outer.gray {\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n}\r\n\r\n.circular_filled_outer.blue {\r\n background-color: var(--color-background-information-subtler, #C8E0F9);\r\n}\r\n\r\n.circular_filled_icon {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 0.5rem;\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n.circular_filled_icon.yellow{\r\n background: var(--color-background-warning-subtle, #FEDF89);\r\n}\r\n\r\n.circular_filled_icon.purple{\r\n background: var(--color-background-purple-subtle, #D9D6FE);\r\n}\r\n\r\n.circular_filled_icon.red{\r\n background: var(--color-background-danger-subtle, #F9B4BA);\r\n}\r\n\r\n.circular_filled_icon.green{\r\n background: var(--color-background-success-subtle, #A9EFC5);\r\n}\r\n\r\n.circular_filled_icon.gray{\r\n background: var(--color-background-gray, #CDD5DF);\r\n}\r\n\r\n.circular_filled_icon.blue{\r\n background: var(--color-background-information-subtle, #9AC7F4);\r\n}\r\n\r\n.circular_filled_icon.sm {\r\n width: 2rem;\r\n height: 2rem;\r\n}\r\n\r\n.circular_filled_icon.md {\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n","import { Component, Prop, State, getAssetPath, h, Fragment } from '@stencil/core';\r\nimport { ColorTypes, GeneralSizes, MetricFeaturedIconTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-metric-featured-icon',\r\n styleUrl: 'gb-metric-featured-icon.css',\r\n shadow: true,\r\n})\r\nexport class GbMetricFeaturedIcon {\r\n @Prop() size: GeneralSizes;\r\n @Prop() color: ColorTypes;\r\n @Prop() featuredIconStyle: MetricFeaturedIconTypes;\r\n @Prop() icon: string;\r\n @State() leadingIconSvg: string = '';\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.icon);\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n {this.featuredIconStyle === 'glassmorphism' && (\r\n <div class={`metric_featured_icon_wrapper ${this.size}`}>\r\n <div class={`icon_glass ${this.size}`}>\r\n <div class={`icon ${this.size} ${this.color}`} innerHTML={this.leadingIconSvg}></div>\r\n </div>\r\n <div class={`icon_background ${this.color} ${this.size}`}></div>\r\n </div>\r\n )}\r\n {this.featuredIconStyle === 'circular_filled' && (\r\n <div class={`circular_filled_outer ${this.color} ${this.size}`}>\r\n <div class={`circular_filled_icon icon ${this.size} ${this.color}`} innerHTML={this.leadingIconSvg}></div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n:host{\r\n display: flex;\r\n align-items: center;\r\n height: 100%;\r\n}\r\n\r\ndiv {\r\n display: inline-flex;\r\n align-items: flex-start;\r\n}","import { Component, h, Prop, State } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'gb-password-button',\r\n styleUrl: 'gb-password-button.css',\r\n shadow: true\r\n})\r\nexport class GbPasswordButton {\r\n @State() isPasswordVisible: boolean = false;\r\n @Prop() state: 'default' | 'disabled';\r\n\r\n togglePasswordVisibility() {\r\n this.isPasswordVisible = !this.isPasswordVisible;\r\n }\r\n\r\n render() {\r\n return (\r\n <div>\r\n <gb-btn size=\"sm\" hierarchy=\"link_gray\" state=\"default\" onClick={() => this.togglePasswordVisibility()}>\r\n {this.isPasswordVisible ? (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"default\" state={this.state}>\r\n <p>HIDE</p>\r\n </gb-button>\r\n ) : (\r\n <gb-button size=\"sm\" hierarchy=\"tertiary_gray\" icon=\"default\" state={this.state}>\r\n <p>SHOW</p>\r\n </gb-button>\r\n )}\r\n </gb-btn>\r\n </div>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n/* Simple Sidebar Styles */\r\n.simple_sidebar_div{\r\n transition: all 0.3s ease-in-out;\r\n position: relative;\r\n height: 100vh;\r\n}\r\n\r\n.pattern{\r\n position: absolute;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n overflow: hidden;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.simple_sidebar_div .pattern img\r\n.primary_side_menu .pattern img{\r\n width: 100%;\r\n height: auto;\r\n}\r\n\r\n.simple_sidebar_div.expanded{\r\n display: inline-flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n width: 16.75rem;\r\n}\r\n\r\n.simple_sidebar_div.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n width: 5rem;\r\n}\r\n\r\n.nav{\r\n display: flex;\r\n width: 100%;\r\n flex-direction: column;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.sidebar_header.expanded{\r\n display: flex;\r\n padding: var(--spacing-none) var(--spacing-4) var(--spacing-none) var(--spacing-6);\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-top: 1rem;\r\n}\r\n\r\n.sidebar_header.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n margin-top: 1rem;\r\n gap: 1.5rem;\r\n}\r\n\r\n.logo_and_name.expanded{\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n}\r\n\r\n.logo_and_name.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.collapse_button.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.application_name{\r\n display: flex;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.wrapper{\r\n display: flex;\r\n padding: var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: flex-start;\r\n gap: var(--spacing-4);\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n position: relative;\r\n width: 13.75rem;\r\n height: auto;\r\n overflow: hidden;\r\n}\r\n\r\n.application_icon svg{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\n.application_icon.plain_background path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.plain_background path[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.colored_background path[stroke] {\r\n stroke: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_icon.colored_background path[fill] {\r\n fill: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_name_pattern{\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.application_name_pattern img{\r\n width: 100%;\r\n}\r\n\r\n.wrapper{\r\n width: 100%;\r\n}\r\n\r\n.wrapper.colored_background{\r\n border: 1px solid rgba(255, 255, 255, 0.10);\r\n background: rgba(0, 0, 0, 0.10);\r\n}\r\n\r\n.wrapper.plain_background{\r\n background: var(--color-background-gray-subtlest, #F6F8FA);\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n}\r\n\r\n.plain_background_color{\r\n color: var(--color-text-information-bold, #042F59);\r\n}\r\n\r\n.colored_background_color{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n/* Simple Sidebar Category Styles */\r\n.simple_sidebar_div.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.simple_sidebar_div.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n.item{\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n/* Complex Sidebar Styles */\r\n.sidebar_and_nav{\r\n width: fit-content;\r\n transition: all 0.3s ease-in-out;\r\n}\r\n\r\n.complex_sidebar_div{\r\n display: flex;\r\n gap: 0;\r\n width: fit-content;\r\n height: 100vh;\r\n}\r\n\r\n.primary_side_menu{\r\n position: relative;\r\n width: 6rem;\r\n}\r\n\r\n.primary_side_menu.standard{\r\n padding: var(--spacing-4) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu.compact{\r\n padding: var(--spacing-2) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu_container{\r\n width: 100%;\r\n}\r\n\r\n.nav_div{\r\n display: flex;\r\n height: 4.5rem;\r\n padding: 0.5rem var(--spacing-5) 0.5rem var(--spacing-7);\r\n align-items: center;\r\n gap: 1.5rem;\r\n flex: 1 0 0;\r\n border-bottom: 1px solid var(--color-border-subtler, #E3E8EF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.logo_and_button{\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n/* Complex Sidebar Category Styles */\r\n.primary_side_menu.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.primary_side_menu.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n/* Complex Sidebar State Styles */\r\n.secondary_side_menu{\r\n width: fit-content;\r\n}\r\n\r\n.secondary_side_menu.colored_background{\r\n background: var(--color-background-information-subtlest, #E4F0FC);\r\n}\r\n\r\n.secondary_side_menu.plain_background{\r\n background: var(--color-surface, #FFFFFF);\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n}\r\n\r\n.sside_menu{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n height: 100vh;\r\n padding: var(--spacing-4) var(--spacing-none);\r\n}\r\n\r\n.information_header{\r\n display: flex;\r\nalign-items: center;\r\ngap: var(--spacing-2);\r\nalign-self: stretch;\r\n}\r\n\r\n.help_icon.plain_background path[stroke]{\r\n stroke: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.plain_background path[fill]{\r\n fill: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.colored_background path[stroke]{\r\n stroke: var(--base-white, #FFFFFF)\r\n}\r\n\r\n.help_icon.colored_background path[fill]{\r\n fill: var(--base-white, #FFFFFF)\r\n}\r\n\r\n\r\n.need_help.plain_background{\r\n color: var(--color-text-brandDarkBlue, #212C65);\r\n}\r\n\r\n.need_help.colored_background{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.colored_background {\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.plain_background{\r\n color: var(--color-text-bold, #202939);\r\n}\r\n\r\n.phone_no{\r\n width: 100%;\r\n word-wrap: break-word;\r\n}","import { Component, Element, h, Prop, Fragment, State, getAssetPath, Method, Event, EventEmitter } from '@stencil/core';\r\nimport { GeneralBackgroundCategories } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-sidebar',\r\n styleUrl: 'gb-sidebar.css',\r\n shadow: true,\r\n})\r\nexport class GbSidebar {\r\n @Prop({ mutable: true }) state: 'expanded' | 'collapsed' = 'expanded';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() navItemStyle: 'standard' | 'compact';\r\n @Prop() type: 'simple' | 'complex';\r\n @Prop() showSecondCategory: boolean = false;\r\n @Prop() iconInstance: string = '';\r\n @Prop() firstItemIcon: string = '';\r\n @Prop() secondItemIcon: string = '';\r\n @Prop() thirdItemIcon: string = '';\r\n @Prop() fourthItemIcon: string = '';\r\n @Prop() fifthItemIcon: string = '';\r\n @Prop() sixthItemIcon: string = '';\r\n @Prop() seventhItemIcon: string = '';\r\n @Prop() eighthItemIcon: string = '';\r\n @Prop() ninthItemIcon: string = '';\r\n @Prop() tenthItemIcon: string = '';\r\n @Prop() firstItemLabel: string = '';\r\n @Prop() secondItemLabel: string = '';\r\n @Prop() thirdItemLabel: string = '';\r\n @Prop() fourthItemLabel: string = '';\r\n @Prop() fifthItemLabel: string = '';\r\n @Prop() sixthItemLabel: string = '';\r\n @Prop() seventhItemLabel: string = '';\r\n @Prop() eighthItemLabel: string = '';\r\n @Prop() ninthItemLabel: string = '';\r\n @Prop() tenthItemLabel: string = '';\r\n @Prop() complexSidebarData: any = {\r\n Recruitment: {\r\n icon: 'assets/user-search-01.svg', // Icon class or path for Recruitment\r\n items: [\r\n { label: 'Overview', icon: 'assets/star.svg' },\r\n { label: 'My Profile', icon: 'assets/star.svg' },\r\n { label: 'Appraisal', icon: 'assets/star.svg' },\r\n { label: 'Staff Management', icon: 'assets/star.svg' },\r\n { label: 'Leave Management', icon: 'assets/star.svg' },\r\n { label: 'Resignation Portal', icon: 'assets/star.svg' },\r\n ],\r\n },\r\n Staff: {\r\n icon: 'assets/user-account.svg',\r\n items: [\r\n { label: 'Staff Overview', icon: 'assets/star.svg' },\r\n { label: 'Payroll Management', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'Attendance', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'New', icon: 'assets/dashboard-square-03.svg' },\r\n ],\r\n },\r\n };\r\n @Prop({ mutable: true }) activeIndex: number;\r\n @Prop({ mutable: true }) activePrimaryItem: string = 'Staff';\r\n @Prop({ mutable: true }) activeSecondaryItem: string = 'Attendance Tracking';\r\n @Prop() hasInfo: boolean = false;\r\n @Prop() email: string = '';\r\n @Prop() phoneNumber: string = '';\r\n @Prop() theme: 'system' | 'light' | 'dark' = 'system';\r\n @State() isDarkTheme: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @Event() simpleSidebarItemClicked: EventEmitter<number>;\r\n @Event() secondaryItemClicked: EventEmitter<number>;\r\n @Event() primaryItemClicked: EventEmitter<{ primary: number; secondary: number }>;\r\n @Event() sidebarState: EventEmitter<string>;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n collapseSideBar() {\r\n if (this.state === 'expanded') {\r\n this.state = 'collapsed';\r\n }\r\n this.sidebarState.emit('collapsed');\r\n }\r\n\r\n expandSideBar() {\r\n if (this.state === 'collapsed') {\r\n this.state = 'expanded';\r\n }\r\n this.sidebarState.emit('expanded');\r\n }\r\n\r\n @Method()\r\n async sideBarItemClicked(index: number) {\r\n this.activeIndex = index;\r\n // console.log(index);\r\n this.simpleSidebarItemClicked.emit(index);\r\n }\r\n\r\n handlePrimaryClick(item: string, _index: number) {\r\n this.activePrimaryItem = item;\r\n this.activeSecondaryItem = this.complexSidebarData[item].items[0].label; // Reset to the first secondary item\r\n // console.log(index)\r\n }\r\n\r\n handleSecondaryClick(item: string, _index: number) {\r\n this.activeSecondaryItem = item;\r\n // console.log(index);\r\n }\r\n\r\n componentDidLoad() {\r\n const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n if (applicationName) {\r\n applicationName.classList.add('text-lg-bold');\r\n applicationName.classList.add('application_name');\r\n }\r\n }\r\n\r\n changeTheme() {\r\n if (this.theme === 'system') {\r\n if(window.matchMedia('(prefers-color-scheme: dark)').matches) {\r\n this.isDarkTheme = true;\r\n } else {\r\n this.isDarkTheme = false;\r\n }\r\n } else if (this.theme === 'light') {\r\n this.isDarkTheme = false;\r\n } else if (this.theme === 'dark') {\r\n this.isDarkTheme = true;\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconInstance);\r\n\r\n this.changeTheme();\r\n }\r\n\r\n render() {\r\n const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';\r\n const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);\r\n const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.type === 'simple' && (\r\n <div class={`simple_sidebar_div ${this.state} ${this.category}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"nav\">\r\n <div class={`sidebar_header ${this.state}`}>\r\n <div class={`logo_and_name ${this.state}`}>\r\n {this.state === 'expanded' && (\r\n <>\r\n {this.category === 'plain_background' && this.isDarkTheme ? (\r\n <img src={whiteLogoSrc} />\r\n ) : this.category === 'plain_background' && !this.isDarkTheme ? (\r\n <img src={blueLogoSrc} />\r\n ) : (\r\n <img src={whiteLogoSrc} />\r\n )}\r\n </>\r\n )}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n </div>\r\n <div class={`collapse_button ${this.state}`}>\r\n <gb-collapse-button\r\n color={this.category === 'plain_background' ? 'gray' : 'white'}\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 0 ? 'active' : 'default'}\r\n icon={this.firstItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(0)}\r\n label={this.firstItemLabel}\r\n ></gb-simple-side-bar-item>\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 1 ? 'active' : 'default'}\r\n icon={this.secondItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(1)}\r\n label={this.secondItemLabel}\r\n ></gb-simple-side-bar-item>\r\n {this.thirdItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 2 ? 'active' : 'default'}\r\n icon={this.thirdItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(2)}\r\n label={this.thirdItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fourthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 3 ? 'active' : 'default'}\r\n icon={this.fourthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(3)}\r\n label={this.fourthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fifthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 4 ? 'active' : 'default'}\r\n icon={this.fifthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(4)}\r\n label={this.fifthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n {this.showSecondCategory && (\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n {this.sixthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 5 ? 'active' : 'default'}\r\n icon={this.sixthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(5)}\r\n label={this.sixthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.seventhItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 6 ? 'active' : 'default'}\r\n icon={this.seventhItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(6)}\r\n label={this.seventhItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.eighthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 7 ? 'active' : 'default'}\r\n icon={this.eighthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(7)}\r\n label={this.eighthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.ninthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 8 ? 'active' : 'default'}\r\n icon={this.ninthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(8)}\r\n label={this.ninthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.tenthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 9 ? 'active' : 'default'}\r\n icon={this.tenthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(9)}\r\n label={this.tenthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n {this.state === 'expanded' && (\r\n <div class=\"application_name\">\r\n <div class={`wrapper ${this.category}`}>\r\n {this.category === 'plain_background' && (\r\n <div class=\"application_name_pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n {this.hasInfo ? (\r\n <>\r\n <div class=\"information_header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`help_icon ${this.category}`}>\r\n <path\r\n opacity=\"0.4\"\r\n d=\"M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n <path\r\n d=\"M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n </svg>\r\n <p class={`need_help ${this.category} text-lg-bold`}>Need help?</p>\r\n </div>\r\n {/* <p class={`info ${this.category} text-sm-medium`}>Info@globusbank.com</p> */}\r\n {/* <p class={`info ${this.category} text-sm-medium`}>(+234) 123 4324 122</p> */}\r\n <p class={`info phone_no ${this.category} text-sm-medium`}>{this.email}</p>\r\n {this.phoneNumber && <p class={`info ${this.category} text-sm-medium`}>{this.phoneNumber}</p>}\r\n </>\r\n ) : (\r\n <>\r\n <div class={`application_icon ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n <span class={textClass}>\r\n <slot name=\"application_name\"></slot>\r\n </span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'complex' && (\r\n <div class={`sidebar_and_nav ${this.state}`}>\r\n <div class=\"nav_div\">\r\n <div class=\"logo_and_button\">\r\n {this.state === 'expanded' && <img src={blueLogoSrc} />}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n <gb-collapse-button\r\n color=\"gray\"\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"complex_sidebar_div\">\r\n <div class={`primary_side_menu ${this.category} ${this.navItemStyle}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"primary_side_menu_container\">\r\n {Object.keys(this.complexSidebarData).map((primaryItem, index) => (\r\n <gb-complex-primary-side-bar-item\r\n key={`${index}`} // Unique key\r\n label={primaryItem}\r\n category={this.category}\r\n item-style={this.navItemStyle}\r\n icon={this.complexSidebarData[primaryItem].icon}\r\n state={this.activePrimaryItem === primaryItem ? 'active' : 'default'}\r\n onClick={() => this.handlePrimaryClick(primaryItem, index)}\r\n ></gb-complex-primary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n <div class={`secondary_side_menu ${this.category} ${this.state}`}>\r\n <div class=\"sside_menu\">\r\n {this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (\r\n <gb-complex-secondary-side-bar-item\r\n key={`${this.activePrimaryItem}-${index}`} // Unique key\r\n type={this.state === 'expanded' ? 'full_with_label' : 'icon_only'}\r\n label={secondaryItem.label}\r\n category={this.category}\r\n icon={secondaryItem.icon}\r\n state={this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default'}\r\n onClick={() => this.handleSecondaryClick(secondaryItem.label, index)}\r\n ></gb-complex-secondary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\n:host {\r\n position: relative;\r\n}\r\n\r\n.side_bar_item_container {\r\n padding: 0 var(--spacing-4);\r\n}\r\n\r\n.nav_item_base.icon_only {\r\n width: fit-content;\r\n}\r\n\r\n.nav_item_base {\r\n display: flex;\r\n padding: var(--spacing-2) var(--spacing-3);\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 0.5rem;\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n cursor: pointer;\r\n position: relative;\r\n flex-grow: 1;\r\n}\r\n\r\n.content {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.75rem;\r\n flex-grow: 1;\r\n max-width: 100%;\r\n}\r\n\r\n.bar {\r\n position: absolute;\r\n left: 0rem;\r\n width: 0.25rem;\r\n height: 1.25rem;\r\n}\r\n\r\n.bar.plain_background {\r\n border-radius: var(--rounded-full);\r\n background: var(--color-border-brandRed, #E21B2E);\r\n}\r\n\r\n.bar.colored_background {\r\n border-radius: var(--rounded-full);\r\n background: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.icon {\r\n display: flex;\r\n align-items: center;\r\n width: 1.5rem;\r\n height: 1.5rem;\r\n}\r\n\r\n.label_text {\r\n max-width: 100%;\r\n overflow-x: hidden;\r\n overflow-y: none;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n scrollbar-width: none;\r\n}\r\n\r\n.label_text::-webkit-scrollbar {\r\n display: none;\r\n}\r\n\r\n/* State and Category Styles */\r\n.nav_item_base.plain_background.default,\r\n.nav_item_base.colored_background.default {\r\n background: transparent;\r\n}\r\n\r\n.nav_item_base.plain_background.active {\r\n background: var(--color-background-information-subtler, #c8e0f9);\r\n}\r\n\r\n.nav_item_base.default.plain_background:hover {\r\n background: var(--color-background-gray-subtler, #eef2f6);\r\n}\r\n\r\n.nav_item_base.colored_background.active {\r\n background: var(--blue-800, #042f59);\r\n}\r\n\r\n.nav_item_base.default.colored_background:hover {\r\n background: rgba(33, 44, 101, 0.4);\r\n}\r\n\r\n.label_text.plain_background.default {\r\n color: var(--color-text, #4b5565);\r\n}\r\n\r\n.label_text.plain_background.active {\r\n color: var(--color-text-information-bold, #042f59);\r\n}\r\n\r\n.label_text.colored_background {\r\n color: var(--base-white, #ffffff);\r\n}\r\n\r\n/* Icon Color Styles */\r\n.icon.plain_background.default path[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.default path[fill] {\r\n fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.default path#Icon[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.default path#Icon[fill] {\r\n fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[stroke] {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[stroke] {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.default circle[stroke] {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active circle[fill] {\r\n fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.colored_background.default path[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.default path[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background path#Icon[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background path#Icon[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background circle[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background circle[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active circle[stroke] {\r\n stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active circle[fill] {\r\n fill: var(--base-white, #ffffff);\r\n}\r\n\r\n/* .icon.plain_background.default path[fill],\r\n.icon.colored_background.default path[fill],\r\n.icon.plain_background.default circle[fill],\r\n.icon.colored_background.default circle[fill] {\r\n fill: transparent;\r\n} */\r\n\r\n.icon.plain_background.default path.has_opacity,\r\n.icon.plain_background.default g.has_opacity,\r\n.icon.plain_background.default circle.has_opacity,\r\n.icon.colored_background.default path.has_opacity,\r\n.icon.colored_background.default g.has_opacity,\r\n.icon.colored_background.default circle.has_opacity {\r\n opacity: 0;\r\n}\r\n\r\n.icon.plain_background.active path.has_opacity,\r\n.icon.plain_background.active g.has_opacity,\r\n.icon.plain_background.active circle.has_opacity,\r\n.icon.colored_background.active path.has_opacity,\r\n.icon.colored_background.active g.has_opacity,\r\n.icon.colored_background.active circle.has_opacity {\r\n opacity: 0.5;\r\n}\r\n\r\n/* .icon.plain_background.default path[fill].has_opacity,\r\n.icon.plain_background.default g.has_opacity,\r\n.icon.colored_background.default path[fill].has_opacity,\r\n.icon.colored_background.default g.has_opacity{\r\n fill: transparent;\r\n} */\r\n\r\n/* Arrow Color Styles */\r\n.arrow.default.plain_background path {\r\n stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.arrow.active.plain_background path {\r\n stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.arrow.default.colored_background path {\r\n stroke: var(--color-icon-inverse, #ffffff);\r\n}\r\n\r\n.arrow.active.colored_background path {\r\n stroke: var(--color-icon-inverse, #ffffff);\r\n}\r\n\r\n.tooltip {\r\n position: absolute;\r\n top: 0.2rem;\r\n left: 4.3rem;\r\n}\r\n","import { Component, h, Prop, Fragment, getAssetPath, State, Event, EventEmitter, Element, Watch } from \"@stencil/core\";\r\nimport { GeneralBackgroundCategories } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-simple-side-bar-item',\r\n styleUrl: 'gb-simple-side-bar-item.css',\r\n shadow: true,\r\n})\r\nexport class GbSimpleSideBarItem {\r\n @Prop() state: 'default' | 'active';\r\n @Prop() type: 'full_with_label' | 'icon_only';\r\n @Prop() label: string = '';\r\n @Prop() icon: string = '';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() showArrow: boolean = false;\r\n @Prop() showBadge: boolean = false;\r\n @Prop({ mutable: true }) showTooltip: boolean = false;\r\n @State() leadingIconSvg: string = '';\r\n @State() internalIcon: string = '';\r\n @Event() sideBarItemClicked: EventEmitter<void>;\r\n @Element() el: HTMLElement;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n\r\n const parser = new DOMParser();\r\n const svgDoc = parser.parseFromString(svg, 'image/svg+xml');\r\n const svgElement = svgDoc.documentElement;\r\n\r\n // Add `has-opacity` class to all elements that have an opacity attribute\r\n const elementsWithOpacity = svgElement.querySelectorAll('[opacity]');\r\n elementsWithOpacity.forEach(el => {\r\n el.classList.add('has_opacity');\r\n });\r\n\r\n const gWithOpacity = svgElement.querySelectorAll('g[opacity]');\r\n\r\n gWithOpacity.forEach(g => {\r\n g.classList.add('has_opacity');\r\n });\r\n\r\n // Serialize and store\r\n const modifiedSvg = svgElement.outerHTML;\r\n // console.log(modifiedSvg)\r\n this.leadingIconSvg = modifiedSvg;\r\n }\r\n\r\n @Watch('icon')\r\n updateSidebarIcon(newValue: string, _oldValue: string) {\r\n this.internalIcon = newValue;\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.icon);\r\n\r\n this.internalIcon = this.icon;\r\n }\r\n\r\n onSideBarItemClicked() {\r\n this.sideBarItemClicked.emit();\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={`side_bar_item_container`} onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n <div class={`nav_item_base ${this.state} ${this.type} ${this.category}`}>\r\n {this.state === 'active' && <div class={`bar ${this.category}`}></div>}\r\n <div class=\"content\">\r\n <div class={`icon ${this.state} ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n {this.type === 'full_with_label' && (\r\n <p class={`label_text ${this.category} ${this.state} ${this.state === 'active' ? 'text-md-semi-bold' : 'text-md-medium'}`}>{this.label}</p>\r\n )}\r\n </div>\r\n {this.type === 'full_with_label' && (\r\n <>\r\n {this.showBadge && (\r\n <gb-badge size=\"sm\" type=\"pill_outline\" color={this.state === 'active' ? 'information' : 'gray'}>\r\n <p>10</p>\r\n </gb-badge>\r\n )}\r\n {this.showArrow && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class={`arrow ${this.state} ${this.category}`}>\r\n <path\r\n d=\"M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12\"\r\n stroke=\"#212C65\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n )}\r\n </>\r\n )}\r\n </div>\r\n {this.type === 'icon_only' && this.showTooltip && (\r\n <gb-tooltip show-arrow={true} arrow=\"left\" class=\"tooltip\">\r\n <p slot=\"label\">{this.label}</p>\r\n </gb-tooltip>\r\n )}\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.online_icon{\r\n border: 1.5px solid var(--color-boarder-inverse, #FFFFFF);\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n/* Online Indicator States */\r\n.online_icon.offline{\r\n background-color: var(--color-background-gray, #CDD5DF);\r\n}\r\n\r\n.online_icon.online{\r\n background-color: var(--color-icon-success, #079455);\r\n}\r\n\r\n/* Online Indicator Sizes */\r\n.online_icon.xxs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.online_icon.xs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.online_icon.sm{\r\n width: var(--spacing-2);\r\n height: var(--spacing-2);\r\n}\r\n\r\n.online_icon.md{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.online_icon.lg{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.online_icon.xl{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.online_icon.xl2{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n/* Verified Tick Sizes */\r\n.verified.xxs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.verified.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.verified.sm{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.verified.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.verified.lg{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n.verified.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.verified.xl2{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n.verified.xl3{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.verified.xl4{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n}\r\n\r\n.verified.profile_sm{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n position: absolute;\r\n bottom: 0.15rem;\r\n right: 0.01rem;\r\n}\r\n\r\n.verified.profile_md{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n position: absolute;\r\n bottom: 0.25rem;\r\n right: 0.2rem;\r\n}\r\n\r\n.verified.profile_lg{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n position: absolute;\r\n bottom: 0.5rem;\r\n right: 0.2rem;\r\n}\r\n\r\n/* Company Icon Sizes */\r\n.company.xs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.company.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.company.sm{\r\n width: 0.75rem;\r\n height: var(--spacing-3);\r\n}\r\n\r\n.company.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.company.lg{\r\n width: 1rem;\r\n height: var(--spacing-4);\r\n}\r\n\r\n.company.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.company.xl2{\r\n width: 1.25rem;\r\n height: var(--spacing-5);\r\n}","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { GeneralSizes, OnlineIndicatorStates } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-status-indicator',\r\n styleUrl: 'gb-status-indicator.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbStatusIndicator {\r\n @Prop() statusIcon: string = '';\r\n @Prop() size: GeneralSizes;\r\n @Prop() state: OnlineIndicatorStates = OnlineIndicatorStates.Offline;\r\n @Prop() indicatorStateClass: string = this.state;\r\n\r\n render() {\r\n return [\r\n <div>\r\n {this.statusIcon === 'online_indicator' && <div class={`online_icon ${this.size} ${this.indicatorStateClass}`}></div>}\r\n {this.statusIcon === 'verified' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" class={`verified ${this.size}`}>\r\n <g clip-path=\"url(#clip0_0_21453)\">\r\n <path\r\n d=\"M24.7109 5.66715C25.0148 6.40217 25.5982 6.98642 26.3328 7.29145L28.9086 8.35837C29.6436 8.66285 30.2277 9.24688 30.5321 9.98196C30.8366 10.717 30.8366 11.543 30.5321 12.2781L29.466 14.852C29.1614 15.5874 29.1609 16.4142 29.467 17.1492L30.5313 19.7224C30.6822 20.0865 30.7599 20.4767 30.76 20.8708C30.7601 21.265 30.6825 21.6553 30.5316 22.0194C30.3808 22.3835 30.1597 22.7143 29.881 22.993C29.6022 23.2716 29.2713 23.4926 28.9072 23.6433L26.3332 24.7095C25.5982 25.0134 25.0139 25.5968 24.7089 26.3314L23.642 28.9071C23.3375 29.6422 22.7535 30.2262 22.0184 30.5307C21.2833 30.8352 20.4574 30.8352 19.7223 30.5307L17.1484 29.4646C16.4133 29.1608 15.5876 29.1614 14.853 29.4663L12.2772 30.5317C11.5425 30.8355 10.7173 30.8352 9.98284 30.531C9.24835 30.2267 8.66466 29.6434 8.35997 28.9091L7.29273 26.3326C6.98881 25.5975 6.40543 25.0133 5.67087 24.7083L3.09509 23.6413C2.36033 23.337 1.77648 22.7533 1.47188 22.0187C1.16729 21.284 1.16688 20.4585 1.47073 19.7235L2.53689 17.1496C2.84062 16.4145 2.84 15.5888 2.53517 14.8542L1.47054 12.2766C1.3196 11.9125 1.24188 11.5222 1.24181 11.1281C1.24175 10.734 1.31935 10.3437 1.47017 9.97956C1.621 9.61544 1.8421 9.2846 2.12083 9.00595C2.39957 8.72731 2.73047 8.50632 3.09465 8.35561L5.66858 7.28945C6.40297 6.98579 6.98687 6.40316 7.29212 5.66944L8.35904 3.09366C8.66352 2.35857 9.24754 1.77455 9.98263 1.47007C10.7177 1.16559 11.5436 1.16559 12.2787 1.47007L14.8527 2.53623C15.5878 2.83996 16.4134 2.83934 17.148 2.5345L19.7249 1.47172C20.4599 1.16741 21.2856 1.16748 22.0206 1.4719C22.7555 1.77632 23.3395 2.36017 23.644 3.09507L24.7112 5.67161L24.7109 5.66715Z\"\r\n fill=\"#0086C9\"\r\n />\r\n <path d=\"M10 18.1818C10 18.1818 11.2857 18.1818 13 22C13 22 17.7647 12 22 10\" stroke=\"white\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_0_21453\">\r\n <rect width=\"32\" height=\"32\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n )}\r\n {this.statusIcon === 'company' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`company ${this.size}`}>\r\n <path\r\n d=\"M18.8322 3.70039C16.9123 2.11995 14.5039 1.25399 12.0172 1.25001C10.6041 1.24776 9.20439 1.52413 7.89818 2.06333C6.59198 2.60252 5.4049 3.39397 4.40485 4.39237C2.64504 6.1493 1.54876 8.462 1.30275 10.9365C1.05674 13.411 1.67622 15.8943 3.05566 17.9633C4.43511 20.0323 6.48919 21.5591 8.86802 22.2836C11.2469 23.0081 13.8033 22.8855 16.1019 21.9367C18.4004 20.9878 20.299 19.2715 21.474 17.0799C22.6491 14.8884 23.0281 12.3572 22.5464 9.91759C22.0647 7.47798 20.7521 5.28082 18.8322 3.70039Z\"\r\n fill=\"#FF0033\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12.8942 13.7488V11.865L15.2835 11.8807C15.5231 11.8822 15.7598 11.9336 15.9785 12.0314C16.1973 12.1293 16.3933 12.2715 16.5541 12.449C16.715 12.6266 16.8373 12.8357 16.9131 13.063C16.989 13.2903 17.0168 13.5308 16.9948 13.7694C16.9948 16.4275 12.901 16.9969 12.8973 13.7488M12.8973 8.75316C17.3054 6.44066 17.6942 11.5213 15.0323 11.2788H12.886L12.8973 8.75316ZM16.7385 11.5113C19.8985 10.3013 17.2573 5.5894 12.0854 8.5044C11.5544 8.07132 10.9218 7.78073 10.2473 7.66004C8.96979 7.40066 7.25604 7.62628 6.29479 8.52378L6.75917 8.97941C7.2569 8.55053 7.86627 8.27194 8.51626 8.17611C9.16625 8.08028 9.83009 8.17117 10.4304 8.43816C10.6321 8.53335 10.8098 8.67262 10.9505 8.8457C11.0911 9.01879 11.191 9.22127 11.2429 9.43817L11.266 13.7669C11.0785 16.7738 7.20354 16.5413 7.20354 13.7669V11.8682H10.2492V11.295H5.59729V13.1644C5.60917 16.7175 9.93104 17.315 12.0717 15.5863C12.9471 16.2353 14.0184 16.5649 15.1073 16.52C18.9442 16.4938 19.7323 12.3563 16.7273 11.5144L16.7385 11.5113Z\"\r\n fill=\"white\"\r\n />\r\n </svg>\r\n )}\r\n </div>,\r\n ];\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host{\r\n display: flex;\r\n align-items: center;\r\n width: fit-content;\r\n}\r\n\r\n.container {\r\n display: inline-flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n flex-shrink: 0;\r\n border-radius: var(--rounded-xs);\r\n border: 1px solid var(--color-boarder-subtle, #CDD5DF);\r\n background: var(--color-background-card, #FFFFFF); \r\n}\r\n\r\n.content {\r\n display: flex;\r\n padding: var(--spacing-none);\r\n text-align: center;\r\n align-items: center;\r\n border-radius: var(--rounded-none);\r\n color: var(--color-text, #4B5565);\r\n font-family: var(--Font-Family-Body, Sora);\r\n font-style: normal;\r\n font-weight: var(--Font-Weight-Medium, 500);\r\n letter-spacing: var(--Font-Letter-spacing-T-sm, 0rem);\r\n}\r\n\r\n.icon {\r\n border: none;\r\n}\r\n\r\n.container.sm {\r\n height: var(--spacing-6);\r\n padding: var(--spacing-none) var(--spacing-1) var(--spacing-none) var(--spacing-2);\r\n}\r\n\r\n.container.md {\r\n height: 1.75rem;\r\n padding: var(--spacing-none) var(--spacing-1) var(--spacing-none) var(--spacing-2);\r\n}\r\n\r\n.container.lg {\r\n height: var(--spacing-7);\r\n padding: var(--spacing-none) var(--spacing-1) var(--spacing-none) var(--spacing-2);\r\n}\r\n\r\n.content.sm {\r\n gap: var(--spacing-1);\r\n font-size: var(--Font-Size-T-xs, 0.75rem);\r\n line-height: var(--Font-Line-height-T-xs, 1.125rem);\r\n}\r\n\r\n.content.md {\r\n gap: 0.3125rem;\r\n font-size: var(--Font-Size-T-sm, 0.875rem); \r\n line-height: var(--Font-Line-height-T-sm, 1.25rem); \r\n}\r\n\r\n.content.lg {\r\n gap: 0.375rem;\r\n font-size: var(--Font-Size-T-sm, 0.875rem);\r\n line-height: var(--Font-Line-height-T-sm, 1.25rem); /* 142.857% */\r\n}\r\n\r\n.label{\r\n display: flex;\r\n align-items: center;\r\n}","import { Component, Method, Prop, getAssetPath, h, Fragment, Event, EventEmitter, Element } from '@stencil/core';\r\nimport { GeneralSizes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-tag',\r\n styleUrl: 'gb-tag.css',\r\n shadow: true,\r\n})\r\nexport class GbTag {\r\n @Prop() size: GeneralSizes;\r\n @Prop() icon?: 'country' | 'avatar' | 'dot' | 'false';\r\n @Prop() action: 'X_close' | 'text_only' | 'count';\r\n @Prop() flagSwap: string;\r\n @Prop() checkbox?: boolean;\r\n @Event() checkboxClicked: EventEmitter<void>;\r\n @Element() el: HTMLElement;\r\n\r\n @Method()\r\n async onTagClose() {\r\n // console.log('close tag clicked');\r\n }\r\n\r\n async onCheckboxClicked() {\r\n // this.checkboxClicked.emit()\r\n }\r\n\r\n componentDidLoad() {\r\n const labelSlot = this.el.querySelector('p');\r\n\r\n if(labelSlot) {\r\n if(this.size === 'sm') {\r\n labelSlot.classList.add('text-xs-medium');\r\n } else if(this.size === 'md') {\r\n labelSlot.classList.add('text-sm-medium');\r\n } else if(this.size === 'lg') {\r\n labelSlot.classList.add('text-sm-medium');\r\n }\r\n }\r\n }\r\n\r\n render() {\r\n const flagSwap = getAssetPath(`${this.flagSwap}`);\r\n\r\n return (\r\n <div class={`container ${this.size}`}>\r\n <div class={`content ${this.size}`}>\r\n {this.checkbox && <gb-tag-checkbox size={this.size}></gb-tag-checkbox>}\r\n {this.icon === 'false' && <></>}\r\n {this.icon === 'country' && (\r\n <div class=\"icon left-icon\">\r\n <img src={flagSwap} alt=\"Country Icon\" />\r\n </div>\r\n )}\r\n {this.icon === 'avatar' && (\r\n <gb-avatar class=\"avatar-icon\" size=\"xxs\" status-icon=\"false\" text={true} color=\"gray\">\r\n <slot name=\"initials\" slot=\"initials\"></slot>\r\n </gb-avatar>\r\n )}\r\n {this.icon === 'dot' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#17B26A\" />\r\n </svg>\r\n )}\r\n <div class=\"label\">\r\n <slot></slot>\r\n </div>\r\n {this.action === 'count' && (\r\n <gb-tag-count size={this.size}>\r\n <slot slot=\"count\" name=\"count\"></slot>\r\n </gb-tag-count>\r\n )}\r\n </div>\r\n {this.action === 'X_close' && <gb-tag-close size={this.size} onClick={() => this.onTagClose()}></gb-tag-close>}\r\n </div>\r\n );\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n.checkbox-container {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n cursor: pointer;\r\n}\r\n\r\ninput[type=\"checkbox\"] {\r\n opacity: 0;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n cursor: pointer;\r\n}\r\n\r\n.custom-checkbox {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: var(--rounded-xs);\r\n border: 1px solid var(--color-border-input, #CDD5DF);\r\n background: transparent;\r\n transition: background 0.2s, border 0.2s;\r\n margin-top: 10px;\r\n}\r\n\r\n.sm {\r\n width: 14px;\r\n height: 14px;\r\n}\r\n\r\n.md {\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n flex-shrink: 0;\r\n}\r\n\r\n.lg {\r\n width: 18px;\r\n height: 18px;\r\n}\r\n\r\ninput[type=\"checkbox\"]:checked + .custom-checkbox {\r\n background: var(--color-background-selected, #075DB2);\r\n border: 1px solid var(--color-border-selected, #075DB2);\r\n}\r\n\r\ninput[type=\"checkbox\"]:checked + .custom-checkbox .checkmark {\r\n display: block;\r\n}\r\n\r\n.checkmark {\r\n display: none;\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.checkbox-container:hover .custom-checkbox {\r\n border: 1px solid var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.checkbox-container.disabled .custom-checkbox {\r\n background: var(--color-background-disabled, #F6F8FA);\r\n border: 1px solid var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\n.checkbox-container.disabled .checkmark {\r\n fill: var(--color-icon-disabled, #CDD5DF);\r\n}\r\n\r\n","import { Component, Prop, h} from \"@stencil/core\";\r\nimport { GeneralSizes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-tag-checkbox',\r\n styleUrl: 'gb-tag-checkbox.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbTagCheckbox {\r\n @Prop() checked: boolean = false;\r\n @Prop() size: GeneralSizes = 'md';\r\n @Prop() disabled: boolean = false;\r\n \r\n render() {\r\n return (\r\n <label class={`checkbox-container ${this.size} ${this.disabled ? 'disabled' : ''}`}>\r\n <input \r\n type=\"checkbox\" \r\n checked={this.checked} \r\n disabled={this.disabled} \r\n />\r\n <span class={`custom-checkbox ${this.size}`}>\r\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M2.5 7.25C2.5 7.25 3.25 7.25 4.25 9C4.25 9 7.02941 4.41667 9.5 3.5\" stroke=\"white\" stroke-width=\"1.71429\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n </label>\r\n );\r\n }\r\n}\r\n","@import './../../global/global.css';\r\n\r\ndiv {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: var(--spacing-none);\r\n border-radius: 3px;\r\n cursor: pointer;\r\n}\r\n\r\ndiv:hover {\r\n background: var(--color-background-gray-subtlest, #F6F8FA);\r\n}\r\n\r\ndiv:hover svg path {\r\n stroke: var(--color-icon-bold, #202939);\r\n}\r\n\r\ndiv.sm,\r\ndiv.md {\r\n padding: var(--spacing-half);\r\n}\r\n\r\ndiv.lg {\r\n padding: 3px;\r\n}\r\n\r\ndiv.sm svg{\r\n width: 10px;\r\n height: 10px;\r\n}\r\n\r\ndiv.md svg{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\ndiv.lg svg{\r\n width: 14px;\r\n height: 14px;\r\n}","import {Component, Prop, h} from '@stencil/core'\r\nimport { GeneralSizes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-tag-close',\r\n styleUrl: 'gb-tag-close.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbTagClose{\r\n @Prop() size: GeneralSizes;\r\n\r\n render() {\r\n return (\r\n <div class={this.size}>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\">\r\n <path d=\"M7.91683 2.08328L2.0835 7.91662M2.0835 2.08328L7.91683 7.91662\" stroke=\"#4B5565\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n )\r\n }\r\n}","@import './../../global/global.css';\r\n\r\ndiv {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--spacing-none);\r\n flex-shrink: 0;\r\n border-radius: 3px;\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n} \r\n\r\ndiv.sm {\r\n width: 16px;\r\n height: 16px;\r\n padding: var(--spacing-none) var(--spacing-1);\r\n}\r\n\r\n.sm p{\r\n width: 8px;\r\n height: 16px; \r\n font-size: var(--Font-Size-T-xs, 0.75rem);\r\n line-height: var(--Font-Line-height-T-xs, 1.125rem);\r\n}\r\n\r\ndiv.md {\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n padding: var(--spacing-none) 5px;\r\n}\r\n\r\n.md p{\r\n width: 0.5625rem;\r\n height: 1.125rem;\r\n font-size: var(--Font-Size-T-xs, 0.75rem);\r\n line-height: var(--Font-Line-height-T-xs, 1.125rem); \r\n}\r\n\r\ndiv.lg {\r\n width: 1.25rem;\r\n height: 1.25rem;\r\n}\r\n\r\n.lg p{\r\n font-size: var(--Font-Size-T-sm, 0.875rem);\r\n line-height: var(--Font-Line-height-T-sm, 1.25rem);\r\n}\r\n\r\np{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n color: var(--color-text, #4B5565);\r\n text-align: center;\r\n font-family: var(--Font-Family-Body, Sora);\r\n font-style: normal;\r\n font-weight: var(--Font-Weight-Medium, 500);\r\n letter-spacing: var(--Font-Letter-spacing-T-sm, 0px);\r\n}\r\n\r\n\r\n","import {Component, Prop, h} from '@stencil/core';\r\nimport { GeneralSizes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-tag-count',\r\n styleUrl: 'gb-tag-count.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbTagCount{\r\n @Prop() size: GeneralSizes;\r\n\r\n render() {\r\n return (\r\n <div class={this.size}>\r\n <slot name=\"count\"></slot>\r\n </div>\r\n )\r\n }\r\n}","@import './../../global/global.css';\r\n\r\n:host{\r\n display: block;\r\n}\r\n\r\n.tooltip_container {\r\n position: relative;\r\n}\r\n \r\n.tooltip {\r\n position: absolute;\r\n background-color: var(--color-surface-bold, #FCFCFC);\r\n border: 0.5px solid var(--color-border-subtler, #E3E8EF);\r\n border-radius: var(--rounded-sm);\r\n box-shadow: var(--shadow-sm);\r\n padding: var(--spacing-3);\r\n z-index: 100;\r\n}\r\n\r\n.tooltip_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n \r\n}\r\n \r\n.arrow {\r\n width: 0;\r\n height: 0;\r\n border-style: solid;\r\n position: absolute;\r\n}\r\n\r\n.arrow::before {\r\n content: '';\r\n position: absolute;\r\n width: 0;\r\n height: 0;\r\n border-style: solid;\r\n}\r\n \r\n.arrow.bottom_center {\r\n top: 100%;\r\n left: 50%;\r\n border-width: 7.5px 7.5px 0 7.5px;\r\n border-color: var(--color-border-subtler, #E3E8EF) transparent transparent transparent;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.arrow.bottom_center::before {\r\n left: -0.39rem;\r\n bottom: 0.1rem;\r\n border-width: 0 9.6px 9.6px 9.6px;\r\n transform: translateY(-50%) rotate(135deg);\r\n border-color: transparent var(--color-surface-bold, #FCFCFC) transparent transparent;\r\n}\r\n \r\n.arrow.left {\r\n top: 50%;\r\n right: 100%;\r\n border-width: 6px 0 6px 6px;\r\n border-color: transparent transparent transparent var(--color-border-subtler, #E3E8EF);\r\n transform: translateY(-50%) rotate(180deg);\r\n}\r\n\r\n.arrow.left::before {\r\n left: -8px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n border-width: 7.5px 0 7.5px 7.5px;\r\n border-color: transparent transparent transparent var(--color-surface-bold, #FCFCFC);\r\n}\r\n\r\n.arrow.bottom_left {\r\n top: 100%;\r\n left: 20%;\r\n border-width: 7.5px 7.5px 0 7.5px;\r\n border-color: var(--color-border-subtler, #E3E8EF) transparent transparent transparent;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.arrow.bottom_left::before {\r\n left: -0.39rem;\r\n bottom: 0.1rem;\r\n border-width: 0 9.6px 9.6px 9.6px;\r\n transform: translateY(-50%) rotate(135deg);\r\n border-color: transparent var(--color-surface-bold, #FCFCFC) transparent transparent;\r\n}\r\n \r\n.arrow.right {\r\n top: 50%;\r\n left: 100%;\r\n border-width: 7px 7px 7px 0;\r\n border-color: transparent var(--color-border-subtler, #E3E8EF) transparent transparent;\r\n transform: translateY(-50%) rotate(-180deg);\r\n}\r\n\r\n.arrow.right::before {\r\n left: 0.5px;\r\n top: 50%;\r\n border-width: 6.5px 6.5px 6.5px 0;\r\n transform: translateY(-50%) rotate(0deg);\r\n border-color: transparent var(--color-surface-bold, #FCFCFC) transparent transparent;\r\n}\r\n\r\n.arrow.bottom_right {\r\n top: 100%;\r\n right: 5%;\r\n border-width: 7.5px 7.5px 0 7.5px;\r\n border-color: var(--color-border-subtler, #E3E8EF) transparent transparent transparent;\r\n transform: translateX(-50%);\r\n}\r\n\r\n.arrow.bottom_right::before {\r\n left: -0.39rem;\r\n bottom: 0.1rem;\r\n border-width: 0 9.6px 9.6px 9.6px;\r\n transform: translateY(-50%) rotate(135deg);\r\n border-color: transparent var(--color-surface-bold, #FCFCFC) transparent transparent;\r\n}\r\n \r\n.arrow.top_center {\r\n bottom: 100%;\r\n right: 45%;\r\n border-width: 0 7.5px 7.5px 7.5px;\r\n border-color: transparent transparent var(--color-border-subtler, #E3E8EF) transparent;\r\n}\r\n\r\n.arrow.top_center::before {\r\n left: -12.8px;\r\n bottom: -20.25px;\r\n border-width: 0 9.5px 9.5px 9.5px;\r\n transform: translateY(-50%) rotate(-45deg);\r\n border-color: transparent var(--color-surface-bold, #FCFCFC) transparent transparent;\r\n}\r\n\r\n::slotted([slot=\"label\"]){\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n::slotted([slot=\"label\"].nowrap){\r\n white-space: nowrap;\r\n}\r\n\r\n::slotted([slot=\"label\"].wrap_label){\r\n white-space: wrap;\r\n max-width: 10rem;\r\n}\r\n\r\n::slotted([slot=\"supporting_text\"]){\r\n white-space: wrap;\r\n color: var(--color-text-subtle, #697586);\r\n margin-top: 5rem;\r\n min-width: fit-content;\r\n max-width: 18.5rem;\r\n}","import { Component, Element, Prop, h } from '@stencil/core';\r\nimport { ArrowPositions } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-tooltip',\r\n styleUrl: 'gb-tooltip.css',\r\n shadow: true,\r\n})\r\nexport class GbTooltip {\r\n @Prop() showArrow: boolean = false;\r\n @Prop() arrow: ArrowPositions = 'bottom_center';\r\n @Prop() showSupportingText: boolean = false;\r\n @Prop() noWrap: boolean = true;\r\n @Element() el: HTMLElement;\r\n\r\n componentDidLoad() {\r\n const mainTextSlot = this.el.querySelector('[slot=\"label\"]');\r\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"]');\r\n\r\n if (mainTextSlot) {\r\n mainTextSlot.classList.add('text-xs-semi-bold');\r\n }\r\n\r\n if (mainTextSlot && this.noWrap) {\r\n mainTextSlot.classList.add('nowrap');\r\n }\r\n\r\n if (mainTextSlot && !this.showSupportingText && !this.noWrap) {\r\n mainTextSlot.classList.add('wrap_label');\r\n }\r\n\r\n if (supportingTextSlot) {\r\n supportingTextSlot.classList.add('text-xs-regular');\r\n }\r\n }\r\n\r\n getArrowClass() {\r\n return this.showArrow ? `arrow ${this.arrow}` : '';\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"tooltip_container\">\r\n <div class=\"tooltip\">\r\n {this.showArrow && <div class={this.getArrowClass()}></div>}\r\n <div class=\"tooltip_content\">\r\n <slot name=\"label\" />\r\n {this.showSupportingText && <slot name=\"supporting_text\" />}\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"mappings":"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","ignoreList":[]}