@lynx-js/web-elements 0.7.3 → 0.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/README.md +19 -20
  3. package/dist/XFoldViewNg/XFoldviewNgEvents.js +4 -4
  4. package/dist/XText/XTextTruncation.js +11 -11
  5. package/dist/common/CommonEventsAndMethods.js +4 -4
  6. package/package.json +2 -2
  7. package/src/XFoldViewNg/x-foldview-ng.css +1 -1
  8. package/src/XText/x-text.css +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @lynx-js/web-elements
2
2
 
3
+ ## 0.7.4
4
+
5
+ ### Patch Changes
6
+
7
+ - fix: x-foldview-ng `overflow-y: scroll` add !important to avoid being covered. ([#932](https://github.com/lynx-family/lynx-stack/pull/932))
8
+
9
+ - Updated dependencies []:
10
+ - @lynx-js/web-elements-template@0.7.4
11
+
3
12
  ## 0.7.3
4
13
 
5
14
  ### Patch Changes
package/README.md CHANGED
@@ -4,26 +4,25 @@ It provides the custom-element implementation of Lynx Elements in Web.
4
4
 
5
5
  So far, support compared to Lynx Elements on the client:
6
6
 
7
- | Elements | Whether support | Details |
8
- | -------------- | --------------- | ------------------------------------------------------------------------------ |
9
- | Elements | | |
10
- | canvas | ❌ | No |
11
- | image | ✅ | Full Support |
12
- | list | ✅ | list-type with single and flow are available, and waterfall is being supported |
13
- | scroll-view | ✅ | Full Support |
14
- | text | ✅ | Full Support |
15
- | view | ✅ | Full Support |
16
- | X-Elements | | |
17
- | svg | ✅ | Full Support |
18
- | x-blur-view | ✅ | Full Support |
19
- | x-input | ✅ | Full Support |
20
- | x-textarea | ✅ | Full Support |
21
- | x-swiper | ✅ | Full Support |
22
- | x-viewpager-ng | ✅ | Full Support |
23
- | x-foldview-ng | ✅ | Full Support |
24
- | x-refresh-view | ✅ | Full Support |
25
- | x-overlay-ng | ✅ | Full Support |
26
- | x-audio-tt | ✅ | Full Support |
7
+ | Elements | Whether support | Details |
8
+ | -------------- | --------------- | ------------ |
9
+ | Elements | | |
10
+ | image | ✅ | Full Support |
11
+ | list | ✅ | Full Support |
12
+ | scroll-view | ✅ | Full Support |
13
+ | text | ✅ | Full Support |
14
+ | view | ✅ | Full Support |
15
+ | X-Elements | | |
16
+ | svg | ✅ | Full Support |
17
+ | x-blur-view | ✅ | Full Support |
18
+ | x-input | ✅ | Full Support |
19
+ | x-textarea | ✅ | Full Support |
20
+ | x-swiper | ✅ | Full Support |
21
+ | x-viewpager-ng | ✅ | Full Support |
22
+ | x-foldview-ng | ✅ | Full Support |
23
+ | x-refresh-view | ✅ | Full Support |
24
+ | x-overlay-ng | ✅ | Full Support |
25
+ | x-audio-tt | ✅ | Full Support |
27
26
 
28
27
  ## Usage
29
28
 
package/dist/XFoldViewNg/XFoldviewNgEvents.js CHANGED
@@ -46,16 +46,16 @@ let XFoldviewNgEvents = (() => {
46
46
  get #handleGranularity() { return _private_handleGranularity_descriptor.value; }
47
47
  get #enableOffsetEvent() { return _private_enableOffsetEvent_descriptor.value; }
48
48
  #handleScroll = () => {
49
- const curentScrollTop = this.#dom.scrollTop;
50
- const scrollLength = Math.abs(this.#pervScroll - curentScrollTop);
49
+ const currentScrollTop = this.#dom.scrollTop;
50
+ const scrollLength = Math.abs(this.#pervScroll - currentScrollTop);
51
51
  if (scrollLength > this.#granularity
52
52
  || this.#dom.scrollTop === 0
53
53
  || Math.abs(this.#dom.scrollHeight - this.#dom.clientHeight - this.#dom.scrollTop) <= 1) {
54
- this.#pervScroll = curentScrollTop;
54
+ this.#pervScroll = currentScrollTop;
55
55
  this.#dom.dispatchEvent(new CustomEvent('offset', {
56
56
  ...commonComponentEventSetting,
57
57
  detail: {
58
- offset: curentScrollTop,
58
+ offset: currentScrollTop,
59
59
  height: this.#dom[scrollableLength],
60
60
  },
61
61
  }));
package/dist/XText/XTextTruncation.js CHANGED
@@ -110,16 +110,16 @@ let XTextTruncation = (() => {
110
110
  this.#dom.removeAttribute(XTextTruncation.exceedMathLengthAttribute);
111
111
  this.#dom.removeAttribute(XTextTruncation.showInlineTruncation);
112
112
  }
113
- #getAllSibilings(targetNode) {
114
- const sibilingNodes = [];
115
- let targetNodeSibiling = targetNode;
116
- while ((targetNodeSibiling = targetNodeSibiling.nextSibling)) {
117
- if (targetNodeSibiling.nodeType === Node.TEXT_NODE
118
- || targetNodeSibiling.nodeType === Node.ELEMENT_NODE) {
119
- sibilingNodes.push(targetNodeSibiling);
113
+ #getAllSiblings(targetNode) {
114
+ const siblingNodes = [];
115
+ let targetNodeSibling = targetNode;
116
+ while ((targetNodeSibling = targetNodeSibling.nextSibling)) {
117
+ if (targetNodeSibling.nodeType === Node.TEXT_NODE
118
+ || targetNodeSibling.nodeType === Node.ELEMENT_NODE) {
119
+ siblingNodes.push(targetNodeSibling);
120
120
  }
121
121
  }
122
- return sibilingNodes;
122
+ return siblingNodes;
123
123
  }
124
124
  #layoutText() {
125
125
  if (!this.#componentConnected || this.#dom.matches('x-text>x-text'))
@@ -208,10 +208,10 @@ let XTextTruncation = (() => {
208
208
  else {
209
209
  toBeHideNodes.push(targetNode);
210
210
  }
211
- toBeHideNodes = toBeHideNodes.concat(this.#getAllSibilings(targetNode));
211
+ toBeHideNodes = toBeHideNodes.concat(this.#getAllSiblings(targetNode));
212
212
  let targetNodeParentElement = targetNode.parentElement;
213
213
  while (targetNodeParentElement !== this.#dom) {
214
- toBeHideNodes = toBeHideNodes.concat(this.#getAllSibilings(targetNodeParentElement));
214
+ toBeHideNodes = toBeHideNodes.concat(this.#getAllSiblings(targetNodeParentElement));
215
215
  targetNodeParentElement = targetNodeParentElement.parentElement;
216
216
  }
217
217
  toBeHideNodes.forEach((node) => {
@@ -450,7 +450,7 @@ class TextRenderingMeasureTool {
450
450
  getLineInfo(lineIndex) {
451
451
  this.#genLinesInfoUntil(lineIndex + 1);
452
452
  if (lineIndex < this.#lazyLinesInfo.length) {
453
- // get catched info first
453
+ // get caught info first
454
454
  const pervLineInfo = lineIndex > 0
455
455
  ? this.#cachedLineInfo[lineIndex - 1] ?? {}
456
456
  : undefined;
package/dist/common/CommonEventsAndMethods.js CHANGED
@@ -40,7 +40,7 @@ let CommonEventsAndMethods = (() => {
40
40
  /**
41
41
  * If this dom is already exposured
42
42
  */
43
- #exposureTriggerd = false;
43
+ #exposureTriggered = false;
44
44
  /**
45
45
  * keeps the observer of current dom
46
46
  */
@@ -158,11 +158,11 @@ let CommonEventsAndMethods = (() => {
158
158
  root = root.parentElement;
159
159
  }
160
160
  }
161
- this.#exposureTriggerd = false;
161
+ this.#exposureTriggered = false;
162
162
  this.#exposureObserver = new IntersectionObserver(([entry]) => {
163
163
  if (entry) {
164
164
  if (entry.isIntersecting) {
165
- this.#exposureTriggerd = true;
165
+ this.#exposureTriggered = true;
166
166
  }
167
167
  this.#sendOneExposureEvent(entry);
168
168
  }
@@ -179,7 +179,7 @@ let CommonEventsAndMethods = (() => {
179
179
  }
180
180
  }
181
181
  #sendOneExposureEvent(entry, overrideExposureId) {
182
- if (!this.#exposureTriggerd) {
182
+ if (!this.#exposureTriggered) {
183
183
  return;
184
184
  }
185
185
  const exposureID = overrideExposureId
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/web-elements",
3
- "version": "0.7.3",
3
+ "version": "0.7.4",
4
4
  "private": false,
5
5
  "repository": {
6
6
  "type": "git",
@@ -101,7 +101,7 @@
101
101
  ],
102
102
  "dependencies": {
103
103
  "@lynx-js/web-elements-reactive": "0.2.2",
104
- "@lynx-js/web-elements-template": "0.7.3"
104
+ "@lynx-js/web-elements-template": "0.7.4"
105
105
  },
106
106
  "devDependencies": {
107
107
  "tslib": "^2.8.1"
package/src/XFoldViewNg/x-foldview-ng.css CHANGED
@@ -5,7 +5,7 @@
5
5
  */
6
6
  x-foldview-ng {
7
7
  display: flex;
8
- overflow-y: scroll;
8
+ overflow-y: scroll !important;
9
9
  overflow-x: clip;
10
10
  overflow-x: hidden;
11
11
  overscroll-behavior: contain;
package/src/XText/x-text.css CHANGED
@@ -179,7 +179,7 @@ x-text[x-text-clipped][x-text-custom-overflow]::part(inner-box)::after {
179
179
  * 1. without customized inline-truncation
180
180
  * 2. users do not force we apply styles on the ellipsis
181
181
  *
182
- * Overall, we do calculate the layout of texts with (dispaly:block) for
182
+ * Overall, we do calculate the layout of texts with (display:block) for
183
183
  * 1. analyze the truncation length for a customized inline-truncation (attribute x-text-custom-overflow, selector :has())
184
184
  * 2. users explicit declare that we have to put the ellipsis in place. (with attribute tail-color-convert='false')
185
185
  */