bromcom-ui 2.12.4-rc.0 → 3.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (465) 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-2a15a39d.entry.js → p-03337609.entry.js} +1 -1
  4. package/dist/bromcom-ui/{p-652c1d30.entry.js → p-14b04371.entry.js} +1 -1
  5. package/dist/bromcom-ui/{p-32a5791b.entry.js → p-19ed830b.entry.js} +1 -1
  6. package/dist/bromcom-ui/{p-55a44163.entry.js → p-1a7e1a74.entry.js} +1 -1
  7. package/dist/bromcom-ui/{p-63646141.entry.js → p-1fbec9e4.entry.js} +1 -1
  8. package/dist/bromcom-ui/p-217934a4.entry.js +5 -0
  9. package/dist/bromcom-ui/p-22e3161d.entry.js +5 -0
  10. package/dist/bromcom-ui/{p-b1754fc5.entry.js → p-2a0b6273.entry.js} +1 -1
  11. package/dist/bromcom-ui/{p-fcc6f71e.js → p-2d0ff35e.js} +1 -1
  12. package/dist/bromcom-ui/p-367bc8e0.js +5 -0
  13. package/dist/bromcom-ui/{p-b689c630.entry.js → p-369948e7.entry.js} +1 -1
  14. package/dist/bromcom-ui/{p-fcbd8a75.entry.js → p-3b079331.entry.js} +1 -1
  15. package/dist/bromcom-ui/{p-4211b6bb.entry.js → p-46628fcd.entry.js} +1 -1
  16. package/dist/bromcom-ui/{p-49c6a7eb.entry.js → p-485ed6c1.entry.js} +1 -1
  17. package/dist/bromcom-ui/{p-8129ed3a.js → p-499d8454.js} +1 -1
  18. package/dist/bromcom-ui/{p-b1382dbd.entry.js → p-4a71c61a.entry.js} +1 -1
  19. package/dist/bromcom-ui/{p-3182df7e.js → p-4d2bf0e7.js} +1 -1
  20. package/dist/bromcom-ui/{p-1fb713c8.entry.js → p-51ba3626.entry.js} +1 -1
  21. package/dist/bromcom-ui/p-556010cb.js +5 -0
  22. package/dist/bromcom-ui/{p-a4f0590d.entry.js → p-583982a6.entry.js} +1 -1
  23. package/dist/bromcom-ui/{p-d4c75e60.entry.js → p-5bf051b9.entry.js} +1 -1
  24. package/dist/bromcom-ui/p-5c4939a7.js +5 -0
  25. package/dist/bromcom-ui/p-5ea9881d.entry.js +5 -0
  26. package/dist/bromcom-ui/p-64fad38b.js +11 -0
  27. package/dist/bromcom-ui/p-6e5f5f36.js +1 -1
  28. package/dist/bromcom-ui/p-6f11eb8e.entry.js +5 -0
  29. package/dist/bromcom-ui/p-6f224017.entry.js +5 -0
  30. package/dist/bromcom-ui/{p-3c7a0345.js → p-6f2e4c9b.js} +1 -1
  31. package/dist/bromcom-ui/{p-5ae0a59b.js → p-6f861fed.js} +1 -1
  32. package/dist/bromcom-ui/{p-9eb250d4.entry.js → p-7416d1f6.entry.js} +1 -1
  33. package/dist/bromcom-ui/{p-d1298c40.js → p-7b21fcb9.js} +1 -1
  34. package/dist/bromcom-ui/p-815f884d.entry.js +5 -0
  35. package/dist/bromcom-ui/p-8363990a.entry.js +5 -0
  36. package/dist/bromcom-ui/p-8457670e.entry.js +5 -0
  37. package/dist/bromcom-ui/{p-f82db5dd.js → p-858cee66.js} +1 -1
  38. package/dist/bromcom-ui/{p-e45c1546.js → p-85eedabc.js} +1 -1
  39. package/dist/bromcom-ui/{p-65783175.js → p-8e5e362a.js} +1 -1
  40. package/dist/bromcom-ui/{p-34b9cf32.entry.js → p-9015080d.entry.js} +1 -1
  41. package/dist/bromcom-ui/{p-40a29024.entry.js → p-9d41ff2a.entry.js} +1 -1
  42. package/dist/bromcom-ui/p-a080c8ea.entry.js +5 -0
  43. package/dist/bromcom-ui/p-a141b2bc.entry.js +5 -0
  44. package/dist/bromcom-ui/{p-4680865d.js → p-a2df6c19.js} +1 -1
  45. package/dist/bromcom-ui/p-a313fba6.js +1 -1
  46. package/dist/bromcom-ui/{p-c097f624.entry.js → p-a6b4a46d.entry.js} +1 -1
  47. package/dist/bromcom-ui/p-a6b696de.js +5 -0
  48. package/dist/bromcom-ui/p-acfceb2b.entry.js +5 -0
  49. package/dist/bromcom-ui/{p-c0aa5289.entry.js → p-b46e368e.entry.js} +1 -1
  50. package/dist/bromcom-ui/p-b85227c8.entry.js +5 -0
  51. package/dist/bromcom-ui/p-c47463b1.entry.js +5 -0
  52. package/dist/bromcom-ui/{p-defdd05b.entry.js → p-c4bf7f7e.entry.js} +1 -1
  53. package/dist/bromcom-ui/{p-826a85ed.entry.js → p-c5bb29d0.entry.js} +1 -1
  54. package/dist/bromcom-ui/{p-c3b74f76.entry.js → p-cc70861b.entry.js} +1 -1
  55. package/dist/bromcom-ui/p-ce452032.entry.js +16 -0
  56. package/dist/bromcom-ui/{p-b4b9ca15.entry.js → p-d0e56f5f.entry.js} +1 -1
  57. package/dist/bromcom-ui/{p-aa6887d7.js → p-d4e4aeee.js} +1 -1
  58. package/dist/bromcom-ui/{p-6b5ed4d8.js → p-d65bc842.js} +1 -1
  59. package/dist/bromcom-ui/p-dc73abe2.js +5 -0
  60. package/dist/bromcom-ui/p-dcd69786.entry.js +5 -0
  61. package/dist/bromcom-ui/{p-50a1591e.js → p-e037ee2b.js} +1 -1
  62. package/dist/bromcom-ui/{p-874053cc.entry.js → p-e7c31126.entry.js} +1 -1
  63. package/dist/bromcom-ui/p-e9a43560.js +5 -0
  64. package/dist/bromcom-ui/p-ea24a822.entry.js +5 -0
  65. package/dist/bromcom-ui/{p-f815dc7a.entry.js → p-fdd4cabe.entry.js} +1 -1
  66. package/dist/cjs/{bcm-489c9b1a.js → bcm-1d1fcf21.js} +4 -4
  67. package/dist/cjs/bcm-accordion_68.cjs.entry.js +47182 -0
  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-date-picker.cjs.entry.js +4 -4
  74. package/dist/cjs/bcm-datetime-picker.cjs.entry.js +8 -8
  75. package/dist/cjs/bcm-default.cjs.entry.js +2 -2
  76. package/dist/cjs/bcm-form-2.cjs.entry.js +5 -5
  77. package/dist/cjs/bcm-input-2.cjs.entry.js +9 -9
  78. package/dist/cjs/bcm-input-custom.cjs.entry.js +2 -2
  79. package/dist/cjs/bcm-input-dropdown.cjs.entry.js +9 -9
  80. package/dist/cjs/bcm-modal-2-footer.cjs.entry.js +6 -6
  81. package/dist/cjs/bcm-modal-2-header.cjs.entry.js +6 -6
  82. package/dist/cjs/bcm-modal-2.cjs.entry.js +7 -7
  83. package/dist/cjs/bcm-number-input.cjs.entry.js +9 -9
  84. package/dist/cjs/bcm-skeleton.cjs.entry.js +6 -6
  85. package/dist/cjs/bcm-table.cjs.entry.js +6 -6
  86. package/dist/cjs/bcm-tag.cjs.entry.js +15 -15
  87. package/dist/cjs/bcm-time-picker.cjs.entry.js +4 -4
  88. package/dist/cjs/bcm-toast.cjs.entry.js +18 -18
  89. package/dist/cjs/bromcom-ui.cjs.js +3 -3
  90. package/dist/cjs/{caption-template-85a18b6d.js → caption-template-f8a78504.js} +9 -9
  91. package/dist/cjs/{floating-ui-21890d11.js → floating-ui-5b396838.js} +2 -2
  92. package/dist/cjs/{generate-b55bc9ac.js → generate-a25d8fc8.js} +1 -1
  93. package/dist/cjs/{global-ae5a410a.js → global-08c079a8.js} +1 -1
  94. package/dist/cjs/{input.style-b5676e6a.js → input.style-bee84fb0.js} +1 -1
  95. package/dist/cjs/{label-template-6da4808b.js → label-template-fc301e0c.js} +6 -6
  96. package/dist/cjs/loader.cjs.js +3 -3
  97. package/dist/cjs/{number-helper-4a5c0bb5.js → number-helper-3a56812f.js} +1 -1
  98. package/dist/cjs/old-bcm-popover-box.cjs.entry.js +7 -7
  99. package/dist/cjs/old-bcm-popover.cjs.entry.js +5 -5
  100. package/dist/cjs/{package-1757d4e0.js → package-6afe17f3.js} +1 -1
  101. package/dist/cjs/{popover-placement-e7d6eabd.js → popover-placement-02e6101b.js} +1 -1
  102. package/dist/cjs/{slot-template-c8e2816c.js → slot-template-df7b5b59.js} +1 -1
  103. package/dist/cjs/{string-helper-f9184277.js → string-helper-9cdfb273.js} +2 -2
  104. package/dist/cjs/{validators-51a16def.js → validators-78797513.js} +1 -1
  105. package/dist/collection/collection-manifest.json +1 -1
  106. package/dist/collection/components/atoms/avatar/avatar.js +1 -1
  107. package/dist/collection/components/atoms/avatar/avatar.style.js +4 -4
  108. package/dist/collection/components/atoms/badge/badge.style.js +8 -8
  109. package/dist/collection/components/atoms/button/button.css +90 -92
  110. package/dist/collection/components/atoms/button/button.js +45 -46
  111. package/dist/collection/components/atoms/chip/chip.css +27 -29
  112. package/dist/collection/components/atoms/chip/chip.js +10 -11
  113. package/dist/collection/components/atoms/divider/divider.css +4 -4
  114. package/dist/collection/components/atoms/link/link.css +10 -11
  115. package/dist/collection/components/molecules/accordion/accordion.css +23 -0
  116. package/dist/collection/components/molecules/accordion/accordion.js +1 -1
  117. package/dist/collection/components/molecules/alert/alert.css +28 -24
  118. package/dist/collection/components/molecules/alert/alert.js +26 -36
  119. package/dist/collection/components/molecules/button-group/button-group.css +15 -23
  120. package/dist/collection/components/molecules/checkbox/checkbox.css +15 -15
  121. package/dist/collection/components/molecules/checkbox/checkbox.js +8 -9
  122. package/dist/collection/components/molecules/color-input/color-input.js +1 -1
  123. package/dist/collection/components/molecules/empty/empty.js +1 -1
  124. package/dist/collection/components/molecules/error-layout/error-layout.css +13 -15
  125. package/dist/collection/components/molecules/error-layout/error-layout.js +1 -1
  126. package/dist/collection/components/molecules/expansion-panel/expansion-panel.css +25 -22
  127. package/dist/collection/components/molecules/expansion-panel/expansion-panel.js +1 -1
  128. package/dist/collection/components/molecules/input/input.css +21 -13
  129. package/dist/collection/components/molecules/input/input.style.js +1 -1
  130. package/dist/collection/components/molecules/menu/menu.css +29 -23
  131. package/dist/collection/components/molecules/modal/modal.css +42 -35
  132. package/dist/collection/components/molecules/modal/modal.js +1 -1
  133. package/dist/collection/components/molecules/radio/radio.js +10 -10
  134. package/dist/collection/components/molecules/range/range.css +5 -8
  135. package/dist/collection/components/molecules/search/search.css +21 -13
  136. package/dist/collection/components/molecules/stepper/stepper.css +6 -5
  137. package/dist/collection/components/molecules/switch/switch.css +22 -21
  138. package/dist/collection/components/molecules/tab-group/tab-item-header.js +6 -6
  139. package/dist/collection/components/molecules/textarea/textarea.css +21 -13
  140. package/dist/collection/components/organism/list/list.css +44 -44
  141. package/dist/collection/components/organism/list/list.js +19 -73
  142. package/dist/collection/components/other/shortcut/shortcut.js +4 -4
  143. package/dist/collection/components/other/toast/toast.js +7 -7
  144. package/dist/collection/components/third-parts/colorful/colorful.css +21 -13
  145. package/dist/collection/components/third-parts/rc-picker/rc-picker.css +13 -9
  146. package/dist/collection/global/components/_checkbox.css +15 -15
  147. package/dist/collection/helper/popover-helper.js +5 -5
  148. package/dist/collection/helper/tooltip-helper.js +6 -6
  149. package/dist/collection/templates/caption-template.js +9 -9
  150. package/dist/collection/templates/input-template.js +1 -1
  151. package/dist/collection/templates/label-template.js +4 -4
  152. package/dist/collection/templates/step-template.js +4 -4
  153. package/dist/components/avatar.js +6 -6
  154. package/dist/components/badge.js +9 -9
  155. package/dist/components/bcm-accordion.js +2 -2
  156. package/dist/components/bcm-alert.js +28 -41
  157. package/dist/components/bcm-attendance-actions-comment.js +1 -1
  158. package/dist/components/bcm-attendance-actions-dropdown.js +1 -1
  159. package/dist/components/bcm-attendance-actions.js +1 -1
  160. package/dist/components/bcm-button-group.js +1 -1
  161. package/dist/components/bcm-checkbox-group.js +1 -1
  162. package/dist/components/bcm-color-input.js +1 -1
  163. package/dist/components/bcm-error-layout.js +2 -2
  164. package/dist/components/bcm-expansion-panel.js +2 -2
  165. package/dist/components/bcm-input-2.js +1 -1
  166. package/dist/components/bcm-input-dropdown.js +1 -1
  167. package/dist/components/bcm-modal.js +2 -2
  168. package/dist/components/bcm-popover.js +5 -5
  169. package/dist/components/bcm-range.js +1 -1
  170. package/dist/components/bcm-shortcut.js +4 -4
  171. package/dist/components/bcm-stepper.js +6 -6
  172. package/dist/components/bcm-switch.js +1 -1
  173. package/dist/components/bcm-tab-item-header.js +6 -6
  174. package/dist/components/bcm-toast.js +7 -7
  175. package/dist/components/button.js +47 -48
  176. package/dist/components/caption-template.js +9 -9
  177. package/dist/components/checkbox-lite.js +1 -1
  178. package/dist/components/checkbox.js +9 -10
  179. package/dist/components/chip.js +11 -12
  180. package/dist/components/colorful.js +1 -1
  181. package/dist/components/divider.js +1 -1
  182. package/dist/components/empty.js +1 -1
  183. package/dist/components/generate.js +1 -1
  184. package/dist/components/index4.js +2549 -171
  185. package/dist/components/index5.js +171 -2549
  186. package/dist/components/input-template.js +1 -1
  187. package/dist/components/input.js +1 -1
  188. package/dist/components/input.style.js +2 -2
  189. package/dist/components/label.js +4 -4
  190. package/dist/components/link.js +1 -1
  191. package/dist/components/list.js +21 -58
  192. package/dist/components/menu.js +1 -1
  193. package/dist/components/radio.js +10 -10
  194. package/dist/components/rc-picker.js +1 -1
  195. package/dist/components/search.js +2 -2
  196. package/dist/components/skeleton.js +1 -1
  197. package/dist/components/step.js +1 -1
  198. package/dist/components/textarea.js +1 -1
  199. package/dist/components/tooltip-helper.js +6 -6
  200. package/dist/esm/{_commonjsHelpers-be0d4ec8.js → _commonjsHelpers-7002e5de.js} +1 -1
  201. package/dist/esm/bcm-a50d55ba.js +1 -1
  202. package/dist/esm/bcm-accordion_68.entry.js +47111 -0
  203. package/dist/esm/bcm-attendance-actions-comment.entry.js +12 -12
  204. package/dist/esm/bcm-attendance-actions-dropdown.entry.js +13 -13
  205. package/dist/esm/bcm-autocomplete.entry.js +3 -3
  206. package/dist/esm/bcm-box.entry.js +1 -1
  207. package/dist/esm/bcm-breadcrumb.entry.js +6 -6
  208. package/dist/esm/bcm-caption.entry.js +14 -14
  209. package/dist/esm/bcm-card.entry.js +10 -10
  210. package/dist/esm/bcm-colorpicker.entry.js +5 -5
  211. package/dist/esm/bcm-content.entry.js +1 -1
  212. package/dist/esm/bcm-date-picker.entry.js +9 -9
  213. package/dist/esm/bcm-datetime-picker.entry.js +13 -13
  214. package/dist/esm/bcm-default.entry.js +5 -5
  215. package/dist/esm/bcm-form-2.entry.js +8 -8
  216. package/dist/esm/bcm-form-group.entry.js +1 -1
  217. package/dist/esm/bcm-input-2.entry.js +11 -11
  218. package/dist/esm/bcm-input-custom.entry.js +6 -6
  219. package/dist/esm/bcm-input-dropdown.entry.js +14 -14
  220. package/dist/esm/bcm-message.entry.js +3 -3
  221. package/dist/esm/bcm-modal-2-footer.entry.js +12 -12
  222. package/dist/esm/bcm-modal-2-header.entry.js +11 -11
  223. package/dist/esm/bcm-modal-2.entry.js +13 -13
  224. package/dist/esm/bcm-notification.entry.js +3 -3
  225. package/dist/esm/bcm-number-input.entry.js +15 -15
  226. package/dist/esm/bcm-overlay_2.entry.js +4 -4
  227. package/dist/esm/bcm-react-number.entry.js +3 -3
  228. package/dist/esm/bcm-result.entry.js +3 -3
  229. package/dist/esm/bcm-select-group.entry.js +3 -3
  230. package/dist/esm/bcm-select-option.entry.js +3 -3
  231. package/dist/esm/bcm-skeleton.entry.js +11 -11
  232. package/dist/esm/bcm-tab-pane.entry.js +3 -3
  233. package/dist/esm/bcm-table.entry.js +12 -12
  234. package/dist/esm/bcm-tabs-content.entry.js +4 -4
  235. package/dist/esm/bcm-tag.entry.js +9 -9
  236. package/dist/esm/bcm-time-picker.entry.js +9 -9
  237. package/dist/esm/bcm-timeline-item.entry.js +3 -3
  238. package/dist/esm/bcm-timeline.entry.js +3 -3
  239. package/dist/esm/bcm-toast.entry.js +16 -16
  240. package/dist/esm/bcm-treeview-group.entry.js +1 -1
  241. package/dist/esm/bromcom-ui.js +5 -5
  242. package/dist/esm/{caption-template-9d0ea503.js → caption-template-16dd9444.js} +11 -11
  243. package/dist/esm/{color-helper-e74656af.js → color-helper-ba15b0d8.js} +2 -2
  244. package/dist/esm/{colors-df32bb43.js → colors-ed4e7579.js} +1 -1
  245. package/dist/esm/{element-dragger-7ea06c76.js → element-dragger-b75266e6.js} +1 -1
  246. package/dist/esm/floating-ui-3f4394da.js +1 -1
  247. package/dist/esm/{generate-27c06421.js → generate-a4b85775.js} +2 -2
  248. package/dist/esm/{global-0dac0bf2.js → global-1baa11cd.js} +2 -2
  249. package/dist/esm/{index-b84bc8c9.js → index-00c8a8f7.js} +1 -1
  250. package/dist/esm/{index-a6d9d0af.js → index-0d3a56ec.js} +1 -1
  251. package/dist/esm/{index-b3026131.js → index-4614b7f0.js} +1 -1
  252. package/dist/esm/{input.style-e855c0f3.js → input.style-0ddc0073.js} +1 -1
  253. package/dist/esm/{is-load-decorator-613d613a.js → is-load-decorator-b8ca22f2.js} +1 -1
  254. package/dist/esm/{label-template-8c5948ab.js → label-template-4c3797f4.js} +7 -7
  255. package/dist/esm/loader.js +5 -5
  256. package/dist/esm/{number-helper-94a51ec2.js → number-helper-872d5482.js} +1 -1
  257. package/dist/esm/old-bcm-popover-box.entry.js +11 -11
  258. package/dist/esm/old-bcm-popover.entry.js +7 -7
  259. package/dist/esm/{package-34090aad.js → package-1d6f13ed.js} +1 -1
  260. package/dist/esm/{popover-placement-2f5939ea.js → popover-placement-2bf3a181.js} +1 -1
  261. package/dist/esm/{slot-template-f85d540c.js → slot-template-e0202c5a.js} +2 -2
  262. package/dist/esm/{string-helper-85990695.js → string-helper-69203215.js} +2 -2
  263. package/dist/esm/{utils-b3338faf.js → utils-7727d09e.js} +1 -1
  264. package/dist/esm/{validators-7e605ca5.js → validators-e9800e9a.js} +1 -1
  265. package/dist/types/components/atoms/avatar/avatar.style.d.ts +21 -21
  266. package/dist/types/components/molecules/alert/alert.d.ts +1 -3
  267. package/dist/types/components/organism/list/list.d.ts +0 -4
  268. package/dist/types/components.d.ts +0 -4
  269. package/package.json +1 -1
  270. package/dist/bromcom-ui/p-0089f9c5.entry.js +0 -5
  271. package/dist/bromcom-ui/p-03cc10f8.entry.js +0 -5
  272. package/dist/bromcom-ui/p-075dd6ba.entry.js +0 -5
  273. package/dist/bromcom-ui/p-07971537.entry.js +0 -5
  274. package/dist/bromcom-ui/p-0d952c81.js +0 -5
  275. package/dist/bromcom-ui/p-0e97b110.js +0 -5
  276. package/dist/bromcom-ui/p-12687eaa.entry.js +0 -5
  277. package/dist/bromcom-ui/p-1441edac.entry.js +0 -5
  278. package/dist/bromcom-ui/p-17bc7e7e.entry.js +0 -5
  279. package/dist/bromcom-ui/p-1ac9eb84.entry.js +0 -5
  280. package/dist/bromcom-ui/p-1bf1e8ad.entry.js +0 -5
  281. package/dist/bromcom-ui/p-1c8ed0b3.entry.js +0 -5
  282. package/dist/bromcom-ui/p-1d663e83.entry.js +0 -5
  283. package/dist/bromcom-ui/p-21b4ca2e.entry.js +0 -5
  284. package/dist/bromcom-ui/p-2ebe3b67.entry.js +0 -5
  285. package/dist/bromcom-ui/p-30a11f2e.entry.js +0 -5
  286. package/dist/bromcom-ui/p-30cc83af.js +0 -5
  287. package/dist/bromcom-ui/p-33d204f1.entry.js +0 -5
  288. package/dist/bromcom-ui/p-348e74e9.entry.js +0 -5
  289. package/dist/bromcom-ui/p-379b00d6.js +0 -5
  290. package/dist/bromcom-ui/p-38a52254.js +0 -5
  291. package/dist/bromcom-ui/p-3e12382d.js +0 -5
  292. package/dist/bromcom-ui/p-4b5c5f62.entry.js +0 -5
  293. package/dist/bromcom-ui/p-4c2e776d.entry.js +0 -5
  294. package/dist/bromcom-ui/p-4c9c2159.entry.js +0 -5
  295. package/dist/bromcom-ui/p-56b45430.entry.js +0 -5
  296. package/dist/bromcom-ui/p-646c8ea2.entry.js +0 -5
  297. package/dist/bromcom-ui/p-69e3b4f9.entry.js +0 -5
  298. package/dist/bromcom-ui/p-6b3bf457.entry.js +0 -5
  299. package/dist/bromcom-ui/p-6fa98b12.entry.js +0 -5
  300. package/dist/bromcom-ui/p-7247ac65.entry.js +0 -5
  301. package/dist/bromcom-ui/p-7505325c.entry.js +0 -5
  302. package/dist/bromcom-ui/p-76edf59f.js +0 -7
  303. package/dist/bromcom-ui/p-7ae23e76.entry.js +0 -5
  304. package/dist/bromcom-ui/p-7b6d3a77.entry.js +0 -5
  305. package/dist/bromcom-ui/p-7dd0467a.entry.js +0 -5
  306. package/dist/bromcom-ui/p-815f1132.entry.js +0 -5
  307. package/dist/bromcom-ui/p-852fd092.entry.js +0 -5
  308. package/dist/bromcom-ui/p-85aa9dfd.entry.js +0 -5
  309. package/dist/bromcom-ui/p-8baa08ea.entry.js +0 -5
  310. package/dist/bromcom-ui/p-8c7e1bea.entry.js +0 -5
  311. package/dist/bromcom-ui/p-8dda8873.js +0 -14
  312. package/dist/bromcom-ui/p-8ee40a96.js +0 -5
  313. package/dist/bromcom-ui/p-90b5befd.entry.js +0 -5
  314. package/dist/bromcom-ui/p-935f57ad.entry.js +0 -5
  315. package/dist/bromcom-ui/p-9402a607.entry.js +0 -5
  316. package/dist/bromcom-ui/p-9695f7c9.js +0 -5
  317. package/dist/bromcom-ui/p-97bc1843.entry.js +0 -5
  318. package/dist/bromcom-ui/p-9b080d5d.entry.js +0 -5
  319. package/dist/bromcom-ui/p-9b8e6484.entry.js +0 -5
  320. package/dist/bromcom-ui/p-9d1e255a.js +0 -5
  321. package/dist/bromcom-ui/p-9db3dcfa.entry.js +0 -5
  322. package/dist/bromcom-ui/p-ac949369.entry.js +0 -5
  323. package/dist/bromcom-ui/p-ad295560.entry.js +0 -5
  324. package/dist/bromcom-ui/p-b3faa68b.js +0 -5
  325. package/dist/bromcom-ui/p-b5bdc541.entry.js +0 -5
  326. package/dist/bromcom-ui/p-b716412b.entry.js +0 -5
  327. package/dist/bromcom-ui/p-bed627ab.js +0 -11
  328. package/dist/bromcom-ui/p-bfdf9447.entry.js +0 -5
  329. package/dist/bromcom-ui/p-c621138a.entry.js +0 -5
  330. package/dist/bromcom-ui/p-c9d35a7a.entry.js +0 -5
  331. package/dist/bromcom-ui/p-d0833fd3.entry.js +0 -5
  332. package/dist/bromcom-ui/p-d1dbebf6.entry.js +0 -5
  333. package/dist/bromcom-ui/p-d2f863d9.js +0 -5
  334. package/dist/bromcom-ui/p-d6c99f1f.entry.js +0 -5
  335. package/dist/bromcom-ui/p-daa32fc1.js +0 -5
  336. package/dist/bromcom-ui/p-dc3275aa.entry.js +0 -5
  337. package/dist/bromcom-ui/p-dccb9b5f.entry.js +0 -5
  338. package/dist/bromcom-ui/p-de1f21b5.entry.js +0 -5
  339. package/dist/bromcom-ui/p-de23b7bf.entry.js +0 -5
  340. package/dist/bromcom-ui/p-e3f8efa5.entry.js +0 -5
  341. package/dist/bromcom-ui/p-ee1b4a47.entry.js +0 -5
  342. package/dist/bromcom-ui/p-f0469946.entry.js +0 -5
  343. package/dist/bromcom-ui/p-f2fc3d54.entry.js +0 -5
  344. package/dist/bromcom-ui/p-f3c9ad5e.entry.js +0 -5
  345. package/dist/bromcom-ui/p-f6f37125.entry.js +0 -5
  346. package/dist/bromcom-ui/p-f86515f0.entry.js +0 -5
  347. package/dist/bromcom-ui/p-f908af03.entry.js +0 -5
  348. package/dist/bromcom-ui/p-f9c32e82.entry.js +0 -5
  349. package/dist/bromcom-ui/p-fd0c42ae.entry.js +0 -5
  350. package/dist/cjs/Overflow-ebad34dd.js +0 -2292
  351. package/dist/cjs/bcm-accordion.cjs.entry.js +0 -74
  352. package/dist/cjs/bcm-alert.cjs.entry.js +0 -99
  353. package/dist/cjs/bcm-attendance-actions.cjs.entry.js +0 -330
  354. package/dist/cjs/bcm-attendance.cjs.entry.js +0 -35
  355. package/dist/cjs/bcm-avatar_2.cjs.entry.js +0 -210
  356. package/dist/cjs/bcm-button-group.cjs.entry.js +0 -92
  357. package/dist/cjs/bcm-button.cjs.entry.js +0 -372
  358. package/dist/cjs/bcm-checkbox-group.cjs.entry.js +0 -415
  359. package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +0 -2529
  360. package/dist/cjs/bcm-checkbox_2.cjs.entry.js +0 -194
  361. package/dist/cjs/bcm-chip-group.cjs.entry.js +0 -128
  362. package/dist/cjs/bcm-chip.cjs.entry.js +0 -91
  363. package/dist/cjs/bcm-collapse-group.cjs.entry.js +0 -43
  364. package/dist/cjs/bcm-collapse.cjs.entry.js +0 -62
  365. package/dist/cjs/bcm-color-input.cjs.entry.js +0 -77
  366. package/dist/cjs/bcm-colorful_2.cjs.entry.js +0 -251
  367. package/dist/cjs/bcm-date.cjs.entry.js +0 -182
  368. package/dist/cjs/bcm-drawer.cjs.entry.js +0 -96
  369. package/dist/cjs/bcm-dropdown.cjs.entry.js +0 -119
  370. package/dist/cjs/bcm-error-layout.cjs.entry.js +0 -64
  371. package/dist/cjs/bcm-expansion-panel.cjs.entry.js +0 -116
  372. package/dist/cjs/bcm-form.cjs.entry.js +0 -492
  373. package/dist/cjs/bcm-icon_6.cjs.entry.js +0 -2152
  374. package/dist/cjs/bcm-input_2.cjs.entry.js +0 -550
  375. package/dist/cjs/bcm-item.cjs.entry.js +0 -72
  376. package/dist/cjs/bcm-items.cjs.entry.js +0 -49
  377. package/dist/cjs/bcm-link.cjs.entry.js +0 -51
  378. package/dist/cjs/bcm-menu.cjs.entry.js +0 -151
  379. package/dist/cjs/bcm-modal.cjs.entry.js +0 -157
  380. package/dist/cjs/bcm-old-input.cjs.entry.js +0 -397
  381. package/dist/cjs/bcm-old-tag_2.cjs.entry.js +0 -145
  382. package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +0 -115
  383. package/dist/cjs/bcm-popconfirm.cjs.entry.js +0 -101
  384. package/dist/cjs/bcm-popover.cjs.entry.js +0 -230
  385. package/dist/cjs/bcm-progress.cjs.entry.js +0 -162
  386. package/dist/cjs/bcm-radio-group.cjs.entry.js +0 -161
  387. package/dist/cjs/bcm-radio.cjs.entry.js +0 -65
  388. package/dist/cjs/bcm-range.cjs.entry.js +0 -183
  389. package/dist/cjs/bcm-rc-picker.cjs.entry.js +0 -10235
  390. package/dist/cjs/bcm-select.cjs.entry.js +0 -1195
  391. package/dist/cjs/bcm-shortcut.cjs.entry.js +0 -65
  392. package/dist/cjs/bcm-step.cjs.entry.js +0 -89
  393. package/dist/cjs/bcm-stepper.cjs.entry.js +0 -240
  394. package/dist/cjs/bcm-switch.cjs.entry.js +0 -151
  395. package/dist/cjs/bcm-tab-group.cjs.entry.js +0 -210
  396. package/dist/cjs/bcm-tab-item-header.cjs.entry.js +0 -60
  397. package/dist/cjs/bcm-tab-item.cjs.entry.js +0 -91
  398. package/dist/cjs/bcm-tab.cjs.entry.js +0 -72
  399. package/dist/cjs/bcm-tabs.cjs.entry.js +0 -370
  400. package/dist/cjs/bcm-text.cjs.entry.js +0 -49
  401. package/dist/cjs/index-d321de96.js +0 -193
  402. package/dist/cjs/input-template-4f41f5f2.js +0 -92
  403. package/dist/cjs/json-parse-decarator-ca73e0ee.js +0 -40
  404. package/dist/cjs/lodash-917168d7.js +0 -17199
  405. package/dist/cjs/moment-d06b012f.js +0 -4601
  406. package/dist/cjs/stepper-states-969da6c3.js +0 -85
  407. package/dist/cjs/tooltip-helper-a45a6cd4.js +0 -158
  408. package/dist/esm/Overflow-65c2db90.js +0 -2275
  409. package/dist/esm/bcm-accordion.entry.js +0 -70
  410. package/dist/esm/bcm-alert.entry.js +0 -95
  411. package/dist/esm/bcm-attendance-actions.entry.js +0 -326
  412. package/dist/esm/bcm-attendance.entry.js +0 -31
  413. package/dist/esm/bcm-avatar_2.entry.js +0 -205
  414. package/dist/esm/bcm-button-group.entry.js +0 -88
  415. package/dist/esm/bcm-button.entry.js +0 -368
  416. package/dist/esm/bcm-checkbox-group.entry.js +0 -411
  417. package/dist/esm/bcm-checkbox-lite_9.entry.js +0 -2517
  418. package/dist/esm/bcm-checkbox_2.entry.js +0 -189
  419. package/dist/esm/bcm-chip-group.entry.js +0 -124
  420. package/dist/esm/bcm-chip.entry.js +0 -87
  421. package/dist/esm/bcm-collapse-group.entry.js +0 -39
  422. package/dist/esm/bcm-collapse.entry.js +0 -58
  423. package/dist/esm/bcm-color-input.entry.js +0 -73
  424. package/dist/esm/bcm-colorful_2.entry.js +0 -246
  425. package/dist/esm/bcm-date.entry.js +0 -178
  426. package/dist/esm/bcm-drawer.entry.js +0 -92
  427. package/dist/esm/bcm-dropdown.entry.js +0 -115
  428. package/dist/esm/bcm-error-layout.entry.js +0 -60
  429. package/dist/esm/bcm-expansion-panel.entry.js +0 -112
  430. package/dist/esm/bcm-form.entry.js +0 -488
  431. package/dist/esm/bcm-icon_6.entry.js +0 -2143
  432. package/dist/esm/bcm-input_2.entry.js +0 -545
  433. package/dist/esm/bcm-item.entry.js +0 -68
  434. package/dist/esm/bcm-items.entry.js +0 -45
  435. package/dist/esm/bcm-link.entry.js +0 -47
  436. package/dist/esm/bcm-menu.entry.js +0 -147
  437. package/dist/esm/bcm-modal.entry.js +0 -153
  438. package/dist/esm/bcm-old-input.entry.js +0 -393
  439. package/dist/esm/bcm-old-tag_2.entry.js +0 -140
  440. package/dist/esm/bcm-popconfirm-box.entry.js +0 -111
  441. package/dist/esm/bcm-popconfirm.entry.js +0 -97
  442. package/dist/esm/bcm-popover.entry.js +0 -226
  443. package/dist/esm/bcm-progress.entry.js +0 -158
  444. package/dist/esm/bcm-radio-group.entry.js +0 -157
  445. package/dist/esm/bcm-radio.entry.js +0 -61
  446. package/dist/esm/bcm-range.entry.js +0 -179
  447. package/dist/esm/bcm-rc-picker.entry.js +0 -10231
  448. package/dist/esm/bcm-select.entry.js +0 -1191
  449. package/dist/esm/bcm-shortcut.entry.js +0 -61
  450. package/dist/esm/bcm-step.entry.js +0 -85
  451. package/dist/esm/bcm-stepper.entry.js +0 -236
  452. package/dist/esm/bcm-switch.entry.js +0 -147
  453. package/dist/esm/bcm-tab-group.entry.js +0 -206
  454. package/dist/esm/bcm-tab-item-header.entry.js +0 -56
  455. package/dist/esm/bcm-tab-item.entry.js +0 -87
  456. package/dist/esm/bcm-tab.entry.js +0 -68
  457. package/dist/esm/bcm-tabs.entry.js +0 -366
  458. package/dist/esm/bcm-text.entry.js +0 -45
  459. package/dist/esm/index-91dbe540.js +0 -191
  460. package/dist/esm/input-template-4d3a4e34.js +0 -90
  461. package/dist/esm/json-parse-decarator-1f7310a8.js +0 -38
  462. package/dist/esm/lodash-0a4396a7.js +0 -17197
  463. package/dist/esm/moment-15cd9198.js +0 -4598
  464. package/dist/esm/stepper-states-b1aa55b0.js +0 -83
  465. package/dist/esm/tooltip-helper-112e52a6.js +0 -156
@@ -1,2143 +0,0 @@
1
- /*!
2
- * Built with Stencil
3
- * Copyright (c) Bromcom.
4
- */
5
- import { r as registerInstance, g as getAssetPath, h, H as Host, a as getElement, c as createEvent } from './index-b3026131.js';
6
- import { I as IsLoad } from './is-load-decorator-613d613a.js';
7
- import { G as Generate, s as snq } from './generate-27c06421.js';
8
- import { B as Bcm, a as Bcm$1 } from './bcm-a50d55ba.js';
9
- import { L as LabelTemplate } from './label-template-8c5948ab.js';
10
- import { J as JsonParse } from './json-parse-decarator-1f7310a8.js';
11
- import './color-helper-e74656af.js';
12
- import './datetime-helper-df25808a.js';
13
- import { N as NumberHelper } from './number-helper-94a51ec2.js';
14
- import { S as StringHelper } from './string-helper-85990695.js';
15
- import { V as Validators } from './validators-7e605ca5.js';
16
- import './element-dragger-7ea06c76.js';
17
- import { g as getPlacement, s as setPosition } from './popover-placement-2f5939ea.js';
18
- import { p as pluralize, d as delay } from './utils-b3338faf.js';
19
- import { C as CaptionTemplate } from './caption-template-9d0ea503.js';
20
- import { c as classnames } from './index-b84bc8c9.js';
21
- import './types-6f06fa1a.js';
22
- import './types-9493a7ed.js';
23
- import { c as createStore } from './index-91dbe540.js';
24
- import { F as ForwardOverflow } from './Overflow-65c2db90.js';
25
- import { r as react, a as reactDom } from './index-a6d9d0af.js';
26
- import { I as InputTemplate } from './input-template-4d3a4e34.js';
27
- import { T as Tooltip } from './tooltip-helper-112e52a6.js';
28
- import './package-34090aad.js';
29
- import './colors-df32bb43.js';
30
- import './_commonjsHelpers-be0d4ec8.js';
31
- import './colors-1d7854ea.js';
32
- import './floating-ui-3f4394da.js';
33
-
34
- const iconCss = "@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-icon.hidden{display:none}";
35
-
36
- const customIconList = {
37
- "message-bot": "message-bot.svg",
38
- };
39
- const BcmIcon = class {
40
- constructor(hostRef) {
41
- registerInstance(this, hostRef);
42
- this.hidden = false;
43
- this.icon = undefined;
44
- }
45
- getIcon() {
46
- const { icon } = this;
47
- if (icon in customIconList) {
48
- const _icon = getAssetPath("./static/" + customIconList[icon]);
49
- return (h("div", { class: "tw-flex tw-h-fit tw-w-fit tw-items-center tw-justify-center" }, h("img", { src: `${_icon}`, alt: icon, class: "tw-h-fit tw-w-fit" })));
50
- }
51
- return h("i", { class: `${icon}` });
52
- }
53
- render() {
54
- const { /*icon,*/ hidden } = this;
55
- return h(Host, { class: `bcm-icon fa ${hidden ? "hidden" : ""}` }, this.getIcon());
56
- }
57
- static get assetsDirs() { return ["static"]; }
58
- get el() { return getElement(this); }
59
- };
60
- BcmIcon.style = iconCss;
61
-
62
- var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
63
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
64
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
65
- r = Reflect.decorate(decorators, target, key, desc);
66
- else
67
- for (var i = decorators.length - 1; i >= 0; i--)
68
- if (d = decorators[i])
69
- r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
70
- return c > 3 && r && Object.defineProperty(target, key, r), r;
71
- };
72
- const BcmLabel = class {
73
- constructor(hostRef) {
74
- registerInstance(this, hostRef);
75
- this._id = Generate.UID();
76
- this.required = false;
77
- this.value = undefined;
78
- this.label = undefined;
79
- this.size = "medium";
80
- this.form = undefined;
81
- this.htmlFor = undefined;
82
- this.hidden = false;
83
- this.type = Bcm.Status.default;
84
- this.tooltip = undefined;
85
- }
86
- render() {
87
- const { required, value, label, size, form, htmlFor, type, tooltip } = this;
88
- return (h(Host, { class: "tw-inline-block tw-leading-none" }, h(LabelTemplate, { form: form, htmlFor: htmlFor, value: value || label, size: size, type: type, required: required, tooltip: tooltip })));
89
- }
90
- get el() { return getElement(this); }
91
- };
92
- __decorate$1([
93
- IsLoad()
94
- ], BcmLabel.prototype, "el", void 0);
95
-
96
- const CheckboxTemplate = ({ disabled, checked, readonly, required, indeterminate, hidden, captionType, _id }) => {
97
- // if ( indeterminate ) {
98
- // checked = indeterminate == 'determinate' ? true : false
99
- // }
100
- const hostClasses = classnames('bcm-checkbox', 'bcm-checkbox__type-default', `bcm-checkbox-size-medium`, {
101
- // 'size-2': size === Bcm.Size.small || size === Bcm.Size.medium,
102
- // 'size-3': optionType === 'button' && size === Bcm.Size.large,
103
- 'error': captionType == Bcm.Status.error,
104
- hidden,
105
- checked,
106
- disabled,
107
- required,
108
- readonly,
109
- });
110
- const bcmCheckboxIconClass = classnames('bcm-checkbox__label-icon', 'bcm-checkbox__label-icon-lite', 'bcm-checkbox__label-icon-' + indeterminate, {
111
- 'bcm-checkbox__label-icon-checked': checked,
112
- });
113
- const bcmCheckboxLabelClass = classnames('bcm-checkbox__label');
114
- return (h("div", { class: hostClasses },
115
- h("input", { tabindex: "-1", id: _id, type: "checkbox", checked: checked, disabled: disabled, required: required, readonly: readonly }),
116
- h("label", { class: bcmCheckboxLabelClass, htmlFor: _id },
117
- h("span", { class: bcmCheckboxIconClass },
118
- h("bcm-icon", { icon: "far fa-check" })))));
119
- };
120
-
121
- const InfoFooterTemplate = ({ selected, total, found, multiple, variableText }) => {
122
- total = total || 0;
123
- variableText = variableText ? pluralize(variableText, total) : 'items';
124
- return (h("footer", { class: "bcm-info-footer" },
125
- h("bcm-text", { scale: "size-1", color: "grey-8" },
126
- (multiple && selected > 0) && ` ( ${selected} selected ) `,
127
- ` Total ${total} `,
128
- found != null && ` / ${found} `,
129
- ` ${variableText} found. `)));
130
- };
131
-
132
- const ListItemTemplate = ({ item, treeview, highlight, checkboxes, size, selectedItem, openGroup, checkedItem, focusItem, searchIsOnlyChilds }) => {
133
- const isHaveChildren = item.items && item.items.length > 0;
134
- var text = StringHelper.htmlEntities(item.text);
135
- let intersection = [];
136
- if (highlight && StringHelper.slugify(text).includes(StringHelper.slugify(highlight))) {
137
- if (!searchIsOnlyChilds || (searchIsOnlyChilds && (!isHaveChildren || (!treeview && item.type != "group")))) {
138
- text = StringHelper.highlight(text, highlight);
139
- }
140
- }
141
- if (item.type != 'group' && item.template) {
142
- const match = item.template
143
- .replace(/\s/g, '')
144
- .match(/\{{[^}}]+\}/g)
145
- .map(x => x.replace(/[{}]/g, ''));
146
- const keys = Object.keys(item.itemObject);
147
- intersection = match.filter(x => keys.includes(x));
148
- }
149
- text = item.isHtmlContent ? item.isHtmlContent : item.template && intersection.length > 0 ? StringHelper.templateParser(item.template, Object.assign(Object.assign({}, item.itemObject), { text })) : text;
150
- const unClickable = !treeview && item.type == "group" && !item.clickable;
151
- const disabled = item.disabled;
152
- const readonly = item.readonly;
153
- const itemClick = (event) => {
154
- let path = event.path || event.composedPath();
155
- if (path.filter(x => x.attributes && x.attributes.getNamedItem("unlinked"))[0]) {
156
- return;
157
- }
158
- // if (readonly) {
159
- // collapseClick();
160
- // }
161
- !unClickable && !disabled && !readonly && (checkboxes ? checkedItem(item.id) : selectedItem(item.id));
162
- };
163
- const collapseClick = () => {
164
- // if (disabled) {
165
- // return;
166
- // }
167
- item.open = item.isSearching;
168
- openGroup(item.id);
169
- };
170
- return (h("div", { id: item.id, hidden: item.hidden, "on-focus": e => !unClickable && !disabled && focusItem(e), tabIndex: unClickable || disabled ? -1 : 0, class: classnames('bcm-list__item',
171
- // size === 'large' ? 'size-3' : 'size-2',
172
- 'bcm-list__item-' + size, {
173
- 'bcm-list__item--group': !treeview && item.type == 'group',
174
- 'bcm-list__item--readonly': readonly,
175
- }) },
176
- h("div", { class: classnames('bcm-list__item-content', !checkboxes && item.selected && 'selected', { disabled, readonly }) },
177
- treeview && (h("div", { class: "bcm-list__item-content-collapse-icon", onClick: () => collapseClick() }, isHaveChildren && h("bcm-icon", { icon: classnames('fas fa-caret-' + (item.isSearching || item.open ? 'down' : 'right')) }))),
178
- h("div", { class: classnames('bcm-list__item-content-text', { treeview }), onClick: (e) => itemClick(e) },
179
- checkboxes && (treeview || (!treeview && item.type != 'group')) && (h("div", { class: "bcm-list__item-content-text-checkbox" },
180
- h(CheckboxTemplate, { indeterminate: item.indeterminate, checked: item.checked, disabled: item.disabled }))),
181
- h("span", Object.assign({ class: "bcm-list__item-content-text-inner" }, (item.title && { "title": item.title }), { innerHTML: text })))),
182
- (treeview || !treeview && item.type == "group") && isHaveChildren && (h("div", { class: "bcm-list__item-childs" }, (item.isSearching || item.open || (!treeview && item.type == "group")) &&
183
- item.items.map((item) => (h(ListItemTemplate, { highlight: highlight, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, size: size, selectedItem: selectedItem, checkedItem: checkedItem, openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) })))))));
184
- };
185
-
186
- const ListTemplate = ({ type, highlight, selectAllItem, bcmListContainer, treeview, checkboxes, checkAll, infoFooter, value, totalData, searchFound, variableText, _id, tempId, data, width, height, size, searchPlaceholder, minSearchLength, selectedItem, openGroup, checkedItem, onScrollEvent, focusItem, items, searchable, searchIsOnlyChilds, emptyText, emptyIcon, handleTransitionEnd, }) => {
187
- const showSelectAll = !(treeview && searchFound > 0) && !(searchFound > 0);
188
- const setScrollHeight = () => {
189
- const itemHeight = size === 'small' ? 28 : size === 'medium' ? 36 : 48;
190
- const itemCount = searchFound == null ? (treeview ? items.length : totalData) : searchFound;
191
- const scrollHeight = itemCount * itemHeight || 0;
192
- return Object.assign(Object.assign({ 'min-height': `${scrollHeight}px` }, (type === 'select' && { 'overscroll-behavior': 'none' })), { 'height': '100%', 'display': 'flex', 'flex-direction': 'column' });
193
- };
194
- return (h("div", { id: `bcm-list-${_id}`, class: bcmListContainer, "temp-id": `bcm-list-${tempId}`, style: { '--height': height, '--width': width }, onTransitionEnd: e => handleTransitionEnd(e) },
195
- data && searchable && (h("section", { class: "bcm-list__container-search" },
196
- h("bcm-search", { size: size, id: `bcm-list-${_id}-search`, data: data, clearable: true, placeholder: searchPlaceholder, "min-search-length": minSearchLength, searchIsOnlyChilds: searchIsOnlyChilds }))),
197
- h("main", { onScroll: e => onScrollEvent(e), class: "scrolling", style: Object.assign({}, (type === 'select' && { 'overscroll-behavior': 'none' })) },
198
- h("div", { style: setScrollHeight() },
199
- checkAll && searchFound != 0 && items && items.length > 0 && checkboxes && showSelectAll && (h("section", { class: "bcm-list__container-select-all" },
200
- h(ListItemTemplate, { size: size, item: selectAllItem, treeview: false, checkboxes: true, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
201
- items.map((item) => (h(ListItemTemplate, { highlight: highlight, size: size, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
202
- (!items || items.length === 0) && searchFound != 0 && (h("section", { class: "bcm-list__container-no-data" },
203
- h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
204
- h("span", { innerHTML: emptyText || 'No data' })))),
205
- searchFound == 0 && (h("section", { class: "bcm-list__container-no-data" },
206
- h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
207
- h("span", { innerHTML: emptyText || 'No Data Found' })))))),
208
- infoFooter && data && data.length > 0 && (h(InfoFooterTemplate, { selected: value === null || value === void 0 ? void 0 : value.length, total: totalData, found: searchFound, multiple: checkboxes, variableText: variableText }))));
209
- };
210
-
211
- const { state: state$1 } = createStore({
212
- value: new Map(),
213
- });
214
- const setValue$1 = val => {
215
- const { id, dataSource, options } = val;
216
- const { type, treeview, checkboxes, searchable, value, name, label, size, disabled, readonly, highlight, required, hidden, fullWidth, height, maxHeight, minHeight, width, infoFooter, variableText, template, allOpen, keyControl, checkAll, linkedComponent, placeholder, searchPlaceholder, searchIsOnlyChilds, clearable, caption, noCaption, captionType, captionError, placement, } = options;
217
- const itemOptions = { size, checkboxes, template, allOpen, highlight, treeview };
218
- const data = {
219
- id: snq(() => id, Generate.UID),
220
- dataSource: dataSource && dataSource.length > 0 && recursive$1(dataSource, itemOptions),
221
- options: {
222
- type,
223
- treeview,
224
- checkboxes,
225
- searchable,
226
- value,
227
- name,
228
- label,
229
- size,
230
- disabled,
231
- readonly,
232
- highlight,
233
- required,
234
- hidden,
235
- fullWidth,
236
- height,
237
- maxHeight,
238
- minHeight,
239
- width,
240
- infoFooter,
241
- variableText,
242
- template,
243
- allOpen,
244
- keyControl,
245
- checkAll,
246
- linkedComponent,
247
- placeholder,
248
- searchPlaceholder,
249
- searchIsOnlyChilds,
250
- clearable,
251
- caption,
252
- noCaption,
253
- captionType,
254
- captionError,
255
- placement,
256
- },
257
- totalItems: (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && calculateTotalItems(dataSource, options.treeview),
258
- totalRoots: dataSource === null || dataSource === void 0 ? void 0 : dataSource.length,
259
- };
260
- state$1.value.set(data.id, data);
261
- };
262
- const recursive$1 = (data, options, parentId, parentIndex = "0.") => {
263
- let recData = [];
264
- if (data && data.length > 0) {
265
- recData = data.map((item, index) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ itemObject: item }, item), options), { parentId: snq(() => parentId, null), open: options.allOpen || item.open || false }), ((options.treeview || (!options.treeview && item.type == 'group')) && item.items && item.items.length > 0
266
- ? { items: snq(() => recursive$1(item.items, options, item.id, `${parentIndex}${index}`), []) }
267
- : { items: [] })), { ct: `${parentIndex}${index}` })));
268
- }
269
- return recData;
270
- };
271
- const removeValue$1 = _id => {
272
- state$1.value.delete(_id);
273
- };
274
- const getValue$1 = id => snq(() => state$1.value.get(id), {});
275
- const calculateTotalItems = (dataSource, treeview) => {
276
- let total = 0;
277
- let selectableItems = 0;
278
- dataSource.forEach(item => {
279
- if (treeview || (!treeview && item.type != "group")) {
280
- total += 1;
281
- if (!item.disabled) {
282
- selectableItems += 1;
283
- }
284
- }
285
- if ((treeview || (!treeview && item.type == "group")) && item.items) {
286
- const result = calculateTotalItems(item.items, treeview);
287
- total += result.total;
288
- selectableItems += result.selectableItems;
289
- }
290
- });
291
- return { total, selectableItems };
292
- };
293
- const getData = id => {
294
- let data = [];
295
- const value = getValue$1(id);
296
- if (value) {
297
- const { dataSource } = value;
298
- data = dataSource;
299
- }
300
- return data;
301
- };
302
- const getDataPagination$1 = (id, limit = 3, ids) => {
303
- let data = [];
304
- const value = getValue$1(id);
305
- if (value) {
306
- const { dataSource } = value;
307
- data = !ids ? dataSource.slice(0, limit) : dataSource.filter(item => ids.indexOf(item.id) > -1).slice(0, limit);
308
- }
309
- return data;
310
- };
311
- const openGroup = (id, groupId, items, status) => {
312
- let dataSource;
313
- if (items) {
314
- dataSource = items;
315
- }
316
- else {
317
- const value = getValue$1(id);
318
- dataSource = value.dataSource;
319
- }
320
- if (dataSource) {
321
- dataSource.forEach(item => {
322
- if (status != undefined) {
323
- item.open = status;
324
- }
325
- else if (item.id == groupId) {
326
- item.open = !item.open;
327
- item.isSearching = item.open;
328
- if (!item.open && item.items) {
329
- openGroup(id, groupId, item.items, false);
330
- }
331
- }
332
- else if (item.items) {
333
- openGroup(id, groupId, item.items);
334
- }
335
- });
336
- }
337
- };
338
- const removeOtherTags = (id, ids, items) => {
339
- ids = Array.isArray(ids) ? ids : [ids];
340
- let dataSource;
341
- if (items) {
342
- dataSource = items;
343
- }
344
- else {
345
- const value = getValue$1(id);
346
- dataSource = value.dataSource;
347
- }
348
- if (dataSource) {
349
- ids.forEach(otherTagIds => {
350
- dataSource.forEach(child => {
351
- if (child.id == otherTagIds) {
352
- child.checked = false;
353
- child.itemObject.checked = false;
354
- }
355
- else if (child.items) {
356
- onRemoveItems(id, otherTagIds, child.items);
357
- }
358
- });
359
- });
360
- }
361
- };
362
- const onRemoveItems = (id, itemId, items) => {
363
- if (items) {
364
- items.forEach(item => {
365
- if (item.id == itemId) {
366
- item.checked = false;
367
- item.itemObject.checked = false;
368
- indeterminateStatus(id, item.parentId);
369
- }
370
- else if (item.items) {
371
- onRemoveItems(id, itemId, item.items);
372
- }
373
- });
374
- }
375
- };
376
- const addChecked = (id, ids) => {
377
- const value = getValue$1(id);
378
- if (value) {
379
- ids.forEach(item => {
380
- checkedItem(id, item);
381
- });
382
- }
383
- };
384
- const checkedItem = (id, itemId) => {
385
- findItem(id, itemId);
386
- };
387
- const findItem = (id, itemId, items) => {
388
- itemId = Array.isArray(itemId) ? itemId : [itemId];
389
- let dataSource;
390
- if (items) {
391
- dataSource = items;
392
- }
393
- else {
394
- const value = getValue$1(id);
395
- dataSource = value.dataSource;
396
- }
397
- if (dataSource) {
398
- dataSource.forEach(item => {
399
- if (itemId.includes(item.id)) {
400
- checkedProcess(id, item);
401
- if (item.parentId) {
402
- indeterminateStatus(id, item.parentId);
403
- }
404
- }
405
- else if (item.items) {
406
- findItem(id, itemId, item.items);
407
- }
408
- });
409
- }
410
- };
411
- const checkedProcess = (id, item, status) => {
412
- const value = getValue$1(id);
413
- if (value) {
414
- const treeview = value.options.treeview;
415
- if (item) {
416
- // && !item.hidden => select all bastığımızda hidden olanları seçmemesi içindi
417
- if (treeview || (!treeview && item.type != "group")) {
418
- if (!item.disabled) {
419
- if (status != undefined) {
420
- item.checked = status;
421
- }
422
- else {
423
- item.checked = !item.checked;
424
- }
425
- item.itemObject.checked = item.checked;
426
- item.indeterminate = item.checked ? "determinate" : "uncheck";
427
- }
428
- }
429
- if (item.items) {
430
- item.items.forEach(child => {
431
- checkedProcess(id, child, status == undefined ? item.checked : status);
432
- });
433
- }
434
- }
435
- }
436
- };
437
- const indeterminateStatus = (id, itemId, items) => {
438
- let dataSource;
439
- if (items) {
440
- dataSource = items;
441
- }
442
- else {
443
- const value = getValue$1(id);
444
- dataSource = value.dataSource;
445
- }
446
- if (dataSource) {
447
- dataSource.forEach(item => {
448
- if (item.id == itemId) {
449
- let allChecked = true;
450
- let allUnchecked = true;
451
- if (item.items) {
452
- item.items.map(child => {
453
- (child.checked || child.indeterminate === "indeterminate") && (allUnchecked = false);
454
- !child.checked && (allChecked = false);
455
- });
456
- }
457
- const indeterminateState = !allChecked && !allUnchecked ? "indeterminate" : allChecked ? "determinate" : "uncheck";
458
- item.indeterminate = indeterminateState;
459
- item.checked = indeterminateState == "determinate" ? true : false;
460
- item.itemObject.checked = item.checked;
461
- if (item.parentId) {
462
- indeterminateStatus(id, item.parentId);
463
- }
464
- }
465
- else if (item.items) {
466
- indeterminateStatus(id, itemId, item.items);
467
- }
468
- });
469
- }
470
- };
471
- const filterData = (id, ids, items, searchOtherTag) => {
472
- let checkeds = [];
473
- let visibled = [];
474
- getValue$1(id).isSearchOtherTag = searchOtherTag;
475
- let dataSource;
476
- if (items) {
477
- dataSource = items;
478
- }
479
- else {
480
- const value = getValue$1(id);
481
- dataSource = value.dataSource;
482
- }
483
- if (dataSource) {
484
- dataSource.forEach(item => {
485
- if (ids) {
486
- item.hidden = true;
487
- // const filter = ids.find((find) => find.id === item.id)
488
- var filter;
489
- for (let index = 0; index < ids.length; index++) {
490
- if (ids[index].id === item.id) {
491
- filter = ids[index];
492
- break;
493
- }
494
- }
495
- if (filter) {
496
- item.hidden = false;
497
- if (!getValue$1(id).isSearchOtherTag) {
498
- item.isSearching = true;
499
- }
500
- visibled.push(item);
501
- if (item.checked) {
502
- checkeds.push(item);
503
- }
504
- if (filter.items) {
505
- const { checkedItems, visibledItems } = filterData(id, filter.items, item.items, searchOtherTag);
506
- if (checkedItems) {
507
- checkeds = [...new Set([...checkeds, ...checkedItems])];
508
- }
509
- if (visibledItems) {
510
- visibled = [...new Set([...visibled, ...visibledItems])];
511
- }
512
- }
513
- }
514
- }
515
- else {
516
- item.hidden = false;
517
- if (item.items) {
518
- filterData(id, null, item.items);
519
- }
520
- visibled.push(item);
521
- item.isSearching = false;
522
- }
523
- });
524
- }
525
- return { checkedItems: checkeds !== null && checkeds !== void 0 ? checkeds : [], visibledItems: visibled !== null && visibled !== void 0 ? visibled : [] };
526
- };
527
- const getSelected = (id, items) => {
528
- let dataSource;
529
- let selected = null;
530
- if (items) {
531
- dataSource = items;
532
- }
533
- else {
534
- const value = getValue$1(id);
535
- dataSource = value.dataSource;
536
- }
537
- if (dataSource) {
538
- dataSource.forEach(item => {
539
- if (item.selected) {
540
- selected = item.itemObject;
541
- }
542
- else if (item.items) {
543
- const found = getSelected(id, item.items);
544
- if (found) {
545
- selected = found;
546
- }
547
- }
548
- });
549
- }
550
- return selected;
551
- };
552
- const getCheckedList = (id, items) => {
553
- let dataSource;
554
- let checkedList = [];
555
- let nestedResult = [];
556
- if (items) {
557
- dataSource = items;
558
- }
559
- else {
560
- const value = getValue$1(id);
561
- dataSource = value.dataSource;
562
- }
563
- if (dataSource) {
564
- dataSource.forEach(item => {
565
- var _a;
566
- const newItem = Object.assign(Object.assign({}, item.itemObject), { ct: item.ct });
567
- let foundChild = [];
568
- let foundItem = [];
569
- if (item.checked) {
570
- checkedList.push(newItem);
571
- foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
572
- }
573
- if (item.items) {
574
- const found = getCheckedList(id, item.items);
575
- if (((_a = found === null || found === void 0 ? void 0 : found.checkedList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
576
- checkedList = [...checkedList, ...found.checkedList];
577
- }
578
- if (found.nestedResult.length > 0) {
579
- foundChild = found.nestedResult;
580
- }
581
- }
582
- if (foundChild.length > 0) {
583
- if (foundItem.length == 0) {
584
- foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
585
- }
586
- foundItem[0].items = foundChild;
587
- nestedResult.push(foundItem[0]);
588
- }
589
- else {
590
- if (foundItem.length > 0) {
591
- foundItem[0].items = foundChild;
592
- nestedResult.push(foundItem[0]);
593
- }
594
- }
595
- });
596
- }
597
- return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
598
- };
599
- const selectedItem = (id, itemId, items) => {
600
- let dataSource;
601
- let selected = [];
602
- if (items) {
603
- dataSource = items;
604
- }
605
- else {
606
- const value = getValue$1(id);
607
- dataSource = value.dataSource;
608
- }
609
- if (dataSource) {
610
- dataSource.forEach(item => {
611
- if (itemId) {
612
- if (item.id == itemId) {
613
- // if (!item.selected){
614
- item.selected = true;
615
- item.itemObject.selected = item.selected;
616
- // }
617
- }
618
- else {
619
- if (item.selected) {
620
- item.selected = false;
621
- item.itemObject.selected = item.selected;
622
- }
623
- }
624
- }
625
- if (item.items) {
626
- const found = selectedItem(id, itemId, item.items);
627
- if ((found === null || found === void 0 ? void 0 : found.length) > 0) {
628
- selected = [...selected, ...found];
629
- }
630
- }
631
- if (item.selected) {
632
- selected.push(item.itemObject);
633
- }
634
- });
635
- }
636
- return selected && selected.length > 0 ? selected : null;
637
- };
638
- const setClear = (id, items) => {
639
- let dataSource;
640
- if (items) {
641
- dataSource = items;
642
- }
643
- else {
644
- const value = getValue$1(id);
645
- dataSource = value.dataSource;
646
- }
647
- if (dataSource) {
648
- dataSource.forEach(item => {
649
- var _a, _b, _c;
650
- item.checked && (item.checked = false);
651
- item.selected && (item.selected = false);
652
- item.indeterminate && (item.indeterminate = "uncheck");
653
- ((_a = item.itemObject) === null || _a === void 0 ? void 0 : _a.checked) && (item.itemObject.checked = false);
654
- ((_b = item.itemObject) === null || _b === void 0 ? void 0 : _b.selected) && (item.itemObject.selected = false);
655
- ((_c = item.itemObject) === null || _c === void 0 ? void 0 : _c.indeterminate) && (item.itemObject.indeterminate = "uncheck");
656
- if (item.items) {
657
- setClear(id, item.items);
658
- }
659
- });
660
- }
661
- };
662
- const selectAll = (id, status) => {
663
- var _a, _b;
664
- if (status == undefined) {
665
- const totalItems = getValue$1(id).totalItems;
666
- const checkedItems = ((_b = (_a = getCheckedList(id)) === null || _a === void 0 ? void 0 : _a.checkedList) === null || _b === void 0 ? void 0 : _b.length) || 0;
667
- status = totalItems.selectableItems !== checkedItems;
668
- }
669
- const dataSource = getValue$1(id).dataSource;
670
- if (dataSource) {
671
- dataSource.forEach(item => {
672
- checkedProcess(id, item, status);
673
- });
674
- }
675
- };
676
- const updateOptions = (id, options) => {
677
- Object.keys(getValue$1(id).options).forEach(key => {
678
- getValue$1(id).options[key] = options[key];
679
- });
680
- };
681
- const removeState = id => {
682
- return Promise.resolve(state$1.value.delete(id));
683
- };
684
- const listState = {
685
- setValue: setValue$1,
686
- removeValue: removeValue$1,
687
- getValue: getValue$1,
688
- getData,
689
- getDataPagination: getDataPagination$1,
690
- openGroup,
691
- checkedItem,
692
- filterData,
693
- getSelected,
694
- getCheckedList,
695
- selectedItem,
696
- addChecked,
697
- setClear,
698
- selectAll,
699
- removeOtherTags,
700
- onRemoveItems,
701
- updateOptions,
702
- removeState,
703
- };
704
-
705
- class KeyControl {
706
- constructor(keyCode, element, elementName, childElementName) {
707
- this.elementName = '';
708
- this.childElementName = '';
709
- this.keyCode = keyCode;
710
- this.element = element;
711
- this.elementName = elementName;
712
- this.childElementName = childElementName;
713
- }
714
- getKeyCode() {
715
- return this.keyCode;
716
- }
717
- getElementName() {
718
- return this.elementName;
719
- }
720
- getChildElementName() {
721
- return this.childElementName;
722
- }
723
- getFocusedElementName() {
724
- return this.getElementName() + '.focused';
725
- }
726
- getFocusedElement() {
727
- return this.element.querySelectorAll(this.getFocusedElementName())[0] || null;
728
- }
729
- getFirstElement() {
730
- return this.element.querySelectorAll(this.getElementName())[0] || null;
731
- }
732
- getNextElement() {
733
- var _a;
734
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) || this.getFirstElement();
735
- }
736
- getPreviousElement() {
737
- var _a;
738
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) || this.getFirstElement();
739
- }
740
- getChildElement() {
741
- var _a;
742
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName())[0]) || null;
743
- }
744
- getParentElement(element) {
745
- if (element && element) {
746
- const isRootElement = element && element.attributes['data-isroot'];
747
- if (isRootElement) {
748
- return element;
749
- }
750
- return this.getParentElement(element.parentNode);
751
- }
752
- }
753
- focusElementIsOpen() {
754
- var _a;
755
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.classList.contains('bcm-list__item--open')) || false;
756
- }
757
- isRootElement() {
758
- var _a;
759
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName()).length) > 0;
760
- }
761
- isRootElementIsOpen() {
762
- return this.getFocusedElement().classList.contains('bcm-list__item--open');
763
- }
764
- getFocusedChildElement() {
765
- var _a;
766
- return ((_a = this.getChildElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.focused')[0]) || null;
767
- }
768
- isLastElement() {
769
- var _a;
770
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) === null;
771
- }
772
- focusParentElementFirstChild() {
773
- var _a, _b;
774
- return this.setFocus((_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.firstChild);
775
- }
776
- isFirstElement() {
777
- var _a;
778
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null;
779
- }
780
- focusRootElement() {
781
- var _a, _b, _c;
782
- return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.firstChild);
783
- }
784
- nextRootElement() {
785
- var _a, _b, _c;
786
- return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.nextElementSibling);
787
- }
788
- findFocusElementParent() {
789
- return this.getFocusedElement().parentNode.querySelectorAll('.bcm-list__item--open');
790
- }
791
- getLastElement() {
792
- return this.element.querySelectorAll(this.getElementName())[this.element.querySelectorAll(this.getElementName()).length - 1] || null;
793
- }
794
- setFocus(element) {
795
- element.focus();
796
- }
797
- }
798
-
799
- class ListKeyControl extends KeyControl {
800
- constructor(keyCode, element, treeview, checkBoxes) {
801
- super(keyCode, element, '.bcm-list__item', '.bcm-list__item-childs');
802
- this.isTreeview = false;
803
- this.isCheckBoxes = false;
804
- this.isTreeview = treeview;
805
- this.isCheckBoxes = checkBoxes;
806
- }
807
- keyUpControl() {
808
- if (this.isTreeview) {
809
- this.keyUpTreeview();
810
- }
811
- else {
812
- if (this.isFirstElement()) {
813
- this.setFocus(this.getLastElement());
814
- }
815
- else {
816
- this.setFocus(this.getPreviousElement());
817
- }
818
- }
819
- }
820
- keyDownTreeView() {
821
- var _a;
822
- if (this.isTreeview) {
823
- if (this.isRootElement() && this.isRootElementIsOpen()) {
824
- const childs = this.getChildElement();
825
- if (childs) {
826
- this.setFocus(childs.firstChild);
827
- }
828
- }
829
- else {
830
- if (this.isLastElement() && this.getParentElement(this.getFocusedElement())) {
831
- this.setFocus((_a = this.getParentElement(this.getFocusedElement())) === null || _a === void 0 ? void 0 : _a.nextElementSibling);
832
- }
833
- else {
834
- this.setFocus(this.getNextElement());
835
- }
836
- }
837
- }
838
- }
839
- keyUpTreeview() {
840
- if (this.isFirstElement()) {
841
- const parent = this.getParentElement(this.getFocusedElement());
842
- this.setFocus(parent);
843
- }
844
- else {
845
- const previousElement = this.getPreviousElement();
846
- if (previousElement) {
847
- if (previousElement.classList.contains('bcm-list__item--open')) {
848
- const getChildElement = previousElement.querySelectorAll(this.getChildElementName())[0];
849
- console.log({ getChildElement });
850
- this.setFocus(getChildElement.lastChild);
851
- }
852
- else {
853
- this.setFocus(previousElement);
854
- }
855
- }
856
- }
857
- }
858
- keyDownControl() {
859
- if (this.isTreeview) {
860
- this.keyDownTreeView();
861
- }
862
- else {
863
- if (this.isLastElement()) {
864
- this.setFocus(this.getFirstElement());
865
- }
866
- else {
867
- this.setFocus(this.getNextElement());
868
- }
869
- }
870
- }
871
- keyRightControl() {
872
- if (this.isTreeview) {
873
- if (!this.isRootElementIsOpen() && this.isRootElement()) {
874
- const { id } = this.getFocusedElement();
875
- this.openGroup(id);
876
- }
877
- }
878
- }
879
- keyLeftControl() {
880
- if (this.isTreeview) {
881
- if (this.isRootElementIsOpen() && this.isRootElement()) {
882
- const { id } = this.getFocusedElement();
883
- this.openGroup(id);
884
- }
885
- }
886
- }
887
- keyEnterControl() { }
888
- keySpaceControl() {
889
- if (this.isCheckBoxes) {
890
- const { id } = this.getFocusedElement();
891
- this.checkedItem(id);
892
- }
893
- }
894
- keyDown() {
895
- switch (this.getKeyCode()) {
896
- case Bcm.KeyCode.up:
897
- this.keyUpControl();
898
- break;
899
- case Bcm.KeyCode.down:
900
- this.keyDownControl();
901
- break;
902
- case Bcm.KeyCode.left:
903
- this.keyLeftControl();
904
- break;
905
- case Bcm.KeyCode.right:
906
- this.keyRightControl();
907
- break;
908
- case Bcm.KeyCode.enter:
909
- this.keyEnterControl();
910
- break;
911
- case Bcm.KeyCode.space:
912
- this.keySpaceControl();
913
- break;
914
- }
915
- }
916
- keyUp() { }
917
- }
918
-
919
- const listCss = "@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\"); @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}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}*{box-sizing:border-box}*{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}.bcm-list{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;--width:256px;--height:256px;--max-height:inherit;--min-height:inherit;min-width:90px;display:flex;flex-direction:column;margin:0 0 8px 0}.bcm-list__listbox .bcm-list__container{height:var(--height);max-height:var(--max-height);min-height:var(--min-height)}.bcm-list.full-width{width:100%}.bcm-list__size-small .bcm-list__input{height:24px;font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-small .bcm-list__input .bcm-tag__content.dismissable{font-size:10px;line-height:calc(10px + 8px)}.bcm-list__size-medium .bcm-list__input{height:32px;font-size:14px;line-height:calc(14px + 8px)}.bcm-list__size-medium .bcm-list__input .bcm-tag__content.dismissable{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-large .bcm-list__input{height:40px;font-size:16px;line-height:calc(16px + 8px)}.bcm-list__size-large .bcm-list__input .bcm-tag__content.dismissable{font-size:14px;line-height:calc(14px + 8px)}.bcm-list:hover{outline:none}.bcm-list:hover .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-500);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list:focus-visible{outline:none}.bcm-list:focus-visible .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);background-color:var(--bcm-new-ds-color-white)}.bcm-list:active{outline:none}.bcm-list:active .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list__container{--width:256px;--height:256px;width:var(--width);height:var(--height);background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;padding-top:8px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;gap:4px}.bcm-list__container main{padding:0 8px;flex:1;overflow:auto;display:flex;flex-direction:column}.bcm-list__container-search{margin:0 8px}.bcm-list__container-search:after{margin:4px 0}.bcm-list__container-no-data{flex:1;display:flex;justify-content:stretch;align-items:stretch;padding-bottom:4px}.bcm-list__container.error{border-color:var(--bcm-color-red-6)}.bcm-list__container.full-width{width:100%}.bcm-list__container.bcm-list__type-linked-component,.bcm-list__container.bcm-list__type-select,.bcm-list__container.bcm-list__type-autocomplete{display:none;opacity:0;visibility:hidden;position:absolute;top:0;left:0;height:0;width:0;transform:translateY(10%);z-index:10800}.bcm-list__container.bcm-list__type-linked-component.is-open,.bcm-list__container.bcm-list__type-select.is-open,.bcm-list__container.bcm-list__type-autocomplete.is-open{transition:transform 50ms;display:flex}.bcm-list__container.bcm-list__type-linked-component.is-open-animation,.bcm-list__container.bcm-list__type-select.is-open-animation,.bcm-list__container.bcm-list__type-autocomplete.is-open-animation{opacity:1;transform:translateY(0);visibility:visible}.bcm-list__container.bcm-list__type-linked-component{margin-top:2px}.bcm-list__label{line-height:1}.bcm-list__input{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-white);user-select:none;cursor:pointer;padding:0 8px;height:32px;overflow:hidden;position:relative;transition:background-color 100ms, border-color 100ms}.bcm-list__input-spinner{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:var(--bcm-color-grey-1);opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out;z-index:-1}.bcm-list__input-spinner.is-open{opacity:1;visibility:visible;z-index:1}.bcm-list__input-container{flex:1;display:block;overflow:hidden}.bcm-list__input-container.value-empty{color:#6B7280}.bcm-list__input-container.type-single,.bcm-list__input-container.value-empty{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-list__input-placeholder{color:#6B7280}.bcm-list__input-tag-container{height:100%;width:100%;display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;grid-gap:2px;line-height:1}.bcm-list__input-buttons{display:flex;align-items:center;justify-content:flex-end;grid-gap:4px}.bcm-list__input-buttons-button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 4px 0 4px;font-size:16px;color:var(--bcm-new-ds-color-slate-500)}.bcm-list__input-buttons-button.caret-is{transform:rotate(360deg);transition:transform 0.2s ease-in-out}.bcm-list__input-buttons-button.caret-is-open{transform:rotate(180deg)}.bcm-list__input-buttons:not(.disabled) .bcm-list__input-buttons-button:hover{cursor:pointer;color:var(--bcm-new-ds-color-slate-600)}.bcm-list__input-autocomplete{position:relative;padding-right:0}.bcm-list__input-autocomplete .bcm-list-input-selected-text{background-color:#ffffff;display:flex;align-items:center;justify-content:flex-start;width:calc(100% - 24px);height:100%;padding:0 calc(8px + 4px);position:absolute;top:0;left:0}.bcm-list__input-autocomplete .bcm-list__input-container{height:100%;display:flex;flex-direction:row}.bcm-list__input-autocomplete .bcm-list__input-container .bcm-list__input-tag-container{width:auto}.bcm-list__input-autocomplete .bcm-input,.bcm-list__input-autocomplete .bcm-list__autocomplete{height:100%;min-width:70px;width:100%}.bcm-list__input-autocomplete .bcm-input__container,.bcm-list__input-autocomplete .bcm-list__autocomplete__container{height:100%;border:none;padding:0;width:100%}.bcm-list__input-autocomplete .bcm-input__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-input__container:not(.disabled):hover,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled):hover{border:none;box-shadow:none}.bcm-list__autocomplete{width:100%;position:relative}.bcm-list.full-width .bcm-list__container,.bcm-list.full-width .bcm-list__input{width:100%}.bcm-list.error .bcm-list__input{border-color:var(--bcm-color-red-6)}.bcm-list.disabled .bcm-list__container,.bcm-list.disabled .bcm-list__input{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-list.disabled .bcm-tag__content.dismissable .close-button{cursor:default}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button bcm-icon{color:var(--bcm-new-ds-color-slate-100)}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button:hover bcm-icon{color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:hover{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list:not(.disabled) .bcm-list__input:hover .bcm-tag__content.dismissable:not(.checked){background-color:var(--bcm-new-ds-color-slate-200);border-color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:focus-visible{border-color:var(--bcm-new-ds-color-blue-500);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list:not(.disabled) .bcm-list__input:active{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item{padding:2px 0}.bcm-list__item.disabled{user-select:none}.bcm-list__item:focus{outline:none}.bcm-list__item:focus-visible>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item:focus-visible>.bcm-list__item-content:not(.disabled){color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item-content{display:flex;flex-direction:row;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;cursor:pointer;border-radius:4px;padding:0;padding-left:4px;color:var(--bcm-new-ds-color-slate-700);transition:background-color 0.2s ease}.bcm-list__item-content.disabled{color:var(--bcm-new-ds-color-slate-400);background-color:var(--bcm-new-ds-color-slate-200);user-select:none;cursor:not-allowed}.bcm-list__item-content.readonly{color:var(--bcm-new-ds-color-slate-500);background-color:var(--bcm-new-ds-color-slate-100);cursor:default}.bcm-list__item-content.readonly .bcm-list__item-content-collapse-icon{color:var(--bcm-new-ds-color-slate-700);cursor:pointer}.bcm-list__item-content.selected{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item-content.selected:hover:not(.disabled):not(.readonly){color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item-content:hover:not(.disabled):not(.readonly){background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item-content:active:not(.disabled):not(.readonly){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item-content-collapse-icon{width:16px;padding:0 8px;display:flex;align-items:center;justify-content:center;font-size:16px}.bcm-list__item-content-collapse-icon.child{cursor:pointer}.bcm-list__item-content-text{user-select:none;padding:8px;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.bcm-list__item-content-text.treeview{padding:8px 0}.bcm-list__item-content-text-checkbox{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:nowrap;margin-right:8px}.bcm-list__item-content-text-checkbox .bcm-checkbox{margin:0}.bcm-list__item-content-text-inner{width:100%}.bcm-list__item-content-text mark{padding:0;margin:0;font-size:inherit;color:var(--bcm-color-grey-8);background-color:var(--bcm-color-yellow-4)}.bcm-list__item-childs{padding-left:16px}.bcm-list__item-small{padding:2px 0 2px 8px;font-size:10px;line-height:calc(10px + 8px)}.bcm-list__item-small .bcm-list__item-content-text{padding:3px 4px}.bcm-list__item-medium{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__item-medium .bcm-list__item-content-text{padding:6px 4px}.bcm-list__item-large{font-size:14px;line-height:calc(14px + 8px)}.bcm-list__item-large .bcm-list__item-content-text{padding:9px 4px}.bcm-list__item--group{border-radius:4px}.bcm-list__item--group:focus>.bcm-list__item-content:not(.disabled){background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);border-radius:4px 4px 0 0;cursor:default;font-size:14px;line-height:calc(14px + 8px);font-weight:500;position:sticky;top:0}.bcm-list__item--group>.bcm-list__item-content>.bcm-list__item-content-text{padding:4px 8px 4px 16px}.bcm-list__item--group>.bcm-list__item-content:hover,.bcm-list__item--group>.bcm-list__item-content:focus{color:var(--bcm-new-ds-color-slate-800);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-content-unclickable:hover{color:var(--bcm-new-ds-color-slate-700);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-childs{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);padding-bottom:8px;border-radius:0 0 4px 4px;padding-left:8px}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content{background-color:var(--bcm-new-ds-color-white);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:hover{background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:active{background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:focus-visible{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected{background-color:var(--bcm-new-ds-color-blue-500);color:var(--bcm-new-ds-color-white)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:hover{background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:active{background-color:var(--bcm-new-ds-color-blue-700)}.bcm-list__linked{display:none}.bcm-list .bcm-tag--other .value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-info-footer{text-align:right;padding:4px 8px;background-color:var(--bcm-new-ds-color-slate-100);color:var(--bcm-new-ds-color-slate-600);border-radius:0 0 4px 4px}";
920
-
921
- var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
922
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
923
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
924
- r = Reflect.decorate(decorators, target, key, desc);
925
- else
926
- for (var i = decorators.length - 1; i >= 0; i--)
927
- if (d = decorators[i])
928
- r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
929
- return c > 3 && r && Object.defineProperty(target, key, r), r;
930
- };
931
- const BcmList = class {
932
- constructor(hostRef) {
933
- registerInstance(this, hostRef);
934
- this.bcmChecklist = createEvent(this, "bcm-checklist", 7);
935
- this.bcmSelected = createEvent(this, "bcm-selected", 7);
936
- this.change = createEvent(this, "bcm-change", 7);
937
- this.open = createEvent(this, "bcm-open", 3);
938
- this.close = createEvent(this, "bcm-close", 3);
939
- this.listClose = createEvent(this, "bcm-list-close", 7);
940
- this.listOpen = createEvent(this, "bcm-list-open", 7);
941
- this.debounce = null;
942
- this.debounceHandler = Generate.debounceInput(() => this.listenResize(), 300, false);
943
- this._id = Generate.UID();
944
- this.tempId = Generate.UID();
945
- this.type = Bcm$1.ListType.listbox;
946
- this.treeview = false;
947
- this.checkboxes = false;
948
- this.searchable = false;
949
- this.value = null;
950
- this.inputText = undefined;
951
- this.name = undefined;
952
- this.label = undefined;
953
- this.size = Bcm$1.Size.medium;
954
- this.disabled = false;
955
- this.readonly = false;
956
- this.highlight = false;
957
- this.highlightText = undefined;
958
- this.required = false;
959
- this.hidden = false;
960
- this.fullWidth = false;
961
- this.height = "256px";
962
- this.maxHeight = "500px";
963
- this.minHeight = "150px";
964
- this.width = "256px";
965
- this.tooltip = undefined;
966
- this.infoFooter = false;
967
- this.variableText = "item";
968
- this.template = undefined;
969
- this.allOpen = false;
970
- this.keyControl = false;
971
- this.checkAll = true;
972
- this.stopDeepClean = false;
973
- this.openIntersecting = false;
974
- this.linkedComponent = undefined;
975
- this.isOpen = false;
976
- this.isOpenAnimation = false;
977
- this.calculatedViewport = false;
978
- this.isSelectedOther = false;
979
- this.isHaveOtherTag = false;
980
- this.placeholder = "Choose an option";
981
- this.searchPlaceholder = "Search";
982
- this.searchIsOnlyChilds = false;
983
- this.minSearchLength = 2;
984
- this.clearable = false;
985
- this.caption = undefined;
986
- this.noCaption = false;
987
- this.captionType = Bcm$1.Status.default;
988
- this.captionError = undefined;
989
- this.emptyText = undefined;
990
- this.emptyIcon = "fad fa-folder-open";
991
- this.captionCache = undefined;
992
- this.captionTypeCache = undefined;
993
- this.tick = {};
994
- this.totalData = 0;
995
- this.totalRootData = 0;
996
- this.limit = 20;
997
- this.searchGetParents = undefined;
998
- this.searchResultLimit = 20;
999
- this.searchFound = null;
1000
- this.returnFilterData = {};
1001
- this.returnOtherData = {};
1002
- this.options = {
1003
- rootMargin: "30px",
1004
- };
1005
- this.tagContainerWidth = 0;
1006
- this.selectAllItem = {
1007
- id: "select-all-" + this._id,
1008
- text: "Select All",
1009
- value: "select-all",
1010
- checked: false,
1011
- disabled: false,
1012
- icon: "",
1013
- status: Bcm$1.Status.default,
1014
- indeterminate: "uncheck",
1015
- };
1016
- this.shouldTriggerChange = undefined;
1017
- this.placement = Bcm$1.Placement["bottom-start"];
1018
- this.disableChangeEvent = false;
1019
- this.autoFocusSelected = false;
1020
- this.data = [];
1021
- window.addEventListener("scroll", this.handleWheel.bind(this), true);
1022
- window.addEventListener("wheel", this.handleWheel.bind(this), true);
1023
- window.addEventListener("resize", this.handleResize.bind(this), true);
1024
- }
1025
- connectedCallback() {
1026
- if (this.height != "256px") {
1027
- if (this.height.indexOf("px") > -1) {
1028
- this.limit = Math.floor(+this.height.replace("px", "") / 10);
1029
- }
1030
- else {
1031
- this.limit = Math.floor(+(window.innerHeight / 10));
1032
- }
1033
- this.searchResultLimit = this.limit;
1034
- this.markForCheck();
1035
- }
1036
- const checkElementWithDom = document.querySelectorAll(`#bcm-list-${this._id}`);
1037
- (checkElementWithDom === null || checkElementWithDom === void 0 ? void 0 : checkElementWithDom.length) > 1 && checkElementWithDom.forEach((item, index) => index > 0 && item.remove());
1038
- }
1039
- componentWillRender() {
1040
- this.calculateLocation();
1041
- }
1042
- componentShouldUpdate(newVal, oldVal, propName) {
1043
- if (Object.keys(this.getOptions()).indexOf(propName) > -1 && newVal !== oldVal) {
1044
- this.updateOptions();
1045
- }
1046
- }
1047
- get containerWidth() {
1048
- var _a, _b;
1049
- return (_b = (_a = this.el) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width;
1050
- }
1051
- get tagCount() {
1052
- return this.containerWidth > 0 ? Math.floor(+(this.containerWidth - 100) / 85) : 0;
1053
- }
1054
- get tagData() {
1055
- return snq(() => {
1056
- var _a;
1057
- return (_a = this.value) === null || _a === void 0 ? void 0 : _a.map(item => ({
1058
- value: item.id,
1059
- label: StringHelper.textLimitter(item.text, 7),
1060
- text: item.tooltipMessage || item.tagTitle || Generate.domParser(item.text),
1061
- }));
1062
- }, []);
1063
- }
1064
- async componentDidLoad() {
1065
- await this.initState();
1066
- // if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1067
- // const list = this.el.querySelector(`#bcm-list-${this._id}`);
1068
- // if (list) {
1069
- // document.body.appendChild(list);
1070
- // }
1071
- // }
1072
- }
1073
- disconnectedCallback() {
1074
- this.isOpen = false;
1075
- if (this.stopDeepClean)
1076
- return;
1077
- listState.removeState(this._id);
1078
- this.el.innerHTML = "";
1079
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1080
- const list = document.querySelectorAll(`#bcm-list-${this._id}`);
1081
- if (list === null || list === void 0 ? void 0 : list.length) {
1082
- list.forEach(item => item.remove());
1083
- this.el.remove();
1084
- }
1085
- }
1086
- }
1087
- watchId(_, oldVal) {
1088
- // console.info('Changed component id:', oldVal + ' -> ' + newVal);
1089
- listState.removeState(oldVal);
1090
- this.initState();
1091
- }
1092
- handleValueChange(newVal, oldVal) {
1093
- var _a, _b;
1094
- if (Generate.objectIsEmpty(this.returnFilterData)) {
1095
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1096
- }
1097
- if (this.checkboxes) {
1098
- if (!Validators.compareTwoArrayIsSame(newVal, oldVal)) {
1099
- this.bcmChecklist.emit(this.value);
1100
- if (!this.disableChangeEvent) {
1101
- if (this.shouldTriggerChange) {
1102
- const val = ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length)
1103
- ? [...this.value].map(item => (Object.assign(Object.assign({}, item), (this.shouldTriggerChange && { shouldTriggerChange: this.shouldTriggerChange }))))
1104
- : null;
1105
- this.change.emit(val);
1106
- }
1107
- else {
1108
- this.change.emit(this.value);
1109
- }
1110
- }
1111
- }
1112
- }
1113
- else {
1114
- if ((newVal === null || newVal === void 0 ? void 0 : newVal.id) != (oldVal === null || oldVal === void 0 ? void 0 : oldVal.id)) {
1115
- !this.disableChangeEvent &&
1116
- this.change.emit(this.value
1117
- ? Object.assign(Object.assign({}, this.value), (this.shouldTriggerChange && { shouldTriggerChange: this.shouldTriggerChange })) : null);
1118
- }
1119
- }
1120
- }
1121
- watchReturnFilterData(newVal) {
1122
- var _a;
1123
- const { checkedItems, visibledItems } = newVal;
1124
- if (checkedItems && visibledItems) {
1125
- this.handleIndeterminate(checkedItems.length, visibledItems.length);
1126
- }
1127
- else {
1128
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1129
- }
1130
- }
1131
- async handleOpen() {
1132
- const isAutoSelected = this.autoFocusSelected && this.type == "select" && !this.checkboxes && this.value;
1133
- if (this.isOpen) {
1134
- this.detectClone();
1135
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1136
- const list = this.el.querySelector(`#bcm-list-${this._id}`);
1137
- if (list) {
1138
- const bcmOverlayContainer = document.querySelector("#bcm-overlay-container");
1139
- bcmOverlayContainer.appendChild(list);
1140
- }
1141
- }
1142
- this.open.emit();
1143
- this.calculateLocation();
1144
- this.onSelectSearch();
1145
- await delay(50);
1146
- this.isOpenAnimation = true;
1147
- if (isAutoSelected) {
1148
- this.focusSelectedElement();
1149
- }
1150
- }
1151
- else {
1152
- if (!isAutoSelected) {
1153
- this.listScrollToTop();
1154
- }
1155
- this.isOpenAnimation = false;
1156
- this.close.emit();
1157
- this.listClose.emit();
1158
- await delay(100);
1159
- this.unSelectOther();
1160
- }
1161
- }
1162
- listScrollToTop() {
1163
- const list = document.querySelector(`#bcm-list-${this._id}`);
1164
- if (list) {
1165
- list.querySelector(".scrolling").scrollTop = 0;
1166
- }
1167
- }
1168
- async dataChanged(newValue, oldValue) {
1169
- if (!Validators.compareTwoArrayIsSame(newValue, oldValue)) {
1170
- await this.initState();
1171
- }
1172
- }
1173
- isIntersecting(e) {
1174
- const target = e === null || e === void 0 ? void 0 : e.target;
1175
- if (target && target.id === this._id) {
1176
- this.listenResize();
1177
- }
1178
- }
1179
- handleSlotItems(e) {
1180
- var _a;
1181
- if (((_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.length) > 0) {
1182
- this.data = e.detail;
1183
- }
1184
- }
1185
- handleChange(e) {
1186
- if (e.target.id == `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
1187
- e.stopImmediatePropagation();
1188
- }
1189
- }
1190
- handleResize() {
1191
- this.calculateLocation();
1192
- this.debounceHandler();
1193
- }
1194
- handleWheel(event) {
1195
- if (this.isOpen) {
1196
- const list = document.querySelector(`#bcm-list-${this._id}`);
1197
- const isClickInside = list && Generate.findEventPath(event, list);
1198
- if (isClickInside) {
1199
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1200
- this.calculateLocation();
1201
- }
1202
- }
1203
- else {
1204
- this.hide();
1205
- }
1206
- }
1207
- }
1208
- clearAutocomplete() {
1209
- if (this.type == "autocomplete") {
1210
- const autocompleteInput = this.getAutoCompleteInput();
1211
- if (autocompleteInput) {
1212
- autocompleteInput.handleClear(false);
1213
- }
1214
- }
1215
- }
1216
- async handleSelectOtherTag(e) {
1217
- if (this.disabled)
1218
- return;
1219
- const { id, checked } = e.detail;
1220
- this.isSelectedOther = checked;
1221
- if (id) {
1222
- checked ? this.filterOtherList(id) : this.unSelectOther();
1223
- this.isOpen = true;
1224
- }
1225
- }
1226
- async handleDeleteTag(e) {
1227
- var _a;
1228
- if (this.disabled)
1229
- return;
1230
- const { id } = e.detail;
1231
- this.isSelectedOther && this.unSelectOther();
1232
- Array.isArray(id) ? listState.removeOtherTags(this._id, id) : listState.checkedItem(this._id, id);
1233
- this.value = (await this.getCheckedList()).checkedList;
1234
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1235
- }
1236
- async handleSelectTag(_) {
1237
- if (this.disabled)
1238
- return;
1239
- this.clearAutocomplete();
1240
- this.onSelectSearch();
1241
- this.unSelectOther();
1242
- }
1243
- handleClick(event) {
1244
- var _a;
1245
- if (this.disabled)
1246
- return;
1247
- const list = document.querySelector(`#bcm-list-${this._id}`);
1248
- const isClickInside = Generate.findEventPath(event, this.el) || (list && Generate.findEventPath(event, list));
1249
- if (isClickInside) {
1250
- if (this.debounce !== null) {
1251
- event.preventDefault();
1252
- event.stopPropagation();
1253
- clearTimeout(this.debounce);
1254
- this.debounce = null;
1255
- }
1256
- this.debounce = setTimeout(() => {
1257
- this.debounce = null;
1258
- }, 300);
1259
- }
1260
- if (!isClickInside) {
1261
- if (this.type == "autocomplete") {
1262
- const autocompleteInput = this.getAutoCompleteInput();
1263
- if (autocompleteInput) {
1264
- if (this.checkboxes) {
1265
- autocompleteInput.setValue("");
1266
- }
1267
- else {
1268
- autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
1269
- }
1270
- }
1271
- }
1272
- }
1273
- const clickToTag = Generate.findEventPathWithKey(event, "className", ["bcm-tag"]);
1274
- const clickToOtherTag = Generate.findEventPathWithKey(event, "className", ["bcm-tag bcm-tag--other"]);
1275
- const clickToSelect = Generate.findEventPathWithKey(event, "id", [`bcm-list-input-${this._id}`, `bcm-list-label-${this._id}`]);
1276
- const clickToTagDismiss = Generate.findEventPathWithKey(event, "className", ["right close-button"]);
1277
- if (clickToSelect && !clickToTagDismiss && this.type != "autocomplete") {
1278
- this.isOpen = clickToTag || clickToOtherTag ? true : !this.isOpen;
1279
- }
1280
- if (list) {
1281
- if (this.isOpen) {
1282
- if (!list.contains(event.target) && !this.el.contains(event.target)) {
1283
- this.isOpen = false;
1284
- // this.unSelectOther()
1285
- }
1286
- }
1287
- }
1288
- }
1289
- bcmOnSearchClear(event) {
1290
- var _a, _b;
1291
- if (this.type == "autocomplete") {
1292
- if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
1293
- if (event.detail) {
1294
- this.setClear();
1295
- }
1296
- }
1297
- }
1298
- }
1299
- bcmOnSearch(event) {
1300
- var _a, _b, _c, _d, _e, _f;
1301
- if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
1302
- this.searchGetParents = snq(() => { var _a; return (_a = event.detail) === null || _a === void 0 ? void 0 : _a.parentIndex; }, null);
1303
- this.searchResultLimit = 10;
1304
- this.searchFound = ((_c = event.detail) === null || _c === void 0 ? void 0 : _c.matching) != null ? (_d = event.detail) === null || _d === void 0 ? void 0 : _d.matching.length : null;
1305
- this.returnFilterData = listState.filterData(this._id, (_e = event.detail) === null || _e === void 0 ? void 0 : _e.nestedResult);
1306
- if (this.searchFound > 0 && this.highlight) {
1307
- this.highlightText = (_f = event.detail) === null || _f === void 0 ? void 0 : _f.value;
1308
- }
1309
- if (this.type == "autocomplete") {
1310
- this.isOpen = true;
1311
- }
1312
- if (!event.detail.result) {
1313
- if (this.type == "autocomplete") {
1314
- this.isOpen = false;
1315
- }
1316
- else {
1317
- this.returnFilterData = {};
1318
- listState.filterData(this._id, null);
1319
- }
1320
- // this.isSelectedOther = false
1321
- this.searchResultLimit = null;
1322
- this.highlightText = null;
1323
- }
1324
- this.markForCheck();
1325
- }
1326
- }
1327
- //keyboard navigation
1328
- handleKeyDown(ev) {
1329
- const keycode = ev.keyCode || ev.which;
1330
- if (keycode === Bcm$1.KeyCode.escape) {
1331
- if (this.isOpen) {
1332
- this.isOpen = false;
1333
- ev.preventDefault();
1334
- ev.stopPropagation();
1335
- ev.stopImmediatePropagation();
1336
- }
1337
- }
1338
- if (this.keyControl) {
1339
- const keyboard = new ListKeyControl(keycode, this.el, this.treeview, this.checkboxes);
1340
- keyboard.openGroup = openGroupId => {
1341
- this.openGroup(openGroupId);
1342
- };
1343
- keyboard.checkedItem = checkedItemId => {
1344
- this.checkedItem(checkedItemId);
1345
- };
1346
- keyboard.keyDown();
1347
- }
1348
- }
1349
- handleKeyUp(ev) {
1350
- if (this.keyControl) {
1351
- const focusedList = Generate.findEventPath(ev, this.el);
1352
- if (focusedList) {
1353
- const list = document.getElementById(`bcm-list-${this._id}`);
1354
- if (list) {
1355
- const items = list.querySelectorAll(".bcm-list__item.focused");
1356
- if (items.length > 0) {
1357
- const main = list.querySelector("main");
1358
- const itemHeight = items[0].offsetHeight;
1359
- const listHeight = main.offsetHeight;
1360
- const itemTop = items[0].offsetTop;
1361
- if (itemTop > listHeight) {
1362
- main.scrollTop = itemTop - listHeight / 2 + itemHeight / 2;
1363
- }
1364
- if (itemTop < listHeight) {
1365
- main.scrollTop = itemTop - listHeight / 2 - itemHeight / 2;
1366
- }
1367
- }
1368
- }
1369
- }
1370
- }
1371
- }
1372
- async set(data, trigger = true) {
1373
- if (data) {
1374
- this.shouldTriggerChange = trigger;
1375
- if (Array.isArray(data)) {
1376
- this.addChecked(data);
1377
- }
1378
- if (typeof data === "string" || typeof data === "number") {
1379
- this.selectedItem(data);
1380
- }
1381
- }
1382
- else {
1383
- this.setClear();
1384
- }
1385
- }
1386
- async get() {
1387
- var _a, _b;
1388
- return this.value ? (this.checkboxes ? (_b = (_a = ((await this.getCheckedList()))) === null || _a === void 0 ? void 0 : _a.checkedList) === null || _b === void 0 ? void 0 : _b.map(item => item.id) : this.value.id) : null;
1389
- }
1390
- async getCheckedList() {
1391
- return Promise.resolve(listState.getCheckedList(this._id));
1392
- }
1393
- async getSelected() {
1394
- return Promise.resolve(listState.getSelected(this._id));
1395
- }
1396
- async getValue() {
1397
- return Promise.resolve(this.value);
1398
- }
1399
- async triggerChange(action) {
1400
- this.shouldTriggerChange = action;
1401
- }
1402
- async addChecked(ids = [], save = false, emit = true) {
1403
- if (ids && ids.length > 0) {
1404
- if (!save) {
1405
- listState.setClear(this._id);
1406
- await delay(10);
1407
- }
1408
- await listState.addChecked(this._id, ids);
1409
- await delay(10);
1410
- emit && (this.value = (await this.getCheckedList()).checkedList);
1411
- this.markForCheck();
1412
- }
1413
- return Promise.resolve(this.value);
1414
- }
1415
- async selected(id) {
1416
- if (id) {
1417
- return Promise.resolve(await this.selectedItem(id));
1418
- }
1419
- return false;
1420
- }
1421
- async setClear(e) {
1422
- listState.setClear(this._id);
1423
- this.value = null;
1424
- this.inputText = "";
1425
- this.isOpen = false;
1426
- this.selectAllItem.indeterminate = "uncheck";
1427
- this.markForCheck();
1428
- if (e) {
1429
- e.stopPropagation();
1430
- e.preventDefault();
1431
- }
1432
- await delay(10);
1433
- return Promise.resolve();
1434
- }
1435
- async resetCaption() {
1436
- await delay(10);
1437
- this.caption = this.captionCache;
1438
- this.captionType = this.captionTypeCache;
1439
- this.captionError = null;
1440
- await delay(10);
1441
- return Promise.resolve();
1442
- }
1443
- detectClone() {
1444
- const list = document.querySelectorAll(`#bcm-list-${this._id}`);
1445
- if (list.length > 0) {
1446
- list.forEach((item) => {
1447
- const tempid = item.getAttribute("temp-id");
1448
- if (tempid !== `bcm-list-${this.tempId}`) {
1449
- console.warn(`[bcm-list] - Detected duplicate temp-id="${tempid}"`);
1450
- item.remove();
1451
- }
1452
- });
1453
- }
1454
- }
1455
- async show() {
1456
- this.isOpen = true;
1457
- return Promise.resolve();
1458
- }
1459
- async hide() {
1460
- this.isOpen = false;
1461
- return Promise.resolve();
1462
- }
1463
- updateOptions() {
1464
- listState.updateOptions(this._id, this);
1465
- }
1466
- handleIndeterminate(checkeds, total) {
1467
- this.selectAllItem = Object.assign(Object.assign({}, this.selectAllItem), { indeterminate: this.checkboxes && checkeds > 0 ? (checkeds === total ? "check" : "indeterminate") : "uncheck", checked: this.checkboxes && checkeds > 0 ? (checkeds === total ? true : false) : false });
1468
- }
1469
- listenResize() {
1470
- this.calculateLocation();
1471
- this.markForCheck();
1472
- }
1473
- async unSelectOther() {
1474
- await this.onClearSearch();
1475
- this.isSelectedOther = false;
1476
- this.searchFound = null;
1477
- this.returnFilterData = {};
1478
- listState.filterData(this._id, null);
1479
- await delay(10);
1480
- return Promise.resolve();
1481
- }
1482
- async onClearSearch() {
1483
- const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
1484
- if (searchInput) {
1485
- await searchInput.handleClear();
1486
- }
1487
- return Promise.resolve();
1488
- }
1489
- async onSelectSearch() {
1490
- const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
1491
- if (searchInput) {
1492
- await delay(100);
1493
- searchInput.onBcmFocus();
1494
- searchInput.onBcmSelect();
1495
- }
1496
- }
1497
- async filterOtherList(ids) {
1498
- const checklist = (await this.getCheckedList()).nestedResult;
1499
- const filter = Generate.convertIdsToNestedData(ids, checklist);
1500
- this.returnFilterData = await listState.filterData(this._id, filter, null, true);
1501
- this.searchFound = (ids === null || ids === void 0 ? void 0 : ids.length) || 0;
1502
- this.limit = 500;
1503
- this.searchGetParents = null;
1504
- await delay(1000);
1505
- this.markForCheck();
1506
- }
1507
- async initState() {
1508
- var _a, _b, _c, _d, _e;
1509
- this.onClearSearch();
1510
- await listState.setValue({
1511
- id: this._id,
1512
- dataSource: this.data && snq(() => (typeof this.data == "string" ? JSON.parse(this.data) : this.data), []),
1513
- options: this,
1514
- });
1515
- const { totalRoots, totalItems, dataSource } = listState.getValue(this._id);
1516
- this.totalData = (totalItems === null || totalItems === void 0 ? void 0 : totalItems.total) || 0;
1517
- this.totalRootData = totalRoots || 0;
1518
- this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id) ? listState.selectedItem(this._id)[0] : null;
1519
- /** @description Focus selected element * BUG 282262 */
1520
- if (this.autoFocusSelected && this.type == "select" && this.value && !this.checkboxes) {
1521
- const selectedId = Array.isArray(this.value) ? (_a = this.value[0]) === null || _a === void 0 ? void 0 : _a.id : (_b = this.value) === null || _b === void 0 ? void 0 : _b.id;
1522
- if (selectedId && dataSource) {
1523
- const selectedIndex = dataSource.findIndex(item => item.id === selectedId);
1524
- if (selectedIndex !== -1 && selectedIndex >= this.limit) {
1525
- this.limit = selectedIndex + 5;
1526
- this.searchResultLimit = this.limit;
1527
- }
1528
- }
1529
- }
1530
- if (!this.checkboxes) {
1531
- this.inputText = Generate.domParser((_c = this.value) === null || _c === void 0 ? void 0 : _c.text) || null;
1532
- }
1533
- // checkli olan subparentların indeterminate kontrolü için
1534
- if (this.checkboxes && ((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) > 0) {
1535
- const checkedIDs = [];
1536
- this.value.forEach(item => {
1537
- if (!item.items || item.items.length === 0) {
1538
- checkedIDs.push(item.id);
1539
- }
1540
- });
1541
- await this.addChecked(checkedIDs, false, false);
1542
- }
1543
- await this.handleIndeterminate((_e = this.value) === null || _e === void 0 ? void 0 : _e.length, this.totalData);
1544
- await this.markForCheck();
1545
- }
1546
- async markForCheck() {
1547
- await delay(10);
1548
- this.tick = Generate.UID();
1549
- }
1550
- getOptions() {
1551
- return snq(() => listState.getValue(this._id).options, {});
1552
- }
1553
- getItems() {
1554
- if (this.isSelectedOther) {
1555
- return this.returnFilterData["checkedItems"];
1556
- }
1557
- return snq(() => listState.getData(this._id), []);
1558
- }
1559
- getLimitedItems(ids) {
1560
- return snq(() => listState.getDataPagination(this._id, this.searchResultLimit || this.limit, ids), []);
1561
- }
1562
- openGroup(parentId) {
1563
- listState.openGroup(this._id, parentId);
1564
- this.markForCheck();
1565
- }
1566
- focusItem(e) {
1567
- if (e.target.classList.contains("bcm-list__item")) {
1568
- const item = e.target;
1569
- const list = document.getElementById(`bcm-list-${this._id}`);
1570
- if (list) {
1571
- const items = list.querySelectorAll(".bcm-list__item");
1572
- if (items.length > 0) {
1573
- const selectedItem = list.querySelector(".bcm-list__item.focused");
1574
- if (selectedItem) {
1575
- selectedItem.classList.remove("focused");
1576
- }
1577
- item.classList.add("focused");
1578
- }
1579
- }
1580
- }
1581
- }
1582
- async selectedItem(itemId) {
1583
- var _a;
1584
- if (!this.checkboxes) {
1585
- this.value = listState.selectedItem(this._id, itemId) ? listState.selectedItem(this._id, itemId)[0] : null;
1586
- this.inputText = Generate.domParser((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
1587
- this.isOpen = false;
1588
- this.markForCheck();
1589
- if (this.type == "autocomplete" && this.value) {
1590
- // await delay(100)
1591
- // this.resetCaption()
1592
- const autocompleteInput = this.getAutoCompleteInput();
1593
- if (autocompleteInput) {
1594
- setTimeout(() => {
1595
- var _a;
1596
- autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
1597
- this.isOpen = false;
1598
- }, 100);
1599
- }
1600
- }
1601
- }
1602
- return Promise.resolve(this.value);
1603
- }
1604
- async checkedItem(itemId) {
1605
- const isCheckSelectAll = itemId === "select-all-" + this._id;
1606
- if (!isCheckSelectAll) {
1607
- listState.checkedItem(this._id, itemId);
1608
- }
1609
- else {
1610
- listState.selectAll(this._id);
1611
- }
1612
- this.value = (await this.getCheckedList()).checkedList;
1613
- this.changeVisibleCheckeds();
1614
- this.markForCheck();
1615
- }
1616
- changeVisibleCheckeds() {
1617
- const { visibledItems } = this.returnFilterData;
1618
- this.returnFilterData = {
1619
- visibledItems,
1620
- checkedItems: (visibledItems && visibledItems.filter(item => item.checked)) || [],
1621
- };
1622
- }
1623
- getAutoCompleteInput() {
1624
- return document.getElementById(`bcm-list-input-tag-container-${this._id}-autocomplete-input`);
1625
- }
1626
- /** @description Fixes the issue where the list appears empty during fast scrolling. */
1627
- dataScrollEvent(event) {
1628
- var _a, _b;
1629
- const itemHeight = this.size === 'small' ? 28 : this.size === 'large' ? 48 : 36;
1630
- const currentScrollBottom = ((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.scrollTop) + ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.clientHeight);
1631
- const requiredItems = Math.ceil(currentScrollBottom / itemHeight) + 20;
1632
- if (requiredItems > this.limit) {
1633
- this.limit = requiredItems;
1634
- this.searchResultLimit = requiredItems;
1635
- }
1636
- }
1637
- async calculateLocation() {
1638
- var _a, _b;
1639
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1640
- const list = document.getElementById(`bcm-list-${this._id}`);
1641
- // list && (list.style.height = '256px') //sebebi neydi ki!
1642
- var placement = this.placement;
1643
- const targetElementId = this.linkedComponent ? this.linkedComponent : `bcm-list-input-${this._id}`;
1644
- const targetElement = document.getElementById(targetElementId);
1645
- if (list && targetElement) {
1646
- getPlacement(list, targetElement, placement, (place) => (placement = place));
1647
- await delay(10);
1648
- let pos = setPosition(placement, targetElement);
1649
- let captionAreaHeight = 0;
1650
- let labelAreaHeight = 0;
1651
- if (this.linkedComponent) {
1652
- const linked = document.getElementById(this.linkedComponent);
1653
- if (linked) {
1654
- if (!linked["noCaption"]) {
1655
- const captionArea = ((_a = linked.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".bcm-caption-area")) || linked.querySelector(".bcm-caption-area");
1656
- if (captionArea) {
1657
- captionAreaHeight = captionArea.offsetHeight || captionArea.clientHeight;
1658
- }
1659
- }
1660
- const labelArea = ((_b = linked.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(".bcm-label")) || linked.querySelector(".bcm-label");
1661
- if (labelArea) {
1662
- labelAreaHeight = labelArea.offsetHeight || labelArea.clientHeight;
1663
- }
1664
- }
1665
- }
1666
- if (this.fullWidth) {
1667
- list.style.width = targetElement.offsetWidth + "px";
1668
- }
1669
- else {
1670
- list.style.width = this.width || "auto";
1671
- }
1672
- if (this.height.indexOf("%") > -1) {
1673
- list.style.height = NumberHelper.toNumber(this.height) * 0.01 * window.innerHeight - pos[0] - 50 + "px";
1674
- }
1675
- else {
1676
- list.style.height = this.height;
1677
- }
1678
- list.style.minHeight = this.minHeight;
1679
- // const calculatedMaxHeight = window.innerHeight - pos[0] - 50;
1680
- const calculatedMaxHeight = placement.split("-")[0] == "top" ? window.innerHeight - (window.innerHeight - pos[0]) - 50 : window.innerHeight - pos[0] - 50;
1681
- if (this.maxHeight.indexOf("%") > -1) {
1682
- list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) * 0.01 * calculatedMaxHeight + "px";
1683
- }
1684
- else {
1685
- list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) < calculatedMaxHeight ? this.maxHeight : calculatedMaxHeight + "px";
1686
- }
1687
- getPlacement(list, targetElement, placement, (place) => (placement = place));
1688
- await delay(10);
1689
- pos = setPosition(placement, targetElement);
1690
- list.style.top = (placement.split("-")[0] == "top" ? pos[0] - list.offsetHeight + labelAreaHeight : pos[0] - captionAreaHeight) + "px";
1691
- // list.style.left = pos[1] + 'px';
1692
- list.style.left = placement.split("-")[1] == "end" ? pos[1] - list.offsetWidth + "px" : pos[1] + "px";
1693
- list.classList.toggle("bcm-list--top", placement.split("-")[0] == "top");
1694
- this.calculatedViewport = true;
1695
- }
1696
- }
1697
- }
1698
- handleTransitionEnd(e) {
1699
- const { isOpen, type } = this;
1700
- const propertName = e === null || e === void 0 ? void 0 : e.propertyName;
1701
- if (isOpen && type == "select" && propertName == "transform") {
1702
- this.listOpen.emit();
1703
- }
1704
- }
1705
- /** @description Focus selected element * BUG 282262 */
1706
- focusSelectedElement() {
1707
- var _a;
1708
- const listElement = document.querySelector(`#bcm-list-${this._id}`);
1709
- if (!listElement)
1710
- return;
1711
- const selectedId = (_a = this.value) === null || _a === void 0 ? void 0 : _a.id;
1712
- if (selectedId) {
1713
- const targetItem = listElement.querySelector(`[id*="${selectedId}"]`);
1714
- if (targetItem) {
1715
- targetItem.scrollIntoView({
1716
- block: 'center',
1717
- inline: 'nearest',
1718
- behavior: 'auto'
1719
- });
1720
- targetItem.focus();
1721
- const items = listElement.querySelectorAll(".bcm-list__item");
1722
- items.forEach(i => i.classList.remove("focused"));
1723
- targetItem.classList.add("focused");
1724
- }
1725
- }
1726
- }
1727
- render() {
1728
- const { checkboxes, treeview, label, size, disabled, readonly, required, hidden, fullWidth, searchable } = this.getOptions();
1729
- const hostClasses = classnames("bcm-list", `bcm-list__size-${size}`, `bcm-list__${this.type}`, size === "large" ? "size-3" : "size-2", {
1730
- "error": this.captionType == Bcm$1.Status.error,
1731
- "full-width": fullWidth,
1732
- "bcm-list__linked": this.linkedComponent,
1733
- hidden,
1734
- readonly,
1735
- disabled,
1736
- });
1737
- const bcmListContainer = classnames("bcm-list__container", this.linkedComponent ? "bcm-list__type-linked-component" : `bcm-list__type-${this.type}`, {
1738
- "is-open": this.isOpen && this.calculatedViewport,
1739
- "is-open-animation": this.isOpenAnimation,
1740
- "error": this.captionType == Bcm$1.Status.error,
1741
- "full-width": fullWidth,
1742
- hidden,
1743
- readonly,
1744
- disabled,
1745
- });
1746
- const bcmListInput = classnames("bcm-list__input");
1747
- const openedType = this.type == "select" || this.type == "autocomplete" || this.linkedComponent;
1748
- return (h(Host, { class: hostClasses, tabindex: "0", style: {
1749
- "--width": fullWidth ? "100%" : this.width,
1750
- "--height": openedType ? "100%" : this.height,
1751
- "--max-height": openedType ? "inherit" : this.maxHeight,
1752
- "--min-height": openedType ? "inherit" : this.minHeight,
1753
- } }, h("div", { id: `bcm-list-label-${this._id}`, class: "bcm-list__label" }, label && (h("div", null, h("bcm-label", { tooltip: this.tooltip, size: this.size, type: this.captionType, value: label, required: required, htmlFor: this._id })))), this.type == "select" && (h("div", { id: `bcm-list-input-${this._id}`, class: bcmListInput }, h("span", { class: classnames("bcm-list__input-container", { "type-single": !checkboxes, "value-empty": !this.value }) }, this.checkboxes ? (this.value && this.value.length > 0 ? (h("bcm-rc-overflow", { data: this.tagData, maxCount: this.tagCount })) : (h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))) : this.value ? (this.inputText) : (h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))), h("span", { class: classnames("bcm-list__input-buttons", {
1754
- disabled: disabled,
1755
- }) }, this.clearable && this.value && (h("div", { class: "bcm-list__input-buttons-button" }, h("bcm-icon", { icon: "fal fa-times", onClick: e => !disabled && this.setClear(e) }))), h("div", { class: `bcm-list__input-buttons-button caret-is ${this.isOpen && this.calculatedViewport && "caret-is-open"}` }, h("bcm-icon", { icon: `far fa-angle-down` }))))), this.type === "autocomplete" && (h("div", { id: `bcm-list-input-${this._id}`, class: classnames(bcmListInput, { "bcm-list__input-autocomplete": this.type == "autocomplete" }) }, h("span", { class: "bcm-list__input-container", id: `bcm-list-input-tag-container-${this._id}` }, this.checkboxes && h("span", { class: "bcm-list__input-tag-container", id: `bcm-list-input-tag-container-${this._id}-autocomplete` }), h("bcm-search", { id: `bcm-list-input-tag-container-${this._id}-autocomplete-input`, class: "bcm-list__autocomplete", data: this.data, clearable: true, "full-width": true, "no-caption": true, placeholder: this.placeholder })))), h(ListTemplate, { type: this.type, highlight: this.highlightText, searchable: this.type == "autocomplete" ? false : searchable, bcmListContainer: bcmListContainer, checkboxes: checkboxes, treeview: treeview, infoFooter: this.infoFooter, value: this.value, totalData: this.totalData, searchFound: this.searchFound, variableText: this.variableText, searchPlaceholder: this.searchPlaceholder, minSearchLength: this.minSearchLength, searchIsOnlyChilds: this.searchIsOnlyChilds, _id: this._id, tempId: this.tempId, checkAll: this.checkAll, data: this.getItems(), width: this.width, height: this.height, size: this.size, selectAllItem: this.selectAllItem, onScrollEvent: e => this.dataScrollEvent(e), items: this.getLimitedItems(this.searchGetParents), selectedItem: itemId => this.selectedItem(itemId), checkedItem: itemId => this.checkedItem(itemId), openGroup: parentId => this.openGroup(parentId), focusItem: itemId => this.focusItem(itemId), emptyText: this.emptyText, emptyIcon: this.emptyIcon, handleTransitionEnd: e => this.handleTransitionEnd(e) }), h(CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
1756
- }
1757
- get el() { return getElement(this); }
1758
- static get watchers() { return {
1759
- "_id": ["watchId"],
1760
- "value": ["handleValueChange"],
1761
- "returnFilterData": ["watchReturnFilterData"],
1762
- "isOpen": ["handleOpen"],
1763
- "data": ["dataChanged"]
1764
- }; }
1765
- };
1766
- __decorate([
1767
- IsLoad()
1768
- ], BcmList.prototype, "el", void 0);
1769
- __decorate([
1770
- JsonParse("data", true)
1771
- ], BcmList.prototype, "dataChanged", null);
1772
- BcmList.style = listCss;
1773
-
1774
- const rcOverflowCss = "@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}.rc-overflow{display:flex;flex-direction:row;flex-wrap:nowrap;width:100%}.rc-overflow-item{transition:all 0.3s ease;padding:0 2px;display:flex;align-items:center;justify-content:center}";
1775
-
1776
- const BcmRcOverflow = class {
1777
- constructor(hostRef) {
1778
- registerInstance(this, hostRef);
1779
- this.selectOtherTag = createEvent(this, "bcm-select-other-tag", 7);
1780
- this.selectTag = createEvent(this, "bcm-select-tag", 7);
1781
- this.deleteTag = createEvent(this, "bcm-delete-tag", 7);
1782
- this.renderItem = item => {
1783
- return react.createElement("bcm-tooltip", {
1784
- placement: "bottom",
1785
- message: item.text,
1786
- trigger: "hover",
1787
- }, react.createElement("div", {
1788
- id: item.value + "-tag",
1789
- className: "bcm-tag",
1790
- onClick: ({ target }) => this.onClickControl(target, item, false),
1791
- }, react.createElement("span", { className: "bcm-tag__content dismissable" },
1792
- // .bcm-tag__content span {
1793
- // display: block;
1794
- // max-width: 38px;
1795
- // white-space: nowrap;
1796
- // overflow: hidden;
1797
- // text-overflow: ellipsis;
1798
- react.createElement("div", { className: "value tw-block tw-max-w-[38px] tw-overflow-hidden tw-overflow-ellipsis tw-whitespace-nowrap" }, item.text), react.createElement("span", {
1799
- className: "right close-button",
1800
- }, react.createElement("bcm-icon", {
1801
- icon: "fa fa-times",
1802
- })))));
1803
- };
1804
- this.renderRest = items => {
1805
- const titles = (items === null || items === void 0 ? void 0 : items.sort((a, b) => +a.ct - +b.ct).slice(0, 15).map(item => StringHelper.textLimitter(item.text, 40, true)).toString().split(",").join("\r\n")) + (items.length > 15 ? "\r\n..." : "");
1806
- return react.createElement("bcm-tooltip", {
1807
- placement: "bottom",
1808
- message: titles,
1809
- trigger: "hover",
1810
- }, react.createElement("div", {
1811
- className: "bcm-tag bcm-tag--other",
1812
- onClick: ({ target }) => this.onClickControl(target, items, true),
1813
- }, react.createElement("span", { className: `bcm-tag__content dismissable ${this.checked ? "checkable checked" : ""}` }, react.createElement("span", { className: "value" }, `+${items === null || items === void 0 ? void 0 : items.length}`), react.createElement("span", { className: "right close-button" }, react.createElement("bcm-icon", {
1814
- icon: "fa fa-times",
1815
- })))));
1816
- };
1817
- this._id = Generate.UID();
1818
- this.maxCount = 1;
1819
- this.data = [];
1820
- this.checked = false;
1821
- }
1822
- isClickDismiss(e) {
1823
- return e["s-hn"] === "BCM-ICON";
1824
- }
1825
- onClickControl(e, item, isOtherTag = false) {
1826
- const isClickClose = this.isClickDismiss(e);
1827
- isClickClose && this.deleteTag.emit({ id: Array.isArray(item) ? item.map(i => i.value) : item.value }) && this.checked && (this.checked = false);
1828
- !isOtherTag && this.selectTag.emit({ id: item.value }) && this.checked && (this.checked = false);
1829
- if (isOtherTag && !isClickClose) {
1830
- this.checked = !this.checked;
1831
- this.selectOtherTag.emit({ id: item === null || item === void 0 ? void 0 : item.map(i => i.value), checked: this.checked });
1832
- }
1833
- }
1834
- componentWillRender() {
1835
- const { data, renderItem, renderRest, maxCount } = this;
1836
- this.overflowInstance = react.createElement(ForwardOverflow, {
1837
- data,
1838
- renderItem,
1839
- renderRest,
1840
- maxCount,
1841
- });
1842
- reactDom.render(this.overflowInstance, this.el);
1843
- }
1844
- get el() { return getElement(this); }
1845
- };
1846
- BcmRcOverflow.style = rcOverflowCss;
1847
-
1848
- const { state } = createStore({
1849
- value: new Map(),
1850
- });
1851
- const setValue = val => {
1852
- const { id, dataSource } = val;
1853
- const data = {
1854
- id: snq(() => id, Generate.UID),
1855
- dataSource: dataSource && dataSource.length > 0 && recursive(dataSource),
1856
- searchIsOnlyChilds: val.searchIsOnlyChilds,
1857
- };
1858
- state.value.set(data.id, data);
1859
- };
1860
- const recursive = (data, parentId) => {
1861
- let recData = [];
1862
- if (data) {
1863
- recData = data.map(item => (Object.assign(Object.assign(Object.assign({}, item), { parentId: snq(() => parentId, null) }), (item.items && item.items.length > 0 && { items: snq(() => recursive(item.items, item.id), []) }))));
1864
- }
1865
- return recData;
1866
- };
1867
- const removeValue = _id => {
1868
- state.value.delete(_id);
1869
- };
1870
- const getValue = id => snq(() => state.value.get(id), {});
1871
- const getDataPagination = (id, limit = 3) => {
1872
- let data = [];
1873
- const value = getValue(id);
1874
- if (value) {
1875
- const { dataSource } = value;
1876
- data = dataSource.slice(0, limit);
1877
- }
1878
- return data;
1879
- };
1880
- // //search treeview data by text
1881
- // const searchData = (id, search, items?) => {
1882
- // let dataSource
1883
- // if (items && items.length > 0) {
1884
- // dataSource = items
1885
- // } else {
1886
- // const value = getValue(id);
1887
- // dataSource = value.dataSource;
1888
- // }
1889
- // let result = []
1890
- // if (dataSource) {
1891
- // dataSource.forEach(child => {
1892
- // if (child.text.toLowerCase().includes(search.toLowerCase())) {
1893
- // result.push(child)
1894
- // }
1895
- // result = result.concat(searchData(id, search, child.items))
1896
- // })
1897
- // };
1898
- // return result
1899
- // };
1900
- //nested search
1901
- const searchData = (id, searchText, items) => {
1902
- let dataSource;
1903
- if (items && items.length > 0) {
1904
- dataSource = items;
1905
- }
1906
- else {
1907
- const value = getValue(id);
1908
- dataSource = value.dataSource;
1909
- }
1910
- let results = [];
1911
- if (dataSource) {
1912
- results.push(nestedSearch(id, dataSource, searchText));
1913
- //return with their parents
1914
- // dataSource.forEach(child => {
1915
- // if (child.text.toLowerCase().includes(searchText.toLowerCase())) {
1916
- // results.push(child)
1917
- // } else if (child.items && child.items.length > 0) {
1918
- // child.items = nestedSearch(child.items, searchText)
1919
- // if (child.items.length > 0) {
1920
- // results.push(child)
1921
- // }
1922
- // }
1923
- // })
1924
- }
1925
- return {
1926
- result: snq(() => Generate.flatArray(results[0].result), []),
1927
- matching: snq(() => results[0].matching, []),
1928
- parentIndex: snq(() => results[0].parentIndex, []),
1929
- nestedResult: snq(() => results[0].nestedResult, []),
1930
- };
1931
- };
1932
- const nestedSearch = (id, items, searchText) => {
1933
- let matching = [];
1934
- let parentIndex = [];
1935
- let result = [];
1936
- let nestedResult = [];
1937
- const { searchIsOnlyChilds } = getValue(id);
1938
- if (items && items.length > 0) {
1939
- items.forEach(child => {
1940
- let isChild = searchIsOnlyChilds && child.parentId !== null;
1941
- let isMatching = (child.text && StringHelper.slugify(child.text).includes(StringHelper.slugify(searchText))) ||
1942
- (child.keywords && StringHelper.slugify(child.keywords).includes(StringHelper.slugify(searchText)));
1943
- if (isMatching && (!searchIsOnlyChilds || (searchIsOnlyChilds && isChild))) {
1944
- result.push(child.id);
1945
- matching.push(child.id);
1946
- parentIndex.push(child.id);
1947
- nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId });
1948
- if (child.items && child.items.length > 0) {
1949
- const found = nestedSearch(id, child.items, searchText);
1950
- if (found.matching.length > 0) {
1951
- found.matching.forEach(chi => {
1952
- matching.push(chi);
1953
- });
1954
- }
1955
- }
1956
- }
1957
- else if (child.items && child.items.length > 0) {
1958
- const found = nestedSearch(id, child.items, searchText);
1959
- if (found.result.length > 0) {
1960
- found.result.forEach(chi => {
1961
- result.push(chi);
1962
- });
1963
- result.push(child.id);
1964
- parentIndex.push(child.id);
1965
- nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId, items: found.nestedResult });
1966
- }
1967
- if (found.matching.length > 0) {
1968
- matching.push(...found.matching);
1969
- }
1970
- }
1971
- });
1972
- }
1973
- return { result, matching, parentIndex, nestedResult };
1974
- };
1975
- const searchState = {
1976
- setValue,
1977
- removeValue,
1978
- getValue,
1979
- getDataPagination,
1980
- searchData,
1981
- };
1982
-
1983
- const searchCss = "@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}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}*{box-sizing:border-box}.bcm-input{display:inline-flex;flex-direction:column;width:100%;max-width:256px;margin-bottom:8px}.bcm-input.full-width{max-width:100%}.bcm-input.hidden{display:none}.bcm-input__container{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:flex;align-items:stretch;flex-direction:row;background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;cursor:text;padding:0 0 0 4px;position:relative;width:100%}.bcm-input__container.disabled{background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-input__container.disabled .bcm-input-element{color:var(--bcm-new-ds-color-slate-500)}.bcm-input__container.readonly{background-color:var(--bcm-new-ds-color-slate-50);cursor:default}.bcm-input__container.readonly .bcm-input-element{color:var(--bcm-new-ds-color-slate-600)}.bcm-input__container:not(.disabled):hover .caret-container,.bcm-input__container:not(.disabled).focused .caret-container{opacity:1}.bcm-input__container:not(.disabled):hover .input-clear-button,.bcm-input__container:not(.disabled).focused .input-clear-button{opacity:1}.bcm-input__container:not(.disabled).focused{background-color:var(--bcm-new-ds-color-slate-50)}.bcm-input__container:not(.disabled):hover{border-color:var(--bcm-color-prime-blue-6)}.bcm-input__container.empty .input-clear-button{display:none}.bcm-input__container.invalid,.bcm-input__container.error{border-color:var(--bcm-new-ds-color-red-500)}.bcm-input__container .bcm-input-element{width:100%;color:var(--bcm-new-ds-color-slate-600);flex:1;border:none;background:transparent;box-shadow:unset;padding:0 4px;font-family:\"Inter\", sans-serif;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;text-overflow:ellipsis}.bcm-input__container .bcm-input-element::placeholder{font-family:\"Inter\", sans-serif;color:var(--bcm-new-ds-color-slate-300);user-select:none}.bcm-input__container .bcm-input-element::-webkit-search-decoration,.bcm-input__container .bcm-input-element::-webkit-search-cancel-button,.bcm-input__container .bcm-input-element::-webkit-search-results-button,.bcm-input__container .bcm-input-element::-webkit-search-results-decoration,.bcm-input__container .bcm-input-element::-webkit-calendar-picker-indicator,.bcm-input__container .bcm-input-element::-webkit-inner-spin-button,.bcm-input__container .bcm-input-element::-webkit-outer-spin-button{-webkit-appearance:none}.bcm-input__container .caret-container{width:30px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;border-left:1px solid #D9D9D9;transition:0.2s opacity;user-select:none;box-sizing:border-box}.bcm-input__container .caret-container .bcm-input-caret{display:flex;align-items:center;justify-content:center;color:var(--bcm-color-grey-7);cursor:pointer;flex:1}.bcm-input__container .caret-container .bcm-input-caret bcm-icon{line-height:1}.bcm-input__container .caret-container .bcm-input-caret:hover{color:var(--bcm-color-prime-blue-6)}.bcm-input__container .caret-container .bcm-input-caret:active{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container .bcm-input-caret:last-child{border-top:1px solid #D9D9D9}.bcm-input__container .caret-container.disabled{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container.disabled .bcm-input-caret{cursor:not-allowed}.bcm-input__container .input-suffix-content{display:flex;align-items:center;justify-content:center}.bcm-input__container .input-prefix:not(:empty){padding-left:4px}.bcm-input__container .input-suffix:not(:empty){min-width:24px;padding-right:4px}.bcm-input__container .input-prefix:not(:empty),.bcm-input__container .input-suffix:not(:empty){display:flex;align-items:center;justify-content:center;cursor:default;color:#64748a}.bcm-input__container .input-prefix:not(:empty) .unit-prefix,.bcm-input__container .input-suffix:not(:empty) .unit-prefix{color:#64748a}.bcm-input__container .input-prefix-button:not(:empty),.bcm-input__container .input-suffix-button:not(:empty){cursor:pointer}.bcm-input__container .caret-container,.bcm-input__container .input-clear-button{opacity:0}.bcm-input__container--small{font-size:12px}.bcm-input__container--medium{font-size:14px}.bcm-input__container--large{font-size:16px}.bcm-input__textarea.clearable .bcm-input-element{padding-right:24px}.bcm-input__textarea .input-clear-button{position:absolute;top:4px;right:0}";
1984
-
1985
- const BcmSearch = class {
1986
- constructor(hostRef) {
1987
- registerInstance(this, hostRef);
1988
- this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
1989
- this.bcmOnSearchClear = createEvent(this, "bcm-on-search-clear", 7);
1990
- this.debounceHandler = Generate.debounceInput((event) => this.onSearchValue(event, this), 300, false, () => {
1991
- var _a, _b;
1992
- this.isActiveClearable = ((_b = (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.length) > 0 && this.clearable;
1993
- });
1994
- this._id = Generate.UID();
1995
- this.placeholder = "Search";
1996
- this.disabled = false;
1997
- this.readonly = false;
1998
- this.clearable = true;
1999
- this.size = Bcm.Size.medium;
2000
- this.limit = 10;
2001
- this.searchIsOnlyChilds = false;
2002
- this.minSearchLength = 2;
2003
- this.data = [];
2004
- this.tick = {};
2005
- this.isActiveClearable = false;
2006
- }
2007
- async componentDidLoad() {
2008
- await this.initState();
2009
- }
2010
- async dataChanged(newValue, oldValue) {
2011
- // console.log('data changed', newValue, oldValue)
2012
- if (newValue !== oldValue) {
2013
- await this.initState();
2014
- }
2015
- }
2016
- async initState() {
2017
- await searchState.setValue({
2018
- id: this._id + "-input",
2019
- dataSource: this.data,
2020
- searchIsOnlyChilds: this.searchIsOnlyChilds,
2021
- });
2022
- await this.markForCheck();
2023
- }
2024
- markForCheck() {
2025
- this.tick = Generate.UID();
2026
- }
2027
- handleInput() {
2028
- // console.log("aheyya")
2029
- }
2030
- async onBcmFocus() {
2031
- this.inputElement.focus();
2032
- }
2033
- async onBcmBlur() {
2034
- this.inputElement.blur();
2035
- }
2036
- async onBcmSelect() {
2037
- this.inputElement.select();
2038
- }
2039
- async setValue(newValue) {
2040
- this.inputElement.value = newValue;
2041
- }
2042
- handleFocus() { }
2043
- handleBlur() { }
2044
- handleChange() { }
2045
- async handleClear(eventEmit = true) {
2046
- this.inputElement.value = '';
2047
- const { value, id } = this.inputElement;
2048
- searchState.searchData(id, value);
2049
- this.isActiveClearable = false;
2050
- this.bcmOnSearch.emit({ result: null, value: null, matching: null, parentIndex: null });
2051
- this.bcmOnSearchClear.emit(eventEmit);
2052
- await delay(10);
2053
- return Promise.resolve();
2054
- }
2055
- onSearchValue(event, instance) {
2056
- const { value, id } = event.target;
2057
- const searchResult = (value === null || value === void 0 ? void 0 : value.length) >= this.minSearchLength ? searchState.searchData(id, value, null) : null;
2058
- const { bcmOnSearch, inputElement } = instance;
2059
- bcmOnSearch.emit({ result: searchResult === null || searchResult === void 0 ? void 0 : searchResult.result, value: inputElement === null || inputElement === void 0 ? void 0 : inputElement.value, matching: searchResult === null || searchResult === void 0 ? void 0 : searchResult.matching, parentIndex: searchResult === null || searchResult === void 0 ? void 0 : searchResult.parentIndex, nestedResult: searchResult === null || searchResult === void 0 ? void 0 : searchResult.nestedResult });
2060
- }
2061
- render() {
2062
- const { _id, placeholder, disabled, readonly } = this;
2063
- return h(Host, { onClick: () => { this.onBcmFocus(); this.onBcmSelect(); } }, h(InputTemplate, { size: this.size, id: _id, type: "search", placeholder: placeholder, disabled: disabled, "full-width": true, readonly: readonly, clearable: this.isActiveClearable, handleFocus: () => this.handleFocus(), handleBlur: () => this.handleBlur(), handleChange: () => this.handleChange(), handleClear: () => this.handleClear(), handleInput: this.debounceHandler, ref: (el) => this.inputElement = el }));
2064
- }
2065
- get el() { return getElement(this); }
2066
- static get watchers() { return {
2067
- "data": ["dataChanged"]
2068
- }; }
2069
- };
2070
- BcmSearch.style = searchCss;
2071
-
2072
- const BcmTooltip = class {
2073
- constructor(hostRef) {
2074
- registerInstance(this, hostRef);
2075
- this.bcmTooltipShow = createEvent(this, "bcmTooltipShow", 7);
2076
- this.bcmTooltipHide = createEvent(this, "bcmTooltipHide", 7);
2077
- this._id = Generate.UID();
2078
- this.message = "";
2079
- this.placement = Bcm$1.Placement.top;
2080
- this.trigger = Bcm$1.TriggerType.click;
2081
- this.open = false;
2082
- this.color = "slate";
2083
- this.size = Bcm$1.Size.medium;
2084
- this.openDelay = 0;
2085
- this.closeDelay = 0;
2086
- this.autoHide = false;
2087
- this.targetId = undefined;
2088
- this.tooltip = undefined;
2089
- }
2090
- emitShow() {
2091
- this.bcmTooltipShow.emit();
2092
- }
2093
- emitHide() {
2094
- this.bcmTooltipHide.emit();
2095
- }
2096
- connectedCallback() {
2097
- this.tooltip = new Tooltip({
2098
- targetId: this.targetId || this._id,
2099
- message: this.message,
2100
- placement: this.placement,
2101
- color: this.color,
2102
- trigger: this.trigger,
2103
- size: this.size,
2104
- openDelay: this.openDelay,
2105
- closeDelay: this.closeDelay,
2106
- autoHide: this.autoHide,
2107
- emitShow: () => this.emitShow(),
2108
- emitHide: () => this.emitHide(),
2109
- });
2110
- }
2111
- componentDidLoad() {
2112
- this.tooltip.listener();
2113
- }
2114
- componentDidRender() {
2115
- this.tooltip.message = this.message;
2116
- this.tooltip.placement = this.placement;
2117
- this.tooltip.color = this.color;
2118
- this.tooltip.trigger = this.trigger;
2119
- this.tooltip.size = this.size;
2120
- this.tooltip.openDelay = this.openDelay;
2121
- this.tooltip.closeDelay = this.closeDelay;
2122
- this.tooltip.autoHide = this.autoHide;
2123
- this.tooltip.update();
2124
- }
2125
- disconnectedCallback() {
2126
- this.tooltip.destroy();
2127
- }
2128
- async show() {
2129
- this.tooltip.show();
2130
- }
2131
- async hide() {
2132
- this.tooltip.hide();
2133
- }
2134
- async toggle() {
2135
- this.tooltip.toggle();
2136
- }
2137
- render() {
2138
- return (h(Host, { class: "tw-inline-flex tw-h-fit tw-w-fit", role: "tooltip" }, h("slot", null)));
2139
- }
2140
- get el() { return getElement(this); }
2141
- };
2142
-
2143
- export { BcmIcon as bcm_icon, BcmLabel as bcm_label, BcmList as bcm_list, BcmRcOverflow as bcm_rc_overflow, BcmSearch as bcm_search, BcmTooltip as bcm_tooltip };