@textbus/platform-browser 4.2.0 → 4.2.2

package/bundles/browser-module.d.ts

@@ -43,7 +43,7 @@ export declare class BrowserModule implements Module {
      * @param textbus
      */
     readDocumentByComponentLiteral(data: ComponentLiteral, rootComponent: ComponentConstructor, textbus: Textbus): Component;
-    setup(textbus: Textbus): () => void;
+    setup(textbus: Textbus): Promise<() => void>;
     onAfterStartup(textbus: Textbus): void;
     onDestroy(textbus: Textbus): void;
     private static createLayout;

package/bundles/index.esm.js

@@ -150,6 +150,16 @@ function __metadata(metadataKey, metadataValue) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
 }
 
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
     var e = new Error(message);
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
@@ -1043,7 +1053,7 @@ class ExperimentalCaret {
             nativeRange.collapse();
         }
         const rect = getLayoutRectByRange(nativeRange);
-        const { fontSize, lineHeight, color } = getComputedStyle(node);
+        const { fontSize, lineHeight, color, writingMode } = getComputedStyle(node);
         let height;
         if (isNaN(+lineHeight)) {
             const f = parseFloat(lineHeight);
@@ -1072,7 +1082,8 @@ class ExperimentalCaret {
             rotate = Math.round(Math.atan2(rect.width, rect.height) * 180 / Math.PI);
             if (rotate !== 0) {
                 const hackEle = document.createElement('span');
-                hackEle.style.cssText = 'display: inline-block; width: 10px; height: 10px; position: relative; contain: layout style size;';
+                // eslint-disable-next-line max-len
+                hackEle.style.cssText = 'display: inline-block; width: 10px; height: 10px; position: relative; contain: layout style size; writing-mode: inherit';
                 const pointEle = document.createElement('span');
                 pointEle.style.cssText = 'position: absolute; left: 0; top: 0; width:0;height:0';
                 hackEle.append(pointEle);
@@ -1087,6 +1098,9 @@ class ExperimentalCaret {
                 hackEle.remove();
             }
         }
+        if (rotate === 0 && (writingMode === 'vertical-lr' || writingMode === 'vertical-rl')) {
+            rotate += 90;
+        }
         Object.assign(this.elementRef.style, {
             left: left + 'px',
             top: top + 'px',
@@ -2243,15 +2257,18 @@ class BrowserModule {
         return registry.createComponentByFactory(data, rootComponent);
     }
     setup(textbus) {
-        this.textbus = textbus;
-        const host = this.config.renderTo();
-        if (!(host instanceof HTMLElement)) {
-            throw browserErrorFn('view container is not a HTMLElement');
-        }
-        host.append(this.workbench);
-        return () => {
-            this.workbench.remove();
-        };
+        return __awaiter(this, void 0, void 0, function* () {
+            this.textbus = textbus;
+            const host = this.config.renderTo();
+            if (!(host instanceof HTMLElement)) {
+                throw browserErrorFn('view container is not a HTMLElement');
+            }
+            host.append(this.workbench);
+            yield textbus.get(Input).onReady;
+            return () => {
+                this.workbench.remove();
+            };
+        });
     }
     onAfterStartup(textbus) {
         if (this.config.autoFocus) {

package/bundles/index.js

@@ -152,6 +152,16 @@ function __metadata(metadataKey, metadataValue) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
 }
 
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
     var e = new Error(message);
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
@@ -1045,7 +1055,7 @@ class ExperimentalCaret {
             nativeRange.collapse();
         }
         const rect = getLayoutRectByRange(nativeRange);
-        const { fontSize, lineHeight, color } = getComputedStyle(node);
+        const { fontSize, lineHeight, color, writingMode } = getComputedStyle(node);
         let height;
         if (isNaN(+lineHeight)) {
             const f = parseFloat(lineHeight);
@@ -1074,7 +1084,8 @@ class ExperimentalCaret {
             rotate = Math.round(Math.atan2(rect.width, rect.height) * 180 / Math.PI);
             if (rotate !== 0) {
                 const hackEle = document.createElement('span');
-                hackEle.style.cssText = 'display: inline-block; width: 10px; height: 10px; position: relative; contain: layout style size;';
+                // eslint-disable-next-line max-len
+                hackEle.style.cssText = 'display: inline-block; width: 10px; height: 10px; position: relative; contain: layout style size; writing-mode: inherit';
                 const pointEle = document.createElement('span');
                 pointEle.style.cssText = 'position: absolute; left: 0; top: 0; width:0;height:0';
                 hackEle.append(pointEle);
@@ -1089,6 +1100,9 @@ class ExperimentalCaret {
                 hackEle.remove();
             }
         }
+        if (rotate === 0 && (writingMode === 'vertical-lr' || writingMode === 'vertical-rl')) {
+            rotate += 90;
+        }
         Object.assign(this.elementRef.style, {
             left: left + 'px',
             top: top + 'px',
@@ -2245,15 +2259,18 @@ class BrowserModule {
         return registry.createComponentByFactory(data, rootComponent);
     }
     setup(textbus) {
-        this.textbus = textbus;
-        const host = this.config.renderTo();
-        if (!(host instanceof HTMLElement)) {
-            throw browserErrorFn('view container is not a HTMLElement');
-        }
-        host.append(this.workbench);
-        return () => {
-            this.workbench.remove();
-        };
+        return __awaiter(this, void 0, void 0, function* () {
+            this.textbus = textbus;
+            const host = this.config.renderTo();
+            if (!(host instanceof HTMLElement)) {
+                throw browserErrorFn('view container is not a HTMLElement');
+            }
+            host.append(this.workbench);
+            yield textbus.get(Input).onReady;
+            return () => {
+                this.workbench.remove();
+            };
+        });
     }
     onAfterStartup(textbus) {
         if (this.config.autoFocus) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@textbus/platform-browser",
-  "version": "4.2.0",
+  "version": "4.2.2",
   "description": "Textbus is a rich text editor and framework that is highly customizable and extensible to achieve rich wysiwyg effects.",
   "main": "./bundles/index.js",
   "module": "./bundles/index.esm.js",
@@ -26,7 +26,7 @@
   ],
   "dependencies": {
     "@tanbo/stream": "^1.2.5",
-    "@textbus/core": "^4.2.0",
+    "@textbus/core": "^4.2.1",
     "@viewfly/core": "^1.0.5"
   },
   "devDependencies": {