@otto-de/b2b-core-components 1.4.0 → 1.5.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 (264) 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-03beebf5.entry.js +1 -0
  4. package/dist/b2b-core-components/p-0675225a.entry.js +1 -0
  5. package/dist/b2b-core-components/p-06ef4c5e.entry.js +1 -0
  6. package/dist/b2b-core-components/{p-5c316460.entry.js → p-080a0741.entry.js} +1 -1
  7. package/dist/b2b-core-components/p-0f8bd310.entry.js +1 -0
  8. package/dist/b2b-core-components/p-163fe245.entry.js +1 -0
  9. package/dist/b2b-core-components/p-1e1bdb50.entry.js +1 -0
  10. package/dist/b2b-core-components/p-1eb784f9.entry.js +1 -0
  11. package/dist/b2b-core-components/p-21bfe96a.entry.js +1 -0
  12. package/dist/b2b-core-components/p-2b3a67db.entry.js +1 -0
  13. package/dist/b2b-core-components/p-38791fb9.entry.js +1 -0
  14. package/dist/b2b-core-components/p-3cd9088a.entry.js +1 -0
  15. package/dist/b2b-core-components/p-42da7a57.entry.js +1 -0
  16. package/dist/b2b-core-components/p-4fc894c8.entry.js +1 -0
  17. package/dist/b2b-core-components/p-5c2db521.entry.js +1 -0
  18. package/dist/b2b-core-components/p-5d7866e8.entry.js +1 -0
  19. package/dist/b2b-core-components/{p-34f6555e.entry.js → p-60c7f6f7.entry.js} +1 -1
  20. package/dist/b2b-core-components/{p-400b3111.entry.js → p-6997ceb0.entry.js} +1 -1
  21. package/dist/b2b-core-components/p-710600ca.entry.js +1 -0
  22. package/dist/b2b-core-components/p-75f84f53.entry.js +1 -0
  23. package/dist/b2b-core-components/p-76e240f8.entry.js +1 -0
  24. package/dist/b2b-core-components/p-7b04f40b.entry.js +1 -0
  25. package/dist/b2b-core-components/p-83cb9d03.entry.js +1 -0
  26. package/dist/b2b-core-components/p-b95089a7.entry.js +1 -0
  27. package/dist/b2b-core-components/p-bb5e7c53.js +1 -0
  28. package/dist/b2b-core-components/p-bcf36531.entry.js +1 -0
  29. package/dist/b2b-core-components/p-bda69b9a.entry.js +1 -0
  30. package/dist/b2b-core-components/p-c20baf90.entry.js +1 -0
  31. package/dist/b2b-core-components/p-c8294029.entry.js +1 -0
  32. package/dist/b2b-core-components/{p-144a3c59.entry.js → p-c9dcb35a.entry.js} +1 -1
  33. package/dist/b2b-core-components/p-cf010e88.entry.js +1 -0
  34. package/dist/b2b-core-components/p-dcd80266.entry.js +1 -0
  35. package/dist/b2b-core-components/p-e1622cb8.entry.js +1 -0
  36. package/dist/b2b-core-components/p-e3cd216c.entry.js +1 -0
  37. package/dist/b2b-core-components/p-fa6cd2ac.entry.js +1 -0
  38. package/dist/b2b-core-components/p-fe96d81a.entry.js +1 -0
  39. package/dist/cjs/b2b-alert.cjs.entry.js +1 -1
  40. package/dist/cjs/b2b-anchor.cjs.entry.js +1 -1
  41. package/dist/cjs/b2b-button_2.cjs.entry.js +2 -2
  42. package/dist/cjs/b2b-card.cjs.entry.js +1 -1
  43. package/dist/cjs/b2b-checkbox-group.cjs.entry.js +1 -1
  44. package/dist/cjs/b2b-checkbox.cjs.entry.js +1 -1
  45. package/dist/cjs/b2b-core-components.cjs.js +1 -1
  46. package/dist/cjs/b2b-dropdown.cjs.entry.js +1 -1
  47. package/dist/cjs/b2b-headline.cjs.entry.js +1 -1
  48. package/dist/cjs/b2b-icon.cjs.entry.js +1 -1
  49. package/dist/cjs/b2b-input-group_2.cjs.entry.js +19 -5
  50. package/dist/cjs/b2b-input_2.cjs.entry.js +2 -2
  51. package/dist/cjs/b2b-label.cjs.entry.js +1 -1
  52. package/dist/cjs/b2b-modal.cjs.entry.js +1 -1
  53. package/dist/cjs/b2b-pagination.cjs.entry.js +1 -1
  54. package/dist/cjs/b2b-paragraph.cjs.entry.js +1 -1
  55. package/dist/cjs/b2b-radio-button.cjs.entry.js +1 -1
  56. package/dist/cjs/b2b-radio-group.cjs.entry.js +1 -1
  57. package/dist/cjs/b2b-required-separator.cjs.entry.js +1 -1
  58. package/dist/cjs/b2b-rounded-icon.cjs.entry.js +3 -1
  59. package/dist/cjs/b2b-scrollable-container.cjs.entry.js +1 -1
  60. package/dist/cjs/b2b-search.cjs.entry.js +5 -0
  61. package/dist/cjs/b2b-separator.cjs.entry.js +1 -1
  62. package/dist/cjs/b2b-tab-panel.cjs.entry.js +1 -1
  63. package/dist/cjs/b2b-tab.cjs.entry.js +1 -1
  64. package/dist/cjs/b2b-table-cell_2.cjs.entry.js +9 -9
  65. package/dist/cjs/b2b-table-row.cjs.entry.js +7 -8
  66. package/dist/cjs/b2b-table-rowgroup.cjs.entry.js +4 -4
  67. package/dist/cjs/b2b-table.cjs.entry.js +4 -4
  68. package/dist/cjs/b2b-textarea.cjs.entry.js +1 -1
  69. package/dist/cjs/b2b-toggle-button.cjs.entry.js +1 -1
  70. package/dist/cjs/b2b-toggle-group.cjs.entry.js +1 -1
  71. package/dist/cjs/b2b-tooltip.cjs.entry.js +1 -1
  72. package/dist/cjs/b2b-wizard-icon.cjs.entry.js +5 -3
  73. package/dist/cjs/b2b-wizard-step.cjs.entry.js +26 -0
  74. package/dist/cjs/b2b-wizard.cjs.entry.js +61 -0
  75. package/dist/cjs/index-496aa5dd.js +14 -6
  76. package/dist/cjs/loader.cjs.js +1 -1
  77. package/dist/cjs/{types-ef85a0bf.js → table.types-bb0926c7.js} +2 -2
  78. package/dist/cjs/wizard.types-690c64bb.js +10 -0
  79. package/dist/collection/collection-manifest.json +2 -0
  80. package/dist/collection/components/alert/alert.css +3 -4
  81. package/dist/collection/components/anchor/anchor.css +3 -4
  82. package/dist/collection/components/button/button.css +3 -4
  83. package/dist/collection/components/card/card.css +3 -4
  84. package/dist/collection/components/checkbox/checkbox.css +4 -5
  85. package/dist/collection/components/checkbox-group/checkbox-group.css +4 -5
  86. package/dist/collection/components/dropdown/dropdown.css +4 -5
  87. package/dist/collection/components/headline/headline.css +3 -4
  88. package/dist/collection/components/icon/icon.css +3 -4
  89. package/dist/collection/components/input/input.css +4 -5
  90. package/dist/collection/components/input-group/input-group.css +4 -5
  91. package/dist/collection/components/input-group/input-group.js +22 -3
  92. package/dist/collection/components/input-list/input-list.css +3 -4
  93. package/dist/collection/components/label/label.css +4 -5
  94. package/dist/collection/components/modal/modal.css +3 -4
  95. package/dist/collection/components/pagination/pagination.css +3 -4
  96. package/dist/collection/components/paragraph/paragraph.css +4 -5
  97. package/dist/collection/components/radio/radio.css +4 -5
  98. package/dist/collection/components/radio-group/radio-group.css +4 -5
  99. package/dist/collection/components/required-separator/required-separator.css +3 -4
  100. package/dist/collection/components/rounded-icon/rounded-icon.css +4 -5
  101. package/dist/collection/components/rounded-icon/rounded-icon.js +19 -0
  102. package/dist/collection/components/scrollable-container/scrollable-container.css +3 -4
  103. package/dist/collection/components/search/search.js +14 -0
  104. package/dist/collection/components/separator/separator.css +3 -4
  105. package/dist/collection/components/spinner/spinner.css +3 -4
  106. package/dist/collection/components/tab/tab.css +3 -4
  107. package/dist/collection/components/tab-panel/tab-panel.css +3 -4
  108. package/dist/collection/components/table/table-cell/table-cell.css +3 -4
  109. package/dist/collection/components/table/table-cell/table-cell.js +4 -4
  110. package/dist/collection/components/table/table-header/table-header.css +3 -4
  111. package/dist/collection/components/table/table-header/table-header.js +3 -3
  112. package/dist/collection/components/table/table-row/table-row.css +3 -4
  113. package/dist/collection/components/table/table-row/table-row.js +3 -4
  114. package/dist/collection/components/table/table-rowgroup/table-rowgroup.css +3 -4
  115. package/dist/collection/components/table/table-rowgroup/table-rowgroup.js +2 -2
  116. package/dist/collection/components/table/table.css +3 -4
  117. package/dist/collection/components/table/table.js +2 -2
  118. package/dist/collection/components/table/table.stories.js +1 -1
  119. package/dist/collection/components/textarea/textarea.css +4 -5
  120. package/dist/collection/components/toggle-button/toggle-button.css +3 -4
  121. package/dist/collection/components/toggle-group/toggle-group.css +3 -4
  122. package/dist/collection/components/tooltip/tooltip.css +4 -5
  123. package/dist/collection/components/wizard/wizard-step.js +95 -0
  124. package/dist/collection/components/wizard/wizard.css +240 -0
  125. package/dist/collection/components/wizard/wizard.js +125 -0
  126. package/dist/collection/components/wizard/wizard.stories.js +44 -0
  127. package/dist/collection/components/wizard-icon/wizard-icon.css +3 -4
  128. package/dist/collection/components/wizard-icon/wizard-icon.js +38 -8
  129. package/dist/collection/components/wizard-icon/wizard-icon.stories.js +14 -3
  130. package/dist/collection/{components/table/types.js → utils/types/table.types.js} +2 -2
  131. package/dist/collection/utils/types/wizard.types.js +6 -0
  132. package/dist/components/b2b-alert.js +1 -1
  133. package/dist/components/b2b-anchor.js +1 -1
  134. package/dist/components/b2b-card.js +1 -1
  135. package/dist/components/b2b-checkbox-group.js +1 -1
  136. package/dist/components/b2b-checkbox.js +1 -1
  137. package/dist/components/b2b-dropdown.js +1 -1
  138. package/dist/components/b2b-label.js +1 -1
  139. package/dist/components/b2b-modal.js +1 -1
  140. package/dist/components/b2b-pagination.js +1 -1
  141. package/dist/components/b2b-paragraph.js +1 -1
  142. package/dist/components/b2b-radio-button.js +1 -1
  143. package/dist/components/b2b-radio-group.js +1 -1
  144. package/dist/components/b2b-required-separator.js +1 -1
  145. package/dist/components/b2b-scrollable-container.js +1 -1
  146. package/dist/components/b2b-search.js +6 -1
  147. package/dist/components/b2b-tab-panel.js +1 -1
  148. package/dist/components/b2b-tab.js +1 -1
  149. package/dist/components/b2b-table-row.js +2 -3
  150. package/dist/components/b2b-table-rowgroup.js +2 -2
  151. package/dist/components/b2b-table.js +2 -2
  152. package/dist/components/b2b-textarea.js +1 -1
  153. package/dist/components/b2b-toggle-button.js +1 -1
  154. package/dist/components/b2b-toggle-group.js +1 -1
  155. package/dist/components/b2b-tooltip.js +1 -1
  156. package/dist/components/b2b-wizard-icon.js +1 -47
  157. package/dist/components/b2b-wizard-step.d.ts +11 -0
  158. package/dist/components/b2b-wizard-step.js +62 -0
  159. package/dist/components/b2b-wizard.d.ts +11 -0
  160. package/dist/components/b2b-wizard.js +79 -0
  161. package/dist/components/button.js +1 -1
  162. package/dist/components/headline.js +1 -1
  163. package/dist/components/icon.js +1 -1
  164. package/dist/components/input-group.js +20 -5
  165. package/dist/components/input-list-option.js +1 -1
  166. package/dist/components/input-list.js +1 -1
  167. package/dist/components/input.js +1 -1
  168. package/dist/components/rounded-icon.js +4 -1
  169. package/dist/components/separator.js +1 -1
  170. package/dist/components/spinner.js +1 -1
  171. package/dist/components/table-cell.js +2 -2
  172. package/dist/components/table-header.js +2 -2
  173. package/dist/components/{types.js → table.types.js} +2 -2
  174. package/dist/components/wizard-icon.js +52 -0
  175. package/dist/components/wizard.types.js +8 -0
  176. package/dist/custom-elements.json +110 -0
  177. package/dist/esm/b2b-alert.entry.js +1 -1
  178. package/dist/esm/b2b-anchor.entry.js +1 -1
  179. package/dist/esm/b2b-button_2.entry.js +2 -2
  180. package/dist/esm/b2b-card.entry.js +1 -1
  181. package/dist/esm/b2b-checkbox-group.entry.js +1 -1
  182. package/dist/esm/b2b-checkbox.entry.js +1 -1
  183. package/dist/esm/b2b-core-components.js +1 -1
  184. package/dist/esm/b2b-dropdown.entry.js +1 -1
  185. package/dist/esm/b2b-headline.entry.js +1 -1
  186. package/dist/esm/b2b-icon.entry.js +1 -1
  187. package/dist/esm/b2b-input-group_2.entry.js +19 -5
  188. package/dist/esm/b2b-input_2.entry.js +2 -2
  189. package/dist/esm/b2b-label.entry.js +1 -1
  190. package/dist/esm/b2b-modal.entry.js +1 -1
  191. package/dist/esm/b2b-pagination.entry.js +1 -1
  192. package/dist/esm/b2b-paragraph.entry.js +1 -1
  193. package/dist/esm/b2b-radio-button.entry.js +1 -1
  194. package/dist/esm/b2b-radio-group.entry.js +1 -1
  195. package/dist/esm/b2b-required-separator.entry.js +1 -1
  196. package/dist/esm/b2b-rounded-icon.entry.js +3 -1
  197. package/dist/esm/b2b-scrollable-container.entry.js +1 -1
  198. package/dist/esm/b2b-search.entry.js +5 -0
  199. package/dist/esm/b2b-separator.entry.js +1 -1
  200. package/dist/esm/b2b-tab-panel.entry.js +1 -1
  201. package/dist/esm/b2b-tab.entry.js +1 -1
  202. package/dist/esm/b2b-table-cell_2.entry.js +3 -3
  203. package/dist/esm/b2b-table-row.entry.js +2 -3
  204. package/dist/esm/b2b-table-rowgroup.entry.js +2 -2
  205. package/dist/esm/b2b-table.entry.js +2 -2
  206. package/dist/esm/b2b-textarea.entry.js +1 -1
  207. package/dist/esm/b2b-toggle-button.entry.js +1 -1
  208. package/dist/esm/b2b-toggle-group.entry.js +1 -1
  209. package/dist/esm/b2b-tooltip.entry.js +1 -1
  210. package/dist/esm/b2b-wizard-icon.entry.js +5 -3
  211. package/dist/esm/b2b-wizard-step.entry.js +22 -0
  212. package/dist/esm/b2b-wizard.entry.js +57 -0
  213. package/dist/esm/index-026605c2.js +14 -6
  214. package/dist/esm/loader.js +1 -1
  215. package/dist/esm/{types-5aa59787.js → table.types-9943c937.js} +2 -2
  216. package/dist/esm/wizard.types-2a03b8e0.js +8 -0
  217. package/dist/types/components/input-group/input-group.d.ts +4 -0
  218. package/dist/types/components/rounded-icon/rounded-icon.d.ts +4 -0
  219. package/dist/types/components/search/search.d.ts +1 -0
  220. package/dist/types/components/table/table-cell/table-cell.d.ts +1 -1
  221. package/dist/types/components/table/table-header/table-header.d.ts +1 -1
  222. package/dist/types/components/table/table-row/table-row.d.ts +1 -1
  223. package/dist/types/components/table/table-rowgroup/table-rowgroup.d.ts +1 -1
  224. package/dist/types/components/table/table.d.ts +1 -1
  225. package/dist/types/components/wizard/wizard-step.d.ts +11 -0
  226. package/dist/types/components/wizard/wizard.d.ts +19 -0
  227. package/dist/types/components/wizard/wizard.stories.d.ts +5 -0
  228. package/dist/types/components/wizard-icon/wizard-icon.d.ts +6 -2
  229. package/dist/types/components/wizard-icon/wizard-icon.stories.d.ts +2 -0
  230. package/dist/types/components.d.ts +98 -6
  231. package/dist/types/utils/types/wizard.types.d.ts +8 -0
  232. package/dist/web-types.json +108 -3
  233. package/package.json +3 -3
  234. package/dist/b2b-core-components/p-08a50b6c.entry.js +0 -1
  235. package/dist/b2b-core-components/p-10414c0b.entry.js +0 -1
  236. package/dist/b2b-core-components/p-1493f7df.entry.js +0 -1
  237. package/dist/b2b-core-components/p-15a499b0.entry.js +0 -1
  238. package/dist/b2b-core-components/p-22dab2b4.entry.js +0 -1
  239. package/dist/b2b-core-components/p-4b25559c.entry.js +0 -1
  240. package/dist/b2b-core-components/p-515eb49e.entry.js +0 -1
  241. package/dist/b2b-core-components/p-541ffefb.entry.js +0 -1
  242. package/dist/b2b-core-components/p-5572aab3.entry.js +0 -1
  243. package/dist/b2b-core-components/p-686d6598.entry.js +0 -1
  244. package/dist/b2b-core-components/p-6e0e6acc.entry.js +0 -1
  245. package/dist/b2b-core-components/p-6e3b27cd.entry.js +0 -1
  246. package/dist/b2b-core-components/p-7af1b977.entry.js +0 -1
  247. package/dist/b2b-core-components/p-7ca9b704.entry.js +0 -1
  248. package/dist/b2b-core-components/p-81a52d1a.entry.js +0 -1
  249. package/dist/b2b-core-components/p-8970ae74.entry.js +0 -1
  250. package/dist/b2b-core-components/p-925e40af.entry.js +0 -1
  251. package/dist/b2b-core-components/p-965ae161.entry.js +0 -1
  252. package/dist/b2b-core-components/p-99f8cf34.entry.js +0 -1
  253. package/dist/b2b-core-components/p-a6248754.entry.js +0 -1
  254. package/dist/b2b-core-components/p-b6e0a6ea.entry.js +0 -1
  255. package/dist/b2b-core-components/p-ba74cde5.entry.js +0 -1
  256. package/dist/b2b-core-components/p-bf4c58dc.entry.js +0 -1
  257. package/dist/b2b-core-components/p-c2bcf0a8.entry.js +0 -1
  258. package/dist/b2b-core-components/p-d6ce3259.entry.js +0 -1
  259. package/dist/b2b-core-components/p-da6a1f55.entry.js +0 -1
  260. package/dist/b2b-core-components/p-f0c565ef.entry.js +0 -1
  261. package/dist/b2b-core-components/p-fc639b29.entry.js +0 -1
  262. package/dist/b2b-core-components/p-ff49e330.entry.js +0 -1
  263. /package/dist/b2b-core-components/{p-4130f1ae.js → p-de2c1003.js} +0 -0
  264. /package/dist/types/{components/table/types.d.ts → utils/types/table.types.d.ts} +0 -0
@@ -3,6 +3,10 @@ export declare class RoundedIconComponent {
3
3
  * Use any type including hex, rgb or css custom properties
4
4
  * as long as you pass it as a string */
5
5
  color: string;
6
+ /** The color of the border of the circle around the icon or text.
7
+ * Use any type including hex, rgb or css custom properties
8
+ * as long as you pass it as a string */
9
+ borderColor: string;
6
10
  /** The color of the text or icon within the circle.
7
11
  * Use any type including hex, rgb or css custom properties
8
12
  * as long as you pass it as a string */
@@ -14,6 +14,7 @@ export declare class SearchComponent {
14
14
  b2bSearch: EventEmitter<SearchClickEventDetail>;
15
15
  closed: false;
16
16
  private onSearchClicked;
17
+ handleKeyDown(event: KeyboardEvent): void;
17
18
  private onInput;
18
19
  private onOptionSelected;
19
20
  render(): any;
@@ -1,4 +1,4 @@
1
- import { ContentAlignment, TableSizes, TableColourOptions } from '../types';
1
+ import { ContentAlignment, TableSizes, TableColourOptions } from '../../../utils/types/table.types';
2
2
  export declare class TableCellComponent {
3
3
  host: HTMLB2bTableCellElement;
4
4
  /** Whether text should wrap or truncate.
@@ -1,5 +1,5 @@
1
1
  import { EventEmitter } from '../../../stencil-public-runtime';
2
- import { TableSortDirections } from '../types';
2
+ import { TableSortDirections } from '../../../utils/types/table.types';
3
3
  export declare class TableHeaderComponent {
4
4
  hostElement: HTMLB2bTableHeaderElement;
5
5
  /** adds a border to the right of the header. **/
@@ -1,5 +1,5 @@
1
1
  import { EventEmitter } from '../../../stencil-public-runtime';
2
- import { TableRowTypes, TableColourOptions } from '../types';
2
+ import { TableRowTypes, TableColourOptions } from '../../../utils/types/table.types';
3
3
  export declare class TableRowComponent {
4
4
  hostElement: HTMLB2bTableRowElement;
5
5
  /** Whether the row will be highlighted on mouse over **/
@@ -1,4 +1,4 @@
1
- import { TableRowgroupTypes } from '../types';
1
+ import { TableRowgroupTypes } from '../../../utils/types/table.types';
2
2
  export declare class TableRowgroupComponent {
3
3
  host: HTMLB2bTableRowgroupElement;
4
4
  /** Rowgroup allows grouping rows by context: header, body or footer.
@@ -1,5 +1,5 @@
1
1
  import { EventEmitter } from '../../stencil-public-runtime';
2
- import { TableSizes } from './types';
2
+ import { TableSizes } from '../../utils/types/table.types';
3
3
  import { ColumnSortChangeEventDetail } from '../../utils/interfaces/interaction.interface';
4
4
  export declare class TableComponent {
5
5
  host: HTMLB2bTableElement;
@@ -0,0 +1,11 @@
1
+ import { WizardSteps, WizardStatus } from '../../utils/types/wizard.types';
2
+ export declare class WizardStepComponent {
3
+ /** Use when wizard has property custom true. The state of the step */
4
+ state: WizardStatus;
5
+ /** Use when wizard has property custom true. The step number */
6
+ step: WizardSteps;
7
+ /** Defaults to true. It will show a checkmark icon when a step is completed.
8
+ * Set as false to show the step number */
9
+ checkIcon: boolean;
10
+ render(): any;
11
+ }
@@ -0,0 +1,19 @@
1
+ import { WizardSteps } from '../../utils/types/wizard.types';
2
+ export declare class WizardComponent {
3
+ host: HTMLB2bWizardElement;
4
+ /** The current active step */
5
+ activeStep: WizardSteps | '0';
6
+ /** By default, is false, where the wizard will handle steps states.
7
+ * If set to true, steps state must be handled manually. */
8
+ custom: boolean;
9
+ /** Defaults to true. It will show a checkmark icon when a step is completed.
10
+ * Set as false to show the step number */
11
+ checkIcon: boolean;
12
+ private MAX_STEP_AMOUNT;
13
+ componentWillLoad(): void;
14
+ componentWillRender(): void;
15
+ private getChildSteps;
16
+ private setStepsState;
17
+ private getStepState;
18
+ render(): any;
19
+ }
@@ -0,0 +1,5 @@
1
+ import { Meta } from '@storybook/web-components';
2
+ export declare const story010Wizard: any;
3
+ export declare const story020WizardStates: any;
4
+ declare const _default: Meta<import("@storybook/web-components").Args>;
5
+ export default _default;
@@ -1,7 +1,11 @@
1
+ import { WizardStatus, WizardSteps } from '../../utils/types/wizard.types';
1
2
  export declare class WizardIconComponent {
2
3
  /** The step number */
3
- step: '1' | '2' | '3' | '4' | '5' | '6';
4
+ step: WizardSteps;
4
5
  /** The state of the step */
5
- state: 'completed' | 'pending' | 'disabled';
6
+ state: WizardStatus;
7
+ /** Defaults to true. It will show a checkmark icon when a step is completed.
8
+ * Set as false to show the step number */
9
+ checkIcon: boolean;
6
10
  render(): any;
7
11
  }
@@ -1,5 +1,7 @@
1
1
  import { Meta } from '@storybook/web-components';
2
+ export declare const story005Default: any;
2
3
  export declare const story010Completed: any;
4
+ export declare const story015CompletedWithNumber: any;
3
5
  export declare const story020Pending: any;
4
6
  export declare const story030Disabled: any;
5
7
  declare const _default: Meta<import("@storybook/web-components").Args>;
@@ -9,12 +9,14 @@ import { CheckboxEventDetail, InputChangeEvent, InputClear, OptionSelectedEventD
9
9
  import { IconName } from "./components/icon/types";
10
10
  import { BeforeCloseEventDetail } from "./utils/interfaces/status.interface";
11
11
  import { ColumnSortChangeEventDetail, PageChangeEventDetail, TabChangeEventDetail } from "./utils/interfaces/interaction.interface";
12
- import { ContentAlignment, TableColourOptions, TableRowgroupTypes, TableRowTypes, TableSizes, TableSortDirections } from "./components/table/types";
12
+ import { ContentAlignment, TableColourOptions, TableRowgroupTypes, TableRowTypes, TableSizes, TableSortDirections } from "./utils/types/table.types";
13
+ import { WizardStatus, WizardSteps } from "./utils/types/wizard.types";
13
14
  export { CheckboxEventDetail, InputChangeEvent, InputClear, OptionSelectedEventDetail, RadioEventDetail, SearchClickEventDetail, ToggleButtonEventDetail } from "./utils/interfaces/form.interface";
14
15
  export { IconName } from "./components/icon/types";
15
16
  export { BeforeCloseEventDetail } from "./utils/interfaces/status.interface";
16
17
  export { ColumnSortChangeEventDetail, PageChangeEventDetail, TabChangeEventDetail } from "./utils/interfaces/interaction.interface";
17
- export { ContentAlignment, TableColourOptions, TableRowgroupTypes, TableRowTypes, TableSizes, TableSortDirections } from "./components/table/types";
18
+ export { ContentAlignment, TableColourOptions, TableRowgroupTypes, TableRowTypes, TableSizes, TableSortDirections } from "./utils/types/table.types";
19
+ export { WizardStatus, WizardSteps } from "./utils/types/wizard.types";
18
20
  export namespace Components {
19
21
  interface B2bAlert {
20
22
  /**
@@ -567,6 +569,10 @@ export namespace Components {
567
569
  "label": string;
568
570
  }
569
571
  interface B2bRoundedIcon {
572
+ /**
573
+ * The color of the border of the circle around the icon or text. Use any type including hex, rgb or css custom properties as long as you pass it as a string
574
+ */
575
+ "borderColor": string;
570
576
  /**
571
577
  * The color of the circle around the icon or text. Use any type including hex, rgb or css custom properties as long as you pass it as a string
572
578
  */
@@ -827,15 +833,47 @@ export namespace Components {
827
833
  */
828
834
  "trigger": 'hover' | 'focus' | 'custom';
829
835
  }
836
+ interface B2bWizard {
837
+ /**
838
+ * The current active step
839
+ */
840
+ "activeStep": WizardSteps | '0';
841
+ /**
842
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
843
+ */
844
+ "checkIcon": boolean;
845
+ /**
846
+ * By default, is false, where the wizard will handle steps states. If set to true, steps state must be handled manually.
847
+ */
848
+ "custom": boolean;
849
+ }
830
850
  interface B2bWizardIcon {
851
+ /**
852
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
853
+ */
854
+ "checkIcon": boolean;
831
855
  /**
832
856
  * The state of the step
833
857
  */
834
- "state": 'completed' | 'pending' | 'disabled';
858
+ "state": WizardStatus;
835
859
  /**
836
860
  * The step number
837
861
  */
838
- "step": '1' | '2' | '3' | '4' | '5' | '6';
862
+ "step": WizardSteps;
863
+ }
864
+ interface B2bWizardStep {
865
+ /**
866
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
867
+ */
868
+ "checkIcon": boolean;
869
+ /**
870
+ * Use when wizard has property custom true. The state of the step
871
+ */
872
+ "state": WizardStatus;
873
+ /**
874
+ * Use when wizard has property custom true. The step number
875
+ */
876
+ "step": WizardSteps;
839
877
  }
840
878
  }
841
879
  export interface B2bAlertCustomEvent<T> extends CustomEvent<T> {
@@ -1197,12 +1235,24 @@ declare global {
1197
1235
  prototype: HTMLB2bTooltipElement;
1198
1236
  new (): HTMLB2bTooltipElement;
1199
1237
  };
1238
+ interface HTMLB2bWizardElement extends Components.B2bWizard, HTMLStencilElement {
1239
+ }
1240
+ var HTMLB2bWizardElement: {
1241
+ prototype: HTMLB2bWizardElement;
1242
+ new (): HTMLB2bWizardElement;
1243
+ };
1200
1244
  interface HTMLB2bWizardIconElement extends Components.B2bWizardIcon, HTMLStencilElement {
1201
1245
  }
1202
1246
  var HTMLB2bWizardIconElement: {
1203
1247
  prototype: HTMLB2bWizardIconElement;
1204
1248
  new (): HTMLB2bWizardIconElement;
1205
1249
  };
1250
+ interface HTMLB2bWizardStepElement extends Components.B2bWizardStep, HTMLStencilElement {
1251
+ }
1252
+ var HTMLB2bWizardStepElement: {
1253
+ prototype: HTMLB2bWizardStepElement;
1254
+ new (): HTMLB2bWizardStepElement;
1255
+ };
1206
1256
  interface HTMLElementTagNameMap {
1207
1257
  "b2b-alert": HTMLB2bAlertElement;
1208
1258
  "b2b-anchor": HTMLB2bAnchorElement;
@@ -1245,7 +1295,9 @@ declare global {
1245
1295
  "b2b-toggle-button": HTMLB2bToggleButtonElement;
1246
1296
  "b2b-toggle-group": HTMLB2bToggleGroupElement;
1247
1297
  "b2b-tooltip": HTMLB2bTooltipElement;
1298
+ "b2b-wizard": HTMLB2bWizardElement;
1248
1299
  "b2b-wizard-icon": HTMLB2bWizardIconElement;
1300
+ "b2b-wizard-step": HTMLB2bWizardStepElement;
1249
1301
  }
1250
1302
  }
1251
1303
  declare namespace LocalJSX {
@@ -1872,6 +1924,10 @@ declare namespace LocalJSX {
1872
1924
  "label"?: string;
1873
1925
  }
1874
1926
  interface B2bRoundedIcon {
1927
+ /**
1928
+ * The color of the border of the circle around the icon or text. Use any type including hex, rgb or css custom properties as long as you pass it as a string
1929
+ */
1930
+ "borderColor"?: string;
1875
1931
  /**
1876
1932
  * The color of the circle around the icon or text. Use any type including hex, rgb or css custom properties as long as you pass it as a string
1877
1933
  */
@@ -2172,15 +2228,47 @@ declare namespace LocalJSX {
2172
2228
  */
2173
2229
  "trigger"?: 'hover' | 'focus' | 'custom';
2174
2230
  }
2231
+ interface B2bWizard {
2232
+ /**
2233
+ * The current active step
2234
+ */
2235
+ "activeStep"?: WizardSteps | '0';
2236
+ /**
2237
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
2238
+ */
2239
+ "checkIcon"?: boolean;
2240
+ /**
2241
+ * By default, is false, where the wizard will handle steps states. If set to true, steps state must be handled manually.
2242
+ */
2243
+ "custom"?: boolean;
2244
+ }
2175
2245
  interface B2bWizardIcon {
2246
+ /**
2247
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
2248
+ */
2249
+ "checkIcon"?: boolean;
2176
2250
  /**
2177
2251
  * The state of the step
2178
2252
  */
2179
- "state"?: 'completed' | 'pending' | 'disabled';
2253
+ "state"?: WizardStatus;
2180
2254
  /**
2181
2255
  * The step number
2182
2256
  */
2183
- "step"?: '1' | '2' | '3' | '4' | '5' | '6';
2257
+ "step"?: WizardSteps;
2258
+ }
2259
+ interface B2bWizardStep {
2260
+ /**
2261
+ * Defaults to true. It will show a checkmark icon when a step is completed. Set as false to show the step number
2262
+ */
2263
+ "checkIcon"?: boolean;
2264
+ /**
2265
+ * Use when wizard has property custom true. The state of the step
2266
+ */
2267
+ "state"?: WizardStatus;
2268
+ /**
2269
+ * Use when wizard has property custom true. The step number
2270
+ */
2271
+ "step"?: WizardSteps;
2184
2272
  }
2185
2273
  interface IntrinsicElements {
2186
2274
  "b2b-alert": B2bAlert;
@@ -2224,7 +2312,9 @@ declare namespace LocalJSX {
2224
2312
  "b2b-toggle-button": B2bToggleButton;
2225
2313
  "b2b-toggle-group": B2bToggleGroup;
2226
2314
  "b2b-tooltip": B2bTooltip;
2315
+ "b2b-wizard": B2bWizard;
2227
2316
  "b2b-wizard-icon": B2bWizardIcon;
2317
+ "b2b-wizard-step": B2bWizardStep;
2228
2318
  }
2229
2319
  }
2230
2320
  export { LocalJSX as JSX };
@@ -2300,7 +2390,9 @@ declare module "@stencil/core" {
2300
2390
  * a specific trigger.
2301
2391
  */
2302
2392
  "b2b-tooltip": LocalJSX.B2bTooltip & JSXBase.HTMLAttributes<HTMLB2bTooltipElement>;
2393
+ "b2b-wizard": LocalJSX.B2bWizard & JSXBase.HTMLAttributes<HTMLB2bWizardElement>;
2303
2394
  "b2b-wizard-icon": LocalJSX.B2bWizardIcon & JSXBase.HTMLAttributes<HTMLB2bWizardIconElement>;
2395
+ "b2b-wizard-step": LocalJSX.B2bWizardStep & JSXBase.HTMLAttributes<HTMLB2bWizardStepElement>;
2304
2396
  }
2305
2397
  }
2306
2398
  }
@@ -0,0 +1,8 @@
1
+ export type WizardSteps = '1' | '2' | '3' | '4' | '5' | '6';
2
+ export declare const WizardStatus: {
3
+ readonly DEFAULT: "default";
4
+ readonly COMPLETED: "completed";
5
+ readonly PENDING: "pending";
6
+ readonly DISABLED: "disabled";
7
+ };
8
+ export type WizardStatus = (typeof WizardStatus)[keyof typeof WizardStatus];
@@ -1645,6 +1645,15 @@
1645
1645
  "symbol": "-rounded-icon"
1646
1646
  },
1647
1647
  "attributes": [
1648
+ {
1649
+ "name": "border-color",
1650
+ "description": "The color of the border of the circle around the icon or text.\nUse any type including hex, rgb or css custom properties\nas long as you pass it as a string\r\nValues: string",
1651
+ "required": false,
1652
+ "value": {
1653
+ "kind": "expression",
1654
+ "type": "string"
1655
+ }
1656
+ },
1648
1657
  {
1649
1658
  "name": "color",
1650
1659
  "description": "The color of the circle around the icon or text.\nUse any type including hex, rgb or css custom properties\nas long as you pass it as a string\r\nValues: string",
@@ -2487,6 +2496,49 @@
2487
2496
  ],
2488
2497
  "events": []
2489
2498
  },
2499
+ {
2500
+ "name": "b2b-wizard",
2501
+ "doc-url": "https://internal.otto.market/design-system/?path=/story/overview--page",
2502
+ "description": "",
2503
+ "source": {
2504
+ "module": "@otto-de/b2b-core-components/dist/types/components/wizard/wizard.d.ts",
2505
+ "symbol": "-wizard"
2506
+ },
2507
+ "attributes": [
2508
+ {
2509
+ "name": "active-step",
2510
+ "description": "The current active step\r\nValues: \"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\"",
2511
+ "required": false,
2512
+ "default": "'1'",
2513
+ "value": {
2514
+ "kind": "expression",
2515
+ "type": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\""
2516
+ }
2517
+ },
2518
+ {
2519
+ "name": "check-icon",
2520
+ "description": "Defaults to true. It will show a checkmark icon when a step is completed.\nSet as false to show the step number\r\nValues: boolean",
2521
+ "required": false,
2522
+ "default": "true",
2523
+ "value": {
2524
+ "kind": "expression",
2525
+ "type": "boolean"
2526
+ }
2527
+ },
2528
+ {
2529
+ "name": "custom",
2530
+ "description": "By default, is false, where the wizard will handle steps states.\nIf set to true, steps state must be handled manually.\r\nValues: boolean",
2531
+ "required": false,
2532
+ "default": "false",
2533
+ "value": {
2534
+ "kind": "expression",
2535
+ "type": "boolean"
2536
+ }
2537
+ }
2538
+ ],
2539
+ "slots": [],
2540
+ "events": []
2541
+ },
2490
2542
  {
2491
2543
  "name": "b2b-wizard-icon",
2492
2544
  "doc-url": "https://internal.otto.market/design-system/?path=/story/overview--page",
@@ -2496,20 +2548,73 @@
2496
2548
  "symbol": "-wizard-icon"
2497
2549
  },
2498
2550
  "attributes": [
2551
+ {
2552
+ "name": "check-icon",
2553
+ "description": "Defaults to true. It will show a checkmark icon when a step is completed.\nSet as false to show the step number\r\nValues: boolean",
2554
+ "required": false,
2555
+ "default": "true",
2556
+ "value": {
2557
+ "kind": "expression",
2558
+ "type": "boolean"
2559
+ }
2560
+ },
2561
+ {
2562
+ "name": "state",
2563
+ "description": "The state of the step\r\nValues: \"completed\", \"default\", \"disabled\", \"pending\"",
2564
+ "required": false,
2565
+ "default": "WizardStatus.PENDING",
2566
+ "value": {
2567
+ "kind": "expression",
2568
+ "type": "\"completed\" | \"default\" | \"disabled\" | \"pending\""
2569
+ }
2570
+ },
2571
+ {
2572
+ "name": "step",
2573
+ "description": "The step number\r\nValues: \"1\", \"2\", \"3\", \"4\", \"5\", \"6\"",
2574
+ "required": false,
2575
+ "value": {
2576
+ "kind": "expression",
2577
+ "type": "\"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\""
2578
+ }
2579
+ }
2580
+ ],
2581
+ "slots": [],
2582
+ "events": []
2583
+ },
2584
+ {
2585
+ "name": "b2b-wizard-step",
2586
+ "doc-url": "https://internal.otto.market/design-system/?path=/story/overview--page",
2587
+ "description": "",
2588
+ "source": {
2589
+ "module": "@otto-de/b2b-core-components/dist/types/components/wizard/wizard-step.d.ts",
2590
+ "symbol": "-wizard-step"
2591
+ },
2592
+ "attributes": [
2593
+ {
2594
+ "name": "check-icon",
2595
+ "description": "Defaults to true. It will show a checkmark icon when a step is completed.\nSet as false to show the step number\r\nValues: boolean",
2596
+ "required": false,
2597
+ "default": "true",
2598
+ "value": {
2599
+ "kind": "expression",
2600
+ "type": "boolean"
2601
+ }
2602
+ },
2499
2603
  {
2500
2604
  "name": "state",
2501
- "description": "The state of the step\r\nValues: \"completed\", \"disabled\", \"pending\"",
2605
+ "description": "Use when wizard has property custom true. The state of the step\r\nValues: \"completed\", \"default\", \"disabled\", \"pending\"",
2502
2606
  "required": false,
2503
2607
  "default": "'pending'",
2504
2608
  "value": {
2505
2609
  "kind": "expression",
2506
- "type": "\"completed\" | \"disabled\" | \"pending\""
2610
+ "type": "\"completed\" | \"default\" | \"disabled\" | \"pending\""
2507
2611
  }
2508
2612
  },
2509
2613
  {
2510
2614
  "name": "step",
2511
- "description": "The step number\r\nValues: \"1\", \"2\", \"3\", \"4\", \"5\", \"6\"",
2615
+ "description": "Use when wizard has property custom true. The step number\r\nValues: \"1\", \"2\", \"3\", \"4\", \"5\", \"6\"",
2512
2616
  "required": false,
2617
+ "default": "'1'",
2513
2618
  "value": {
2514
2619
  "kind": "expression",
2515
2620
  "type": "\"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\""
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@otto-de/b2b-core-components",
3
- "version": "1.4.0",
3
+ "version": "1.5.0",
4
4
  "description": "Core components defined with Stencil",
5
5
  "author": "Otto GmbH",
6
6
  "license": "Apache-2.0",
@@ -40,7 +40,7 @@
40
40
  "build:storybook": "npm run copy-md-files && build-storybook -o docs-build/design-system"
41
41
  },
42
42
  "dependencies": {
43
- "@otto-de/b2b-tokens": "1.4.0",
43
+ "@otto-de/b2b-tokens": "1.5.0",
44
44
  "@stencil-community/eslint-plugin": "^0.5.0",
45
45
  "@stencil/core": "^3.0.1"
46
46
  },
@@ -66,7 +66,7 @@
66
66
  "@types/mdx": "^2.0.5",
67
67
  "@types/postcss-import": "^14.0.0",
68
68
  "copyfiles": "^2.4.1",
69
- "css-loader": "^6.7.3",
69
+ "css-loader": "^6.8.1",
70
70
  "eslint": "^8.36.0",
71
71
  "eslint-config-prettier": "^8.8.0",
72
72
  "eslint-plugin-prettier": "^4.2.1",
@@ -1 +0,0 @@
1
- import{r as b,c as e,h as r,H as o,g as i}from"./p-a7417890.js";const t=class{constructor(r){b(this,r),this.b2bFocus=e(this,"b2b-focus",7),this.b2bBlur=e(this,"b2b-blur",7),this.b2bInput=e(this,"b2b-input",7),this.handleFormData=b=>{null!=this.name&&b.formData.append(this.name,this.value||"")},this.onFocus=b=>{this.b2bFocus.emit(b)},this.onBlur=b=>{this.b2bBlur.emit(b)},this.onInput=b=>{const e=b.target;null!==e&&(this.value=e.value||""),this.b2bInput.emit(e)},this.label=void 0,this.required=!1,this.placeholder=void 0,this.disabled=!1,this.invalid=!1,this.autofocus=!1,this.resize=void 0,this.hint=void 0,this.error=void 0,this.value=null,this.name=void 0,this.maxLength=void 0}connectedCallback(){const b=this.hostElement.closest("form");null!=b&&b.addEventListener("formdata",this.handleFormData)}render(){return r(o,{class:{"b2b-textarea":!0,"b2b-textarea--error":this.invalid&&!this.disabled}},this.label&&r("b2b-input-label",{id:this.name,required:this.required},this.label),r("textarea",{class:"textarea-input","aria-labelledby":this.name,style:Boolean(this.resize)&&{resize:this.resize},value:this.value,name:this.name,placeholder:this.placeholder,disabled:this.disabled,autoFocus:this.autofocus,onFocus:this.onFocus,onBlur:this.onBlur,onInput:this.onInput,maxLength:this.maxLength}),void 0!==this.hint&&!this.invalid||void 0!==this.hint&&this.disabled?r("span",null,this.hint):"",void 0!==this.error&&this.invalid&&!this.disabled?r("span",null,this.error):"")}get hostElement(){return i(this)}};t.style=':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:400;--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-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-45);--b2b-size-headline-line-height-100:var(--b2b-size-40);--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-75:var(--b2b-size-30);--b2b-size-copy-50:var(--b2b-size-25);--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:400;--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-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-textarea){font-family:var(--b2b-font-family-default)}:host(.b2b-textarea) .textarea-input{display:block;font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);line-height:var(--b2b-size-copy-line-height-100);background-color:var(--b2b-color-white-100);color:var(--b2b-color-black-100);border:1px solid var(--b2b-color-grey-200);border-radius:var(--b2b-size-border-radius-100);box-sizing:border-box;margin:var(--b2b-size-10) 0;padding:7px 12px 6px;width:100%;appearance:none;height:auto;min-height:4.5rem}:host(.b2b-textarea) .textarea-input::placeholder{color:var(--b2b-color-grey-300)}:host(.b2b-textarea) .textarea-input:disabled,:host(.b2b-textarea) .textarea-input:read-only{color:var(--b2b-color-grey-250);background-color:var(--b2b-color-grey-25);border:1px solid var(--b2b-color-grey-200)}:host(.b2b-textarea) b2b-input-label{display:block}:host(.b2b-textarea) span{display:block;font-size:var(--b2b-size-copy-75);line-height:var(--b2b-size-copy-line-height-75);color:var(--b2b-color-grey-300)}:host(.b2b-textarea--error) .textarea-input{background-color:var(--b2b-color-error-50);border:1px solid var(--b2b-color-error-100);color:var(--b2b-color-copy-default)}:host(.b2b-textarea--error) .textarea-input::placeholder{color:var(--b2b-color-copy-default)}:host(.b2b-textarea--error) .textarea-input:focus{outline-color:var(--b2b-color-error-100)}:host(.b2b-textarea--error) span{color:var(--b2b-color-error-100)}';export{t as b2b_textarea}
@@ -1 +0,0 @@
1
- import{r as b,c as e,h as r,H as o,g as i}from"./p-a7417890.js";const s=class{constructor(r){b(this,r),this.b2bChange=e(this,"b2b-selected",7),this.disabled=!1,this.href="",this.target="blank"}onClick(){this.b2bChange.emit()}onKeyDown(b){"Enter"===b.key&&this.b2bChange.emit()}getTabIndex(){return this.disabled?-1:""!=this.href?"":0}render(){return r(o,{tabIndex:this.getTabIndex(),"aria-disabled":this.disabled?"true":null,class:{"b2b-card":!0,"b2b-card--disabled":this.disabled}},""!=this.href&&r("a",{href:this.href,target:`_${this.target}`}),this.disabled&&r("div",{class:"b2b-card--disabled-overlay"}),r("slot",null))}get host(){return i(this)}};s.style=':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:400;--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-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-45);--b2b-size-headline-line-height-100:var(--b2b-size-40);--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-75:var(--b2b-size-30);--b2b-size-copy-50:var(--b2b-size-25);--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:400;--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-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{width:100%;cursor:pointer;display:block;overflow:hidden;box-sizing:border-box;box-shadow:var(--b2b-size-5) var(--b2b-size-5) 5px rgba(0, 0, 0, 0.15);padding:var(--b2b-size-45) var(--b2b-size-60) var(--b2b-size-60);background:var(--b2b-color-white-100);border:var(--b2b-size-1) solid var(--b2b-color-grey-100);border-radius:var(--b2b-size-25);position:relative}:host a{width:100%;height:100%;display:block;position:absolute;top:0;left:0}:host(.b2b-card:hover),:host(.b2b-card:focus){box-shadow:5px 5px var(--b2b-size-15) rgba(0, 0, 0, 0.15);transition:box-shadow 0.2s ease-in-out;outline:none}:host(.b2b-card:focus){outline:2px solid -webkit-focus-ring-color;outline-offset:-1px;z-index:9999}:host(.b2b-card--disabled){pointer-events:none;background:var(--b2b-color-grey-25);color:var(--b2b-color-grey-400)}:host(.b2b-card--disabled) .b2b-card--disabled-overlay{position:absolute;top:0;left:0;background-color:var(--b2b-color-grey-25);opacity:0.5;width:100%;height:100%}';export{s as b2b_card}
@@ -1 +0,0 @@
1
- import{r as b,c as e,h as o,H as r,g as i}from"./p-a7417890.js";const c=class{constructor(o){b(this,o),this.b2bFocus=e(this,"b2b-focus",7),this.b2bBlur=e(this,"b2b-blur",7),this.b2bChange=e(this,"b2b-change",7),this.handleFormData=b=>{null!=this.name&&this.checked&&b.formData.append(this.name,this.value||"on")},this.emitDetail=()=>{this.b2bChange.emit({checked:this.checked,value:this.value});const b=new globalThis.Event("change");this.hostElement.dispatchEvent(b)},this.onFocus=b=>{this.b2bFocus.emit(b)},this.onBlur=b=>{this.b2bBlur.emit(b)},this.onClick=b=>{b.preventDefault(),this.disabled||(this.checked=!this.checked,this.emitDetail())},this.label=void 0,this.required=!1,this.checked=!1,this.disabled=!1,this.error=void 0,this.hint=void 0,this.name=void 0,this.value=void 0,this.invalid=!1}connectedCallback(){const b=this.hostElement.closest("form");null!=b&&b.addEventListener("formdata",this.handleFormData)}render(){return o(r,{onClick:this.onClick},o("div",{class:{"b2b-checkbox":!0,"b2b-checkbox--error":this.invalid&&!this.disabled,"b2b-checkbox--disabled":this.disabled,"b2b-checkbox-checked":this.checked}},o("div",{class:"b2b-checkbox-items"},o("svg",{class:"b2b-checkbox-icon",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 32 32"},o("path",{d:"M11.798 25.082c-.341 0-.681-.13-.942-.389l-7.132-7.115a1.334 1.334 0 0 1 1.884-1.888l6.19 6.175L26.391 7.307a1.334 1.334 0 0 1 1.884 1.888L12.74 24.693c-.26.259-.601.389-.942.389z"})),o("input",{class:"b2b-checkbox-input","aria-labelledby":this.name,type:"checkbox",name:this.name,id:this.name,value:this.value,checked:this.checked,disabled:this.disabled,onFocus:this.onFocus,onBlur:this.onBlur}),o("b2b-input-label",{id:this.name,required:this.required,disabled:this.disabled},this.label)),void 0!==this.hint&&!this.invalid||void 0!==this.hint&&this.disabled?o("span",null,this.hint):"",void 0!==this.error&&this.invalid&&!this.disabled?o("span",null,this.error):""))}get hostElement(){return i(this)}};c.style=':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:400;--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-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-45);--b2b-size-headline-line-height-100:var(--b2b-size-40);--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-75:var(--b2b-size-30);--b2b-size-copy-50:var(--b2b-size-25);--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:400;--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-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")}:root{--b2b-checkbox-margin-bottom:0}.b2b-checkbox{display:block;font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-copy-100);width:fit-content;margin-bottom:var(--b2b-checkbox-margin-bottom);margin-right:var(--b2b-size-60)}.b2b-checkbox-items{display:flex;justify-content:flex-start}.b2b-checkbox-icon{position:absolute;fill:var(--b2b-color-white-100);display:none;margin-top:3px;margin-left:var(--b2b-size-1);width:var(--b2b-size-35);height:var(--b2b-size-35);z-index:1000}.b2b-checkbox-input{margin:2px 6px 3px 0;appearance:none;background-color:var(--b2b-color-white-100);border:1px solid var(--b2b-color-grey-400);border-radius:var(--b2b-size-border-radius-100);display:inline-block;position:relative;vertical-align:top;width:var(--b2b-size-40);height:var(--b2b-size-40);flex-shrink:0}.b2b-checkbox-checked .b2b-checkbox-icon{display:inline-block}.b2b-checkbox-checked .b2b-checkbox-input{border-color:var(--b2b-color-black-100);background-color:var(--b2b-color-black-100)}.b2b-checkbox b2b-input-label{display:inline;vertical-align:bottom;user-select:none}.b2b-checkbox span{display:block;font-size:var(--b2b-size-copy-75);color:var(--b2b-color-grey-300);line-height:var(--b2b-size-copy-line-height-75);user-select:none}.b2b-checkbox--error{}.b2b-checkbox--error .b2b-checkbox-input{background-color:var(--b2b-color-error-50);border:1px solid var(--b2b-color-error-100)}.b2b-checkbox--error span{color:var(--b2b-color-error-100)}.b2b-checkbox--error.b2b-checkbox-checked .b2b-checkbox-input{background-color:var(--b2b-color-error-100);border-color:var(--b2b-color-error-100)}.b2b-checkbox--disabled{pointer-events:none}.b2b-checkbox--disabled .b2b-checkbox-input{background-color:var(--b2b-color-grey-25);border-color:var(--b2b-color-grey-300)}.b2b-checkbox.b2b-checkbox--disabled.b2b-checkbox-checked .b2b-checkbox-input{background-color:var(--b2b-color-grey-300);border-color:var(--b2b-color-grey-300)}';export{c as b2b_checkbox}
@@ -1 +0,0 @@
1
- import{r as b,h as e,H as r,g as o}from"./p-a7417890.js";const i=class{constructor(e){b(this,e)}render(){return e(r,null,e("slot",null))}get host(){return o(this)}};i.style=':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:400;--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-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-45);--b2b-size-headline-line-height-100:var(--b2b-size-40);--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-75:var(--b2b-size-30);--b2b-size-copy-50:var(--b2b-size-25);--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:400;--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-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{overflow:auto;display:block;white-space:nowrap;position:relative}';export{i as b2b_scrollable_container}
@@ -1 +0,0 @@
1
- import{r as b,c as e,h as o,H as r,g as i}from"./p-a7417890.js";const t=class{constructor(o){b(this,o),this.b2bChange=e(this,"b2b-change",7),this.onClick=b=>{if(b.preventDefault(),this.disabled||this.checked)return;this.checked=!0,this.uncheckSiblings(),this.b2bChange.emit({value:this.value});const e=new globalThis.Event("change");this.host.dispatchEvent(e)},this.uncheckSiblings=()=>{this.getSiblingToggles().forEach((b=>{b.checked=!1}))},this.label=void 0,this.name=void 0,this.checked=!1,this.disabled=!1,this.value=void 0}getSiblingToggles(){return Array.from(document.querySelectorAll(`b2b-toggle-button[name="${this.name}"]`)).filter((b=>b.value!==this.value))}render(){return o(r,{onClick:this.onClick},o("span",{class:{"b2b-toggle-button":!0,"b2b-toggle-button--disabled":this.disabled}},o("input",{tabindex:0,class:{"b2b-toggle-button-input":!0,"b2b-toggle-button-input--disabled":this.disabled},"aria-labelledby":this.name,type:"radio",checked:this.checked&&!this.disabled,disabled:this.disabled,name:this.name,value:this.value}),o("label",{id:this.name,tabindex:-1,class:{"b2b-toggle-button-label":!0,"b2b-toggle-button-label--disabled":this.disabled,"b2b-toggle-button-label--checked":this.checked&&!this.disabled}},this.label)))}get host(){return i(this)}};t.style=':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:400;--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-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-45);--b2b-size-headline-line-height-100:var(--b2b-size-40);--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-75:var(--b2b-size-30);--b2b-size-copy-50:var(--b2b-size-25);--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:400;--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-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-border-radius:var(--b2b-size-border-radius-100);--b2b-border-right:1px solid var(--b2b-color-grey-200);font-family:var(--b2b-font-family-default);font-size:var(--b2b-size-35);line-height:var(--b2b-size-copy-line-height-75);position:relative;margin:0}:host .b2b-toggle-button-input{border:0;clip:rect(0, 0, 0, 0);height:1px;overflow:hidden;position:absolute !important;width:1px}:host .b2b-toggle-button-label{display:inline-block;position:relative;box-sizing:border-box;font-family:OttoSans, Arial, Helvetica, sans-serif;line-height:1.75rem;transition:all 0.3s ease;background-color:var(--b2b-color-grey-50);border:1px solid var(--b2b-color-grey-200);border-radius:var(--b2b-border-radius);border-right:var(--b2b-border-right);cursor:pointer;text-align:center;text-decoration:none;padding:0 var(--b2b-size-20)}:host .b2b-toggle-button-label:hover{background-color:var(--b2b-color-grey-200)}:host .b2b-toggle-button-input:focus+label{outline:2px solid -webkit-focus-ring-color;z-index:1;transition:none}:host .b2b-toggle-button-input--disabled:focus+label{outline:none}:host .b2b-toggle-button-label--checked,:host .b2b-toggle-button-label--checked:hover{color:var(--b2b-color-white-100);background-color:var(--b2b-color-black-50);border-color:var(--b2b-color-black-50)}:host .b2b-toggle-button-label--disabled,:host .b2b-toggle-button-label--disabled:hover{pointer-events:none;color:var(--b2b-color-grey-250);border-color:var(--b2b-color-grey-100);border-left:var(--b2b-border-left);background-color:var(--b2b-color-grey-50)}';export{t as b2b_toggle_button}