@react-spectrum/card 3.0.0-alpha.32 → 3.0.0-alpha.33
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.
- package/dist/BaseLayout.main.js +12 -12
- package/dist/BaseLayout.mjs +13 -13
- package/dist/BaseLayout.module.js +12 -12
- package/dist/Card.main.js +2 -2
- package/dist/Card.mjs +3 -3
- package/dist/Card.module.js +2 -2
- package/dist/CardBase.main.js +36 -36
- package/dist/CardBase.mjs +37 -37
- package/dist/CardBase.module.js +36 -36
- package/dist/CardView.main.js +21 -21
- package/dist/CardView.mjs +22 -22
- package/dist/CardView.module.js +21 -21
- package/dist/CardViewContext.mjs +1 -1
- package/dist/GalleryLayout.main.js +10 -10
- package/dist/GalleryLayout.main.js.map +1 -1
- package/dist/GalleryLayout.mjs +11 -11
- package/dist/GalleryLayout.module.js +10 -10
- package/dist/GalleryLayout.module.js.map +1 -1
- package/dist/GridLayout.main.js +19 -19
- package/dist/GridLayout.mjs +20 -20
- package/dist/GridLayout.module.js +19 -19
- package/dist/WaterfallLayout.main.js +7 -7
- package/dist/WaterfallLayout.mjs +8 -8
- package/dist/WaterfallLayout.module.js +7 -7
- package/dist/ar-AE.mjs +1 -1
- package/dist/bg-BG.mjs +1 -1
- package/dist/card_vars_css.mjs +1 -1
- package/dist/cs-CZ.mjs +1 -1
- package/dist/da-DK.mjs +1 -1
- package/dist/de-DE.mjs +1 -1
- package/dist/el-GR.mjs +1 -1
- package/dist/en-US.mjs +1 -1
- package/dist/es-ES.mjs +1 -1
- package/dist/et-EE.mjs +1 -1
- package/dist/fi-FI.mjs +1 -1
- package/dist/fr-FR.mjs +1 -1
- package/dist/he-IL.mjs +1 -1
- package/dist/hr-HR.mjs +1 -1
- package/dist/hu-HU.mjs +1 -1
- package/dist/intlStrings.mjs +1 -1
- package/dist/it-IT.mjs +1 -1
- package/dist/ja-JP.mjs +1 -1
- package/dist/ko-KR.mjs +1 -1
- package/dist/lt-LT.mjs +1 -1
- package/dist/lv-LV.mjs +1 -1
- package/dist/nb-NO.mjs +1 -1
- package/dist/nl-NL.mjs +1 -1
- package/dist/pl-PL.mjs +1 -1
- package/dist/pt-BR.mjs +1 -1
- package/dist/pt-PT.mjs +1 -1
- package/dist/ro-RO.mjs +1 -1
- package/dist/ru-RU.mjs +1 -1
- package/dist/sk-SK.mjs +1 -1
- package/dist/sl-SI.mjs +1 -1
- package/dist/sr-SP.mjs +1 -1
- package/dist/sv-SE.mjs +1 -1
- package/dist/tr-TR.mjs +1 -1
- package/dist/uk-UA.mjs +1 -1
- package/dist/zh-CN.mjs +1 -1
- package/dist/zh-TW.mjs +1 -1
- package/package.json +18 -18
- package/src/GalleryLayout.tsx +2 -2
|
@@ -23,7 +23,7 @@ $parcel$export(module.exports, "WaterfallLayout", () => $632abf8fbf0ad57b$export
|
|
|
23
23
|
|
|
24
24
|
class $632abf8fbf0ad57b$export$e9f7cda058ba8df8 extends (0, $5ee605f09afaa4de$exports.BaseLayout) {
|
|
25
25
|
get layoutType() {
|
|
26
|
-
return
|
|
26
|
+
return 'waterfall';
|
|
27
27
|
}
|
|
28
28
|
buildCollection(invalidationContext) {
|
|
29
29
|
// Compute the number of columns needed to display the content
|
|
@@ -89,14 +89,14 @@ class $632abf8fbf0ad57b$export$e9f7cda058ba8df8 extends (0, $5ee605f09afaa4de$ex
|
|
|
89
89
|
loaderHeight = this.virtualizer.visibleRect.height || 60;
|
|
90
90
|
}
|
|
91
91
|
let rect = new (0, $eKgYB$reactstatelyvirtualizer.Rect)(0, loaderY, this.virtualizer.visibleRect.width, loaderHeight);
|
|
92
|
-
let loader = new (0, $eKgYB$reactstatelyvirtualizer.LayoutInfo)(
|
|
93
|
-
this.layoutInfos.set(
|
|
92
|
+
let loader = new (0, $eKgYB$reactstatelyvirtualizer.LayoutInfo)('loader', 'loader', rect);
|
|
93
|
+
this.layoutInfos.set('loader', loader);
|
|
94
94
|
y = loader.rect.maxY;
|
|
95
95
|
}
|
|
96
96
|
if (this.collection.size === 0 && !this.isLoading) {
|
|
97
97
|
let rect = new (0, $eKgYB$reactstatelyvirtualizer.Rect)(0, 0, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);
|
|
98
|
-
let placeholder = new (0, $eKgYB$reactstatelyvirtualizer.LayoutInfo)(
|
|
99
|
-
this.layoutInfos.set(
|
|
98
|
+
let placeholder = new (0, $eKgYB$reactstatelyvirtualizer.LayoutInfo)('placeholder', 'placeholder', rect);
|
|
99
|
+
this.layoutInfos.set('placeholder', placeholder);
|
|
100
100
|
y = placeholder.rect.maxY;
|
|
101
101
|
}
|
|
102
102
|
this.contentSize = new (0, $eKgYB$reactstatelyvirtualizer.Size)(this.virtualizer.visibleRect.width, y);
|
|
@@ -154,12 +154,12 @@ class $632abf8fbf0ad57b$export$e9f7cda058ba8df8 extends (0, $5ee605f09afaa4de$ex
|
|
|
154
154
|
getKeyRightOf(key) {
|
|
155
155
|
// Expected key is the currently focused cell so we need the parent row key
|
|
156
156
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
157
|
-
return this.direction ===
|
|
157
|
+
return this.direction === 'rtl' ? this.getClosestLeft(parentRowKey) : this.getClosestRight(parentRowKey);
|
|
158
158
|
}
|
|
159
159
|
getKeyLeftOf(key) {
|
|
160
160
|
// Expected key is the currently focused cell so we need the parent row key
|
|
161
161
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
162
|
-
return this.direction ===
|
|
162
|
+
return this.direction === 'rtl' ? this.getClosestRight(parentRowKey) : this.getClosestLeft(parentRowKey);
|
|
163
163
|
}
|
|
164
164
|
constructor(options = {}){
|
|
165
165
|
// TODO: WaterfallLayout doesn't use card size in v2, but perhaps it should support it? Perhaps it would modify
|
package/dist/WaterfallLayout.mjs
CHANGED
|
@@ -17,7 +17,7 @@ import {Rect as $bRzF0$Rect, LayoutInfo as $bRzF0$LayoutInfo, Size as $bRzF0$Siz
|
|
|
17
17
|
|
|
18
18
|
class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$export$64943d2e59d72a29) {
|
|
19
19
|
get layoutType() {
|
|
20
|
-
return
|
|
20
|
+
return 'waterfall';
|
|
21
21
|
}
|
|
22
22
|
buildCollection(invalidationContext) {
|
|
23
23
|
// Compute the number of columns needed to display the content
|
|
@@ -83,14 +83,14 @@ class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$ex
|
|
|
83
83
|
loaderHeight = this.virtualizer.visibleRect.height || 60;
|
|
84
84
|
}
|
|
85
85
|
let rect = new (0, $bRzF0$Rect)(0, loaderY, this.virtualizer.visibleRect.width, loaderHeight);
|
|
86
|
-
let loader = new (0, $bRzF0$LayoutInfo)(
|
|
87
|
-
this.layoutInfos.set(
|
|
86
|
+
let loader = new (0, $bRzF0$LayoutInfo)('loader', 'loader', rect);
|
|
87
|
+
this.layoutInfos.set('loader', loader);
|
|
88
88
|
y = loader.rect.maxY;
|
|
89
89
|
}
|
|
90
90
|
if (this.collection.size === 0 && !this.isLoading) {
|
|
91
91
|
let rect = new (0, $bRzF0$Rect)(0, 0, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);
|
|
92
|
-
let placeholder = new (0, $bRzF0$LayoutInfo)(
|
|
93
|
-
this.layoutInfos.set(
|
|
92
|
+
let placeholder = new (0, $bRzF0$LayoutInfo)('placeholder', 'placeholder', rect);
|
|
93
|
+
this.layoutInfos.set('placeholder', placeholder);
|
|
94
94
|
y = placeholder.rect.maxY;
|
|
95
95
|
}
|
|
96
96
|
this.contentSize = new (0, $bRzF0$Size)(this.virtualizer.visibleRect.width, y);
|
|
@@ -148,12 +148,12 @@ class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$ex
|
|
|
148
148
|
getKeyRightOf(key) {
|
|
149
149
|
// Expected key is the currently focused cell so we need the parent row key
|
|
150
150
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
151
|
-
return this.direction ===
|
|
151
|
+
return this.direction === 'rtl' ? this.getClosestLeft(parentRowKey) : this.getClosestRight(parentRowKey);
|
|
152
152
|
}
|
|
153
153
|
getKeyLeftOf(key) {
|
|
154
154
|
// Expected key is the currently focused cell so we need the parent row key
|
|
155
155
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
156
|
-
return this.direction ===
|
|
156
|
+
return this.direction === 'rtl' ? this.getClosestRight(parentRowKey) : this.getClosestLeft(parentRowKey);
|
|
157
157
|
}
|
|
158
158
|
constructor(options = {}){
|
|
159
159
|
// TODO: WaterfallLayout doesn't use card size in v2, but perhaps it should support it? Perhaps it would modify
|
|
@@ -173,4 +173,4 @@ class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$ex
|
|
|
173
173
|
|
|
174
174
|
|
|
175
175
|
export {$03278f8d0f6860bb$export$e9f7cda058ba8df8 as WaterfallLayout};
|
|
176
|
-
//# sourceMappingURL=WaterfallLayout.
|
|
176
|
+
//# sourceMappingURL=WaterfallLayout.module.js.map
|
|
@@ -17,7 +17,7 @@ import {Rect as $bRzF0$Rect, LayoutInfo as $bRzF0$LayoutInfo, Size as $bRzF0$Siz
|
|
|
17
17
|
|
|
18
18
|
class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$export$64943d2e59d72a29) {
|
|
19
19
|
get layoutType() {
|
|
20
|
-
return
|
|
20
|
+
return 'waterfall';
|
|
21
21
|
}
|
|
22
22
|
buildCollection(invalidationContext) {
|
|
23
23
|
// Compute the number of columns needed to display the content
|
|
@@ -83,14 +83,14 @@ class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$ex
|
|
|
83
83
|
loaderHeight = this.virtualizer.visibleRect.height || 60;
|
|
84
84
|
}
|
|
85
85
|
let rect = new (0, $bRzF0$Rect)(0, loaderY, this.virtualizer.visibleRect.width, loaderHeight);
|
|
86
|
-
let loader = new (0, $bRzF0$LayoutInfo)(
|
|
87
|
-
this.layoutInfos.set(
|
|
86
|
+
let loader = new (0, $bRzF0$LayoutInfo)('loader', 'loader', rect);
|
|
87
|
+
this.layoutInfos.set('loader', loader);
|
|
88
88
|
y = loader.rect.maxY;
|
|
89
89
|
}
|
|
90
90
|
if (this.collection.size === 0 && !this.isLoading) {
|
|
91
91
|
let rect = new (0, $bRzF0$Rect)(0, 0, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);
|
|
92
|
-
let placeholder = new (0, $bRzF0$LayoutInfo)(
|
|
93
|
-
this.layoutInfos.set(
|
|
92
|
+
let placeholder = new (0, $bRzF0$LayoutInfo)('placeholder', 'placeholder', rect);
|
|
93
|
+
this.layoutInfos.set('placeholder', placeholder);
|
|
94
94
|
y = placeholder.rect.maxY;
|
|
95
95
|
}
|
|
96
96
|
this.contentSize = new (0, $bRzF0$Size)(this.virtualizer.visibleRect.width, y);
|
|
@@ -148,12 +148,12 @@ class $03278f8d0f6860bb$export$e9f7cda058ba8df8 extends (0, $3d424c147206bac9$ex
|
|
|
148
148
|
getKeyRightOf(key) {
|
|
149
149
|
// Expected key is the currently focused cell so we need the parent row key
|
|
150
150
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
151
|
-
return this.direction ===
|
|
151
|
+
return this.direction === 'rtl' ? this.getClosestLeft(parentRowKey) : this.getClosestRight(parentRowKey);
|
|
152
152
|
}
|
|
153
153
|
getKeyLeftOf(key) {
|
|
154
154
|
// Expected key is the currently focused cell so we need the parent row key
|
|
155
155
|
let parentRowKey = this.collection.getItem(key).parentKey;
|
|
156
|
-
return this.direction ===
|
|
156
|
+
return this.direction === 'rtl' ? this.getClosestRight(parentRowKey) : this.getClosestLeft(parentRowKey);
|
|
157
157
|
}
|
|
158
158
|
constructor(options = {}){
|
|
159
159
|
// TODO: WaterfallLayout doesn't use card size in v2, but perhaps it should support it? Perhaps it would modify
|
package/dist/ar-AE.mjs
CHANGED
package/dist/bg-BG.mjs
CHANGED
package/dist/card_vars_css.mjs
CHANGED
package/dist/cs-CZ.mjs
CHANGED
package/dist/da-DK.mjs
CHANGED
package/dist/de-DE.mjs
CHANGED
package/dist/el-GR.mjs
CHANGED
package/dist/en-US.mjs
CHANGED
package/dist/es-ES.mjs
CHANGED
package/dist/et-EE.mjs
CHANGED
package/dist/fi-FI.mjs
CHANGED
package/dist/fr-FR.mjs
CHANGED
package/dist/he-IL.mjs
CHANGED
package/dist/hr-HR.mjs
CHANGED
package/dist/hu-HU.mjs
CHANGED
package/dist/intlStrings.mjs
CHANGED
package/dist/it-IT.mjs
CHANGED
package/dist/ja-JP.mjs
CHANGED
package/dist/ko-KR.mjs
CHANGED
package/dist/lt-LT.mjs
CHANGED
package/dist/lv-LV.mjs
CHANGED
package/dist/nb-NO.mjs
CHANGED
package/dist/nl-NL.mjs
CHANGED
package/dist/pl-PL.mjs
CHANGED
package/dist/pt-BR.mjs
CHANGED
package/dist/pt-PT.mjs
CHANGED
package/dist/ro-RO.mjs
CHANGED
package/dist/ru-RU.mjs
CHANGED
package/dist/sk-SK.mjs
CHANGED
package/dist/sl-SI.mjs
CHANGED
package/dist/sr-SP.mjs
CHANGED
package/dist/sv-SE.mjs
CHANGED
package/dist/tr-TR.mjs
CHANGED
package/dist/uk-UA.mjs
CHANGED
package/dist/zh-CN.mjs
CHANGED
package/dist/zh-TW.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-spectrum/card",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.33",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -36,22 +36,22 @@
|
|
|
36
36
|
"url": "https://github.com/adobe/react-spectrum"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@react-aria/focus": "^3.17.
|
|
40
|
-
"@react-aria/grid": "^3.9.
|
|
41
|
-
"@react-aria/i18n": "^3.11.
|
|
42
|
-
"@react-aria/interactions": "^3.21.
|
|
43
|
-
"@react-aria/utils": "^3.24.
|
|
44
|
-
"@react-aria/virtualizer": "^3.10.
|
|
45
|
-
"@react-spectrum/checkbox": "^3.9.
|
|
46
|
-
"@react-spectrum/progress": "^3.7.
|
|
47
|
-
"@react-spectrum/utils": "^3.11.
|
|
48
|
-
"@react-stately/collections": "^3.10.
|
|
49
|
-
"@react-stately/grid": "^3.8.
|
|
50
|
-
"@react-stately/list": "^3.10.
|
|
51
|
-
"@react-stately/virtualizer": "^3.7.
|
|
52
|
-
"@react-types/card": "3.0.0-alpha.
|
|
53
|
-
"@react-types/provider": "^3.8.
|
|
54
|
-
"@react-types/shared": "^3.23.
|
|
39
|
+
"@react-aria/focus": "^3.17.1",
|
|
40
|
+
"@react-aria/grid": "^3.9.1",
|
|
41
|
+
"@react-aria/i18n": "^3.11.1",
|
|
42
|
+
"@react-aria/interactions": "^3.21.3",
|
|
43
|
+
"@react-aria/utils": "^3.24.1",
|
|
44
|
+
"@react-aria/virtualizer": "^3.10.1",
|
|
45
|
+
"@react-spectrum/checkbox": "^3.9.6",
|
|
46
|
+
"@react-spectrum/progress": "^3.7.7",
|
|
47
|
+
"@react-spectrum/utils": "^3.11.7",
|
|
48
|
+
"@react-stately/collections": "^3.10.7",
|
|
49
|
+
"@react-stately/grid": "^3.8.7",
|
|
50
|
+
"@react-stately/list": "^3.10.5",
|
|
51
|
+
"@react-stately/virtualizer": "^3.7.1",
|
|
52
|
+
"@react-types/card": "3.0.0-alpha.26",
|
|
53
|
+
"@react-types/provider": "^3.8.1",
|
|
54
|
+
"@react-types/shared": "^3.23.1",
|
|
55
55
|
"@swc/helpers": "^0.5.0"
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
@@ -65,5 +65,5 @@
|
|
|
65
65
|
"publishConfig": {
|
|
66
66
|
"access": "public"
|
|
67
67
|
},
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "b77d7d594dff4dcfb5359bffbcfd18142b146433"
|
|
69
69
|
}
|
package/src/GalleryLayout.tsx
CHANGED
|
@@ -139,7 +139,7 @@ export class GalleryLayout<T> extends BaseLayout<T> {
|
|
|
139
139
|
let y = this.margin;
|
|
140
140
|
let availableWidth = visibleWidth - this.margin * 2;
|
|
141
141
|
|
|
142
|
-
// If
|
|
142
|
+
// If available width is not greater than 0, skip node layout calculations
|
|
143
143
|
if (availableWidth > 0) {
|
|
144
144
|
// Compute aspect ratios for all of the items, and the total width if all items were on in a single row.
|
|
145
145
|
let ratios = [];
|
|
@@ -220,7 +220,7 @@ export class GalleryLayout<T> extends BaseLayout<T> {
|
|
|
220
220
|
if (this.isLoading) {
|
|
221
221
|
let loaderY = y;
|
|
222
222
|
let loaderHeight = 60;
|
|
223
|
-
// If there aren't any items, make loader take all
|
|
223
|
+
// If there aren't any items, make loader take all available room and remove margin from y calculation
|
|
224
224
|
// so it doesn't scroll
|
|
225
225
|
if (this.collection.size === 0) {
|
|
226
226
|
loaderY = 0;
|