bromcom-ui 2.12.0-test.1 → 2.12.1-test.0

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 (409) hide show
  1. package/dist/bromcom-ui/bromcom-ui.css +1 -1
  2. package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
  3. package/dist/bromcom-ui/{p-4adb8c83.entry.js → p-0345ed68.entry.js} +1 -1
  4. package/dist/bromcom-ui/p-053dc717.entry.js +5 -0
  5. package/dist/bromcom-ui/{p-fdd5d6bb.entry.js → p-069ae664.entry.js} +1 -1
  6. package/dist/bromcom-ui/{p-fcc6f71e.js → p-0bda558d.js} +1 -1
  7. package/dist/bromcom-ui/p-11a5ae6d.entry.js +5 -0
  8. package/dist/bromcom-ui/{p-3f1e16ee.entry.js → p-193d926a.entry.js} +1 -1
  9. package/dist/bromcom-ui/{p-4d189e27.entry.js → p-1bdfc73a.entry.js} +1 -1
  10. package/dist/bromcom-ui/{p-c821b3bf.entry.js → p-1c7ea00b.entry.js} +1 -1
  11. package/dist/bromcom-ui/{p-ba3c6657.entry.js → p-1c801d0c.entry.js} +1 -1
  12. package/dist/bromcom-ui/{p-df185078.entry.js → p-1c9314bd.entry.js} +1 -1
  13. package/dist/bromcom-ui/{p-1d48da4b.entry.js → p-29c4dc0a.entry.js} +1 -1
  14. package/dist/bromcom-ui/{p-7f1612df.entry.js → p-2aaeb247.entry.js} +1 -1
  15. package/dist/bromcom-ui/p-2d34eb30.entry.js +5 -0
  16. package/dist/bromcom-ui/{p-cd2293b7.js → p-2df6b47d.js} +1 -1
  17. package/dist/bromcom-ui/{p-5c1af163.entry.js → p-2ee89105.entry.js} +1 -1
  18. package/dist/bromcom-ui/p-305b0bc8.entry.js +5 -0
  19. package/dist/bromcom-ui/{p-7bc49347.entry.js → p-313b7bb0.entry.js} +1 -1
  20. package/dist/bromcom-ui/p-3238bf36.js +5 -0
  21. package/dist/bromcom-ui/{p-6b5ed4d8.js → p-35f2e15a.js} +1 -1
  22. package/dist/bromcom-ui/{p-482054dc.js → p-3a60a194.js} +1 -1
  23. package/dist/bromcom-ui/{p-af4a83dc.entry.js → p-3b863650.entry.js} +1 -1
  24. package/dist/bromcom-ui/p-43c578cf.js +5 -0
  25. package/dist/bromcom-ui/{p-816fbffd.js → p-499d8454.js} +1 -1
  26. package/dist/bromcom-ui/{p-3182df7e.js → p-4d2bf0e7.js} +1 -1
  27. package/dist/bromcom-ui/{p-22a0e447.entry.js → p-4f05c6a4.entry.js} +1 -1
  28. package/dist/bromcom-ui/{p-0389b380.js → p-4f6eb6d6.js} +1 -1
  29. package/dist/bromcom-ui/{p-4ebb85f9.js → p-58c0a1f5.js} +1 -1
  30. package/dist/bromcom-ui/{p-91873347.entry.js → p-594a57c3.entry.js} +1 -1
  31. package/dist/bromcom-ui/p-5dea2654.entry.js +5 -0
  32. package/dist/bromcom-ui/{p-3078fcd2.entry.js → p-626b805d.entry.js} +1 -1
  33. package/dist/bromcom-ui/p-64fad38b.js +11 -0
  34. package/dist/bromcom-ui/{p-01416407.entry.js → p-69260d36.entry.js} +1 -1
  35. package/dist/bromcom-ui/p-6e5f5f36.js +1 -1
  36. package/dist/bromcom-ui/{p-8c018ae0.js → p-6f2e4c9b.js} +1 -1
  37. package/dist/bromcom-ui/{p-7e44e6b5.js → p-6f861fed.js} +1 -1
  38. package/dist/bromcom-ui/p-7400e3c3.entry.js +5 -0
  39. package/dist/bromcom-ui/{p-1b2e1320.entry.js → p-79d5c3d8.entry.js} +1 -1
  40. package/dist/bromcom-ui/p-7c223356.entry.js +5 -0
  41. package/dist/bromcom-ui/{p-28f78dd4.entry.js → p-7d18ce0e.entry.js} +1 -1
  42. package/dist/bromcom-ui/{p-e45c1546.js → p-85eedabc.js} +1 -1
  43. package/dist/bromcom-ui/{p-e60832d7.entry.js → p-87d9dff7.entry.js} +1 -1
  44. package/dist/bromcom-ui/{p-be7e5e83.js → p-8e683b32.js} +1 -1
  45. package/dist/bromcom-ui/{p-4680865d.js → p-a2df6c19.js} +1 -1
  46. package/dist/bromcom-ui/{p-3f2cf69e.entry.js → p-a2ed89f0.entry.js} +1 -1
  47. package/dist/bromcom-ui/p-a313fba6.js +1 -1
  48. package/dist/bromcom-ui/{p-3a06c6b1.entry.js → p-ba9eff2a.entry.js} +1 -1
  49. package/dist/bromcom-ui/{p-9ea56166.entry.js → p-bbae06ed.entry.js} +1 -1
  50. package/dist/bromcom-ui/{p-b3fe26a3.entry.js → p-bdc78a44.entry.js} +1 -1
  51. package/dist/bromcom-ui/{p-fe675eea.entry.js → p-c02d4055.entry.js} +1 -1
  52. package/dist/bromcom-ui/{p-965ef00a.entry.js → p-c54aaa8c.entry.js} +1 -1
  53. package/dist/bromcom-ui/p-c99dbd93.entry.js +5 -0
  54. package/dist/bromcom-ui/{p-efd00594.entry.js → p-cebe6c15.entry.js} +1 -1
  55. package/dist/bromcom-ui/p-d1298c40.js +5 -0
  56. package/dist/bromcom-ui/{p-8c3535b6.entry.js → p-d551a51d.entry.js} +1 -1
  57. package/dist/bromcom-ui/{p-fa5ecfb2.entry.js → p-d73d6a2f.entry.js} +1 -1
  58. package/dist/bromcom-ui/{p-350e752d.js → p-daeb868a.js} +1 -1
  59. package/dist/bromcom-ui/{p-74252264.entry.js → p-e82dab5a.entry.js} +1 -1
  60. package/dist/bromcom-ui/{p-055b38fd.entry.js → p-e99cc26b.entry.js} +1 -1
  61. package/dist/bromcom-ui/{p-9f688a29.entry.js → p-ea7368b4.entry.js} +1 -1
  62. package/dist/bromcom-ui/p-ec1fe98f.entry.js +16 -0
  63. package/dist/bromcom-ui/{p-3960cae8.entry.js → p-ece578ef.entry.js} +1 -1
  64. package/dist/bromcom-ui/p-f0e30624.entry.js +5 -0
  65. package/dist/cjs/{bcm-489c9b1a.js → bcm-1d1fcf21.js} +4 -4
  66. package/dist/cjs/bcm-accordion_63.cjs.entry.js +46085 -0
  67. package/dist/cjs/bcm-alert.cjs.entry.js +4 -4
  68. package/dist/cjs/bcm-attendance-actions-comment.cjs.entry.js +8 -8
  69. package/dist/cjs/bcm-attendance-actions-dropdown.cjs.entry.js +8 -8
  70. package/dist/cjs/bcm-breadcrumb.cjs.entry.js +2 -2
  71. package/dist/cjs/bcm-caption.cjs.entry.js +9 -9
  72. package/dist/cjs/bcm-card.cjs.entry.js +5 -5
  73. package/dist/cjs/bcm-chip-group.cjs.entry.js +9 -9
  74. package/dist/cjs/bcm-date-picker.cjs.entry.js +4 -4
  75. package/dist/cjs/bcm-datetime-picker.cjs.entry.js +8 -8
  76. package/dist/cjs/bcm-default.cjs.entry.js +2 -2
  77. package/dist/cjs/bcm-error-layout.cjs.entry.js +1 -1
  78. package/dist/cjs/bcm-form-2.cjs.entry.js +5 -5
  79. package/dist/cjs/bcm-input-2.cjs.entry.js +153 -0
  80. package/dist/cjs/bcm-input-custom.cjs.entry.js +2 -2
  81. package/dist/cjs/bcm-input-dropdown.cjs.entry.js +10 -10
  82. package/dist/cjs/bcm-modal-2-footer.cjs.entry.js +6 -6
  83. package/dist/cjs/bcm-modal-2-header.cjs.entry.js +6 -6
  84. package/dist/cjs/bcm-modal-2.cjs.entry.js +7 -7
  85. package/dist/cjs/bcm-number-input.cjs.entry.js +297 -0
  86. package/dist/cjs/bcm-popover.cjs.entry.js +9 -9
  87. package/dist/cjs/bcm-range.cjs.entry.js +6 -6
  88. package/dist/cjs/bcm-react-number.cjs.entry.js +1230 -0
  89. package/dist/cjs/bcm-skeleton.cjs.entry.js +6 -6
  90. package/dist/cjs/bcm-table.cjs.entry.js +6 -6
  91. package/dist/cjs/bcm-tag.cjs.entry.js +15 -15
  92. package/dist/cjs/bcm-time-picker.cjs.entry.js +4 -4
  93. package/dist/cjs/bcm-toast.cjs.entry.js +11 -11
  94. package/dist/cjs/bromcom-ui.cjs.js +3 -3
  95. package/dist/cjs/{caption-template-086e9cac.js → caption-template-85a18b6d.js} +2 -2
  96. package/dist/cjs/{floating-ui-21890d11.js → floating-ui-5b396838.js} +2 -2
  97. package/dist/cjs/{generate-acac74ce.js → generate-7510539d.js} +1 -1
  98. package/dist/cjs/{global-47ad6c93.js → global-711c589c.js} +1 -1
  99. package/dist/cjs/input.style-b5676e6a.js +122 -0
  100. package/dist/cjs/{label-template-94b3d775.js → label-template-e83447b5.js} +3 -3
  101. package/dist/cjs/loader.cjs.js +3 -3
  102. package/dist/cjs/{number-helper-fb148ed6.js → number-helper-9d2d1d5a.js} +1 -1
  103. package/dist/cjs/old-bcm-popover-box.cjs.entry.js +7 -7
  104. package/dist/cjs/old-bcm-popover.cjs.entry.js +5 -5
  105. package/dist/cjs/{package-c5399090.js → package-a60955f7.js} +1 -1
  106. package/dist/cjs/{popover-placement-e7d6eabd.js → popover-placement-d1aa81f0.js} +1 -1
  107. package/dist/cjs/{slot-template-c8e2816c.js → slot-template-29229e8f.js} +1 -1
  108. package/dist/cjs/{string-helper-f9184277.js → string-helper-1ee6dc21.js} +6 -4
  109. package/dist/cjs/{validators-a7c046d5.js → validators-9369c82a.js} +1 -1
  110. package/dist/collection/components/atoms/avatar/avatar.js +1 -1
  111. package/dist/collection/components/atoms/badge/badge.js +1 -1
  112. package/dist/collection/components/atoms/badge/badge.style.js +1 -1
  113. package/dist/collection/components/atoms/button/button.css +13 -13
  114. package/dist/collection/components/atoms/button/button.js +14 -14
  115. package/dist/collection/components/atoms/chip/chip.css +4 -4
  116. package/dist/collection/components/atoms/chip/chip.js +3 -3
  117. package/dist/collection/components/atoms/link/link.css +9 -3
  118. package/dist/collection/components/molecules/checkbox/group.css +2 -2
  119. package/dist/collection/components/molecules/checkbox/group.js +1 -1
  120. package/dist/collection/components/molecules/color-input/color-input.js +1 -1
  121. package/dist/collection/components/molecules/empty/empty.js +1 -1
  122. package/dist/collection/components/molecules/error-layout/error-layout.js +1 -1
  123. package/dist/collection/components/molecules/expansion-panel/expansion-panel.js +1 -1
  124. package/dist/collection/components/molecules/input/input.js +1 -1
  125. package/dist/collection/components/molecules/input-dropdown/input-dropdown.js +1 -1
  126. package/dist/collection/components/molecules/menu/menu.css +4 -4
  127. package/dist/collection/components/molecules/menu/menu.js +0 -14
  128. package/dist/collection/components/molecules/modal/modal.css +1 -1
  129. package/dist/collection/components/molecules/number-input/react-input.js +1 -1
  130. package/dist/collection/components/molecules/radio/radio-group.js +1 -1
  131. package/dist/collection/components/molecules/radio/radio.js +1 -1
  132. package/dist/collection/components/molecules/range/range.js +1 -1
  133. package/dist/collection/components/molecules/switch/switch.css +2 -2
  134. package/dist/collection/components/molecules/tab-group/tab-group.js +2 -2
  135. package/dist/collection/components/molecules/tab-group/tab-item-header.js +5 -5
  136. package/dist/collection/components/molecules/tooltip/tooltip.js +1 -1
  137. package/dist/collection/components/organism/list/list.css +2 -2
  138. package/dist/collection/components/organism/list/list.js +5 -5
  139. package/dist/collection/components/organism/states/bcm-list2.states.js +14 -2
  140. package/dist/collection/components/other/attendance/attendance.js +1 -1
  141. package/dist/collection/components/other_deprecated/select/select.css +1 -1
  142. package/dist/collection/components/other_deprecated/select/select.js +1 -1
  143. package/dist/collection/components/other_deprecated/tabs/tab.css +15 -15
  144. package/dist/collection/helper/string-helper.js +4 -2
  145. package/dist/collection/stories/ui-library/components/date/argTypes_common.js +1 -0
  146. package/dist/collection/stories/ui-library/components/list/country.js +186 -0
  147. package/dist/collection/templates/button-template.js +1 -1
  148. package/dist/collection/templates/caption-template.js +2 -2
  149. package/dist/collection/templates/input-template.js +1 -1
  150. package/dist/collection/templates/label-template.js +1 -1
  151. package/dist/collection/templates/list-item-template.js +1 -1
  152. package/dist/collection/templates/list-template.js +3 -9
  153. package/dist/components/avatar.js +1 -1
  154. package/dist/components/badge.js +2 -2
  155. package/dist/components/bcm-attendance.js +1 -1
  156. package/dist/components/bcm-checkbox-group.js +2 -2
  157. package/dist/components/bcm-color-input.js +1 -1
  158. package/dist/components/bcm-error-layout.js +1 -1
  159. package/dist/components/bcm-expansion-panel.js +1 -1
  160. package/dist/components/bcm-input-dropdown.js +1 -1
  161. package/dist/components/bcm-modal.js +1 -1
  162. package/dist/components/bcm-radio-group.js +1 -1
  163. package/dist/components/bcm-range.js +1 -1
  164. package/dist/components/bcm-select.js +2 -2
  165. package/dist/components/bcm-switch.js +1 -1
  166. package/dist/components/bcm-tab-group.js +2 -2
  167. package/dist/components/bcm-tab-item-header.js +5 -5
  168. package/dist/components/bcm-tab.js +1 -1
  169. package/dist/components/button.js +16 -16
  170. package/dist/components/caption-template.js +2 -2
  171. package/dist/components/chip.js +4 -4
  172. package/dist/components/empty.js +1 -1
  173. package/dist/components/generate.js +1 -1
  174. package/dist/components/input-template.js +1 -1
  175. package/dist/components/input.js +1 -1
  176. package/dist/components/label.js +1 -1
  177. package/dist/components/link.js +1 -1
  178. package/dist/components/list.js +24 -18
  179. package/dist/components/menu.js +1 -15
  180. package/dist/components/radio.js +1 -1
  181. package/dist/components/string-helper.js +4 -2
  182. package/dist/components/tooltip.js +1 -1
  183. package/dist/esm/{_commonjsHelpers-be0d4ec8.js → _commonjsHelpers-7002e5de.js} +1 -1
  184. package/dist/esm/bcm-a50d55ba.js +1 -1
  185. package/dist/esm/bcm-accordion_63.entry.js +46019 -0
  186. package/dist/esm/bcm-alert.entry.js +6 -6
  187. package/dist/esm/bcm-attendance-actions-comment.entry.js +11 -11
  188. package/dist/esm/bcm-attendance-actions-dropdown.entry.js +12 -12
  189. package/dist/esm/bcm-autocomplete.entry.js +2 -2
  190. package/dist/esm/bcm-breadcrumb.entry.js +5 -5
  191. package/dist/esm/bcm-caption.entry.js +13 -13
  192. package/dist/esm/bcm-card.entry.js +9 -9
  193. package/dist/esm/bcm-chip-group.entry.js +14 -14
  194. package/dist/esm/bcm-colorpicker.entry.js +4 -4
  195. package/dist/esm/bcm-date-picker.entry.js +7 -7
  196. package/dist/esm/bcm-datetime-picker.entry.js +11 -11
  197. package/dist/esm/bcm-default.entry.js +4 -4
  198. package/dist/esm/bcm-error-layout.entry.js +3 -3
  199. package/dist/esm/bcm-form-2.entry.js +6 -6
  200. package/dist/esm/bcm-input-2.entry.js +149 -0
  201. package/dist/esm/bcm-input-custom.entry.js +5 -5
  202. package/dist/esm/bcm-input-dropdown.entry.js +14 -14
  203. package/dist/esm/bcm-message.entry.js +2 -2
  204. package/dist/esm/bcm-modal-2-footer.entry.js +11 -11
  205. package/dist/esm/bcm-modal-2-header.entry.js +10 -10
  206. package/dist/esm/bcm-modal-2.entry.js +12 -12
  207. package/dist/esm/bcm-notification.entry.js +2 -2
  208. package/dist/esm/bcm-number-input.entry.js +293 -0
  209. package/dist/esm/bcm-overlay_2.entry.js +3 -3
  210. package/dist/esm/bcm-popover.entry.js +11 -11
  211. package/dist/esm/bcm-range.entry.js +8 -8
  212. package/dist/esm/bcm-react-number.entry.js +1226 -0
  213. package/dist/esm/bcm-result.entry.js +2 -2
  214. package/dist/esm/bcm-select-group.entry.js +2 -2
  215. package/dist/esm/bcm-select-option.entry.js +2 -2
  216. package/dist/esm/bcm-skeleton.entry.js +10 -10
  217. package/dist/esm/bcm-tab-pane.entry.js +2 -2
  218. package/dist/esm/bcm-table.entry.js +11 -11
  219. package/dist/esm/bcm-tabs-content.entry.js +3 -3
  220. package/dist/esm/bcm-tag.entry.js +8 -8
  221. package/dist/esm/bcm-time-picker.entry.js +7 -7
  222. package/dist/esm/bcm-timeline-item.entry.js +2 -2
  223. package/dist/esm/bcm-timeline.entry.js +2 -2
  224. package/dist/esm/bcm-toast.entry.js +8 -8
  225. package/dist/esm/bromcom-ui.js +3 -3
  226. package/dist/esm/{caption-template-5c43c733.js → caption-template-3cd42c3b.js} +3 -3
  227. package/dist/esm/{color-helper-c0bb1d8a.js → color-helper-ba15b0d8.js} +2 -2
  228. package/dist/esm/{colors-df32bb43.js → colors-ed4e7579.js} +1 -1
  229. package/dist/esm/{element-dragger-89bb52fd.js → element-dragger-b75266e6.js} +1 -1
  230. package/dist/esm/floating-ui-3f4394da.js +1 -1
  231. package/dist/esm/{generate-a1817b7f.js → generate-74379aca.js} +2 -2
  232. package/dist/esm/{global-26b8ded6.js → global-e20393a3.js} +1 -1
  233. package/dist/esm/{index-b84bc8c9.js → index-00c8a8f7.js} +1 -1
  234. package/dist/esm/{index-a6d9d0af.js → index-0d3a56ec.js} +1 -1
  235. package/dist/esm/input.style-e855c0f3.js +120 -0
  236. package/dist/esm/{label-template-c15569c4.js → label-template-ef97aadb.js} +3 -3
  237. package/dist/esm/loader.js +3 -3
  238. package/dist/esm/{number-helper-ccf5aba4.js → number-helper-6c691943.js} +1 -1
  239. package/dist/esm/old-bcm-popover-box.entry.js +10 -10
  240. package/dist/esm/old-bcm-popover.entry.js +6 -6
  241. package/dist/esm/{package-5d20a20d.js → package-0b936309.js} +1 -1
  242. package/dist/esm/{popover-placement-2f5939ea.js → popover-placement-1b15cc99.js} +1 -1
  243. package/dist/esm/{slot-template-7c36d3be.js → slot-template-0d958dcc.js} +1 -1
  244. package/dist/esm/{string-helper-85990695.js → string-helper-b4602002.js} +6 -4
  245. package/dist/esm/{utils-57652744.js → utils-7727d09e.js} +1 -1
  246. package/dist/esm/{validators-e63fdc75.js → validators-c067048c.js} +1 -1
  247. package/dist/types/models/states/organisms/bcm-organisms-state.d.ts +5 -1
  248. package/dist/types/stories/ui-library/components/list/country.d.ts +6 -0
  249. package/dist/types/templates/list-template.d.ts +1 -0
  250. package/package.json +1 -1
  251. package/dist/bromcom-ui/p-0a3d3b7d.entry.js +0 -5
  252. package/dist/bromcom-ui/p-13eeb974.entry.js +0 -5
  253. package/dist/bromcom-ui/p-158245f6.entry.js +0 -5
  254. package/dist/bromcom-ui/p-183bc78f.entry.js +0 -5
  255. package/dist/bromcom-ui/p-19e378e2.entry.js +0 -5
  256. package/dist/bromcom-ui/p-1a53401f.entry.js +0 -5
  257. package/dist/bromcom-ui/p-1c404cc8.entry.js +0 -5
  258. package/dist/bromcom-ui/p-1d96b6d6.entry.js +0 -5
  259. package/dist/bromcom-ui/p-28d0fb9d.entry.js +0 -5
  260. package/dist/bromcom-ui/p-310cab1a.js +0 -14
  261. package/dist/bromcom-ui/p-3917a612.entry.js +0 -5
  262. package/dist/bromcom-ui/p-39ae1e94.entry.js +0 -5
  263. package/dist/bromcom-ui/p-3ea2dda1.js +0 -5
  264. package/dist/bromcom-ui/p-40584ce5.entry.js +0 -5
  265. package/dist/bromcom-ui/p-4364285a.entry.js +0 -5
  266. package/dist/bromcom-ui/p-475d306a.entry.js +0 -5
  267. package/dist/bromcom-ui/p-4e33341b.entry.js +0 -5
  268. package/dist/bromcom-ui/p-516eb821.entry.js +0 -5
  269. package/dist/bromcom-ui/p-59294a5a.entry.js +0 -5
  270. package/dist/bromcom-ui/p-5d45ff27.entry.js +0 -5
  271. package/dist/bromcom-ui/p-65511654.entry.js +0 -5
  272. package/dist/bromcom-ui/p-7237c3e9.entry.js +0 -5
  273. package/dist/bromcom-ui/p-72d4ced8.entry.js +0 -5
  274. package/dist/bromcom-ui/p-76edf59f.js +0 -7
  275. package/dist/bromcom-ui/p-7942e17a.entry.js +0 -5
  276. package/dist/bromcom-ui/p-7edab876.entry.js +0 -5
  277. package/dist/bromcom-ui/p-83882081.js +0 -5
  278. package/dist/bromcom-ui/p-85371fa1.entry.js +0 -5
  279. package/dist/bromcom-ui/p-862e5ce9.js +0 -5
  280. package/dist/bromcom-ui/p-903d62ff.entry.js +0 -5
  281. package/dist/bromcom-ui/p-91f15c4d.entry.js +0 -5
  282. package/dist/bromcom-ui/p-9d95be18.entry.js +0 -5
  283. package/dist/bromcom-ui/p-a366357e.entry.js +0 -5
  284. package/dist/bromcom-ui/p-a8fd6d69.js +0 -5
  285. package/dist/bromcom-ui/p-afb1e0ae.entry.js +0 -5
  286. package/dist/bromcom-ui/p-b1f75abe.entry.js +0 -5
  287. package/dist/bromcom-ui/p-b284e383.entry.js +0 -5
  288. package/dist/bromcom-ui/p-bc0eb2d3.entry.js +0 -5
  289. package/dist/bromcom-ui/p-bc668762.js +0 -5
  290. package/dist/bromcom-ui/p-bed627ab.js +0 -11
  291. package/dist/bromcom-ui/p-c1a992e7.entry.js +0 -5
  292. package/dist/bromcom-ui/p-c2ef6353.entry.js +0 -5
  293. package/dist/bromcom-ui/p-c5a06d3a.entry.js +0 -5
  294. package/dist/bromcom-ui/p-c7be0488.entry.js +0 -5
  295. package/dist/bromcom-ui/p-ca5073d9.entry.js +0 -5
  296. package/dist/bromcom-ui/p-cce4fa10.entry.js +0 -5
  297. package/dist/bromcom-ui/p-d2f863d9.js +0 -5
  298. package/dist/bromcom-ui/p-d36d96af.entry.js +0 -5
  299. package/dist/bromcom-ui/p-d40c26fb.entry.js +0 -5
  300. package/dist/bromcom-ui/p-d60c61e8.entry.js +0 -5
  301. package/dist/bromcom-ui/p-db8aceb9.entry.js +0 -5
  302. package/dist/bromcom-ui/p-e4a2f8f8.entry.js +0 -5
  303. package/dist/bromcom-ui/p-e8962d4b.entry.js +0 -5
  304. package/dist/bromcom-ui/p-ec9b0de4.entry.js +0 -5
  305. package/dist/bromcom-ui/p-ef440eba.entry.js +0 -5
  306. package/dist/bromcom-ui/p-f144de37.entry.js +0 -5
  307. package/dist/bromcom-ui/p-f1550bf5.entry.js +0 -5
  308. package/dist/bromcom-ui/p-fd8a6bb8.entry.js +0 -5
  309. package/dist/bromcom-ui/p-fe39eea8.js +0 -5
  310. package/dist/cjs/Overflow-7a86d378.js +0 -2233
  311. package/dist/cjs/bcm-accordion.cjs.entry.js +0 -74
  312. package/dist/cjs/bcm-attendance-actions.cjs.entry.js +0 -330
  313. package/dist/cjs/bcm-attendance.cjs.entry.js +0 -35
  314. package/dist/cjs/bcm-avatar_2.cjs.entry.js +0 -210
  315. package/dist/cjs/bcm-button-group.cjs.entry.js +0 -92
  316. package/dist/cjs/bcm-button_11.cjs.entry.js +0 -3340
  317. package/dist/cjs/bcm-checkbox-group.cjs.entry.js +0 -415
  318. package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +0 -2529
  319. package/dist/cjs/bcm-checkbox_2.cjs.entry.js +0 -194
  320. package/dist/cjs/bcm-chip.cjs.entry.js +0 -91
  321. package/dist/cjs/bcm-collapse-group.cjs.entry.js +0 -43
  322. package/dist/cjs/bcm-collapse.cjs.entry.js +0 -62
  323. package/dist/cjs/bcm-color-input.cjs.entry.js +0 -77
  324. package/dist/cjs/bcm-date.cjs.entry.js +0 -182
  325. package/dist/cjs/bcm-drawer.cjs.entry.js +0 -96
  326. package/dist/cjs/bcm-dropdown.cjs.entry.js +0 -119
  327. package/dist/cjs/bcm-expansion-panel.cjs.entry.js +0 -116
  328. package/dist/cjs/bcm-item.cjs.entry.js +0 -72
  329. package/dist/cjs/bcm-items.cjs.entry.js +0 -49
  330. package/dist/cjs/bcm-link.cjs.entry.js +0 -51
  331. package/dist/cjs/bcm-list_3.cjs.entry.js +0 -1972
  332. package/dist/cjs/bcm-menu.cjs.entry.js +0 -151
  333. package/dist/cjs/bcm-modal.cjs.entry.js +0 -157
  334. package/dist/cjs/bcm-old-input.cjs.entry.js +0 -397
  335. package/dist/cjs/bcm-old-tag_2.cjs.entry.js +0 -145
  336. package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +0 -115
  337. package/dist/cjs/bcm-popconfirm.cjs.entry.js +0 -101
  338. package/dist/cjs/bcm-progress.cjs.entry.js +0 -162
  339. package/dist/cjs/bcm-radio-group.cjs.entry.js +0 -161
  340. package/dist/cjs/bcm-radio.cjs.entry.js +0 -65
  341. package/dist/cjs/bcm-rc-picker.cjs.entry.js +0 -9986
  342. package/dist/cjs/bcm-select.cjs.entry.js +0 -1195
  343. package/dist/cjs/bcm-shortcut.cjs.entry.js +0 -65
  344. package/dist/cjs/bcm-step.cjs.entry.js +0 -89
  345. package/dist/cjs/bcm-stepper.cjs.entry.js +0 -240
  346. package/dist/cjs/bcm-switch.cjs.entry.js +0 -151
  347. package/dist/cjs/bcm-tab-group.cjs.entry.js +0 -210
  348. package/dist/cjs/bcm-tab-item-header.cjs.entry.js +0 -59
  349. package/dist/cjs/bcm-tab-item.cjs.entry.js +0 -91
  350. package/dist/cjs/bcm-tab.cjs.entry.js +0 -72
  351. package/dist/cjs/bcm-tabs.cjs.entry.js +0 -370
  352. package/dist/cjs/bcm-text.cjs.entry.js +0 -49
  353. package/dist/cjs/bcm-textarea.cjs.entry.js +0 -163
  354. package/dist/cjs/input-template-b836720c.js +0 -92
  355. package/dist/cjs/json-parse-decarator-b8367488.js +0 -40
  356. package/dist/cjs/lodash-917168d7.js +0 -17199
  357. package/dist/cjs/moment-d06b012f.js +0 -4601
  358. package/dist/cjs/stepper-states-17562587.js +0 -85
  359. package/dist/cjs/tooltip-helper-41b2fcd0.js +0 -158
  360. package/dist/esm/Overflow-32a0ec34.js +0 -2217
  361. package/dist/esm/bcm-accordion.entry.js +0 -70
  362. package/dist/esm/bcm-attendance-actions.entry.js +0 -326
  363. package/dist/esm/bcm-attendance.entry.js +0 -31
  364. package/dist/esm/bcm-avatar_2.entry.js +0 -205
  365. package/dist/esm/bcm-button-group.entry.js +0 -88
  366. package/dist/esm/bcm-button_11.entry.js +0 -3326
  367. package/dist/esm/bcm-checkbox-group.entry.js +0 -411
  368. package/dist/esm/bcm-checkbox-lite_9.entry.js +0 -2517
  369. package/dist/esm/bcm-checkbox_2.entry.js +0 -189
  370. package/dist/esm/bcm-chip.entry.js +0 -87
  371. package/dist/esm/bcm-collapse-group.entry.js +0 -39
  372. package/dist/esm/bcm-collapse.entry.js +0 -58
  373. package/dist/esm/bcm-color-input.entry.js +0 -73
  374. package/dist/esm/bcm-date.entry.js +0 -178
  375. package/dist/esm/bcm-drawer.entry.js +0 -92
  376. package/dist/esm/bcm-dropdown.entry.js +0 -115
  377. package/dist/esm/bcm-expansion-panel.entry.js +0 -112
  378. package/dist/esm/bcm-item.entry.js +0 -68
  379. package/dist/esm/bcm-items.entry.js +0 -45
  380. package/dist/esm/bcm-link.entry.js +0 -47
  381. package/dist/esm/bcm-list_3.entry.js +0 -1966
  382. package/dist/esm/bcm-menu.entry.js +0 -147
  383. package/dist/esm/bcm-modal.entry.js +0 -153
  384. package/dist/esm/bcm-old-input.entry.js +0 -393
  385. package/dist/esm/bcm-old-tag_2.entry.js +0 -140
  386. package/dist/esm/bcm-popconfirm-box.entry.js +0 -111
  387. package/dist/esm/bcm-popconfirm.entry.js +0 -97
  388. package/dist/esm/bcm-progress.entry.js +0 -158
  389. package/dist/esm/bcm-radio-group.entry.js +0 -157
  390. package/dist/esm/bcm-radio.entry.js +0 -61
  391. package/dist/esm/bcm-rc-picker.entry.js +0 -9982
  392. package/dist/esm/bcm-select.entry.js +0 -1191
  393. package/dist/esm/bcm-shortcut.entry.js +0 -61
  394. package/dist/esm/bcm-step.entry.js +0 -85
  395. package/dist/esm/bcm-stepper.entry.js +0 -236
  396. package/dist/esm/bcm-switch.entry.js +0 -147
  397. package/dist/esm/bcm-tab-group.entry.js +0 -206
  398. package/dist/esm/bcm-tab-item-header.entry.js +0 -55
  399. package/dist/esm/bcm-tab-item.entry.js +0 -87
  400. package/dist/esm/bcm-tab.entry.js +0 -68
  401. package/dist/esm/bcm-tabs.entry.js +0 -366
  402. package/dist/esm/bcm-text.entry.js +0 -45
  403. package/dist/esm/bcm-textarea.entry.js +0 -159
  404. package/dist/esm/input-template-c8611096.js +0 -90
  405. package/dist/esm/json-parse-decarator-b230fb3b.js +0 -38
  406. package/dist/esm/lodash-0a4396a7.js +0 -17197
  407. package/dist/esm/moment-15cd9198.js +0 -4598
  408. package/dist/esm/stepper-states-38388dc9.js +0 -83
  409. package/dist/esm/tooltip-helper-e4eb77cc.js +0 -156
@@ -1,2517 +0,0 @@
1
- /*!
2
- * Built with Stencil
3
- * Copyright (c) Bromcom.
4
- */
5
- import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-0615c2b8.js';
6
- import { c as classnames } from './index-b84bc8c9.js';
7
- import { G as Generate } from './generate-a1817b7f.js';
8
- import { B as Bcm } from './bcm-a50d55ba.js';
9
- import { c as getChilds, d as delay } from './utils-57652744.js';
10
- import './_commonjsHelpers-be0d4ec8.js';
11
- import './package-5d20a20d.js';
12
- import './colors-df32bb43.js';
13
-
14
- const checkboxCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}*{box-sizing:border-box}.bcm-checkbox{outline:none;border:none;--bcm-checkbox-primary-color-default:var(--bcm-new-ds-color-blue-500);--bcm-checkbox-secondary-color-default:var(--bcm-new-ds-color-white);--bcm-checkbox-primary-color-hover:var(--bcm-new-ds-color-blue-600);--bcm-checkbox-secondary-color-hover:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-checkbox-secondary-color-focus-visible:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-active:var(--bcm-new-ds-color-blue-700);--bcm-checkbox-secondary-color-active:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-disabled:var(--bcm-new-ds-color-slate-300);--bcm-checkbox-secondary-color-disabled:var(--bcm-new-ds-color-slate-200);display:inline-flex;width:fit-content;flex-direction:column;margin-bottom:8px}.bcm-checkbox:focus,.bcm-checkbox:hover,.bcm-checkbox:active{outline:none;border:none}.bcm-checkbox *{box-sizing:border-box}.bcm-checkbox input[type=radio],.bcm-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;background-color:#fff;margin:0;display:none}.bcm-checkbox__input{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap;padding-top:4px}.bcm-checkbox.hidden{display:none}.bcm-checkbox :hover{cursor:pointer}.bcm-checkbox[disabled] :hover,.bcm-checkbox.disabled :hover{cursor:not-allowed}.bcm-checkbox .slot{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-weight:500;color:var(--bcm-new-ds-color-slate-600)}.bcm-checkbox .slot:not(:empty){margin-left:8px;margin-right:8px}.bcm-checkbox-size-small .slot{font-size:12px;line-height:calc(12px + 8px);margin-top:-2.5px}.bcm-checkbox-size-small .bcm-checkbox__input{min-height:calc(24px - 4px)}.bcm-checkbox-size-small .bcm-checkbox__label-icon{width:14px;height:14px;min-width:14px;font-size:calc(10px - 2px)}.bcm-checkbox-size-medium .slot{font-size:calc(12px + 1px);line-height:calc(12px + 8px);margin-top:-1.5px}.bcm-checkbox-size-medium .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-medium .bcm-checkbox__label-icon{width:16px;height:16px;min-width:16px;font-size:10px}.bcm-checkbox-size-large .slot{font-size:16px;line-height:calc(16px + 8px);margin-top:-1.5px}.bcm-checkbox-size-large .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-large .bcm-checkbox__label-icon{width:18px;height:18px;min-width:18px;font-size:12px}.bcm-checkbox__label{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap}.bcm-checkbox__label-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-wrap:nowrap;border-width:1px;border-style:solid;border-radius:2px}.bcm-checkbox__label-icon-indeterminate{position:relative}.bcm-checkbox__label-icon-indeterminate:after{content:\"\";display:block;position:absolute;width:70%;height:1.5px;background:var(--bcm-new-ds-color-white)}.bcm-checkbox__label-icon.bcm-radio__icon{width:16px;height:16px;box-sizing:border-box;border-radius:100px}.bcm-checkbox__label-icon.bcm-radio__icon .bcm-radio__icon-inner{width:10px;height:10px;border-radius:100px;background-color:var(--bcm-new-ds-color-white)}.bcm-checkbox .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-default);color:var(--bcm-checkbox-secondary-color-default);border-color:var(--bcm-new-ds-color-slate-300)}.bcm-checkbox .bcm-checkbox__label-icon-checked,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-default);border-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-default);background-color:var(--bcm-checkbox-secondary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox:hover .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-hover);color:var(--bcm-checkbox-secondary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-hover);background-color:var(--bcm-checkbox-secondary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-focus-visible);color:var(--bcm-checkbox-secondary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-focus-visible);background-color:var(--bcm-checkbox-secondary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:active .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-active);color:var(--bcm-checkbox-secondary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-active);background-color:var(--bcm-checkbox-secondary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-disabled);color:var(--bcm-checkbox-secondary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-disabled);background-color:var(--bcm-checkbox-secondary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[no-margin] .bcm-checkbox__input{margin:0;min-height:0;padding:0}";
15
-
16
- const BcmCheckboxLite = class {
17
- constructor(hostRef) {
18
- registerInstance(this, hostRef);
19
- this._id = Generate.UID();
20
- this.checked = true;
21
- this.indeterminate = null;
22
- this.disabled = false;
23
- this.hidden = false;
24
- this.required = false;
25
- this.readOnly = false;
26
- this.captionType = Bcm.Status.default;
27
- }
28
- render() {
29
- const { disabled, checked, readOnly, required, indeterminate, hidden, captionType, _id } = this;
30
- // const hostClasses = cs(
31
- // 'bcm-checkbox',
32
- // 'bcm-checkbox__type-default',
33
- // {
34
- // 'error': captionType == Bcm.Status.error,
35
- // hidden,
36
- // checked,
37
- // disabled,
38
- // required,
39
- // readOnly,
40
- // }
41
- // )
42
- // const bcmCheckboxIconClass = cs(
43
- // 'bcm-checkbox__icon',
44
- // 'bcm-checkbox__icon-lite',
45
- // 'bcm-checkbox__icon-' + indeterminate,
46
- // {
47
- // checked
48
- // }
49
- // )
50
- // const bcmCheckboxLabelClass = cs(
51
- // 'bcm-checkbox__label'
52
- // )
53
- const bcmCheckboxClass = classnames('bcm-checkbox', `bcm-checkbox-size-medium`, {
54
- 'error': captionType == Bcm.Status.error,
55
- hidden,
56
- checked,
57
- disabled,
58
- required
59
- });
60
- const bcmCheckboxIconClass = classnames('bcm-checkbox__label-icon', 'bcm-checkbox__label-icon-lite', 'bcm-checkbox__label-icon-' + indeterminate, {
61
- 'bcm-checkbox__label-icon-checked': checked,
62
- });
63
- const bcmCheckboxLabelClass = classnames('bcm-checkbox__label');
64
- const bcmCheckboxInputClass = classnames('bcm-checkbox__input');
65
- return (h(Host, { class: bcmCheckboxClass, style: { 'margin': '0' } }, h("div", { class: bcmCheckboxInputClass, style: {
66
- 'padding-top': '5px'
67
- } }, h("input", { id: _id, type: "checkbox", checked: checked, disabled: disabled, required: required, readOnly: readOnly }), h("label", { class: bcmCheckboxLabelClass, htmlFor: _id }, h("span", { class: bcmCheckboxIconClass }, h("div", { style: {
68
- 'height': '12px',
69
- 'min-height': '12px',
70
- 'width': '12px',
71
- 'min-width': '12px'
72
- } }, h("svg", { class: "bcm-icon-lite", width: "100%", height: "100%", viewBox: "0 0 11 9", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M1.91308 4.03516H1.91326C1.99256 4.03525 2.07081 4.05331 2.14213 4.08798C2.21341 4.12262 2.27591 4.17295 2.32497 4.2352L1.91308 4.03516ZM1.91308 4.03516H1.09394C0.890308 4.03516 0.776602 4.26975 0.902321 4.4292L0.902371 4.42927L4.11214 8.49567L4.11218 8.49573C4.32247 8.76188 4.72568 8.76114 4.93667 8.49617L4.93708 8.49566L10.6597 1.24398C10.6598 1.24378 10.66 1.24358 10.6602 1.24338C10.7884 1.08295 10.6699 0.85 10.4689 0.85H9.6498C9.48941 0.85 9.33668 0.9235 9.2376 1.05044C9.23751 1.05055 9.23742 1.05066 9.23734 1.05077L4.52403 7.02157M1.91308 4.03516L4.52403 7.02157M4.52403 7.02157L2.32506 4.23531L4.52403 7.02157Z", fill: "#ffffff" }))))))));
73
- }
74
- get el() { return getElement(this); }
75
- };
76
- BcmCheckboxLite.style = checkboxCss;
77
-
78
- const dividerCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}.bcm-divider{display:block}.bcm-divider.hidden{display:none}.bcm-divider__direction-horizontal{width:100%;height:1px;margin:4px auto;border-top:1px solid var(--bcm-color-grey-5)}.bcm-divider__direction-vertical{height:auto;width:1px;margin:0 4px;border-left:1px solid var(--bcm-color-grey-5)}";
79
-
80
- const BcmDivider = class {
81
- constructor(hostRef) {
82
- registerInstance(this, hostRef);
83
- this.hidden = false;
84
- this.direction = Bcm.Direction.horizontal;
85
- }
86
- render() {
87
- const { hidden, direction } = this;
88
- const hostClasses = classnames('bcm-divider', 'bcm-divider__direction-' + direction, {
89
- 'hidden': hidden
90
- });
91
- return (h(Host, { class: hostClasses }, h("span", { hidden: true }, h("slot", null))));
92
- }
93
- get el() { return getElement(this); }
94
- };
95
- BcmDivider.style = dividerCss;
96
-
97
- const BcmEmpty = class {
98
- constructor(hostRef) {
99
- registerInstance(this, hostRef);
100
- this.icon = undefined;
101
- }
102
- render() {
103
- return (h(Host, { class: "tw-h-full tw-flex tw-flex-col tw-items-center tw-justify-center tw-w-full tw-flex-1 tw-bg-slate-50 tw-text-center tw-rounded tw-gap-3" }, this.icon && h("i", { class: `tw-text-8 tw-text-amber-400 ${this.icon}` }), h("bcm-typography", { class: "tw-text-slate-400 tw-text-2" }, h("slot", null))));
104
- }
105
- get el() { return getElement(this); }
106
- };
107
-
108
- const listboxCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:block;width:fit-content;height:fit-content;background-color:#ffffff}:host(.hidden){display:none}:host(.flex){width:100%;height:100%}:host(.flex) .bcm-listbox{max-height:100%;max-width:100%;height:100%;min-width:100%}:host(.full-width){width:100%}:host(.full-width) .bcm-listbox{max-width:100%;min-width:100%}.bcm-listbox{flex:1;background-color:var(--bcm-color-grey-1);width:fit-content;display:flex;flex-direction:column;height:100%;width:100%;min-width:256px;max-width:256px;min-height:auto;max-height:300px;box-sizing:border-box;border:1px solid var(--bcm-color-grey-5)}.bcm-listbox-list{flex:1;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;border-bottom:none}.bcm-listbox-list.loading{min-height:150px;position:relative;margin:0 8px 8px 8px}.bcm-listbox-list .loading{display:none;align-items:center;justify-content:center;height:100%;width:100%;position:absolute;background-color:rgba(255, 255, 255, 0.03)}.bcm-listbox-list .loading.show{display:flex}.bcm-listbox-list .list-container.hidden{display:none}.bcm-listbox .search{padding:8px;padding-bottom:0}.bcm-listbox .search.hidden{display:none !important}.bcm-listbox .empty{display:none;align-items:center;justify-content:center;flex:1;height:100%}.bcm-listbox .empty.show{display:flex}.bcm-listbox-footer{text-align:right;padding:4px 8px;background-color:var(--bcm-color-grey-3)}.label{display:block;color:var(--bcm-color-grey-9);margin-bottom:4px}.listbox-item{display:flex;align-items:stretch;justify-content:flex-start;flex-direction:column;color:var(--bcm-color-grey-8);user-select:none;background-color:var(--bcm-color-grey-1)}.listbox-item.hidden{display:none}.listbox-item .divider{padding:0 8px}.listbox-item-container{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;padding-left:8px;width:100%}.listbox-item-container .check-content{display:flex;align-items:center;justify-content:flex-start;width:16px;min-width:16px;margin-right:4px}.listbox-item-container .check-content .indeterminate{width:16px;height:16px;position:relative;display:block;padding-right:8px;cursor:pointer}.listbox-item-container .check-content .indeterminate:after{content:\"\";position:absolute;top:50%;left:9px;width:10px;height:10px;background-color:var(--bcm-color-prime-blue-6);transform:translate(-50%, -50%);opacity:1;z-index:1}.listbox-item-container .check-content .indeterminate:before{content:\"\";position:absolute;top:-1px;left:0px;width:16px;height:100%;border-radius:2px;background-color:transparent;border:1px solid var(--bcm-color-grey-5);opacity:1;z-index:2}.listbox-item-container .check-content .indeterminate:hover:before{border-color:var(--bcm-color-prime-blue-6);box-shadow:0px 2px 4px rgba(54, 121, 171, 0.5)}.listbox-item-container-text-content{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;cursor:pointer;width:100%;padding:4px 8px 4px 4px}.listbox-item-container.disabled{color:var(--bcm-color-grey-6)}.listbox-item-container.selected{color:var(--bcm-color-prime-blue-6)}.listbox-item-container.selected:hover:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.listbox-item-container:hover:not(.disabled),.listbox-item-container:active:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.caption-area{margin-bottom:8px;min-height:20px}.input-caption{display:block}.error.label{color:var(--bcm-color-red-6) !important}.error.bcm-listbox{border:1px solid var(--bcm-color-red-6) !important}.caption-default{color:#8C8C8C}.caption-primary{color:#4293CF}.caption-success{color:#52C41A}.caption-warning{color:#FA8C16}.caption-error{color:#F5222D}.input-large{height:38px}.input-medium{height:30px}.input-small{height:20px}";
109
-
110
- /**
111
- * @desc
112
- * @param str
113
- */
114
- const lowercase$2 = (str) => str.toLowerCase();
115
- const BcmListbox = class {
116
- constructor(hostRef) {
117
- registerInstance(this, hostRef);
118
- this.listboxItemSelected = createEvent(this, "bcm-listbox-item-selected", 7);
119
- this.listboxClearSelected = createEvent(this, "bcm-listbox-clear-selecteds", 7);
120
- this.listboxSendCheck = createEvent(this, "bcm-listbox-send-check", 7);
121
- this.listboxSendUncheck = createEvent(this, "bcm-listbox-send-uncheck", 7);
122
- this.listboxChecklist = createEvent(this, "bcm-listbox-checklist", 7);
123
- this.listboxChange = createEvent(this, "bcm-listbox-change", 7);
124
- this.listboxChecked = createEvent(this, "bcm-listbox-checked", 7);
125
- this.change = createEvent(this, "bcm-change", 7);
126
- this.objectMapping = {
127
- 'id': "id",
128
- 'text': "text",
129
- 'icon': "icon",
130
- 'avatar': "avatar",
131
- 'avatarName': "avatarName",
132
- 'avatarImage': "avatarImage",
133
- 'secondaryText': "secondaryText",
134
- 'tooltipText': "tooltipText",
135
- 'selected': "selected",
136
- 'checked': "checked",
137
- 'disabled': "disabled",
138
- };
139
- this.checkedObjectList = [];
140
- this.cacheCheckedObjectList = [];
141
- this.allChilds = [];
142
- this.onlyChilds = [];
143
- this.firstRun = true;
144
- this.firstCheck = false;
145
- this.onFocus = false;
146
- this.isSetData = false;
147
- this.isGroupArray = [];
148
- this.intersection = [];
149
- /**
150
- * Component States
151
- */
152
- this.searchResults = [];
153
- this.totalSearch = 0;
154
- this.showSearch = true;
155
- this.empty = false;
156
- this.runClearAndSelect = false;
157
- this.innerComponent = false;
158
- this.checkboxes = false;
159
- this.label = undefined;
160
- this.required = false;
161
- this.value = null;
162
- this.search = false;
163
- this.infoFooter = false;
164
- this.showIcon = false;
165
- this.size = 'medium';
166
- this.selectedId = undefined;
167
- this.checkedList = [];
168
- this.updateCheckedList = [];
169
- this._items = [];
170
- this.fullWidth = false;
171
- this.searchFields = ['text', 'secondaryText', 'tooltipText'];
172
- this._flex = undefined;
173
- this.hidden = false;
174
- this.returnField = "id";
175
- this.searchSub = "items";
176
- this.searchText = "";
177
- this.treeview = false;
178
- this.searchPlaceholder = "Search";
179
- this.numberOfColumns = 1;
180
- this.height = null;
181
- this.maxHeight = null;
182
- this.template = null;
183
- this.highlight = false;
184
- this.loading = true;
185
- this.noCaption = false;
186
- this.caption = undefined;
187
- this.captionError = undefined;
188
- this.captionType = 'default';
189
- this._internal_id = (Math.random() * 4).toString(16).replace('.', '');
190
- this.tooltip = undefined;
191
- this.total = 0;
192
- this.items = [];
193
- this.checklist = [];
194
- this.sortedChecklist = [];
195
- this.indeterminateState = 'uncheck';
196
- this.checked = false;
197
- this.jsonItem = undefined;
198
- this.searchData = undefined;
199
- this.captionCache = undefined;
200
- this.captionTypeCache = undefined;
201
- this.checklistSorted = [];
202
- }
203
- async setClear() {
204
- this.listboxChecklist.emit([]);
205
- this.value = null;
206
- this.selectedId = null;
207
- this.listboxClearSelected.emit([]);
208
- // this.checkedObjectList.forEach(item => {
209
- // this.listboxUncheckedMethod(String(item[this.objectMapping['id']]), this._internal_id)
210
- // });
211
- let isItem = getChilds(this.el, 'bcm-listbox-item');
212
- let elementStatuses = [];
213
- if (isItem) {
214
- isItem.map(element => {
215
- elementStatuses.push(element.checked = false);
216
- });
217
- }
218
- // console.log("uncheck")
219
- await Promise.all(elementStatuses);
220
- // if ( allStatuses ){
221
- // console.log("bitti")
222
- // }
223
- this.checklist = [];
224
- this.sortedChecklist = [];
225
- this.checklistSorted = [];
226
- this.checkedObjectList = [];
227
- await delay(10);
228
- return Promise.resolve();
229
- }
230
- async resetCaption() {
231
- await delay(10);
232
- this.caption = this.captionCache;
233
- this.captionType = this.captionTypeCache;
234
- this.captionError = null;
235
- await delay(10);
236
- return Promise.resolve();
237
- }
238
- connectedCallback() {
239
- this.captionCache = this.caption;
240
- this.captionTypeCache = this.captionType;
241
- }
242
- async getValue() {
243
- if (this.checkboxes) {
244
- return this.checkedObjectList;
245
- }
246
- else {
247
- return this.value;
248
- }
249
- }
250
- async getChecklist() {
251
- return this.checkedObjectList;
252
- }
253
- async showSearchMethod(val = true) {
254
- if (this.treeview == false && this.search == true) {
255
- this.showSearch = val;
256
- var search = null;
257
- if (search = this.el.shadowRoot.getElementById("search")) {
258
- if (val) {
259
- search.classList.remove('hidden');
260
- }
261
- else {
262
- search.classList.add('hidden');
263
- }
264
- }
265
- }
266
- }
267
- async selected(id) {
268
- this.selectedId = String(id);
269
- if (this.treeview === true) {
270
- setTimeout(async () => {
271
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
272
- if (bcmTreeview) {
273
- await bcmTreeview.selected(this.selectedId);
274
- }
275
- }, 100);
276
- }
277
- }
278
- async clearAndSelectSearch(select = true) {
279
- this.runClearAndSelect = true;
280
- if (this.search == true) {
281
- setTimeout(() => {
282
- var searchInput = null;
283
- searchInput = this.el.shadowRoot.querySelector("bcm-old-search");
284
- if (searchInput) {
285
- searchInput.setClear();
286
- if (select == true) {
287
- searchInput.select();
288
- }
289
- }
290
- }, 100);
291
- }
292
- }
293
- async addChecked(items) {
294
- await this.setClear();
295
- if (items) {
296
- if (typeof items != 'string') {
297
- await delay(50);
298
- if (sessionStorage.getItem(this._internal_id + "-config")) {
299
- this.config(JSON.parse(sessionStorage.getItem(this._internal_id + "-config")));
300
- }
301
- this.checkedList = items;
302
- this.checkedList.forEach((item) => {
303
- this.handleListboxChecked({ detail: String(item) }, this._internal_id);
304
- });
305
- this.updateCheckedList = [];
306
- if (this.treeview === true) {
307
- setTimeout(async () => {
308
- await customElements.whenDefined("bcm-treeview");
309
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
310
- if (bcmTreeview) {
311
- await bcmTreeview.addChecked(items);
312
- }
313
- }, 50);
314
- }
315
- }
316
- }
317
- }
318
- async updateChecked(items) {
319
- this.setClear();
320
- this.checkedList = [];
321
- this.updateCheckedList = items;
322
- this.updateCheckedList.forEach((item) => {
323
- this.handleListboxChecked({ detail: item });
324
- });
325
- setTimeout(async () => {
326
- if (this.treeview === true) {
327
- await customElements.whenDefined("bcm-treeview");
328
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
329
- if (bcmTreeview) {
330
- await bcmTreeview.updateChecked(items);
331
- }
332
- }
333
- }, 100);
334
- }
335
- async config(_config) {
336
- if (_config['treeview'] && _config['treeview'] === true) {
337
- typeof _config['treeview'] == 'boolean'
338
- ? this.treeview = _config['treeview']
339
- : this.treeview = false;
340
- }
341
- setTimeout(async () => {
342
- if (this.treeview === true) {
343
- await customElements.whenDefined("bcm-treeview");
344
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
345
- if (bcmTreeview) {
346
- await bcmTreeview.config(_config);
347
- if (this.selectedId) {
348
- await bcmTreeview.selected(this.selectedId);
349
- }
350
- }
351
- }
352
- }, 300);
353
- if (_config['searchFields']) {
354
- if (Array.isArray(_config['searchFields'])) {
355
- this.searchFields = _config['searchFields'];
356
- }
357
- }
358
- if (_config['searchPlaceholder']) {
359
- typeof _config['searchPlaceholder'] == 'string'
360
- ? this.searchPlaceholder = _config['searchPlaceholder']
361
- : this.searchPlaceholder = null;
362
- }
363
- if (_config['maxHeight']) {
364
- typeof _config['maxHeight'] == 'string'
365
- ? this.maxHeight = _config['maxHeight']
366
- : this.maxHeight = "100%";
367
- }
368
- if (_config['height']) {
369
- typeof _config['height'] == 'string'
370
- ? this.height = _config['height']
371
- : this.height = "100%";
372
- }
373
- if (_config['template']) {
374
- typeof _config['template'] == 'string'
375
- ? this.template = _config['template']
376
- : this.template = null;
377
- }
378
- if (_config['searchable']) {
379
- typeof _config['searchable'] == 'boolean'
380
- ? this.search = _config['searchable']
381
- : this.search = false;
382
- }
383
- if (_config['highlight']) {
384
- typeof _config['highlight'] == 'boolean'
385
- ? this.highlight = _config['highlight']
386
- : this.highlight = false;
387
- }
388
- if (_config['fullWidth']) {
389
- typeof _config['fullWidth'] == 'boolean'
390
- ? this.fullWidth = _config['fullWidth']
391
- : this.fullWidth = false;
392
- }
393
- if (_config['numberOfColumns']) {
394
- typeof _config['numberOfColumns'] == 'number'
395
- ? this.numberOfColumns = _config['numberOfColumns']
396
- : this.numberOfColumns = 1;
397
- }
398
- if (_config['infoFooter']) {
399
- typeof _config['infoFooter'] == 'boolean'
400
- ? this.infoFooter = _config['infoFooter']
401
- : this.infoFooter = false;
402
- }
403
- if (_config['checkable']) {
404
- typeof _config['checkable'] == 'boolean'
405
- ? this.checkboxes = _config['checkable']
406
- : this.checkboxes = false;
407
- }
408
- if (_config['showIcon']) {
409
- typeof _config['showIcon'] == 'boolean'
410
- ? this.showIcon = _config['showIcon']
411
- : this.showIcon = false;
412
- }
413
- if (_config['size']) {
414
- (["small", "medium", "large"].indexOf(_config['size']) >= 0)
415
- ? this.size = _config['size']
416
- : this.size = 'medium';
417
- }
418
- this.searchSub = this.objectMapping['items'];
419
- if (_config['mapping']) {
420
- if (_config['mapping']['id']) {
421
- this.objectMapping['id'] = String(_config['mapping']['id']);
422
- this.returnField = this.objectMapping['id'];
423
- }
424
- if (_config['mapping']['text']) {
425
- this.objectMapping['text'] = _config['mapping']['text'];
426
- }
427
- if (_config['mapping']['icon']) {
428
- this.objectMapping['icon'] = _config['mapping']['icon'];
429
- }
430
- if (_config['mapping']['avatar']) {
431
- this.objectMapping['avatar'] = _config['mapping']['avatar'];
432
- }
433
- if (_config['mapping']['avatarName']) {
434
- this.objectMapping['avatarName'] = _config['mapping']['avatarName'];
435
- }
436
- if (_config['mapping']['avatarImage']) {
437
- this.objectMapping['avatarImage'] = _config['mapping']['avatarImage'];
438
- }
439
- if (_config['mapping']['secondaryText']) {
440
- this.objectMapping['secondaryText'] = _config['mapping']['secondaryText'];
441
- }
442
- if (_config['mapping']['tooltipText']) {
443
- this.objectMapping['tooltipText'] = _config['mapping']['tooltipText'];
444
- }
445
- if (_config['mapping']['disabled']) {
446
- this.objectMapping['disabled'] = _config['mapping']['disabled'];
447
- }
448
- if (_config['mapping']['checked']) {
449
- this.objectMapping['checked'] = _config['mapping']['checked'];
450
- }
451
- if (_config['mapping']['selected']) {
452
- this.objectMapping['selected'] = _config['mapping']['selected'];
453
- }
454
- if (_config['mapping']['items']) {
455
- this.objectMapping['items'] = _config['mapping']['items'];
456
- this.searchSub = this.objectMapping['items'];
457
- }
458
- // if ( this.treeview ) {
459
- // }else{
460
- // this.searchSub = this.objectMapping['items']
461
- // }
462
- }
463
- sessionStorage.setItem(this._internal_id + "-config", JSON.stringify(_config));
464
- // forceUpdate(this.el)
465
- return Promise.resolve(true);
466
- }
467
- async setData(_data = []) {
468
- this.clearAndSelectSearch(false);
469
- this.isLoading(true);
470
- this._items = _data;
471
- this.searchData = JSON.parse(_data);
472
- this.isSetData = true;
473
- // this.isEmpty(false)
474
- setTimeout(async () => {
475
- if (this.treeview === true) {
476
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
477
- if (bcmTreeview) {
478
- await bcmTreeview.setData(_data);
479
- if (this.searchData.length > 0) {
480
- this.isEmpty(false);
481
- this.isLoading(false);
482
- }
483
- }
484
- }
485
- }, 100);
486
- }
487
- // componentDidLoad(){
488
- // console.log("kilitle")
489
- // setTimeout(() => {
490
- // if(this.isSetData) {
491
- // this.isLoading(true)
492
- // this.isEmpty(false)
493
- // }else{
494
- // this.isLoading(false)
495
- // this.isEmpty(true)
496
- // }
497
- // }, 100);
498
- // }
499
- componentWillRender() {
500
- if (this.isSetData) {
501
- this.onlyChilds = this.getAllGroup(this.el, true);
502
- this.allChilds = this.getAllGroup();
503
- if (this.onlyChilds.length != this.total) {
504
- this.total = this.onlyChilds.length;
505
- }
506
- if (this.checkboxes === true) {
507
- this.setIndeterminateState();
508
- if (this.checklistSorted.length > 0) {
509
- this.checkedObjectList = [];
510
- this.getAllGroup(this.el).forEach(element => {
511
- element.checked == true && (this.firstCheck = true,
512
- this.checkedObjectList.indexOf(element.itemObject) == -1 && (this.checkedObjectList.push(element.itemObject)));
513
- });
514
- if (JSON.stringify(this.cacheCheckedObjectList) !== JSON.stringify(this.checkedObjectList)) {
515
- this.listboxChecklist.emit(this.checkedObjectList);
516
- this.cacheCheckedObjectList = this.checkedObjectList;
517
- this.value = this.checkedObjectList;
518
- }
519
- }
520
- else {
521
- if (this.firstCheck) {
522
- this.listboxChecklist.emit([]);
523
- this.cacheCheckedObjectList = [];
524
- if (this.value != null) {
525
- this.value = null;
526
- }
527
- }
528
- }
529
- }
530
- }
531
- }
532
- componentDidRender() {
533
- // this.isEmpty(true)
534
- // this.isLoading(true)
535
- // if(this.total > 0) {
536
- // this.isLoading(false)
537
- // this.isEmpty(false)
538
- // }
539
- // this.isEmpty(true)
540
- if (this.isSetData) {
541
- if (this.total > 0) {
542
- this.isEmpty(false);
543
- this.isLoading(false);
544
- }
545
- else {
546
- this.isEmpty(true);
547
- }
548
- }
549
- }
550
- /**
551
- * @desc
552
- * @returns {void}
553
- */
554
- setIndeterminateState() {
555
- let state = 'uncheck';
556
- let allChecked = true;
557
- let allUnchecked = true;
558
- this.getAllGroup(this.el, true).map((item) => {
559
- item.checked && (allUnchecked = false);
560
- !item.checked && (allChecked = false);
561
- });
562
- !allChecked && !allUnchecked
563
- ? state = 'indeterminate'
564
- : allChecked
565
- ? state = 'determinate'
566
- : state = 'uncheck';
567
- this.indeterminateState = state;
568
- this.checked = state == 'determinate' ? true : false;
569
- // this.listboxChecklist.emit(this.sortedChecklist)
570
- }
571
- getAllGroup(element = this.el, onlyItem = false) {
572
- let returnAllItems = [];
573
- let isGroup = getChilds(element, 'bcm-listbox-group');
574
- let isItem = getChilds(element, 'bcm-listbox-item');
575
- if (isGroup.length > 0) {
576
- isGroup.forEach(group => {
577
- if (this.isGroupArray.indexOf(Number(group.id)) === -1) {
578
- this.isGroupArray.push(Number(group.id));
579
- }
580
- if (onlyItem == false) {
581
- returnAllItems = [...returnAllItems,
582
- group
583
- ];
584
- }
585
- getChilds(group, 'bcm-listbox-item').forEach(items => {
586
- if (!(returnAllItems.indexOf(items) >= 0)) {
587
- returnAllItems = [...returnAllItems,
588
- items
589
- ];
590
- }
591
- });
592
- });
593
- }
594
- if (isItem.length > 0) {
595
- isItem.forEach(items => {
596
- if (!(returnAllItems.indexOf(items) >= 0)) {
597
- returnAllItems = [...returnAllItems,
598
- items
599
- ];
600
- }
601
- });
602
- }
603
- return returnAllItems;
604
- }
605
- getAllChilds(element = this.el, type = null) {
606
- let returnAllItems = [];
607
- let oldItems = [];
608
- if (!this._items || type === "slot") {
609
- getChilds(element, 'bcm-listbox-item').forEach(items => {
610
- returnAllItems = [...returnAllItems,
611
- items
612
- ];
613
- });
614
- }
615
- else if (this._items && this._items.length > 0) {
616
- oldItems = JSON.parse(this._items);
617
- oldItems.map((item) => (((item.type === 'group') ? (item.items.map((item) => ((returnAllItems = [...returnAllItems, item])))) :
618
- (returnAllItems = [...returnAllItems, item]))));
619
- }
620
- return returnAllItems;
621
- }
622
- /**
623
- * @desc
624
- */
625
- handleCheckList(process = 'add', checkId) {
626
- checkId = String(checkId);
627
- if (this.checkboxes) {
628
- if (this.items && this.items.find(e => e[this.objectMapping['id']] == checkId)) {
629
- // checkId = Number(checkId)
630
- switch (process) {
631
- case 'add':
632
- if (this.checklist.length > 0) {
633
- if (!this.checklist.includes(checkId)) {
634
- this.checklist = [...this.checklist, checkId];
635
- }
636
- }
637
- else {
638
- this.checklist = [checkId];
639
- }
640
- break;
641
- case 'remove':
642
- this.checklist = this.checklist.filter(item => item !== checkId);
643
- break;
644
- }
645
- let sorted = this.checklist.sort(function (a, b) { return a - b; });
646
- this.sortedChecklist = this.checklist;
647
- this.checklistSorted = sorted;
648
- // forceUpdate(this.el)
649
- }
650
- }
651
- }
652
- handleIndeterminateClick() {
653
- let state = 'uncheck';
654
- let allChecked = true;
655
- let allUnchecked = true;
656
- let visibleItem = [];
657
- this.getAllGroup(this.el, true).map((item) => {
658
- if (item.hidden === false) {
659
- visibleItem.push(item);
660
- item.checked && (allUnchecked = false);
661
- !item.checked && (allChecked = false);
662
- }
663
- });
664
- !allChecked && !allUnchecked
665
- ? state = 'indeterminate'
666
- : allChecked
667
- ? state = 'determinate'
668
- : state = 'uncheck';
669
- visibleItem.map((item) => {
670
- if (state !== 'uncheck') {
671
- item.checked = false;
672
- this.handleCheckList('remove', String(item.id));
673
- }
674
- else {
675
- item.checked = true;
676
- this.handleCheckList('add', String(item.id));
677
- }
678
- });
679
- this.setIndeterminateState();
680
- }
681
- handleCheckboxClick(e) {
682
- e.preventDefault();
683
- }
684
- /**
685
- * @desc
686
- * @param item
687
- */
688
- itemRenderer(item) {
689
- if (item[this.objectMapping['id']] && String(this.selectedId) == String(item[this.objectMapping['id']])) {
690
- this.listboxItemSelected.emit(item);
691
- }
692
- // if(item[this.objectMapping['selected']] && item[this.objectMapping['selected']] === true){
693
- // this.listboxItemSelected.emit(item)
694
- // }
695
- // var checkedListCache = this.checkedList;
696
- // if(checkedListCache && checkedListCache.find(e => e == item[this.objectMapping['id']])){
697
- // this.handleListboxChecked({detail: item[this.objectMapping['id']]})
698
- // }
699
- // const index = checkedListCache.indexOf(item[this.objectMapping['id']]);
700
- // if (index > -1) {
701
- // checkedListCache.splice(index, 1);
702
- // }
703
- // if(this.updateCheckedList.length > 0 ){
704
- // if( this.updateCheckedList.find(e => e == item[this.objectMapping['id']]) ){
705
- // const index = this.updateCheckedList.indexOf(item[this.objectMapping['id']]);
706
- // if (index > -1) {
707
- // this.updateCheckedList.splice(index, 1);
708
- // }
709
- // this.listboxChecked.emit(item[this.objectMapping['id']])
710
- // }
711
- // }
712
- return (h("bcm-listbox-item", Object.assign({ _internal_id: this._internal_id, id: String(item[this.objectMapping['id']]), text: item[this.objectMapping['text']] }, (item[this.objectMapping['icon']] && { icon: item[this.objectMapping['icon']] }), (item[this.objectMapping['avatar']] && { avatar: item[this.objectMapping['avatar']] }), (item[this.objectMapping['avatarName']] && { avatarName: item[this.objectMapping['avatarName']] }), (item[this.objectMapping['avatarImage']] && { avatarImage: item[this.objectMapping['avatarImage']] }), (item[this.objectMapping['secondaryText']] && { secondaryText: item[this.objectMapping['secondaryText']] }), (item[this.objectMapping['tooltipText']] && { tooltipText: item[this.objectMapping['tooltipText']] }), (Boolean(item[this.objectMapping['checked']]) === Boolean(true) && { checked: Boolean(item[this.objectMapping['checked']]) }), (item[this.objectMapping['disabled']] === true && { disabled: true }), (Boolean(item[this.objectMapping['selected']]) === Boolean(true) && this.checkboxes == false && { selected: Boolean(item[this.objectMapping['selected']]) }), (this.template && { template: this.template }), (this.checkboxes && { checkboxes: true }), (this.size && { size: this.size }), { itemObject: item, objectMapping: this.objectMapping })));
713
- }
714
- /**
715
- * @desc
716
- * @param group
717
- */
718
- recursiveGroupRenderer(group) {
719
- return (h("bcm-listbox-group", { id: group[this.objectMapping['id']], text: group[this.objectMapping['text']] }, group.items.map((item) => ((item.type === 'group' ? this.recursiveGroupRenderer(item) : this.itemRenderer(item))))));
720
- }
721
- async searchResultMethod(items = []) {
722
- if (this.treeview == true) {
723
- const bcmtreeview = this.el.shadowRoot.querySelector("bcm-treeview");
724
- // await bcmListbox.config(this._config)
725
- if (bcmtreeview) {
726
- bcmtreeview.searchResultMethod({ detail: (items.length > 0 ? items : true) });
727
- }
728
- }
729
- else {
730
- this.listenSearchResult({ detail: (items.length > 0 ? items : true), isEvent: true });
731
- }
732
- // return true
733
- }
734
- handleListboxSelected(event) {
735
- this.listboxItemSelected.emit(event.detail);
736
- }
737
- /**
738
- * @desc
739
- */
740
- // @Listen('bcm-treeview-checklist')
741
- // handleListboxCheckedList(e) {
742
- // this.listboxChecklist.emit(e.detail)
743
- // }
744
- isLoading(val) {
745
- var listContainer = this.el.shadowRoot.getElementById("bcm-listbox-list");
746
- var loading = this.el.shadowRoot.getElementById("loading");
747
- var searchInput = this.el.shadowRoot.querySelector("bcm-old-search");
748
- // var listcontainer = this.el.shadowRoot.getElementById("list-container")
749
- if (val) {
750
- if (searchInput) {
751
- searchInput.disabled = true;
752
- }
753
- listContainer && listContainer.classList.add('loading');
754
- loading && loading.classList.add('show');
755
- // listcontainer && listcontainer.classList.add('hidden')
756
- }
757
- else {
758
- if (searchInput) {
759
- searchInput.disabled = false;
760
- }
761
- listContainer && listContainer.classList.remove('loading');
762
- loading && loading.classList.remove('show');
763
- // listcontainer && listcontainer.classList.remove('hidden')
764
- }
765
- }
766
- isEmpty(val) {
767
- var empty = this.el.shadowRoot.getElementById("empty");
768
- var listcontainer = this.el.shadowRoot.getElementById("list-container");
769
- var checkall = this.el.shadowRoot.getElementById("checkall");
770
- if (val) {
771
- empty && empty.classList.add('show');
772
- listcontainer && listcontainer.classList.add('hidden');
773
- checkall && checkall.classList.add('hidden');
774
- }
775
- else {
776
- empty && empty.classList.remove('show');
777
- listcontainer && listcontainer.classList.remove('hidden');
778
- checkall && checkall.classList.remove('hidden');
779
- }
780
- }
781
- isSearchCount(val = false) {
782
- if (this.infoFooter) {
783
- var inSearch = this.el.shadowRoot.getElementById("in-search");
784
- var inTotal = this.el.shadowRoot.getElementById("in-total");
785
- if (val !== false && val >= 0 && val != null && inSearch && inTotal) {
786
- inSearch.innerHTML = val;
787
- inTotal.style.display = "none";
788
- }
789
- else {
790
- inTotal.style.display = "inline";
791
- inSearch.innerHTML = "";
792
- }
793
- }
794
- }
795
- listenSearchResult(event) {
796
- var path = event.path || (event.composedPath && event.composedPath());
797
- if (event.isEvent == undefined) {
798
- if (path && path.filter((input) => input['_internal_id'] == this._internal_id)[0] != undefined) {
799
- var searchValue = '';
800
- if (this.treeview == false) {
801
- // var checkall = null
802
- // this.checkboxes && (checkall = this.el.shadowRoot.getElementById("checkall"))
803
- var totalSearch = event.detail.length;
804
- // this.empty = false
805
- this.isEmpty(false);
806
- this.intersection = [];
807
- if (event.detail.length > 0) {
808
- if (event.detail[0] == -1) {
809
- totalSearch = 0;
810
- this.empty = true;
811
- this.isEmpty(true);
812
- }
813
- if (this.allChilds.length > 0) {
814
- // this.checkboxes && ( checkall && checkall.classList.add('hidden') )
815
- this.allChilds.map((item) => {
816
- if (this.highlight) {
817
- event.target.addEventListener('bcm-on-search-value', async (e) => {
818
- var inputText = item.shadowRoot.getElementById("text");
819
- if (inputText) {
820
- searchValue = await e.detail;
821
- inputText = (inputText === null || inputText === void 0 ? void 0 : inputText.textContent) || (inputText === null || inputText === void 0 ? void 0 : inputText.innerText) || "";
822
- if (searchValue) {
823
- var cacheInputText = lowercase$2(inputText);
824
- var cacheSearchValue = lowercase$2(searchValue);
825
- var index = cacheInputText.indexOf(cacheSearchValue);
826
- if (index >= 0) {
827
- inputText = inputText.substring(0, index) + "<span class='highlight'>" + inputText.substring(index, index + searchValue.length) + "</span>" + inputText.substring(index + searchValue.length);
828
- }
829
- }
830
- item.shadowRoot.getElementById("text").innerHTML = inputText;
831
- }
832
- });
833
- }
834
- item.hidden = true;
835
- var _ids = String(item.id);
836
- if (event.detail.indexOf(_ids) >= 0) {
837
- item.hidden = false;
838
- }
839
- else {
840
- item.hidden = true;
841
- }
842
- });
843
- }
844
- this.intersection = event.detail[0] == -1 ? [0] : event.detail.filter(x => this.isGroupArray.includes(x));
845
- }
846
- else {
847
- if (this.allChilds.length > 0) {
848
- this.allChilds.map((item) => {
849
- item.hidden = false;
850
- });
851
- // this.checkboxes && ( checkall && checkall.classList.remove('hidden') )
852
- }
853
- // this.isEmpty(true)
854
- }
855
- if (this.search || this.checkboxes) {
856
- setTimeout(() => {
857
- if (totalSearch >= 0) {
858
- var totals = totalSearch;
859
- this.isSearchCount(totals);
860
- }
861
- else {
862
- this.isSearchCount(0);
863
- }
864
- if (event.detail[0] === -1) {
865
- this.isSearchCount(0);
866
- }
867
- if (event.detail === true) {
868
- this.isSearchCount();
869
- }
870
- }, 100);
871
- }
872
- if (event.detail === true) {
873
- this.isEmpty(false);
874
- }
875
- if (this.runClearAndSelect) {
876
- this.runClearAndSelect = false;
877
- this.isSearchCount(true);
878
- }
879
- }
880
- }
881
- }
882
- }
883
- /**
884
- * @desc
885
- * @param newValue
886
- * @returns {void}
887
- */
888
- parseItems(newValue) {
889
- if (newValue) {
890
- typeof newValue == 'string'
891
- ? this.items = JSON.parse(newValue)
892
- : this.items = newValue;
893
- }
894
- this.handleChildProcess();
895
- }
896
- handleChange(newValue) {
897
- this.change.emit(newValue);
898
- this.listboxChange.emit(newValue);
899
- }
900
- handleChildProcess() {
901
- setTimeout(() => {
902
- this.onlyChilds = this.getAllGroup(this.el, true);
903
- this.total = this.onlyChilds.length;
904
- // console.log(this.total)
905
- // this.allChilds = this.getAllChilds()
906
- // this.total = this.allChilds.filter((v, i, a) => a.indexOf(v) === i).length
907
- if (this.total > 0) {
908
- // setTimeout(() => {
909
- this.isLoading(false);
910
- // }, 100);
911
- this.isEmpty(false);
912
- }
913
- else {
914
- // setTimeout(() => {
915
- this.isLoading(false);
916
- this.isEmpty(true);
917
- // }, 100);
918
- }
919
- }, 100);
920
- }
921
- /**
922
- * @desc
923
- */
924
- handleListboxClearSelected(event) {
925
- var path = event.path || (event.composedPath && event.composedPath());
926
- if (this.checkboxes == false && path && path.filter((input) => input['_internal_id'] == this._internal_id)[0] != undefined) {
927
- this.value = event.detail;
928
- this.selectedId = String(event.detail[this.objectMapping['id']]);
929
- this.listboxClearSelected.emit(event.detail);
930
- }
931
- }
932
- /**
933
- * @desc
934
- */
935
- handleListboxChecked(event, _internal_id = this._internal_id) {
936
- var path = event.path || (event.composedPath && event.composedPath());
937
- if ((path && path.filter((input) => input['_internal_id'] == this._internal_id)[0] != undefined) || _internal_id == this._internal_id) {
938
- this.listboxSendCheck.emit(event.detail);
939
- this.handleCheckList('add', event.detail);
940
- this.setIndeterminateState();
941
- }
942
- }
943
- /**
944
- * @desc
945
- */
946
- handleListboxUnchecked(event, _internal_id = this._internal_id) {
947
- var path = event.path || (event.composedPath && event.composedPath());
948
- if ((path && path.filter((input) => input['_internal_id'] == this._internal_id)[0] != undefined) || _internal_id == this._internal_id) {
949
- this.listboxSendUncheck.emit(event.detail);
950
- this.handleCheckList('remove', event.detail);
951
- this.setIndeterminateState();
952
- }
953
- }
954
- async listboxUncheckedMethod(item, internal_id = this._internal_id) {
955
- if (this.treeview) {
956
- await customElements.whenDefined("bcm-treeview");
957
- const bcmTreeview = this.el.shadowRoot.querySelector("bcm-treeview");
958
- if (bcmTreeview) {
959
- await bcmTreeview.treeviewUncheckedMethod(item);
960
- }
961
- }
962
- else {
963
- this.handleListboxUnchecked({ "detail": item }, internal_id);
964
- }
965
- }
966
- handleFocus(focusEvent = false) {
967
- this.onFocus = focusEvent;
968
- }
969
- render() {
970
- const { innerComponent, label, required, treeview, searchText, checkboxes, search, size, fullWidth, total, indeterminateState, checked, checklist, searchData, searchFields, _flex, returnField, searchSub, infoFooter, showSearch, noCaption, caption, captionError, captionType } = this;
971
- const bcmListbox = classnames('bcm-listbox', {
972
- 'error': captionType == 'error' ? true : false,
973
- 'full-width': fullWidth,
974
- 'flex': _flex
975
- });
976
- const classes = classnames('listbox-item', {
977
- 'hidden': this.totalSearch > 0
978
- });
979
- const classesContainer = classnames('listbox-item-container');
980
- const textContent = classnames('listbox-item-container-text-content', size, {
981
- 'size-2': size === 'small' || size === 'medium',
982
- 'size-3': size === 'large',
983
- });
984
- const listContainer = classnames('list-container', {
985
- 'column-1': this.numberOfColumns <= 1,
986
- 'column-2': this.numberOfColumns == 2,
987
- 'column-3': this.numberOfColumns >= 3,
988
- });
989
- const listContainerStyle = {
990
- 'grid-template-columns': this.numberOfColumns <= 1 ? '1fr' : 'repeat(' + this.numberOfColumns + ', ' + (210 - (this.numberOfColumns * 10)) + 'px)'
991
- };
992
- const hostClasses = classnames(this.hidden ? 'hidden' : null,
993
- // this.totalSearch > 0 ? 'hidden' : null,
994
- {
995
- 'flex': _flex,
996
- 'full-width': fullWidth
997
- });
998
- var customStyles = {
999
- 'max-height': this.maxHeight
1000
- };
1001
- const customStylesList = {
1002
- 'min-height': this.height ? "inherit" : this.maxHeight ? "auto" : "200px"
1003
- };
1004
- if (this.height) {
1005
- customStyles = Object.assign(Object.assign({}, customStyles), { 'height': this.height });
1006
- }
1007
- const captionClasses = classnames('size-1', 'input-caption', 'caption-' + captionType);
1008
- return (h(Host, { class: hostClasses, style: customStyles, "bcm-internal-id": this._internal_id }, !innerComponent && label && h("div", null, h("bcm-label", { tooltip: this.tooltip, type: captionType, value: label, required: required })), treeview === true && (h("bcm-treeview", { _internal_id: this._internal_id })), treeview == false && (h("div", { class: bcmListbox, style: customStyles }, search && (h("div", { class: "search", id: "search", style: { 'display': String(showSearch) == 'false' ? 'none' : 'block' } }, h("bcm-old-search", { _internal_id: this._internal_id, searchPlaceholder: this.searchPlaceholder, searchValue: searchText, "on-bcm-focus": () => this.handleFocus(true), "on-bcm-blur": () => this.handleFocus(false), data: searchData, returnField: returnField, searchFields: searchFields, searchSub: searchSub, clearable: true }), h("bcm-divider", null))), h("div", { id: "bcm-listbox-list", class: "bcm-listbox-list loading", style: customStylesList }, checkboxes && (h("div", { class: classes, id: "checkall" }, h("div", { class: classesContainer, onClick: () => this.handleIndeterminateClick() }, h("div", { class: "check-content" }, indeterminateState == 'indeterminate' && (h("span", { class: "indeterminate" })) || (h("bcm-checkbox-lite", { onClick: (e) => this.handleCheckboxClick(e), checked: checked, "no-caption": true }))), h("div", { class: textContent }, "Select All")), h("div", { class: "divider" }, h("bcm-divider", null)))),
1009
- // this.empty == false && (
1010
- h("div", { id: "list-container", class: listContainer, style: listContainerStyle }, this.items.length !== 0 && this.items.map((item) => ((item.type === 'group' ? this.recursiveGroupRenderer(item) : this.itemRenderer(item)))))
1011
- // )
1012
- ,
1013
- // this.loading && (
1014
- h("div", { id: "loading", class: "loading show" }, h("bcm-icon", { class: "prefix", icon: "far fa-spinner-third fa-spin" }))
1015
- // )
1016
- ,
1017
- // ( this.empty || total == 0 ) && (
1018
- h("div", { id: "empty", class: "empty" }, h("bcm-empty", null, "No Data"))
1019
- // )
1020
- ), infoFooter == true && (h("div", { class: "bcm-listbox-footer" }, h("bcm-text", { scale: "size-1", color: "grey-8" }, checklist.length > 0 && (' ( ' + checklist.length + ' selected ) '), "Total ", h("span", { id: "in-search" }), " ", h("span", { id: "in-total" }, total), " items found."))))), !noCaption && (h("div", { class: "caption-area" }, captionType == "error"
1021
- ? h("span", { class: captionClasses }, " ", captionError, " ")
1022
- : caption && h("span", { class: captionClasses }, " ", caption, " ")))));
1023
- }
1024
- get el() { return getElement(this); }
1025
- static get watchers() { return {
1026
- "_items": ["parseItems"],
1027
- "value": ["handleChange"]
1028
- }; }
1029
- };
1030
- BcmListbox.style = listboxCss;
1031
-
1032
- const listboxGroupCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:block}:host(.hidden){display:none}.listbox-group-title{padding:4px 16px;background-color:var(--bcm-color-grey-7);position:sticky;top:0;z-index:1}";
1033
-
1034
- const uppercase = (str) => str.toUpperCase();
1035
- const BcmListboxGroup = class {
1036
- constructor(hostRef) {
1037
- registerInstance(this, hostRef);
1038
- this.text = undefined;
1039
- this._id = (Math.random() * 4).toString(16).replace('.', '');
1040
- this.hidden = false;
1041
- }
1042
- componentWillLoad() {
1043
- this.text = uppercase(this.text);
1044
- }
1045
- render() {
1046
- const { text } = this;
1047
- const classes = classnames('listbox-group');
1048
- const classesTitle = classnames('listbox-group-title');
1049
- const hostClasses = classnames(this.hidden ? 'hidden' : null);
1050
- return (h(Host, { class: hostClasses }, h("div", { class: classes }, h("div", { class: classesTitle }, h("bcm-text", { "font-size": "3", color: "slate-100" }, " ", text, " ")), h("slot", null))));
1051
- }
1052
- };
1053
- BcmListboxGroup.style = listboxGroupCss;
1054
-
1055
- const listboxItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:flex;flex:1}:host(.hidden){display:none}.listbox-item{display:flex;flex:1;align-items:stretch;justify-content:flex-start;color:var(--bcm-color-grey-8);user-select:none;background-color:var(--bcm-color-grey-1);display:none}.listbox-item.display{display:flex}.listbox-item-container{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;padding-left:8px;flex:1}.listbox-item-container .avatar{margin-right:4px}.listbox-item-container .check-content{display:flex;align-items:center;justify-content:flex-start;width:16px;min-width:16px;margin-right:4px}.listbox-item-container .check-content .indeterminate{width:16px;height:16px;position:relative;display:block;padding-right:8px;cursor:pointer}.listbox-item-container .check-content .indeterminate:after{content:\"\";position:absolute;top:50%;left:9px;width:10px;height:10px;background-color:var(--bcm-color-prime-blue-6);transform:translate(-50%, -50%);opacity:1;z-index:1}.listbox-item-container .check-content .indeterminate:before{content:\"\";position:absolute;top:-1px;left:0px;width:16px;height:100%;border-radius:2px;background-color:transparent;border:1px solid var(--bcm-color-grey-5);opacity:1;z-index:2}.listbox-item-container .check-content .indeterminate:hover:not(.disabled):before{border-color:var(--bcm-color-prime-blue-6);box-shadow:0px 2px 4px rgba(54, 121, 171, 0.5)}.listbox-item-container-html-content{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;cursor:pointer;flex:1}.listbox-item-container-html-content #text .highlight{background-color:var(--bcm-color-yellow-5)}.listbox-item-container-html-content.small{padding:0 8px 0 4px;padding:4px 8px 4px 4px}.listbox-item-container-html-content.medium{padding:8px 8px 8px 4px}.listbox-item-container-html-content.large{padding:8px 8px 8px 4px}.listbox-item-container-text-content{display:flex;align-items:center;justify-content:space-between;flex-direction:row;cursor:pointer;width:100%}.listbox-item-container-text-content #text .highlight{background-color:var(--bcm-color-yellow-5)}.listbox-item-container-text-content.small{padding:0 8px 0 4px;padding:4px 8px 4px 4px}.listbox-item-container-text-content.medium{padding:8px 8px 8px 4px}.listbox-item-container-text-content.large{padding:8px 8px 8px 4px}.listbox-item-container-text-content .icon{text-align:center;margin-right:8px}.listbox-item-container-text-content>div{display:flex;align-items:center;flex-direction:row;word-wrap:break-word}.listbox-item-container.disabled{color:var(--bcm-color-grey-6)}.listbox-item-container.selected{color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.listbox-item-container.selected:hover:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.listbox-item-container:hover:not(.disabled),.listbox-item-container:active:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}";
1056
-
1057
- const BcmListboxItem = class {
1058
- constructor(hostRef) {
1059
- registerInstance(this, hostRef);
1060
- this.listboxItemSelected = createEvent(this, "bcm-listbox-item-selected", 7);
1061
- this.listboxUnchecked = createEvent(this, "bcm-listbox-unchecked", 7);
1062
- this.listboxChecked = createEvent(this, "bcm-listbox-checked", 7);
1063
- this.objectMapping = {
1064
- 'id': "id",
1065
- 'text': "text",
1066
- 'icon': "icon",
1067
- 'avatar': "avatar",
1068
- 'avatarName': "avatarName",
1069
- 'avatarImage': "avatarImage",
1070
- 'secondaryText': "secondaryText",
1071
- 'tooltipText': "tooltipText",
1072
- 'selected': "selected",
1073
- 'checked': "checked",
1074
- 'disabled': "disabled",
1075
- };
1076
- this.display = true;
1077
- this.avatar = false;
1078
- this.avatarImage = undefined;
1079
- this.avatarName = undefined;
1080
- this.secondaryText = undefined;
1081
- this.tooltipText = undefined;
1082
- this.text = undefined;
1083
- this._id = (Math.random() * 4).toString(16).replace('.', '');
1084
- this.size = 'medium';
1085
- this.icon = 'bug';
1086
- this.open = false;
1087
- this.selected = false;
1088
- this.checkboxes = false;
1089
- this.showIcon = false;
1090
- this.checked = false;
1091
- this.focused = false;
1092
- this.hidden = false;
1093
- this.itemObject = undefined;
1094
- this.disabled = false;
1095
- this.highlight = undefined;
1096
- this._internal_id = "";
1097
- this.template = null;
1098
- }
1099
- componentDidLoad() {
1100
- if (!this.disabled) {
1101
- if (this.selected === true) {
1102
- this.listboxItemSelected.emit(this.itemObject);
1103
- }
1104
- this.checkboxes === true && (this.checked === true && (this.listboxChecked.emit(this._id)));
1105
- }
1106
- }
1107
- /**
1108
- * @desc
1109
- */
1110
- handleClick() {
1111
- if (!this.disabled) {
1112
- this.checkboxes === true && (this.checked === true && (this.listboxUnchecked.emit(this._id)) || (this.listboxChecked.emit(this._id)));
1113
- this.checkboxes === false && (this.selected = true,
1114
- this.listboxItemSelected.emit(this.itemObject));
1115
- }
1116
- }
1117
- handleCheckboxClick(e) {
1118
- e.preventDefault();
1119
- }
1120
- isInternal(event) {
1121
- var path = event.path || (event.composedPath && event.composedPath());
1122
- const detect = path
1123
- && path[0]
1124
- && path[0].attributes
1125
- && path[0].attributes['bcm-internal-id']
1126
- && path[0].attributes['bcm-internal-id'].value;
1127
- return detect == this._internal_id;
1128
- }
1129
- /**
1130
- * @descc
1131
- * @param event
1132
- */
1133
- ListenListboxCheck(event) {
1134
- if (this.isInternal(event)) {
1135
- if (!this.disabled) {
1136
- if (event.detail && event.detail === this._id) {
1137
- this.checked = true;
1138
- }
1139
- }
1140
- }
1141
- }
1142
- /**
1143
- * @descc
1144
- * @param event
1145
- */
1146
- ListenListboxUncheck(event) {
1147
- if (this.isInternal(event)) {
1148
- if (!this.disabled) {
1149
- if (event.detail && event.detail === this._id) {
1150
- this.checked = false;
1151
- }
1152
- }
1153
- }
1154
- }
1155
- /**
1156
- * @descc
1157
- * @param event
1158
- */
1159
- handleListboxClearSelecteds(event) {
1160
- if (this.checkboxes == false && this.isInternal(event)) {
1161
- if (!this.disabled) {
1162
- if (event.detail) {
1163
- if (event.detail !== this.itemObject) {
1164
- this.selected = false;
1165
- }
1166
- else {
1167
- this.selected = true;
1168
- }
1169
- }
1170
- }
1171
- }
1172
- }
1173
- templateParser(template) {
1174
- var rxp = /{{([^}]+)}}/g, str = template, curMatch;
1175
- while (curMatch = rxp.exec(str)) {
1176
- template = template.replace("{{" + curMatch[1] + "}}", this.itemObject[curMatch[1]]);
1177
- }
1178
- return template;
1179
- }
1180
- render() {
1181
- const { display, focused, selected, size, showIcon, icon, checkboxes, _id, checked, text, avatarName, avatarImage, avatar, secondaryText, tooltipText } = this;
1182
- const classes = classnames('listbox-item', {
1183
- 'disabled': this.disabled,
1184
- 'display': display
1185
- });
1186
- const classesContainer = classnames('listbox-item-container', {
1187
- 'disabled': this.disabled,
1188
- 'focus': focused,
1189
- 'selected': selected
1190
- });
1191
- const textContent = classnames('listbox-item-container-text-content', size, {
1192
- 'disabled': this.disabled,
1193
- 'size-2': size === 'small' || size === 'medium',
1194
- 'size-3': size === 'large',
1195
- });
1196
- const hostClasses = classnames(this.hidden ? 'hidden' : null);
1197
- const htmlContent = classnames('listbox-item-container-html-content', size, {
1198
- 'disabled': this.disabled,
1199
- 'size-2': size === 'small' || size === 'medium',
1200
- 'size-3': size === 'large',
1201
- });
1202
- return (h(Host, { class: hostClasses }, h("div", { class: classes }, h("div", { class: classesContainer, onClick: () => this.handleClick() }, checkboxes && (h("div", { class: "check-content" }, h("bcm-checkbox-lite", { id: 'check-' + _id, onClick: (e) => this.handleCheckboxClick(e), checked: checked, disabled: this.disabled }))), this.template && (h("div", { class: htmlContent, title: tooltipText, innerHTML: this.templateParser(this.template) })), this.template == null && (h("div", { class: textContent, title: tooltipText }, h("div", null, (avatar || avatarName || avatarImage) && (h("div", { class: "avatar" }, h("bcm-avatar", Object.assign({ size: "small", name: text }, avatarName && { name: avatarName }, avatarImage && { image: avatarImage })))), showIcon && icon && (h("bcm-icon", { class: "icon", icon: icon })), text && (h("span", { id: "text" }, text)) || (h("slot", null))), h("div", null, (secondaryText) && (h("div", { class: "secondaryText size-1" }, secondaryText)))))))));
1203
- }
1204
- get el() { return getElement(this); }
1205
- };
1206
- BcmListboxItem.style = listboxItemCss;
1207
-
1208
- const oldSearchCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:block}:host(.hidden){display:none}";
1209
-
1210
- const lowercase$1 = (str) => str.toLowerCase();
1211
- const BcmOldSearch = class {
1212
- constructor(hostRef) {
1213
- registerInstance(this, hostRef);
1214
- this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
1215
- this.bcmOnSearchValue = createEvent(this, "bcm-on-search-value", 7);
1216
- this.data = [];
1217
- this.searchFields = ['text', 'value' /*, ...*/];
1218
- this.returnField = 'idx';
1219
- this.searchSub = null;
1220
- this.hidden = false;
1221
- this.onlyChild = false;
1222
- this.clearable = false;
1223
- this.searchValue = '';
1224
- this.searchPlaceholder = 'Search';
1225
- this.disabled = false;
1226
- this._internal_id = (Math.random() * 4).toString(16).replace('.', '');
1227
- this.results = [];
1228
- }
1229
- getInput() {
1230
- return this.el.shadowRoot.querySelector('bcm-old-input');
1231
- }
1232
- componentDidLoad() {
1233
- this.getInput().clearable = this.clearable;
1234
- }
1235
- listenBcmChange(e) {
1236
- e.stopPropagation();
1237
- }
1238
- async setValue(value) {
1239
- await this.getInput().setValue(value);
1240
- return value;
1241
- }
1242
- async select() {
1243
- await this.getInput().select();
1244
- this.bcmOnSearch.emit(true);
1245
- return true;
1246
- }
1247
- async setClear() {
1248
- await this.getInput().setClear();
1249
- this.bcmOnSearch.emit(true);
1250
- return true;
1251
- }
1252
- async searchArray(value, idFields = null) {
1253
- // console.log(this.data)
1254
- let cacheSearchFields = this.searchFields;
1255
- let arrayResult = [];
1256
- if (idFields) {
1257
- this.searchFields = [idFields];
1258
- }
1259
- value.forEach(item => {
1260
- // item = {[idFields]:item}
1261
- this.results = [];
1262
- // console.log(this.data)
1263
- this.nestedSearch(this.data, item, true);
1264
- arrayResult.push(...this.results);
1265
- });
1266
- this.searchFields = cacheSearchFields;
1267
- return arrayResult;
1268
- // await this.getInput().setValue( value )
1269
- // return value
1270
- }
1271
- nestedSearch(items, value, equal = false) {
1272
- var result;
1273
- items && (items.map((item) => {
1274
- this.searchFields.map(searchField => {
1275
- if (searchField in item) {
1276
- // debugger;
1277
- item[searchField] = lowercase$1(String(item[searchField]));
1278
- if (this.onlyChild) {
1279
- if (item[this.searchSub]) {
1280
- var temp = this.nestedSearch(item[this.searchSub], value, equal);
1281
- if (temp) {
1282
- this.results.push((result = String(item[this.returnField])));
1283
- this.results.push(temp);
1284
- }
1285
- }
1286
- else {
1287
- if (equal) {
1288
- // console.log(value)
1289
- if (item[searchField] == lowercase$1(String(value))) {
1290
- // if (item == lowercase(value)) {
1291
- this.results.push((result = String(item[this.returnField])));
1292
- // this.results.push (result = String(item))
1293
- }
1294
- }
1295
- else {
1296
- if (item[searchField].indexOf(lowercase$1(value)) !== -1) {
1297
- this.results.push((result = String(item[this.returnField])));
1298
- }
1299
- }
1300
- }
1301
- }
1302
- else {
1303
- if (item[this.searchSub]) {
1304
- var temp = this.nestedSearch(item[this.searchSub], value, equal);
1305
- if (temp) {
1306
- this.results.push((result = String(item[this.returnField])));
1307
- this.results.push(temp);
1308
- }
1309
- }
1310
- if (equal) {
1311
- // console.log(value)
1312
- if (item[searchField] == lowercase$1(String(value))) {
1313
- // if (item == lowercase(value)) {
1314
- this.results.push((result = String(item[this.returnField])));
1315
- // this.results.push (result = String(item))
1316
- }
1317
- }
1318
- else {
1319
- if (item[searchField].indexOf(lowercase$1(value)) !== -1) {
1320
- this.results.push((result = String(item[this.returnField])));
1321
- }
1322
- }
1323
- }
1324
- }
1325
- });
1326
- }));
1327
- return result;
1328
- }
1329
- /**
1330
- * @desc
1331
- * @param value
1332
- */
1333
- inputChange(value) {
1334
- this.results = [];
1335
- // data prop'unda arama yapılacak (searchFields prop'u içerisindeki alanlar ile)
1336
- // arama sonucunda eşleyen itemların 'idx', index
1337
- // değerleri, array şeklinde root component'e
1338
- // event ile gönderilecek
1339
- // Örneğin value == 'to' olduğunda aşağıdaki
1340
- // sonuçlar filtrelenmeli
1341
- // -->
1342
- //{ text: 'Mateusz Eaton', idx: 2 },
1343
- //{ text: 'Tony Vickers', idx: 3 },
1344
- // result array'i eşleşen itemların
1345
- // index numaralarını tutacak
1346
- // results = [2, 3]
1347
- // Örnek arama
1348
- // #
1349
- this.nestedSearch(this.data, value);
1350
- this.results = Array.from(new Set(this.results));
1351
- (value && ((this.results.length > 0 && this.bcmOnSearch.emit(this.results)) || this.bcmOnSearch.emit([-1]))) || this.bcmOnSearch.emit(true);
1352
- this.bcmOnSearchValue.emit(value);
1353
- }
1354
- render() {
1355
- const hostClasses = classnames(this.hidden ? 'hidden' : null);
1356
- return (h(Host, { class: hostClasses }, h("bcm-old-input", { placeholder: this.searchPlaceholder, "no-caption": true, "no-margin": true, "full-width": true, disabled: this.disabled, type: "search", "on-bcm-change": e => this.inputChange(e.detail), value: this.searchValue })));
1357
- }
1358
- get el() { return getElement(this); }
1359
- static get watchers() { return {
1360
- "searchValue": ["inputChange"]
1361
- }; }
1362
- };
1363
- BcmOldSearch.style = oldSearchCss;
1364
-
1365
- const treeviewCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:flex;flex-direction:column;height:100%;max-height:100%;border:1px solid var(--bcm-color-grey-5);box-sizing:border-box;background-color:#ffffff}:host(.empty) .treeview{display:flex;align-items:center;justify-content:center}.search{padding:8px;padding-bottom:0;margin-bottom:4px}.treeview{height:100%;max-height:100%;overflow:auto;background-color:var(--bcm-color-grey-1);padding:0 8px 8px 0}.treeview.loading{min-height:150px;position:relative;margin:0 8px 8px 8px}.treeview .loading{display:none;align-items:center;justify-content:center;height:100%;width:100%;position:absolute;background-color:rgba(255, 255, 255, 0.03)}.treeview .loading.show{display:flex}.treeview .empty{display:none;align-items:center;justify-content:center;height:100%}.treeview .empty bcm-empty{width:fit-content;margin:auto}.treeview .empty.show{display:flex}footer{text-align:right;padding:4px 8px;background-color:var(--bcm-color-grey-3);user-select:none}";
1366
-
1367
- /**
1368
- * @desc
1369
- * @param str
1370
- */
1371
- const lowercase = (str) => str.toLowerCase();
1372
- const Bcmtreeview = class {
1373
- constructor(hostRef) {
1374
- registerInstance(this, hostRef);
1375
- this.treeviewChange = createEvent(this, "bcm-treeview-change", 7);
1376
- this.treeviewSendCheck = createEvent(this, "bcm-treeview-send-check", 7);
1377
- this.treeviewSendUncheck = createEvent(this, "bcm-treeview-send-uncheck", 7);
1378
- this.treeviewChecklist = createEvent(this, "bcm-treeview-checklist", 7);
1379
- this.treeviewItemSelected = createEvent(this, "bcm-treeview-item-selected", 7);
1380
- this.treeviewClearSelecteds = createEvent(this, "bcm-treeview-clear-selecteds", 7);
1381
- this.treeviewShowContext = createEvent(this, "bcm-treeview-show-context", 7);
1382
- this.treeviewUnchecked = createEvent(this, "bcm-treeview-unchecked", 7);
1383
- this.treeviewChecked = createEvent(this, "bcm-treeview-checked", 7);
1384
- this.objectMapping = {
1385
- 'text': 'text',
1386
- 'icon': 'icon',
1387
- 'id': 'id',
1388
- 'items': 'items',
1389
- 'open': 'open',
1390
- 'selected': 'selected',
1391
- 'checked': 'checked',
1392
- 'tooltipText': 'tooltipText',
1393
- 'disabled': "disabled",
1394
- 'favorite': "favorite",
1395
- };
1396
- this.checkedObjectList = [];
1397
- this.allChilds = [];
1398
- this.onFocus = false;
1399
- this.minHeight = 200;
1400
- this.minWidth = 200;
1401
- this.allOpenCache = false;
1402
- this.allOpenOnSearch = false;
1403
- this.parentLength = [{}];
1404
- this.isSetData = false;
1405
- this.runClearAndSelect = false;
1406
- /**
1407
- * Component States
1408
- */
1409
- this.empty = false;
1410
- this.checkboxes = false;
1411
- this.showIcon = false;
1412
- this.size = 'medium';
1413
- this.selectedId = undefined;
1414
- this.checkedList = [];
1415
- this.updateCheckedList = [];
1416
- this.hidden = false;
1417
- this.search = false;
1418
- this.searchOnlyChild = false;
1419
- this.keydown = false;
1420
- this.allOpen = false;
1421
- this.fullWidth = false;
1422
- this.infoFooter = false;
1423
- this.searchFields = ['text', 'secondaryText', 'tooltipText'];
1424
- this.searchSub = "items";
1425
- this.returnField = "id";
1426
- this._items = [];
1427
- this.searchPlaceholder = "Search";
1428
- this.maxHeight = null;
1429
- this.highlight = false;
1430
- this.loading = true;
1431
- this.favIcon = false;
1432
- this.favIconOnlyChilds = false;
1433
- this._internal_id = (Math.random() * 4).toString(16).replace('.', '');
1434
- this.showSearch = true;
1435
- this.items = [];
1436
- this.total = 0;
1437
- this.checkCount = 0;
1438
- this.focusedElement = undefined;
1439
- this.keyMapForFocus = { 18: false, 87: false };
1440
- this.checklist = [];
1441
- this.favoriteList = [];
1442
- this.checklistSorted = [];
1443
- this.searchData = undefined;
1444
- this.searchResults = [];
1445
- }
1446
- async setData(_data = []) {
1447
- this.clearAndSelectSearch(false);
1448
- this.isLoading(true);
1449
- this.isSetData = true;
1450
- this.checkedObjectList = [];
1451
- this.selectedId = null;
1452
- setTimeout(() => {
1453
- this._items = _data;
1454
- this.searchData = JSON.parse(_data);
1455
- this.calculateMinSizes();
1456
- this.handleChildProcess();
1457
- }, 100);
1458
- return Promise.resolve(true);
1459
- }
1460
- async getChecklist() {
1461
- return this.checkedObjectList;
1462
- }
1463
- async getFavorites() {
1464
- this.getChildItem(this.el).forEach(element => {
1465
- element[this.objectMapping['favorite']] == true && (this.favIconOnlyChilds && element[this.objectMapping['items']].length == 0 && (this.favoriteList.indexOf(element.itemObject) < 0 && (this.favoriteList.push(element.itemObject))),
1466
- !this.favIconOnlyChilds && (this.favoriteList.indexOf(element.itemObject) < 0 && (this.favoriteList.push(element.itemObject))));
1467
- });
1468
- return this.favoriteList;
1469
- }
1470
- async selected(id) {
1471
- this.selectedId = id;
1472
- }
1473
- async clearAndSelectSearch(select = true) {
1474
- this.runClearAndSelect = true;
1475
- if (this.search === true) {
1476
- setTimeout(() => {
1477
- var searchInput = null;
1478
- searchInput = this.el.shadowRoot.querySelector("bcm-old-search");
1479
- if (searchInput) {
1480
- searchInput.setClear();
1481
- if (select == true) {
1482
- searchInput.select();
1483
- }
1484
- }
1485
- }, 100);
1486
- }
1487
- }
1488
- async addChecked(items = []) {
1489
- this.checkedList = items;
1490
- }
1491
- async updateChecked(items = []) {
1492
- this.updateCheckedList = items;
1493
- }
1494
- async config(_config) {
1495
- if (_config['maxHeight']) {
1496
- typeof _config['maxHeight'] == 'string'
1497
- ? this.maxHeight = _config['maxHeight']
1498
- : this.maxHeight = "100%";
1499
- }
1500
- if (_config['searchFields']) {
1501
- if (Array.isArray(_config['searchFields'])) {
1502
- this.searchFields = _config['searchFields'];
1503
- }
1504
- }
1505
- if (_config['searchable']) {
1506
- typeof _config['searchable'] == 'boolean'
1507
- ? this.search = _config['searchable']
1508
- : this.search = false;
1509
- }
1510
- if (_config['searchOnlyChild']) {
1511
- typeof _config['searchOnlyChild'] == 'boolean'
1512
- ? this.searchOnlyChild = _config['searchOnlyChild']
1513
- : this.searchOnlyChild = false;
1514
- }
1515
- if (_config['searchPlaceholder']) {
1516
- typeof _config['searchPlaceholder'] == 'string'
1517
- ? this.searchPlaceholder = _config['searchPlaceholder']
1518
- : this.searchPlaceholder = null;
1519
- }
1520
- if (_config['fullWidth']) {
1521
- typeof _config['fullWidth'] == 'boolean'
1522
- ? this.fullWidth = _config['fullWidth']
1523
- : this.fullWidth = false;
1524
- }
1525
- if (_config['infoFooter']) {
1526
- typeof _config['infoFooter'] == 'boolean'
1527
- ? this.infoFooter = _config['infoFooter']
1528
- : this.infoFooter = false;
1529
- }
1530
- if (_config['highlight']) {
1531
- typeof _config['highlight'] == 'boolean'
1532
- ? this.highlight = _config['highlight']
1533
- : this.highlight = false;
1534
- }
1535
- if (_config['checkable']) {
1536
- typeof _config['checkable'] == 'boolean'
1537
- ? this.checkboxes = _config['checkable']
1538
- : this.checkboxes = false;
1539
- }
1540
- if (_config['showIcon']) {
1541
- typeof _config['showIcon'] == 'boolean'
1542
- ? this.showIcon = _config['showIcon']
1543
- : this.showIcon = false;
1544
- }
1545
- if (_config['favIcon']) {
1546
- typeof _config['favIcon'] == 'boolean'
1547
- ? this.favIcon = _config['favIcon']
1548
- : this.favIcon = false;
1549
- }
1550
- if (_config['favIconOnlyChilds']) {
1551
- typeof _config['favIconOnlyChilds'] == 'boolean'
1552
- ? this.favIconOnlyChilds = _config['favIconOnlyChilds']
1553
- : this.favIconOnlyChilds = false;
1554
- }
1555
- if (_config['allOpen']) {
1556
- typeof _config['allOpen'] == 'boolean'
1557
- ? this.allOpen = _config['allOpen']
1558
- : this.allOpen = false;
1559
- }
1560
- this.allOpenCache = this.allOpen;
1561
- if (_config['size']) {
1562
- (["small", "medium", "large"].indexOf(_config['size']) >= 0)
1563
- ? this.size = _config['size']
1564
- : this.size = 'medium';
1565
- }
1566
- if (_config['mapping']) {
1567
- if (_config['mapping']['text']) {
1568
- this.objectMapping['text'] = _config['mapping']['text'];
1569
- }
1570
- if (_config['mapping']['icon']) {
1571
- this.objectMapping['icon'] = _config['mapping']['icon'];
1572
- }
1573
- if (_config['mapping']['id']) {
1574
- this.objectMapping['id'] = _config['mapping']['id'];
1575
- this.returnField = this.objectMapping['id'];
1576
- }
1577
- if (_config['mapping']['items']) {
1578
- this.objectMapping['items'] = _config['mapping']['items'];
1579
- this.searchSub = this.objectMapping['items'];
1580
- }
1581
- if (_config['mapping']['open']) {
1582
- this.objectMapping['open'] = _config['mapping']['open'];
1583
- }
1584
- if (_config['mapping']['selected']) {
1585
- this.objectMapping['selected'] = _config['mapping']['selected'];
1586
- }
1587
- if (_config['mapping']['checked']) {
1588
- this.objectMapping['checked'] = _config['mapping']['checked'];
1589
- }
1590
- if (_config['mapping']['tooltipText']) {
1591
- this.objectMapping['tooltipText'] = _config['mapping']['tooltipText'];
1592
- }
1593
- if (_config['mapping']['disabled']) {
1594
- this.objectMapping['disabled'] = _config['mapping']['disabled'];
1595
- }
1596
- if (_config['mapping']['favorite']) {
1597
- this.objectMapping['favorite'] = _config['mapping']['favorite'];
1598
- }
1599
- }
1600
- // sessionStorage.setItem(this._internal_id + "-config", JSON.stringify(_config));
1601
- return Promise.resolve(true);
1602
- }
1603
- calculateMinSizes() {
1604
- if (this.minHeight < this.el.clientHeight) {
1605
- this.minHeight = this.el.clientHeight;
1606
- }
1607
- }
1608
- connectedCallback() { }
1609
- componentWillLoad() { }
1610
- componentWillRender() {
1611
- if (sessionStorage.getItem(this._internal_id + "-config")) {
1612
- this.config(JSON.parse(sessionStorage.getItem(this._internal_id + "-config")));
1613
- }
1614
- }
1615
- componentDidRender() {
1616
- // this.isEmpty(true)
1617
- // if(this.total > 0) {
1618
- // this.isEmpty(false)
1619
- // }
1620
- }
1621
- // componentDidLoad(){
1622
- // this.handleChildProcess()
1623
- // setTimeout(() => {
1624
- // if(this.isSetData) {
1625
- // this.isLoading(true)
1626
- // this.isEmpty(false)
1627
- // }else{
1628
- // this.isLoading(false)
1629
- // this.isEmpty(true)
1630
- // }
1631
- // }, 1000);
1632
- // // this.isEmpty(true)
1633
- // }
1634
- componentWillUpdate() { }
1635
- // componentWillRender(){}
1636
- // componentDidRender(){}
1637
- componentDidUpdate() {
1638
- if (this.checkboxes === true) {
1639
- this.checkedObjectList = [];
1640
- if (this.checklistSorted.length > 0) {
1641
- this.getChildItem(this.el).forEach(element => {
1642
- element.checked == true && (this.checkedObjectList.indexOf(element.itemObject) < 0 && (this.checkedObjectList.push(element.itemObject)));
1643
- });
1644
- this.treeviewChecklist.emit(this.checkedObjectList);
1645
- }
1646
- else {
1647
- this.treeviewChecklist.emit([]);
1648
- }
1649
- }
1650
- }
1651
- parseItems(newValue) {
1652
- if (newValue) {
1653
- typeof newValue == 'string'
1654
- ? this.items = JSON.parse(newValue)
1655
- : this.items = newValue;
1656
- }
1657
- this.handleChildProcess();
1658
- }
1659
- handleChildProcess() {
1660
- setTimeout(() => {
1661
- this.allChilds = this.getAllChilds();
1662
- this.total = this.allChilds.filter((v, i, a) => a.indexOf(v) === i).length;
1663
- if (this.total > 0) {
1664
- // setTimeout(() => {
1665
- this.isLoading(false);
1666
- // }, 100);
1667
- this.isEmpty(false);
1668
- }
1669
- else {
1670
- // setTimeout(() => {
1671
- this.isLoading(false);
1672
- this.isEmpty(true);
1673
- // }, 100);
1674
- }
1675
- }, 100);
1676
- }
1677
- /**
1678
- * @desc
1679
- * @param group
1680
- */
1681
- recursiveItemRenderer(group, parentGroup) {
1682
- const sId = String(this.selectedId);
1683
- const gId = String(group[this.objectMapping['id']]);
1684
- const isSelected = String(group[this.objectMapping['selected']]) === 'true' ? true : false;
1685
- if (sId === gId || isSelected) {
1686
- this.treeviewItemSelected.emit(group);
1687
- }
1688
- return (h("bcm-treeview-item", Object.assign({ _internal_id: this._internal_id, text: group[this.objectMapping['text']], icon: group[this.objectMapping['icon']], id: group[this.objectMapping['id']], size: this.size, "has-child": !!group[this.objectMapping['items']] }, (parentGroup && { 'parent-id': parentGroup[this.objectMapping['id']] }), (group[this.objectMapping['tooltipText']] && { tooltipText: group[this.objectMapping['tooltipText']] }), (String(group[this.objectMapping['checked']]) === "true" && { checkTrigger: true }), (String(group[this.objectMapping['open']]) === "true" && { open: true }), (String(group[this.objectMapping['selected']]) === "true" && { selected: true }), (String(group[this.objectMapping['disabled']]) === "true" && { disabled: true }), (group[this.objectMapping['items']] && { items: group[this.objectMapping['items']] }), (this.favIcon && !this.favIconOnlyChilds && { favicon: true }), (this.favIcon && this.favIconOnlyChilds && group[this.objectMapping['items']].length == 0 && { favicon: true }), (this.favIcon && group.rightSlot && { favorite: group.rightSlot[this.objectMapping['favorite']] }), (this.showIcon && { showIcon: true }), (String(this.checkboxes) === "true" && { checkboxes: true }), ((this.allOpen || this.allOpenOnSearch) && { open: true }), { itemObject: group }, ((this.checkedList && this.checkedList.find(e => e == group[this.objectMapping['id']]))) && { checkTrigger: true }, (this.updateCheckedList.length > 0 &&
1689
- ((this.updateCheckedList.find(e => e == group[this.objectMapping['id']])) && { checkTrigger: true }))), group[this.objectMapping['items']] && group[this.objectMapping['items']].map((item) => (this.recursiveItemRenderer(item, group)))));
1690
- }
1691
- /**
1692
- * @desc
1693
- */
1694
- handleCheckList(process = 'add', checkId) {
1695
- // console.log(checkId)
1696
- if (this.checkboxes === true) {
1697
- // const { checklist } = this
1698
- // checkId = Number(checkId)
1699
- switch (process) {
1700
- case 'add':
1701
- if (this.checklist.length > 0) {
1702
- this.checklist.indexOf(checkId) < 0 && (this.checklist = [...this.checklist, checkId]);
1703
- }
1704
- else {
1705
- this.checklist = [checkId];
1706
- }
1707
- break;
1708
- case 'remove':
1709
- this.checklist = this.checklist.filter(item => item !== checkId);
1710
- break;
1711
- }
1712
- let sorted = this.checklist.sort(function (a, b) { return a - b; });
1713
- this.checklistSorted = sorted;
1714
- // console.log('sorted: ', sorted)
1715
- this.checkCount = this.checklistSorted.length;
1716
- }
1717
- }
1718
- async showSearchMethod(val = true) {
1719
- this.showSearch = val;
1720
- // return val
1721
- }
1722
- async searchResultMethod(items = []) {
1723
- // this.listenSearchResult({ detail: items })
1724
- await customElements.whenDefined("bcm-old-search");
1725
- const search = this.el.shadowRoot.querySelector("bcm-old-search");
1726
- const detail = await search.searchArray(items, this.objectMapping['id']);
1727
- await this.listenSearchResult({ detail: detail });
1728
- // return true
1729
- }
1730
- isLoading(val) {
1731
- var treeview = this.el.shadowRoot.getElementById("treeview");
1732
- var loading = this.el.shadowRoot.getElementById("loading");
1733
- var searchInput = this.el.shadowRoot.querySelector("bcm-old-search");
1734
- // var listcontainer = this.el.shadowRoot.getElementById("list-container")
1735
- if (val === true) {
1736
- treeview && treeview.classList.add('loading');
1737
- loading && loading.classList.add('show');
1738
- if (searchInput) {
1739
- searchInput.disabled = true;
1740
- }
1741
- // listcontainer && listcontainer.classList.add('hidden')
1742
- }
1743
- else {
1744
- treeview && treeview.classList.remove('loading');
1745
- loading && loading.classList.remove('show');
1746
- if (searchInput) {
1747
- searchInput.disabled = false;
1748
- }
1749
- // listcontainer && listcontainer.classList.remove('hidden')
1750
- }
1751
- return false;
1752
- }
1753
- isEmpty(val) {
1754
- var empty = this.el.shadowRoot.getElementById("empty");
1755
- // var listcontainer = this.el.shadowRoot.getElementById("list-container")
1756
- if (val === true) {
1757
- empty && empty.classList.add('show');
1758
- // listcontainer && listcontainer.classList.add('hidden')
1759
- }
1760
- else {
1761
- empty && empty.classList.remove('show');
1762
- // listcontainer && listcontainer.classList.remove('hidden')
1763
- }
1764
- }
1765
- isSearchCount(val = null) {
1766
- if (this.infoFooter === true) {
1767
- var inSearch = this.el.shadowRoot.getElementById("in-search");
1768
- var inTotal = this.el.shadowRoot.getElementById("in-total");
1769
- if (val >= 0 && val != null && inSearch && inTotal) {
1770
- inSearch.innerHTML = val;
1771
- inTotal.style.display = "none";
1772
- }
1773
- else {
1774
- inTotal.style.display = "inline";
1775
- inSearch.innerHTML = "";
1776
- }
1777
- }
1778
- // if (val > 0){
1779
- // this.isEmpty(false)
1780
- // }
1781
- }
1782
- listenSearchResult(e) {
1783
- this.parentLength = [];
1784
- var searchValue = '';
1785
- // this.searchResults = e.detail
1786
- var totalSearch = e.detail.length;
1787
- this.empty = false;
1788
- var getAllChilds = this.getAllChilds();
1789
- this.isEmpty(false);
1790
- if (e.detail.length > 0) {
1791
- // this.allOpenOnSearch = true
1792
- if (e.detail[0] == -1) {
1793
- totalSearch = 0;
1794
- this.empty = true;
1795
- this.isEmpty(true);
1796
- }
1797
- if (getAllChilds.length > 0) {
1798
- getAllChilds.map((item) => {
1799
- var isParent = false;
1800
- if (this.searchOnlyChild && item.items && item.items.length > 0) {
1801
- isParent = true;
1802
- }
1803
- e.target.addEventListener('bcm-on-search-value', async (e) => {
1804
- searchValue = await e.detail;
1805
- var inputText = item.shadowRoot.getElementById("text");
1806
- inputText = inputText.textContent || inputText.innerText || "";
1807
- if (searchValue) {
1808
- var cacheInputText = lowercase(inputText);
1809
- var cacheSearchValue = lowercase(searchValue);
1810
- var index = cacheInputText.indexOf(cacheSearchValue);
1811
- if (index >= 0) {
1812
- if (isParent == false) {
1813
- if (this.parentLength.indexOf(item.id) === -1) {
1814
- this.parentLength.push(item.id);
1815
- }
1816
- if (this.highlight) {
1817
- inputText = inputText.substring(0, index)
1818
- + "<span class='highlight'>"
1819
- + inputText.substring(index, index + searchValue.length)
1820
- + "</span>"
1821
- + inputText.substring(index + searchValue.length);
1822
- }
1823
- }
1824
- }
1825
- }
1826
- item.shadowRoot.getElementById("text").innerHTML = inputText;
1827
- });
1828
- item.hidden = true;
1829
- var _ids = item.id;
1830
- if (e.detail.indexOf(_ids) >= 0) {
1831
- item.hidden = false;
1832
- item.open = true;
1833
- setTimeout(() => {
1834
- if (this.parentLength.indexOf(item.id) !== -1 && item.items && item.items.length > 0 && this.searchOnlyChild == false) {
1835
- const getChilds = (item) => {
1836
- this.getAllChilds(item).map(element => {
1837
- element.hidden = false;
1838
- element.open = true;
1839
- getChilds(element);
1840
- });
1841
- };
1842
- getChilds(item);
1843
- }
1844
- }, 1);
1845
- }
1846
- else {
1847
- item.hidden = true;
1848
- }
1849
- });
1850
- }
1851
- }
1852
- else {
1853
- // this.allOpenOnSearch = this.allOpenCache
1854
- if (getAllChilds.length > 0) {
1855
- getAllChilds.map((item) => {
1856
- item.hidden = false;
1857
- });
1858
- }
1859
- // this.isEmpty(true)
1860
- }
1861
- // if ( this.searchOnlyChild ) {
1862
- // this.isSearchCount(highlightLength)
1863
- // }else{
1864
- setTimeout(() => {
1865
- if (totalSearch >= 0) {
1866
- var totals = totalSearch - Number(totalSearch - this.parentLength.length);
1867
- this.isSearchCount(totals > 0 ? totals : 0);
1868
- }
1869
- else {
1870
- this.isSearchCount();
1871
- }
1872
- if (e.detail[0] === -1) {
1873
- this.isSearchCount(0);
1874
- }
1875
- if (e.detail === true) {
1876
- this.isSearchCount();
1877
- }
1878
- }, 100);
1879
- // }
1880
- if (e.detail === true) {
1881
- this.isEmpty(false);
1882
- }
1883
- }
1884
- getAllChilds(element = this.el) {
1885
- let returnAllItems = [];
1886
- getChilds(element, 'bcm-treeview-item').forEach(items => {
1887
- this.getAllChilds(items) && (returnAllItems.indexOf(items) < 0 && (returnAllItems.push(items))
1888
- // returnAllItems = [...returnAllItems, ...this.getAllChilds(items)]
1889
- );
1890
- returnAllItems.indexOf(items) < 0 && (returnAllItems.push(items));
1891
- // returnAllItems = [...returnAllItems,
1892
- // items
1893
- // ]
1894
- });
1895
- return returnAllItems;
1896
- }
1897
- /**
1898
- * @desc
1899
- */
1900
- handletreeviewItemSelected(event) {
1901
- this.treeviewClearSelecteds.emit(event.detail);
1902
- }
1903
- /**
1904
- * @desc
1905
- */
1906
- handletreeviewChecked(event) {
1907
- // this.treeviewSendCheck.emit(event.detail)
1908
- this.handleCheckList('add', event.detail);
1909
- // this.treeviewChange.emit(event.detail)
1910
- }
1911
- /**
1912
- * @desc
1913
- */
1914
- // @Listen('bcm-treeview-check-group-check')
1915
- // bcmTreeviewCheckGroupChecked(event: any) {
1916
- // console.log(event)
1917
- // this.treeviewSendCheck.emit(event.detail)
1918
- // this.handleCheckList('add',event.detail)
1919
- // this.treeviewChange.emit(event.detail)
1920
- // }
1921
- /**
1922
- * @desc
1923
- */
1924
- handletreeviewUnchecked(event) {
1925
- // this.treeviewSendUncheck.emit(event.detail)
1926
- this.handleCheckList('remove', event.detail);
1927
- // this.treeviewChange.emit(event.detail)
1928
- }
1929
- /**
1930
- * @desc
1931
- */
1932
- handletreeviewIndeterminateChecked(event) {
1933
- this.handleCheckList('add', event.detail);
1934
- }
1935
- /**
1936
- * @desc
1937
- */
1938
- handletreeviewIndeterminateUnchecked(event) {
1939
- this.handleCheckList('remove', event.detail);
1940
- }
1941
- treeviewUncheckedMethod(item) {
1942
- this.handletreeviewUnchecked({ "detail": item });
1943
- this.componentDidUpdate();
1944
- return Promise.resolve(true);
1945
- }
1946
- /**
1947
- * @desc
1948
- * Keyboard Navigation
1949
- */
1950
- getIndex(item) {
1951
- return Array.from(item.parentNode.children).indexOf(item);
1952
- }
1953
- /**
1954
- * @desc
1955
- * Keyboard Navigation
1956
- */
1957
- getNext(item) {
1958
- let returnItem = this.getChildItem(item.parentElement)[this.getIndex(item) + 1];
1959
- if (returnItem)
1960
- return returnItem;
1961
- return false;
1962
- }
1963
- /**
1964
- * @desc
1965
- * Keyboard Navigation
1966
- */
1967
- getPrev(item) {
1968
- let returnItem = this.getChildItem(item.parentElement)[this.getIndex(item) - 1];
1969
- if (returnItem)
1970
- return returnItem;
1971
- return false;
1972
- }
1973
- /**
1974
- * @desc
1975
- * Keyboard Navigation
1976
- */
1977
- getParent(item) {
1978
- if (lowercase(item.parentElement.tagName) == 'bcm-treeview') {
1979
- return false;
1980
- }
1981
- else {
1982
- return this.getChildItem(item.parentElement.parentElement)[this.getIndex(item.parentElement)];
1983
- }
1984
- }
1985
- /**
1986
- * @desc
1987
- * Keyboard Navigation
1988
- */
1989
- getNextParent(item) {
1990
- let getParent = this.getParent(item);
1991
- let getNext;
1992
- if (getParent) {
1993
- getNext = this.getNext(getParent);
1994
- if (getNext) {
1995
- return getNext;
1996
- }
1997
- else {
1998
- return this.getNextParent(getParent);
1999
- }
2000
- }
2001
- }
2002
- /**
2003
- * @desc
2004
- * Keyboard Navigation
2005
- */
2006
- getFirstItem(el = this.el) {
2007
- return this.getChildItem(el)[0];
2008
- }
2009
- /**
2010
- * @desc
2011
- * Keyboard Navigation
2012
- */
2013
- getLastItem(el = this.el) {
2014
- let childLength = this.getChildItem(el).length;
2015
- let lastChild = this.getChildItem(el)[childLength - 1];
2016
- if (this.getChildItem(lastChild).length > 0 && lastChild.open == true) {
2017
- return this.getLastItem(lastChild);
2018
- }
2019
- else {
2020
- return lastChild;
2021
- }
2022
- }
2023
- /**
2024
- * @desc
2025
- * Keyboard Navigation
2026
- */
2027
- getChildItem(element = this.el) {
2028
- let returnItems = getChilds(element, 'bcm-treeview-item');
2029
- if (returnItems)
2030
- return returnItems;
2031
- return 0;
2032
- }
2033
- /**
2034
- * @desc
2035
- */
2036
- handleRightClick(e) {
2037
- this.treeviewShowContext.emit([e.target.id, e.clientY, e.clientX]);
2038
- e.preventDefault();
2039
- }
2040
- /**
2041
- * @desc
2042
- */
2043
- keyboardNavigationUp(e) {
2044
- let { keyMapForFocus } = this;
2045
- if (e.keyCode in keyMapForFocus) {
2046
- keyMapForFocus[e.keyCode] = false;
2047
- }
2048
- }
2049
- /**
2050
- * @desc
2051
- */
2052
- keyboardNavigation(e) {
2053
- if (this.keydown) {
2054
- const { keyMapForFocus, focusedElement, el } = this;
2055
- this.focusedElement = !focusedElement ? el : focusedElement;
2056
- const which = e.which || 0;
2057
- if (this.getChildItem(el).length > 0) {
2058
- if (e.keyCode in keyMapForFocus) {
2059
- keyMapForFocus[e.keyCode] = true;
2060
- if (keyMapForFocus[18] && keyMapForFocus[87]) {
2061
- e.preventDefault();
2062
- this.focusedElement = this.getFirstItem(this.focusedElement);
2063
- }
2064
- }
2065
- if (which == 9 || //tab
2066
- which == 13 || //enter
2067
- which == 18 || //alt
2068
- which == 32 || //space
2069
- which == 35 || // end
2070
- which == 36 || // home
2071
- (which >= 35 && which <= 40) //end, home, left arrow, up arrow, right arrow, down arrow
2072
- ) {
2073
- e.preventDefault();
2074
- if (!focusedElement) {
2075
- this.focusedElement = this.getFirstItem(this.focusedElement);
2076
- }
2077
- else {
2078
- this.focusedElement.focused = false;
2079
- switch (which) {
2080
- case 13: // enter
2081
- this.focusedElement.selected = true;
2082
- break;
2083
- case 32: // space
2084
- this.focusedElement.checked && (this.treeviewUnchecked.emit(this.focusedElement.id)) || (this.treeviewChecked.emit(this.focusedElement.id));
2085
- break;
2086
- case 35: // end
2087
- this.focusedElement = this.getLastItem(this.focusedElement.parentElement);
2088
- break;
2089
- case 36: // home
2090
- this.focusedElement = this.getFirstItem(this.focusedElement.parentElement);
2091
- break;
2092
- case 37: // left arrow
2093
- if (this.getChildItem(this.focusedElement).length > 0 && this.focusedElement.open == true) {
2094
- this.focusedElement.open = false;
2095
- }
2096
- else {
2097
- if (this.getParent(this.focusedElement)) {
2098
- this.focusedElement = this.getParent(this.focusedElement);
2099
- }
2100
- }
2101
- break;
2102
- case 38: // up arrow
2103
- if (this.getPrev(this.focusedElement)) {
2104
- this.focusedElement = this.getPrev(this.focusedElement);
2105
- if (this.getChildItem(this.focusedElement).length > 0 && this.focusedElement.open == true) {
2106
- this.focusedElement = this.getLastItem(this.focusedElement);
2107
- }
2108
- }
2109
- else if (this.getParent(this.focusedElement)) {
2110
- this.focusedElement = this.getParent(this.focusedElement);
2111
- }
2112
- break;
2113
- case 39: // right arrow
2114
- if (this.getChildItem(this.focusedElement).length > 0) {
2115
- if (this.focusedElement.open == true) {
2116
- this.focusedElement = this.getFirstItem(this.focusedElement);
2117
- }
2118
- else {
2119
- this.focusedElement.open = true;
2120
- }
2121
- }
2122
- break;
2123
- case 40: // down arrow
2124
- if (this.getChildItem(this.focusedElement).length > 0 && this.focusedElement.open == true) {
2125
- this.focusedElement = this.getFirstItem(this.focusedElement);
2126
- }
2127
- else if (this.getNext(this.focusedElement)) {
2128
- this.focusedElement = this.getNext(this.focusedElement);
2129
- }
2130
- else if (this.getNextParent(this.focusedElement)) {
2131
- this.focusedElement = this.getNextParent(this.focusedElement);
2132
- }
2133
- break;
2134
- }
2135
- }
2136
- }
2137
- if (this.focusedElement)
2138
- this.focusedElement.focused = true;
2139
- }
2140
- }
2141
- }
2142
- handleFocus(focusEvent = false) {
2143
- this.onFocus = focusEvent;
2144
- }
2145
- render() {
2146
- const { searchOnlyChild, searchPlaceholder, search, checkCount, searchData, searchFields, searchSub, returnField, total, fullWidth, infoFooter, showSearch } = this;
2147
- const hostClasses = classnames(this.hidden ? 'hidden' : null, {
2148
- 'empty': this.empty,
2149
- 'full-width': fullWidth
2150
- });
2151
- const customStyles = {
2152
- // 'min-height': this.minHeight + 'px',
2153
- 'min-width': this.minWidth + 'px',
2154
- 'max-height': this.maxHeight
2155
- };
2156
- return (h(Host, { class: hostClasses, style: customStyles }, search && (h("div", { class: "search", style: { 'display': String(showSearch) == 'false' ? 'none' : 'block' } }, h("bcm-old-search", { onlyChild: searchOnlyChild, searchPlaceholder: searchPlaceholder, "on-bcm-focus": () => this.handleFocus(true), "on-bcm-blur": () => this.handleFocus(false), data: searchData, returnField: returnField, searchFields: searchFields, searchSub: searchSub, clearable: true }), h("bcm-divider", null))), h("div", { id: "treeview", class: "treeview loading" },
2157
- // this.loading && (
2158
- h("div", { id: "loading", class: "loading show" }, h("bcm-icon", { class: "prefix", icon: "far fa-spinner-third fa-spin" }))
2159
- // )
2160
- ,
2161
- // this.empty && (
2162
- h("div", { id: "empty", class: "empty" }, h("bcm-empty", null, "No Data"))
2163
- // )
2164
- , !this.empty && this.items.length !== 0 && this.items.map((item) => (this.recursiveItemRenderer(item, null)))), infoFooter == true && (h("footer", null, h("bcm-text", { scale: "size-1", color: "grey-8" }, checkCount > 0 && ('( ' + checkCount + ' items selected ) '), "Total ", h("span", { id: "in-search" }), " ", h("span", { id: "in-total" }, total), " items found.")))));
2165
- }
2166
- get el() { return getElement(this); }
2167
- static get watchers() { return {
2168
- "_items": ["parseItems"]
2169
- }; }
2170
- };
2171
- Bcmtreeview.style = treeviewCss;
2172
-
2173
- const treeviewItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host(.hidden){display:none}.treeview-item{display:flex;align-items:stretch;justify-content:flex-start;color:var(--bcm-color-grey-8);padding-left:8px;user-select:none;background-color:var(--bcm-color-grey-1)}.treeview-item-context-menu{display:none;position:absolute;height:auto;background-color:#ffffff;align-items:center;justify-content:center;flex-direction:column;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25)}.treeview-item-context-menu.show{display:flex}.treeview-item-context-menu span{text-align:left;min-width:100px;padding:5px 8px;font-size:14px;line-height:22px;color:var(--bcm-color-grey-8)}.treeview-item-context-menu span:hover{cursor:pointer;color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.treeview-item.focus .treeview-item-container{border:2px solid var(--bcm-color-prime-blue-2)}.treeview-item-container{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.treeview-item-container.disabled{color:var(--bcm-color-grey-6)}.treeview-item-container.disabled .text-content{cursor:not-allowed}.treeview-item-container.selected:not(.disabled){color:var(--bcm-color-prime-blue-6)}.treeview-item-container.selected:not(.disabled):hover:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.treeview-item-container:hover:not(.disabled),.treeview-item-container:active:not(.disabled){color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}.treeview-item-container>section:not(.favicon){display:flex;align-items:stretch;justify-content:flex-start;border:2px solid transparent;flex:1}.treeview-item-container>section.favicon{display:flex;align-items:center;justify-content:center;padding:0 5px;height:100%;cursor:pointer}.treeview-item-container>section.favicon:not(.favorite){display:none}.treeview-item-container:hover:not(.disabled) .favicon{display:flex}.treeview-inner{display:none}.treeview-inner.open{display:block}.collapse-content{display:flex;align-items:center;justify-content:center;width:16px;min-width:16px}.collapse-content.child{cursor:pointer}.check-content{display:flex;align-items:center;justify-content:flex-start;width:24px;min-width:24px;padding-left:8px}.check-content .indeterminate{width:16px;height:16px;position:relative;display:block;padding-right:8px;cursor:pointer}.check-content .indeterminate:after{content:\"\";position:absolute;top:50%;left:9px;width:10px;height:10px;background-color:var(--bcm-color-prime-blue-6);transform:translate(-50%, -50%);opacity:1;z-index:1}.check-content .indeterminate:before{content:\"\";position:absolute;top:-1px;left:0px;width:16px;height:100%;border-radius:2px;background-color:transparent;border:1px solid var(--bcm-color-grey-5);opacity:1;z-index:2}.check-content .indeterminate:hover:not(.disabled):before{border-color:var(--bcm-color-prime-blue-6);box-shadow:0px 2px 4px rgba(54, 121, 171, 0.5)}.check-content .indeterminate.disabled{cursor:not-allowed;background:linear-gradient(90deg, var(--bcm-color-grey-3) 18px, transparent 0px);border-color:var(--bcm-color-grey-3)}.check-content .indeterminate.disabled:after{background-color:var(--bcm-color-grey-6)}.check-content .indeterminate.disabled bcm-icon{filter:brightness(0);opacity:0.3}.text-content{display:flex;align-items:center;justify-content:space-between;cursor:pointer;width:100%;flex:1}.text-content .favicon{display:flex;flex-direction:row;align-items:center;grid-gap:4px}.text-content #text .highlight{background-color:var(--bcm-color-yellow-5)}.text-content.small{padding:0 8px 0 4px}.text-content.medium{padding:4px 8px 4px 4px}.text-content.large{padding:8px 8px 8px 4px}.text-content .icon{text-align:center;margin-right:8px}";
2174
-
2175
- const BcmtreeviewItem = class {
2176
- constructor(hostRef) {
2177
- registerInstance(this, hostRef);
2178
- this.treeviewItemSelected = createEvent(this, "bcm-treeview-item-selected", 7);
2179
- this.treeviewUnchecked = createEvent(this, "bcm-treeview-unchecked", 7);
2180
- this.treeviewChecked = createEvent(this, "bcm-treeview-checked", 7);
2181
- this.treeviewChange = createEvent(this, "bcm-treeview-change", 7);
2182
- this.treeviewIndeterminateUnchecked = createEvent(this, "bcm-treeview-indeterminate-unchecked", 7);
2183
- this.treeviewIndeterminateChecked = createEvent(this, "bcm-treeview-indeterminate-checked", 7);
2184
- this.itemChecked = createEvent(this, "bcm-treeview-check-item-checked", 7);
2185
- this.itemUnchecked = createEvent(this, "bcm-treeview-check-item-unchecked", 7);
2186
- this.groupCheck = createEvent(this, "bcm-treeview-check-group-check", 7);
2187
- this.favoriteStatus = createEvent(this, "bcm-favorite-status", 7);
2188
- this.firstRun = true;
2189
- this.items = undefined;
2190
- this.itemObject = undefined;
2191
- this.text = undefined;
2192
- this.tooltipText = undefined;
2193
- this._id = (Math.random() * 4).toString(16).replace('.', '');
2194
- this.parentId = undefined;
2195
- this.hasChild = false;
2196
- this.size = 'medium';
2197
- this.icon = 'bug';
2198
- this.open = false;
2199
- this.selected = false;
2200
- this.checkboxes = false;
2201
- this.showIcon = false;
2202
- this.favicon = false;
2203
- this.favorite = false;
2204
- this.checked = false;
2205
- this.checkTrigger = false;
2206
- this.focused = false;
2207
- this.disabled = false;
2208
- this.contextMenuShow = false;
2209
- this._contextMenu = [];
2210
- this.indeterminateState = 'uncheck';
2211
- this._internal_id = "";
2212
- this.menuPadding = 0;
2213
- this.childLength = 0;
2214
- this.indeterminate = false;
2215
- this.hidden = false;
2216
- this.contextMenu = [];
2217
- this.contextOffsetLeft = 0;
2218
- this.contextOffsetTop = 0;
2219
- }
2220
- /**
2221
- * @ComponentMethod
2222
- */
2223
- componentWillLoad() {
2224
- this.menuPadding = 24;
2225
- this.childLength = this.el.children.length;
2226
- this.parseItems(this._contextMenu);
2227
- }
2228
- /**
2229
- * @ComponentMethod
2230
- */
2231
- componentDidLoad() {
2232
- // if (!this.disabled){
2233
- // // if (this.selected) this.treeviewItemSelected.emit(this.itemObject)
2234
- // if (this.checked){
2235
- // // this.treeviewChecked.emit(this._id)
2236
- // this.handleCheckMouseUp()
2237
- // }
2238
- // }
2239
- if (!this.disabled && this.firstRun && this.checkTrigger) {
2240
- this.firstRun = false;
2241
- this.handleCheckMouseUp();
2242
- }
2243
- }
2244
- /**
2245
- * @desc
2246
- * @returns {void}
2247
- */
2248
- /* setIndeterminateState() {
2249
- if(this.getAllChilds().length > 0) {
2250
-
2251
- let state: string = 'uncheck'
2252
- let allChecked: boolean = true
2253
- let allUnchecked: boolean = true
2254
-
2255
- this.getAllChilds().map((item) => {
2256
- item.checked && (allUnchecked = false)
2257
- !item.checked && (allChecked = false)
2258
- });
2259
-
2260
- !allChecked && !allUnchecked
2261
- ? state = 'indeterminate'
2262
- : allChecked
2263
- ? state = 'determinate'
2264
- : state = 'uncheck'
2265
-
2266
- this.indeterminateState = state as any;
2267
-
2268
- }
2269
- } */
2270
- /* @Watch('indeterminateState')
2271
- onCheckedChange() {
2272
- if (this.indeterminateState == 'determinate') {
2273
- this.treeviewChecked.emit(this._id)
2274
- }else if (this.indeterminateState == 'uncheck') {
2275
- this.treeviewIndeterminateUnchecked.emit(this._id)
2276
- this.checked = false
2277
- }else{
2278
- this.treeviewIndeterminateUnchecked.emit(this._id)
2279
- this.checked = false
2280
- }
2281
- } */
2282
- /**
2283
- * @descc
2284
- * @param event
2285
- */
2286
- handletreeviewClearSelecteds(event) {
2287
- if (!this.disabled) {
2288
- if (event.detail && event.detail !== this.itemObject)
2289
- this.selected = false;
2290
- }
2291
- }
2292
- /**
2293
- * @descc
2294
- * @param event
2295
- */
2296
- ListentreeviewChange() {
2297
- //this.setIndeterminateState();
2298
- }
2299
- /**
2300
- * @descc
2301
- * @param event
2302
- */
2303
- ListentreeviewShowContext(event) {
2304
- this.contextOffsetTop = event.detail[1];
2305
- this.contextOffsetLeft = event.detail[2];
2306
- if (event.detail[0] && event.detail[0] === this._id) {
2307
- this.contextMenuShow = true;
2308
- }
2309
- else {
2310
- this.contextMenuShow = false;
2311
- }
2312
- }
2313
- /**
2314
- * @desc
2315
- * @param event
2316
- */
2317
- handleWindowClick(event) {
2318
- const target = event.target;
2319
- if (target === this.el)
2320
- return;
2321
- this.contextMenuShow = false;
2322
- }
2323
- /**
2324
- * @desc
2325
- */
2326
- handleClick() {
2327
- if (!this.disabled) {
2328
- this.selected = true;
2329
- this.treeviewItemSelected.emit(this.itemObject);
2330
- }
2331
- }
2332
- /**
2333
- * @desc
2334
- */
2335
- handleFavClick(e) {
2336
- if (!this.disabled) {
2337
- this.favorite = !this.favorite;
2338
- if (!this.itemObject["rightSlot"]) {
2339
- this.itemObject["rightSlot"] = {};
2340
- }
2341
- this.itemObject["rightSlot"]["favorite"] = this.favorite;
2342
- this.favoriteStatus.emit(this.itemObject);
2343
- e.stopPropagation();
2344
- e.preventDefault();
2345
- }
2346
- }
2347
- /**
2348
- * @desc
2349
- */
2350
- handleOpen() {
2351
- this.open = !this.open;
2352
- }
2353
- getRootChilds(element = this.el) {
2354
- return getChilds(element, 'bcm-treeview-item');
2355
- }
2356
- getAllChilds(element = this.el) {
2357
- let returnAllItems = [];
2358
- getChilds(element, 'bcm-treeview-item').forEach(items => {
2359
- this.getAllChilds(items) && (returnAllItems = [...returnAllItems, ...this.getAllChilds(items)]);
2360
- returnAllItems = [...returnAllItems,
2361
- items
2362
- ];
2363
- });
2364
- return returnAllItems;
2365
- }
2366
- /**
2367
- * @desc
2368
- * -
2369
- */
2370
- checkGroupState() {
2371
- // debugger;
2372
- const childsRoot = this.getRootChilds();
2373
- let [state, allChecked, allUnchecked] = ['uncheck', true, true];
2374
- if (childsRoot.length > 0) {
2375
- childsRoot.forEach(checkbox => {
2376
- (checkbox.checked || checkbox.indeterminateState === 'indeterminate') && (allUnchecked = false);
2377
- !checkbox.checked && (allChecked = false);
2378
- });
2379
- !allChecked && !allUnchecked
2380
- ? state = 'indeterminate'
2381
- : allChecked
2382
- ? state = 'determinate'
2383
- : state = 'uncheck';
2384
- this.indeterminateState = state;
2385
- if (state === 'determinate') {
2386
- this.checked = true;
2387
- // if(this.checked) {
2388
- this.treeviewChecked.emit(this._id);
2389
- // }
2390
- }
2391
- else {
2392
- this.checked = false;
2393
- this.treeviewUnchecked.emit(this._id);
2394
- }
2395
- }
2396
- else {
2397
- if (this.checked) {
2398
- this.checked = false;
2399
- this.treeviewUnchecked.emit(this._id);
2400
- }
2401
- else {
2402
- this.checked = true;
2403
- this.treeviewChecked.emit(this._id);
2404
- }
2405
- }
2406
- }
2407
- /**
2408
- * @Event
2409
- * @desc
2410
- * -
2411
- */
2412
- handleCheckMouseUp() {
2413
- const checked = this.checked;
2414
- const state = this.indeterminateState;
2415
- if (!this.hasChild) {
2416
- !checked
2417
- ? this.checked = true
2418
- : this.checked = false;
2419
- if (this.checked) {
2420
- this.treeviewChecked.emit(this._id);
2421
- }
2422
- else {
2423
- this.treeviewUnchecked.emit(this._id);
2424
- }
2425
- this.groupCheck.emit(this.parentId);
2426
- return;
2427
- }
2428
- const childs = this.getAllChilds();
2429
- if (state === 'indeterminate' || state === 'uncheck') {
2430
- childs.forEach(child => {
2431
- child.checked = true;
2432
- // if(this.checked) {
2433
- this.treeviewChecked.emit(child._id);
2434
- // }
2435
- child.indeterminateState = 'determined';
2436
- });
2437
- }
2438
- else {
2439
- childs.forEach(child => {
2440
- child.checked = false;
2441
- this.treeviewUnchecked.emit(child._id);
2442
- child.indeterminateState = 'uncheck';
2443
- });
2444
- }
2445
- this.checkGroupState();
2446
- this.groupCheck.emit(this.parentId);
2447
- }
2448
- checkGroup(e) {
2449
- const { detail: groupId } = e;
2450
- if (!groupId || this._id !== groupId)
2451
- return;
2452
- this.checkGroupState();
2453
- this.groupCheck.emit(this.parentId);
2454
- }
2455
- /**
2456
- * @desc
2457
- * @param item
2458
- */
2459
- contextItemRenderer(item) {
2460
- return (h("span", null, item.title));
2461
- }
2462
- /**
2463
- * @desc
2464
- * @param newValue
2465
- * @returns {void}
2466
- */
2467
- parseItems(newValue) {
2468
- if (newValue) {
2469
- typeof newValue == 'string'
2470
- ? this.contextMenu = JSON.parse(newValue)
2471
- : this.contextMenu = newValue;
2472
- }
2473
- }
2474
- render() {
2475
- const { _id, text, tooltipText, size, icon, open, childLength, checkboxes, showIcon, checked, indeterminateState, focused, contextMenuShow } = this;
2476
- const menuPadding = this.menuPadding + 'px';
2477
- const textContent = classnames('text-content', size, 'size-2'
2478
- // {
2479
- // 'size-2': size === 'small' || size === 'medium',
2480
- // 'size-3': size === 'large',
2481
- // }
2482
- );
2483
- const classes = classnames('treeview-item', {
2484
- 'focus': focused,
2485
- 'open': open,
2486
- 'selected': this.selected
2487
- });
2488
- const treeviewContextMenu = classnames('treeview-item-context-menu', {
2489
- 'show': contextMenuShow
2490
- });
2491
- const treeviewInner = classnames('treeview-inner', {
2492
- 'open': open,
2493
- });
2494
- const indeterminate = classnames('indeterminate', {
2495
- 'disabled': this.disabled,
2496
- });
2497
- const treeviewItemContainer = classnames('treeview-item-container', {
2498
- 'selected': this.selected,
2499
- 'disabled': this.disabled
2500
- });
2501
- const collapseContent = classnames('collapse-content', {
2502
- 'child': childLength > 0,
2503
- });
2504
- const hostClasses = classnames(this.hidden ? 'hidden' : null);
2505
- const faviconClass = classnames("favicon", {
2506
- "favorite": this.favorite
2507
- });
2508
- return (h(Host, { class: hostClasses }, h("div", { class: classes }, h("div", { class: collapseContent, id: "collapse-button", onClick: () => childLength > 0 && this.handleOpen() }, childLength > 0 && (h("bcm-icon", { class: "collapse-icon", icon: `far fa-${open ? 'caret-down' : 'caret-right'}` }))), h("div", { class: treeviewItemContainer }, h("section", { onMouseUp: () => this.handleCheckMouseUp() }, checkboxes && (h("div", { class: "check-content" }, indeterminateState == 'indeterminate' && (h("span", { class: indeterminate })) || (h("bcm-checkbox", { id: 'check-' + _id, name: 'check-' + _id, checked: checked, disabled: this.disabled, noCaption: true })))), h("div", { class: textContent, onClick: () => this.handleClick(), title: tooltipText }, showIcon && icon && (h("bcm-icon", { class: "icon", icon: icon })), h("span", { id: "text" }, text))), this.favicon && (h("section", { class: faviconClass, onClick: (e) => this.handleFavClick(e) }, h("bcm-icon", { title: this.favorite ? "Click to remove from favorite list" : "Click to add to your favourites list", icon: "far fa-star" })))), !checkboxes && (h("div", { class: treeviewContextMenu, style: { top: this.contextOffsetTop + 'px', left: this.contextOffsetLeft + 'px' } }, this.contextMenu.length !== 0 && this.contextMenu.map((item) => (this.contextItemRenderer(item)))))), h("div", { class: treeviewInner, style: { paddingLeft: menuPadding } }, h("slot", null))));
2509
- }
2510
- get el() { return getElement(this); }
2511
- static get watchers() { return {
2512
- "_contextMenu": ["parseItems"]
2513
- }; }
2514
- };
2515
- BcmtreeviewItem.style = treeviewItemCss;
2516
-
2517
- export { BcmCheckboxLite as bcm_checkbox_lite, BcmDivider as bcm_divider, BcmEmpty as bcm_empty, BcmListbox as bcm_listbox, BcmListboxGroup as bcm_listbox_group, BcmListboxItem as bcm_listbox_item, BcmOldSearch as bcm_old_search, Bcmtreeview as bcm_treeview, BcmtreeviewItem as bcm_treeview_item };