@lynx-js/web-elements-canary 0.8.9-canary-20251013-e500bc6e → 0.8.9-canary-20251014-df5ebcf0

package/CHANGELOG.md

@@ -1,13 +1,17 @@
 # @lynx-js/web-elements
 
-## 0.8.9-canary-20251013040601-e500bc6ee865fe1ab17c2ace77c3bcf8462f74c5
+## 0.8.9-canary-20251014105759-df5ebcf0408950d0380b6d53ad0b9d43eacf36b6
 
 ### Patch Changes
 
+- fix: layoutchange event result `detail.top` and `detail.left` was `0` incorrectly ([#1887](https://github.com/lynx-family/lynx-stack/pull/1887))
+
 - textarea placeholder inherits font-size by default ([#1874](https://github.com/lynx-family/lynx-stack/pull/1874))
 
+- feat: support <x-text text="content"></x-text> ([#1881](https://github.com/lynx-family/lynx-stack/pull/1881))
+
 - Updated dependencies []:
-  - @lynx-js/web-elements-template@0.8.9-canary-20251013040601-e500bc6ee865fe1ab17c2ace77c3bcf8462f74c5
+  - @lynx-js/web-elements-template@0.8.9-canary-20251014105759-df5ebcf0408950d0380b6d53ad0b9d43eacf36b6
 
 ## 0.8.8
 

package/dist/XText/XText.js

@@ -7,10 +7,11 @@ import { __esDecorate, __runInitializers } from "tslib";
 import { Component } from '@lynx-js/web-elements-reactive';
 import { XTextTruncation } from './XTextTruncation.js';
 import { ScrollIntoView } from '../ScrollView/ScrollIntoView.js';
+import { RawTextAttributes } from './RawText.js';
 import { CommonEventsAndMethods, layoutChangeTarget, } from '../common/CommonEventsAndMethods.js';
 import { templateXText } from '@lynx-js/web-elements-template';
 let XText = (() => {
-    let _classDecorators = [Component('x-text', [CommonEventsAndMethods, XTextTruncation], templateXText)];
+    let _classDecorators = [Component('x-text', [CommonEventsAndMethods, XTextTruncation, RawTextAttributes], templateXText)];
     let _classDescriptor;
     let _classExtraInitializers = [];
     let _classThis;

package/dist/common/CommonEventsAndMethods.js

@@ -29,9 +29,10 @@ let CommonEventsAndMethods = (() => {
                 if (!this.#resizeObserver) {
                     this.#resizeObserver = new ResizeObserver(([entry]) => {
                         if (entry) {
-                            // The layoutchange event is the border box of the element
-                            const { width, height, left, right, top, bottom } = entry.contentRect;
                             const id = this.#dom.id;
+                            // Reuse getBoundingClientRect to get left and top, because ResizeObserver-contentRect is calculated based on padding box
+                            const { top, bottom, left, right, width, height } = entry.target
+                                .getBoundingClientRect();
                             this.#dom.dispatchEvent(new CustomEvent('layoutchange', {
                                 detail: {
                                     width,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-elements-canary",
-  "version": "0.8.9-canary-20251013-e500bc6e",
+  "version": "0.8.9-canary-20251014-df5ebcf0",
   "private": false,
   "repository": {
     "type": "git",
@@ -101,7 +101,7 @@
   ],
   "dependencies": {
     "@lynx-js/web-elements-reactive": "npm:@lynx-js/web-elements-reactive-canary@0.2.2",
-    "@lynx-js/web-elements-template": "npm:@lynx-js/web-elements-template-canary@0.8.9-canary-20251013-e500bc6e"
+    "@lynx-js/web-elements-template": "npm:@lynx-js/web-elements-template-canary@0.8.9-canary-20251014-df5ebcf0"
   },
   "devDependencies": {
     "tslib": "^2.8.1"

package/src/XText/x-text.css

@@ -240,7 +240,8 @@ inline-text > lynx-wrapper > raw-text {
   display: contents !important;
 }
 
-raw-text:not(:defined)::before {
+raw-text:not(:defined)::before,
+x-text:not(:has(x-text, raw-text)):not(:defined)::before {
   content: attr(text);
   display: contents;
 }