rt-native 1.0.104 → 1.0.105

package/README.md

@@ -388,6 +388,7 @@ rt-native {
 | `--rtb-editor-border-radius` | `0px` | Outer corner radius |
 | `--rtb-editor-shadow` | `none` | Outer box shadow |
 | `--rtb-editor-resize` | `auto` | `auto` shows the resize handle; `hidden` removes it |
+| `--rtb-z-index` | `1` | Z-index of the editor container — raise this to stack the editor above surrounding page content |
 
 ---
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rt-native",
-  "version": "1.0.104",
+  "version": "1.0.105",
   "description": "rt-native HTML Editor is a free native web component that provides accessibility features and a wide variety of elements and customizations that make it one of the most robust and flexible HTML editors available. It allows the programmer to apply custom .css files to the preview window, so see how the content will be displayed in production. The editor uses embedded .svg Google Font Icons and the shadow DOM to isolate the HTML from inheriting the existing page styles. No frameworks, no build step, no dependencies — drop one script tag into any HTML page and you're done.",
   "main": "rt-native.js",
   "exports": {

package/rt-native.js

@@ -5338,7 +5338,7 @@ const _RTB_SHADOW_CSS = `
     height: var(--rtb-editor-height, 300px);
     display: flex;
     flex-direction: column;
-    z-index: 1;
+    z-index: var(--rtb-z-index, 1);
 }
 .rich-text-box-content-container {
     width: 100%;
@@ -5596,6 +5596,12 @@ const _RTB_SHADOW_CSS = `
     resize: both;
     overflow: hidden;
     box-sizing: border-box;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    margin: 0;
+    z-index: 9999;
 }
 .rtb-preview-dialog[open] {
     display: flex;
@@ -5892,6 +5898,9 @@ rt-native {
     /* Placeholder */
     --rtb-placeholder-color:     #9ca3af;
 
+    /* Stacking context — raise the entire editor above surrounding content */
+    --rtb-z-index:               1;
+
     /* Modals / dialogs */
     --rtb-modal-bg:              #ffffff;
     --rtb-modal-text:            #242424;