@wix/editor-react-components 1.2559.0 → 1.2561.0

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.
@@ -30,7 +30,9 @@ const dropdownItemConfig = {
30
30
  font: {},
31
31
  color: {},
32
32
  letterSpacing: {},
33
- textDecorationLine: {},
33
+ textDecorationLine: {
34
+ statesDefaultValues: { hover: "underline", selected: "underline" }
35
+ },
34
36
  textTransform: {},
35
37
  textShadow: {},
36
38
  borderTop: {},
@@ -97,7 +99,9 @@ const dropdownSubItemConfig = {
97
99
  font: {},
98
100
  color: {},
99
101
  letterSpacing: {},
100
- textDecorationLine: {},
102
+ textDecorationLine: {
103
+ statesDefaultValues: { hover: "underline", selected: "underline" }
104
+ },
101
105
  textTransform: {},
102
106
  textShadow: {},
103
107
  borderTop: {},
@@ -595,7 +599,9 @@ const itemConfig = {
595
599
  cssProperties: {
596
600
  font: {},
597
601
  color: {},
598
- textDecorationLine: {},
602
+ textDecorationLine: {
603
+ statesDefaultValues: { hover: "underline", selected: "underline" }
604
+ },
599
605
  textTransform: {},
600
606
  letterSpacing: {},
601
607
  textShadow: {},
@@ -3,7 +3,7 @@ import { c as clsx } from "../chunks/clsx.js";
3
3
  import { f as convertA11yKeysToHtmlFormat } from "../chunks/a11y.js";
4
4
  import { d as directionStyles } from "../chunks/direction.module.js";
5
5
  import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
6
- import { D as DEFAULT_ITEMS_PER_ROW, C as COLUMN_COUNT_CSS_VAR, T as TestIds, s as semanticClassNames } from "../chunks/constants23.js";
6
+ import { D as DEFAULT_ITEMS_PER_ROW, L as LOADING_ITEM_COUNT_CSS_VAR, C as COLUMN_COUNT_CSS_VAR, T as TestIds, s as semanticClassNames } from "../chunks/constants23.js";
7
7
  import React__default, { useState, useRef, useCallback, useEffect, forwardRef } from "react";
8
8
  const useAsyncLoadMore = (onLoadMore, itemsLength, isIntersecting, isLoadingProp) => {
9
9
  const [internalLoading, setInternalLoading] = useState(false);
@@ -61,8 +61,9 @@ const useItemsPerRow = (shouldMeasure) => {
61
61
  if (!shouldMeasure || !ref.current) {
62
62
  return;
63
63
  }
64
+ const style = getComputedStyle(ref.current);
64
65
  const value = Number(
65
- getComputedStyle(ref.current).getPropertyValue(COLUMN_COUNT_CSS_VAR)
66
+ style.getPropertyValue(LOADING_ITEM_COUNT_CSS_VAR) || style.getPropertyValue(COLUMN_COUNT_CSS_VAR)
66
67
  );
67
68
  if (value > 0) {
68
69
  setCount(value);
@@ -539,29 +540,28 @@ const Repeater = (props) => {
539
540
  children: /* @__PURE__ */ jsx(ItemSkeleton, {})
540
541
  },
541
542
  `skeleton-${i}`
542
- ))
543
+ )),
544
+ !!onLoadMore && /* @__PURE__ */ jsx(
545
+ "li",
546
+ {
547
+ ref: sentinelRef,
548
+ role: "presentation",
549
+ "aria-hidden": "true",
550
+ className: styles.sentinel,
551
+ "data-testid": TestIds.sentinel
552
+ }
553
+ )
543
554
  ]
544
555
  }
545
556
  ),
546
- !!onLoadMore && /* @__PURE__ */ jsxs(Fragment, { children: [
547
- /* @__PURE__ */ jsx(
548
- LoadMoreButton,
549
- {
550
- onLoadMore: load,
551
- isLoading,
552
- disabled: isLoading || hasReachedEnd
553
- }
554
- ),
555
- /* @__PURE__ */ jsx(
556
- "div",
557
- {
558
- ref: sentinelRef,
559
- "aria-hidden": "true",
560
- className: styles.sentinel,
561
- "data-testid": TestIds.sentinel
562
- }
563
- )
564
- ] }),
557
+ !!onLoadMore && /* @__PURE__ */ jsx(
558
+ LoadMoreButton,
559
+ {
560
+ onLoadMore: load,
561
+ isLoading,
562
+ disabled: isLoading || hasReachedEnd
563
+ }
564
+ ),
565
565
  /* @__PURE__ */ jsx(
566
566
  LiveAnnouncer,
567
567
  {
@@ -14,6 +14,7 @@ export declare const TestIds: {
14
14
  };
15
15
  export declare const DEFAULT_ITEMS_PER_ROW = 4;
16
16
  export declare const COLUMN_COUNT_CSS_VAR = "--column-count";
17
+ export declare const LOADING_ITEM_COUNT_CSS_VAR = "--loading-item-count";
17
18
  export declare const COLUMN_COUNT_RANGE: {
18
19
  readonly min: "1";
19
20
  readonly max: "12";
@@ -45,6 +45,7 @@
45
45
  row-gap: var(--row-gap, 0px);
46
46
  column-gap: var(--column-gap, 0px);
47
47
  justify-content: inherit;
48
+ position: relative;
48
49
  }
49
50
 
50
51
  .item__dXORc {
@@ -57,6 +58,8 @@
57
58
  .itemLoading__T6wK5 {
58
59
  background-color: transparent;
59
60
  container-type: inline-size;
61
+ min-width: var(--loading-item-min-width, auto);
62
+ min-height: var(--loading-item-min-height, 10px);
60
63
  }
61
64
 
62
65
  .skeleton__-ihsq {
@@ -105,9 +108,12 @@
105
108
  }
106
109
 
107
110
  .sentinel__niAmU {
108
- height: 0;
111
+ position: absolute;
112
+ inset-inline-end: 0;
113
+ inset-block-end: 0;
114
+ width: 1px;
115
+ height: 1px;
109
116
  overflow: hidden;
110
- width: 100%;
111
117
  }
112
118
 
113
119
  @container (width < 150px) {
@@ -179,6 +185,9 @@
179
185
  --column-gap: 0px;
180
186
  --overflow-content: visible;
181
187
  --skeleton-color: #e0dad7;
188
+ --loading-item-min-width: auto;
189
+ --loading-item-min-height: 10px;
190
+ --loading-item-count: var(--column-count);
182
191
  --column-min-width: var(--repeater-column-min-width-fallback);
183
192
  --row-min-height: var(--repeater-min-size-fallback);
184
193
  --grid-auto-flow-mode: auto-fit;
@@ -1 +1 @@
1
- export declare const useLoadMoreObserver: (enabled: boolean) => readonly [import('react').RefObject<HTMLDivElement>, boolean];
1
+ export declare const useLoadMoreObserver: (enabled: boolean) => readonly [import('react').RefObject<HTMLLIElement>, boolean];
@@ -11,6 +11,7 @@ const TestIds = {
11
11
  };
12
12
  const DEFAULT_ITEMS_PER_ROW = 4;
13
13
  const COLUMN_COUNT_CSS_VAR = "--column-count";
14
+ const LOADING_ITEM_COUNT_CSS_VAR = "--loading-item-count";
14
15
  const presets = {
15
16
  cards: "cards",
16
17
  cards_off: "cards_off",
@@ -46,6 +47,7 @@ const DisplayNames = {
46
47
  export {
47
48
  COLUMN_COUNT_CSS_VAR as C,
48
49
  DEFAULT_ITEMS_PER_ROW as D,
50
+ LOADING_ITEM_COUNT_CSS_VAR as L,
49
51
  TestIds as T,
50
52
  DisplayNames as a,
51
53
  presets as p,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/editor-react-components",
3
- "version": "1.2559.0",
3
+ "version": "1.2561.0",
4
4
  "description": "React components for the Wix Editor",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -199,5 +199,5 @@
199
199
  "registry": "https://registry.npmjs.org/",
200
200
  "access": "public"
201
201
  },
202
- "falconPackageHash": "e94bace123d34f1b183027de42358d46d5a9236772e479d9d259096c"
202
+ "falconPackageHash": "d51825f08663affd8594dfcbc2ab6aec0ae82de3b9871fbbe1f92ace"
203
203
  }