diff --git a/src/plugins/header/header.tsx b/src/plugins/header/header.tsx
index 872d8e3e..926235f4 100644
--- a/src/plugins/header/header.tsx
+++ b/src/plugins/header/header.tsx
@@ -41,7 +41,7 @@ export class UIPHeader extends UIPPlugin {
 
   /** Renders copy icon */
   protected renderCopy(): void {
-    const icon = <button title="copy markup" className="copy-icon">{UIPOptionIcons.copySVG}</button>;
+    const icon = <button title="copy markup" className="copy-icon">{UIPOptionIcons.copySVG.cloneNode(true) as HTMLElement}</button>;
     this.append(icon);
   }
 
diff --git a/src/plugins/header/options/option/option.tsx b/src/plugins/header/options/option/option.tsx
index 8872cba9..212ea159 100644
--- a/src/plugins/header/options/option/option.tsx
+++ b/src/plugins/header/options/option/option.tsx
@@ -31,7 +31,9 @@ export class UIPOption extends ESLBaseElement {
 
   /** Builds option element from {@link OptionConfig} */
   static createEl(optionConfig: OptionConfig) {
-    const option =  <uip-option attribute={optionConfig.optionValue}>{optionConfig.svg.cloneNode(true)}</uip-option> as UIPOption;
+    const option = document.createElement('uip-option') as UIPOption;
+    option.setAttribute('attribute', optionConfig.optionValue);
+    option.append(optionConfig.svg.cloneNode(true));
     option.config = optionConfig;
     return option;
   }
@@ -74,12 +76,3 @@ export class UIPOption extends ESLBaseElement {
     this.active = force === undefined ? !this.active : force;
   }
 }
-
-declare global {
-  namespace JSX {
-    interface IntrinsicElements {
-      /** {@link UIPOption} custom tag */
-      'uip-option': UIPOption;
-    }
-  }
-}
diff --git a/src/plugins/settings/settings.tsx b/src/plugins/settings/settings.tsx
index 8e0b93aa..fb99a732 100644
--- a/src/plugins/settings/settings.tsx
+++ b/src/plugins/settings/settings.tsx
@@ -29,11 +29,13 @@ export class UIPSettings extends UIPPlugin {
 
   /** Initializes settings layout */
   protected updateInner() {
-    const content = <div className="settings-list esl-scrollable-content">
-      {this.childNodes}
+    const $content = <div className="settings-list esl-scrollable-content">
       <esl-scrollbar target="::prev(.settings-list)"></esl-scrollbar>
     </div>;
-    this.$inner.appendChild(content);
+    [...this.childNodes].forEach((node: HTMLElement) => {
+      $content.appendChild(node);
+    });
+    this.$inner.appendChild($content);
     this.appendChild(this.$inner);
   }
 
diff --git a/src/settings/bool-setting/bool-setting.tsx b/src/settings/bool-setting/bool-setting.tsx
index de68e8d2..37290826 100644
--- a/src/settings/bool-setting/bool-setting.tsx
+++ b/src/settings/bool-setting/bool-setting.tsx
@@ -48,11 +48,11 @@ export class UIPBoolSetting extends UIPSetting {
     super.connectedCallback();
     this.innerHTML = '';
 
-    const inner = <label>
+    const $inner = <label>
       {this.label}
       {this.$field}
     </label>;
-    this.insertBefore(inner, this.firstChild);
+    this.insertBefore($inner, this.firstChild);
   }
 
   applyTo(model: UIPStateModel): void {
diff --git a/src/settings/slider-setting/slider-setting.tsx b/src/settings/slider-setting/slider-setting.tsx
index bdb67bdd..02e782da 100644
--- a/src/settings/slider-setting/slider-setting.tsx
+++ b/src/settings/slider-setting/slider-setting.tsx
@@ -22,7 +22,7 @@ export class UIPSliderSetting extends UIPSetting {
   protected connectedCallback() {
     super.connectedCallback();
 
-    const inner =
+    const $inner =
       <>
         <label>
           <span>{this.label}</span>
@@ -31,7 +31,7 @@ export class UIPSliderSetting extends UIPSetting {
         {this.$fieldValue}
       </>;
 
-    this.append(inner);
+    this.append($inner);
   }
 
   protected disconnectedCallback() {
diff --git a/src/settings/text-setting/text-setting.tsx b/src/settings/text-setting/text-setting.tsx
index 3f338bc6..ed63c09c 100644
--- a/src/settings/text-setting/text-setting.tsx
+++ b/src/settings/text-setting/text-setting.tsx
@@ -26,12 +26,12 @@ export class UIPTextSetting extends UIPSetting {
     super.connectedCallback();
     this.innerHTML = '';
 
-    const inner = <label>
+    const $inner = <label>
       {this.label}
       {this.$field}
     </label>;
 
-    this.appendChild(inner);
+    this.appendChild($inner);
   }
 
   protected getDisplayedValue(): string {