bromcom-ui 2.10.1-rc.0 → 2.10.1-rc.10

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 (423) 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-000670b6.js +5 -0
  4. package/dist/bromcom-ui/{p-401a6ab5.entry.js → p-073d177e.entry.js} +1 -1
  5. package/dist/bromcom-ui/{p-fa08ba52.entry.js → p-07e9b5e7.entry.js} +1 -1
  6. package/dist/bromcom-ui/p-0fc73cca.entry.js +5 -0
  7. package/dist/bromcom-ui/{p-fcc6f71e.js → p-125d6ed0.js} +1 -1
  8. package/dist/bromcom-ui/{p-4438d629.entry.js → p-14cafd64.entry.js} +1 -1
  9. package/dist/bromcom-ui/{p-6b5ed4d8.js → p-157359d6.js} +1 -1
  10. package/dist/bromcom-ui/{p-05bd4980.entry.js → p-16450a8b.entry.js} +1 -1
  11. package/dist/bromcom-ui/{p-e037ee2b.js → p-170cf07d.js} +1 -1
  12. package/dist/bromcom-ui/{p-3bae35e5.entry.js → p-175eb1c7.entry.js} +1 -1
  13. package/dist/bromcom-ui/{p-7c94a7b0.entry.js → p-17c0a72a.entry.js} +1 -1
  14. package/dist/bromcom-ui/{p-51ba92e5.entry.js → p-17eb0140.entry.js} +1 -1
  15. package/dist/bromcom-ui/{p-5a97d31c.entry.js → p-18d28737.entry.js} +1 -1
  16. package/dist/bromcom-ui/{p-08159d00.entry.js → p-19f27bd8.entry.js} +1 -1
  17. package/dist/bromcom-ui/{p-95a2c489.entry.js → p-1c801d0c.entry.js} +1 -1
  18. package/dist/bromcom-ui/{p-e32ab4da.entry.js → p-1c9314bd.entry.js} +1 -1
  19. package/dist/bromcom-ui/p-1f5ca41b.entry.js +5 -0
  20. package/dist/bromcom-ui/p-21cb3cfe.entry.js +5 -0
  21. package/dist/bromcom-ui/p-228c74e9.entry.js +5 -0
  22. package/dist/bromcom-ui/{p-1d04942a.entry.js → p-23eb79ac.entry.js} +1 -1
  23. package/dist/bromcom-ui/{p-18bc4e04.entry.js → p-26290ed5.entry.js} +1 -1
  24. package/dist/bromcom-ui/{p-188b9079.entry.js → p-2aaeb247.entry.js} +1 -1
  25. package/dist/bromcom-ui/{p-552dfb63.entry.js → p-2d965b60.entry.js} +1 -1
  26. package/dist/bromcom-ui/p-32d93221.entry.js +21 -0
  27. package/dist/bromcom-ui/p-33513345.entry.js +5 -0
  28. package/dist/bromcom-ui/{p-61ad661f.entry.js → p-3b5c36e8.entry.js} +1 -1
  29. package/dist/bromcom-ui/{p-dca22282.entry.js → p-3f127ea5.entry.js} +1 -1
  30. package/dist/bromcom-ui/p-40b85b9b.entry.js +5 -0
  31. package/dist/bromcom-ui/{p-2ce15cc8.entry.js → p-424b7562.entry.js} +1 -1
  32. package/dist/bromcom-ui/{p-0efc9196.entry.js → p-430c0a24.entry.js} +1 -1
  33. package/dist/bromcom-ui/{p-da20e681.entry.js → p-43a1f84c.entry.js} +1 -1
  34. package/dist/bromcom-ui/{p-c851688d.entry.js → p-4e436468.entry.js} +1 -1
  35. package/dist/bromcom-ui/{p-6e5f5f36.js → p-518b9b80.js} +1 -1
  36. package/dist/bromcom-ui/{p-be6595a2.entry.js → p-51b6a14a.entry.js} +1 -1
  37. package/dist/bromcom-ui/{p-32fd9854.js → p-52b7fc24.js} +1 -1
  38. package/dist/bromcom-ui/p-56187d14.entry.js +5 -0
  39. package/dist/bromcom-ui/{p-468157a0.entry.js → p-5699f67d.entry.js} +1 -1
  40. package/dist/bromcom-ui/{p-d4755f0d.entry.js → p-58d5775f.entry.js} +1 -1
  41. package/dist/bromcom-ui/{p-dd1a0284.entry.js → p-594953e7.entry.js} +1 -1
  42. package/dist/bromcom-ui/p-5b96272e.entry.js +5 -0
  43. package/dist/bromcom-ui/{p-21fed956.entry.js → p-5bf620b2.entry.js} +1 -1
  44. package/dist/bromcom-ui/{p-4d8067b9.entry.js → p-5c671967.entry.js} +1 -1
  45. package/dist/bromcom-ui/{p-599889d7.entry.js → p-5fc49f6f.entry.js} +1 -1
  46. package/dist/bromcom-ui/{p-00e1c9bb.entry.js → p-60a12878.entry.js} +1 -1
  47. package/dist/bromcom-ui/p-61314a43.js +5 -0
  48. package/dist/bromcom-ui/{p-5dd45752.entry.js → p-6153f889.entry.js} +1 -1
  49. package/dist/bromcom-ui/{p-4798d827.js → p-61db1f1f.js} +1 -1
  50. package/dist/bromcom-ui/{p-7a89243a.entry.js → p-626b805d.entry.js} +1 -1
  51. package/dist/bromcom-ui/{p-a313fba6.js → p-6369b73b.js} +1 -1
  52. package/dist/bromcom-ui/{p-6660ba14.entry.js → p-643a09b4.entry.js} +1 -1
  53. package/dist/bromcom-ui/p-64999c43.entry.js +5 -0
  54. package/dist/bromcom-ui/p-64fad38b.js +11 -0
  55. package/dist/bromcom-ui/{p-3b079331.entry.js → p-67343ad8.entry.js} +1 -1
  56. package/dist/bromcom-ui/{p-48f5a3c9.entry.js → p-69260d36.entry.js} +1 -1
  57. package/dist/bromcom-ui/{p-034bbcdd.js → p-6edf985f.js} +1 -1
  58. package/dist/bromcom-ui/{p-197aba37.js → p-74e6d2b6.js} +1 -1
  59. package/dist/bromcom-ui/{p-47df8e77.entry.js → p-79712823.entry.js} +1 -1
  60. package/dist/bromcom-ui/{p-03337609.entry.js → p-7c5763cc.entry.js} +1 -1
  61. package/dist/bromcom-ui/{p-181f2f4a.entry.js → p-7d18ce0e.entry.js} +1 -1
  62. package/dist/bromcom-ui/{p-ddb6f31a.entry.js → p-7e2da99e.entry.js} +1 -1
  63. package/dist/bromcom-ui/{p-5ae0a59b.js → p-7e44e6b5.js} +1 -1
  64. package/dist/bromcom-ui/{p-0db33506.entry.js → p-841f2b60.entry.js} +1 -1
  65. package/dist/bromcom-ui/{p-e45c1546.js → p-85eedabc.js} +1 -1
  66. package/dist/bromcom-ui/{p-3c7a0345.js → p-8c018ae0.js} +1 -1
  67. package/dist/bromcom-ui/{p-ab3cd547.entry.js → p-8c3a6509.entry.js} +1 -1
  68. package/dist/bromcom-ui/p-8c610886.js +5 -0
  69. package/dist/bromcom-ui/{p-5efc5c02.entry.js → p-8e772077.entry.js} +1 -1
  70. package/dist/bromcom-ui/{p-61334720.entry.js → p-8fbdb72f.entry.js} +1 -1
  71. package/dist/bromcom-ui/{p-91623d42.entry.js → p-910c935f.entry.js} +1 -1
  72. package/dist/bromcom-ui/{p-8e5e362a.js → p-9850cbce.js} +1 -1
  73. package/dist/bromcom-ui/{p-f9119bec.entry.js → p-99824717.entry.js} +1 -1
  74. package/dist/bromcom-ui/p-9ac757e9.entry.js +5 -0
  75. package/dist/bromcom-ui/{p-d345d37b.entry.js → p-9da1d897.entry.js} +1 -1
  76. package/dist/bromcom-ui/{p-d3bd9ee0.entry.js → p-9f1e6daa.entry.js} +1 -1
  77. package/dist/bromcom-ui/{p-cd724916.js → p-a1477028.js} +1 -1
  78. package/dist/bromcom-ui/p-a25c8a55.js +5 -0
  79. package/dist/bromcom-ui/{p-0207059a.js → p-a58b2664.js} +1 -1
  80. package/dist/bromcom-ui/{p-1a33d7a3.entry.js → p-a664cc20.entry.js} +1 -1
  81. package/dist/bromcom-ui/{p-8fa5700a.entry.js → p-a835bff0.entry.js} +1 -1
  82. package/dist/bromcom-ui/p-a889681e.entry.js +5 -0
  83. package/dist/bromcom-ui/{p-1ba21e9c.entry.js → p-aab72ea1.entry.js} +1 -1
  84. package/dist/bromcom-ui/p-abc44b58.entry.js +5 -0
  85. package/dist/bromcom-ui/p-ae57f046.entry.js +5 -0
  86. package/dist/bromcom-ui/{p-035c6dbc.entry.js → p-afde516e.entry.js} +1 -1
  87. package/dist/bromcom-ui/{p-6e7bb16f.entry.js → p-ba9eff2a.entry.js} +1 -1
  88. package/dist/bromcom-ui/{p-107f11df.entry.js → p-c1a992e7.entry.js} +1 -1
  89. package/dist/bromcom-ui/{p-0c8abcd8.entry.js → p-c977ed98.entry.js} +1 -1
  90. package/dist/bromcom-ui/p-cfd52d5f.entry.js +5 -0
  91. package/dist/bromcom-ui/{p-63138ee5.entry.js → p-d551a51d.entry.js} +1 -1
  92. package/dist/bromcom-ui/{p-f9988c3c.entry.js → p-da5fdda2.entry.js} +1 -1
  93. package/dist/bromcom-ui/p-e19a8e73.entry.js +5 -0
  94. package/dist/bromcom-ui/{p-4542066c.js → p-e2aaaece.js} +1 -1
  95. package/dist/bromcom-ui/{p-a42879c1.entry.js → p-e6faa2bb.entry.js} +1 -1
  96. package/dist/bromcom-ui/{p-751baf81.entry.js → p-ec36f5a0.entry.js} +1 -1
  97. package/dist/bromcom-ui/p-ec992ac3.entry.js +5 -0
  98. package/dist/bromcom-ui/{p-f4576a4f.entry.js → p-ecd8d70f.entry.js} +1 -1
  99. package/dist/bromcom-ui/{p-4d7ea23c.entry.js → p-ece578ef.entry.js} +1 -1
  100. package/dist/bromcom-ui/p-edbdd7dd.js +5 -0
  101. package/dist/bromcom-ui/{p-daa45693.entry.js → p-f077a1d7.entry.js} +1 -1
  102. package/dist/bromcom-ui/{p-704352eb.entry.js → p-f2776268.entry.js} +1 -1
  103. package/dist/bromcom-ui/p-f800e665.js +5 -0
  104. package/dist/bromcom-ui/{p-2d59be96.js → p-f83b3048.js} +1 -1
  105. package/dist/bromcom-ui/{p-c39f002b.js → p-fed84581.js} +1 -1
  106. package/dist/bromcom-ui/{p-1e8559ac.entry.js → p-fff1a0f9.entry.js} +1 -1
  107. package/dist/cjs/{bcm-489c9b1a.js → bcm-3c58a6d5.js} +28 -28
  108. package/dist/cjs/bcm-accordion.cjs.entry.js +2 -2
  109. package/dist/cjs/bcm-alert.cjs.entry.js +4 -4
  110. package/dist/cjs/bcm-attendance.cjs.entry.js +2 -2
  111. package/dist/cjs/bcm-avatar_2.cjs.entry.js +6 -6
  112. package/dist/cjs/bcm-breadcrumb.cjs.entry.js +2 -2
  113. package/dist/cjs/bcm-button-group.cjs.entry.js +4 -4
  114. package/dist/cjs/bcm-button_15.cjs.entry.js +37832 -0
  115. package/dist/cjs/bcm-caption.cjs.entry.js +47 -0
  116. package/dist/cjs/bcm-card.cjs.entry.js +5 -5
  117. package/dist/cjs/bcm-checkbox-group.cjs.entry.js +20 -22
  118. package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +3 -3
  119. package/dist/cjs/bcm-chip-group.cjs.entry.js +8 -9
  120. package/dist/cjs/bcm-chip.cjs.entry.js +2 -2
  121. package/dist/cjs/bcm-collapse.cjs.entry.js +2 -2
  122. package/dist/cjs/bcm-color-input.cjs.entry.js +6 -6
  123. package/dist/cjs/bcm-date-picker.cjs.entry.js +3 -3
  124. package/dist/cjs/bcm-datetime-picker.cjs.entry.js +7 -8
  125. package/dist/cjs/bcm-default.cjs.entry.js +2 -2
  126. package/dist/cjs/bcm-drawer.cjs.entry.js +6 -6
  127. package/dist/cjs/bcm-dropdown.cjs.entry.js +4 -4
  128. package/dist/cjs/bcm-expansion-panel.cjs.entry.js +4 -4
  129. package/dist/cjs/bcm-form-2.cjs.entry.js +4 -4
  130. package/dist/cjs/bcm-input-custom.cjs.entry.js +2 -2
  131. package/dist/cjs/bcm-input-dropdown.cjs.entry.js +10 -10
  132. package/dist/cjs/bcm-item.cjs.entry.js +3 -3
  133. package/dist/cjs/bcm-items.cjs.entry.js +4 -4
  134. package/dist/cjs/bcm-link.cjs.entry.js +1 -1
  135. package/dist/cjs/bcm-menu.cjs.entry.js +8 -8
  136. package/dist/cjs/bcm-modal-2-footer.cjs.entry.js +6 -6
  137. package/dist/cjs/bcm-modal-2-header.cjs.entry.js +6 -6
  138. package/dist/cjs/bcm-modal-2.cjs.entry.js +6 -6
  139. package/dist/cjs/bcm-modal.cjs.entry.js +5 -5
  140. package/dist/cjs/bcm-number-input.cjs.entry.js +109 -0
  141. package/dist/cjs/bcm-old-input.cjs.entry.js +2 -2
  142. package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +5 -5
  143. package/dist/cjs/bcm-popconfirm.cjs.entry.js +3 -3
  144. package/dist/cjs/bcm-popover.cjs.entry.js +7 -7
  145. package/dist/cjs/bcm-progress.cjs.entry.js +3 -3
  146. package/dist/cjs/bcm-radio-group.cjs.entry.js +7 -7
  147. package/dist/cjs/bcm-radio.cjs.entry.js +6 -6
  148. package/dist/cjs/bcm-range.cjs.entry.js +3 -3
  149. package/dist/cjs/bcm-select.cjs.entry.js +2 -2
  150. package/dist/cjs/bcm-shortcut.cjs.entry.js +6 -6
  151. package/dist/cjs/bcm-skeleton.cjs.entry.js +6 -6
  152. package/dist/cjs/bcm-step.cjs.entry.js +3 -3
  153. package/dist/cjs/bcm-stepper.cjs.entry.js +7 -7
  154. package/dist/cjs/bcm-tab-group.cjs.entry.js +6 -6
  155. package/dist/cjs/bcm-tab-item-header.cjs.entry.js +6 -6
  156. package/dist/cjs/bcm-tab-item.cjs.entry.js +6 -6
  157. package/dist/cjs/bcm-table.cjs.entry.js +6 -6
  158. package/dist/cjs/bcm-tag.cjs.entry.js +4 -4
  159. package/dist/cjs/bcm-text.cjs.entry.js +3 -3
  160. package/dist/cjs/bcm-textarea.cjs.entry.js +6 -6
  161. package/dist/cjs/bcm-time-picker.cjs.entry.js +3 -3
  162. package/dist/cjs/bcm-toast.cjs.entry.js +4 -4
  163. package/dist/cjs/bcm-typography.cjs.entry.js +21 -0
  164. package/dist/cjs/bromcom-ui.cjs.js +3 -3
  165. package/dist/cjs/caption-template-6f535b93.js +32 -0
  166. package/dist/cjs/{floating-ui-21890d11.js → floating-ui-555cd3d4.js} +1 -1
  167. package/dist/cjs/{generate-e214b3de.js → generate-c3a6c8c7.js} +15 -1
  168. package/dist/cjs/{global-532b40dc.js → global-9e8b5009.js} +1 -1
  169. package/dist/cjs/{input-template-2b8e0195.js → input-template-8eeb94e7.js} +2 -2
  170. package/dist/cjs/{json-parse-decarator-668b7724.js → json-parse-decarator-0932bec0.js} +1 -1
  171. package/dist/cjs/label-template-a6f51ef2.js +27 -0
  172. package/dist/cjs/loader.cjs.js +3 -3
  173. package/dist/cjs/{number-helper-3a911c0f.js → number-helper-4e902d31.js} +1 -1
  174. package/dist/cjs/old-bcm-popover-box.cjs.entry.js +7 -7
  175. package/dist/cjs/old-bcm-popover.cjs.entry.js +3 -3
  176. package/dist/cjs/{package-f9f70acc.js → package-b23f7b7f.js} +1 -1
  177. package/dist/cjs/{popover-placement-e7d6eabd.js → popover-placement-9b4b4153.js} +1 -1
  178. package/dist/cjs/{slot-template-c8e2816c.js → slot-template-80b019d5.js} +1 -1
  179. package/dist/cjs/{stepper-states-7d2f2235.js → stepper-states-cb2339c3.js} +1 -1
  180. package/dist/cjs/{string-helper-f9184277.js → string-helper-3212f4ea.js} +1 -1
  181. package/dist/cjs/{tooltip-helper-410ac258.js → tooltip-helper-4ddec3b4.js} +6 -6
  182. package/dist/cjs/{validators-910556c5.js → validators-e2155072.js} +1 -1
  183. package/dist/collection/collection-manifest.json +2 -0
  184. package/dist/collection/components/atoms/caption/caption.js +195 -0
  185. package/dist/collection/components/atoms/label/label.js +48 -29
  186. package/dist/collection/components/molecules/checkbox/checkbox.css +0 -89
  187. package/dist/collection/components/molecules/input/input.css +0 -89
  188. package/dist/collection/components/molecules/input-dropdown/input-dropdown.css +0 -89
  189. package/dist/collection/components/molecules/input-dropdown/input-dropdown.js +1 -1
  190. package/dist/collection/components/molecules/input-dropdown/input-dropdown.style.js +1 -1
  191. package/dist/collection/components/{atoms/label/label.css → molecules/number-input/number-input.css} +12 -33
  192. package/dist/collection/components/molecules/number-input/number-input.js +425 -0
  193. package/dist/collection/components/molecules/number-input/number-input.style.js +45 -0
  194. package/dist/collection/components/molecules/search/search.css +0 -89
  195. package/dist/collection/components/molecules/switch/switch.css +1 -89
  196. package/dist/collection/components/molecules/textarea/textarea.css +0 -89
  197. package/dist/collection/components/organism/datetime-picker/datetime-picker.css +0 -89
  198. package/dist/collection/components/organism/list/list.css +2 -89
  199. package/dist/collection/components/organism/list/list.js +83 -15
  200. package/dist/collection/components/other_deprecated/old-input/old-input.css +0 -89
  201. package/dist/collection/components/third-parts/colorful/colorful.css +0 -89
  202. package/dist/collection/components/third-parts/rc-picker/date.js +7 -5
  203. package/dist/collection/components/third-parts/rc-picker/rc-picker.css +1 -376
  204. package/dist/collection/components/third-parts/rc-picker/rc-picker.js +3 -16
  205. package/dist/collection/helper/generate.js +14 -0
  206. package/dist/collection/models/bcm.js +28 -28
  207. package/dist/collection/stories/ui-library/components/date/argTypes_common.js +203 -0
  208. package/dist/collection/stories/ui-library/components/date/argTypes_date.js +47 -0
  209. package/dist/collection/stories/ui-library/components/date/argTypes_datetime.js +109 -0
  210. package/dist/collection/stories/ui-library/components/date/argTypes_time.js +91 -0
  211. package/dist/collection/templates/caption-template.js +15 -11
  212. package/dist/collection/templates/label-template.js +9 -7
  213. package/dist/collection/templates/list-item-template.js +3 -2
  214. package/dist/collection/templates/list-template.js +2 -2
  215. package/dist/components/bcm-caption.d.ts +11 -0
  216. package/dist/components/bcm-caption.js +64 -0
  217. package/dist/components/bcm-checkbox-group.js +7 -8
  218. package/dist/components/bcm-chip-group.js +1 -2
  219. package/dist/components/bcm-date.js +26 -7
  220. package/dist/components/bcm-input-dropdown.js +3 -3
  221. package/dist/components/bcm-number-input.d.ts +11 -0
  222. package/dist/components/bcm-number-input.js +157 -0
  223. package/dist/components/bcm-switch.js +1 -1
  224. package/dist/components/bcm.js +28 -28
  225. package/dist/components/caption-template.js +15 -17
  226. package/dist/components/checkbox.js +1 -1
  227. package/dist/components/colorful.js +1 -1
  228. package/dist/components/datetime-picker.js +2 -3
  229. package/dist/components/generate.js +15 -1
  230. package/dist/components/index.d.ts +2 -0
  231. package/dist/components/index.js +2 -0
  232. package/dist/components/input.js +1 -1
  233. package/dist/components/label.js +46 -20
  234. package/dist/components/list.js +49 -18
  235. package/dist/components/old-input.js +1 -1
  236. package/dist/components/rc-picker.js +4 -17
  237. package/dist/components/search.js +1 -1
  238. package/dist/components/textarea.js +1 -1
  239. package/dist/esm/{_commonjsHelpers-be0d4ec8.js → _commonjsHelpers-7002e5de.js} +1 -1
  240. package/dist/esm/{bcm-a50d55ba.js → bcm-0f9cc27c.js} +28 -28
  241. package/dist/esm/bcm-accordion.entry.js +5 -5
  242. package/dist/esm/bcm-alert.entry.js +9 -9
  243. package/dist/esm/bcm-attendance.entry.js +5 -5
  244. package/dist/esm/bcm-autocomplete.entry.js +3 -3
  245. package/dist/esm/bcm-avatar_2.entry.js +12 -12
  246. package/dist/esm/bcm-box.entry.js +1 -1
  247. package/dist/esm/bcm-breadcrumb.entry.js +6 -6
  248. package/dist/esm/bcm-button-group.entry.js +8 -8
  249. package/dist/esm/bcm-button_15.entry.js +37814 -0
  250. package/dist/esm/bcm-caption.entry.js +43 -0
  251. package/dist/esm/bcm-card.entry.js +11 -11
  252. package/dist/esm/bcm-checkbox-group.entry.js +17 -19
  253. package/dist/esm/bcm-checkbox-lite_9.entry.js +8 -8
  254. package/dist/esm/bcm-chip-group.entry.js +15 -16
  255. package/dist/esm/bcm-chip.entry.js +8 -8
  256. package/dist/esm/bcm-collapse-group.entry.js +2 -2
  257. package/dist/esm/bcm-collapse.entry.js +6 -6
  258. package/dist/esm/bcm-color-input.entry.js +12 -12
  259. package/dist/esm/bcm-colorpicker.entry.js +5 -5
  260. package/dist/esm/bcm-content.entry.js +1 -1
  261. package/dist/esm/bcm-date-picker.entry.js +9 -9
  262. package/dist/esm/bcm-datetime-picker.entry.js +14 -15
  263. package/dist/esm/bcm-default.entry.js +5 -5
  264. package/dist/esm/bcm-drawer.entry.js +13 -13
  265. package/dist/esm/bcm-dropdown.entry.js +9 -9
  266. package/dist/esm/bcm-error-layout.entry.js +3 -3
  267. package/dist/esm/bcm-expansion-panel.entry.js +10 -10
  268. package/dist/esm/bcm-form-2.entry.js +8 -8
  269. package/dist/esm/bcm-form-group.entry.js +1 -1
  270. package/dist/esm/bcm-input-custom.entry.js +6 -6
  271. package/dist/esm/bcm-input-dropdown.entry.js +17 -17
  272. package/dist/esm/bcm-item.entry.js +9 -9
  273. package/dist/esm/bcm-items.entry.js +7 -7
  274. package/dist/esm/bcm-link.entry.js +4 -4
  275. package/dist/esm/bcm-menu.entry.js +16 -16
  276. package/dist/esm/bcm-message.entry.js +3 -3
  277. package/dist/esm/bcm-modal-2-footer.entry.js +13 -13
  278. package/dist/esm/bcm-modal-2-header.entry.js +12 -12
  279. package/dist/esm/bcm-modal-2.entry.js +13 -13
  280. package/dist/esm/bcm-modal.entry.js +9 -9
  281. package/dist/esm/bcm-notification.entry.js +3 -3
  282. package/dist/esm/bcm-number-input.entry.js +105 -0
  283. package/dist/esm/bcm-old-input.entry.js +6 -6
  284. package/dist/esm/bcm-old-tag_2.entry.js +4 -4
  285. package/dist/esm/bcm-overlay_2.entry.js +4 -4
  286. package/dist/esm/bcm-popconfirm-box.entry.js +11 -11
  287. package/dist/esm/bcm-popconfirm.entry.js +7 -7
  288. package/dist/esm/bcm-popover.entry.js +13 -13
  289. package/dist/esm/bcm-progress.entry.js +9 -9
  290. package/dist/esm/bcm-radio-group.entry.js +15 -15
  291. package/dist/esm/bcm-radio.entry.js +13 -13
  292. package/dist/esm/bcm-range.entry.js +8 -8
  293. package/dist/esm/bcm-result.entry.js +3 -3
  294. package/dist/esm/bcm-select-group.entry.js +3 -3
  295. package/dist/esm/bcm-select-option.entry.js +3 -3
  296. package/dist/esm/bcm-select.entry.js +6 -6
  297. package/dist/esm/bcm-shortcut.entry.js +13 -13
  298. package/dist/esm/bcm-skeleton.entry.js +12 -12
  299. package/dist/esm/bcm-step.entry.js +8 -8
  300. package/dist/esm/bcm-stepper.entry.js +15 -15
  301. package/dist/esm/bcm-tab-group.entry.js +12 -12
  302. package/dist/esm/bcm-tab-item-header.entry.js +13 -13
  303. package/dist/esm/bcm-tab-item.entry.js +12 -12
  304. package/dist/esm/bcm-tab-pane.entry.js +3 -3
  305. package/dist/esm/bcm-tab.entry.js +3 -3
  306. package/dist/esm/bcm-table.entry.js +13 -13
  307. package/dist/esm/bcm-tabs-content.entry.js +4 -4
  308. package/dist/esm/bcm-tabs.entry.js +4 -4
  309. package/dist/esm/bcm-tag.entry.js +9 -9
  310. package/dist/esm/bcm-text.entry.js +9 -9
  311. package/dist/esm/bcm-textarea.entry.js +12 -12
  312. package/dist/esm/bcm-time-picker.entry.js +9 -9
  313. package/dist/esm/bcm-timeline-item.entry.js +3 -3
  314. package/dist/esm/bcm-timeline.entry.js +3 -3
  315. package/dist/esm/bcm-toast.entry.js +9 -9
  316. package/dist/esm/bcm-treeview-group.entry.js +1 -1
  317. package/dist/esm/bcm-typography.entry.js +17 -0
  318. package/dist/esm/bromcom-ui.js +5 -5
  319. package/dist/esm/caption-template-0c32ce16.js +30 -0
  320. package/dist/esm/{color-helper-c4fa9ebc.js → color-helper-845ba523.js} +2 -2
  321. package/dist/esm/{colors-e1c31f79.js → colors-ebea297f.js} +1 -1
  322. package/dist/esm/{element-dragger-7ea06c76.js → element-dragger-89bb52fd.js} +1 -1
  323. package/dist/esm/{floating-ui-3f4394da.js → floating-ui-a4e67246.js} +1 -1
  324. package/dist/esm/{generate-7d1e216b.js → generate-80f589b2.js} +16 -2
  325. package/dist/esm/{global-34d95eec.js → global-9afe304c.js} +2 -2
  326. package/dist/esm/{index-b84bc8c9.js → index-00c8a8f7.js} +1 -1
  327. package/dist/esm/{index-4614b7f0.js → index-0615c2b8.js} +1 -1
  328. package/dist/esm/{index-f38e3364.js → index-7e71bbc8.js} +1 -1
  329. package/dist/esm/{input-template-1df1e8d3.js → input-template-a5d07ba6.js} +4 -4
  330. package/dist/esm/{is-load-decorator-b8ca22f2.js → is-load-decorator-8277e3b8.js} +1 -1
  331. package/dist/esm/{json-parse-decarator-19a0db7a.js → json-parse-decarator-5195f510.js} +2 -2
  332. package/dist/esm/label-template-ad2e8119.js +25 -0
  333. package/dist/esm/loader.js +5 -5
  334. package/dist/esm/{number-helper-a5eab393.js → number-helper-aeb5881f.js} +1 -1
  335. package/dist/esm/old-bcm-popover-box.entry.js +13 -13
  336. package/dist/esm/old-bcm-popover.entry.js +7 -7
  337. package/dist/esm/{package-e0577fef.js → package-5e39e390.js} +1 -1
  338. package/dist/esm/{popover-placement-2f5939ea.js → popover-placement-279ce860.js} +1 -1
  339. package/dist/esm/{slot-template-08ed1fe4.js → slot-template-9234df88.js} +2 -2
  340. package/dist/esm/{stepper-states-10d7b726.js → stepper-states-97a648ff.js} +3 -3
  341. package/dist/esm/{string-helper-85990695.js → string-helper-8f5da9ec.js} +2 -2
  342. package/dist/esm/{tooltip-helper-59b661f8.js → tooltip-helper-d339c58a.js} +9 -9
  343. package/dist/esm/{utils-b3338faf.js → utils-57652744.js} +1 -1
  344. package/dist/esm/{validators-7979c137.js → validators-b5e106d5.js} +1 -1
  345. package/dist/types/components/atoms/caption/caption.d.ts +14 -0
  346. package/dist/types/components/atoms/label/label.d.ts +3 -3
  347. package/dist/types/components/molecules/number-input/number-input.d.ts +29 -0
  348. package/dist/types/components/molecules/number-input/number-input.style.d.ts +200 -0
  349. package/dist/types/components/organism/list/list.d.ts +5 -1
  350. package/dist/types/components.d.ts +90 -7
  351. package/dist/types/helper/generate.d.ts +3 -0
  352. package/dist/types/models/bcm.d.ts +3 -0
  353. package/dist/types/templates/caption-template.d.ts +1 -1
  354. package/dist/types/templates/label-template.d.ts +2 -1
  355. package/dist/types/templates/list-template.d.ts +1 -0
  356. package/package.json +2 -2
  357. package/dist/bromcom-ui/p-036877be.entry.js +0 -5
  358. package/dist/bromcom-ui/p-0d2b8bc4.entry.js +0 -5
  359. package/dist/bromcom-ui/p-1daf0fe1.entry.js +0 -5
  360. package/dist/bromcom-ui/p-2a5d176d.js +0 -5
  361. package/dist/bromcom-ui/p-2cbda5aa.entry.js +0 -5
  362. package/dist/bromcom-ui/p-3182df7e.js +0 -10
  363. package/dist/bromcom-ui/p-32df2233.js +0 -5
  364. package/dist/bromcom-ui/p-3ccb15ef.entry.js +0 -5
  365. package/dist/bromcom-ui/p-4213ba24.js +0 -5
  366. package/dist/bromcom-ui/p-43598b88.entry.js +0 -5
  367. package/dist/bromcom-ui/p-4a7c2381.entry.js +0 -5
  368. package/dist/bromcom-ui/p-5ea9881d.entry.js +0 -5
  369. package/dist/bromcom-ui/p-64ddda1d.entry.js +0 -5
  370. package/dist/bromcom-ui/p-6d0a02d7.entry.js +0 -5
  371. package/dist/bromcom-ui/p-6f11eb8e.entry.js +0 -5
  372. package/dist/bromcom-ui/p-76edf59f.js +0 -7
  373. package/dist/bromcom-ui/p-77035c08.entry.js +0 -5
  374. package/dist/bromcom-ui/p-7a4cc259.js +0 -5
  375. package/dist/bromcom-ui/p-7e3209a0.js +0 -14
  376. package/dist/bromcom-ui/p-8291e20e.js +0 -5
  377. package/dist/bromcom-ui/p-82a5033e.js +0 -5
  378. package/dist/bromcom-ui/p-85d8092e.entry.js +0 -5
  379. package/dist/bromcom-ui/p-8fbc35e7.entry.js +0 -5
  380. package/dist/bromcom-ui/p-903cbe6a.entry.js +0 -5
  381. package/dist/bromcom-ui/p-9339510a.entry.js +0 -5
  382. package/dist/bromcom-ui/p-94a8408e.entry.js +0 -5
  383. package/dist/bromcom-ui/p-a0909a04.entry.js +0 -5
  384. package/dist/bromcom-ui/p-b1a70ec2.entry.js +0 -5
  385. package/dist/bromcom-ui/p-ba315064.entry.js +0 -5
  386. package/dist/bromcom-ui/p-bb739bf8.entry.js +0 -5
  387. package/dist/bromcom-ui/p-bed627ab.js +0 -11
  388. package/dist/bromcom-ui/p-ec90b2c7.entry.js +0 -5
  389. package/dist/bromcom-ui/p-fce1d13c.entry.js +0 -5
  390. package/dist/bromcom-ui/p-ff5acf88.entry.js +0 -5
  391. package/dist/cjs/bcm-button.cjs.entry.js +0 -372
  392. package/dist/cjs/bcm-checkbox_2.cjs.entry.js +0 -194
  393. package/dist/cjs/bcm-colorful_2.cjs.entry.js +0 -17624
  394. package/dist/cjs/bcm-date.cjs.entry.js +0 -182
  395. package/dist/cjs/bcm-form.cjs.entry.js +0 -489
  396. package/dist/cjs/bcm-icon.cjs.entry.js +0 -39
  397. package/dist/cjs/bcm-label_2.cjs.entry.js +0 -126
  398. package/dist/cjs/bcm-linked.cjs.entry.js +0 -219
  399. package/dist/cjs/bcm-list_3.cjs.entry.js +0 -2516
  400. package/dist/cjs/bcm-rc-picker.cjs.entry.js +0 -9404
  401. package/dist/cjs/bcm-switch.cjs.entry.js +0 -151
  402. package/dist/cjs/caption-template-81dbc490.js +0 -34
  403. package/dist/cjs/index-3d67f613.js +0 -1610
  404. package/dist/cjs/index-e05a7c6f.js +0 -545
  405. package/dist/cjs/label-template-d9bee58a.js +0 -23
  406. package/dist/cjs/moment-d06b012f.js +0 -4601
  407. package/dist/components/label-template.js +0 -21
  408. package/dist/esm/bcm-button.entry.js +0 -368
  409. package/dist/esm/bcm-checkbox_2.entry.js +0 -189
  410. package/dist/esm/bcm-colorful_2.entry.js +0 -17619
  411. package/dist/esm/bcm-date.entry.js +0 -178
  412. package/dist/esm/bcm-form.entry.js +0 -485
  413. package/dist/esm/bcm-icon.entry.js +0 -35
  414. package/dist/esm/bcm-label_2.entry.js +0 -121
  415. package/dist/esm/bcm-linked.entry.js +0 -215
  416. package/dist/esm/bcm-list_3.entry.js +0 -2510
  417. package/dist/esm/bcm-rc-picker.entry.js +0 -9400
  418. package/dist/esm/bcm-switch.entry.js +0 -147
  419. package/dist/esm/caption-template-a1a968fd.js +0 -32
  420. package/dist/esm/index-a6d9d0af.js +0 -541
  421. package/dist/esm/index-c4568336.js +0 -1594
  422. package/dist/esm/label-template-639fcd41.js +0 -21
  423. package/dist/esm/moment-15cd9198.js +0 -4598
@@ -1,2516 +0,0 @@
1
- /*!
2
- * Built with Stencil
3
- * Copyright (c) Bromcom.
4
- */
5
- 'use strict';
6
-
7
- Object.defineProperty(exports, '__esModule', { value: true });
8
-
9
- const index$1 = require('./index-c591ecec.js');
10
- const isLoadDecorator = require('./is-load-decorator-15036f37.js');
11
- const jsonParseDecarator = require('./json-parse-decarator-668b7724.js');
12
- require('./color-helper-c3a819ea.js');
13
- require('./datetime-helper-eaf4fadb.js');
14
- const generate = require('./generate-e214b3de.js');
15
- const numberHelper = require('./number-helper-3a911c0f.js');
16
- const stringHelper = require('./string-helper-f9184277.js');
17
- const validators = require('./validators-910556c5.js');
18
- require('./element-dragger-a8562f82.js');
19
- const popoverPlacement = require('./popover-placement-e7d6eabd.js');
20
- const utils = require('./utils-fc077139.js');
21
- const bcm = require('./bcm-489c9b1a.js');
22
- const captionTemplate = require('./caption-template-81dbc490.js');
23
- const index = require('./index-95ae50d0.js');
24
- require('./types-cc4adee7.js');
25
- require('./types-7523fd99.js');
26
- const index$2 = require('./index-d321de96.js');
27
- const index$3 = require('./index-e05a7c6f.js');
28
- const index$4 = require('./index-3d67f613.js');
29
- const inputTemplate = require('./input-template-2b8e0195.js');
30
- require('./colors-56282b00.js');
31
- require('./colors-078851ec.js');
32
- require('./_commonjsHelpers-ed84c3ca.js');
33
- require('./package-f9f70acc.js');
34
-
35
- const CheckboxTemplate = ({ disabled, checked, readonly, required, indeterminate, hidden, captionType, _id }) => {
36
- // if ( indeterminate ) {
37
- // checked = indeterminate == 'determinate' ? true : false
38
- // }
39
- const hostClasses = index.classnames('bcm-checkbox', 'bcm-checkbox__type-default', `bcm-checkbox-size-medium`, {
40
- // 'size-2': size === Bcm.Size.small || size === Bcm.Size.medium,
41
- // 'size-3': optionType === 'button' && size === Bcm.Size.large,
42
- 'error': captionType == bcm.Bcm.Status.error,
43
- hidden,
44
- checked,
45
- disabled,
46
- required,
47
- readonly,
48
- });
49
- const bcmCheckboxIconClass = index.classnames('bcm-checkbox__label-icon', 'bcm-checkbox__label-icon-lite', 'bcm-checkbox__label-icon-' + indeterminate, {
50
- 'bcm-checkbox__label-icon-checked': checked,
51
- });
52
- const bcmCheckboxLabelClass = index.classnames('bcm-checkbox__label');
53
- return (index$1.h("div", { class: hostClasses },
54
- index$1.h("input", { tabindex: "-1", id: _id, type: "checkbox", checked: checked, disabled: disabled, required: required, readonly: readonly }),
55
- index$1.h("label", { class: bcmCheckboxLabelClass, htmlFor: _id },
56
- index$1.h("span", { class: bcmCheckboxIconClass },
57
- index$1.h("bcm-icon", { icon: "far fa-check" })))));
58
- };
59
-
60
- const InfoFooterTemplate = ({ selected, total, found, multiple, variableText }) => {
61
- total = total || 0;
62
- variableText = variableText ? utils.pluralize(variableText, total) : 'items';
63
- return (index$1.h("footer", { class: "bcm-info-footer" },
64
- index$1.h("bcm-text", { scale: "size-1", color: "grey-8" },
65
- (multiple && selected > 0) && ` ( ${selected} selected ) `,
66
- ` Total ${total} `,
67
- found != null && ` / ${found} `,
68
- ` ${variableText} found. `)));
69
- };
70
-
71
- const ListItemTemplate = ({ item, treeview, highlight, checkboxes, size, selectedItem, openGroup, checkedItem, focusItem, searchIsOnlyChilds }) => {
72
- const isHaveChildren = item.items && item.items.length > 0;
73
- var text = stringHelper.StringHelper.htmlEntities(item.text);
74
- let intersection = [];
75
- if (highlight && stringHelper.StringHelper.slugify(text).includes(stringHelper.StringHelper.slugify(highlight))) {
76
- if (!searchIsOnlyChilds || (searchIsOnlyChilds && (!isHaveChildren || (!treeview && item.type != "group")))) {
77
- text = stringHelper.StringHelper.highlight(text, highlight);
78
- }
79
- }
80
- if (item.type != 'group' && item.template) {
81
- const match = item.template
82
- .replace(/\s/g, '')
83
- .match(/\{{[^}}]+\}/g)
84
- .map(x => x.replace(/[{}]/g, ''));
85
- const keys = Object.keys(item.itemObject);
86
- intersection = match.filter(x => keys.includes(x));
87
- }
88
- text = item.isHtmlContent ? item.isHtmlContent : item.template && intersection.length > 0 ? stringHelper.StringHelper.templateParser(item.template, Object.assign(Object.assign({}, item.itemObject), { text })) : text;
89
- const unClickable = !treeview && item.type == "group" && !item.clickable;
90
- const disabled = item.disabled;
91
- const readonly = item.readonly;
92
- const itemClick = (event) => {
93
- let path = event.path || event.composedPath();
94
- if (path.filter(x => x.attributes && x.attributes.getNamedItem("unlinked"))[0]) {
95
- return;
96
- }
97
- if (readonly) {
98
- collapseClick();
99
- }
100
- !unClickable && !disabled && !readonly && (checkboxes ? checkedItem(item.id) : selectedItem(item.id));
101
- };
102
- const collapseClick = () => {
103
- item.open = item.isSearching;
104
- openGroup(item.id);
105
- };
106
- return (index$1.h("div", { id: item.id, hidden: item.hidden, "on-focus": e => !unClickable && !disabled && focusItem(e), class: index.classnames('bcm-list__item',
107
- // size === 'large' ? 'size-3' : 'size-2',
108
- 'bcm-list__item-' + size, {
109
- 'bcm-list__item--group': !treeview && item.type == 'group',
110
- 'bcm-list__item--readonly': readonly,
111
- }) },
112
- index$1.h("div", { class: index.classnames('bcm-list__item-content', !checkboxes && item.selected && 'selected', { disabled: disabled }) },
113
- treeview && (index$1.h("div", { class: "bcm-list__item-content-collapse-icon", onClick: () => collapseClick() }, isHaveChildren && index$1.h("bcm-icon", { icon: index.classnames('fas fa-caret-' + (item.isSearching || item.open ? 'down' : 'right')) }))),
114
- index$1.h("div", { class: index.classnames('bcm-list__item-content-text', { treeview }), onClick: (e) => itemClick(e) },
115
- checkboxes && (treeview || (!treeview && item.type != 'group')) && (index$1.h("div", { class: "bcm-list__item-content-text-checkbox" },
116
- index$1.h(CheckboxTemplate, { indeterminate: item.indeterminate, checked: item.checked, disabled: item.disabled }))),
117
- index$1.h("span", Object.assign({ class: "bcm-list__item-content-text-inner" }, (item.title && { "title": item.title }), { innerHTML: text })))),
118
- (treeview || !treeview && item.type == "group") && isHaveChildren && (index$1.h("div", { class: "bcm-list__item-childs" }, (item.isSearching || item.open || (!treeview && item.type == "group")) &&
119
- item.items.map((item) => (index$1.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) })))))));
120
- };
121
-
122
- const ListTemplate = ({ highlight, selectAllItem, bcmListContainer, treeview, checkboxes, checkAll, infoFooter, value, totalData, searchFound, variableText, _id, data, width, height, size, searchPlaceholder, minSearchLength, selectedItem, openGroup, checkedItem, onScrollEvent, focusItem, items, searchable, searchIsOnlyChilds, emptyText, emptyIcon, handleTransitionEnd, }) => {
123
- const showSelectAll = !(treeview && searchFound > 0) && !(searchFound > 0);
124
- const setScrollHeight = () => {
125
- const itemHeight = size === 'small' ? 28 : size === 'medium' ? 36 : 48;
126
- const itemCount = searchFound == null ? (treeview ? items.length : totalData) : searchFound;
127
- const scrollHeight = itemCount * itemHeight || 0;
128
- return {
129
- 'min-height': `${scrollHeight}px`,
130
- 'overscroll-behavior': 'none',
131
- 'height': '100%',
132
- 'display': 'flex',
133
- 'flex-direction': 'column',
134
- };
135
- };
136
- return (index$1.h("div", { id: `bcm-list-${_id}`, class: bcmListContainer, style: { '--height': height, '--width': width }, onTransitionEnd: e => handleTransitionEnd(e) },
137
- data && searchable && (index$1.h("section", { class: "bcm-list__container-search" },
138
- index$1.h("bcm-search", { size: size, id: `bcm-list-${_id}-search`, data: data, clearable: true, placeholder: searchPlaceholder, "min-search-length": minSearchLength, searchIsOnlyChilds: searchIsOnlyChilds }))),
139
- index$1.h("main", { onScroll: e => onScrollEvent(e), class: "scrolling", style: { 'overscroll-behavior': 'none' } },
140
- index$1.h("div", { style: setScrollHeight() },
141
- checkAll && searchFound != 0 && items && items.length > 0 && checkboxes && showSelectAll && (index$1.h("section", { class: "bcm-list__container-select-all" },
142
- index$1.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) }))),
143
- items.map((item) => (index$1.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) }))),
144
- (!items || items.length === 0) && searchFound != 0 && (index$1.h("section", { class: "bcm-list__container-no-data" },
145
- index$1.h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
146
- index$1.h("span", { innerHTML: emptyText || 'No data' })))),
147
- searchFound == 0 && (index$1.h("section", { class: "bcm-list__container-no-data" },
148
- index$1.h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
149
- index$1.h("span", { innerHTML: emptyText || 'No Data Found' })))))),
150
- infoFooter && data && data.length > 0 && (index$1.h(InfoFooterTemplate, { selected: value === null || value === void 0 ? void 0 : value.length, total: totalData, found: searchFound, multiple: checkboxes, variableText: variableText }))));
151
- };
152
-
153
- const { state: state$1 } = index$2.createStore({
154
- value: new Map(),
155
- });
156
- const setValue$1 = val => {
157
- const { id, dataSource, options } = val;
158
- 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;
159
- const itemOptions = { size, checkboxes, template, allOpen, highlight, treeview };
160
- const data = {
161
- id: generate.snq(() => id, generate.Generate.UID),
162
- dataSource: dataSource && dataSource.length > 0 && recursive$1(dataSource, itemOptions),
163
- options: {
164
- type,
165
- treeview,
166
- checkboxes,
167
- searchable,
168
- value,
169
- name,
170
- label,
171
- size,
172
- disabled,
173
- readonly,
174
- highlight,
175
- required,
176
- hidden,
177
- fullWidth,
178
- height,
179
- maxHeight,
180
- minHeight,
181
- width,
182
- infoFooter,
183
- variableText,
184
- template,
185
- allOpen,
186
- keyControl,
187
- checkAll,
188
- linkedComponent,
189
- placeholder,
190
- searchPlaceholder,
191
- searchIsOnlyChilds,
192
- clearable,
193
- caption,
194
- noCaption,
195
- captionType,
196
- captionError,
197
- placement,
198
- },
199
- totalItems: (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && calculateTotalItems(dataSource, options.treeview),
200
- totalRoots: dataSource === null || dataSource === void 0 ? void 0 : dataSource.length,
201
- };
202
- state$1.value.set(data.id, data);
203
- };
204
- const recursive$1 = (data, options, parentId, parentIndex = "0.") => {
205
- let recData = [];
206
- if (data && data.length > 0) {
207
- recData = data.map((item, index) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ itemObject: item }, item), options), { parentId: generate.snq(() => parentId, null), open: options.allOpen || item.open || false }), ((options.treeview || (!options.treeview && item.type == 'group')) && item.items && item.items.length > 0
208
- ? { items: generate.snq(() => recursive$1(item.items, options, item.id, `${parentIndex}${index}`), []) }
209
- : { items: [] })), { ct: `${parentIndex}${index}` })));
210
- }
211
- return recData;
212
- };
213
- const removeValue$1 = _id => {
214
- state$1.value.delete(_id);
215
- };
216
- const getValue$1 = id => generate.snq(() => state$1.value.get(id), {});
217
- const calculateTotalItems = (dataSource, treeview) => {
218
- let total = 0;
219
- dataSource.forEach(item => {
220
- if (treeview || (!treeview && item.type != "group")) {
221
- total += 1;
222
- }
223
- if ((treeview || (!treeview && item.type == "group")) && item.items) {
224
- total += calculateTotalItems(item.items, treeview);
225
- }
226
- });
227
- return total;
228
- };
229
- const getData = id => {
230
- let data = [];
231
- const value = getValue$1(id);
232
- if (value) {
233
- const { dataSource } = value;
234
- data = dataSource;
235
- }
236
- return data;
237
- };
238
- const getDataPagination$1 = (id, limit = 3, ids) => {
239
- let data = [];
240
- const value = getValue$1(id);
241
- if (value) {
242
- const { dataSource } = value;
243
- data = !ids ? dataSource.slice(0, limit) : dataSource.filter(item => ids.indexOf(item.id) > -1).slice(0, limit);
244
- }
245
- return data;
246
- };
247
- const openGroup = (id, groupId, items, status) => {
248
- let dataSource;
249
- if (items) {
250
- dataSource = items;
251
- }
252
- else {
253
- const value = getValue$1(id);
254
- dataSource = value.dataSource;
255
- }
256
- if (dataSource) {
257
- dataSource.forEach(item => {
258
- if (status != undefined) {
259
- item.open = status;
260
- }
261
- else if (item.id == groupId) {
262
- item.open = !item.open;
263
- item.isSearching = item.open;
264
- if (!item.open && item.items) {
265
- openGroup(id, groupId, item.items, false);
266
- }
267
- }
268
- else if (item.items) {
269
- openGroup(id, groupId, item.items);
270
- }
271
- });
272
- }
273
- };
274
- const removeOtherTags = (id, ids, items) => {
275
- ids = Array.isArray(ids) ? ids : [ids];
276
- let dataSource;
277
- if (items) {
278
- dataSource = items;
279
- }
280
- else {
281
- const value = getValue$1(id);
282
- dataSource = value.dataSource;
283
- }
284
- if (dataSource) {
285
- ids.forEach(otherTagIds => {
286
- dataSource.forEach(child => {
287
- if (child.id == otherTagIds) {
288
- child.checked = false;
289
- child.itemObject.checked = false;
290
- }
291
- else if (child.items) {
292
- onRemoveItems(id, otherTagIds, child.items);
293
- }
294
- });
295
- });
296
- }
297
- };
298
- const onRemoveItems = (id, itemId, items) => {
299
- if (items) {
300
- items.forEach(item => {
301
- if (item.id == itemId) {
302
- item.checked = false;
303
- item.itemObject.checked = false;
304
- indeterminateStatus(id, item.parentId);
305
- }
306
- else if (item.items) {
307
- onRemoveItems(id, itemId, item.items);
308
- }
309
- });
310
- }
311
- };
312
- const addChecked = (id, ids) => {
313
- const value = getValue$1(id);
314
- if (value) {
315
- ids.forEach(item => {
316
- checkedItem(id, item);
317
- });
318
- }
319
- };
320
- const checkedItem = (id, itemId) => {
321
- findItem(id, itemId);
322
- };
323
- const findItem = (id, itemId, items) => {
324
- itemId = Array.isArray(itemId) ? itemId : [itemId];
325
- let dataSource;
326
- if (items) {
327
- dataSource = items;
328
- }
329
- else {
330
- const value = getValue$1(id);
331
- dataSource = value.dataSource;
332
- }
333
- if (dataSource) {
334
- dataSource.forEach(item => {
335
- if (itemId.includes(item.id)) {
336
- checkedProcess(id, item);
337
- if (item.parentId) {
338
- indeterminateStatus(id, item.parentId);
339
- }
340
- }
341
- else if (item.items) {
342
- findItem(id, itemId, item.items);
343
- }
344
- });
345
- }
346
- };
347
- const checkedProcess = (id, item, status) => {
348
- const value = getValue$1(id);
349
- if (value) {
350
- const treeview = value.options.treeview;
351
- if (item) {
352
- // && !item.hidden => select all bastığımızda hidden olanları seçmemesi içindi
353
- if (treeview || (!treeview && item.type != "group")) {
354
- if (!item.disabled) {
355
- if (status != undefined) {
356
- item.checked = status;
357
- }
358
- else {
359
- item.checked = !item.checked;
360
- }
361
- item.itemObject.checked = item.checked;
362
- item.indeterminate = item.checked ? "determinate" : "uncheck";
363
- }
364
- }
365
- if (item.items) {
366
- item.items.forEach(child => {
367
- checkedProcess(id, child, status == undefined ? item.checked : status);
368
- });
369
- }
370
- }
371
- }
372
- };
373
- const indeterminateStatus = (id, itemId, items) => {
374
- let dataSource;
375
- if (items) {
376
- dataSource = items;
377
- }
378
- else {
379
- const value = getValue$1(id);
380
- dataSource = value.dataSource;
381
- }
382
- if (dataSource) {
383
- dataSource.forEach(item => {
384
- if (item.id == itemId) {
385
- let allChecked = true;
386
- let allUnchecked = true;
387
- if (item.items) {
388
- item.items.map(child => {
389
- (child.checked || child.indeterminate === "indeterminate") && (allUnchecked = false);
390
- !child.checked && (allChecked = false);
391
- });
392
- }
393
- const indeterminateState = !allChecked && !allUnchecked ? "indeterminate" : allChecked ? "determinate" : "uncheck";
394
- item.indeterminate = indeterminateState;
395
- item.checked = indeterminateState == "determinate" ? true : false;
396
- item.itemObject.checked = item.checked;
397
- if (item.parentId) {
398
- indeterminateStatus(id, item.parentId);
399
- }
400
- }
401
- else if (item.items) {
402
- indeterminateStatus(id, itemId, item.items);
403
- }
404
- });
405
- }
406
- };
407
- const filterData = (id, ids, items, searchOtherTag) => {
408
- let checkeds = [];
409
- let visibled = [];
410
- getValue$1(id).isSearchOtherTag = searchOtherTag;
411
- let dataSource;
412
- if (items) {
413
- dataSource = items;
414
- }
415
- else {
416
- const value = getValue$1(id);
417
- dataSource = value.dataSource;
418
- }
419
- if (dataSource) {
420
- dataSource.forEach(item => {
421
- if (ids) {
422
- item.hidden = true;
423
- // const filter = ids.find((find) => find.id === item.id)
424
- var filter;
425
- for (let index = 0; index < ids.length; index++) {
426
- if (ids[index].id === item.id) {
427
- filter = ids[index];
428
- break;
429
- }
430
- }
431
- if (filter) {
432
- item.hidden = false;
433
- if (!getValue$1(id).isSearchOtherTag) {
434
- item.isSearching = true;
435
- }
436
- visibled.push(item);
437
- if (item.checked) {
438
- checkeds.push(item);
439
- }
440
- if (filter.items) {
441
- const { checkedItems, visibledItems } = filterData(id, filter.items, item.items, searchOtherTag);
442
- if (checkedItems) {
443
- checkeds = [...new Set([...checkeds, ...checkedItems])];
444
- }
445
- if (visibledItems) {
446
- visibled = [...new Set([...visibled, ...visibledItems])];
447
- }
448
- }
449
- }
450
- }
451
- else {
452
- item.hidden = false;
453
- if (item.items) {
454
- filterData(id, null, item.items);
455
- }
456
- visibled.push(item);
457
- item.isSearching = false;
458
- }
459
- });
460
- }
461
- return { checkedItems: checkeds !== null && checkeds !== void 0 ? checkeds : [], visibledItems: visibled !== null && visibled !== void 0 ? visibled : [] };
462
- };
463
- const getSelected = (id, items) => {
464
- let dataSource;
465
- let selected = null;
466
- if (items) {
467
- dataSource = items;
468
- }
469
- else {
470
- const value = getValue$1(id);
471
- dataSource = value.dataSource;
472
- }
473
- if (dataSource) {
474
- dataSource.forEach(item => {
475
- if (item.selected) {
476
- selected = item.itemObject;
477
- }
478
- else if (item.items) {
479
- const found = getSelected(id, item.items);
480
- if (found) {
481
- selected = found;
482
- }
483
- }
484
- });
485
- }
486
- return selected;
487
- };
488
- const getCheckedList = (id, items) => {
489
- let dataSource;
490
- let checkedList = [];
491
- let nestedResult = [];
492
- if (items) {
493
- dataSource = items;
494
- }
495
- else {
496
- const value = getValue$1(id);
497
- dataSource = value.dataSource;
498
- }
499
- if (dataSource) {
500
- dataSource.forEach(item => {
501
- var _a;
502
- const newItem = Object.assign(Object.assign({}, item.itemObject), { ct: item.ct });
503
- let foundChild = [];
504
- let foundItem = [];
505
- if (item.checked) {
506
- checkedList.push(newItem);
507
- foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
508
- }
509
- if (item.items) {
510
- const found = getCheckedList(id, item.items);
511
- if (((_a = found === null || found === void 0 ? void 0 : found.checkedList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
512
- checkedList = [...checkedList, ...found.checkedList];
513
- }
514
- if (found.nestedResult.length > 0) {
515
- foundChild = found.nestedResult;
516
- }
517
- }
518
- if (foundChild.length > 0) {
519
- if (foundItem.length == 0) {
520
- foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
521
- }
522
- foundItem[0].items = foundChild;
523
- nestedResult.push(foundItem[0]);
524
- }
525
- else {
526
- if (foundItem.length > 0) {
527
- foundItem[0].items = foundChild;
528
- nestedResult.push(foundItem[0]);
529
- }
530
- }
531
- });
532
- }
533
- return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
534
- };
535
- const selectedItem = (id, itemId, items) => {
536
- let dataSource;
537
- let selected = [];
538
- if (items) {
539
- dataSource = items;
540
- }
541
- else {
542
- const value = getValue$1(id);
543
- dataSource = value.dataSource;
544
- }
545
- if (dataSource) {
546
- dataSource.forEach(item => {
547
- if (itemId) {
548
- if (item.id == itemId) {
549
- // if (!item.selected){
550
- item.selected = true;
551
- item.itemObject.selected = item.selected;
552
- // }
553
- }
554
- else {
555
- if (item.selected) {
556
- item.selected = false;
557
- item.itemObject.selected = item.selected;
558
- }
559
- }
560
- }
561
- if (item.items) {
562
- const found = selectedItem(id, itemId, item.items);
563
- if ((found === null || found === void 0 ? void 0 : found.length) > 0) {
564
- selected = [...selected, ...found];
565
- }
566
- }
567
- if (item.selected) {
568
- selected.push(item.itemObject);
569
- }
570
- });
571
- }
572
- return selected && selected.length > 0 ? selected : null;
573
- };
574
- const setClear = (id, items) => {
575
- let dataSource;
576
- if (items) {
577
- dataSource = items;
578
- }
579
- else {
580
- const value = getValue$1(id);
581
- dataSource = value.dataSource;
582
- }
583
- if (dataSource) {
584
- dataSource.forEach(item => {
585
- var _a, _b, _c;
586
- item.checked && (item.checked = false);
587
- item.selected && (item.selected = false);
588
- item.indeterminate && (item.indeterminate = "uncheck");
589
- ((_a = item.itemObject) === null || _a === void 0 ? void 0 : _a.checked) && (item.itemObject.checked = false);
590
- ((_b = item.itemObject) === null || _b === void 0 ? void 0 : _b.selected) && (item.itemObject.selected = false);
591
- ((_c = item.itemObject) === null || _c === void 0 ? void 0 : _c.indeterminate) && (item.itemObject.indeterminate = "uncheck");
592
- if (item.items) {
593
- setClear(id, item.items);
594
- }
595
- });
596
- }
597
- };
598
- const selectAll = (id, status) => {
599
- const dataSource = getValue$1(id).dataSource;
600
- if (dataSource) {
601
- dataSource.forEach(item => {
602
- checkedProcess(id, item, status);
603
- });
604
- }
605
- };
606
- const updateOptions = (id, options) => {
607
- Object.keys(getValue$1(id).options).forEach(key => {
608
- getValue$1(id).options[key] = options[key];
609
- });
610
- };
611
- const removeState = id => {
612
- return Promise.resolve(state$1.value.delete(id));
613
- };
614
- const listState = {
615
- setValue: setValue$1,
616
- removeValue: removeValue$1,
617
- getValue: getValue$1,
618
- getData,
619
- getDataPagination: getDataPagination$1,
620
- openGroup,
621
- checkedItem,
622
- filterData,
623
- getSelected,
624
- getCheckedList,
625
- selectedItem,
626
- addChecked,
627
- setClear,
628
- selectAll,
629
- removeOtherTags,
630
- onRemoveItems,
631
- updateOptions,
632
- removeState,
633
- };
634
-
635
- class KeyControl {
636
- constructor(keyCode, element, elementName, childElementName) {
637
- this.elementName = '';
638
- this.childElementName = '';
639
- this.keyCode = keyCode;
640
- this.element = element;
641
- this.elementName = elementName;
642
- this.childElementName = childElementName;
643
- }
644
- getKeyCode() {
645
- return this.keyCode;
646
- }
647
- getElementName() {
648
- return this.elementName;
649
- }
650
- getChildElementName() {
651
- return this.childElementName;
652
- }
653
- getFocusedElementName() {
654
- return this.getElementName() + '.focused';
655
- }
656
- getFocusedElement() {
657
- return this.element.querySelectorAll(this.getFocusedElementName())[0] || null;
658
- }
659
- getFirstElement() {
660
- return this.element.querySelectorAll(this.getElementName())[0] || null;
661
- }
662
- getNextElement() {
663
- var _a;
664
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) || this.getFirstElement();
665
- }
666
- getPreviousElement() {
667
- var _a;
668
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) || this.getFirstElement();
669
- }
670
- getChildElement() {
671
- var _a;
672
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName())[0]) || null;
673
- }
674
- getParentElement(element) {
675
- if (element && element) {
676
- const isRootElement = element && element.attributes['data-isroot'];
677
- if (isRootElement) {
678
- return element;
679
- }
680
- return this.getParentElement(element.parentNode);
681
- }
682
- }
683
- focusElementIsOpen() {
684
- var _a;
685
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.classList.contains('bcm-list__item--open')) || false;
686
- }
687
- isRootElement() {
688
- var _a;
689
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName()).length) > 0;
690
- }
691
- isRootElementIsOpen() {
692
- return this.getFocusedElement().classList.contains('bcm-list__item--open');
693
- }
694
- getFocusedChildElement() {
695
- var _a;
696
- return ((_a = this.getChildElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.focused')[0]) || null;
697
- }
698
- isLastElement() {
699
- var _a;
700
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) === null;
701
- }
702
- focusParentElementFirstChild() {
703
- var _a, _b;
704
- return this.setFocus((_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.firstChild);
705
- }
706
- isFirstElement() {
707
- var _a;
708
- return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null;
709
- }
710
- focusRootElement() {
711
- var _a, _b, _c;
712
- 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);
713
- }
714
- nextRootElement() {
715
- var _a, _b, _c;
716
- 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);
717
- }
718
- findFocusElementParent() {
719
- return this.getFocusedElement().parentNode.querySelectorAll('.bcm-list__item--open');
720
- }
721
- getLastElement() {
722
- return this.element.querySelectorAll(this.getElementName())[this.element.querySelectorAll(this.getElementName()).length - 1] || null;
723
- }
724
- setFocus(element) {
725
- element.focus();
726
- }
727
- }
728
-
729
- class ListKeyControl extends KeyControl {
730
- constructor(keyCode, element, treeview, checkBoxes) {
731
- super(keyCode, element, '.bcm-list__item', '.bcm-list__item-childs');
732
- this.isTreeview = false;
733
- this.isCheckBoxes = false;
734
- this.isTreeview = treeview;
735
- this.isCheckBoxes = checkBoxes;
736
- }
737
- keyUpControl() {
738
- if (this.isTreeview) {
739
- this.keyUpTreeview();
740
- }
741
- else {
742
- if (this.isFirstElement()) {
743
- this.setFocus(this.getLastElement());
744
- }
745
- else {
746
- this.setFocus(this.getPreviousElement());
747
- }
748
- }
749
- }
750
- keyDownTreeView() {
751
- var _a;
752
- if (this.isTreeview) {
753
- if (this.isRootElement() && this.isRootElementIsOpen()) {
754
- const childs = this.getChildElement();
755
- if (childs) {
756
- this.setFocus(childs.firstChild);
757
- }
758
- }
759
- else {
760
- if (this.isLastElement() && this.getParentElement(this.getFocusedElement())) {
761
- this.setFocus((_a = this.getParentElement(this.getFocusedElement())) === null || _a === void 0 ? void 0 : _a.nextElementSibling);
762
- }
763
- else {
764
- this.setFocus(this.getNextElement());
765
- }
766
- }
767
- }
768
- }
769
- keyUpTreeview() {
770
- if (this.isFirstElement()) {
771
- const parent = this.getParentElement(this.getFocusedElement());
772
- this.setFocus(parent);
773
- }
774
- else {
775
- const previousElement = this.getPreviousElement();
776
- if (previousElement) {
777
- if (previousElement.classList.contains('bcm-list__item--open')) {
778
- const getChildElement = previousElement.querySelectorAll(this.getChildElementName())[0];
779
- console.log({ getChildElement });
780
- this.setFocus(getChildElement.lastChild);
781
- }
782
- else {
783
- this.setFocus(previousElement);
784
- }
785
- }
786
- }
787
- }
788
- keyDownControl() {
789
- if (this.isTreeview) {
790
- this.keyDownTreeView();
791
- }
792
- else {
793
- if (this.isLastElement()) {
794
- this.setFocus(this.getFirstElement());
795
- }
796
- else {
797
- this.setFocus(this.getNextElement());
798
- }
799
- }
800
- }
801
- keyRightControl() {
802
- if (this.isTreeview) {
803
- if (!this.isRootElementIsOpen() && this.isRootElement()) {
804
- const { id } = this.getFocusedElement();
805
- this.openGroup(id);
806
- }
807
- }
808
- }
809
- keyLeftControl() {
810
- if (this.isTreeview) {
811
- if (this.isRootElementIsOpen() && this.isRootElement()) {
812
- const { id } = this.getFocusedElement();
813
- this.openGroup(id);
814
- }
815
- }
816
- }
817
- keyEnterControl() { }
818
- keySpaceControl() {
819
- if (this.isCheckBoxes) {
820
- const { id } = this.getFocusedElement();
821
- this.checkedItem(id);
822
- }
823
- }
824
- keyDown() {
825
- switch (this.getKeyCode()) {
826
- case bcm.Bcm.KeyCode.up:
827
- this.keyUpControl();
828
- break;
829
- case bcm.Bcm.KeyCode.down:
830
- this.keyDownControl();
831
- break;
832
- case bcm.Bcm.KeyCode.left:
833
- this.keyLeftControl();
834
- break;
835
- case bcm.Bcm.KeyCode.right:
836
- this.keyRightControl();
837
- break;
838
- case bcm.Bcm.KeyCode.enter:
839
- this.keyEnterControl();
840
- break;
841
- case bcm.Bcm.KeyCode.space:
842
- this.keySpaceControl();
843
- break;
844
- }
845
- }
846
- keyUp() { }
847
- }
848
-
849
- 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\"); @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}*{box-sizing:border-box}.bcm-caption-area{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-size:12px;line-height:calc(12px + 8px);color:var(--bcm-new-ds-color-slate-400);display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;flex-wrap:nowrap;margin-top:2px}.bcm-caption-area__text{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.default{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.info{color:var(--bcm-new-ds-color-blue-500)}.bcm-caption-area__text.success{color:var(--bcm-new-ds-color-emerald-500)}.bcm-caption-area__text.warning{color:var(--bcm-new-ds-color-amber-500)}.bcm-caption-area__text.error{color:var(--bcm-new-ds-color-red-500)}.bcm-caption-area__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-caption-area__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-caption-area__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 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{scroll-behavior:smooth;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{opacity:0;visibility:hidden;position:absolute;top:0;left:0;height:0;width:0;transform:translateY(10%);z-index:10800;transition:visibility 0s linear 400ms, opacity 100ms, transform 200ms}.bcm-list__container.bcm-list__type-linked-component.bcm-list--top,.bcm-list__container.bcm-list__type-select.bcm-list--top,.bcm-list__container.bcm-list__type-autocomplete.bcm-list--top{transform:translateY(-10%)}.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{opacity:1;transform:translateY(0);visibility:visible;transition:visibility 0s linear 0s, opacity 100ms, transform 100ms}.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:var(--bcm-color-grey-6)}.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:var(--bcm-color-grey-6)}.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-600);background-color:var(--bcm-new-ds-color-slate-50);transition:background-color 0.2s ease}.bcm-list__item-content.disabled{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);user-select:none;cursor:not-allowed}.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){color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item-content:hover:not(.disabled){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item-content:active:not(.disabled){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--readonly:focus>.bcm-list__item-content:not(.disabled),.bcm-list__item--readonly.focused>.bcm-list__item-content:not(.disabled){color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content{color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content:hover,.bcm-list__item--readonly>.bcm-list__item-content:focus{color:var(--bcm-color-grey-7)}.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}";
850
-
851
- var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
852
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
853
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
854
- r = Reflect.decorate(decorators, target, key, desc);
855
- else
856
- for (var i = decorators.length - 1; i >= 0; i--)
857
- if (d = decorators[i])
858
- r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
859
- return c > 3 && r && Object.defineProperty(target, key, r), r;
860
- };
861
- const BcmList = class {
862
- constructor(hostRef) {
863
- index$1.registerInstance(this, hostRef);
864
- this.bcmChecklist = index$1.createEvent(this, "bcm-checklist", 7);
865
- this.bcmSelected = index$1.createEvent(this, "bcm-selected", 7);
866
- this.change = index$1.createEvent(this, "bcm-change", 7);
867
- this.open = index$1.createEvent(this, "bcm-open", 3);
868
- this.close = index$1.createEvent(this, "bcm-close", 3);
869
- this.listClose = index$1.createEvent(this, "bcm-list-close", 7);
870
- this.listOpen = index$1.createEvent(this, "bcm-list-open", 7);
871
- this.debounce = null;
872
- this.debounceHandler = generate.Generate.debounceInput(() => this.listenResize(), 300, false);
873
- this._id = generate.Generate.UID();
874
- this.type = bcm.Bcm$1.ListType.listbox;
875
- this.treeview = false;
876
- this.checkboxes = false;
877
- this.searchable = false;
878
- this.value = null;
879
- this.inputText = undefined;
880
- this.name = undefined;
881
- this.label = undefined;
882
- this.size = bcm.Bcm$1.Size.medium;
883
- this.disabled = false;
884
- this.readonly = false;
885
- this.highlight = false;
886
- this.highlightText = undefined;
887
- this.required = false;
888
- this.hidden = false;
889
- this.fullWidth = false;
890
- this.height = "256px";
891
- this.maxHeight = "500px";
892
- this.minHeight = "150px";
893
- this.width = "256px";
894
- this.tooltip = undefined;
895
- this.infoFooter = false;
896
- this.variableText = "item";
897
- this.template = undefined;
898
- this.allOpen = false;
899
- this.keyControl = false;
900
- this.checkAll = true;
901
- this.stopDeepClean = false;
902
- this.openIntersecting = false;
903
- this.linkedComponent = undefined;
904
- this.isOpen = false;
905
- this.calculatedViewport = false;
906
- this.isSelectedOther = false;
907
- this.isHaveOtherTag = false;
908
- this.placeholder = "Choose an option";
909
- this.searchPlaceholder = "Search";
910
- this.searchIsOnlyChilds = false;
911
- this.minSearchLength = 2;
912
- this.clearable = false;
913
- this.caption = undefined;
914
- this.noCaption = false;
915
- this.captionType = bcm.Bcm$1.Status.default;
916
- this.captionError = undefined;
917
- this.emptyText = undefined;
918
- this.emptyIcon = "fad fa-folder-open";
919
- this.captionCache = undefined;
920
- this.captionTypeCache = undefined;
921
- this.tick = {};
922
- this.totalData = 0;
923
- this.totalRootData = 0;
924
- this.limit = 20;
925
- this.searchGetParents = undefined;
926
- this.searchResultLimit = 20;
927
- this.searchFound = null;
928
- this.returnFilterData = {};
929
- this.returnOtherData = {};
930
- this.options = {
931
- rootMargin: "30px",
932
- };
933
- this.tagContainerWidth = 0;
934
- this.selectAllItem = {
935
- id: "select-all",
936
- text: "Select All",
937
- value: "select-all",
938
- checked: false,
939
- disabled: false,
940
- icon: "",
941
- status: bcm.Bcm$1.Status.default,
942
- indeterminate: "uncheck",
943
- };
944
- this.placement = bcm.Bcm$1.Placement["bottom-start"];
945
- this.disableChangeEvent = false;
946
- this.data = [];
947
- window.addEventListener("scroll", this.handleWheel.bind(this), true);
948
- window.addEventListener("wheel", this.handleWheel.bind(this), true);
949
- window.addEventListener("resize", this.handleResize.bind(this), true);
950
- }
951
- connectedCallback() {
952
- if (this.height != "256px") {
953
- if (this.height.indexOf("px") > -1) {
954
- this.limit = Math.floor(+this.height.replace("px", "") / 10);
955
- }
956
- else {
957
- this.limit = Math.floor(+(window.innerHeight / 10));
958
- }
959
- this.searchResultLimit = this.limit;
960
- this.markForCheck();
961
- }
962
- const checkElementWithDom = document.querySelectorAll(`#bcm-list-${this._id}`);
963
- (checkElementWithDom === null || checkElementWithDom === void 0 ? void 0 : checkElementWithDom.length) > 1 && checkElementWithDom.forEach((item, index) => index > 0 && item.remove());
964
- }
965
- componentWillRender() {
966
- this.calculateLocation();
967
- }
968
- componentShouldUpdate(newVal, oldVal, propName) {
969
- if (Object.keys(this.getOptions()).indexOf(propName) > -1 && newVal !== oldVal) {
970
- this.updateOptions();
971
- }
972
- }
973
- get containerWidth() {
974
- var _a, _b;
975
- return (_b = (_a = this.el) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width;
976
- }
977
- get tagCount() {
978
- return this.containerWidth > 0 ? Math.floor(+(this.containerWidth - 100) / 85) : 0;
979
- }
980
- get tagData() {
981
- return generate.snq(() => {
982
- var _a;
983
- return (_a = this.value) === null || _a === void 0 ? void 0 : _a.map(item => ({
984
- value: item.id,
985
- label: stringHelper.StringHelper.textLimitter(item.text, 7),
986
- text: item.tooltipMessage || item.tagTitle || item.text,
987
- }));
988
- }, []);
989
- }
990
- async componentDidLoad() {
991
- await this.initState();
992
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
993
- const list = this.el.querySelector(`#bcm-list-${this._id}`);
994
- if (list) {
995
- document.body.appendChild(list);
996
- }
997
- }
998
- }
999
- disconnectedCallback() {
1000
- this.isOpen = false;
1001
- if (this.stopDeepClean)
1002
- return;
1003
- listState.removeState(this._id);
1004
- this.el.innerHTML = "";
1005
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1006
- const list = document.querySelectorAll(`#bcm-list-${this._id}`);
1007
- if (list === null || list === void 0 ? void 0 : list.length) {
1008
- list.forEach(item => item.remove());
1009
- this.el.remove();
1010
- }
1011
- }
1012
- }
1013
- watchId(_, oldVal) {
1014
- // console.info('Changed component id:', oldVal + ' -> ' + newVal);
1015
- listState.removeState(oldVal);
1016
- this.initState();
1017
- }
1018
- handleValueChange(newVal, oldVal) {
1019
- var _a;
1020
- if (generate.Generate.objectIsEmpty(this.returnFilterData)) {
1021
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1022
- }
1023
- if (this.checkboxes) {
1024
- if (!validators.Validators.compareTwoArrayIsSame(newVal, oldVal)) {
1025
- this.bcmChecklist.emit(this.value);
1026
- !this.disableChangeEvent && this.change.emit(this.value);
1027
- }
1028
- }
1029
- else {
1030
- if ((newVal === null || newVal === void 0 ? void 0 : newVal.id) != (oldVal === null || oldVal === void 0 ? void 0 : oldVal.id)) {
1031
- !this.disableChangeEvent && this.change.emit(this.value);
1032
- }
1033
- }
1034
- }
1035
- watchReturnFilterData(newVal) {
1036
- var _a;
1037
- const { checkedItems, visibledItems } = newVal;
1038
- if (checkedItems && visibledItems) {
1039
- this.handleIndeterminate(checkedItems.length, visibledItems.length);
1040
- }
1041
- else {
1042
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1043
- }
1044
- }
1045
- async handleOpen() {
1046
- if (this.isOpen) {
1047
- this.open.emit();
1048
- this.calculateLocation();
1049
- this.onSelectSearch();
1050
- }
1051
- else {
1052
- this.listScrollToTop();
1053
- this.close.emit();
1054
- this.listClose.emit();
1055
- await utils.delay(100);
1056
- this.unSelectOther();
1057
- }
1058
- }
1059
- listScrollToTop() {
1060
- const list = document.querySelector(`#bcm-list-${this._id}`);
1061
- if (list) {
1062
- list.querySelector(".scrolling").scrollTop = 0;
1063
- }
1064
- }
1065
- async dataChanged(newValue, oldValue) {
1066
- if (!validators.Validators.compareTwoArrayIsSame(newValue, oldValue)) {
1067
- await this.initState();
1068
- }
1069
- }
1070
- isIntersecting(e) {
1071
- const target = e === null || e === void 0 ? void 0 : e.target;
1072
- if (target && target.id === this._id) {
1073
- this.listenResize();
1074
- }
1075
- }
1076
- handleSlotItems(e) {
1077
- var _a;
1078
- if (((_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.length) > 0) {
1079
- this.data = e.detail;
1080
- }
1081
- }
1082
- handleChange(e) {
1083
- if (e.target.id == `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
1084
- e.stopImmediatePropagation();
1085
- }
1086
- }
1087
- handleResize() {
1088
- this.calculateLocation();
1089
- this.debounceHandler();
1090
- }
1091
- handleWheel(event) {
1092
- if (this.isOpen) {
1093
- const list = document.querySelector(`#bcm-list-${this._id}`);
1094
- const isClickInside = list && generate.Generate.findEventPath(event, list);
1095
- if (isClickInside) {
1096
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1097
- this.calculateLocation();
1098
- }
1099
- }
1100
- else {
1101
- this.hide();
1102
- }
1103
- }
1104
- }
1105
- clearAutocomplete() {
1106
- if (this.type == "autocomplete") {
1107
- const autocompleteInput = this.getAutoCompleteInput();
1108
- if (autocompleteInput) {
1109
- autocompleteInput.handleClear(false);
1110
- }
1111
- }
1112
- }
1113
- async handleSelectOtherTag(e) {
1114
- if (this.disabled)
1115
- return;
1116
- const { id, checked } = e.detail;
1117
- this.isSelectedOther = checked;
1118
- if (id) {
1119
- checked ? this.filterOtherList(id) : this.unSelectOther();
1120
- this.isOpen = true;
1121
- }
1122
- }
1123
- async handleDeleteTag(e) {
1124
- var _a;
1125
- if (this.disabled)
1126
- return;
1127
- const { id } = e.detail;
1128
- this.isSelectedOther && this.unSelectOther();
1129
- Array.isArray(id) ? listState.removeOtherTags(this._id, id) : listState.checkedItem(this._id, id);
1130
- this.value = (await this.getCheckedList()).checkedList;
1131
- this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
1132
- }
1133
- async handleSelectTag(_) {
1134
- if (this.disabled)
1135
- return;
1136
- this.clearAutocomplete();
1137
- this.onSelectSearch();
1138
- this.unSelectOther();
1139
- }
1140
- handleClick(event) {
1141
- var _a;
1142
- if (this.disabled)
1143
- return;
1144
- const list = document.querySelector(`#bcm-list-${this._id}`);
1145
- const isClickInside = generate.Generate.findEventPath(event, this.el) || (list && generate.Generate.findEventPath(event, list));
1146
- if (isClickInside) {
1147
- if (this.debounce !== null) {
1148
- event.preventDefault();
1149
- event.stopPropagation();
1150
- clearTimeout(this.debounce);
1151
- this.debounce = null;
1152
- }
1153
- this.debounce = setTimeout(() => {
1154
- this.debounce = null;
1155
- }, 300);
1156
- }
1157
- if (!isClickInside) {
1158
- if (this.type == "autocomplete") {
1159
- const autocompleteInput = this.getAutoCompleteInput();
1160
- if (autocompleteInput) {
1161
- if (this.checkboxes) {
1162
- autocompleteInput.setValue("");
1163
- }
1164
- else {
1165
- autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
1166
- }
1167
- }
1168
- }
1169
- }
1170
- const clickToTag = generate.Generate.findEventPathWithKey(event, "className", ["bcm-tag"]);
1171
- const clickToOtherTag = generate.Generate.findEventPathWithKey(event, "className", ["bcm-tag bcm-tag--other"]);
1172
- const clickToSelect = generate.Generate.findEventPathWithKey(event, "id", [`bcm-list-input-${this._id}`, `bcm-list-label-${this._id}`]);
1173
- const clickToTagDismiss = generate.Generate.findEventPathWithKey(event, "className", ["right close-button"]);
1174
- if (clickToSelect && !clickToTagDismiss && this.type != "autocomplete") {
1175
- this.isOpen = clickToTag || clickToOtherTag ? true : !this.isOpen;
1176
- }
1177
- if (list) {
1178
- if (this.isOpen) {
1179
- if (!list.contains(event.target) && !this.el.contains(event.target)) {
1180
- this.isOpen = false;
1181
- // this.unSelectOther()
1182
- }
1183
- }
1184
- }
1185
- }
1186
- bcmOnSearchClear(event) {
1187
- var _a, _b;
1188
- if (this.type == "autocomplete") {
1189
- 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`) {
1190
- if (event.detail) {
1191
- this.setClear();
1192
- }
1193
- }
1194
- }
1195
- }
1196
- bcmOnSearch(event) {
1197
- var _a, _b, _c, _d, _e, _f;
1198
- 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`) {
1199
- this.searchGetParents = generate.snq(() => { var _a; return (_a = event.detail) === null || _a === void 0 ? void 0 : _a.parentIndex; }, null);
1200
- this.searchResultLimit = 10;
1201
- 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;
1202
- this.returnFilterData = listState.filterData(this._id, (_e = event.detail) === null || _e === void 0 ? void 0 : _e.nestedResult);
1203
- if (this.searchFound > 0 && this.highlight) {
1204
- this.highlightText = (_f = event.detail) === null || _f === void 0 ? void 0 : _f.value;
1205
- }
1206
- if (this.type == "autocomplete") {
1207
- this.isOpen = true;
1208
- }
1209
- if (!event.detail.result) {
1210
- if (this.type == "autocomplete") {
1211
- this.isOpen = false;
1212
- }
1213
- else {
1214
- this.returnFilterData = {};
1215
- listState.filterData(this._id, null);
1216
- }
1217
- // this.isSelectedOther = false
1218
- this.searchResultLimit = null;
1219
- this.highlightText = null;
1220
- }
1221
- this.markForCheck();
1222
- }
1223
- }
1224
- //keyboard navigation
1225
- handleKeyDown(ev) {
1226
- const keycode = ev.keyCode || ev.which;
1227
- if (keycode === bcm.Bcm$1.KeyCode.escape) {
1228
- if (this.isOpen) {
1229
- this.isOpen = false;
1230
- ev.preventDefault();
1231
- ev.stopPropagation();
1232
- ev.stopImmediatePropagation();
1233
- }
1234
- }
1235
- if (this.keyControl) {
1236
- const keyboard = new ListKeyControl(keycode, this.el, this.treeview, this.checkboxes);
1237
- keyboard.openGroup = openGroupId => {
1238
- this.openGroup(openGroupId);
1239
- };
1240
- keyboard.checkedItem = checkedItemId => {
1241
- this.checkedItem(checkedItemId);
1242
- };
1243
- keyboard.keyDown();
1244
- }
1245
- }
1246
- handleKeyUp(ev) {
1247
- if (this.keyControl) {
1248
- const focusedList = generate.Generate.findEventPath(ev, this.el);
1249
- if (focusedList) {
1250
- const list = document.getElementById(`bcm-list-${this._id}`);
1251
- if (list) {
1252
- const items = list.querySelectorAll(".bcm-list__item.focused");
1253
- if (items.length > 0) {
1254
- const main = list.querySelector("main");
1255
- const itemHeight = items[0].offsetHeight;
1256
- const listHeight = main.offsetHeight;
1257
- const itemTop = items[0].offsetTop;
1258
- if (itemTop > listHeight) {
1259
- main.scrollTop = itemTop - listHeight / 2 + itemHeight / 2;
1260
- }
1261
- if (itemTop < listHeight) {
1262
- main.scrollTop = itemTop - listHeight / 2 - itemHeight / 2;
1263
- }
1264
- }
1265
- }
1266
- }
1267
- }
1268
- }
1269
- async set(data) {
1270
- if (data) {
1271
- if (Array.isArray(data)) {
1272
- this.addChecked(data);
1273
- }
1274
- if (typeof data === "string" || typeof data === "number") {
1275
- this.selectedItem(data);
1276
- }
1277
- }
1278
- else {
1279
- this.setClear();
1280
- }
1281
- }
1282
- async get() {
1283
- var _a, _b;
1284
- 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;
1285
- }
1286
- async getCheckedList() {
1287
- return Promise.resolve(listState.getCheckedList(this._id));
1288
- }
1289
- async getSelected() {
1290
- return Promise.resolve(listState.getSelected(this._id));
1291
- }
1292
- async getValue() {
1293
- return Promise.resolve(this.value);
1294
- }
1295
- async addChecked(ids = [], save = false, emit = true) {
1296
- if (ids && ids.length > 0) {
1297
- if (!save) {
1298
- listState.setClear(this._id);
1299
- await utils.delay(10);
1300
- }
1301
- await listState.addChecked(this._id, ids);
1302
- await utils.delay(10);
1303
- emit && (this.value = (await this.getCheckedList()).checkedList);
1304
- this.markForCheck();
1305
- }
1306
- return Promise.resolve(this.value);
1307
- }
1308
- async selected(id) {
1309
- if (id) {
1310
- return Promise.resolve(await this.selectedItem(id));
1311
- }
1312
- return false;
1313
- }
1314
- async setClear(e) {
1315
- listState.setClear(this._id);
1316
- this.value = null;
1317
- this.inputText = "";
1318
- this.isOpen = false;
1319
- this.selectAllItem.indeterminate = "uncheck";
1320
- this.markForCheck();
1321
- if (e) {
1322
- e.stopPropagation();
1323
- e.preventDefault();
1324
- }
1325
- await utils.delay(10);
1326
- return Promise.resolve();
1327
- }
1328
- async resetCaption() {
1329
- await utils.delay(10);
1330
- this.caption = this.captionCache;
1331
- this.captionType = this.captionTypeCache;
1332
- this.captionError = null;
1333
- await utils.delay(10);
1334
- return Promise.resolve();
1335
- }
1336
- async show() {
1337
- this.isOpen = true;
1338
- return Promise.resolve();
1339
- }
1340
- async hide() {
1341
- this.isOpen = false;
1342
- return Promise.resolve();
1343
- }
1344
- updateOptions() {
1345
- listState.updateOptions(this._id, this);
1346
- }
1347
- handleIndeterminate(checkeds, total) {
1348
- 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 });
1349
- }
1350
- listenResize() {
1351
- this.calculateLocation();
1352
- this.markForCheck();
1353
- }
1354
- async unSelectOther() {
1355
- await this.onClearSearch();
1356
- this.isSelectedOther = false;
1357
- this.searchFound = null;
1358
- this.returnFilterData = {};
1359
- listState.filterData(this._id, null);
1360
- await utils.delay(10);
1361
- return Promise.resolve();
1362
- }
1363
- async onClearSearch() {
1364
- const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
1365
- if (searchInput) {
1366
- await searchInput.handleClear();
1367
- }
1368
- return Promise.resolve();
1369
- }
1370
- async onSelectSearch() {
1371
- const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
1372
- if (searchInput) {
1373
- await utils.delay(100);
1374
- searchInput.onBcmFocus();
1375
- searchInput.onBcmSelect();
1376
- }
1377
- }
1378
- async filterOtherList(ids) {
1379
- const checklist = (await this.getCheckedList()).nestedResult;
1380
- const filter = generate.Generate.convertIdsToNestedData(ids, checklist);
1381
- this.returnFilterData = await listState.filterData(this._id, filter, null, true);
1382
- this.searchFound = (ids === null || ids === void 0 ? void 0 : ids.length) || 0;
1383
- this.limit = 500;
1384
- this.searchGetParents = null;
1385
- await utils.delay(1000);
1386
- this.markForCheck();
1387
- }
1388
- async initState() {
1389
- var _a, _b, _c;
1390
- this.onClearSearch();
1391
- await listState.setValue({
1392
- id: this._id,
1393
- dataSource: this.data && generate.snq(() => (typeof this.data == "string" ? JSON.parse(this.data) : this.data), []),
1394
- options: this,
1395
- });
1396
- const { totalRoots, totalItems } = listState.getValue(this._id);
1397
- this.totalData = totalItems;
1398
- this.totalRootData = totalRoots;
1399
- this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id) ? listState.selectedItem(this._id)[0] : null;
1400
- if (!this.checkboxes) {
1401
- this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
1402
- }
1403
- // checkli olan subparentların indeterminate kontrolü için
1404
- if (this.checkboxes && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) > 0) {
1405
- const checkedIDs = [];
1406
- this.value.forEach(item => {
1407
- if (!item.items || item.items.length === 0) {
1408
- checkedIDs.push(item.id);
1409
- }
1410
- });
1411
- await this.addChecked(checkedIDs, false, false);
1412
- }
1413
- await this.handleIndeterminate((_c = this.value) === null || _c === void 0 ? void 0 : _c.length, this.totalData);
1414
- await this.markForCheck();
1415
- }
1416
- async markForCheck() {
1417
- await utils.delay(10);
1418
- this.tick = generate.Generate.UID();
1419
- }
1420
- getOptions() {
1421
- return generate.snq(() => listState.getValue(this._id).options, {});
1422
- }
1423
- getItems() {
1424
- if (this.isSelectedOther) {
1425
- return this.returnFilterData["checkedItems"];
1426
- }
1427
- return generate.snq(() => listState.getData(this._id), []);
1428
- }
1429
- getLimitedItems(ids) {
1430
- return generate.snq(() => listState.getDataPagination(this._id, this.searchResultLimit || this.limit, ids), []);
1431
- }
1432
- openGroup(parentId) {
1433
- listState.openGroup(this._id, parentId);
1434
- this.markForCheck();
1435
- }
1436
- focusItem(e) {
1437
- if (e.target.classList.contains("bcm-list__item")) {
1438
- const item = e.target;
1439
- const list = document.getElementById(`bcm-list-${this._id}`);
1440
- if (list) {
1441
- const items = list.querySelectorAll(".bcm-list__item");
1442
- if (items.length > 0) {
1443
- const selectedItem = list.querySelector(".bcm-list__item.focused");
1444
- if (selectedItem) {
1445
- selectedItem.classList.remove("focused");
1446
- }
1447
- item.classList.add("focused");
1448
- }
1449
- }
1450
- }
1451
- }
1452
- async selectedItem(itemId) {
1453
- var _a;
1454
- if (!this.checkboxes) {
1455
- this.value = listState.selectedItem(this._id, itemId) ? listState.selectedItem(this._id, itemId)[0] : null;
1456
- this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
1457
- this.isOpen = false;
1458
- this.markForCheck();
1459
- if (this.type == "autocomplete" && this.value) {
1460
- // await delay(100)
1461
- // this.resetCaption()
1462
- const autocompleteInput = this.getAutoCompleteInput();
1463
- if (autocompleteInput) {
1464
- setTimeout(() => {
1465
- var _a;
1466
- autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
1467
- this.isOpen = false;
1468
- }, 100);
1469
- }
1470
- }
1471
- }
1472
- return Promise.resolve(this.value);
1473
- }
1474
- async checkedItem(itemId) {
1475
- const isCheckSelectAll = itemId === "select-all";
1476
- if (!isCheckSelectAll) {
1477
- listState.checkedItem(this._id, itemId);
1478
- }
1479
- else {
1480
- listState.selectAll(this._id, !this.selectAllItem.checked);
1481
- }
1482
- this.value = (await this.getCheckedList()).checkedList;
1483
- this.changeVisibleCheckeds();
1484
- this.markForCheck();
1485
- }
1486
- changeVisibleCheckeds() {
1487
- const { visibledItems } = this.returnFilterData;
1488
- this.returnFilterData = {
1489
- visibledItems,
1490
- checkedItems: (visibledItems && visibledItems.filter(item => item.checked)) || [],
1491
- };
1492
- }
1493
- getAutoCompleteInput() {
1494
- return document.getElementById(`bcm-list-input-tag-container-${this._id}-autocomplete-input`);
1495
- }
1496
- dataScrollEvent(event) {
1497
- let count = 0;
1498
- let io = new IntersectionObserver((data) => {
1499
- if (count === 0) {
1500
- count++;
1501
- if (data[0].isIntersecting) {
1502
- this.limit += 15;
1503
- this.searchResultLimit += 15;
1504
- io.disconnect();
1505
- io = null;
1506
- }
1507
- }
1508
- }, this.options);
1509
- io.observe(event.target.lastElementChild);
1510
- }
1511
- async calculateLocation() {
1512
- var _a, _b;
1513
- if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
1514
- const list = document.getElementById(`bcm-list-${this._id}`);
1515
- // list && (list.style.height = '256px') //sebebi neydi ki!
1516
- var placement = this.placement;
1517
- const targetElementId = this.linkedComponent ? this.linkedComponent : `bcm-list-input-${this._id}`;
1518
- const targetElement = document.getElementById(targetElementId);
1519
- if (list && targetElement) {
1520
- popoverPlacement.getPlacement(list, targetElement, placement, (place) => (placement = place));
1521
- await utils.delay(10);
1522
- let pos = popoverPlacement.setPosition(placement, targetElement);
1523
- let captionAreaHeight = 0;
1524
- let labelAreaHeight = 0;
1525
- if (this.linkedComponent) {
1526
- const linked = document.getElementById(this.linkedComponent);
1527
- if (linked) {
1528
- if (!linked["noCaption"]) {
1529
- const captionArea = ((_a = linked.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".bcm-caption-area")) || linked.querySelector(".bcm-caption-area");
1530
- if (captionArea) {
1531
- captionAreaHeight = captionArea.offsetHeight || captionArea.clientHeight;
1532
- }
1533
- }
1534
- const labelArea = ((_b = linked.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(".bcm-label")) || linked.querySelector(".bcm-label");
1535
- if (labelArea) {
1536
- labelAreaHeight = labelArea.offsetHeight || labelArea.clientHeight;
1537
- }
1538
- }
1539
- }
1540
- if (this.fullWidth) {
1541
- list.style.width = targetElement.offsetWidth + "px";
1542
- }
1543
- else {
1544
- list.style.width = this.width || "auto";
1545
- }
1546
- if (this.height.indexOf("%") > -1) {
1547
- list.style.height = numberHelper.NumberHelper.toNumber(this.height) * 0.01 * window.innerHeight - pos[0] - 50 + "px";
1548
- }
1549
- else {
1550
- list.style.height = this.height;
1551
- }
1552
- list.style.minHeight = this.minHeight;
1553
- // const calculatedMaxHeight = window.innerHeight - pos[0] - 50;
1554
- const calculatedMaxHeight = placement.split("-")[0] == "top" ? window.innerHeight - (window.innerHeight - pos[0]) - 50 : window.innerHeight - pos[0] - 50;
1555
- if (this.maxHeight.indexOf("%") > -1) {
1556
- list.style.maxHeight = numberHelper.NumberHelper.toNumber(this.maxHeight) * 0.01 * calculatedMaxHeight + "px";
1557
- }
1558
- else {
1559
- list.style.maxHeight = numberHelper.NumberHelper.toNumber(this.maxHeight) < calculatedMaxHeight ? this.maxHeight : calculatedMaxHeight + "px";
1560
- }
1561
- popoverPlacement.getPlacement(list, targetElement, placement, (place) => (placement = place));
1562
- await utils.delay(10);
1563
- pos = popoverPlacement.setPosition(placement, targetElement);
1564
- list.style.top = (placement.split("-")[0] == "top" ? pos[0] - list.offsetHeight + labelAreaHeight : pos[0] - captionAreaHeight) + "px";
1565
- // list.style.left = pos[1] + 'px';
1566
- list.style.left = placement.split("-")[1] == "end" ? pos[1] - list.offsetWidth + "px" : pos[1] + "px";
1567
- list.classList.toggle("bcm-list--top", placement.split("-")[0] == "top");
1568
- this.calculatedViewport = true;
1569
- }
1570
- }
1571
- }
1572
- handleTransitionEnd(e) {
1573
- const { isOpen, type } = this;
1574
- const propertName = e === null || e === void 0 ? void 0 : e.propertyName;
1575
- if (isOpen && type == "select" && propertName == "transform") {
1576
- this.listOpen.emit();
1577
- }
1578
- }
1579
- render() {
1580
- const { checkboxes, treeview, label, size, disabled, readonly, required, hidden, fullWidth, searchable } = this.getOptions();
1581
- const hostClasses = index.classnames("bcm-list", `bcm-list__size-${size}`, `bcm-list__${this.type}`, size === "large" ? "size-3" : "size-2", {
1582
- "error": this.captionType == bcm.Bcm$1.Status.error,
1583
- "full-width": fullWidth,
1584
- "bcm-list__linked": this.linkedComponent,
1585
- hidden,
1586
- readonly,
1587
- disabled,
1588
- });
1589
- const bcmListContainer = index.classnames("bcm-list__container", this.linkedComponent ? "bcm-list__type-linked-component" : `bcm-list__type-${this.type}`, {
1590
- "is-open": this.isOpen && this.calculatedViewport,
1591
- "error": this.captionType == bcm.Bcm$1.Status.error,
1592
- "full-width": fullWidth,
1593
- hidden,
1594
- readonly,
1595
- disabled,
1596
- });
1597
- const bcmListInput = index.classnames("bcm-list__input");
1598
- const openedType = this.type == "select" || this.type == "autocomplete" || this.linkedComponent;
1599
- return (index$1.h(index$1.Host, { class: hostClasses, tabindex: "0", style: {
1600
- "--width": fullWidth ? "100%" : this.width,
1601
- "--height": openedType ? "100%" : this.height,
1602
- "--max-height": openedType ? "inherit" : this.maxHeight,
1603
- "--min-height": openedType ? "inherit" : this.minHeight,
1604
- } }, index$1.h("div", { id: `bcm-list-label-${this._id}`, class: "bcm-list__label" }, label && (index$1.h("div", null, index$1.h("bcm-label", { tooltip: this.tooltip, size: this.size, type: this.captionType, value: label, required: required, htmlFor: this._id })))), this.type == "select" && (index$1.h("div", { id: `bcm-list-input-${this._id}`, class: bcmListInput }, index$1.h("span", { class: index.classnames("bcm-list__input-container", { "type-single": !checkboxes, "value-empty": !this.value }) }, this.checkboxes ? (this.value && this.value.length > 0 ? (index$1.h("bcm-rc-overflow", { data: this.tagData, maxCount: this.tagCount })) : (index$1.h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))) : this.value ? (this.inputText) : (index$1.h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))), index$1.h("span", { class: index.classnames("bcm-list__input-buttons", {
1605
- disabled: disabled,
1606
- }) }, this.clearable && this.value && (index$1.h("div", { class: "bcm-list__input-buttons-button" }, index$1.h("bcm-icon", { icon: "fal fa-times", onClick: e => !disabled && this.setClear(e) }))), index$1.h("div", { class: `bcm-list__input-buttons-button caret-is ${this.isOpen && this.calculatedViewport && "caret-is-open"}` }, index$1.h("bcm-icon", { icon: `far fa-angle-down` }))))), this.type === "autocomplete" && (index$1.h("div", { id: `bcm-list-input-${this._id}`, class: index.classnames(bcmListInput, { "bcm-list__input-autocomplete": this.type == "autocomplete" }) }, index$1.h("span", { class: "bcm-list__input-container", id: `bcm-list-input-tag-container-${this._id}` }, this.checkboxes && index$1.h("span", { class: "bcm-list__input-tag-container", id: `bcm-list-input-tag-container-${this._id}-autocomplete` }), index$1.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 })))), index$1.h(ListTemplate, { 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, 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) }), index$1.h(captionTemplate.CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
1607
- }
1608
- get el() { return index$1.getElement(this); }
1609
- static get watchers() { return {
1610
- "_id": ["watchId"],
1611
- "value": ["handleValueChange"],
1612
- "returnFilterData": ["watchReturnFilterData"],
1613
- "isOpen": ["handleOpen"],
1614
- "data": ["dataChanged"]
1615
- }; }
1616
- };
1617
- __decorate([
1618
- isLoadDecorator.IsLoad()
1619
- ], BcmList.prototype, "el", void 0);
1620
- __decorate([
1621
- jsonParseDecarator.JsonParse("data", true)
1622
- ], BcmList.prototype, "dataChanged", null);
1623
- BcmList.style = listCss;
1624
-
1625
- function _extends() {
1626
- _extends = Object.assign ? Object.assign.bind() : function (target) {
1627
- for (var i = 1; i < arguments.length; i++) {
1628
- var source = arguments[i];
1629
- for (var key in source) {
1630
- if (Object.prototype.hasOwnProperty.call(source, key)) {
1631
- target[key] = source[key];
1632
- }
1633
- }
1634
- }
1635
- return target;
1636
- };
1637
- return _extends.apply(this, arguments);
1638
- }
1639
-
1640
- function _typeof(obj) {
1641
- "@babel/helpers - typeof";
1642
-
1643
- return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
1644
- return typeof obj;
1645
- } : function (obj) {
1646
- return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
1647
- }, _typeof(obj);
1648
- }
1649
-
1650
- function _toPrimitive(input, hint) {
1651
- if (_typeof(input) !== "object" || input === null) return input;
1652
- var prim = input[Symbol.toPrimitive];
1653
- if (prim !== undefined) {
1654
- var res = prim.call(input, hint || "default");
1655
- if (_typeof(res) !== "object") return res;
1656
- throw new TypeError("@@toPrimitive must return a primitive value.");
1657
- }
1658
- return (hint === "string" ? String : Number)(input);
1659
- }
1660
-
1661
- function _toPropertyKey(arg) {
1662
- var key = _toPrimitive(arg, "string");
1663
- return _typeof(key) === "symbol" ? key : String(key);
1664
- }
1665
-
1666
- function _defineProperty(obj, key, value) {
1667
- key = _toPropertyKey(key);
1668
- if (key in obj) {
1669
- Object.defineProperty(obj, key, {
1670
- value: value,
1671
- enumerable: true,
1672
- configurable: true,
1673
- writable: true
1674
- });
1675
- } else {
1676
- obj[key] = value;
1677
- }
1678
- return obj;
1679
- }
1680
-
1681
- function ownKeys(object, enumerableOnly) {
1682
- var keys = Object.keys(object);
1683
- if (Object.getOwnPropertySymbols) {
1684
- var symbols = Object.getOwnPropertySymbols(object);
1685
- enumerableOnly && (symbols = symbols.filter(function (sym) {
1686
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
1687
- })), keys.push.apply(keys, symbols);
1688
- }
1689
- return keys;
1690
- }
1691
- function _objectSpread2(target) {
1692
- for (var i = 1; i < arguments.length; i++) {
1693
- var source = null != arguments[i] ? arguments[i] : {};
1694
- i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
1695
- _defineProperty(target, key, source[key]);
1696
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
1697
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
1698
- });
1699
- }
1700
- return target;
1701
- }
1702
-
1703
- function _arrayWithHoles(arr) {
1704
- if (Array.isArray(arr)) return arr;
1705
- }
1706
-
1707
- function _iterableToArrayLimit(arr, i) {
1708
- var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
1709
- if (null != _i) {
1710
- var _s,
1711
- _e,
1712
- _x,
1713
- _r,
1714
- _arr = [],
1715
- _n = !0,
1716
- _d = !1;
1717
- try {
1718
- if (_x = (_i = _i.call(arr)).next, 0 === i) {
1719
- if (Object(_i) !== _i) return;
1720
- _n = !1;
1721
- } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
1722
- } catch (err) {
1723
- _d = !0, _e = err;
1724
- } finally {
1725
- try {
1726
- if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
1727
- } finally {
1728
- if (_d) throw _e;
1729
- }
1730
- }
1731
- return _arr;
1732
- }
1733
- }
1734
-
1735
- function _arrayLikeToArray(arr, len) {
1736
- if (len == null || len > arr.length) len = arr.length;
1737
- for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
1738
- return arr2;
1739
- }
1740
-
1741
- function _unsupportedIterableToArray(o, minLen) {
1742
- if (!o) return;
1743
- if (typeof o === "string") return _arrayLikeToArray(o, minLen);
1744
- var n = Object.prototype.toString.call(o).slice(8, -1);
1745
- if (n === "Object" && o.constructor) n = o.constructor.name;
1746
- if (n === "Map" || n === "Set") return Array.from(o);
1747
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
1748
- }
1749
-
1750
- function _nonIterableRest() {
1751
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
1752
- }
1753
-
1754
- function _slicedToArray(arr, i) {
1755
- return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
1756
- }
1757
-
1758
- function _objectWithoutPropertiesLoose(source, excluded) {
1759
- if (source == null) return {};
1760
- var target = {};
1761
- var sourceKeys = Object.keys(source);
1762
- var key, i;
1763
- for (i = 0; i < sourceKeys.length; i++) {
1764
- key = sourceKeys[i];
1765
- if (excluded.indexOf(key) >= 0) continue;
1766
- target[key] = source[key];
1767
- }
1768
- return target;
1769
- }
1770
-
1771
- function _objectWithoutProperties(source, excluded) {
1772
- if (source == null) return {};
1773
- var target = _objectWithoutPropertiesLoose(source, excluded);
1774
- var key, i;
1775
- if (Object.getOwnPropertySymbols) {
1776
- var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
1777
- for (i = 0; i < sourceSymbolKeys.length; i++) {
1778
- key = sourceSymbolKeys[i];
1779
- if (excluded.indexOf(key) >= 0) continue;
1780
- if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
1781
- target[key] = source[key];
1782
- }
1783
- }
1784
- return target;
1785
- }
1786
-
1787
- var _excluded$2 = ["prefixCls", "invalidate", "item", "renderItem", "responsive", "responsiveDisabled", "registerSize", "itemKey", "className", "style", "children", "display", "order", "component"];
1788
- // Use shared variable to save bundle size
1789
- var UNDEFINED = undefined;
1790
- function InternalItem(props, ref) {
1791
- var prefixCls = props.prefixCls,
1792
- invalidate = props.invalidate,
1793
- item = props.item,
1794
- renderItem = props.renderItem,
1795
- responsive = props.responsive,
1796
- responsiveDisabled = props.responsiveDisabled,
1797
- registerSize = props.registerSize,
1798
- itemKey = props.itemKey,
1799
- className = props.className,
1800
- style = props.style,
1801
- children = props.children,
1802
- display = props.display,
1803
- order = props.order,
1804
- _props$component = props.component,
1805
- Component = _props$component === void 0 ? 'div' : _props$component,
1806
- restProps = _objectWithoutProperties(props, _excluded$2);
1807
- var mergedHidden = responsive && !display;
1808
- // ================================ Effect ================================
1809
- function internalRegisterSize(width) {
1810
- registerSize(itemKey, width);
1811
- }
1812
- index$3.react.useEffect(function () {
1813
- return function () {
1814
- internalRegisterSize(null);
1815
- };
1816
- }, []);
1817
- // ================================ Render ================================
1818
- var childNode = renderItem && item !== UNDEFINED ? renderItem(item) : children;
1819
- var overflowStyle;
1820
- if (!invalidate) {
1821
- overflowStyle = {
1822
- opacity: mergedHidden ? 0 : 1,
1823
- height: mergedHidden ? 0 : UNDEFINED,
1824
- overflowY: mergedHidden ? 'hidden' : UNDEFINED,
1825
- order: responsive ? order : UNDEFINED,
1826
- pointerEvents: mergedHidden ? 'none' : UNDEFINED,
1827
- position: mergedHidden ? 'absolute' : UNDEFINED
1828
- };
1829
- }
1830
- var overflowProps = {};
1831
- if (mergedHidden) {
1832
- overflowProps['aria-hidden'] = true;
1833
- }
1834
- var itemNode = /*#__PURE__*/index$3.react.createElement(Component, _extends({
1835
- className: index.classnames(!invalidate && prefixCls, className),
1836
- style: _objectSpread2(_objectSpread2({}, overflowStyle), style)
1837
- }, overflowProps, restProps, {
1838
- ref: ref
1839
- }), childNode);
1840
- if (responsive) {
1841
- itemNode = /*#__PURE__*/index$3.react.createElement(index$4.RefResizeObserver, {
1842
- onResize: function onResize(_ref) {
1843
- var offsetWidth = _ref.offsetWidth;
1844
- internalRegisterSize(offsetWidth);
1845
- },
1846
- disabled: responsiveDisabled
1847
- }, itemNode);
1848
- }
1849
- return itemNode;
1850
- }
1851
- var Item = /*#__PURE__*/index$3.react.forwardRef(InternalItem);
1852
- Item.displayName = 'Item';
1853
-
1854
- function channelUpdate(callback) {
1855
- if (typeof MessageChannel === 'undefined') {
1856
- index$4.wrapperRaf(callback);
1857
- } else {
1858
- var channel = new MessageChannel();
1859
- channel.port1.onmessage = function () {
1860
- return callback();
1861
- };
1862
- channel.port2.postMessage(undefined);
1863
- }
1864
- }
1865
-
1866
- /**
1867
- * Batcher for record any `useEffectState` need update.
1868
- */
1869
- function useBatcher() {
1870
- // Updater Trigger
1871
- var updateFuncRef = index$3.react.useRef(null);
1872
- // Notify update
1873
- var notifyEffectUpdate = function notifyEffectUpdate(callback) {
1874
- if (!updateFuncRef.current) {
1875
- updateFuncRef.current = [];
1876
- channelUpdate(function () {
1877
- index$3.reactDom.unstable_batchedUpdates(function () {
1878
- updateFuncRef.current.forEach(function (fn) {
1879
- fn();
1880
- });
1881
- updateFuncRef.current = null;
1882
- });
1883
- });
1884
- }
1885
- updateFuncRef.current.push(callback);
1886
- };
1887
- return notifyEffectUpdate;
1888
- }
1889
- /**
1890
- * Trigger state update by `useLayoutEffect` to save perf.
1891
- */
1892
- function useEffectState(notifyEffectUpdate, defaultValue) {
1893
- // Value
1894
- var _React$useState = index$3.react.useState(defaultValue),
1895
- _React$useState2 = _slicedToArray(_React$useState, 2),
1896
- stateValue = _React$useState2[0],
1897
- setStateValue = _React$useState2[1];
1898
- // Set State
1899
- var setEffectVal = index$4.useEvent(function (nextValue) {
1900
- notifyEffectUpdate(function () {
1901
- setStateValue(nextValue);
1902
- });
1903
- });
1904
- return [stateValue, setEffectVal];
1905
- }
1906
-
1907
- var OverflowContext = /*#__PURE__*/index$3.react.createContext(null);
1908
-
1909
- var _excluded$1 = ["component"],
1910
- _excluded2 = ["className"],
1911
- _excluded3 = ["className"];
1912
- var InternalRawItem = function InternalRawItem(props, ref) {
1913
- var context = index$3.react.useContext(OverflowContext);
1914
- // Render directly when context not provided
1915
- if (!context) {
1916
- var _props$component = props.component,
1917
- Component = _props$component === void 0 ? 'div' : _props$component,
1918
- _restProps = _objectWithoutProperties(props, _excluded$1);
1919
- return /*#__PURE__*/index$3.react.createElement(Component, _extends({}, _restProps, {
1920
- ref: ref
1921
- }));
1922
- }
1923
- var contextClassName = context.className,
1924
- restContext = _objectWithoutProperties(context, _excluded2);
1925
- var className = props.className,
1926
- restProps = _objectWithoutProperties(props, _excluded3);
1927
- // Do not pass context to sub item to avoid multiple measure
1928
- return /*#__PURE__*/index$3.react.createElement(OverflowContext.Provider, {
1929
- value: null
1930
- }, /*#__PURE__*/index$3.react.createElement(Item, _extends({
1931
- ref: ref,
1932
- className: index.classnames(contextClassName, className)
1933
- }, restContext, restProps)));
1934
- };
1935
- var RawItem = /*#__PURE__*/index$3.react.forwardRef(InternalRawItem);
1936
- RawItem.displayName = 'RawItem';
1937
-
1938
- var _excluded = ["prefixCls", "data", "renderItem", "renderRawItem", "itemKey", "itemWidth", "ssr", "style", "className", "maxCount", "renderRest", "renderRawRest", "suffix", "component", "itemComponent", "onVisibleChange"];
1939
- var RESPONSIVE = 'responsive';
1940
- var INVALIDATE = 'invalidate';
1941
- function defaultRenderRest(omittedItems) {
1942
- return "+ ".concat(omittedItems.length, " ...");
1943
- }
1944
- function Overflow(props, ref) {
1945
- var _props$prefixCls = props.prefixCls,
1946
- prefixCls = _props$prefixCls === void 0 ? 'rc-overflow' : _props$prefixCls,
1947
- _props$data = props.data,
1948
- data = _props$data === void 0 ? [] : _props$data,
1949
- renderItem = props.renderItem,
1950
- renderRawItem = props.renderRawItem,
1951
- itemKey = props.itemKey,
1952
- _props$itemWidth = props.itemWidth,
1953
- itemWidth = _props$itemWidth === void 0 ? 10 : _props$itemWidth,
1954
- ssr = props.ssr,
1955
- style = props.style,
1956
- className = props.className,
1957
- maxCount = props.maxCount,
1958
- renderRest = props.renderRest,
1959
- renderRawRest = props.renderRawRest,
1960
- suffix = props.suffix,
1961
- _props$component = props.component,
1962
- Component = _props$component === void 0 ? 'div' : _props$component,
1963
- itemComponent = props.itemComponent,
1964
- onVisibleChange = props.onVisibleChange,
1965
- restProps = _objectWithoutProperties(props, _excluded);
1966
- var fullySSR = ssr === 'full';
1967
- var notifyEffectUpdate = useBatcher();
1968
- var _useEffectState = useEffectState(notifyEffectUpdate, null),
1969
- _useEffectState2 = _slicedToArray(_useEffectState, 2),
1970
- containerWidth = _useEffectState2[0],
1971
- setContainerWidth = _useEffectState2[1];
1972
- var mergedContainerWidth = containerWidth || 0;
1973
- var _useEffectState3 = useEffectState(notifyEffectUpdate, new Map()),
1974
- _useEffectState4 = _slicedToArray(_useEffectState3, 2),
1975
- itemWidths = _useEffectState4[0],
1976
- setItemWidths = _useEffectState4[1];
1977
- var _useEffectState5 = useEffectState(notifyEffectUpdate, 0),
1978
- _useEffectState6 = _slicedToArray(_useEffectState5, 2),
1979
- prevRestWidth = _useEffectState6[0],
1980
- setPrevRestWidth = _useEffectState6[1];
1981
- var _useEffectState7 = useEffectState(notifyEffectUpdate, 0),
1982
- _useEffectState8 = _slicedToArray(_useEffectState7, 2),
1983
- restWidth = _useEffectState8[0],
1984
- setRestWidth = _useEffectState8[1];
1985
- var _useEffectState9 = useEffectState(notifyEffectUpdate, 0),
1986
- _useEffectState10 = _slicedToArray(_useEffectState9, 2),
1987
- suffixWidth = _useEffectState10[0],
1988
- setSuffixWidth = _useEffectState10[1];
1989
- var _useState = index$3.react.useState(null),
1990
- _useState2 = _slicedToArray(_useState, 2),
1991
- suffixFixedStart = _useState2[0],
1992
- setSuffixFixedStart = _useState2[1];
1993
- var _useState3 = index$3.react.useState(null),
1994
- _useState4 = _slicedToArray(_useState3, 2),
1995
- displayCount = _useState4[0],
1996
- setDisplayCount = _useState4[1];
1997
- var mergedDisplayCount = index$3.react.useMemo(function () {
1998
- if (displayCount === null && fullySSR) {
1999
- return Number.MAX_SAFE_INTEGER;
2000
- }
2001
- return displayCount || 0;
2002
- }, [displayCount, containerWidth]);
2003
- var _useState5 = index$3.react.useState(false),
2004
- _useState6 = _slicedToArray(_useState5, 2),
2005
- restReady = _useState6[0],
2006
- setRestReady = _useState6[1];
2007
- var itemPrefixCls = "".concat(prefixCls, "-item");
2008
- // Always use the max width to avoid blink
2009
- var mergedRestWidth = Math.max(prevRestWidth, restWidth);
2010
- // ================================= Data =================================
2011
- var isResponsive = maxCount === RESPONSIVE;
2012
- var shouldResponsive = data.length && isResponsive;
2013
- var invalidate = maxCount === INVALIDATE;
2014
- /**
2015
- * When is `responsive`, we will always render rest node to get the real width of it for calculation
2016
- */
2017
- var showRest = shouldResponsive || typeof maxCount === 'number' && data.length > maxCount;
2018
- var mergedData = index$3.react.useMemo(function () {
2019
- var items = data;
2020
- if (shouldResponsive) {
2021
- if (containerWidth === null && fullySSR) {
2022
- items = data;
2023
- } else {
2024
- items = data.slice(0, Math.min(data.length, mergedContainerWidth / itemWidth));
2025
- }
2026
- } else if (typeof maxCount === 'number') {
2027
- items = data.slice(0, maxCount);
2028
- }
2029
- return items;
2030
- }, [data, itemWidth, containerWidth, maxCount, shouldResponsive]);
2031
- var omittedItems = index$3.react.useMemo(function () {
2032
- if (shouldResponsive) {
2033
- return data.slice(mergedDisplayCount + 1);
2034
- }
2035
- return data.slice(mergedData.length);
2036
- }, [data, mergedData, shouldResponsive, mergedDisplayCount]);
2037
- // ================================= Item =================================
2038
- var getKey = index$3.react.useCallback(function (item, index) {
2039
- var _ref;
2040
- if (typeof itemKey === 'function') {
2041
- return itemKey(item);
2042
- }
2043
- return (_ref = itemKey && (item === null || item === void 0 ? void 0 : item[itemKey])) !== null && _ref !== void 0 ? _ref : index;
2044
- }, [itemKey]);
2045
- var mergedRenderItem = index$3.react.useCallback(renderItem || function (item) {
2046
- return item;
2047
- }, [renderItem]);
2048
- function updateDisplayCount(count, suffixFixedStartVal, notReady) {
2049
- // React 18 will sync render even when the value is same in some case.
2050
- // We take `mergedData` as deps which may cause dead loop if it's dynamic generate.
2051
- // ref: https://github.com/ant-design/ant-design/issues/36559
2052
- if (displayCount === count && (suffixFixedStartVal === undefined || suffixFixedStartVal === suffixFixedStart)) {
2053
- return;
2054
- }
2055
- setDisplayCount(count);
2056
- if (!notReady) {
2057
- setRestReady(count < data.length - 1);
2058
- onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(count);
2059
- }
2060
- if (suffixFixedStartVal !== undefined) {
2061
- setSuffixFixedStart(suffixFixedStartVal);
2062
- }
2063
- }
2064
- // ================================= Size =================================
2065
- function onOverflowResize(_, element) {
2066
- setContainerWidth(element.clientWidth);
2067
- }
2068
- function registerSize(key, width) {
2069
- setItemWidths(function (origin) {
2070
- var clone = new Map(origin);
2071
- if (width === null) {
2072
- clone.delete(key);
2073
- } else {
2074
- clone.set(key, width);
2075
- }
2076
- return clone;
2077
- });
2078
- }
2079
- function registerOverflowSize(_, width) {
2080
- setRestWidth(width);
2081
- setPrevRestWidth(restWidth);
2082
- }
2083
- function registerSuffixSize(_, width) {
2084
- setSuffixWidth(width);
2085
- }
2086
- // ================================ Effect ================================
2087
- function getItemWidth(index) {
2088
- return itemWidths.get(getKey(mergedData[index], index));
2089
- }
2090
- index$4.useLayoutEffect(function () {
2091
- if (mergedContainerWidth && typeof mergedRestWidth === 'number' && mergedData) {
2092
- var totalWidth = suffixWidth;
2093
- var len = mergedData.length;
2094
- var lastIndex = len - 1;
2095
- // When data count change to 0, reset this since not loop will reach
2096
- if (!len) {
2097
- updateDisplayCount(0, null);
2098
- return;
2099
- }
2100
- for (var i = 0; i < len; i += 1) {
2101
- var currentItemWidth = getItemWidth(i);
2102
- // Fully will always render
2103
- if (fullySSR) {
2104
- currentItemWidth = currentItemWidth || 0;
2105
- }
2106
- // Break since data not ready
2107
- if (currentItemWidth === undefined) {
2108
- updateDisplayCount(i - 1, undefined, true);
2109
- break;
2110
- }
2111
- // Find best match
2112
- totalWidth += currentItemWidth;
2113
- if (
2114
- // Only one means `totalWidth` is the final width
2115
- lastIndex === 0 && totalWidth <= mergedContainerWidth ||
2116
- // Last two width will be the final width
2117
- i === lastIndex - 1 && totalWidth + getItemWidth(lastIndex) <= mergedContainerWidth) {
2118
- // Additional check if match the end
2119
- updateDisplayCount(lastIndex, null);
2120
- break;
2121
- } else if (totalWidth + mergedRestWidth > mergedContainerWidth) {
2122
- // Can not hold all the content to show rest
2123
- updateDisplayCount(i - 1, totalWidth - currentItemWidth - suffixWidth + restWidth);
2124
- break;
2125
- }
2126
- }
2127
- if (suffix && getItemWidth(0) + suffixWidth > mergedContainerWidth) {
2128
- setSuffixFixedStart(null);
2129
- }
2130
- }
2131
- }, [mergedContainerWidth, itemWidths, restWidth, suffixWidth, getKey, mergedData]);
2132
- // ================================ Render ================================
2133
- var displayRest = restReady && !!omittedItems.length;
2134
- var suffixStyle = {};
2135
- if (suffixFixedStart !== null && shouldResponsive) {
2136
- suffixStyle = {
2137
- position: 'absolute',
2138
- left: suffixFixedStart,
2139
- top: 0
2140
- };
2141
- }
2142
- var itemSharedProps = {
2143
- prefixCls: itemPrefixCls,
2144
- responsive: shouldResponsive,
2145
- component: itemComponent,
2146
- invalidate: invalidate
2147
- };
2148
- // >>>>> Choice render fun by `renderRawItem`
2149
- var internalRenderItemNode = renderRawItem ? function (item, index) {
2150
- var key = getKey(item, index);
2151
- return /*#__PURE__*/index$3.react.createElement(OverflowContext.Provider, {
2152
- key: key,
2153
- value: _objectSpread2(_objectSpread2({}, itemSharedProps), {}, {
2154
- order: index,
2155
- item: item,
2156
- itemKey: key,
2157
- registerSize: registerSize,
2158
- display: index <= mergedDisplayCount
2159
- })
2160
- }, renderRawItem(item, index));
2161
- } : function (item, index) {
2162
- var key = getKey(item, index);
2163
- return /*#__PURE__*/index$3.react.createElement(Item, _extends({}, itemSharedProps, {
2164
- order: index,
2165
- key: key,
2166
- item: item,
2167
- renderItem: mergedRenderItem,
2168
- itemKey: key,
2169
- registerSize: registerSize,
2170
- display: index <= mergedDisplayCount
2171
- }));
2172
- };
2173
- // >>>>> Rest node
2174
- var restNode;
2175
- var restContextProps = {
2176
- order: displayRest ? mergedDisplayCount : Number.MAX_SAFE_INTEGER,
2177
- className: "".concat(itemPrefixCls, "-rest"),
2178
- registerSize: registerOverflowSize,
2179
- display: displayRest
2180
- };
2181
- if (!renderRawRest) {
2182
- var mergedRenderRest = renderRest || defaultRenderRest;
2183
- restNode = /*#__PURE__*/index$3.react.createElement(Item, _extends({}, itemSharedProps, restContextProps), typeof mergedRenderRest === 'function' ? mergedRenderRest(omittedItems) : mergedRenderRest);
2184
- } else if (renderRawRest) {
2185
- restNode = /*#__PURE__*/index$3.react.createElement(OverflowContext.Provider, {
2186
- value: _objectSpread2(_objectSpread2({}, itemSharedProps), restContextProps)
2187
- }, renderRawRest(omittedItems));
2188
- }
2189
- var overflowNode = /*#__PURE__*/index$3.react.createElement(Component, _extends({
2190
- className: index.classnames(!invalidate && prefixCls, className),
2191
- style: style,
2192
- ref: ref
2193
- }, restProps), mergedData.map(internalRenderItemNode), showRest ? restNode : null, suffix && /*#__PURE__*/index$3.react.createElement(Item, _extends({}, itemSharedProps, {
2194
- responsive: isResponsive,
2195
- responsiveDisabled: !shouldResponsive,
2196
- order: mergedDisplayCount,
2197
- className: "".concat(itemPrefixCls, "-suffix"),
2198
- registerSize: registerSuffixSize,
2199
- display: true,
2200
- style: suffixStyle
2201
- }), suffix));
2202
- if (isResponsive) {
2203
- overflowNode = /*#__PURE__*/index$3.react.createElement(index$4.RefResizeObserver, {
2204
- onResize: onOverflowResize,
2205
- disabled: !shouldResponsive
2206
- }, overflowNode);
2207
- }
2208
- return overflowNode;
2209
- }
2210
- var ForwardOverflow = /*#__PURE__*/index$3.react.forwardRef(Overflow);
2211
- ForwardOverflow.displayName = 'Overflow';
2212
- ForwardOverflow.Item = RawItem;
2213
- ForwardOverflow.RESPONSIVE = RESPONSIVE;
2214
- ForwardOverflow.INVALIDATE = INVALIDATE;
2215
-
2216
- 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}";
2217
-
2218
- const BcmRcOverflow = class {
2219
- constructor(hostRef) {
2220
- index$1.registerInstance(this, hostRef);
2221
- this.selectOtherTag = index$1.createEvent(this, "bcm-select-other-tag", 7);
2222
- this.selectTag = index$1.createEvent(this, "bcm-select-tag", 7);
2223
- this.deleteTag = index$1.createEvent(this, "bcm-delete-tag", 7);
2224
- this.renderItem = item => {
2225
- return index$3.react.createElement("bcm-tooltip", {
2226
- placement: "bottom",
2227
- message: item.text,
2228
- trigger: "hover",
2229
- }, index$3.react.createElement("div", {
2230
- id: item.value + "-tag",
2231
- className: "bcm-tag",
2232
- onClick: ({ target }) => this.onClickControl(target, item, false),
2233
- }, index$3.react.createElement("span", { className: "bcm-tag__content dismissable" },
2234
- // .bcm-tag__content span {
2235
- // display: block;
2236
- // max-width: 38px;
2237
- // white-space: nowrap;
2238
- // overflow: hidden;
2239
- // text-overflow: ellipsis;
2240
- index$3.react.createElement("div", { className: "value tw-block tw-max-w-[38px] tw-overflow-hidden tw-overflow-ellipsis tw-whitespace-nowrap" }, item.text), index$3.react.createElement("span", {
2241
- className: "right close-button",
2242
- }, index$3.react.createElement("bcm-icon", {
2243
- icon: "fa fa-times",
2244
- })))));
2245
- };
2246
- this.renderRest = items => {
2247
- const titles = (items === null || items === void 0 ? void 0 : items.sort((a, b) => +a.ct - +b.ct).slice(0, 15).map(item => stringHelper.StringHelper.textLimitter(item.text, 40, true)).toString().split(",").join("\r\n")) + (items.length > 15 ? "\r\n..." : "");
2248
- return index$3.react.createElement("bcm-tooltip", {
2249
- placement: "bottom",
2250
- message: titles,
2251
- trigger: "hover",
2252
- }, index$3.react.createElement("div", {
2253
- className: "bcm-tag bcm-tag--other",
2254
- onClick: ({ target }) => this.onClickControl(target, items, true),
2255
- }, index$3.react.createElement("span", { className: `bcm-tag__content dismissable ${this.checked ? "checkable checked" : ""}` }, index$3.react.createElement("span", { className: "value" }, `+${items === null || items === void 0 ? void 0 : items.length}`), index$3.react.createElement("span", { className: "right close-button" }, index$3.react.createElement("bcm-icon", {
2256
- icon: "fa fa-times",
2257
- })))));
2258
- };
2259
- this._id = generate.Generate.UID();
2260
- this.maxCount = 1;
2261
- this.data = [];
2262
- this.checked = false;
2263
- }
2264
- isClickDismiss(e) {
2265
- return e["s-hn"] === "BCM-ICON";
2266
- }
2267
- onClickControl(e, item, isOtherTag = false) {
2268
- const isClickClose = this.isClickDismiss(e);
2269
- isClickClose && this.deleteTag.emit({ id: Array.isArray(item) ? item.map(i => i.value) : item.value }) && this.checked && (this.checked = false);
2270
- !isOtherTag && this.selectTag.emit({ id: item.value }) && this.checked && (this.checked = false);
2271
- if (isOtherTag && !isClickClose) {
2272
- this.checked = !this.checked;
2273
- this.selectOtherTag.emit({ id: item === null || item === void 0 ? void 0 : item.map(i => i.value), checked: this.checked });
2274
- }
2275
- }
2276
- componentWillRender() {
2277
- const { data, renderItem, renderRest, maxCount } = this;
2278
- this.overflowInstance = index$3.react.createElement(ForwardOverflow, {
2279
- data,
2280
- renderItem,
2281
- renderRest,
2282
- maxCount,
2283
- });
2284
- index$3.reactDom.render(this.overflowInstance, this.el);
2285
- }
2286
- get el() { return index$1.getElement(this); }
2287
- };
2288
- BcmRcOverflow.style = rcOverflowCss;
2289
-
2290
- const { state } = index$2.createStore({
2291
- value: new Map(),
2292
- });
2293
- const setValue = val => {
2294
- const { id, dataSource } = val;
2295
- const data = {
2296
- id: generate.snq(() => id, generate.Generate.UID),
2297
- dataSource: dataSource && dataSource.length > 0 && recursive(dataSource),
2298
- searchIsOnlyChilds: val.searchIsOnlyChilds,
2299
- };
2300
- state.value.set(data.id, data);
2301
- };
2302
- const recursive = (data, parentId) => {
2303
- let recData = [];
2304
- if (data) {
2305
- recData = data.map(item => (Object.assign(Object.assign(Object.assign({}, item), { parentId: generate.snq(() => parentId, null) }), (item.items && item.items.length > 0 && { items: generate.snq(() => recursive(item.items, item.id), []) }))));
2306
- }
2307
- return recData;
2308
- };
2309
- const removeValue = _id => {
2310
- state.value.delete(_id);
2311
- };
2312
- const getValue = id => generate.snq(() => state.value.get(id), {});
2313
- const getDataPagination = (id, limit = 3) => {
2314
- let data = [];
2315
- const value = getValue(id);
2316
- if (value) {
2317
- const { dataSource } = value;
2318
- data = dataSource.slice(0, limit);
2319
- }
2320
- return data;
2321
- };
2322
- // //search treeview data by text
2323
- // const searchData = (id, search, items?) => {
2324
- // let dataSource
2325
- // if (items && items.length > 0) {
2326
- // dataSource = items
2327
- // } else {
2328
- // const value = getValue(id);
2329
- // dataSource = value.dataSource;
2330
- // }
2331
- // let result = []
2332
- // if (dataSource) {
2333
- // dataSource.forEach(child => {
2334
- // if (child.text.toLowerCase().includes(search.toLowerCase())) {
2335
- // result.push(child)
2336
- // }
2337
- // result = result.concat(searchData(id, search, child.items))
2338
- // })
2339
- // };
2340
- // return result
2341
- // };
2342
- //nested search
2343
- const searchData = (id, searchText, items) => {
2344
- let dataSource;
2345
- if (items && items.length > 0) {
2346
- dataSource = items;
2347
- }
2348
- else {
2349
- const value = getValue(id);
2350
- dataSource = value.dataSource;
2351
- }
2352
- let results = [];
2353
- if (dataSource) {
2354
- results.push(nestedSearch(id, dataSource, searchText));
2355
- //return with their parents
2356
- // dataSource.forEach(child => {
2357
- // if (child.text.toLowerCase().includes(searchText.toLowerCase())) {
2358
- // results.push(child)
2359
- // } else if (child.items && child.items.length > 0) {
2360
- // child.items = nestedSearch(child.items, searchText)
2361
- // if (child.items.length > 0) {
2362
- // results.push(child)
2363
- // }
2364
- // }
2365
- // })
2366
- }
2367
- return {
2368
- result: generate.snq(() => generate.Generate.flatArray(results[0].result), []),
2369
- matching: generate.snq(() => results[0].matching, []),
2370
- parentIndex: generate.snq(() => results[0].parentIndex, []),
2371
- nestedResult: generate.snq(() => results[0].nestedResult, []),
2372
- };
2373
- };
2374
- const nestedSearch = (id, items, searchText) => {
2375
- let matching = [];
2376
- let parentIndex = [];
2377
- let result = [];
2378
- let nestedResult = [];
2379
- const { searchIsOnlyChilds } = getValue(id);
2380
- if (items && items.length > 0) {
2381
- items.forEach(child => {
2382
- let isChild = searchIsOnlyChilds && child.parentId !== null;
2383
- let isMatching = (child.text && stringHelper.StringHelper.slugify(child.text).includes(stringHelper.StringHelper.slugify(searchText))) ||
2384
- (child.keywords && stringHelper.StringHelper.slugify(child.keywords).includes(stringHelper.StringHelper.slugify(searchText)));
2385
- if (isMatching && (!searchIsOnlyChilds || (searchIsOnlyChilds && isChild))) {
2386
- result.push(child.id);
2387
- matching.push(child.id);
2388
- parentIndex.push(child.id);
2389
- nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId });
2390
- if (child.items && child.items.length > 0) {
2391
- const found = nestedSearch(id, child.items, searchText);
2392
- if (found.matching.length > 0) {
2393
- found.matching.forEach(chi => {
2394
- matching.push(chi);
2395
- });
2396
- }
2397
- }
2398
- }
2399
- else if (child.items && child.items.length > 0) {
2400
- const found = nestedSearch(id, child.items, searchText);
2401
- if (found.result.length > 0) {
2402
- found.result.forEach(chi => {
2403
- result.push(chi);
2404
- });
2405
- result.push(child.id);
2406
- parentIndex.push(child.id);
2407
- nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId, items: found.nestedResult });
2408
- }
2409
- if (found.matching.length > 0) {
2410
- matching.push(...found.matching);
2411
- }
2412
- }
2413
- });
2414
- }
2415
- return { result, matching, parentIndex, nestedResult };
2416
- };
2417
- const searchState = {
2418
- setValue,
2419
- removeValue,
2420
- getValue,
2421
- getDataPagination,
2422
- searchData,
2423
- };
2424
-
2425
- 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\"); @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}*{box-sizing:border-box}.bcm-caption-area{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-size:12px;line-height:calc(12px + 8px);color:var(--bcm-new-ds-color-slate-400);display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;flex-wrap:nowrap;margin-top:2px}.bcm-caption-area__text{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.default{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.info{color:var(--bcm-new-ds-color-blue-500)}.bcm-caption-area__text.success{color:var(--bcm-new-ds-color-emerald-500)}.bcm-caption-area__text.warning{color:var(--bcm-new-ds-color-amber-500)}.bcm-caption-area__text.error{color:var(--bcm-new-ds-color-red-500)}.bcm-caption-area__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-caption-area__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-caption-area__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 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}";
2426
-
2427
- const BcmSearch = class {
2428
- constructor(hostRef) {
2429
- index$1.registerInstance(this, hostRef);
2430
- this.bcmOnSearch = index$1.createEvent(this, "bcm-on-search", 7);
2431
- this.bcmOnSearchClear = index$1.createEvent(this, "bcm-on-search-clear", 7);
2432
- this.debounceHandler = generate.Generate.debounceInput((event) => this.onSearchValue(event, this), 300, false, () => {
2433
- var _a, _b;
2434
- 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;
2435
- });
2436
- this._id = generate.Generate.UID();
2437
- this.placeholder = "Search";
2438
- this.disabled = false;
2439
- this.readonly = false;
2440
- this.clearable = true;
2441
- this.size = bcm.Bcm.Size.medium;
2442
- this.limit = 10;
2443
- this.searchIsOnlyChilds = false;
2444
- this.minSearchLength = 2;
2445
- this.data = [];
2446
- this.tick = {};
2447
- this.isActiveClearable = false;
2448
- }
2449
- async componentDidLoad() {
2450
- await this.initState();
2451
- }
2452
- async dataChanged(newValue, oldValue) {
2453
- // console.log('data changed', newValue, oldValue)
2454
- if (newValue !== oldValue) {
2455
- await this.initState();
2456
- }
2457
- }
2458
- async initState() {
2459
- await searchState.setValue({
2460
- id: this._id + "-input",
2461
- dataSource: this.data,
2462
- searchIsOnlyChilds: this.searchIsOnlyChilds,
2463
- });
2464
- await this.markForCheck();
2465
- }
2466
- markForCheck() {
2467
- this.tick = generate.Generate.UID();
2468
- }
2469
- handleInput() {
2470
- // console.log("aheyya")
2471
- }
2472
- async onBcmFocus() {
2473
- this.inputElement.focus();
2474
- }
2475
- async onBcmBlur() {
2476
- this.inputElement.blur();
2477
- }
2478
- async onBcmSelect() {
2479
- this.inputElement.select();
2480
- }
2481
- async setValue(newValue) {
2482
- this.inputElement.value = newValue;
2483
- }
2484
- handleFocus() { }
2485
- handleBlur() { }
2486
- handleChange() { }
2487
- async handleClear(eventEmit = true) {
2488
- this.inputElement.value = '';
2489
- const { value, id } = this.inputElement;
2490
- searchState.searchData(id, value);
2491
- this.isActiveClearable = false;
2492
- this.bcmOnSearch.emit({ result: null, value: null, matching: null, parentIndex: null });
2493
- this.bcmOnSearchClear.emit(eventEmit);
2494
- await utils.delay(10);
2495
- return Promise.resolve();
2496
- }
2497
- onSearchValue(event, instance) {
2498
- const { value, id } = event.target;
2499
- const searchResult = (value === null || value === void 0 ? void 0 : value.length) >= this.minSearchLength ? searchState.searchData(id, value, null) : null;
2500
- const { bcmOnSearch, inputElement } = instance;
2501
- 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 });
2502
- }
2503
- render() {
2504
- const { _id, placeholder, disabled, readonly } = this;
2505
- return index$1.h(index$1.Host, { onClick: () => { this.onBcmFocus(); this.onBcmSelect(); } }, index$1.h(inputTemplate.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 }));
2506
- }
2507
- get el() { return index$1.getElement(this); }
2508
- static get watchers() { return {
2509
- "data": ["dataChanged"]
2510
- }; }
2511
- };
2512
- BcmSearch.style = searchCss;
2513
-
2514
- exports.bcm_list = BcmList;
2515
- exports.bcm_rc_overflow = BcmRcOverflow;
2516
- exports.bcm_search = BcmSearch;