@otto-de/b2b-core-components 1.14.1 → 1.15.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 (312) hide show
  1. package/dist/b2b-core-components/b2b-core-components.css +1 -1
  2. package/dist/b2b-core-components/b2b-core-components.esm.js +1 -1
  3. package/dist/b2b-core-components/p-02f15c3b.entry.js +1 -0
  4. package/dist/b2b-core-components/p-038a0f4a.entry.js +1 -0
  5. package/dist/b2b-core-components/{p-b8e93522.entry.js → p-062b3042.entry.js} +1 -1
  6. package/dist/b2b-core-components/p-0fcdf7c2.entry.js +1 -0
  7. package/dist/b2b-core-components/p-189f3e25.entry.js +1 -0
  8. package/dist/b2b-core-components/p-1bfac51e.entry.js +1 -0
  9. package/dist/b2b-core-components/p-1feda700.entry.js +1 -0
  10. package/dist/b2b-core-components/p-343078a1.entry.js +1 -0
  11. package/dist/b2b-core-components/p-37d472be.entry.js +1 -0
  12. package/dist/b2b-core-components/p-3b0998d6.entry.js +1 -0
  13. package/dist/b2b-core-components/p-43736fcf.entry.js +1 -0
  14. package/dist/b2b-core-components/p-45d76e40.entry.js +1 -0
  15. package/dist/b2b-core-components/p-4920527a.entry.js +1 -0
  16. package/dist/b2b-core-components/p-4b431289.entry.js +1 -0
  17. package/dist/b2b-core-components/p-4b96e3f1.entry.js +1 -0
  18. package/dist/b2b-core-components/{p-0e1e9948.entry.js → p-4c411fa7.entry.js} +1 -1
  19. package/dist/b2b-core-components/p-5139e33a.entry.js +1 -0
  20. package/dist/b2b-core-components/p-56692503.entry.js +1 -0
  21. package/dist/b2b-core-components/p-57a450fb.entry.js +1 -0
  22. package/dist/b2b-core-components/p-5bb55ce2.entry.js +1 -0
  23. package/dist/b2b-core-components/p-695df630.entry.js +1 -0
  24. package/dist/b2b-core-components/p-6a1be129.entry.js +1 -0
  25. package/dist/b2b-core-components/p-7a82ba07.entry.js +1 -0
  26. package/dist/b2b-core-components/p-7ba3e59f.entry.js +1 -0
  27. package/dist/b2b-core-components/p-7e288599.entry.js +1 -0
  28. package/dist/b2b-core-components/p-7e59c92f.entry.js +1 -0
  29. package/dist/b2b-core-components/p-8000be8d.entry.js +1 -0
  30. package/dist/b2b-core-components/p-827e29e8.entry.js +1 -0
  31. package/dist/b2b-core-components/p-8b63166d.entry.js +1 -0
  32. package/dist/b2b-core-components/p-8bde6dd3.entry.js +1 -0
  33. package/dist/b2b-core-components/p-915b5435.entry.js +1 -0
  34. package/dist/b2b-core-components/{p-43c7ee9e.entry.js → p-9983bb49.entry.js} +1 -1
  35. package/dist/b2b-core-components/p-9a655bb8.entry.js +1 -0
  36. package/dist/b2b-core-components/p-a7bf8a8d.entry.js +1 -0
  37. package/dist/b2b-core-components/p-a82d46df.entry.js +1 -0
  38. package/dist/b2b-core-components/p-ab5470b1.entry.js +1 -0
  39. package/dist/b2b-core-components/p-ae29c479.entry.js +1 -0
  40. package/dist/b2b-core-components/p-b2cc9955.entry.js +1 -0
  41. package/dist/b2b-core-components/p-b6545cbd.entry.js +1 -0
  42. package/dist/b2b-core-components/p-b97cce50.entry.js +1 -0
  43. package/dist/b2b-core-components/p-c0ac6164.entry.js +1 -0
  44. package/dist/b2b-core-components/p-c46f674e.entry.js +1 -0
  45. package/dist/b2b-core-components/p-c95e15c5.entry.js +1 -0
  46. package/dist/b2b-core-components/p-cff628e7.entry.js +1 -0
  47. package/dist/b2b-core-components/p-db67d6f7.entry.js +1 -0
  48. package/dist/b2b-core-components/p-e78ef517.entry.js +1 -0
  49. package/dist/b2b-core-components/p-eea515b3.entry.js +1 -0
  50. package/dist/b2b-core-components/p-f727e8dc.entry.js +1 -0
  51. package/dist/cjs/b2b-alert.cjs.entry.js +1 -1
  52. package/dist/cjs/b2b-anchor.cjs.entry.js +1 -1
  53. package/dist/cjs/b2b-breadcrumb-item.cjs.entry.js +1 -1
  54. package/dist/cjs/b2b-breadcrumb.cjs.entry.js +1 -1
  55. package/dist/cjs/b2b-button_2.cjs.entry.js +2 -2
  56. package/dist/cjs/b2b-calendar-days_3.cjs.entry.js +3 -3
  57. package/dist/cjs/b2b-calendar.cjs.entry.js +1 -1
  58. package/dist/cjs/b2b-card.cjs.entry.js +1 -1
  59. package/dist/cjs/b2b-checkbox-group.cjs.entry.js +1 -1
  60. package/dist/cjs/b2b-checkbox.cjs.entry.js +1 -1
  61. package/dist/cjs/b2b-chip-component_2.cjs.entry.js +2 -2
  62. package/dist/cjs/b2b-core-components.cjs.js +1 -1
  63. package/dist/cjs/b2b-dropdown.cjs.entry.js +1 -1
  64. package/dist/cjs/b2b-flyout-menu-option.cjs.entry.js +1 -1
  65. package/dist/cjs/b2b-flyout-menu.cjs.entry.js +1 -1
  66. package/dist/cjs/b2b-headline.cjs.entry.js +1 -1
  67. package/dist/cjs/b2b-icon-100.cjs.entry.js +1 -1
  68. package/dist/cjs/b2b-icon-50.cjs.entry.js +1 -1
  69. package/dist/cjs/b2b-icon.cjs.entry.js +1 -1
  70. package/dist/cjs/b2b-input-group_2.cjs.entry.js +2 -2
  71. package/dist/cjs/b2b-input-label.cjs.entry.js +1 -1
  72. package/dist/cjs/b2b-input_2.cjs.entry.js +9 -5
  73. package/dist/cjs/b2b-label.cjs.entry.js +1 -1
  74. package/dist/cjs/b2b-modal.cjs.entry.js +1 -1
  75. package/dist/cjs/b2b-multiselect-dropdown.cjs.entry.js +1 -1
  76. package/dist/cjs/b2b-pagination.cjs.entry.js +1 -1
  77. package/dist/cjs/b2b-paragraph.cjs.entry.js +1 -1
  78. package/dist/cjs/b2b-progress-bar.cjs.entry.js +1 -1
  79. package/dist/cjs/b2b-radio-button.cjs.entry.js +1 -1
  80. package/dist/cjs/b2b-radio-group.cjs.entry.js +1 -1
  81. package/dist/cjs/b2b-required-separator.cjs.entry.js +1 -1
  82. package/dist/cjs/b2b-rounded-icon.cjs.entry.js +1 -1
  83. package/dist/cjs/b2b-scrollable-container.cjs.entry.js +1 -1
  84. package/dist/cjs/b2b-separator.cjs.entry.js +1 -1
  85. package/dist/cjs/b2b-tab-panel.cjs.entry.js +1 -1
  86. package/dist/cjs/b2b-tab.cjs.entry.js +1 -1
  87. package/dist/cjs/b2b-table-cell_2.cjs.entry.js +2 -2
  88. package/dist/cjs/b2b-table-row.cjs.entry.js +1 -1
  89. package/dist/cjs/b2b-table-rowgroup.cjs.entry.js +1 -1
  90. package/dist/cjs/b2b-table.cjs.entry.js +1 -1
  91. package/dist/cjs/b2b-textarea.cjs.entry.js +1 -1
  92. package/dist/cjs/b2b-toggle-button.cjs.entry.js +1 -1
  93. package/dist/cjs/b2b-toggle-chip.cjs.entry.js +1 -1
  94. package/dist/cjs/b2b-toggle-group.cjs.entry.js +1 -1
  95. package/dist/cjs/b2b-toggle-switch.cjs.entry.js +1 -1
  96. package/dist/cjs/b2b-tooltip.cjs.entry.js +1 -1
  97. package/dist/cjs/b2b-wizard-icon.cjs.entry.js +1 -1
  98. package/dist/cjs/b2b-wizard-step.cjs.entry.js +1 -1
  99. package/dist/cjs/b2b-wizard.cjs.entry.js +1 -1
  100. package/dist/cjs/loader.cjs.js +1 -1
  101. package/dist/collection/components/alert/alert.css +4 -4
  102. package/dist/collection/components/anchor/anchor.css +4 -4
  103. package/dist/collection/components/breadcrumb/breadcrumb.css +4 -4
  104. package/dist/collection/components/button/button.css +4 -4
  105. package/dist/collection/components/calendar/calendar-days-header.css +4 -4
  106. package/dist/collection/components/calendar/calendar-days.css +6 -6
  107. package/dist/collection/components/calendar/calendar-header.css +7 -7
  108. package/dist/collection/components/calendar/calendar.css +4 -4
  109. package/dist/collection/components/card/card.css +4 -4
  110. package/dist/collection/components/checkbox/checkbox.css +4 -4
  111. package/dist/collection/components/checkbox-group/checkbox-group.css +4 -4
  112. package/dist/collection/components/chip/chip.css +4 -4
  113. package/dist/collection/components/dropdown/dropdown.css +5 -4
  114. package/dist/collection/components/flyout-menu/flyout-menu.css +5 -5
  115. package/dist/collection/components/headline/headline.css +4 -4
  116. package/dist/collection/components/icon/icon.css +4 -4
  117. package/dist/collection/components/icon-100/icon-100.css +4 -4
  118. package/dist/collection/components/icon-50/icon-50.css +4 -4
  119. package/dist/collection/components/input/input.css +14 -5
  120. package/dist/collection/components/input/input.js +25 -3
  121. package/dist/collection/components/input/input.stories.js +9 -1
  122. package/dist/collection/components/input-group/input-group.css +5 -5
  123. package/dist/collection/components/input-label/input-label.css +1 -0
  124. package/dist/collection/components/input-list/input-list.css +5 -5
  125. package/dist/collection/components/label/label.css +4 -4
  126. package/dist/collection/components/modal/modal.css +4 -4
  127. package/dist/collection/components/multiselect-dropdown/multiselect-dropdown.css +4 -4
  128. package/dist/collection/components/multiselect-dropdown/multiselect-option/multiselect-option.css +1 -1
  129. package/dist/collection/components/pagination/pagination.css +4 -4
  130. package/dist/collection/components/paragraph/paragraph.css +4 -4
  131. package/dist/collection/components/progress-bar/progress-bar.css +4 -4
  132. package/dist/collection/components/radio/radio.css +4 -4
  133. package/dist/collection/components/radio-group/radio-group.css +4 -4
  134. package/dist/collection/components/required-separator/required-separator.css +4 -4
  135. package/dist/collection/components/rounded-icon/rounded-icon.css +4 -4
  136. package/dist/collection/components/scrollable-container/scrollable-container.css +4 -4
  137. package/dist/collection/components/separator/separator.css +4 -4
  138. package/dist/collection/components/spinner/spinner.css +4 -4
  139. package/dist/collection/components/tab/tab.css +4 -4
  140. package/dist/collection/components/tab-panel/tab-panel.css +4 -4
  141. package/dist/collection/components/table/table-cell/table-cell.css +4 -4
  142. package/dist/collection/components/table/table-header/table-header.css +4 -4
  143. package/dist/collection/components/table/table-row/table-row.css +8 -8
  144. package/dist/collection/components/table/table-rowgroup/table-rowgroup.css +4 -4
  145. package/dist/collection/components/table/table.css +4 -4
  146. package/dist/collection/components/textarea/textarea.css +4 -4
  147. package/dist/collection/components/toggle-button/toggle-button.css +4 -4
  148. package/dist/collection/components/toggle-chip/toggle-chip.css +5 -5
  149. package/dist/collection/components/toggle-group/toggle-group.css +4 -4
  150. package/dist/collection/components/toggle-switch/toggle-switch.css +4 -4
  151. package/dist/collection/components/tooltip/tooltip.css +4 -4
  152. package/dist/collection/components/tooltip/tooltip.stories.js +100 -88
  153. package/dist/collection/components/wizard/wizard.css +4 -4
  154. package/dist/collection/components/wizard-icon/wizard-icon.css +4 -4
  155. package/dist/collection/docs/tokens/color.stories.js +7 -1
  156. package/dist/components/b2b-alert.js +1 -1
  157. package/dist/components/b2b-anchor.js +1 -1
  158. package/dist/components/b2b-breadcrumb-item.js +1 -1
  159. package/dist/components/b2b-breadcrumb.js +1 -1
  160. package/dist/components/b2b-calendar.js +1 -1
  161. package/dist/components/b2b-card.js +1 -1
  162. package/dist/components/b2b-checkbox-group.js +1 -1
  163. package/dist/components/b2b-dropdown.js +1 -1
  164. package/dist/components/b2b-flyout-menu-option.js +1 -1
  165. package/dist/components/b2b-flyout-menu.js +1 -1
  166. package/dist/components/b2b-icon-100.js +1 -1
  167. package/dist/components/b2b-icon-50.js +1 -1
  168. package/dist/components/b2b-label.js +1 -1
  169. package/dist/components/b2b-modal.js +1 -1
  170. package/dist/components/b2b-multiselect-dropdown.js +1 -1
  171. package/dist/components/b2b-pagination.js +1 -1
  172. package/dist/components/b2b-paragraph.js +1 -1
  173. package/dist/components/b2b-progress-bar.js +1 -1
  174. package/dist/components/b2b-radio-button.js +1 -1
  175. package/dist/components/b2b-radio-group.js +1 -1
  176. package/dist/components/b2b-required-separator.js +1 -1
  177. package/dist/components/b2b-scrollable-container.js +1 -1
  178. package/dist/components/b2b-tab-panel.js +1 -1
  179. package/dist/components/b2b-tab.js +1 -1
  180. package/dist/components/b2b-table-row.js +1 -1
  181. package/dist/components/b2b-table-rowgroup.js +1 -1
  182. package/dist/components/b2b-table.js +1 -1
  183. package/dist/components/b2b-textarea.js +1 -1
  184. package/dist/components/b2b-toggle-button.js +1 -1
  185. package/dist/components/b2b-toggle-chip.js +1 -1
  186. package/dist/components/b2b-toggle-group.js +1 -1
  187. package/dist/components/b2b-toggle-switch.js +1 -1
  188. package/dist/components/b2b-tooltip.js +1 -1
  189. package/dist/components/b2b-wizard-step.js +1 -1
  190. package/dist/components/b2b-wizard.js +1 -1
  191. package/dist/components/button.js +1 -1
  192. package/dist/components/calendar-days-header.js +1 -1
  193. package/dist/components/calendar-days.js +1 -1
  194. package/dist/components/calendar-header.js +1 -1
  195. package/dist/components/checkbox.js +1 -1
  196. package/dist/components/chip.js +1 -1
  197. package/dist/components/headline.js +1 -1
  198. package/dist/components/icon.js +1 -1
  199. package/dist/components/input-group.js +1 -1
  200. package/dist/components/input-label.js +1 -1
  201. package/dist/components/input-list-option.js +1 -1
  202. package/dist/components/input-list.js +1 -1
  203. package/dist/components/input.js +9 -4
  204. package/dist/components/multiselect-option.js +1 -1
  205. package/dist/components/rounded-icon.js +1 -1
  206. package/dist/components/separator.js +1 -1
  207. package/dist/components/spinner.js +1 -1
  208. package/dist/components/table-cell.js +1 -1
  209. package/dist/components/table-header.js +1 -1
  210. package/dist/components/wizard-icon.js +1 -1
  211. package/dist/custom-elements.json +15 -0
  212. package/dist/esm/b2b-alert.entry.js +1 -1
  213. package/dist/esm/b2b-anchor.entry.js +1 -1
  214. package/dist/esm/b2b-breadcrumb-item.entry.js +1 -1
  215. package/dist/esm/b2b-breadcrumb.entry.js +1 -1
  216. package/dist/esm/b2b-button_2.entry.js +2 -2
  217. package/dist/esm/b2b-calendar-days_3.entry.js +3 -3
  218. package/dist/esm/b2b-calendar.entry.js +1 -1
  219. package/dist/esm/b2b-card.entry.js +1 -1
  220. package/dist/esm/b2b-checkbox-group.entry.js +1 -1
  221. package/dist/esm/b2b-checkbox.entry.js +1 -1
  222. package/dist/esm/b2b-chip-component_2.entry.js +2 -2
  223. package/dist/esm/b2b-core-components.js +1 -1
  224. package/dist/esm/b2b-dropdown.entry.js +1 -1
  225. package/dist/esm/b2b-flyout-menu-option.entry.js +1 -1
  226. package/dist/esm/b2b-flyout-menu.entry.js +1 -1
  227. package/dist/esm/b2b-headline.entry.js +1 -1
  228. package/dist/esm/b2b-icon-100.entry.js +1 -1
  229. package/dist/esm/b2b-icon-50.entry.js +1 -1
  230. package/dist/esm/b2b-icon.entry.js +1 -1
  231. package/dist/esm/b2b-input-group_2.entry.js +2 -2
  232. package/dist/esm/b2b-input-label.entry.js +1 -1
  233. package/dist/esm/b2b-input_2.entry.js +9 -5
  234. package/dist/esm/b2b-label.entry.js +1 -1
  235. package/dist/esm/b2b-modal.entry.js +1 -1
  236. package/dist/esm/b2b-multiselect-dropdown.entry.js +1 -1
  237. package/dist/esm/b2b-pagination.entry.js +1 -1
  238. package/dist/esm/b2b-paragraph.entry.js +1 -1
  239. package/dist/esm/b2b-progress-bar.entry.js +1 -1
  240. package/dist/esm/b2b-radio-button.entry.js +1 -1
  241. package/dist/esm/b2b-radio-group.entry.js +1 -1
  242. package/dist/esm/b2b-required-separator.entry.js +1 -1
  243. package/dist/esm/b2b-rounded-icon.entry.js +1 -1
  244. package/dist/esm/b2b-scrollable-container.entry.js +1 -1
  245. package/dist/esm/b2b-separator.entry.js +1 -1
  246. package/dist/esm/b2b-tab-panel.entry.js +1 -1
  247. package/dist/esm/b2b-tab.entry.js +1 -1
  248. package/dist/esm/b2b-table-cell_2.entry.js +2 -2
  249. package/dist/esm/b2b-table-row.entry.js +1 -1
  250. package/dist/esm/b2b-table-rowgroup.entry.js +1 -1
  251. package/dist/esm/b2b-table.entry.js +1 -1
  252. package/dist/esm/b2b-textarea.entry.js +1 -1
  253. package/dist/esm/b2b-toggle-button.entry.js +1 -1
  254. package/dist/esm/b2b-toggle-chip.entry.js +1 -1
  255. package/dist/esm/b2b-toggle-group.entry.js +1 -1
  256. package/dist/esm/b2b-toggle-switch.entry.js +1 -1
  257. package/dist/esm/b2b-tooltip.entry.js +1 -1
  258. package/dist/esm/b2b-wizard-icon.entry.js +1 -1
  259. package/dist/esm/b2b-wizard-step.entry.js +1 -1
  260. package/dist/esm/b2b-wizard.entry.js +1 -1
  261. package/dist/esm/loader.js +1 -1
  262. package/dist/types/components/input/input.d.ts +2 -0
  263. package/dist/types/components/input/input.stories.d.ts +2 -0
  264. package/dist/types/components/tooltip/tooltip.stories.d.ts +13 -12
  265. package/dist/types/components.d.ts +8 -0
  266. package/dist/web-types.json +11 -1
  267. package/package.json +2 -2
  268. package/dist/b2b-core-components/p-01b9b983.entry.js +0 -1
  269. package/dist/b2b-core-components/p-07bc2191.entry.js +0 -1
  270. package/dist/b2b-core-components/p-12c001ea.entry.js +0 -1
  271. package/dist/b2b-core-components/p-1bc8e43e.entry.js +0 -1
  272. package/dist/b2b-core-components/p-1e12baa0.entry.js +0 -1
  273. package/dist/b2b-core-components/p-20fa0351.entry.js +0 -1
  274. package/dist/b2b-core-components/p-2103fe78.entry.js +0 -1
  275. package/dist/b2b-core-components/p-23e23cf4.entry.js +0 -1
  276. package/dist/b2b-core-components/p-287f83d5.entry.js +0 -1
  277. package/dist/b2b-core-components/p-330cc114.entry.js +0 -1
  278. package/dist/b2b-core-components/p-339b7c3c.entry.js +0 -1
  279. package/dist/b2b-core-components/p-33ffc3fe.entry.js +0 -1
  280. package/dist/b2b-core-components/p-3789f04c.entry.js +0 -1
  281. package/dist/b2b-core-components/p-3986736a.entry.js +0 -1
  282. package/dist/b2b-core-components/p-3eceb872.entry.js +0 -1
  283. package/dist/b2b-core-components/p-59551ff4.entry.js +0 -1
  284. package/dist/b2b-core-components/p-5b052666.entry.js +0 -1
  285. package/dist/b2b-core-components/p-601ec2f0.entry.js +0 -1
  286. package/dist/b2b-core-components/p-68c08852.entry.js +0 -1
  287. package/dist/b2b-core-components/p-68c54639.entry.js +0 -1
  288. package/dist/b2b-core-components/p-7735d43f.entry.js +0 -1
  289. package/dist/b2b-core-components/p-874c66d3.entry.js +0 -1
  290. package/dist/b2b-core-components/p-893df150.entry.js +0 -1
  291. package/dist/b2b-core-components/p-8f0b98f0.entry.js +0 -1
  292. package/dist/b2b-core-components/p-93970b97.entry.js +0 -1
  293. package/dist/b2b-core-components/p-9812490d.entry.js +0 -1
  294. package/dist/b2b-core-components/p-9edd95d2.entry.js +0 -1
  295. package/dist/b2b-core-components/p-a17c27f9.entry.js +0 -1
  296. package/dist/b2b-core-components/p-c2429f59.entry.js +0 -1
  297. package/dist/b2b-core-components/p-c55de08a.entry.js +0 -1
  298. package/dist/b2b-core-components/p-c791cefb.entry.js +0 -1
  299. package/dist/b2b-core-components/p-c8ad53c7.entry.js +0 -1
  300. package/dist/b2b-core-components/p-cdbefe41.entry.js +0 -1
  301. package/dist/b2b-core-components/p-d54e93b9.entry.js +0 -1
  302. package/dist/b2b-core-components/p-d8cc67d9.entry.js +0 -1
  303. package/dist/b2b-core-components/p-da41cd26.entry.js +0 -1
  304. package/dist/b2b-core-components/p-dc017553.entry.js +0 -1
  305. package/dist/b2b-core-components/p-dd5330c5.entry.js +0 -1
  306. package/dist/b2b-core-components/p-e1a20cd5.entry.js +0 -1
  307. package/dist/b2b-core-components/p-e23d42f0.entry.js +0 -1
  308. package/dist/b2b-core-components/p-e2d3d211.entry.js +0 -1
  309. package/dist/b2b-core-components/p-e355b702.entry.js +0 -1
  310. package/dist/b2b-core-components/p-ee9cbc06.entry.js +0 -1
  311. package/dist/b2b-core-components/p-ef64c336.entry.js +0 -1
  312. package/dist/b2b-core-components/p-f8f38e9e.entry.js +0 -1
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -240,7 +240,7 @@
240
240
  color: var(--b2b-color-black-100);
241
241
  }
242
242
  :host .b2b-toggle-chip__label:hover {
243
- background-color: var(--b2b-color-table-hover);
243
+ background-color: var(--b2b-color-hover);
244
244
  color: var(--b2b-color-black-100);
245
245
  cursor: pointer;
246
246
  transition: all 0.3s ease;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -1,94 +1,106 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s)
4
+ if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
13
+ import { getArgTypes } from "../../docs/config/utils";
1
14
  import { html } from "lit-html";
2
- import { getArgTypes, hideAllControls } from "../../docs/config/utils";
3
15
  import { useArgs } from "@storybook/preview-api";
16
+ import { hideAllControls } from "../../docs/config/utils";
4
17
  import dedent from "ts-dedent";
5
- const tooltipArgs = getArgTypes('b2b-tooltip');
6
- const Template = ({ position, trigger, content, triggerMarkup, buttons, opened, }) => {
7
- const markup = triggerMarkup ? triggerMarkup : 'trigger.';
8
- const filler = position === 'top' ? html `<div style="height: 125px;"></div>` : null;
9
- const [_, updateArgs] = useArgs();
10
- const showToolTip = async () => {
11
- updateArgs({ opened: true });
12
- };
13
- const hideToolTip = async () => {
14
- updateArgs({ opened: false });
15
- };
16
- const buttonMarkup = buttons
17
- ? html `<b2b-button @click=${showToolTip} variant="primary"
18
- >Show Tooltip</b2b-button
19
- ><b2b-button @click=${hideToolTip}>Hide Tooltip</b2b-button>`
20
- : null;
21
- return html `${filler}<b2b-paragraph>
22
- I am some text with a tooltip
23
- <b2b-tooltip
24
- position="${position}"
25
- trigger="${trigger}"
26
- content="${content}"
27
- opened="${opened}"
28
- data-testid="trigger"
29
- >${markup}</b2b-tooltip
30
- >
31
- </b2b-paragraph>
32
- ${buttonMarkup}`;
33
- };
34
- const defaultArgs = {
35
- content: 'I am a tooltip',
36
- trigger: 'hover',
37
- position: 'top',
38
- opened: false,
39
- };
40
- export const story010Hover = Template.bind({});
41
- story010Hover.args = Object.assign({}, defaultArgs);
42
- story010Hover.storyName = 'Default Hover Tooltip';
43
- export const story020Focus = Template.bind({});
44
- const focusTriggerMarkup = html `<b2b-button>button to focus</b2b-button>`;
45
- story020Focus.args = Object.assign(Object.assign({}, defaultArgs), { trigger: 'focus', triggerMarkup: focusTriggerMarkup });
46
- story020Focus.storyName = 'Focus Tooltip';
47
- export const story030Custom = Template.bind({});
48
- const buttons = true;
49
- story030Custom.args = Object.assign(Object.assign({}, defaultArgs), { buttons: buttons, trigger: 'custom', position: 'right' });
50
- story030Custom.storyName = 'Custom Trigger Tooltip';
51
- // for testing purposes
52
- export const story040Top = Template.bind({});
53
- story040Top.args = Object.assign(Object.assign({}, defaultArgs), { opened: true });
54
- story040Top.storyName = 'Top Tooltip';
55
- export const story050Bottom = Template.bind({});
56
- story050Bottom.args = Object.assign(Object.assign({}, defaultArgs), { position: 'bottom', opened: true });
57
- story050Bottom.storyName = 'Bottom Tooltip';
58
- export const story060Left = Template.bind({});
59
- story060Left.args = Object.assign(Object.assign({}, defaultArgs), { position: 'left', opened: true });
60
- story060Left.storyName = 'Left Tooltip';
61
- export const story070Right = Template.bind({});
62
- story070Right.args = Object.assign(Object.assign({}, defaultArgs), { position: 'right', opened: true });
63
- story070Right.storyName = 'Right Tooltip';
64
- export const story080Right = Template.bind({});
65
- story080Right.args = Object.assign(Object.assign({}, defaultArgs), { position: 'top', opened: true, content: 'Topping halvah cake sugar plum marzipan jelly marshmallow lemon drops. Bonbon brownie powder sesame snaps fruitcake caramels toffee. Brownie pie cotton candy sesame snaps wafer sugar plum candy marzipan oat cake.' });
66
- story080Right.storyName = 'Tooltip with long text';
67
- const BlockTooltipTemplate = ({}) => {
68
- return html `<b2b-tooltip
69
- content="I am a tooltip"
70
- position="right"
71
- opened
72
- style="display: inline-block"
73
- ><b2b-input style="width: 300px"></b2b-input>
74
- </b2b-tooltip> `;
75
- };
76
- export const story090BlockElement = BlockTooltipTemplate.bind({});
77
- story090BlockElement.storyName = 'Block Element';
78
- story090BlockElement.parameters = {
79
- controls: { hideNoControlsWarning: true },
80
- docs: {
81
- source: {
82
- code: dedent `
83
- <b2b-tooltip style="display: inline-block" content="I am a tooltip" position="right">
84
- <b2b-input style="width: 300px"></b2b-input>
85
- </b2b-tooltip>`,
86
- },
18
+ const meta = {
19
+ title: 'Components/Interaction/Tooltip',
20
+ component: 'b2b-tooltip',
21
+ args: {
22
+ trigger: 'hover',
23
+ position: 'right',
24
+ content: 'I am a tooltip',
25
+ triggerMarkup: undefined,
26
+ buttons: undefined,
27
+ opened: false,
28
+ },
29
+ argTypes: getArgTypes('b2b-tooltip'),
30
+ render: (_a) => {
31
+ var args = __rest(_a, []);
32
+ const markup = args.triggerMarkup ? args.triggerMarkup : 'trigger.';
33
+ const filler = args.position === 'top' ? html `<div style="height: 125px;"></div>` : null;
34
+ const [_, updateArgs] = useArgs();
35
+ const showToolTip = async () => {
36
+ updateArgs({ opened: true });
37
+ };
38
+ const hideToolTip = async () => {
39
+ updateArgs({ opened: false });
40
+ };
41
+ const buttonMarkup = args.buttons
42
+ ? html `<b2b-button @click=${showToolTip} variant="primary"
43
+ >Show Tooltip</b2b-button
44
+ ><b2b-button @click=${hideToolTip}>Hide Tooltip</b2b-button>`
45
+ : null;
46
+ return html ` ${filler}
47
+ <b2b-paragraph>
48
+ I am some text with a tooltip
49
+ <b2b-tooltip
50
+ position="${args.position}"
51
+ trigger="${args.trigger}"
52
+ content="${args.content}"
53
+ opened="${args.opened}"
54
+ data-testid="trigger"
55
+ >${markup}
56
+ </b2b-tooltip>
57
+ </b2b-paragraph>
58
+ ${buttonMarkup}`;
87
59
  },
88
60
  };
89
- story090BlockElement.argTypes = Object.assign({}, hideAllControls(tooltipArgs));
90
- export default {
91
- title: 'Components/Interaction/Tooltip',
92
- argTypes: Object.assign(Object.assign({}, tooltipArgs), { triggerMarkup: { table: { disable: true } }, buttons: { table: { disable: true } } }),
93
- viewMode: 'docs',
61
+ export const DefaultHoverToolTip = {
62
+ args: Object.assign({}, meta.args),
94
63
  };
64
+ export const FocusTooltip = Object.assign(Object.assign({}, meta), { render: args => {
65
+ const focusTriggerMarkup = html `<b2b-button>button to focus</b2b-button>`;
66
+ return html `
67
+ <b2b-paragraph>
68
+ I am some text with a tooltip
69
+ <b2b-tooltip
70
+ position="${args.position}"
71
+ trigger="${args.trigger}"
72
+ content="${args.content}"
73
+ opened="${args.opened}"
74
+ data-testid="trigger">
75
+ ${focusTriggerMarkup}
76
+ </b2b-tooltip>
77
+ </b2b-paragraph>
78
+ `;
79
+ } });
80
+ export const CustomTooltip = Object.assign({}, meta);
81
+ export const TopTooltip = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { opened: true, position: 'top' }) });
82
+ export const BottomTooltip = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { opened: true, position: 'bottom' }) });
83
+ export const LeftTooltip = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { opened: true, position: 'left' }) });
84
+ export const RightTooltip = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { opened: true, position: 'right' }) });
85
+ export const LongRightTooltip = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { opened: true, position: 'top', content: 'Topping halvah cake sugar plum marzipan jelly marshmallow lemon drops. Bonbon brownie powder sesame snaps fruitcake caramels toffee. Brownie pie cotton candy sesame snaps wafer sugar plum candy marzipan oat cake.' }) });
86
+ const tooltipArgs = getArgTypes('b2b-tooltip');
87
+ export const BlockTooltipStory = Object.assign(Object.assign({}, meta), { args: Object.assign(Object.assign({}, meta.args), { content: 'I am a tooltip', position: 'right', opened: true }), render: () => html `
88
+ <b2b-tooltip
89
+ content="I am a tooltip"
90
+ position="right"
91
+ opened
92
+ style="display: inline-block">
93
+ <b2b-input style="width: 300px"></b2b-input>
94
+ </b2b-tooltip>
95
+ `, storyName: 'Block Element', parameters: {
96
+ controls: { hideNoControlsWarning: true }, // Hide the "no controls" warning
97
+ docs: {
98
+ source: {
99
+ code: dedent `
100
+ <b2b-tooltip style="display: inline-block" content="I am a tooltip" position="right">
101
+ <b2b-input style="width: 300px"></b2b-input>
102
+ </b2b-tooltip>`,
103
+ },
104
+ },
105
+ }, argTypes: Object.assign({}, hideAllControls(tooltipArgs)) });
106
+ export default meta;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
3
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
4
4
  */
5
5
  :root, :host {
6
6
  --b2b-size-200: 5rem; /* 80px */
@@ -32,11 +32,10 @@
32
32
  --b2b-font-weight-thin: 100;
33
33
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
34
34
  --b2b-color-table-expand-hover: #e6f4ff;
35
- --b2b-color-table-selected-hover: #e6f4ff;
36
35
  --b2b-color-table-selected-default: #cce9ff;
37
- --b2b-color-table-hover: #e6f4ff;
38
36
  --b2b-color-background-overlay-transparent-40: rgba(34, 34, 34, 0.25);
39
37
  --b2b-color-background-overlay-transparent-80: rgba(34, 34, 34, 0.5);
38
+ --b2b-color-hover: #e6f4ff;
40
39
  --b2b-color-info-100: #003264;
41
40
  --b2b-color-info-50: #ccd6e0;
42
41
  --b2b-color-success-100: #326400;
@@ -123,7 +122,7 @@
123
122
  }
124
123
  /**
125
124
  * Do not edit directly
126
- * Generated on Wed, 04 Sep 2024 10:57:20 GMT
125
+ * Generated on Tue, 10 Sep 2024 09:20:32 GMT
127
126
  */
128
127
  :root [data-theme="dark"] {
129
128
  --b2b-size-200: 5rem; /* 80px */
@@ -154,6 +153,7 @@
154
153
  --b2b-font-weight-normal: 500;
155
154
  --b2b-font-weight-thin: 100;
156
155
  --b2b-font-family-default: OttoSans, Arial, Helvetica, sans-serif;
156
+ --b2b-color-hover: #e6f4ff;
157
157
  --b2b-color-info-100: #003264;
158
158
  --b2b-color-info-50: #ccd6e0;
159
159
  --b2b-color-success-100: #326400;
@@ -38,7 +38,13 @@ const semanticTopTokensList = [
38
38
  'icon',
39
39
  'table',
40
40
  ];
41
- const semanticBottomTokensList = ['error', 'warning', 'success', 'info'];
41
+ const semanticBottomTokensList = [
42
+ 'error',
43
+ 'warning',
44
+ 'success',
45
+ 'info',
46
+ 'hover',
47
+ ];
42
48
  const basicTokensList = ['black', 'white', 'grey', 'red'];
43
49
  const ColorTokens = ({}) => {
44
50
  return html `
@@ -1,7 +1,7 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
2
  import { d as defineCustomElement$2 } from './icon.js';
3
3
 
4
- const alertCss = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}.b2b-alert{display:none;padding:var(--b2b-size-30);gap:var(--b2b-size-30);font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);line-height:var(--b2b-size-copy-line-height-100);flex-shrink:0;border-radius:var(--b2b-size-7)}.b2b-alert--info{background-color:var(--b2b-color-info-50)}.b2b-alert--info__icon{color:var(--b2b-color-info-100)}.b2b-alert--warning{background-color:var(--b2b-color-warning-50)}.b2b-alert--error{color:var(--b2b-color-error-100);background-color:var(--b2b-color-error-50)}.b2b-alert--success{background-color:var(--b2b-color-success-50)}.b2b-alert--success__icon{color:var(--b2b-color-success-100)}.b2b-alert__close-icon{padding-top:var(--b2b-size-7);width:var(--b2b-size-30);height:var(--b2b-size-35);cursor:pointer;fill:var(--b2b-color-grey-400);flex-shrink:0}.b2b-alert__content{display:flex;align-items:baseline;flex:2;gap:var(--b2b-size-30)}.b2b-alert__content p{width:100%;margin:0;padding:var(--b2b-size-5) 0 var(--b2b-size-1) 0}.b2b-alert--open{display:flex}.b2b-alert--small{width:fit-content;justify-content:center;padding:var(--b2b-size-7);display:inline-flex}.b2b-alert--large{width:inherit;justify-content:space-between}";
4
+ const alertCss = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}.b2b-alert{display:none;padding:var(--b2b-size-30);gap:var(--b2b-size-30);font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);line-height:var(--b2b-size-copy-line-height-100);flex-shrink:0;border-radius:var(--b2b-size-7)}.b2b-alert--info{background-color:var(--b2b-color-info-50)}.b2b-alert--info__icon{color:var(--b2b-color-info-100)}.b2b-alert--warning{background-color:var(--b2b-color-warning-50)}.b2b-alert--error{color:var(--b2b-color-error-100);background-color:var(--b2b-color-error-50)}.b2b-alert--success{background-color:var(--b2b-color-success-50)}.b2b-alert--success__icon{color:var(--b2b-color-success-100)}.b2b-alert__close-icon{padding-top:var(--b2b-size-7);width:var(--b2b-size-30);height:var(--b2b-size-35);cursor:pointer;fill:var(--b2b-color-grey-400);flex-shrink:0}.b2b-alert__content{display:flex;align-items:baseline;flex:2;gap:var(--b2b-size-30)}.b2b-alert__content p{width:100%;margin:0;padding:var(--b2b-size-5) 0 var(--b2b-size-1) 0}.b2b-alert--open{display:flex}.b2b-alert--small{width:fit-content;justify-content:center;padding:var(--b2b-size-7);display:inline-flex}.b2b-alert--large{width:inherit;justify-content:space-between}";
5
5
  const B2bAlertStyle0 = alertCss;
6
6
 
7
7
  const AlertComponent = /*@__PURE__*/ proxyCustomElement(class AlertComponent extends HTMLElement {
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
2
 
3
- const anchorCss = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{z-index:0;width:fit-content;height:fit-content;position:relative}:host .b2b-anchor{font-family:var(--b2b-font-family-default);color:var(--b2b-color-copy-default);text-decoration:underline;transition:all 0.3s ease;z-index:1001;position:relative}:host .b2b-anchor:hover{color:var(--b2b-color-red-100);cursor:pointer}:host .b2b-anchor--100{font-size:var(--b2b-size-copy-100)}:host .b2b-anchor--inherit{font-size:inherit}";
3
+ const anchorCss = ":root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host{z-index:0;width:fit-content;height:fit-content;position:relative}:host .b2b-anchor{font-family:var(--b2b-font-family-default);color:var(--b2b-color-copy-default);text-decoration:underline;transition:all 0.3s ease;z-index:1001;position:relative}:host .b2b-anchor:hover{color:var(--b2b-color-red-100);cursor:pointer}:host .b2b-anchor--100{font-size:var(--b2b-size-copy-100)}:host .b2b-anchor--inherit{font-size:inherit}";
4
4
  const B2bAnchorStyle0 = anchorCss;
5
5
 
6
6
  const AnchorComponent = /*@__PURE__*/ proxyCustomElement(class AnchorComponent extends HTMLElement {
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
2
 
3
- const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host .b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;padding:0.75rem 0;height:var(--b2b-size-90);margin-bottom:1.125rem;border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}:host .b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-grey-400);cursor:pointer}:host .b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}:host .b2b-breadcrumb-nav__item:hover,:host .b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}:host .b2b-breadcrumb-nav__item--active:hover,:host .b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
3
+ const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host .b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;padding:0.75rem 0;height:var(--b2b-size-90);margin-bottom:1.125rem;border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}:host .b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-grey-400);cursor:pointer}:host .b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}:host .b2b-breadcrumb-nav__item:hover,:host .b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}:host .b2b-breadcrumb-nav__item--active:hover,:host .b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
4
4
  const B2bBreadcrumbItemStyle0 = breadcrumbCss;
5
5
 
6
6
  const BreadCrumbItemComponent = /*@__PURE__*/ proxyCustomElement(class BreadCrumbItemComponent extends HTMLElement {
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
2
 
3
- const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-table-hover:#e6f4ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host .b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;padding:0.75rem 0;height:var(--b2b-size-90);margin-bottom:1.125rem;border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}:host .b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-grey-400);cursor:pointer}:host .b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}:host .b2b-breadcrumb-nav__item:hover,:host .b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}:host .b2b-breadcrumb-nav__item--active:hover,:host .b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
3
+ const breadcrumbCss = "@charset \"UTF-8\";:root,:host{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-table-expand-hover:#e6f4ff;--b2b-color-table-selected-default:#cce9ff;--b2b-color-background-overlay-transparent-40:rgba(34, 34, 34, 0.25);--b2b-color-background-overlay-transparent-80:rgba(34, 34, 34, 0.5);--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-size-headline-line-height-400:var(--b2b-size-60);--b2b-size-headline-line-height-200:var(--b2b-size-60);--b2b-size-headline-line-height-100:var(--b2b-size-60);--b2b-size-headline-400:var(--b2b-size-60);--b2b-size-headline-200:var(--b2b-size-45);--b2b-size-headline-100:var(--b2b-size-40);--b2b-size-copy-line-height-300:var(--b2b-size-90);--b2b-size-copy-line-height-200:var(--b2b-size-60);--b2b-size-copy-line-height-125:var(--b2b-size-60);--b2b-size-copy-line-height-100:var(--b2b-size-53);--b2b-size-copy-line-height-75:var(--b2b-size-45);--b2b-size-copy-line-height-50:var(--b2b-size-40);--b2b-size-copy-300:var(--b2b-size-60);--b2b-size-copy-200:var(--b2b-size-45);--b2b-size-copy-125:var(--b2b-size-40);--b2b-size-copy-100:var(--b2b-size-35);--b2b-size-copy-50:var(--b2b-size-30);--b2b-size-border-no-radius-bottom:var(--b2b-size-7) var(--b2b-size-7) 0 0;--b2b-size-border-no-radius-top:0 0 var(--b2b-size-7) var(--b2b-size-7);--b2b-size-border-no-radius-right:var(--b2b-size-7) 0 0 var(--b2b-size-7);--b2b-size-border-no-radius-left:0 var(--b2b-size-7) var(--b2b-size-7) 0;--b2b-size-border-radius-100:var(--b2b-size-7);--b2b-size-border-width-150:var(--b2b-size-10);--b2b-size-border-width-100:var(--b2b-size-5);--b2b-size-border-width-50:var(--b2b-size-1);--b2b-size-padding-175:var(--b2b-size-80);--b2b-size-padding-150:var(--b2b-size-60);--b2b-size-padding-100:var(--b2b-size-40);--b2b-size-padding-50:var(--b2b-size-20);--b2b-size-space-300:var(--b2b-size-200);--b2b-size-space-250:var(--b2b-size-160);--b2b-size-space-200:var(--b2b-size-100);--b2b-size-space-175:var(--b2b-size-80);--b2b-size-space-150:var(--b2b-size-60);--b2b-size-space-100:var(--b2b-size-40);--b2b-size-space-75:var(--b2b-size-30);--b2b-size-space-50:var(--b2b-size-20);--b2b-size-space-25:var(--b2b-size-10);--b2b-size-icon-400:var(--b2b-size-120);--b2b-size-icon-200:var(--b2b-size-80);--b2b-size-icon-100:var(--b2b-size-60);--b2b-size-icon-50:var(--b2b-size-40);--b2b-color-table-expand-default:var(--b2b-color-grey-25);--b2b-color-icon-inverted:var(--b2b-color-white-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-black-100);--b2b-color-headline-inverted:var(--b2b-color-white-100);--b2b-color-headline-default:var(--b2b-color-black-100);--b2b-color-headline-title:var(--b2b-color-red-100);--b2b-color-copy-overlay:var(--b2b-color-white-100);--b2b-color-copy-inverted:var(--b2b-color-white-100);--b2b-color-copy-secondary:var(--b2b-color-grey-400);--b2b-color-copy-default:var(--b2b-color-black-100);--b2b-color-border-100:var(--b2b-color-grey-200);--b2b-color-background-overlay:var(--b2b-color-black-100);--b2b-color-background-card:var(--b2b-color-white-100);--b2b-color-background-box:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-25);--b2b-color-error-50:var(--b2b-color-red-50)}:root [data-theme=\"dark\"]{--b2b-size-200:5rem;--b2b-size-160:4rem;--b2b-size-150:3.75rem;--b2b-size-140:3.5rem;--b2b-size-120:3rem;--b2b-size-100:2.5rem;--b2b-size-90:2.25rem;--b2b-size-80:2rem;--b2b-size-70:1.75rem;--b2b-size-60:1.5rem;--b2b-size-55:1.375rem;--b2b-size-53:1.3125rem;--b2b-size-50:1.25rem;--b2b-size-45:1.125rem;--b2b-size-40:1rem;--b2b-size-35:0.875rem;--b2b-size-30:0.75rem;--b2b-size-25:0.625rem;--b2b-size-20:0.5rem;--b2b-size-15:0.375rem;--b2b-size-10:0.25rem;--b2b-size-7:0.1875rem;--b2b-size-5:0.125rem;--b2b-size-1:0.0625rem;--b2b-font-weight-bold:700;--b2b-font-weight-normal:500;--b2b-font-weight-thin:100;--b2b-font-family-default:OttoSans, Arial, Helvetica, sans-serif;--b2b-color-hover:#e6f4ff;--b2b-color-info-100:#003264;--b2b-color-info-50:#ccd6e0;--b2b-color-success-100:#326400;--b2b-color-success-50:#d6e0cc;--b2b-color-warning-100:#ffb432;--b2b-color-warning-50:#ffd998;--b2b-color-error-100:#e6344b;--b2b-color-primary:#d4021d;--b2b-color-red-250:#850012;--b2b-color-red-200:#bb0004;--b2b-color-red-150:#e6344b;--b2b-color-red-100:#d4021d;--b2b-color-red-50:#ffdde3;--b2b-color-grey-400:#777777;--b2b-color-grey-300:#9e9e9e;--b2b-color-grey-250:#b1b1b1;--b2b-color-grey-200:#c4c4c4;--b2b-color-grey-150:#d5d5d5;--b2b-color-grey-100:#e6e6e6;--b2b-color-grey-50:#eeeeee;--b2b-color-grey-25:#f6f6f6;--b2b-color-white-100:#ffffff;--b2b-color-black-100:#222222;--b2b-color-black-50:#333333;--b2b-color-icon-inverted:var(--b2b-color-black-100);--b2b-color-icon-secondary:var(--b2b-color-grey-400);--b2b-color-icon-default:var(--b2b-color-white-100);--b2b-color-headline-inverted:var(--b2b-color-black-100);--b2b-color-headline-default:var(--b2b-color-white-100);--b2b-color-headline-title:var(--b2b-color-red-50);--b2b-color-copy-inverted:var(--b2b-color-black-100);--b2b-color-copy-secondary:var(--b2b-color-grey-100);--b2b-color-copy-default:var(--b2b-color-white-100);--b2b-color-border-100:var(--b2b-color-white-100);--b2b-color-background-page:var(--b2b-color-grey-100);--b2b-color-background-card:var(--b2b-color-black-50);--b2b-color-background-box:var(--b2b-color-black-50);--b2b-color-error-50:var(--b2b-color-red-50)}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans.ttf\");font-weight:normal;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-bold.ttf\") format(\"truetype\");font-weight:bold;font-style:normal}@font-face{font-family:OttoSans;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.woff\") format(\"woff\"), url(\"https://pattern-library.portal.otto.market/static/assets/fonts/otto-sans-thin.ttf\") format(\"truetype\");font-weight:100;font-style:normal}@font-face{font-family:ObcIcons;src:url(\"https://pattern-library.portal.otto.market/static/assets/fonts/obc-icons.woff\")}:host .b2b-breadcrumb-nav{z-index:99;display:flex;flex-flow:row nowrap;padding:0.75rem 0;height:var(--b2b-size-90);margin-bottom:1.125rem;border-bottom:var(--b2b-size-border-width-50) solid var(--b2b-color-grey-200)}:host .b2b-breadcrumb-nav__item{font-size:var(--b2b-size-copy-125);line-height:var(--b2b-size-copy-line-height-125);display:inline-flex;color:var(--b2b-color-grey-400);cursor:pointer}:host .b2b-breadcrumb-nav__item a{color:var(--b2b-color-grey-400);text-decoration:none}:host .b2b-breadcrumb-nav__item:hover,:host .b2b-breadcrumb-nav__item a:hover{color:var(--b2b-color-red-100)}:host .b2b-breadcrumb-nav__item--active:hover,:host .b2b-breadcrumb-nav__item--active a:hover{cursor:default;color:var(--b2b-color-grey-400)}::slotted(*:not(:last-child))::after{content:\"»\";color:var(--b2b-color-grey-400);margin:0 0.375rem}";
4
4
  const B2bBreadcrumbStyle0 = breadcrumbCss;
5
5
 
6
6
  const B2bBreadCrumbComponent = /*@__PURE__*/ proxyCustomElement(class B2bBreadCrumbComponent extends HTMLElement {