@otto-de/b2b-core-components 1.35.0 → 1.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (261) hide show
  1. package/dist/b2b-core-components/b2b-core-components.esm.js +1 -1
  2. package/dist/b2b-core-components/{p-d2f4db88.entry.js → p-01f2aca4.entry.js} +1 -1
  3. package/dist/b2b-core-components/p-02bb4145.entry.js +1 -0
  4. package/dist/b2b-core-components/{p-7889e94a.entry.js → p-0cd95c1e.entry.js} +1 -1
  5. package/dist/b2b-core-components/{p-04f5748b.entry.js → p-0e994814.entry.js} +1 -1
  6. package/dist/b2b-core-components/{p-419de188.entry.js → p-121ead75.entry.js} +1 -1
  7. package/dist/b2b-core-components/{p-b9a6ad5d.entry.js → p-1875aef7.entry.js} +1 -1
  8. package/dist/b2b-core-components/p-19a043a8.entry.js +1 -0
  9. package/dist/b2b-core-components/{p-e3877fc1.entry.js → p-1e5732bb.entry.js} +1 -1
  10. package/dist/b2b-core-components/{p-a46674a7.entry.js → p-212d2e61.entry.js} +1 -1
  11. package/dist/b2b-core-components/p-22967672.entry.js +1 -0
  12. package/dist/b2b-core-components/{p-18bb4d69.entry.js → p-253502a0.entry.js} +1 -1
  13. package/dist/b2b-core-components/{p-21644e6c.entry.js → p-2aaa326b.entry.js} +1 -1
  14. package/dist/b2b-core-components/p-3628e4cb.entry.js +1 -0
  15. package/dist/b2b-core-components/{p-c8b5c7e2.entry.js → p-3752cc70.entry.js} +1 -1
  16. package/dist/b2b-core-components/{p-c086532b.entry.js → p-3b52a3fb.entry.js} +1 -1
  17. package/dist/b2b-core-components/{p-997a232e.entry.js → p-3c6abe16.entry.js} +1 -1
  18. package/dist/b2b-core-components/{p-f9f9820a.entry.js → p-4b8c879e.entry.js} +1 -1
  19. package/dist/b2b-core-components/p-51086123.entry.js +1 -0
  20. package/dist/b2b-core-components/{p-0648230f.entry.js → p-696b9e54.entry.js} +1 -1
  21. package/dist/b2b-core-components/{p-d62e615b.entry.js → p-6b3788ae.entry.js} +1 -1
  22. package/dist/b2b-core-components/{p-8cb6813a.entry.js → p-6f5dbb23.entry.js} +1 -1
  23. package/dist/b2b-core-components/{p-b4310b58.entry.js → p-6f607a94.entry.js} +1 -1
  24. package/dist/b2b-core-components/{p-23af5193.entry.js → p-73db8251.entry.js} +1 -1
  25. package/dist/b2b-core-components/{p-ae7a752e.entry.js → p-7d2fb5f3.entry.js} +1 -1
  26. package/dist/b2b-core-components/{p-540a8b9c.entry.js → p-80104e55.entry.js} +1 -1
  27. package/dist/b2b-core-components/{p-0aa0c59a.entry.js → p-861dba01.entry.js} +1 -1
  28. package/dist/b2b-core-components/{p-17778cfc.entry.js → p-96211730.entry.js} +1 -1
  29. package/dist/b2b-core-components/{p-d163d252.entry.js → p-9cbda7b3.entry.js} +1 -1
  30. package/dist/b2b-core-components/{p-2486830b.entry.js → p-9f0dbb21.entry.js} +1 -1
  31. package/dist/b2b-core-components/p-a2d97f5d.entry.js +1 -0
  32. package/dist/b2b-core-components/{p-a9c9552f.entry.js → p-a5cc60f3.entry.js} +1 -1
  33. package/dist/b2b-core-components/{p-0ab41eb5.entry.js → p-acdcb8c8.entry.js} +1 -1
  34. package/dist/b2b-core-components/{p-c8cc1797.entry.js → p-b0abf9e3.entry.js} +1 -1
  35. package/dist/b2b-core-components/p-b95b2de3.entry.js +1 -0
  36. package/dist/b2b-core-components/{p-433a3f3e.entry.js → p-bb0f31a9.entry.js} +1 -1
  37. package/dist/b2b-core-components/{p-89e817e9.entry.js → p-bf1d5618.entry.js} +1 -1
  38. package/dist/b2b-core-components/{p-703da47c.entry.js → p-c9a10980.entry.js} +1 -1
  39. package/dist/b2b-core-components/{p-c25832e1.entry.js → p-ceab4af0.entry.js} +1 -1
  40. package/dist/b2b-core-components/{p-79a01d0d.entry.js → p-db898e98.entry.js} +1 -1
  41. package/dist/b2b-core-components/p-e143cad0.entry.js +1 -0
  42. package/dist/b2b-core-components/p-e52728b3.entry.js +1 -0
  43. package/dist/b2b-core-components/{p-670e355a.entry.js → p-ef93e944.entry.js} +1 -1
  44. package/dist/b2b-core-components/{p-f3c0fe56.entry.js → p-f32e783e.entry.js} +1 -1
  45. package/dist/b2b-core-components/{p-4b27240b.entry.js → p-f9e61af5.entry.js} +1 -1
  46. package/dist/b2b-core-components/{p-dcaff8ab.entry.js → p-fa050815.entry.js} +1 -1
  47. package/dist/cjs/b2b-background-box.cjs.entry.js +1 -1
  48. package/dist/cjs/b2b-button_2.cjs.entry.js +1 -1
  49. package/dist/cjs/b2b-checkbox.cjs.entry.js +1 -1
  50. package/dist/cjs/b2b-chip-component_2.cjs.entry.js +2 -2
  51. package/dist/cjs/b2b-core-components.cjs.js +1 -1
  52. package/dist/cjs/b2b-dropdown.cjs.entry.js +52 -5
  53. package/dist/cjs/b2b-flyout-menu-option.cjs.entry.js +1 -1
  54. package/dist/cjs/b2b-flyout-menu.cjs.entry.js +4 -4
  55. package/dist/cjs/b2b-grid-col.cjs.entry.js +1 -1
  56. package/dist/cjs/b2b-grid-row.cjs.entry.js +2 -2
  57. package/dist/cjs/b2b-grid.cjs.entry.js +1 -1
  58. package/dist/cjs/b2b-input-group_2.cjs.entry.js +17 -4
  59. package/dist/cjs/b2b-input-label.cjs.entry.js +2 -2
  60. package/dist/cjs/b2b-input-list-option.cjs.entry.js +30 -0
  61. package/dist/cjs/{b2b-input_2.cjs.entry.js → b2b-input.cjs.entry.js} +4 -28
  62. package/dist/cjs/b2b-label.cjs.entry.js +2 -2
  63. package/dist/cjs/b2b-modal.cjs.entry.js +2 -2
  64. package/dist/cjs/b2b-multiselect-dropdown.cjs.entry.js +3 -3
  65. package/dist/cjs/b2b-pagination.cjs.entry.js +2 -2
  66. package/dist/cjs/b2b-progress-bar.cjs.entry.js +3 -3
  67. package/dist/cjs/b2b-radio-button.cjs.entry.js +2 -2
  68. package/dist/cjs/b2b-radio-group.cjs.entry.js +2 -2
  69. package/dist/cjs/b2b-required-separator.cjs.entry.js +1 -1
  70. package/dist/cjs/b2b-rounded-icon.cjs.entry.js +4 -4
  71. package/dist/cjs/b2b-scrollable-container.cjs.entry.js +1 -1
  72. package/dist/cjs/b2b-search.cjs.entry.js +1 -1
  73. package/dist/cjs/b2b-separator.cjs.entry.js +1 -1
  74. package/dist/cjs/b2b-shimmer.cjs.entry.js +1 -1
  75. package/dist/cjs/b2b-snackbar.cjs.entry.js +4 -4
  76. package/dist/cjs/b2b-tab-group.cjs.entry.js +1 -1
  77. package/dist/cjs/b2b-tab-panel.cjs.entry.js +1 -1
  78. package/dist/cjs/b2b-tab.cjs.entry.js +2 -2
  79. package/dist/cjs/b2b-table-cell_2.cjs.entry.js +3 -3
  80. package/dist/cjs/b2b-table-row.cjs.entry.js +2 -2
  81. package/dist/cjs/b2b-table-rowgroup.cjs.entry.js +4 -3
  82. package/dist/cjs/b2b-table.cjs.entry.js +2 -2
  83. package/dist/cjs/b2b-textarea.cjs.entry.js +2 -2
  84. package/dist/cjs/b2b-time-picker.cjs.entry.js +6 -6
  85. package/dist/cjs/b2b-toggle-button.cjs.entry.js +3 -3
  86. package/dist/cjs/b2b-toggle-chip.cjs.entry.js +3 -3
  87. package/dist/cjs/b2b-toggle-group.cjs.entry.js +2 -2
  88. package/dist/cjs/b2b-toggle-switch.cjs.entry.js +4 -4
  89. package/dist/cjs/b2b-tooltip.cjs.entry.js +3 -3
  90. package/dist/cjs/b2b-wizard-icon.cjs.entry.js +1 -1
  91. package/dist/cjs/b2b-wizard-step.cjs.entry.js +2 -2
  92. package/dist/cjs/b2b-wizard.cjs.entry.js +1 -1
  93. package/dist/cjs/index-668808fd.js +6 -2
  94. package/dist/cjs/loader.cjs.js +1 -1
  95. package/dist/collection/components/background-box/background-box.css +2 -2
  96. package/dist/collection/components/background-box/background-box.e2e.js +1 -1
  97. package/dist/collection/components/background-box/background-box.stories.js +1 -1
  98. package/dist/collection/components/checkbox/checkbox.css +3 -3
  99. package/dist/collection/components/dropdown/dropdown.css +11 -0
  100. package/dist/collection/components/dropdown/dropdown.e2e.js +73 -0
  101. package/dist/collection/components/dropdown/dropdown.js +88 -4
  102. package/dist/collection/components/dropdown/dropdown.stories.js +15 -3
  103. package/dist/collection/components/flyout-menu/flyout-menu-option.js +1 -1
  104. package/dist/collection/components/flyout-menu/flyout-menu.css +5 -3
  105. package/dist/collection/components/flyout-menu/flyout-menu.js +3 -3
  106. package/dist/collection/components/grid/column.js +1 -1
  107. package/dist/collection/components/grid/grid.js +1 -1
  108. package/dist/collection/components/grid/row.js +2 -2
  109. package/dist/collection/components/input/input.js +4 -4
  110. package/dist/collection/components/input-group/input-group.js +1 -1
  111. package/dist/collection/components/input-label/input-label.js +2 -2
  112. package/dist/collection/components/input-list/input-list-option.js +1 -1
  113. package/dist/collection/components/input-list/input-list.css +5 -3
  114. package/dist/collection/components/input-list/input-list.e2e.js +5 -5
  115. package/dist/collection/components/input-list/input-list.js +23 -6
  116. package/dist/collection/components/label/label.js +2 -2
  117. package/dist/collection/components/modal/modal.js +2 -2
  118. package/dist/collection/components/multiselect-dropdown/multiselect-dropdown.js +3 -3
  119. package/dist/collection/components/multiselect-dropdown/multiselect-option/multiselect-option.js +2 -2
  120. package/dist/collection/components/pagination/pagination.css +5 -3
  121. package/dist/collection/components/pagination/pagination.js +1 -1
  122. package/dist/collection/components/progress-bar/progress-bar.js +3 -3
  123. package/dist/collection/components/radio/radio.js +2 -2
  124. package/dist/collection/components/radio-group/radio-group.js +2 -2
  125. package/dist/collection/components/required-separator/required-separator.js +1 -1
  126. package/dist/collection/components/rounded-icon/rounded-icon.js +4 -4
  127. package/dist/collection/components/scrollable-container/scrollable-container.js +1 -1
  128. package/dist/collection/components/search/search.e2e.js +1 -1
  129. package/dist/collection/components/search/search.js +1 -1
  130. package/dist/collection/components/separator/separator.js +1 -1
  131. package/dist/collection/components/shimmer/shimmer.js +1 -1
  132. package/dist/collection/components/snackbar/snackbar.js +4 -4
  133. package/dist/collection/components/spinner/spinner.js +1 -1
  134. package/dist/collection/components/tab/tab.js +2 -2
  135. package/dist/collection/components/tab-group/tab-group.js +1 -1
  136. package/dist/collection/components/tab-panel/tab-panel.js +1 -1
  137. package/dist/collection/components/table/table-cell/table-cell.js +2 -2
  138. package/dist/collection/components/table/table-header/table-header.js +1 -1
  139. package/dist/collection/components/table/table-row/table-row.js +2 -2
  140. package/dist/collection/components/table/table-rowgroup/table-rowgroup.js +4 -3
  141. package/dist/collection/components/table/table.js +2 -2
  142. package/dist/collection/components/textarea/textarea.js +2 -2
  143. package/dist/collection/components/time-picker/time-picker.js +6 -6
  144. package/dist/collection/components/toggle-button/toggle-button.js +3 -3
  145. package/dist/collection/components/toggle-chip/toggle-chip.js +3 -3
  146. package/dist/collection/components/toggle-group/toggle-group.js +2 -2
  147. package/dist/collection/components/toggle-switch/toggle-switch.js +4 -4
  148. package/dist/collection/components/tooltip/tooltip.js +3 -3
  149. package/dist/collection/components/wizard/wizard-step.js +2 -2
  150. package/dist/collection/components/wizard/wizard.js +1 -1
  151. package/dist/collection/components/wizard-icon/wizard-icon.js +1 -1
  152. package/dist/components/b2b-dropdown.js +68 -6
  153. package/dist/components/b2b-flyout-menu-option.js +1 -1
  154. package/dist/components/b2b-flyout-menu.js +4 -4
  155. package/dist/components/b2b-grid-col.js +1 -1
  156. package/dist/components/b2b-grid-row.js +2 -2
  157. package/dist/components/b2b-grid.js +1 -1
  158. package/dist/components/b2b-label.js +2 -2
  159. package/dist/components/b2b-modal.js +2 -2
  160. package/dist/components/b2b-multiselect-dropdown.js +3 -3
  161. package/dist/components/b2b-pagination.js +2 -2
  162. package/dist/components/b2b-progress-bar.js +3 -3
  163. package/dist/components/b2b-radio-button.js +2 -2
  164. package/dist/components/b2b-radio-group.js +2 -2
  165. package/dist/components/b2b-required-separator.js +1 -1
  166. package/dist/components/b2b-scrollable-container.js +1 -1
  167. package/dist/components/b2b-search.js +1 -1
  168. package/dist/components/b2b-shimmer.js +1 -1
  169. package/dist/components/b2b-snackbar.js +4 -4
  170. package/dist/components/b2b-tab-group.js +1 -1
  171. package/dist/components/b2b-tab-panel.js +1 -1
  172. package/dist/components/b2b-tab.js +2 -2
  173. package/dist/components/b2b-table-row.js +2 -2
  174. package/dist/components/b2b-table-rowgroup.js +4 -3
  175. package/dist/components/b2b-table.js +2 -2
  176. package/dist/components/b2b-textarea.js +2 -2
  177. package/dist/components/b2b-time-picker.js +6 -6
  178. package/dist/components/b2b-toggle-button.js +3 -3
  179. package/dist/components/b2b-toggle-chip.js +3 -3
  180. package/dist/components/b2b-toggle-group.js +2 -2
  181. package/dist/components/b2b-toggle-switch.js +4 -4
  182. package/dist/components/b2b-tooltip.js +3 -3
  183. package/dist/components/b2b-wizard-step.js +2 -2
  184. package/dist/components/b2b-wizard.js +1 -1
  185. package/dist/components/background-box.js +1 -1
  186. package/dist/components/checkbox.js +1 -1
  187. package/dist/components/input-group.js +1 -1
  188. package/dist/components/input-label.js +2 -2
  189. package/dist/components/input-list-option.js +2 -2
  190. package/dist/components/input-list.js +20 -5
  191. package/dist/components/input.js +4 -4
  192. package/dist/components/multiselect-option.js +2 -2
  193. package/dist/components/rounded-icon.js +4 -4
  194. package/dist/components/separator.js +1 -1
  195. package/dist/components/spinner.js +1 -1
  196. package/dist/components/table-cell.js +2 -2
  197. package/dist/components/table-header.js +1 -1
  198. package/dist/components/wizard-icon.js +1 -1
  199. package/dist/custom-elements.json +12 -0
  200. package/dist/esm/b2b-background-box.entry.js +1 -1
  201. package/dist/esm/b2b-button_2.entry.js +1 -1
  202. package/dist/esm/b2b-checkbox.entry.js +1 -1
  203. package/dist/esm/b2b-chip-component_2.entry.js +2 -2
  204. package/dist/esm/b2b-core-components.js +1 -1
  205. package/dist/esm/b2b-dropdown.entry.js +52 -5
  206. package/dist/esm/b2b-flyout-menu-option.entry.js +1 -1
  207. package/dist/esm/b2b-flyout-menu.entry.js +4 -4
  208. package/dist/esm/b2b-grid-col.entry.js +1 -1
  209. package/dist/esm/b2b-grid-row.entry.js +2 -2
  210. package/dist/esm/b2b-grid.entry.js +1 -1
  211. package/dist/esm/b2b-input-group_2.entry.js +17 -4
  212. package/dist/esm/b2b-input-label.entry.js +2 -2
  213. package/dist/esm/b2b-input-list-option.entry.js +26 -0
  214. package/dist/esm/{b2b-input_2.entry.js → b2b-input.entry.js} +5 -28
  215. package/dist/esm/b2b-label.entry.js +2 -2
  216. package/dist/esm/b2b-modal.entry.js +2 -2
  217. package/dist/esm/b2b-multiselect-dropdown.entry.js +3 -3
  218. package/dist/esm/b2b-pagination.entry.js +2 -2
  219. package/dist/esm/b2b-progress-bar.entry.js +3 -3
  220. package/dist/esm/b2b-radio-button.entry.js +2 -2
  221. package/dist/esm/b2b-radio-group.entry.js +2 -2
  222. package/dist/esm/b2b-required-separator.entry.js +1 -1
  223. package/dist/esm/b2b-rounded-icon.entry.js +4 -4
  224. package/dist/esm/b2b-scrollable-container.entry.js +1 -1
  225. package/dist/esm/b2b-search.entry.js +1 -1
  226. package/dist/esm/b2b-separator.entry.js +1 -1
  227. package/dist/esm/b2b-shimmer.entry.js +1 -1
  228. package/dist/esm/b2b-snackbar.entry.js +4 -4
  229. package/dist/esm/b2b-tab-group.entry.js +1 -1
  230. package/dist/esm/b2b-tab-panel.entry.js +1 -1
  231. package/dist/esm/b2b-tab.entry.js +2 -2
  232. package/dist/esm/b2b-table-cell_2.entry.js +3 -3
  233. package/dist/esm/b2b-table-row.entry.js +2 -2
  234. package/dist/esm/b2b-table-rowgroup.entry.js +4 -3
  235. package/dist/esm/b2b-table.entry.js +2 -2
  236. package/dist/esm/b2b-textarea.entry.js +2 -2
  237. package/dist/esm/b2b-time-picker.entry.js +6 -6
  238. package/dist/esm/b2b-toggle-button.entry.js +3 -3
  239. package/dist/esm/b2b-toggle-chip.entry.js +3 -3
  240. package/dist/esm/b2b-toggle-group.entry.js +2 -2
  241. package/dist/esm/b2b-toggle-switch.entry.js +4 -4
  242. package/dist/esm/b2b-tooltip.entry.js +3 -3
  243. package/dist/esm/b2b-wizard-icon.entry.js +1 -1
  244. package/dist/esm/b2b-wizard-step.entry.js +2 -2
  245. package/dist/esm/b2b-wizard.entry.js +1 -1
  246. package/dist/esm/index-ab9eb36d.js +6 -2
  247. package/dist/esm/loader.js +1 -1
  248. package/dist/types/components/dropdown/dropdown.d.ts +10 -1
  249. package/dist/types/components/dropdown/dropdown.stories.d.ts +2 -0
  250. package/dist/types/components/input-list/input-list.d.ts +4 -1
  251. package/dist/types/components.d.ts +18 -2
  252. package/dist/web-types.json +24 -4
  253. package/package.json +2 -2
  254. package/dist/b2b-core-components/p-04ac661d.entry.js +0 -1
  255. package/dist/b2b-core-components/p-260dcc05.entry.js +0 -1
  256. package/dist/b2b-core-components/p-4e0ed246.entry.js +0 -1
  257. package/dist/b2b-core-components/p-b175fb79.entry.js +0 -1
  258. package/dist/b2b-core-components/p-b481eb09.entry.js +0 -1
  259. package/dist/b2b-core-components/p-c430b5ba.entry.js +0 -1
  260. package/dist/b2b-core-components/p-dff37884.entry.js +0 -1
  261. package/dist/b2b-core-components/p-e8151556.entry.js +0 -1
@@ -2404,10 +2404,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
2404
2404
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2405
2405
  /* webpackMode: "lazy" */
2406
2406
  './b2b-date-picker-days-header_4.cjs.entry.js')); }).then(processMod, consoleError);
2407
- case 'b2b-input_2.cjs':
2407
+ case 'b2b-input-list-option.cjs':
2408
2408
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2409
2409
  /* webpackMode: "lazy" */
2410
- './b2b-input_2.cjs.entry.js')); }).then(processMod, consoleError);
2410
+ './b2b-input-list-option.cjs.entry.js')); }).then(processMod, consoleError);
2411
2411
  case 'b2b-rounded-icon.cjs':
2412
2412
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2413
2413
  /* webpackMode: "lazy" */
@@ -2424,6 +2424,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
2424
2424
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2425
2425
  /* webpackMode: "lazy" */
2426
2426
  './b2b-headline.cjs.entry.js')); }).then(processMod, consoleError);
2427
+ case 'b2b-input.cjs':
2428
+ return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2429
+ /* webpackMode: "lazy" */
2430
+ './b2b-input.cjs.entry.js')); }).then(processMod, consoleError);
2427
2431
  case 'b2b-icon-100.cjs':
2428
2432
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2429
2433
  /* webpackMode: "lazy" */
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy(JSON.parse("[[\"b2b-date-range-picker.cjs\",[[1,\"b2b-date-range-picker\",{\"label\":[1],\"required\":[4],\"dateRange\":[1,\"date-range\"],\"disableDates\":[16],\"presets\":[16],\"invalid\":[4],\"hint\":[1],\"error\":[1],\"language\":[1],\"open\":[32],\"tempDate\":[32],\"internalDateRange\":[32],\"highlightDateRange\":[32],\"viewMode\":[32],\"viewedYear\":[32],\"viewedMonth\":[32],\"viewedDay\":[32]},[[0,\"b2b-date-picker-view-changed\",\"handleDatePickerViewChanged\"],[0,\"b2b-date-picker-previous-month\",\"previousMonth\"],[0,\"b2b-date-picker-next-month\",\"nextMonth\"],[0,\"b2b-date-picker-month-selected\",\"handleMonthSelected\"],[0,\"b2b-date-picker-year-selected\",\"handleYearSelected\"],[0,\"b2b-date-picker-escape\",\"handleEscapePress\"],[0,\"b2b-date-selected\",\"handleDateSelected\"]],{\"dateRange\":[\"updateDateRange\"]}]]],[\"b2b-date-picker.cjs\",[[1,\"b2b-date-picker\",{\"disablePastDates\":[4,\"disable-past-dates\"],\"disableFutureDates\":[4,\"disable-future-dates\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disableDates\":[1,\"disable-dates\"],\"label\":[1],\"required\":[516],\"preSelectedDate\":[1,\"pre-selected-date\"],\"showHint\":[4,\"show-hint\"],\"width\":[2],\"disableDays\":[1,\"disable-days\"],\"disableDatesUntil\":[1,\"disable-dates-until\"],\"disableDatesFrom\":[1,\"disable-dates-from\"],\"hint\":[1],\"placeholder\":[513],\"language\":[1],\"showDatePicker\":[32],\"focused\":[32],\"datePickerView\":[32],\"selectedMonth\":[32],\"selectedYear\":[32],\"selectedDay\":[32],\"selectedDate\":[32],\"userInputDate\":[32],\"invalid\":[32],\"errorMessage\":[32],\"datesToBeDisabled\":[32],\"normalizedDisableEvery\":[32],\"normalizedDisableDatesUntil\":[32],\"normalizedDisableDatesFrom\":[32]},[[0,\"b2b-date-picker-escape\",\"handleEscapePress\"],[0,\"b2b-date-selected\",\"handleDateSelection\"],[0,\"b2b-date-picker-previous-month\",\"getPreviousMonth\"],[0,\"b2b-date-picker-next-month\",\"getNextMonth\"],[0,\"b2b-date-picker-view-changed\",\"handleDatePickerViewChanged\"],[0,\"b2b-date-picker-month-selected\",\"handleMonthSelected\"],[0,\"b2b-date-picker-year-selected\",\"handleYearSelected\"]],{\"disableDates\":[\"handleDisableDatesChanged\"],\"disableDays\":[\"handleDisableDaysChanged\"],\"disableDatesUntil\":[\"handleDisableDatesUntilChanged\"],\"disableDatesFrom\":[\"handleDisableDatesFromChanged\"],\"disablePastDates\":[\"handleDisablePastDatesChanged\"],\"disableFutureDates\":[\"handleDisableFutureDatesChanged\"],\"disableWeekends\":[\"handleDisableWeekendsChanged\"]}]]],[\"b2b-search.cjs\",[[1,\"b2b-search\",{\"placeholder\":[1],\"optionsList\":[16],\"value\":[1537],\"disabled\":[516],\"closed\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-multiselect-dropdown.cjs\",[[1,\"b2b-multiselect-dropdown\",{\"label\":[1],\"placeholder\":[513],\"selectedValues\":[1,\"selected-values\"],\"optionsList\":[1,\"options-list\"],\"searchPlaceholder\":[1,\"search-placeholder\"],\"selectAllLabel\":[1,\"select-all-label\"],\"maxOptionsVisible\":[2,\"max-options-visible\"],\"required\":[516],\"invalid\":[516],\"errorMessage\":[1,\"error-message\"],\"hint\":[1],\"disabled\":[516],\"groupDisabled\":[4,\"group-disabled\"],\"currentSelectedValues\":[32],\"currentList\":[32],\"value\":[32],\"isElementFocused\":[32],\"isOpen\":[32],\"normalizedOptions\":[32],\"normalizedSelected\":[32],\"hasOptionList\":[32]},null,{\"optionsList\":[\"watchPropHandler\"],\"selectedValues\":[\"handleSelectedValuesChangeFromOutside\"],\"currentSelectedValues\":[\"handleSelectedValuesChange\"]}]]],[\"b2b-table-row.cjs\",[[1,\"b2b-table-row\",{\"highlight\":[4],\"color\":[1],\"selectable\":[4],\"size\":[1],\"value\":[1],\"indeterminate\":[4],\"checked\":[1028],\"isAccordionValue\":[32],\"isOpen\":[32],\"toggleAccordion\":[64]},[[0,\"b2b-change\",\"toggleSelected\"]]]]],[\"b2b-custom-dropdown.cjs\",[[1,\"b2b-custom-dropdown\",{\"placeholder\":[513],\"disabled\":[516],\"dropshadow\":[516],\"border\":[516],\"alignment\":[513],\"autoDisableSearch\":[4,\"auto-disable-search\"],\"opened\":[1028],\"noResultsText\":[1,\"no-results-text\"],\"selectedOption\":[32],\"value\":[32],\"allOptions\":[32],\"hasVisibleOptions\":[32]},[[0,\"b2b-custom-dropdown-option-selected\",\"handleOptionSelected\"],[4,\"click\",\"handleClickOutside\"]]]]],[\"b2b-wizard-step.cjs\",[[1,\"b2b-wizard-step\",{\"state\":[1],\"step\":[1],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-modal.cjs\",[[1,\"b2b-modal\",{\"heading\":[1],\"opened\":[1540],\"backdropDismiss\":[4,\"backdrop-dismiss\"],\"escDismiss\":[4,\"esc-dismiss\"],\"variant\":[1],\"iconHover\":[32],\"isOpen\":[32]},[[0,\"keydown\",\"handleKeypress\"]],{\"opened\":[\"openedChanged\"]}]]],[\"b2b-pagination.cjs\",[[1,\"b2b-pagination\",{\"totalPages\":[2,\"total-pages\"],\"activePage\":[1538,\"active-page\"],\"ariaLabelNextPage\":[1,\"aria-label-next-page\"],\"ariaLabelPreviousPage\":[1,\"aria-label-previous-page\"]},null,{\"totalPages\":[\"onTotalPagesChange\"],\"activePage\":[\"onActivePageChange\"]}]]],[\"b2b-time-picker.cjs\",[[1,\"b2b-time-picker\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"invalid\":[516],\"hint\":[1],\"interval\":[2],\"error\":[1],\"value\":[1537],\"hasFocus\":[32],\"isOpen\":[32],\"availableTimes\":[32],\"internalErrorMessage\":[32],\"internalInvalid\":[32]},null,{\"interval\":[\"handleIntervalChange\"],\"value\":[\"validateValue\"]}]]],[\"b2b-alert.cjs\",[[1,\"b2b-alert\",{\"type\":[1],\"size\":[1],\"opened\":[1028],\"hasCloseButton\":[4,\"has-close-button\"],\"customIcon\":[4,\"custom-icon\"]},null,{\"opened\":[\"openedChanged\"]}]]],[\"b2b-checkbox-group.cjs\",[[1,\"b2b-checkbox-group\",{\"label\":[1],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"alignment\":[1],\"hint\":[1],\"error\":[1]},[[0,\"b2b-change\",\"handleCheckboxChange\"]],{\"disabled\":[\"disabledChanged\"],\"invalid\":[\"invalidChanged\"]}]]],[\"b2b-custom-dropdown-option.cjs\",[[1,\"b2b-custom-dropdown-option\",{\"option\":[1],\"disabled\":[516],\"separator\":[4],\"selected\":[516],\"hoverIcon\":[520,\"hover-icon\"],\"hoverIconColor\":[513,\"hover-icon-color\"],\"selectedIcon\":[520,\"selected-icon\"],\"selectedIconColor\":[513,\"selected-icon-color\"],\"isHovered\":[32]},[[1,\"mouseenter\",\"handleMouseEnter\"],[1,\"mouseleave\",\"handleMouseLeave\"]]]]],[\"b2b-dropdown.cjs\",[[1,\"b2b-dropdown\",{\"label\":[1],\"required\":[516],\"name\":[513],\"placeholder\":[1],\"placeholderValue\":[1,\"placeholder-value\"],\"disabled\":[516],\"invalid\":[516],\"hint\":[1],\"error\":[1],\"groupDisabled\":[4,\"group-disabled\"],\"isOpen\":[32],\"focused\":[32],\"selectedValue\":[32],\"selectedText\":[32],\"options\":[32],\"truncatedText\":[32],\"clearSelection\":[64]},null,{\"isOpen\":[\"watchDropdownState\"]}]]],[\"b2b-radio-button.cjs\",[[1,\"b2b-radio-button\",{\"label\":[1],\"required\":[516],\"name\":[513],\"checked\":[1540],\"disabled\":[516],\"invalid\":[4],\"value\":[513],\"hint\":[1],\"error\":[1]}]]],[\"b2b-radio-group.cjs\",[[1,\"b2b-radio-group\",{\"name\":[1],\"label\":[1],\"required\":[4],\"alignment\":[1],\"disabled\":[516],\"invalid\":[516],\"hint\":[1],\"error\":[1],\"currentValue\":[32]},[[0,\"b2b-change\",\"handleRadioButtonChange\"]],{\"invalid\":[\"invalidChanged\"],\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-required-separator.cjs\",[[1,\"b2b-required-separator\",{\"label\":[1]}]]],[\"b2b-snackbar.cjs\",[[1,\"b2b-snackbar\",{\"description\":[1],\"type\":[1],\"opened\":[1540],\"timed\":[4],\"duration\":[2],\"hasAction\":[4,\"has-action\"],\"actionLabel\":[1,\"action-label\"],\"width\":[1]},null,{\"opened\":[\"onVisibleChange\"]}]]],[\"b2b-tab-group.cjs\",[[1,\"b2b-tab-group\",{\"useRouter\":[4,\"use-router\"]},[[0,\"click\",\"handleClick\"],[0,\"keydown\",\"handleKeydown\"]]]]],[\"b2b-textarea.cjs\",[[1,\"b2b-textarea\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"disabled\":[516],\"invalid\":[516],\"focusOnLoad\":[516,\"focus-on-load\"],\"resize\":[513],\"hint\":[1],\"error\":[1],\"value\":[1537],\"name\":[513],\"maxLength\":[514,\"max-length\"],\"height\":[1]}]]],[\"b2b-anchor.cjs\",[[1,\"b2b-anchor\",{\"href\":[1],\"download\":[1],\"target\":[1],\"size\":[1],\"hoverColor\":[1,\"hover-color\"],\"underlineText\":[4,\"underline-text\"]}]]],[\"b2b-breadcrumb.cjs\",[[1,\"b2b-breadcrumb\",{\"paddingTop\":[2,\"padding-top\"],\"paddingBottom\":[2,\"padding-bottom\"]},[[0,\"b2b-change\",\"onSelectedChange\"]]]]],[\"b2b-breadcrumb-item.cjs\",[[1,\"b2b-breadcrumb-item\",{\"href\":[1],\"value\":[8],\"active\":[1028]}]]],[\"b2b-card.cjs\",[[1,\"b2b-card\",{\"disabled\":[4],\"href\":[1],\"target\":[1]},[[0,\"click\",\"onClick\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"b2b-flyout-menu.cjs\",[[1,\"b2b-flyout-menu\",{\"opened\":[1028]},[[0,\"keydown\",\"handleKeyDown\"],[0,\"b2b-option-selected\",\"handleSelected\"],[4,\"click\",\"handleClickOutside\"]]]]],[\"b2b-flyout-menu-option.cjs\",[[1,\"b2b-flyout-menu-option\",{\"option\":[1],\"disabled\":[516],\"separator\":[4]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-grid.cjs\",[[1,\"b2b-grid\",{\"margin\":[2]}]]],[\"b2b-grid-col.cjs\",[[1,\"b2b-grid-col\",{\"span\":[514],\"textAlign\":[1,\"text-align\"]}]]],[\"b2b-grid-row.cjs\",[[1,\"b2b-grid-row\",{\"columnGap\":[2,\"column-gap\"],\"rowGap\":[2,\"row-gap\"],\"alignItems\":[1,\"align-items\"],\"justify\":[1]}]]],[\"b2b-icon.cjs\",[[1,\"b2b-icon\",{\"icon\":[1],\"color\":[1],\"size\":[1],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-icon-50.cjs\",[[1,\"b2b-icon-50\",{\"icon\":[1],\"color\":[1],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-label.cjs\",[[1,\"b2b-label\",{\"type\":[1]}]]],[\"b2b-progress-bar.cjs\",[[1,\"b2b-progress-bar\",{\"progress\":[2],\"label\":[1],\"labelType\":[1,\"label-type\"],\"labelPosition\":[1,\"label-position\"]}]]],[\"b2b-scrollable-container.cjs\",[[1,\"b2b-scrollable-container\"]]],[\"b2b-shimmer.cjs\",[[1,\"b2b-shimmer\",{\"loading\":[4],\"width\":[2],\"height\":[2]}]]],[\"b2b-tab.cjs\",[[1,\"b2b-tab\",{\"selected\":[516],\"disabled\":[4],\"invalid\":[4]},null,{\"selected\":[\"propagateChange\"]}]]],[\"b2b-tab-panel.cjs\",[[1,\"b2b-tab-panel\"]]],[\"b2b-table.cjs\",[[1,\"b2b-table\",{\"size\":[1]},[[0,\"b2b-change\",\"onColumnSelected\"]]]]],[\"b2b-table-rowgroup.cjs\",[[1,\"b2b-table-rowgroup\",{\"type\":[1],\"size\":[1],\"accordion\":[516],\"selectable\":[4],\"fixed\":[4],\"opened\":[516],\"selectedValues\":[32]},[[0,\"b2b-open\",\"handleOpenChange\"],[0,\"b2b-row-selected\",\"handleSelectedChange\"]]]]],[\"b2b-toggle-button.cjs\",[[1,\"b2b-toggle-button\",{\"label\":[1],\"name\":[513],\"checked\":[1540],\"disabled\":[516],\"value\":[513]}]]],[\"b2b-toggle-chip.cjs\",[[1,\"b2b-toggle-chip\",{\"label\":[1],\"value\":[520],\"name\":[513],\"active\":[1028],\"disabled\":[516]}]]],[\"b2b-toggle-group.cjs\",[[1,\"b2b-toggle-group\",{\"name\":[1],\"disabled\":[516],\"currentValue\":[32]},[[0,\"b2b-change\",\"handleToggleButtonChange\"]],{\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-toggle-switch.cjs\",[[1,\"b2b-toggle-switch\",{\"label\":[1],\"name\":[1],\"labelPosition\":[1,\"label-position\"],\"disabled\":[4],\"state\":[1028]}]]],[\"b2b-tooltip.cjs\",[[1,\"b2b-tooltip\",{\"position\":[1],\"content\":[1],\"trigger\":[1],\"opened\":[1540]},null,{\"opened\":[\"handleOpenedChange\"]}]]],[\"b2b-wizard.cjs\",[[1,\"b2b-wizard\",{\"activeStep\":[1,\"active-step\"],\"custom\":[4],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-rounded-icon.cjs\",[[1,\"b2b-rounded-icon\",{\"color\":[1],\"borderColor\":[1,\"border-color\"],\"contentColor\":[1,\"content-color\"]}]]],[\"b2b-wizard-icon.cjs\",[[1,\"b2b-wizard-icon\",{\"step\":[1],\"state\":[1],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-background-box.cjs\",[[1,\"b2b-background-box\",{\"maxWidth\":[4,\"max-width\"],\"noPadding\":[4,\"no-padding\"],\"borderTop\":[1,\"border-top\"],\"borderRight\":[1,\"border-right\"],\"borderBottom\":[1,\"border-bottom\"],\"borderLeft\":[1,\"border-left\"]}]]],[\"b2b-date-picker-days.cjs\",[[1,\"b2b-date-picker-days\",{\"selectedMonth\":[2,\"selected-month\"],\"selectedYear\":[2,\"selected-year\"],\"selectedDay\":[2,\"selected-day\"],\"disablePastDates\":[4,\"disable-past-dates\"],\"disableFutureDates\":[4,\"disable-future-dates\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disableDates\":[16],\"disableEvery\":[16],\"disableDatesUntil\":[16],\"disableDatesFrom\":[16],\"disabled\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-separator.cjs\",[[1,\"b2b-separator\",{\"alignment\":[1]}]]],[\"b2b-checkbox.cjs\",[[1,\"b2b-checkbox\",{\"label\":[1],\"required\":[516],\"checked\":[1540],\"disabled\":[516],\"indeterminate\":[1028],\"error\":[1],\"hint\":[1],\"name\":[513],\"value\":[520],\"invalid\":[4],\"standalone\":[4],\"groupDisabled\":[4,\"group-disabled\"]}]]],[\"b2b-headline.cjs\",[[1,\"b2b-headline\",{\"size\":[1],\"align\":[1],\"noMargin\":[4,\"no-margin\"]}]]],[\"b2b-input-label.cjs\",[[1,\"b2b-input-label\",{\"required\":[4],\"disabled\":[4]}]]],[\"b2b-input_2.cjs\",[[0,\"b2b-input-list-option\",{\"option\":[1]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"b2b-input\",{\"label\":[1],\"required\":[516],\"type\":[513],\"disabled\":[516],\"invalid\":[516],\"placeholder\":[513],\"value\":[1537],\"name\":[513],\"hint\":[1],\"error\":[1],\"focusOnLoad\":[4,\"focus-on-load\"],\"groupDisabled\":[4,\"group-disabled\"],\"inputTextAlign\":[1,\"input-text-align\"],\"hasFocus\":[32],\"hasTextPrefix\":[32],\"hasTextSuffix\":[32],\"setFocus\":[64],\"clearInput\":[64]}]]],[\"b2b-input-group_2.cjs\",[[1,\"b2b-input-list\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"optionsList\":[16],\"value\":[1537],\"disabled\":[516],\"groupDisabled\":[4,\"group-disabled\"],\"hasOptionList\":[32],\"isElementFocused\":[32]},[[0,\"keydown\",\"handleKeyDown\"]],{\"optionsList\":[\"watchPropHandler\"]}],[1,\"b2b-input-group\",{\"invalid\":[4],\"disabled\":[4],\"error\":[1],\"hint\":[1]},null,{\"invalid\":[\"invalidChanged\"],\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-chip-component_2.cjs\",[[0,\"b2b-multiselect-option\",{\"option\":[1],\"label\":[1],\"selected\":[1028],\"indeterminate\":[4]}],[1,\"b2b-chip-component\",{\"label\":[1],\"type\":[1],\"labelStyle\":[1,\"label-style\"],\"disabled\":[4],\"hasCloseButton\":[4,\"has-close-button\"],\"value\":[520],\"customMargin\":[1,\"custom-margin\"]}]]],[\"b2b-date-range-picker-days_2.cjs\",[[1,\"b2b-date-range-picker-days\",{\"viewedDate\":[1,\"viewed-date\"],\"firstDate\":[1,\"first-date\"],\"secondDate\":[1,\"second-date\"],\"disableDates\":[16],\"preview\":[4],\"viewedDay\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"b2b-paragraph\",{\"weight\":[1],\"size\":[1],\"align\":[1],\"margin\":[4],\"variant\":[1],\"display\":[1]}]]],[\"b2b-table-cell_2.cjs\",[[1,\"b2b-table-cell\",{\"textWrap\":[516,\"text-wrap\"],\"size\":[1],\"align\":[1],\"divider\":[4],\"color\":[1],\"colspan\":[2],\"totalCols\":[2,\"total-cols\"],\"useTextEllipsis\":[32]}],[1,\"b2b-table-header\",{\"divider\":[4],\"size\":[1],\"fixed\":[4],\"sortDirection\":[1537,\"sort-direction\"],\"sortId\":[1,\"sort-id\"],\"colspan\":[2],\"contentAlign\":[1,\"content-align\"],\"totalCols\":[2,\"total-cols\"],\"active\":[32],\"iconAlign\":[32]}]]],[\"b2b-button_2.cjs\",[[1,\"b2b-button\",{\"variant\":[1],\"type\":[1],\"size\":[1],\"width\":[1],\"disabled\":[516],\"loading\":[4],\"active\":[516],\"href\":[1],\"target\":[1],\"download\":[1],\"groupDisabled\":[4,\"group-disabled\"],\"setFocus\":[64]},[[2,\"click\",\"handleHostClick\"]]],[1,\"b2b-spinner\",{\"size\":[1],\"color\":[1]}]]],[\"b2b-icon-100.cjs\",[[1,\"b2b-icon-100\",{\"icon\":[1],\"color\":[1],\"size\":[2],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-date-picker-days-header_4.cjs\",[[1,\"b2b-date-picker-header\",{\"selectedMonth\":[2,\"selected-month\"],\"selectedYear\":[2,\"selected-year\"],\"language\":[1]}],[1,\"b2b-date-picker-days-header\",{\"language\":[1]}],[1,\"b2b-date-picker-months\",{\"selectedMonth\":[2,\"selected-month\"],\"language\":[1]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"b2b-date-picker-years\",{\"selectedYear\":[2,\"selected-year\"],\"yearsRange\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]]]"), options);
11
+ return index.bootstrapLazy(JSON.parse("[[\"b2b-date-range-picker.cjs\",[[1,\"b2b-date-range-picker\",{\"label\":[1],\"required\":[4],\"dateRange\":[1,\"date-range\"],\"disableDates\":[16],\"presets\":[16],\"invalid\":[4],\"hint\":[1],\"error\":[1],\"language\":[1],\"open\":[32],\"tempDate\":[32],\"internalDateRange\":[32],\"highlightDateRange\":[32],\"viewMode\":[32],\"viewedYear\":[32],\"viewedMonth\":[32],\"viewedDay\":[32]},[[0,\"b2b-date-picker-view-changed\",\"handleDatePickerViewChanged\"],[0,\"b2b-date-picker-previous-month\",\"previousMonth\"],[0,\"b2b-date-picker-next-month\",\"nextMonth\"],[0,\"b2b-date-picker-month-selected\",\"handleMonthSelected\"],[0,\"b2b-date-picker-year-selected\",\"handleYearSelected\"],[0,\"b2b-date-picker-escape\",\"handleEscapePress\"],[0,\"b2b-date-selected\",\"handleDateSelected\"]],{\"dateRange\":[\"updateDateRange\"]}]]],[\"b2b-date-picker.cjs\",[[1,\"b2b-date-picker\",{\"disablePastDates\":[4,\"disable-past-dates\"],\"disableFutureDates\":[4,\"disable-future-dates\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disableDates\":[1,\"disable-dates\"],\"label\":[1],\"required\":[516],\"preSelectedDate\":[1,\"pre-selected-date\"],\"showHint\":[4,\"show-hint\"],\"width\":[2],\"disableDays\":[1,\"disable-days\"],\"disableDatesUntil\":[1,\"disable-dates-until\"],\"disableDatesFrom\":[1,\"disable-dates-from\"],\"hint\":[1],\"placeholder\":[513],\"language\":[1],\"showDatePicker\":[32],\"focused\":[32],\"datePickerView\":[32],\"selectedMonth\":[32],\"selectedYear\":[32],\"selectedDay\":[32],\"selectedDate\":[32],\"userInputDate\":[32],\"invalid\":[32],\"errorMessage\":[32],\"datesToBeDisabled\":[32],\"normalizedDisableEvery\":[32],\"normalizedDisableDatesUntil\":[32],\"normalizedDisableDatesFrom\":[32]},[[0,\"b2b-date-picker-escape\",\"handleEscapePress\"],[0,\"b2b-date-selected\",\"handleDateSelection\"],[0,\"b2b-date-picker-previous-month\",\"getPreviousMonth\"],[0,\"b2b-date-picker-next-month\",\"getNextMonth\"],[0,\"b2b-date-picker-view-changed\",\"handleDatePickerViewChanged\"],[0,\"b2b-date-picker-month-selected\",\"handleMonthSelected\"],[0,\"b2b-date-picker-year-selected\",\"handleYearSelected\"]],{\"disableDates\":[\"handleDisableDatesChanged\"],\"disableDays\":[\"handleDisableDaysChanged\"],\"disableDatesUntil\":[\"handleDisableDatesUntilChanged\"],\"disableDatesFrom\":[\"handleDisableDatesFromChanged\"],\"disablePastDates\":[\"handleDisablePastDatesChanged\"],\"disableFutureDates\":[\"handleDisableFutureDatesChanged\"],\"disableWeekends\":[\"handleDisableWeekendsChanged\"]}]]],[\"b2b-search.cjs\",[[1,\"b2b-search\",{\"placeholder\":[1],\"optionsList\":[16],\"value\":[1537],\"disabled\":[516],\"closed\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-multiselect-dropdown.cjs\",[[1,\"b2b-multiselect-dropdown\",{\"label\":[1],\"placeholder\":[513],\"selectedValues\":[1,\"selected-values\"],\"optionsList\":[1,\"options-list\"],\"searchPlaceholder\":[1,\"search-placeholder\"],\"selectAllLabel\":[1,\"select-all-label\"],\"maxOptionsVisible\":[2,\"max-options-visible\"],\"required\":[516],\"invalid\":[516],\"errorMessage\":[1,\"error-message\"],\"hint\":[1],\"disabled\":[516],\"groupDisabled\":[4,\"group-disabled\"],\"currentSelectedValues\":[32],\"currentList\":[32],\"value\":[32],\"isElementFocused\":[32],\"isOpen\":[32],\"normalizedOptions\":[32],\"normalizedSelected\":[32],\"hasOptionList\":[32]},null,{\"optionsList\":[\"watchPropHandler\"],\"selectedValues\":[\"handleSelectedValuesChangeFromOutside\"],\"currentSelectedValues\":[\"handleSelectedValuesChange\"]}]]],[\"b2b-table-row.cjs\",[[1,\"b2b-table-row\",{\"highlight\":[4],\"color\":[1],\"selectable\":[4],\"size\":[1],\"value\":[1],\"indeterminate\":[4],\"checked\":[1028],\"isAccordionValue\":[32],\"isOpen\":[32],\"toggleAccordion\":[64]},[[0,\"b2b-change\",\"toggleSelected\"]]]]],[\"b2b-custom-dropdown.cjs\",[[1,\"b2b-custom-dropdown\",{\"placeholder\":[513],\"disabled\":[516],\"dropshadow\":[516],\"border\":[516],\"alignment\":[513],\"autoDisableSearch\":[4,\"auto-disable-search\"],\"opened\":[1028],\"noResultsText\":[1,\"no-results-text\"],\"selectedOption\":[32],\"value\":[32],\"allOptions\":[32],\"hasVisibleOptions\":[32]},[[0,\"b2b-custom-dropdown-option-selected\",\"handleOptionSelected\"],[4,\"click\",\"handleClickOutside\"]]]]],[\"b2b-dropdown.cjs\",[[1,\"b2b-dropdown\",{\"label\":[1],\"search\":[516],\"clear\":[516],\"required\":[516],\"name\":[513],\"placeholder\":[1],\"placeholderValue\":[1,\"placeholder-value\"],\"disabled\":[516],\"invalid\":[516],\"hint\":[1],\"error\":[1],\"groupDisabled\":[4,\"group-disabled\"],\"isOpen\":[32],\"focused\":[32],\"selectedValue\":[32],\"selectedText\":[32],\"options\":[32],\"searchValue\":[32],\"truncatedText\":[32],\"clearSelection\":[64]},null,{\"isOpen\":[\"watchDropdownState\"]}]]],[\"b2b-wizard-step.cjs\",[[1,\"b2b-wizard-step\",{\"state\":[1],\"step\":[1],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-modal.cjs\",[[1,\"b2b-modal\",{\"heading\":[1],\"opened\":[1540],\"backdropDismiss\":[4,\"backdrop-dismiss\"],\"escDismiss\":[4,\"esc-dismiss\"],\"variant\":[1],\"iconHover\":[32],\"isOpen\":[32]},[[0,\"keydown\",\"handleKeypress\"]],{\"opened\":[\"openedChanged\"]}]]],[\"b2b-pagination.cjs\",[[1,\"b2b-pagination\",{\"totalPages\":[2,\"total-pages\"],\"activePage\":[1538,\"active-page\"],\"ariaLabelNextPage\":[1,\"aria-label-next-page\"],\"ariaLabelPreviousPage\":[1,\"aria-label-previous-page\"]},null,{\"totalPages\":[\"onTotalPagesChange\"],\"activePage\":[\"onActivePageChange\"]}]]],[\"b2b-time-picker.cjs\",[[1,\"b2b-time-picker\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"invalid\":[516],\"hint\":[1],\"interval\":[2],\"error\":[1],\"value\":[1537],\"hasFocus\":[32],\"isOpen\":[32],\"availableTimes\":[32],\"internalErrorMessage\":[32],\"internalInvalid\":[32]},null,{\"interval\":[\"handleIntervalChange\"],\"value\":[\"validateValue\"]}]]],[\"b2b-alert.cjs\",[[1,\"b2b-alert\",{\"type\":[1],\"size\":[1],\"opened\":[1028],\"hasCloseButton\":[4,\"has-close-button\"],\"customIcon\":[4,\"custom-icon\"]},null,{\"opened\":[\"openedChanged\"]}]]],[\"b2b-checkbox-group.cjs\",[[1,\"b2b-checkbox-group\",{\"label\":[1],\"required\":[4],\"disabled\":[4],\"invalid\":[4],\"alignment\":[1],\"hint\":[1],\"error\":[1]},[[0,\"b2b-change\",\"handleCheckboxChange\"]],{\"disabled\":[\"disabledChanged\"],\"invalid\":[\"invalidChanged\"]}]]],[\"b2b-custom-dropdown-option.cjs\",[[1,\"b2b-custom-dropdown-option\",{\"option\":[1],\"disabled\":[516],\"separator\":[4],\"selected\":[516],\"hoverIcon\":[520,\"hover-icon\"],\"hoverIconColor\":[513,\"hover-icon-color\"],\"selectedIcon\":[520,\"selected-icon\"],\"selectedIconColor\":[513,\"selected-icon-color\"],\"isHovered\":[32]},[[1,\"mouseenter\",\"handleMouseEnter\"],[1,\"mouseleave\",\"handleMouseLeave\"]]]]],[\"b2b-radio-button.cjs\",[[1,\"b2b-radio-button\",{\"label\":[1],\"required\":[516],\"name\":[513],\"checked\":[1540],\"disabled\":[516],\"invalid\":[4],\"value\":[513],\"hint\":[1],\"error\":[1]}]]],[\"b2b-radio-group.cjs\",[[1,\"b2b-radio-group\",{\"name\":[1],\"label\":[1],\"required\":[4],\"alignment\":[1],\"disabled\":[516],\"invalid\":[516],\"hint\":[1],\"error\":[1],\"currentValue\":[32]},[[0,\"b2b-change\",\"handleRadioButtonChange\"]],{\"invalid\":[\"invalidChanged\"],\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-required-separator.cjs\",[[1,\"b2b-required-separator\",{\"label\":[1]}]]],[\"b2b-snackbar.cjs\",[[1,\"b2b-snackbar\",{\"description\":[1],\"type\":[1],\"opened\":[1540],\"timed\":[4],\"duration\":[2],\"hasAction\":[4,\"has-action\"],\"actionLabel\":[1,\"action-label\"],\"width\":[1]},null,{\"opened\":[\"onVisibleChange\"]}]]],[\"b2b-tab-group.cjs\",[[1,\"b2b-tab-group\",{\"useRouter\":[4,\"use-router\"]},[[0,\"click\",\"handleClick\"],[0,\"keydown\",\"handleKeydown\"]]]]],[\"b2b-textarea.cjs\",[[1,\"b2b-textarea\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"disabled\":[516],\"invalid\":[516],\"focusOnLoad\":[516,\"focus-on-load\"],\"resize\":[513],\"hint\":[1],\"error\":[1],\"value\":[1537],\"name\":[513],\"maxLength\":[514,\"max-length\"],\"height\":[1]}]]],[\"b2b-anchor.cjs\",[[1,\"b2b-anchor\",{\"href\":[1],\"download\":[1],\"target\":[1],\"size\":[1],\"hoverColor\":[1,\"hover-color\"],\"underlineText\":[4,\"underline-text\"]}]]],[\"b2b-breadcrumb.cjs\",[[1,\"b2b-breadcrumb\",{\"paddingTop\":[2,\"padding-top\"],\"paddingBottom\":[2,\"padding-bottom\"]},[[0,\"b2b-change\",\"onSelectedChange\"]]]]],[\"b2b-breadcrumb-item.cjs\",[[1,\"b2b-breadcrumb-item\",{\"href\":[1],\"value\":[8],\"active\":[1028]}]]],[\"b2b-card.cjs\",[[1,\"b2b-card\",{\"disabled\":[4],\"href\":[1],\"target\":[1]},[[0,\"click\",\"onClick\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"b2b-flyout-menu.cjs\",[[1,\"b2b-flyout-menu\",{\"opened\":[1028]},[[0,\"keydown\",\"handleKeyDown\"],[0,\"b2b-option-selected\",\"handleSelected\"],[4,\"click\",\"handleClickOutside\"]]]]],[\"b2b-flyout-menu-option.cjs\",[[1,\"b2b-flyout-menu-option\",{\"option\":[1],\"disabled\":[516],\"separator\":[4]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-grid.cjs\",[[1,\"b2b-grid\",{\"margin\":[2]}]]],[\"b2b-grid-col.cjs\",[[1,\"b2b-grid-col\",{\"span\":[514],\"textAlign\":[1,\"text-align\"]}]]],[\"b2b-grid-row.cjs\",[[1,\"b2b-grid-row\",{\"columnGap\":[2,\"column-gap\"],\"rowGap\":[2,\"row-gap\"],\"alignItems\":[1,\"align-items\"],\"justify\":[1]}]]],[\"b2b-icon.cjs\",[[1,\"b2b-icon\",{\"icon\":[1],\"color\":[1],\"size\":[1],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-icon-50.cjs\",[[1,\"b2b-icon-50\",{\"icon\":[1],\"color\":[1],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-label.cjs\",[[1,\"b2b-label\",{\"type\":[1]}]]],[\"b2b-progress-bar.cjs\",[[1,\"b2b-progress-bar\",{\"progress\":[2],\"label\":[1],\"labelType\":[1,\"label-type\"],\"labelPosition\":[1,\"label-position\"]}]]],[\"b2b-scrollable-container.cjs\",[[1,\"b2b-scrollable-container\"]]],[\"b2b-shimmer.cjs\",[[1,\"b2b-shimmer\",{\"loading\":[4],\"width\":[2],\"height\":[2]}]]],[\"b2b-tab.cjs\",[[1,\"b2b-tab\",{\"selected\":[516],\"disabled\":[4],\"invalid\":[4]},null,{\"selected\":[\"propagateChange\"]}]]],[\"b2b-tab-panel.cjs\",[[1,\"b2b-tab-panel\"]]],[\"b2b-table.cjs\",[[1,\"b2b-table\",{\"size\":[1]},[[0,\"b2b-change\",\"onColumnSelected\"]]]]],[\"b2b-table-rowgroup.cjs\",[[1,\"b2b-table-rowgroup\",{\"type\":[1],\"size\":[1],\"accordion\":[516],\"selectable\":[4],\"fixed\":[4],\"opened\":[516],\"selectedValues\":[32]},[[0,\"b2b-open\",\"handleOpenChange\"],[0,\"b2b-row-selected\",\"handleSelectedChange\"]]]]],[\"b2b-toggle-button.cjs\",[[1,\"b2b-toggle-button\",{\"label\":[1],\"name\":[513],\"checked\":[1540],\"disabled\":[516],\"value\":[513]}]]],[\"b2b-toggle-chip.cjs\",[[1,\"b2b-toggle-chip\",{\"label\":[1],\"value\":[520],\"name\":[513],\"active\":[1028],\"disabled\":[516]}]]],[\"b2b-toggle-group.cjs\",[[1,\"b2b-toggle-group\",{\"name\":[1],\"disabled\":[516],\"currentValue\":[32]},[[0,\"b2b-change\",\"handleToggleButtonChange\"]],{\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-toggle-switch.cjs\",[[1,\"b2b-toggle-switch\",{\"label\":[1],\"name\":[1],\"labelPosition\":[1,\"label-position\"],\"disabled\":[4],\"state\":[1028]}]]],[\"b2b-tooltip.cjs\",[[1,\"b2b-tooltip\",{\"position\":[1],\"content\":[1],\"trigger\":[1],\"opened\":[1540]},null,{\"opened\":[\"handleOpenedChange\"]}]]],[\"b2b-wizard.cjs\",[[1,\"b2b-wizard\",{\"activeStep\":[1,\"active-step\"],\"custom\":[4],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-icon-100.cjs\",[[1,\"b2b-icon-100\",{\"icon\":[1],\"color\":[1],\"size\":[2],\"clickable\":[4],\"focusable\":[4],\"pathData\":[32]},null,{\"icon\":[\"loadIconPathData\"]}]]],[\"b2b-wizard-icon.cjs\",[[1,\"b2b-wizard-icon\",{\"step\":[1],\"state\":[1],\"checkIcon\":[4,\"check-icon\"]}]]],[\"b2b-background-box.cjs\",[[1,\"b2b-background-box\",{\"maxWidth\":[4,\"max-width\"],\"noPadding\":[4,\"no-padding\"],\"borderTop\":[1,\"border-top\"],\"borderRight\":[1,\"border-right\"],\"borderBottom\":[1,\"border-bottom\"],\"borderLeft\":[1,\"border-left\"]}]]],[\"b2b-date-picker-days.cjs\",[[1,\"b2b-date-picker-days\",{\"selectedMonth\":[2,\"selected-month\"],\"selectedYear\":[2,\"selected-year\"],\"selectedDay\":[2,\"selected-day\"],\"disablePastDates\":[4,\"disable-past-dates\"],\"disableFutureDates\":[4,\"disable-future-dates\"],\"disableWeekends\":[4,\"disable-weekends\"],\"disableDates\":[16],\"disableEvery\":[16],\"disableDatesUntil\":[16],\"disableDatesFrom\":[16],\"disabled\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-input-list-option.cjs\",[[0,\"b2b-input-list-option\",{\"option\":[1]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-input-group_2.cjs\",[[1,\"b2b-input-list\",{\"label\":[1],\"required\":[516],\"placeholder\":[513],\"optionsList\":[1,\"options-list\"],\"value\":[1537],\"disabled\":[516],\"groupDisabled\":[4,\"group-disabled\"],\"hasOptionList\":[32],\"currentList\":[32],\"isElementFocused\":[32],\"searchValue\":[32]},[[0,\"keydown\",\"handleKeyDown\"]],{\"optionsList\":[\"watchPropHandler\"]}],[1,\"b2b-input-group\",{\"invalid\":[4],\"disabled\":[4],\"error\":[1],\"hint\":[1]},null,{\"invalid\":[\"invalidChanged\"],\"disabled\":[\"disabledChanged\"]}]]],[\"b2b-checkbox.cjs\",[[1,\"b2b-checkbox\",{\"label\":[1],\"required\":[516],\"checked\":[1540],\"disabled\":[516],\"indeterminate\":[1028],\"error\":[1],\"hint\":[1],\"name\":[513],\"value\":[520],\"invalid\":[4],\"standalone\":[4],\"groupDisabled\":[4,\"group-disabled\"]}]]],[\"b2b-chip-component_2.cjs\",[[0,\"b2b-multiselect-option\",{\"option\":[1],\"label\":[1],\"selected\":[1028],\"indeterminate\":[4]}],[1,\"b2b-chip-component\",{\"label\":[1],\"type\":[1],\"labelStyle\":[1,\"label-style\"],\"disabled\":[4],\"hasCloseButton\":[4,\"has-close-button\"],\"value\":[520],\"customMargin\":[1,\"custom-margin\"]}]]],[\"b2b-date-range-picker-days_2.cjs\",[[1,\"b2b-date-range-picker-days\",{\"viewedDate\":[1,\"viewed-date\"],\"firstDate\":[1,\"first-date\"],\"secondDate\":[1,\"second-date\"],\"disableDates\":[16],\"preview\":[4],\"viewedDay\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"b2b-paragraph\",{\"weight\":[1],\"size\":[1],\"align\":[1],\"margin\":[4],\"variant\":[1],\"display\":[1]}]]],[\"b2b-table-cell_2.cjs\",[[1,\"b2b-table-cell\",{\"textWrap\":[516,\"text-wrap\"],\"size\":[1],\"align\":[1],\"divider\":[4],\"color\":[1],\"colspan\":[2],\"totalCols\":[2,\"total-cols\"],\"useTextEllipsis\":[32]}],[1,\"b2b-table-header\",{\"divider\":[4],\"size\":[1],\"fixed\":[4],\"sortDirection\":[1537,\"sort-direction\"],\"sortId\":[1,\"sort-id\"],\"colspan\":[2],\"contentAlign\":[1,\"content-align\"],\"totalCols\":[2,\"total-cols\"],\"active\":[32],\"iconAlign\":[32]}]]],[\"b2b-rounded-icon.cjs\",[[1,\"b2b-rounded-icon\",{\"color\":[1],\"borderColor\":[1,\"border-color\"],\"contentColor\":[1,\"content-color\"]}]]],[\"b2b-separator.cjs\",[[1,\"b2b-separator\",{\"alignment\":[1]}]]],[\"b2b-input.cjs\",[[1,\"b2b-input\",{\"label\":[1],\"required\":[516],\"type\":[513],\"disabled\":[516],\"invalid\":[516],\"placeholder\":[513],\"value\":[1537],\"name\":[513],\"hint\":[1],\"error\":[1],\"focusOnLoad\":[4,\"focus-on-load\"],\"groupDisabled\":[4,\"group-disabled\"],\"inputTextAlign\":[1,\"input-text-align\"],\"hasFocus\":[32],\"hasTextPrefix\":[32],\"hasTextSuffix\":[32],\"setFocus\":[64],\"clearInput\":[64]}]]],[\"b2b-headline.cjs\",[[1,\"b2b-headline\",{\"size\":[1],\"align\":[1],\"noMargin\":[4,\"no-margin\"]}]]],[\"b2b-button_2.cjs\",[[1,\"b2b-button\",{\"variant\":[1],\"type\":[1],\"size\":[1],\"width\":[1],\"disabled\":[516],\"loading\":[4],\"active\":[516],\"href\":[1],\"target\":[1],\"download\":[1],\"groupDisabled\":[4,\"group-disabled\"],\"setFocus\":[64]},[[2,\"click\",\"handleHostClick\"]]],[1,\"b2b-spinner\",{\"size\":[1],\"color\":[1]}]]],[\"b2b-date-picker-days-header_4.cjs\",[[1,\"b2b-date-picker-header\",{\"selectedMonth\":[2,\"selected-month\"],\"selectedYear\":[2,\"selected-year\"],\"language\":[1]}],[1,\"b2b-date-picker-days-header\",{\"language\":[1]}],[1,\"b2b-date-picker-months\",{\"selectedMonth\":[2,\"selected-month\"],\"language\":[1]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"b2b-date-picker-years\",{\"selectedYear\":[2,\"selected-year\"],\"yearsRange\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]]]],[\"b2b-input-label.cjs\",[[1,\"b2b-input-label\",{\"required\":[4],\"disabled\":[4]}]]]]"), options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
@@ -236,11 +236,11 @@
236
236
  padding: 1.5rem;
237
237
  }
238
238
  :host(.b2b-background-box--max-width.b2b-background-box--no-padding) {
239
- max-width: 75.75rem;
239
+ max-width: 90rem;
240
240
  padding: unset;
241
241
  }
242
242
  :host(.b2b-background-box--max-width) {
243
- max-width: 72.75rem;
243
+ max-width: 90rem;
244
244
  }
245
245
  :host(.b2b-background-box--no-padding) {
246
246
  padding: unset;
@@ -32,7 +32,7 @@ describe('B2B-Background-Box', () => {
32
32
  const element = await page.find('b2b-background-box');
33
33
  expect(element).toEqualText('Background box component');
34
34
  const style = await element.getComputedStyle();
35
- expect(style.maxWidth).toBe('1212px');
35
+ expect(style.maxWidth).toBe('1440px');
36
36
  });
37
37
  it('should remove specific borders when set to none', async () => {
38
38
  page = await newE2EPage();
@@ -36,7 +36,7 @@ const meta = {
36
36
  <b2b-paragraph>
37
37
  The BackgroundBox component adjusts its width and padding based on two
38
38
  properties: maxWidth and noPadding. When maxWidth is true, it fills the
39
- available width until 1212px. The noPadding property controls internal
39
+ available width until 1440px. The noPadding property controls internal
40
40
  spacing—if true, no padding is applied; if false, a default padding of
41
41
  24px (1.5rem) is added. The height of the box depends on its internal
42
42
  content.
@@ -286,9 +286,6 @@
286
286
  line-height: var(--b2b-size-copy-line-height-75);
287
287
  user-select: none;
288
288
  }
289
- .b2b-checkbox--error {
290
- /* When an input is both checked AND has an error */
291
- }
292
289
  .b2b-checkbox--error .b2b-checkbox__input {
293
290
  background-color: var(--b2b-color-error-50);
294
291
  border: 1px solid var(--b2b-color-error-100);
@@ -296,6 +293,9 @@
296
293
  .b2b-checkbox--error span {
297
294
  color: var(--b2b-color-error-100);
298
295
  }
296
+ .b2b-checkbox--error {
297
+ /* When an input is both checked AND has an error */
298
+ }
299
299
  .b2b-checkbox--error.b2b-checkbox--checked .b2b-checkbox__input {
300
300
  background-color: var(--b2b-color-error-100);
301
301
  border-color: var(--b2b-color-error-100);
@@ -247,6 +247,16 @@
247
247
  box-sizing: border-box;
248
248
  flex: 1;
249
249
  }
250
+ :host(.b2b-dropdown) .b2b-dropdown__clear-icon {
251
+ position: absolute;
252
+ right: 3rem;
253
+ top: 40%;
254
+ transform: translateY(-50%);
255
+ width: 1rem;
256
+ height: 1rem;
257
+ cursor: pointer;
258
+ z-index: 2;
259
+ }
250
260
  :host(.b2b-dropdown) .b2b-dropdown__select {
251
261
  font-family: var(--b2b-font-family-default);
252
262
  font-size: var(--b2b-size-copy-100);
@@ -269,6 +279,7 @@
269
279
  text-align: left;
270
280
  overflow-x: auto;
271
281
  overflow-y: hidden;
282
+ align-items: center;
272
283
  }
273
284
  :host(.b2b-dropdown) .b2b-dropdown__select--focused {
274
285
  outline: 2px solid Highlight;
@@ -47,8 +47,52 @@ describe('B2B-Dropdown', () => {
47
47
  element = await page.find('b2b-dropdown');
48
48
  expect(element).toHaveClass('b2b-dropdown--error');
49
49
  });
50
+ it('ensure clear icon is visible when the clear is enabled', async () => {
51
+ const dropdown = await page.find('b2b-dropdown');
52
+ dropdown.setProperty('clear', true);
53
+ dropdown.setProperty('selectedText', 'Option 1');
54
+ await page.waitForChanges();
55
+ const clearIcon = await page.find('b2b-dropdown >>> b2b-icon-100.b2b-dropdown__clear-icon');
56
+ expect(clearIcon).not.toBeNull();
57
+ });
58
+ it('ensure clear icon is not visible when the clear is disabled', async () => {
59
+ const dropdown = await page.find('b2b-dropdown');
60
+ dropdown.setProperty('clear', false);
61
+ dropdown.setProperty('selectedText', 'Option 1');
62
+ await page.waitForChanges();
63
+ const clearIcon = await page.find('b2b-dropdown >>> b2b-icon-100.b2b-dropdown__clear-icon');
64
+ expect(clearIcon).toBeNull();
65
+ });
66
+ it('ensure text is cleared when clear icon is clicked', async () => {
67
+ const dropdown = await page.find('b2b-dropdown');
68
+ dropdown.setProperty('clear', true);
69
+ dropdown.setProperty('selectedText', 'Option 1');
70
+ await page.waitForChanges();
71
+ const clearIcon = await page.find('b2b-dropdown >>> b2b-icon-100.b2b-dropdown__clear-icon');
72
+ expect(clearIcon).not.toBeNull();
73
+ await clearIcon.click();
74
+ await page.waitForChanges();
75
+ const selectDisplay = await page.find('b2b-dropdown >>> .b2b-dropdown__select');
76
+ expect(await selectDisplay.textContent).not.toContain('Option 1');
77
+ expect(await selectDisplay.textContent).toContain('Select an option...');
78
+ });
79
+ it('ensure text is cleared when clear icon is clicked when search is enabled', async () => {
80
+ let dropdown = await page.find('b2b-dropdown');
81
+ dropdown.setProperty('search', true);
82
+ dropdown.setProperty('clear', true);
83
+ dropdown.setProperty('selectedText', 'Option 1');
84
+ await page.waitForChanges();
85
+ const clearIcon = await page.find('b2b-dropdown >>> b2b-icon-100.b2b-dropdown__clear-icon');
86
+ expect(clearIcon).not.toBeNull();
87
+ await clearIcon.click();
88
+ await page.waitForChanges();
89
+ const selectDisplay = await page.find('b2b-dropdown >>> .b2b-input');
90
+ expect(await selectDisplay.textContent).not.toContain('Option 1');
91
+ expect(await selectDisplay.textContent).toContain('');
92
+ });
50
93
  it('should clear the selection and reset to placeholder', async () => {
51
94
  let dropdown = await page.find('b2b-dropdown');
95
+ dropdown.setProperty('clear', true);
52
96
  await dropdown.callMethod('clearSelection');
53
97
  await page.waitForChanges();
54
98
  dropdown = await page.find('b2b-dropdown');
@@ -86,4 +130,33 @@ describe('B2B-Dropdown', () => {
86
130
  expect(texts).toContain('Apple');
87
131
  expect(texts).toContain('Banana');
88
132
  });
133
+ it('should filter options when search is enabled and user types in search input', async () => {
134
+ const page = await newE2EPage();
135
+ await page.setContent(`
136
+ <b2b-dropdown label="Search Fruits" search="true">
137
+ <option value="apple" id="apple">Apple</option>
138
+ <option value="banana" id="banana">Banana</option>
139
+ <option value="cherry" id="cherry">Cherry</option>
140
+ <option value="grape" id="grape">Grape</option>
141
+ <option value="orange" id="orange">Orange</option>
142
+ </b2b-dropdown>
143
+ `);
144
+ const dropdown = await page.find('b2b-dropdown');
145
+ await dropdown.click();
146
+ await page.waitForChanges();
147
+ const searchInput = await page.find('b2b-dropdown >>> .b2b-input');
148
+ expect(searchInput).not.toBeNull();
149
+ await searchInput.focus();
150
+ await searchInput.type('a');
151
+ await page.waitForChanges();
152
+ const visibleOptions = await page.findAll('b2b-dropdown >>> .b2b-dropdown__option');
153
+ expect(visibleOptions.length).toBe(4);
154
+ await searchInput.type('p');
155
+ await page.waitForChanges();
156
+ const filteredOptions = await page.findAll('b2b-dropdown >>> .b2b-dropdown__option');
157
+ expect(filteredOptions.length).toBe(2);
158
+ const optionTexts = await Promise.all(filteredOptions.map(async (opt) => await opt.getProperty('textContent')));
159
+ expect(optionTexts).toContain('Apple');
160
+ expect(optionTexts).toContain('Grape');
161
+ });
89
162
  });
@@ -18,6 +18,12 @@ export class DropdownComponent {
18
18
  this.focused = false;
19
19
  this.b2bBlur.emit(ev);
20
20
  };
21
+ this.clearSelectedValue = (event) => {
22
+ event.stopPropagation();
23
+ this.clearSelection();
24
+ this.searchValue = '';
25
+ this.b2bChange.emit(this.placeholderValue);
26
+ };
21
27
  this.onSelect = (event) => {
22
28
  var _a;
23
29
  const target = event.target;
@@ -46,7 +52,8 @@ export class DropdownComponent {
46
52
  }
47
53
  };
48
54
  this.updateTruncatedText = () => {
49
- const rawText = this.selectedText || this.placeholder;
55
+ const inputValue = this.search ? '' : this.placeholder;
56
+ const rawText = this.selectedText || inputValue;
50
57
  if (this.selectEl == null) {
51
58
  this.truncatedText = rawText;
52
59
  return;
@@ -81,7 +88,36 @@ export class DropdownComponent {
81
88
  }
82
89
  this.truncatedText = truncated + '…';
83
90
  };
91
+ this.handleSearchInput = (event) => {
92
+ if (this.selectedText &&
93
+ event.target.value !== this.selectedText) {
94
+ this.selectedText = '';
95
+ this.selectedValue = this.placeholderValue;
96
+ this.options = this.options.map(opt => (Object.assign(Object.assign({}, opt), { selected: false })));
97
+ }
98
+ this.searchValue = event.target.value;
99
+ this.isOpen = true;
100
+ };
101
+ this.toggleDropdownWithSearch = (event) => {
102
+ event.stopPropagation();
103
+ this.toggleDropdown();
104
+ if (this.isOpen) {
105
+ this.focusSearchInput();
106
+ }
107
+ };
108
+ this.focusSearchInput = () => {
109
+ var _a, _b;
110
+ const inputComponent = (_a = this.hostElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('b2b-input');
111
+ if (inputComponent != null) {
112
+ const inputElement = (_b = inputComponent.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('input');
113
+ if (inputElement != null) {
114
+ inputElement.focus();
115
+ }
116
+ }
117
+ };
84
118
  this.label = undefined;
119
+ this.search = false;
120
+ this.clear = false;
85
121
  this.required = false;
86
122
  this.name = undefined;
87
123
  this.placeholder = 'Select an option...';
@@ -96,6 +132,7 @@ export class DropdownComponent {
96
132
  this.selectedValue = '';
97
133
  this.selectedText = '';
98
134
  this.options = [];
135
+ this.searchValue = '';
99
136
  this.truncatedText = '';
100
137
  }
101
138
  /** Method to programmatically clear selection of the dropdown. */
@@ -172,15 +209,25 @@ export class DropdownComponent {
172
209
  const hasError = this.invalid && !this.disabled && !this.groupDisabled;
173
210
  const showHint = this.hint && !hasError;
174
211
  const showError = this.error && hasError;
175
- return (h(Host, { key: 'd8d3296f63b4cd704e43ae30e465589d14445ec2', class: {
212
+ const filteredOptions = this.options.filter(opt => opt.label.toLowerCase().includes(this.searchValue.toLowerCase()));
213
+ return (h(Host, { key: '785fa8173bebeb605d409ea84ca3e334006336ab', class: {
176
214
  'b2b-dropdown': true,
177
215
  'b2b-dropdown--error': hasError,
178
216
  'b2b-dropdown--disabled': this.disabled || this.groupDisabled,
179
- } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("div", { key: '642ed6f5d43c69b490aa1a22ec7679b571519c19', class: "b2b-dropdown__wrapper", onFocus: this.onFocus, onBlur: this.onBlur }, h("div", { key: '6e9b9bc869a7307f175dd524b749de54e87fd5ed', class: {
217
+ } }, this.label && (h("b2b-input-label", { id: this.name, required: this.required }, this.label)), h("div", { key: 'f1d77d99955532bf600ab91d36b716d1f02ede62', class: "b2b-dropdown__wrapper", onFocus: this.onFocus, onBlur: this.onBlur }, this.search ? (h("b2b-input", { placeholder: this.placeholder, invalid: hasError, value: this.truncatedText || this.searchValue, disabled: this.disabled || this.groupDisabled, "onB2b-focus": () => {
218
+ this.isOpen = true;
219
+ this.focused = true;
220
+ }, "onB2b-input": this.handleSearchInput }, h("div", { slot: "end" }, (this.selectedText || this.searchValue) &&
221
+ !this.disabled &&
222
+ !this.groupDisabled &&
223
+ this.clear && (h("b2b-icon-100", { class: "b2b-dropdown__clear-icon", icon: 'b2b_icon-close', clickable: true, onClick: this.clearSelectedValue })), h("b2b-icon-100", { class: "b2b-dropdown__arrow-icon", icon: 'b2b_icon-arrow-down', onClick: this.toggleDropdownWithSearch })))) : (h("div", { class: {
180
224
  'b2b-dropdown__select': true,
181
225
  'b2b-dropdown__select--open': this.isOpen,
182
226
  'b2b-dropdown__select--focused': this.focused,
183
- }, ref: el => (this.selectEl = el), onClick: this.toggleDropdown, role: "combobox", "aria-expanded": `${this.isOpen}`, "aria-labelledby": this.name }, this.truncatedText), this.isOpen && (h("div", { class: "b2b-dropdown__options", role: "listbox" }, this.options.map(option => (h("div", { key: option.value, class: {
227
+ }, ref: el => (this.selectEl = el), onClick: this.toggleDropdown, role: "combobox", "aria-expanded": `${this.isOpen}`, "aria-labelledby": this.name }, this.truncatedText, this.selectedText &&
228
+ !this.disabled &&
229
+ !this.groupDisabled &&
230
+ this.clear && (h("b2b-icon-100", { class: "b2b-dropdown__clear-icon", onClick: this.clearSelectedValue, clickable: true, icon: 'b2b_icon-close' })))), this.isOpen && (h("div", { class: "b2b-dropdown__options", role: "listbox" }, filteredOptions.map(option => (h("div", { key: option.value, class: {
184
231
  'b2b-dropdown__option': true,
185
232
  'b2b-dropdown__option--selected': option.selected,
186
233
  'b2b-dropdown__option--disabled': option.disabled,
@@ -217,6 +264,42 @@ export class DropdownComponent {
217
264
  "attribute": "label",
218
265
  "reflect": false
219
266
  },
267
+ "search": {
268
+ "type": "boolean",
269
+ "mutable": false,
270
+ "complexType": {
271
+ "original": "boolean",
272
+ "resolved": "boolean",
273
+ "references": {}
274
+ },
275
+ "required": false,
276
+ "optional": false,
277
+ "docs": {
278
+ "tags": [],
279
+ "text": "Enables the search functionality when set to true within the dropdown. By default search is disabled."
280
+ },
281
+ "attribute": "search",
282
+ "reflect": true,
283
+ "defaultValue": "false"
284
+ },
285
+ "clear": {
286
+ "type": "boolean",
287
+ "mutable": false,
288
+ "complexType": {
289
+ "original": "boolean",
290
+ "resolved": "boolean",
291
+ "references": {}
292
+ },
293
+ "required": false,
294
+ "optional": false,
295
+ "docs": {
296
+ "tags": [],
297
+ "text": "Adds a clear button to the select to clear the current selection."
298
+ },
299
+ "attribute": "clear",
300
+ "reflect": true,
301
+ "defaultValue": "false"
302
+ },
220
303
  "required": {
221
304
  "type": "boolean",
222
305
  "mutable": false,
@@ -388,6 +471,7 @@ export class DropdownComponent {
388
471
  "selectedValue": {},
389
472
  "selectedText": {},
390
473
  "options": {},
474
+ "searchValue": {},
391
475
  "truncatedText": {}
392
476
  };
393
477
  }
@@ -1,7 +1,7 @@
1
1
  import { userEvent } from "@storybook/test";
2
2
  import { html } from "lit-html";
3
3
  import { getArgTypes } from "../../docs/config/utils";
4
- const Template = ({ label = 'Favorite Fruit', required, name, disabled, invalid, hint, error, selected = false, }) => {
4
+ const Template = ({ label = 'Favorite Fruit', required, name, disabled, invalid, hint, error, search, clear, selected = false, }) => {
5
5
  return html `<b2b-dropdown
6
6
  label="${label}"
7
7
  name="${name}"
@@ -9,12 +9,16 @@ const Template = ({ label = 'Favorite Fruit', required, name, disabled, invalid,
9
9
  hint="${hint}"
10
10
  disabled="${disabled}"
11
11
  invalid="${invalid}"
12
- required="${required}">
12
+ required="${required}"
13
+ search="${search}"
14
+ clear="${clear}">
13
15
  <option value="strawberry">Strawberry</option>
14
16
  <option value="orange">Orange</option>
15
17
  <option value="banana">Banana</option>
16
18
  ${selected
17
- ? html `<option value="pineapple" selected="true">Pineapple</option>`
19
+ ? html `<option value="pineapple" selected="true" clear="true">
20
+ Pineapple
21
+ </option>`
18
22
  : html `<option value="pineapple">Pineapple</option>`}
19
23
  <option value="grapes">Grapes</option>
20
24
  <option value="watermelon">Watermelon</option>
@@ -33,6 +37,8 @@ const defaultArgs = {
33
37
  invalid: false,
34
38
  hint: 'Pick one',
35
39
  error: 'Not that one!',
40
+ search: false,
41
+ clear: false,
36
42
  };
37
43
  export const story010Default = Template.bind({});
38
44
  story010Default.args = Object.assign({}, defaultArgs);
@@ -57,6 +63,12 @@ story050Selected.play = async ({ canvasElement }) => {
57
63
  await userEvent.click(wrapper);
58
64
  }, 500);
59
65
  };
66
+ export const story060Search = Template.bind({});
67
+ story060Search.args = Object.assign(Object.assign({}, defaultArgs), { search: true });
68
+ story060Search.storyName = 'Search';
69
+ export const story070Clear = Template.bind({});
70
+ story070Clear.args = Object.assign(Object.assign({}, defaultArgs), { selected: true, clear: true });
71
+ story070Clear.storyName = 'Clear';
60
72
  const dropdownArgs = getArgTypes('b2b-dropdown');
61
73
  export default {
62
74
  title: 'Components/Form/Dropdown',
@@ -16,7 +16,7 @@ export class FlyoutMenuOptionComponent {
16
16
  }
17
17
  }
18
18
  render() {
19
- return (h(Host, { key: 'd9f5fada05c44e475d2e645d51c3ba268844a8e3', class: {
19
+ return (h(Host, { key: '4064c5827dffd55637271a59061a2c2abb54d3ca', class: {
20
20
  'b2b-flyout-menu__option': true,
21
21
  'b2b-flyout-menu__option--disabled': this.disabled,
22
22
  'b2b-flyout-menu__option--separator': this.separator,
@@ -232,9 +232,6 @@
232
232
  .b2b-flyout-menu {
233
233
  position: relative;
234
234
  display: inline !important;
235
- /* this is a workaround to force purgecss to include the overwrites of
236
- the variables --b2b-border-right and --b2b-border-radius
237
- */
238
235
  }
239
236
  .b2b-flyout-menu__trigger {
240
237
  cursor: pointer;
@@ -282,6 +279,11 @@
282
279
  transform: translateX(3px) translateY(3px) rotate(45deg);
283
280
  width: 0.875rem;
284
281
  }
282
+ .b2b-flyout-menu {
283
+ /* this is a workaround to force purgecss to include the overwrites of
284
+ the variables --b2b-border-right and --b2b-border-radius
285
+ */
286
+ }
285
287
  .b2b-flyout-menu .purge-css-include-variables {
286
288
  border-radius: var(--b2b-border-radius);
287
289
  border-right: var(--b2b-border-right);
@@ -144,12 +144,12 @@ export class FlyoutMenuComponent {
144
144
  options[index].focus();
145
145
  }
146
146
  render() {
147
- return (h(Host, { key: '5e1d292b710d19a4bf5ece7047d4c5288b24f9b5' }, h("div", { key: 'd7d781fa8dfdd9f4bdecad06209400610a7f37bf', class: {
147
+ return (h(Host, { key: '03efeb4e28ef04b0719b3ade8e52d20cf3046372' }, h("div", { key: 'e2508205d7402d2ed8ef031c8ab5483a6fbdedbd', class: {
148
148
  'b2b-flyout-menu': true,
149
- } }, h("div", { key: '124c0ee9f83a252aabac1f09a11932ffde4b6bf1', class: "b2b-flyout-menu__trigger" }, h("slot", { key: '588027fd799f42d6b095ad82247cc6974424fc23', name: "trigger" })), h("div", { key: 'baa37193ac12427e868c6742a526516f91e37a02', onFocusout: this.blurMenu, class: {
149
+ } }, h("div", { key: 'c6283f5ebff4ec0962face0e0f440e2cf0ec9ceb', class: "b2b-flyout-menu__trigger" }, h("slot", { key: '303181fa8dac70e463b0efa7fa18a339c84b7009', name: "trigger" })), h("div", { key: 'ff4058c24c1c84c967316569bee8d75d49497eba', onFocusout: this.blurMenu, class: {
150
150
  'b2b-flyout-menu__options__container': true,
151
151
  'b2b-flyout-menu__options__container--on': this.opened,
152
- } }, h("div", { key: '043ff6439dca6d4fccaa29f4bda5c52645154196', class: "b2b-flyout-menu__arrow" }), h("slot", { key: 'e95bcf37c9d1fc77509fbdf2de47001d88d7630a', name: "option" })))));
152
+ } }, h("div", { key: '860224aa691a4c06814731aca94d85a762fc806b', class: "b2b-flyout-menu__arrow" }), h("slot", { key: 'be5a754361d59fdbdf5ac934b0d1f5b50de8e3a1', name: "option" })))));
153
153
  }
154
154
  static get is() { return "b2b-flyout-menu"; }
155
155
  static get encapsulation() { return "shadow"; }
@@ -13,7 +13,7 @@ export class B2bGridColumnComponent {
13
13
  this.textAlign = 'left';
14
14
  }
15
15
  render() {
16
- return (h(Host, { key: 'ca84abbad02173e29f80329a4faab238aa41ec9d', style: Object.assign(Object.assign({}, this.calculateGrowDimension(this.span)), { ['text-align']: `${this.textAlign}` }) }, h("slot", { key: 'e11625544ba0b0fc501ff811e8f5ca1ac89194c9' })));
16
+ return (h(Host, { key: 'e6a06fd72fd364f57b423bdc69cd9c2d4a87d0ca', style: Object.assign(Object.assign({}, this.calculateGrowDimension(this.span)), { ['text-align']: `${this.textAlign}` }) }, h("slot", { key: 'd5785321b8ae17e90fd3aa9e69cc8911430d3e8c' })));
17
17
  }
18
18
  static get is() { return "b2b-grid-col"; }
19
19
  static get encapsulation() { return "shadow"; }
@@ -4,7 +4,7 @@ export class B2bGridComponent {
4
4
  this.margin = 24;
5
5
  }
6
6
  render() {
7
- return (h(Host, { key: '01c61abbb9d20b4479031e0545967f08782650dc', style: { ['padding']: `${this.margin}px` }, class: "b2b-grid" }, h("slot", { key: '64a173edfae1ff772091163fecc55bebdc2462b9' })));
7
+ return (h(Host, { key: '0a61abf781f924eb4b88ceb02bece63d2a39f76b', style: { ['padding']: `${this.margin}px` }, class: "b2b-grid" }, h("slot", { key: '02903dbdba9c4973573bac7be02b0e6d3a9cd71a' })));
8
8
  }
9
9
  static get is() { return "b2b-grid"; }
10
10
  static get encapsulation() { return "shadow"; }
@@ -66,7 +66,7 @@ export class B2bGridRowComponent {
66
66
  });
67
67
  }
68
68
  render() {
69
- return (h(Host, { key: '019e65e7db27c37305f49e396389c72fbcf82281', style: {
69
+ return (h(Host, { key: '60ea771fe5da5fc9aa305824f6718d5f1d687374', style: {
70
70
  ['justify-content']: `${this.justify}`,
71
71
  ['gap']: `${this.columnGap}px`,
72
72
  ['margin']: `${this.rowGap}px 0`,
@@ -74,7 +74,7 @@ export class B2bGridRowComponent {
74
74
  ['display']: 'flex',
75
75
  ['flex-wrap']: 'wrap',
76
76
  ['box-sizing']: 'border-box',
77
- } }, h("slot", { key: 'e203c9bde0b21f923b356b6e330ab6e4227fd1a5' })));
77
+ } }, h("slot", { key: 'f38f2b66439b0d8820aa2b25ab88f2c7e02d4ae5' })));
78
78
  }
79
79
  static get is() { return "b2b-grid-row"; }
80
80
  static get encapsulation() { return "shadow"; }
@@ -98,18 +98,18 @@ export class InputComponent {
98
98
  this.filterHintSlotContent();
99
99
  }
100
100
  render() {
101
- return (h(Host, { key: 'b18e9dad8fdc84804b77049fd7b94c6b05541c3f', class: {
101
+ return (h(Host, { key: '69031aea30430dd03e384611a5f351f9e4411583', class: {
102
102
  'b2b-input': true,
103
103
  'b2b-input--error': this.invalid && !this.disabled,
104
- } }, (this.label || this.labelSlot) && (h("b2b-input-label", { id: this.name, required: this.required }, h("slot", { name: "label" }, this.label))), h("div", { key: '655f632484049add498904c26d766670eb3b9203', class: {
104
+ } }, (this.label || this.labelSlot) && (h("b2b-input-label", { id: this.name, required: this.required }, h("slot", { name: "label" }, this.label))), h("div", { key: '5e17439f86886dd04cf3a0bc42f83e75c060e3d9', class: {
105
105
  'b2b-input__wrapper': true,
106
106
  'b2b-input__wrapper--focused': this.hasFocus,
107
107
  'b2b-input__wrapper--disabled': this.disabled || this.groupDisabled,
108
- } }, h("slot", { key: '1d0650fa02aa56cf183a8c3c89e5791a53c54944', name: "start" }), this.hasTextPrefix && h("div", { class: "border" }), h("input", { key: '88e9aa5076bd6dd59eafac8491d6fafc9eec8b5e', class: {
108
+ } }, h("slot", { key: '69d66dec8cdd7bf0de111e32395812bdee4fe006', name: "start" }), this.hasTextPrefix && h("div", { class: "border" }), h("input", { key: 'e2fd5a7753d9543dc0093dba0a611f653a5862df', class: {
109
109
  'b2b-input__native-input': true,
110
110
  ['b2b-input__native-input--align-' + this.inputTextAlign]: true,
111
111
  'b2b-input__native-input--disabled': this.disabled || this.groupDisabled,
112
- }, "aria-labelledby": this.name, type: this.type, placeholder: this.placeholder, value: this.value, name: this.name, disabled: this.disabled || this.groupDisabled, autoFocus: this.focusOnLoad, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, ref: el => (this.focusableElement = el) }), this.hasTextSuffix && h("div", { class: "border" }), h("slot", { key: 'c93445fb93de27a7e1d4681bc7a48d44bb8baa1a', name: "end" })), (this.hint !== undefined || this.hintSlot) &&
112
+ }, "aria-labelledby": this.name, type: this.type, placeholder: this.placeholder, value: this.value, name: this.name, disabled: this.disabled || this.groupDisabled, autoFocus: this.focusOnLoad, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, ref: el => (this.focusableElement = el) }), this.hasTextSuffix && h("div", { class: "border" }), h("slot", { key: '28bc5adffc6b4144e87904a9a059fd609661ac75', name: "end" })), (this.hint !== undefined || this.hintSlot) &&
113
113
  (!this.invalid || this.disabled || this.groupDisabled) ? (h("span", null, h("slot", { name: "hint" }, this.hint))) : (''), this.error !== undefined && this.invalid && !this.disabled ? (h("span", null, this.error)) : ('')));
114
114
  }
115
115
  static get is() { return "b2b-input"; }