| <!-- |
| @WAIT-FOR:Kettle |
| --> |
| <!DOCTYPE html> |
| <!-- saved from url=(0072)https://design-systems.pages.booking.com/dev-tools/component-viewer/#bui --> |
| <html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head> |
| <body> |
| <div> |
| <button> |
| <span class="icon"> |
| <svg class="" data-width="24" data-icon-name="kettle" viewBox="0 0 24 24" role="presentation"> |
| <defs> |
| <style>.cls-1{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px}</style> |
| </defs> |
| </svg> <!-- svg --> |
| </span> |
| <span class="label"></span> |
| </button> |
| </div> |
| <script> |
| document.addEventListener('DOMContentLoaded', () => { |
| setTimeout(() => { |
| // Make sure that nothing inside of an SVG element is exposed. |
| const circle = document.createElementNS("http://www.w3.org/2000/svg", 'circle'); |
| document.querySelector('style').appendChild(circle); |
| const foreignObject = document.createElementNS("http://www.w3.org/2000/svg", 'foreignObject'); |
| document.querySelector('style').appendChild(foreignObject); |
| const input = document.createElementNS("http://www.w3.org/1999/xhtml", 'input'); |
| foreignObject.appendChild(input); |
| document.querySelector('.label').innerText = 'Kettle'; |
| }, 300); |
| }); |
| </script> |
| </body> |
| </html> |
