@react-spectrum/card 3.0.0-nightly.4674 → 3.0.0-nightly.4683
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 +3 -2
- package/dist/BaseLayout.main.js.map +1 -1
- package/dist/BaseLayout.mjs +3 -2
- package/dist/BaseLayout.module.js +3 -2
- package/dist/BaseLayout.module.js.map +1 -1
- package/dist/CardBase.main.js +1 -1
- package/dist/CardBase.main.js.map +1 -1
- package/dist/CardBase.mjs +1 -1
- package/dist/CardBase.module.js +1 -1
- package/dist/CardBase.module.js.map +1 -1
- package/dist/CardView.main.js +2 -2
- package/dist/CardView.main.js.map +1 -1
- package/dist/CardView.mjs +2 -2
- package/dist/CardView.module.js +2 -2
- package/dist/CardView.module.js.map +1 -1
- package/package.json +21 -21
- package/src/BaseLayout.tsx +3 -3
- package/src/CardBase.tsx +1 -1
- package/src/CardView.tsx +2 -2
package/dist/BaseLayout.main.js
CHANGED
|
@@ -21,9 +21,10 @@ $parcel$export(module.exports, "BaseLayout", () => $5ee605f09afaa4de$export$6494
|
|
|
21
21
|
|
|
22
22
|
class $5ee605f09afaa4de$export$64943d2e59d72a29 extends (0, $kQhHy$reactstatelyvirtualizer.Layout) {
|
|
23
23
|
validate(invalidationContext) {
|
|
24
|
+
var _invalidationContext_layoutOptions, _invalidationContext_layoutOptions1;
|
|
24
25
|
this.collection = this.virtualizer.collection;
|
|
25
|
-
this.isLoading = invalidationContext.layoutOptions.isLoading;
|
|
26
|
-
this.direction = invalidationContext.layoutOptions.direction;
|
|
26
|
+
this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
|
|
27
|
+
this.direction = ((_invalidationContext_layoutOptions1 = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions1 === void 0 ? void 0 : _invalidationContext_layoutOptions1.direction) || 'ltr';
|
|
27
28
|
this.buildCollection(invalidationContext);
|
|
28
29
|
// Remove layout info that doesn't exist in new collection
|
|
29
30
|
if (this.lastCollection) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/card/src/BaseLayout.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction, Key, KeyboardDelegate, Node} from '@react-types/shared';\nimport {getChildNodes, getFirstItem} from '@react-stately/collections';\nimport {GridCollection} from '@react-stately/grid';\nimport {InvalidationContext, Layout, LayoutInfo, Rect, Size} from '@react-stately/virtualizer';\nimport {Scale} from '@react-types/provider';\n\nexport interface BaseLayoutOptions {\n collator?: Intl.Collator,\n // TODO: is this valid or is scale a spectrum specific thing that should be left out of the layouts?\n scale?: Scale,\n /**\n * The margin around the grid view between the edges and the items.\n * @default 24\n */\n margin?: number\n}\n\ninterface CardViewLayoutOptions {\n isLoading: boolean,\n direction: Direction\n}\n\nexport class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implements KeyboardDelegate {\n protected contentSize: Size;\n protected layoutInfos: Map<Key, LayoutInfo>;\n protected collator: Intl.Collator;\n protected lastCollection: GridCollection<T>;\n collection: GridCollection<T>;\n isLoading: boolean;\n disabledKeys: Set<Key> = new Set();\n direction: Direction;\n scale: Scale;\n margin: number;\n\n constructor(options: BaseLayoutOptions = {}) {\n super();\n this.layoutInfos = new Map();\n this.collator = options.collator;\n this.lastCollection = null;\n this.scale = options.scale || 'medium';\n this.margin = options.margin || 24;\n }\n\n validate(invalidationContext: InvalidationContext<CardViewLayoutOptions>) {\n this.collection = this.virtualizer.collection as GridCollection<T>;\n this.isLoading = invalidationContext.layoutOptions.isLoading;\n this.direction = invalidationContext.layoutOptions.direction;\n this.buildCollection(invalidationContext);\n\n // Remove layout info that doesn't exist in new collection\n if (this.lastCollection) {\n for (let key of this.lastCollection.getKeys()) {\n if (!this.collection.getItem(key)) {\n this.layoutInfos.delete(key);\n }\n }\n\n if (!this.isLoading) {\n this.layoutInfos.delete('loader');\n }\n\n if (this.collection.size > 0) {\n this.layoutInfos.delete('placeholder');\n }\n }\n\n this.lastCollection = this.collection;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n buildCollection(invalidationContext?: InvalidationContext) {}\n\n getContentSize() {\n return this.contentSize;\n }\n\n getLayoutInfo(key: Key) {\n return this.layoutInfos.get(key);\n }\n\n getVisibleLayoutInfos(rect: Rect, excludePersistedKeys = false) {\n let res: LayoutInfo[] = [];\n\n for (let layoutInfo of this.layoutInfos.values()) {\n if (this.isVisible(layoutInfo, rect, excludePersistedKeys)) {\n res.push(layoutInfo);\n }\n }\n\n return res;\n }\n\n isVisible(layoutInfo: LayoutInfo, rect: Rect, excludePersistedKeys: boolean) {\n if (layoutInfo.rect.intersects(rect)) {\n return true;\n }\n\n if (!excludePersistedKeys) {\n return this.virtualizer.isPersistedKey(layoutInfo.key);\n }\n\n return false;\n }\n\n _findClosestLayoutInfo(target: Rect, rect: Rect) {\n let layoutInfos = this.getVisibleLayoutInfos(rect, true);\n let best = null;\n let bestDistance = Infinity;\n\n // Calculates distance as the distance between the center of 2 rects.\n for (let cur of layoutInfos) {\n if (cur.type === 'item') {\n let curRect = cur.rect;\n let targetMidX = (target.x + target.maxX) / 2;\n let targetMidY = (target.y + target.maxY) / 2;\n let curMidX = (curRect.x + curRect.maxX) / 2;\n let curMidY = (curRect.y + curRect.maxY) / 2;\n let dist = Math.pow(targetMidX - curMidX, 2) + Math.pow(targetMidY - curMidY, 2);\n if (dist < bestDistance) {\n best = cur;\n bestDistance = dist;\n }\n }\n }\n\n return best;\n }\n\n _findClosest(target: Rect, rect: Rect) {\n let best = this._findClosestLayoutInfo(target, rect);\n return best || null;\n }\n\n getKeyBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, layoutInfo.rect.maxY + 1, layoutInfo.rect.width, this.virtualizer.visibleRect.height);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, 0, layoutInfo.rect.width, layoutInfo.rect.y - 1);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyRightOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(parentRowKey) : this.collection.getKeyAfter(parentRowKey);\n\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(key) : this.collection.getKeyAfter(key);\n }\n }\n\n getKeyLeftOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(parentRowKey) : this.collection.getKeyBefore(parentRowKey);\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(key) : this.collection.getKeyBefore(key);\n }\n }\n\n getFirstKey() {\n let firstRow = this.collection.getItem(this.collection.getFirstKey());\n return getFirstItem(getChildNodes(firstRow, this.collection))?.key;\n }\n\n getLastKey() {\n let lastRow = this.collection.getItem(this.collection.getLastKey());\n return getFirstItem(getChildNodes(lastRow, this.collection))?.key;\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this? Or maybe make the layoutInfos be the cells instead of the rows?\n getKeyPageAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n\n if (layoutInfo) {\n let pageY = Math.max(0, layoutInfo.rect.y + layoutInfo.rect.height - this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately above\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyAbove = this.collection.getItem(this.getKeyAbove(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n\n if (layoutInfo && layoutInfo.rect.y > pageY) {\n while (layoutInfo && layoutInfo.rect.y > pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyAbove = this.collection.getItem(this.getKeyAbove(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getFirstKey();\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this?\n getKeyPageBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n if (layoutInfo) {\n let pageY = Math.min(this.virtualizer.contentSize.height, layoutInfo.rect.y - layoutInfo.rect.height + this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately below\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyBelow = this.collection.getItem(this.getKeyBelow(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n if (layoutInfo && layoutInfo.rect.y < pageY) {\n while (layoutInfo && layoutInfo.rect.y < pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyBelow = this.collection.getItem(this.getKeyBelow(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getLastKey();\n }\n\n getKeyForSearch(search: string, fromKey?: Key) {\n if (!this.collator) {\n return null;\n }\n\n let collection = this.collection;\n let key = fromKey ?? this.getFirstKey();\n\n let startItem = collection.getItem(key);\n key = startItem.parentKey;\n\n while (key != null) {\n let item = collection.getItem(key);\n if (item.textValue) {\n let substring = item.textValue.slice(0, search.length);\n if (this.collator.compare(substring, search) === 0) {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n }\n\n key = this.collection.getKeyAfter(key);\n }\n\n return null;\n }\n}\n"],"names":[],"version":3,"file":"BaseLayout.main.js.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAwBM,MAAM,kDAAsB,CAAA,GAAA,qCAAK;IAqBtC,SAAS,mBAA+D,EAAE;YAEvD,oCACA;QAFjB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU;QAC7C,IAAI,CAAC,SAAS,GAAG,EAAA,qCAAA,oBAAoB,aAAa,cAAjC,yDAAA,mCAAmC,SAAS,KAAI;QACjE,IAAI,CAAC,SAAS,GAAG,EAAA,sCAAA,oBAAoB,aAAa,cAAjC,0DAAA,oCAAmC,SAAS,KAAI;QACjE,IAAI,CAAC,eAAe,CAAC;QAErB,0DAA0D;QAC1D,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,KAAK,IAAI,OAAO,IAAI,CAAC,cAAc,CAAC,OAAO,GACzC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,MAC3B,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;YAI5B,IAAI,CAAC,IAAI,CAAC,SAAS,EACjB,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;YAG1B,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG,GACzB,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;QAE5B;QAEA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,UAAU;IACvC;IAEA,6DAA6D;IAC7D,gBAAgB,mBAAyC,EAAE,CAAC;IAE5D,iBAAiB;QACf,OAAO,IAAI,CAAC,WAAW;IACzB;IAEA,cAAc,GAAQ,EAAE;QACtB,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC;IAC9B;IAEA,sBAAsB,IAAU,EAAE,uBAAuB,KAAK,EAAE;QAC9D,IAAI,MAAoB,EAAE;QAE1B,KAAK,IAAI,cAAc,IAAI,CAAC,WAAW,CAAC,MAAM,GAC5C,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,MAAM,uBACnC,IAAI,IAAI,CAAC;QAIb,OAAO;IACT;IAEA,UAAU,UAAsB,EAAE,IAAU,EAAE,oBAA6B,EAAE;QAC3E,IAAI,WAAW,IAAI,CAAC,UAAU,CAAC,OAC7B,OAAO;QAGT,IAAI,CAAC,sBACH,OAAO,IAAI,CAAC,WAAW,CAAC,cAAc,CAAC,WAAW,GAAG;QAGvD,OAAO;IACT;IAEA,uBAAuB,MAAY,EAAE,IAAU,EAAE;QAC/C,IAAI,cAAc,IAAI,CAAC,qBAAqB,CAAC,MAAM;QACnD,IAAI,OAAO;QACX,IAAI,eAAe;QAEnB,qEAAqE;QACrE,KAAK,IAAI,OAAO,YACd,IAAI,IAAI,IAAI,KAAK,QAAQ;YACvB,IAAI,UAAU,IAAI,IAAI;YACtB,IAAI,aAAa,AAAC,CAAA,OAAO,CAAC,GAAG,OAAO,IAAI,AAAD,IAAK;YAC5C,IAAI,aAAa,AAAC,CAAA,OAAO,CAAC,GAAG,OAAO,IAAI,AAAD,IAAK;YAC5C,IAAI,UAAU,AAAC,CAAA,QAAQ,CAAC,GAAG,QAAQ,IAAI,AAAD,IAAK;YAC3C,IAAI,UAAU,AAAC,CAAA,QAAQ,CAAC,GAAG,QAAQ,IAAI,AAAD,IAAK;YAC3C,IAAI,OAAO,KAAK,GAAG,CAAC,aAAa,SAAS,KAAK,KAAK,GAAG,CAAC,aAAa,SAAS;YAC9E,IAAI,OAAO,cAAc;gBACvB,OAAO;gBACP,eAAe;YACjB;QACF;QAGF,OAAO;IACT;IAEA,aAAa,MAAY,EAAE,IAAU,EAAE;QACrC,IAAI,OAAO,IAAI,CAAC,sBAAsB,CAAC,QAAQ;QAC/C,OAAO,QAAQ;IACjB;IAEA,YAAY,GAAQ,EAAE;YAKqB,oBAClC;QALP,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,WAAW,IAAI,CAAC,CAAC,EAAE,WAAW,IAAI,CAAC,IAAI,GAAG,GAAG,WAAW,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;QAC3H,IAAI,aAAa,IAAI,CAAC,UAAU,CAAC,OAAO,EAAC,qBAAA,IAAI,CAAC,YAAY,CAAC,WAAW,IAAI,EAAE,mBAAnC,yCAAA,mBAA0C,GAAG;QACtF,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,YAAY,IAAI,CAAC,UAAU,gBAAtD,oCAAA,cAA0D,GAAG;IACtE;IAEA,YAAY,GAAQ,EAAE;YAKqB,oBAClC;QALP,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,WAAW,IAAI,CAAC,CAAC,EAAE,GAAG,WAAW,IAAI,CAAC,KAAK,EAAE,WAAW,IAAI,CAAC,CAAC,GAAG;QACrF,IAAI,aAAa,IAAI,CAAC,UAAU,CAAC,OAAO,EAAC,qBAAA,IAAI,CAAC,YAAY,CAAC,WAAW,IAAI,EAAE,mBAAnC,yCAAA,mBAA0C,GAAG;QACtF,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,YAAY,IAAI,CAAC,UAAU,gBAAtD,oCAAA,cAA0D,GAAG;IACtE;IAEA,cAAc,GAAQ,EAAE;QACtB,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,MAAM,IAAI,CAAC,SAAS,KAAK,QAAS,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,gBAAgB,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;QAE3G,MAAO,OAAO,KAAM;gBAIT;YAHT,IAAI,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YACnC,mHAAmH;YACnH,IAAI,KAAK,IAAI,KAAK,QAChB,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,MAAM,IAAI,CAAC,UAAU,gBAAhD,oCAAA,cAAoD,GAAG;YAEhE,MAAM,IAAI,CAAC,SAAS,KAAK,QAAS,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;QACpG;IACF;IAEA,aAAa,GAAQ,EAAE;QACrB,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,MAAM,IAAI,CAAC,SAAS,KAAK,QAAS,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,gBAAgB,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC;QAC3G,MAAO,OAAO,KAAM;gBAIT;YAHT,IAAI,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YACnC,mHAAmH;YACnH,IAAI,KAAK,IAAI,KAAK,QAChB,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,MAAM,IAAI,CAAC,UAAU,gBAAhD,oCAAA,cAAoD,GAAG;YAGhE,MAAM,IAAI,CAAC,SAAS,KAAK,QAAS,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC;QACpG;IACF;IAEA,cAAc;YAEL;QADP,IAAI,WAAW,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,WAAW;QAClE,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,UAAU,IAAI,CAAC,UAAU,gBAApD,oCAAA,cAAwD,GAAG;IACpE;IAEA,aAAa;YAEJ;QADP,IAAI,UAAU,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,UAAU;QAChE,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,SAAS,IAAI,CAAC,UAAU,gBAAnD,oCAAA,cAAuD,GAAG;IACnE;IAEA,2GAA2G;IAC3G,8IAA8I;IAC9I,gBAAgB,GAAQ,EAAE;QACxB,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QAEpC,IAAI,YAAY;gBAIC;YAHf,IAAI,QAAQ,KAAK,GAAG,CAAC,GAAG,WAAW,IAAI,CAAC,CAAC,GAAG,WAAW,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YACxG,4GAA4G;YAC5G,8EAA8E;YAC9E,IAAI,YAAW,2BAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,mBAAzC,+CAAA,yBAAgD,SAAS;YACxE,aAAa,IAAI,CAAC,aAAa,CAAC;YAEhC,IAAI,cAAc,WAAW,IAAI,CAAC,CAAC,GAAG,OACpC,MAAO,cAAc,WAAW,IAAI,CAAC,CAAC,GAAG,MAAO;oBAC/B,eACA;gBADf,IAAI,YAAW,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,IAAI,CAAC,UAAU,gBAAnF,oCAAA,cAAuF,GAAG;gBACzG,IAAI,YAAW,4BAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,wBAAzC,gDAAA,0BAAqD,SAAS;gBAC7E,aAAa,IAAI,CAAC,aAAa,CAAC;YAClC;YAGF,IAAI,YAAY;oBACC;gBAAf,IAAI,YAAW,iBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,IAAI,CAAC,UAAU,gBAAnF,qCAAA,eAAuF,GAAG;gBACzG,OAAO;YACT;QACF;QAEA,OAAO,IAAI,CAAC,WAAW;IACzB;IAEA,2GAA2G;IAC3G,8EAA8E;IAC9E,gBAAgB,GAAQ,EAAE;QACxB,2EAA2E;QAC3E,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,SAAS;QACzD,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,YAAY;gBAIE;YAHhB,IAAI,QAAQ,KAAK,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,EAAE,WAAW,IAAI,CAAC,CAAC,GAAG,WAAW,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YAC1I,4GAA4G;YAC5G,8EAA8E;YAC9E,IAAI,YAAY,2BAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,mBAAzC,+CAAA,yBAAgD,SAAS;YACzE,aAAa,IAAI,CAAC,aAAa,CAAC;YAChC,IAAI,cAAc,WAAW,IAAI,CAAC,CAAC,GAAG,OACpC,MAAO,cAAc,WAAW,IAAI,CAAC,CAAC,GAAG,MAAO;oBAC/B,eACA;gBADf,IAAI,YAAW,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,IAAI,CAAC,UAAU,gBAAnF,oCAAA,cAAuF,GAAG;gBACzG,IAAI,YAAW,4BAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,wBAAzC,gDAAA,0BAAqD,SAAS;gBAC7E,aAAa,IAAI,CAAC,aAAa,CAAC;YAClC;YAGF,IAAI,YAAY;oBACC;gBAAf,IAAI,YAAW,iBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,IAAI,CAAC,UAAU,gBAAnF,qCAAA,eAAuF,GAAG;gBACzG,OAAO;YACT;QACF;QAEA,OAAO,IAAI,CAAC,UAAU;IACxB;IAEA,gBAAgB,MAAc,EAAE,OAAa,EAAE;QAC7C,IAAI,CAAC,IAAI,CAAC,QAAQ,EAChB,OAAO;QAGT,IAAI,aAAa,IAAI,CAAC,UAAU;QAChC,IAAI,MAAM,oBAAA,qBAAA,UAAW,IAAI,CAAC,WAAW;QAErC,IAAI,YAAY,WAAW,OAAO,CAAC;QACnC,MAAM,UAAU,SAAS;QAEzB,MAAO,OAAO,KAAM;YAClB,IAAI,OAAO,WAAW,OAAO,CAAC;YAC9B,IAAI,KAAK,SAAS,EAAE;oBAGT;gBAFT,IAAI,YAAY,KAAK,SAAS,CAAC,KAAK,CAAC,GAAG,OAAO,MAAM;gBACrD,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,WAAW,YAAY,GAC/C,QAAO,gBAAA,CAAA,GAAA,2CAAW,EAAE,CAAA,GAAA,4CAAY,EAAE,MAAM,IAAI,CAAC,UAAU,gBAAhD,oCAAA,cAAoD,GAAG;YAElE;YAEA,MAAM,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC;QACpC;QAEA,OAAO;IACT;IAjPA,YAAY,UAA6B,CAAC,CAAC,CAAE;QAC3C,KAAK;aANP,eAAyB,IAAI;QAO3B,IAAI,CAAC,WAAW,GAAG,IAAI;QACvB,IAAI,CAAC,QAAQ,GAAG,QAAQ,QAAQ;QAChC,IAAI,CAAC,cAAc,GAAG;QACtB,IAAI,CAAC,KAAK,GAAG,QAAQ,KAAK,IAAI;QAC9B,IAAI,CAAC,MAAM,GAAG,QAAQ,MAAM,IAAI;IAClC;AA2OF","sources":["packages/@react-spectrum/card/src/BaseLayout.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction, Key, KeyboardDelegate, Node} from '@react-types/shared';\nimport {getChildNodes, getFirstItem} from '@react-stately/collections';\nimport {GridCollection} from '@react-stately/grid';\nimport {InvalidationContext, Layout, LayoutInfo, Rect, Size} from '@react-stately/virtualizer';\nimport {Scale} from '@react-types/provider';\n\nexport interface BaseLayoutOptions {\n collator?: Intl.Collator,\n // TODO: is this valid or is scale a spectrum specific thing that should be left out of the layouts?\n scale?: Scale,\n /**\n * The margin around the grid view between the edges and the items.\n * @default 24\n */\n margin?: number\n}\n\ninterface CardViewLayoutOptions {\n isLoading: boolean,\n direction: Direction\n}\n\nexport class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implements KeyboardDelegate {\n protected contentSize: Size;\n protected layoutInfos: Map<Key, LayoutInfo>;\n protected collator: Intl.Collator;\n protected lastCollection: GridCollection<T>;\n collection: GridCollection<T>;\n isLoading: boolean;\n disabledKeys: Set<Key> = new Set();\n direction: Direction;\n scale: Scale;\n margin: number;\n\n constructor(options: BaseLayoutOptions = {}) {\n super();\n this.layoutInfos = new Map();\n this.collator = options.collator;\n this.lastCollection = null;\n this.scale = options.scale || 'medium';\n this.margin = options.margin || 24;\n }\n\n validate(invalidationContext: InvalidationContext<CardViewLayoutOptions>) {\n this.collection = this.virtualizer.collection as GridCollection<T>;\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n this.direction = invalidationContext.layoutOptions?.direction || 'ltr';\n this.buildCollection(invalidationContext);\n\n // Remove layout info that doesn't exist in new collection\n if (this.lastCollection) {\n for (let key of this.lastCollection.getKeys()) {\n if (!this.collection.getItem(key)) {\n this.layoutInfos.delete(key);\n }\n }\n\n if (!this.isLoading) {\n this.layoutInfos.delete('loader');\n }\n\n if (this.collection.size > 0) {\n this.layoutInfos.delete('placeholder');\n }\n }\n\n this.lastCollection = this.collection;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n buildCollection(invalidationContext?: InvalidationContext) {}\n\n getContentSize() {\n return this.contentSize;\n }\n\n getLayoutInfo(key: Key) {\n return this.layoutInfos.get(key)!;\n }\n\n getVisibleLayoutInfos(rect: Rect, excludePersistedKeys = false) {\n let res: LayoutInfo[] = [];\n\n for (let layoutInfo of this.layoutInfos.values()) {\n if (this.isVisible(layoutInfo, rect, excludePersistedKeys)) {\n res.push(layoutInfo);\n }\n }\n\n return res;\n }\n\n isVisible(layoutInfo: LayoutInfo, rect: Rect, excludePersistedKeys: boolean) {\n if (layoutInfo.rect.intersects(rect)) {\n return true;\n }\n\n if (!excludePersistedKeys) {\n return this.virtualizer.isPersistedKey(layoutInfo.key);\n }\n\n return false;\n }\n\n _findClosestLayoutInfo(target: Rect, rect: Rect) {\n let layoutInfos = this.getVisibleLayoutInfos(rect, true);\n let best = null;\n let bestDistance = Infinity;\n\n // Calculates distance as the distance between the center of 2 rects.\n for (let cur of layoutInfos) {\n if (cur.type === 'item') {\n let curRect = cur.rect;\n let targetMidX = (target.x + target.maxX) / 2;\n let targetMidY = (target.y + target.maxY) / 2;\n let curMidX = (curRect.x + curRect.maxX) / 2;\n let curMidY = (curRect.y + curRect.maxY) / 2;\n let dist = Math.pow(targetMidX - curMidX, 2) + Math.pow(targetMidY - curMidY, 2);\n if (dist < bestDistance) {\n best = cur;\n bestDistance = dist;\n }\n }\n }\n\n return best;\n }\n\n _findClosest(target: Rect, rect: Rect) {\n let best = this._findClosestLayoutInfo(target, rect);\n return best || null;\n }\n\n getKeyBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, layoutInfo.rect.maxY + 1, layoutInfo.rect.width, this.virtualizer.visibleRect.height);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, 0, layoutInfo.rect.width, layoutInfo.rect.y - 1);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyRightOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(parentRowKey) : this.collection.getKeyAfter(parentRowKey);\n\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(key) : this.collection.getKeyAfter(key);\n }\n }\n\n getKeyLeftOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(parentRowKey) : this.collection.getKeyBefore(parentRowKey);\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(key) : this.collection.getKeyBefore(key);\n }\n }\n\n getFirstKey() {\n let firstRow = this.collection.getItem(this.collection.getFirstKey());\n return getFirstItem(getChildNodes(firstRow, this.collection))?.key;\n }\n\n getLastKey() {\n let lastRow = this.collection.getItem(this.collection.getLastKey());\n return getFirstItem(getChildNodes(lastRow, this.collection))?.key;\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this? Or maybe make the layoutInfos be the cells instead of the rows?\n getKeyPageAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n\n if (layoutInfo) {\n let pageY = Math.max(0, layoutInfo.rect.y + layoutInfo.rect.height - this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately above\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyAbove = this.collection.getItem(this.getKeyAbove(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n\n if (layoutInfo && layoutInfo.rect.y > pageY) {\n while (layoutInfo && layoutInfo.rect.y > pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyAbove = this.collection.getItem(this.getKeyAbove(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getFirstKey();\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this?\n getKeyPageBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n if (layoutInfo) {\n let pageY = Math.min(this.virtualizer.contentSize.height, layoutInfo.rect.y - layoutInfo.rect.height + this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately below\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyBelow = this.collection.getItem(this.getKeyBelow(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n if (layoutInfo && layoutInfo.rect.y < pageY) {\n while (layoutInfo && layoutInfo.rect.y < pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyBelow = this.collection.getItem(this.getKeyBelow(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getLastKey();\n }\n\n getKeyForSearch(search: string, fromKey?: Key) {\n if (!this.collator) {\n return null;\n }\n\n let collection = this.collection;\n let key = fromKey ?? this.getFirstKey();\n\n let startItem = collection.getItem(key);\n key = startItem.parentKey;\n\n while (key != null) {\n let item = collection.getItem(key);\n if (item.textValue) {\n let substring = item.textValue.slice(0, search.length);\n if (this.collator.compare(substring, search) === 0) {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n }\n\n key = this.collection.getKeyAfter(key);\n }\n\n return null;\n }\n}\n"],"names":[],"version":3,"file":"BaseLayout.main.js.map"}
|
package/dist/BaseLayout.mjs
CHANGED
|
@@ -15,9 +15,10 @@ import {Rect as $1JdnP$Rect, Layout as $1JdnP$Layout} from "@react-stately/virtu
|
|
|
15
15
|
|
|
16
16
|
class $3d424c147206bac9$export$64943d2e59d72a29 extends (0, $1JdnP$Layout) {
|
|
17
17
|
validate(invalidationContext) {
|
|
18
|
+
var _invalidationContext_layoutOptions, _invalidationContext_layoutOptions1;
|
|
18
19
|
this.collection = this.virtualizer.collection;
|
|
19
|
-
this.isLoading = invalidationContext.layoutOptions.isLoading;
|
|
20
|
-
this.direction = invalidationContext.layoutOptions.direction;
|
|
20
|
+
this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
|
|
21
|
+
this.direction = ((_invalidationContext_layoutOptions1 = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions1 === void 0 ? void 0 : _invalidationContext_layoutOptions1.direction) || 'ltr';
|
|
21
22
|
this.buildCollection(invalidationContext);
|
|
22
23
|
// Remove layout info that doesn't exist in new collection
|
|
23
24
|
if (this.lastCollection) {
|
|
@@ -15,9 +15,10 @@ import {Rect as $1JdnP$Rect, Layout as $1JdnP$Layout} from "@react-stately/virtu
|
|
|
15
15
|
|
|
16
16
|
class $3d424c147206bac9$export$64943d2e59d72a29 extends (0, $1JdnP$Layout) {
|
|
17
17
|
validate(invalidationContext) {
|
|
18
|
+
var _invalidationContext_layoutOptions, _invalidationContext_layoutOptions1;
|
|
18
19
|
this.collection = this.virtualizer.collection;
|
|
19
|
-
this.isLoading = invalidationContext.layoutOptions.isLoading;
|
|
20
|
-
this.direction = invalidationContext.layoutOptions.direction;
|
|
20
|
+
this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
|
|
21
|
+
this.direction = ((_invalidationContext_layoutOptions1 = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions1 === void 0 ? void 0 : _invalidationContext_layoutOptions1.direction) || 'ltr';
|
|
21
22
|
this.buildCollection(invalidationContext);
|
|
22
23
|
// Remove layout info that doesn't exist in new collection
|
|
23
24
|
if (this.lastCollection) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/card/src/BaseLayout.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction, Key, KeyboardDelegate, Node} from '@react-types/shared';\nimport {getChildNodes, getFirstItem} from '@react-stately/collections';\nimport {GridCollection} from '@react-stately/grid';\nimport {InvalidationContext, Layout, LayoutInfo, Rect, Size} from '@react-stately/virtualizer';\nimport {Scale} from '@react-types/provider';\n\nexport interface BaseLayoutOptions {\n collator?: Intl.Collator,\n // TODO: is this valid or is scale a spectrum specific thing that should be left out of the layouts?\n scale?: Scale,\n /**\n * The margin around the grid view between the edges and the items.\n * @default 24\n */\n margin?: number\n}\n\ninterface CardViewLayoutOptions {\n isLoading: boolean,\n direction: Direction\n}\n\nexport class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implements KeyboardDelegate {\n protected contentSize: Size;\n protected layoutInfos: Map<Key, LayoutInfo>;\n protected collator: Intl.Collator;\n protected lastCollection: GridCollection<T>;\n collection: GridCollection<T>;\n isLoading: boolean;\n disabledKeys: Set<Key> = new Set();\n direction: Direction;\n scale: Scale;\n margin: number;\n\n constructor(options: BaseLayoutOptions = {}) {\n super();\n this.layoutInfos = new Map();\n this.collator = options.collator;\n this.lastCollection = null;\n this.scale = options.scale || 'medium';\n this.margin = options.margin || 24;\n }\n\n validate(invalidationContext: InvalidationContext<CardViewLayoutOptions>) {\n this.collection = this.virtualizer.collection as GridCollection<T>;\n this.isLoading = invalidationContext.layoutOptions.isLoading;\n this.direction = invalidationContext.layoutOptions.direction;\n this.buildCollection(invalidationContext);\n\n // Remove layout info that doesn't exist in new collection\n if (this.lastCollection) {\n for (let key of this.lastCollection.getKeys()) {\n if (!this.collection.getItem(key)) {\n this.layoutInfos.delete(key);\n }\n }\n\n if (!this.isLoading) {\n this.layoutInfos.delete('loader');\n }\n\n if (this.collection.size > 0) {\n this.layoutInfos.delete('placeholder');\n }\n }\n\n this.lastCollection = this.collection;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n buildCollection(invalidationContext?: InvalidationContext) {}\n\n getContentSize() {\n return this.contentSize;\n }\n\n getLayoutInfo(key: Key) {\n return this.layoutInfos.get(key);\n }\n\n getVisibleLayoutInfos(rect: Rect, excludePersistedKeys = false) {\n let res: LayoutInfo[] = [];\n\n for (let layoutInfo of this.layoutInfos.values()) {\n if (this.isVisible(layoutInfo, rect, excludePersistedKeys)) {\n res.push(layoutInfo);\n }\n }\n\n return res;\n }\n\n isVisible(layoutInfo: LayoutInfo, rect: Rect, excludePersistedKeys: boolean) {\n if (layoutInfo.rect.intersects(rect)) {\n return true;\n }\n\n if (!excludePersistedKeys) {\n return this.virtualizer.isPersistedKey(layoutInfo.key);\n }\n\n return false;\n }\n\n _findClosestLayoutInfo(target: Rect, rect: Rect) {\n let layoutInfos = this.getVisibleLayoutInfos(rect, true);\n let best = null;\n let bestDistance = Infinity;\n\n // Calculates distance as the distance between the center of 2 rects.\n for (let cur of layoutInfos) {\n if (cur.type === 'item') {\n let curRect = cur.rect;\n let targetMidX = (target.x + target.maxX) / 2;\n let targetMidY = (target.y + target.maxY) / 2;\n let curMidX = (curRect.x + curRect.maxX) / 2;\n let curMidY = (curRect.y + curRect.maxY) / 2;\n let dist = Math.pow(targetMidX - curMidX, 2) + Math.pow(targetMidY - curMidY, 2);\n if (dist < bestDistance) {\n best = cur;\n bestDistance = dist;\n }\n }\n }\n\n return best;\n }\n\n _findClosest(target: Rect, rect: Rect) {\n let best = this._findClosestLayoutInfo(target, rect);\n return best || null;\n }\n\n getKeyBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, layoutInfo.rect.maxY + 1, layoutInfo.rect.width, this.virtualizer.visibleRect.height);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, 0, layoutInfo.rect.width, layoutInfo.rect.y - 1);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyRightOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(parentRowKey) : this.collection.getKeyAfter(parentRowKey);\n\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(key) : this.collection.getKeyAfter(key);\n }\n }\n\n getKeyLeftOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(parentRowKey) : this.collection.getKeyBefore(parentRowKey);\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(key) : this.collection.getKeyBefore(key);\n }\n }\n\n getFirstKey() {\n let firstRow = this.collection.getItem(this.collection.getFirstKey());\n return getFirstItem(getChildNodes(firstRow, this.collection))?.key;\n }\n\n getLastKey() {\n let lastRow = this.collection.getItem(this.collection.getLastKey());\n return getFirstItem(getChildNodes(lastRow, this.collection))?.key;\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this? Or maybe make the layoutInfos be the cells instead of the rows?\n getKeyPageAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n\n if (layoutInfo) {\n let pageY = Math.max(0, layoutInfo.rect.y + layoutInfo.rect.height - this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately above\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyAbove = this.collection.getItem(this.getKeyAbove(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n\n if (layoutInfo && layoutInfo.rect.y > pageY) {\n while (layoutInfo && layoutInfo.rect.y > pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyAbove = this.collection.getItem(this.getKeyAbove(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getFirstKey();\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this?\n getKeyPageBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n if (layoutInfo) {\n let pageY = Math.min(this.virtualizer.contentSize.height, layoutInfo.rect.y - layoutInfo.rect.height + this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately below\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyBelow = this.collection.getItem(this.getKeyBelow(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n if (layoutInfo && layoutInfo.rect.y < pageY) {\n while (layoutInfo && layoutInfo.rect.y < pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyBelow = this.collection.getItem(this.getKeyBelow(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getLastKey();\n }\n\n getKeyForSearch(search: string, fromKey?: Key) {\n if (!this.collator) {\n return null;\n }\n\n let collection = this.collection;\n let key = fromKey ?? this.getFirstKey();\n\n let startItem = collection.getItem(key);\n key = startItem.parentKey;\n\n while (key != null) {\n let item = collection.getItem(key);\n if (item.textValue) {\n let substring = item.textValue.slice(0, search.length);\n if (this.collator.compare(substring, search) === 0) {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n }\n\n key = this.collection.getKeyAfter(key);\n }\n\n return null;\n }\n}\n"],"names":[],"version":3,"file":"BaseLayout.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/card/src/BaseLayout.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction, Key, KeyboardDelegate, Node} from '@react-types/shared';\nimport {getChildNodes, getFirstItem} from '@react-stately/collections';\nimport {GridCollection} from '@react-stately/grid';\nimport {InvalidationContext, Layout, LayoutInfo, Rect, Size} from '@react-stately/virtualizer';\nimport {Scale} from '@react-types/provider';\n\nexport interface BaseLayoutOptions {\n collator?: Intl.Collator,\n // TODO: is this valid or is scale a spectrum specific thing that should be left out of the layouts?\n scale?: Scale,\n /**\n * The margin around the grid view between the edges and the items.\n * @default 24\n */\n margin?: number\n}\n\ninterface CardViewLayoutOptions {\n isLoading: boolean,\n direction: Direction\n}\n\nexport class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implements KeyboardDelegate {\n protected contentSize: Size;\n protected layoutInfos: Map<Key, LayoutInfo>;\n protected collator: Intl.Collator;\n protected lastCollection: GridCollection<T>;\n collection: GridCollection<T>;\n isLoading: boolean;\n disabledKeys: Set<Key> = new Set();\n direction: Direction;\n scale: Scale;\n margin: number;\n\n constructor(options: BaseLayoutOptions = {}) {\n super();\n this.layoutInfos = new Map();\n this.collator = options.collator;\n this.lastCollection = null;\n this.scale = options.scale || 'medium';\n this.margin = options.margin || 24;\n }\n\n validate(invalidationContext: InvalidationContext<CardViewLayoutOptions>) {\n this.collection = this.virtualizer.collection as GridCollection<T>;\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n this.direction = invalidationContext.layoutOptions?.direction || 'ltr';\n this.buildCollection(invalidationContext);\n\n // Remove layout info that doesn't exist in new collection\n if (this.lastCollection) {\n for (let key of this.lastCollection.getKeys()) {\n if (!this.collection.getItem(key)) {\n this.layoutInfos.delete(key);\n }\n }\n\n if (!this.isLoading) {\n this.layoutInfos.delete('loader');\n }\n\n if (this.collection.size > 0) {\n this.layoutInfos.delete('placeholder');\n }\n }\n\n this.lastCollection = this.collection;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n buildCollection(invalidationContext?: InvalidationContext) {}\n\n getContentSize() {\n return this.contentSize;\n }\n\n getLayoutInfo(key: Key) {\n return this.layoutInfos.get(key)!;\n }\n\n getVisibleLayoutInfos(rect: Rect, excludePersistedKeys = false) {\n let res: LayoutInfo[] = [];\n\n for (let layoutInfo of this.layoutInfos.values()) {\n if (this.isVisible(layoutInfo, rect, excludePersistedKeys)) {\n res.push(layoutInfo);\n }\n }\n\n return res;\n }\n\n isVisible(layoutInfo: LayoutInfo, rect: Rect, excludePersistedKeys: boolean) {\n if (layoutInfo.rect.intersects(rect)) {\n return true;\n }\n\n if (!excludePersistedKeys) {\n return this.virtualizer.isPersistedKey(layoutInfo.key);\n }\n\n return false;\n }\n\n _findClosestLayoutInfo(target: Rect, rect: Rect) {\n let layoutInfos = this.getVisibleLayoutInfos(rect, true);\n let best = null;\n let bestDistance = Infinity;\n\n // Calculates distance as the distance between the center of 2 rects.\n for (let cur of layoutInfos) {\n if (cur.type === 'item') {\n let curRect = cur.rect;\n let targetMidX = (target.x + target.maxX) / 2;\n let targetMidY = (target.y + target.maxY) / 2;\n let curMidX = (curRect.x + curRect.maxX) / 2;\n let curMidY = (curRect.y + curRect.maxY) / 2;\n let dist = Math.pow(targetMidX - curMidX, 2) + Math.pow(targetMidY - curMidY, 2);\n if (dist < bestDistance) {\n best = cur;\n bestDistance = dist;\n }\n }\n }\n\n return best;\n }\n\n _findClosest(target: Rect, rect: Rect) {\n let best = this._findClosestLayoutInfo(target, rect);\n return best || null;\n }\n\n getKeyBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, layoutInfo.rect.maxY + 1, layoutInfo.rect.width, this.virtualizer.visibleRect.height);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n let rect = new Rect(layoutInfo.rect.x, 0, layoutInfo.rect.width, layoutInfo.rect.y - 1);\n let closestRow = this.collection.getItem(this._findClosest(layoutInfo.rect, rect)?.key);\n return getFirstItem(getChildNodes(closestRow, this.collection))?.key;\n }\n\n getKeyRightOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(parentRowKey) : this.collection.getKeyAfter(parentRowKey);\n\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n key = this.direction === 'rtl' ? this.collection.getKeyBefore(key) : this.collection.getKeyAfter(key);\n }\n }\n\n getKeyLeftOf(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(parentRowKey) : this.collection.getKeyBefore(parentRowKey);\n while (key != null) {\n let item = this.collection.getItem(key);\n // Don't check if item is disabled because we want to be able to focus disabled items in a grid (double check this)\n if (item.type === 'item') {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n\n key = this.direction === 'rtl' ? this.collection.getKeyAfter(key) : this.collection.getKeyBefore(key);\n }\n }\n\n getFirstKey() {\n let firstRow = this.collection.getItem(this.collection.getFirstKey());\n return getFirstItem(getChildNodes(firstRow, this.collection))?.key;\n }\n\n getLastKey() {\n let lastRow = this.collection.getItem(this.collection.getLastKey());\n return getFirstItem(getChildNodes(lastRow, this.collection))?.key;\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this? Or maybe make the layoutInfos be the cells instead of the rows?\n getKeyPageAbove(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n\n if (layoutInfo) {\n let pageY = Math.max(0, layoutInfo.rect.y + layoutInfo.rect.height - this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately above\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyAbove = this.collection.getItem(this.getKeyAbove(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n\n if (layoutInfo && layoutInfo.rect.y > pageY) {\n while (layoutInfo && layoutInfo.rect.y > pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyAbove = this.collection.getItem(this.getKeyAbove(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyAbove);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getFirstKey();\n }\n\n // TODO: pretty unwieldy because it needs to bounce back and forth between the parent key and the child key\n // Perhaps have layoutInfo store childKey as well so we don't need to do this?\n getKeyPageBelow(key: Key) {\n // Expected key is the currently focused cell so we need the parent row key\n let parentRowKey = this.collection.getItem(key).parentKey;\n let layoutInfo = this.getLayoutInfo(parentRowKey);\n if (layoutInfo) {\n let pageY = Math.min(this.virtualizer.contentSize.height, layoutInfo.rect.y - layoutInfo.rect.height + this.virtualizer.visibleRect.height);\n // If the node is so large that it spans multiple page heights, return the key of the item immediately below\n // Otherwise keep going up until we exceed a single page height worth of nodes\n let keyBelow = this.collection.getItem(this.getKeyBelow(key))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n if (layoutInfo && layoutInfo.rect.y < pageY) {\n while (layoutInfo && layoutInfo.rect.y < pageY) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n let keyBelow = this.collection.getItem(this.getKeyBelow(childKey))?.parentKey;\n layoutInfo = this.getLayoutInfo(keyBelow);\n }\n }\n\n if (layoutInfo) {\n let childKey = getFirstItem(getChildNodes(this.collection.getItem(layoutInfo.key), this.collection))?.key;\n return childKey;\n }\n }\n\n return this.getLastKey();\n }\n\n getKeyForSearch(search: string, fromKey?: Key) {\n if (!this.collator) {\n return null;\n }\n\n let collection = this.collection;\n let key = fromKey ?? this.getFirstKey();\n\n let startItem = collection.getItem(key);\n key = startItem.parentKey;\n\n while (key != null) {\n let item = collection.getItem(key);\n if (item.textValue) {\n let substring = item.textValue.slice(0, search.length);\n if (this.collator.compare(substring, search) === 0) {\n return getFirstItem(getChildNodes(item, this.collection))?.key;\n }\n }\n\n key = this.collection.getKeyAfter(key);\n }\n\n return null;\n }\n}\n"],"names":[],"version":3,"file":"BaseLayout.module.js.map"}
|
package/dist/CardBase.main.js
CHANGED
|
@@ -51,7 +51,7 @@ function $7888205ff7de382f$var$CardBase(props, ref) {
|
|
|
51
51
|
let { styleProps: styleProps } = (0, $1rjnI$reactspectrumutils.useStyleProps)(props);
|
|
52
52
|
let { cardProps: cardProps, titleProps: titleProps, contentProps: contentProps } = $7888205ff7de382f$var$useCard(props);
|
|
53
53
|
let domRef = (0, $1rjnI$reactspectrumutils.useDOMRef)(ref);
|
|
54
|
-
let gridRef = (0, $1rjnI$react.useRef)();
|
|
54
|
+
let gridRef = (0, $1rjnI$react.useRef)(undefined);
|
|
55
55
|
let checkboxRef = (0, $1rjnI$react.useRef)(null);
|
|
56
56
|
// cards are only interactive if there is a selection manager and it allows selection
|
|
57
57
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $1rjnI$reactariainteractions.useHover)({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n articleProps?: HTMLAttributes<HTMLElement>,\n item?: Node<T>\n}\n\nfunction CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n let {state} = context;\n let manager = state?.selectionManager;\n let {\n isQuiet,\n orientation = 'vertical',\n articleProps = {},\n item,\n layout,\n children\n } = props;\n\n let key = item?.key;\n let isSelected = manager?.isSelected(key);\n let isDisabled = state?.disabledKeys.has(key);\n let onChange = () => manager?.select(key);\n\n let {styleProps} = useStyleProps(props);\n let {cardProps, titleProps, contentProps} = useCard(props);\n let domRef = useDOMRef(ref);\n let gridRef = useRef<HTMLDivElement>();\n let checkboxRef = useRef(null);\n\n // cards are only interactive if there is a selection manager and it allows selection\n let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n let [isFocused, setIsFocused] = useState(false);\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: setIsFocused,\n isDisabled\n });\n\n // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n // this is for horizontal cards\n let [height, setHeight] = useState(NaN);\n let updateHeight = useCallback(() => {\n if (orientation !== 'horizontal') {\n return;\n }\n\n let cardHeight = gridRef.current.getBoundingClientRect().height;\n setHeight(cardHeight);\n }, [orientation, gridRef, setHeight]);\n useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n let aspectRatioEnforce = undefined;\n if (orientation === 'horizontal' && !isNaN(height)) {\n aspectRatioEnforce = {\n height: `${height}px`,\n width: `${height}px`\n };\n }\n\n let slots = useMemo(() => ({\n image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n useLayoutEffect(() => {\n if (gridRef?.current) {\n let walker = getFocusableTreeWalker(gridRef.current);\n let nextNode = walker.nextNode();\n while (nextNode != null) {\n if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n break;\n }\n nextNode = walker.nextNode();\n }\n }\n }, [children]);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <article\n {...styleProps}\n {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n ref={domRef}\n className={classNames(styles, 'spectrum-Card', {\n 'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--horizontal': orientation === 'horizontal',\n 'spectrum-Card--noPreview': !hasPreview,\n 'is-hovered': isHovered,\n 'is-focused': isFocused,\n 'is-selected': isSelected,\n 'spectrum-Card--waterfall': layout === 'waterfall',\n 'spectrum-Card--gallery': layout === 'gallery',\n 'spectrum-Card--grid': layout === 'grid',\n 'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n }, styleProps.className)}>\n <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n {manager && manager.selectionMode !== 'none' && (\n <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n <Checkbox\n ref={checkboxRef}\n isDisabled={isDisabled}\n excludeFromTabOrder\n isSelected={isSelected}\n onChange={onChange}\n UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n isEmphasized\n aria-label=\"select\" />\n </div>\n )}\n <SlotProvider slots={slots}>\n {children}\n </SlotProvider>\n <div className={classNames(styles, 'spectrum-Card-decoration')} />\n </div>\n </article>\n </FocusRing>\n );\n}\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n cardProps: HTMLAttributes<HTMLDivElement>,\n titleProps: HTMLAttributes<HTMLDivElement>,\n contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n let titleId = useSlotId();\n let descriptionId = useSlotId();\n let titleProps = useMemo(() => ({\n id: titleId\n }), [titleId]);\n let contentProps = useMemo(() => ({\n id: descriptionId\n }), [descriptionId]);\n\n return {\n cardProps: {\n ...filterDOMProps(props),\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n tabIndex: 0\n },\n titleProps,\n contentProps\n };\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardBase = React.forwardRef(CardBase);\nexport {_CardBase as CardBase};\n"],"names":[],"version":3,"file":"CardBase.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n articleProps?: HTMLAttributes<HTMLElement>,\n item?: Node<T>\n}\n\nfunction CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n let {state} = context;\n let manager = state?.selectionManager;\n let {\n isQuiet,\n orientation = 'vertical',\n articleProps = {},\n item,\n layout,\n children\n } = props;\n\n let key = item?.key;\n let isSelected = manager?.isSelected(key);\n let isDisabled = state?.disabledKeys.has(key);\n let onChange = () => manager?.select(key);\n\n let {styleProps} = useStyleProps(props);\n let {cardProps, titleProps, contentProps} = useCard(props);\n let domRef = useDOMRef(ref);\n let gridRef = useRef<HTMLDivElement>(undefined);\n let checkboxRef = useRef(null);\n\n // cards are only interactive if there is a selection manager and it allows selection\n let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n let [isFocused, setIsFocused] = useState(false);\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: setIsFocused,\n isDisabled\n });\n\n // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n // this is for horizontal cards\n let [height, setHeight] = useState(NaN);\n let updateHeight = useCallback(() => {\n if (orientation !== 'horizontal') {\n return;\n }\n\n let cardHeight = gridRef.current.getBoundingClientRect().height;\n setHeight(cardHeight);\n }, [orientation, gridRef, setHeight]);\n useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n let aspectRatioEnforce = undefined;\n if (orientation === 'horizontal' && !isNaN(height)) {\n aspectRatioEnforce = {\n height: `${height}px`,\n width: `${height}px`\n };\n }\n\n let slots = useMemo(() => ({\n image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n useLayoutEffect(() => {\n if (gridRef?.current) {\n let walker = getFocusableTreeWalker(gridRef.current);\n let nextNode = walker.nextNode();\n while (nextNode != null) {\n if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n break;\n }\n nextNode = walker.nextNode();\n }\n }\n }, [children]);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <article\n {...styleProps}\n {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n ref={domRef}\n className={classNames(styles, 'spectrum-Card', {\n 'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--horizontal': orientation === 'horizontal',\n 'spectrum-Card--noPreview': !hasPreview,\n 'is-hovered': isHovered,\n 'is-focused': isFocused,\n 'is-selected': isSelected,\n 'spectrum-Card--waterfall': layout === 'waterfall',\n 'spectrum-Card--gallery': layout === 'gallery',\n 'spectrum-Card--grid': layout === 'grid',\n 'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n }, styleProps.className)}>\n <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n {manager && manager.selectionMode !== 'none' && (\n <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n <Checkbox\n ref={checkboxRef}\n isDisabled={isDisabled}\n excludeFromTabOrder\n isSelected={isSelected}\n onChange={onChange}\n UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n isEmphasized\n aria-label=\"select\" />\n </div>\n )}\n <SlotProvider slots={slots}>\n {children}\n </SlotProvider>\n <div className={classNames(styles, 'spectrum-Card-decoration')} />\n </div>\n </article>\n </FocusRing>\n );\n}\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n cardProps: HTMLAttributes<HTMLDivElement>,\n titleProps: HTMLAttributes<HTMLDivElement>,\n contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n let titleId = useSlotId();\n let descriptionId = useSlotId();\n let titleProps = useMemo(() => ({\n id: titleId\n }), [titleId]);\n let contentProps = useMemo(() => ({\n id: descriptionId\n }), [descriptionId]);\n\n return {\n cardProps: {\n ...filterDOMProps(props),\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n tabIndex: 0\n },\n titleProps,\n contentProps\n };\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardBase = React.forwardRef(CardBase);\nexport {_CardBase as CardBase};\n"],"names":[],"version":3,"file":"CardBase.main.js.map"}
|
package/dist/CardBase.mjs
CHANGED
|
@@ -45,7 +45,7 @@ function $643dd8fa80926f94$var$CardBase(props, ref) {
|
|
|
45
45
|
let { styleProps: styleProps } = (0, $8eFIe$useStyleProps)(props);
|
|
46
46
|
let { cardProps: cardProps, titleProps: titleProps, contentProps: contentProps } = $643dd8fa80926f94$var$useCard(props);
|
|
47
47
|
let domRef = (0, $8eFIe$useDOMRef)(ref);
|
|
48
|
-
let gridRef = (0, $8eFIe$useRef)();
|
|
48
|
+
let gridRef = (0, $8eFIe$useRef)(undefined);
|
|
49
49
|
let checkboxRef = (0, $8eFIe$useRef)(null);
|
|
50
50
|
// cards are only interactive if there is a selection manager and it allows selection
|
|
51
51
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $8eFIe$useHover)({
|
package/dist/CardBase.module.js
CHANGED
|
@@ -45,7 +45,7 @@ function $643dd8fa80926f94$var$CardBase(props, ref) {
|
|
|
45
45
|
let { styleProps: styleProps } = (0, $8eFIe$useStyleProps)(props);
|
|
46
46
|
let { cardProps: cardProps, titleProps: titleProps, contentProps: contentProps } = $643dd8fa80926f94$var$useCard(props);
|
|
47
47
|
let domRef = (0, $8eFIe$useDOMRef)(ref);
|
|
48
|
-
let gridRef = (0, $8eFIe$useRef)();
|
|
48
|
+
let gridRef = (0, $8eFIe$useRef)(undefined);
|
|
49
49
|
let checkboxRef = (0, $8eFIe$useRef)(null);
|
|
50
50
|
// cards are only interactive if there is a selection manager and it allows selection
|
|
51
51
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $8eFIe$useHover)({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AAmBD,SAAS,+BAA2B,KAAuB,EAAE,GAA2B;IACtF,QAAQ,CAAA,GAAA,uBAAe,EAAE;IACzB,IAAI,UAAU,CAAA,GAAA,yCAAiB,OAAO,CAAC,GAAG,qDAAqD;IAC/F,IAAI,SAAC,KAAK,EAAC,GAAG;IACd,IAAI,UAAU,kBAAA,4BAAA,MAAO,gBAAgB;IACrC,IAAI,WACF,OAAO,eACP,cAAc,0BACd,eAAe,CAAC,SAChB,IAAI,UACJ,MAAM,YACN,QAAQ,EACT,GAAG;IAEJ,IAAI,MAAM,iBAAA,2BAAA,KAAM,GAAG;IACnB,IAAI,aAAa,oBAAA,8BAAA,QAAS,UAAU,CAAC;IACrC,IAAI,aAAa,kBAAA,4BAAA,MAAO,YAAY,CAAC,GAAG,CAAC;IACzC,IAAI,WAAW,IAAM,oBAAA,8BAAA,QAAS,MAAM,CAAC;IAErC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,oBAAY,EAAE;IACjC,IAAI,aAAC,SAAS,cAAE,UAAU,gBAAE,YAAY,EAAC,GAAG,8BAAQ;IACpD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,UAAU,CAAA,GAAA,aAAK;IACnB,IAAI,cAAc,CAAA,GAAA,aAAK,EAAE;IAEzB,qFAAqF;IACrF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAAC,YAAY,YAAY,aAAa,CAAA,oBAAA,8BAAA,QAAS,aAAa,MAAK,UAAU;IAAU;IAC5H,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,eAAO,EAAE;IACzC,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;QACtC,qBAAqB;oBACrB;IACF;IAEA,wGAAwG;IACxG,IAAI,kBAAkB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,sDAAK,CAAC,CAAC,sBAAsB,CAAC,CAAC,EAAE;IACvE,IAAI,yBAAyB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,sDAAK,CAAC,CAAC,6BAA6B,CAAC,CAAC,EAAE;IACrF,IAAI,aAAa,mBAAmB;IAEpC,+BAA+B;IAC/B,IAAI,CAAC,QAAQ,UAAU,GAAG,CAAA,GAAA,eAAO,EAAE;IACnC,IAAI,eAAe,CAAA,GAAA,kBAAU,EAAE;QAC7B,IAAI,gBAAgB,cAClB;QAGF,IAAI,aAAa,QAAQ,OAAO,CAAC,qBAAqB,GAAG,MAAM;QAC/D,UAAU;IACZ,GAAG;QAAC;QAAa;QAAS;KAAU;IACpC,CAAA,GAAA,wBAAgB,EAAE;QAAC,KAAK;QAAS,UAAU;IAAY;IAEvD,IAAI,qBAAqB;IACzB,IAAI,gBAAgB,gBAAgB,CAAC,MAAM,SACzC,qBAAqB;QACnB,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;QACrB,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACtB;IAGF,IAAI,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YACzB,OAAO;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAAwB,WAAW,gBAAgB,eAAe,UAAU;gBAAW,KAAK;gBAAI,GAAG,kBAAkB;YAAA;YAClK,cAAc;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA+B,GAAG,kBAAkB;YAAA;YACxG,QAAQ;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAAyB,MAAM;YAAiB;YAC9F,SAAS;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA0B,GAAG,UAAU;YAAA;YACtF,SAAS;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA0B,GAAG,YAAY;YAAA;YACxF,QAAQ;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;YAAuB;QAEvE,CAAA,GAAI;QAAC;QAAY;QAAc;QAAQ;QAAS;KAAY;IAE5D,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,oBAAA,8BAAA,QAAS,OAAO,EAAE;YACpB,IAAI,SAAS,CAAA,GAAA,6BAAqB,EAAE,QAAQ,OAAO;YACnD,IAAI,WAAW,OAAO,QAAQ;YAC9B,MAAO,YAAY,KAAM;gBACvB,IAAI,YAAY,OAAO,IAAI,CAAC,YAAY,OAAO,CAAC,iBAAiB,GAAG,QAAQ,CAAC,WAAW;oBACtF,QAAQ,IAAI,CAAC;oBACb;gBACF;gBACA,WAAW,OAAO,QAAQ;YAC5B;QACF;IACF,GAAG;QAAC;KAAS;IAEb,qBACE,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;qBAC5C,gCAAC;QACE,GAAG,UAAU;QACb,GAAG,CAAA,GAAA,iBAAS,EAAE,WAAW,kBAAkB,YAAY,CAAA,GAAA,qBAAa,EAAE,QAAQ,aAAa;QAC5F,KAAK;QACL,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG,iBAAiB;YAC7C,0BAA0B,CAAC,WAAW,gBAAgB;YACtD,0BAA0B,WAAW,gBAAgB;YACrD,6BAA6B,gBAAgB;YAC7C,4BAA4B,CAAC;YAC7B,cAAc;YACd,cAAc;YACd,eAAe;YACf,4BAA4B,WAAW;YACvC,0BAA0B,WAAW;YACrC,uBAAuB,WAAW;YAClC,2BAA2B,WAAW,eAAe,WAAW,aAAa,WAAW;QAC1F,GAAG,WAAW,SAAS;qBACvB,gCAAC;QAAI,KAAK;QAAS,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;OAC9C,WAAW,QAAQ,aAAa,KAAK,wBACpC,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;qBACjC,gCAAC,CAAA,GAAA,eAAO;QACN,KAAK;QACL,YAAY;QACZ,qBAAA;QACA,YAAY;QACZ,UAAU;QACV,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;QACrC,cAAA;QACA,cAAW;uBAGjB,gCAAC,CAAA,GAAA,mBAAW;QAAE,OAAO;OAClB,yBAEH,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;;AAK7C;AAWA,SAAS,8BAAQ,KAAsB;IACrC,IAAI,UAAU,CAAA,GAAA,gBAAQ;IACtB,IAAI,gBAAgB,CAAA,GAAA,gBAAQ;IAC5B,IAAI,aAAa,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YAC9B,IAAI;QACN,CAAA,GAAI;QAAC;KAAQ;IACb,IAAI,eAAe,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YAChC,IAAI;QACN,CAAA,GAAI;QAAC;KAAc;IAEnB,OAAO;QACL,WAAW;YACT,GAAG,CAAA,GAAA,qBAAa,EAAE,MAAM;YACxB,mBAAmB;YACnB,oBAAoB;YACpB,UAAU;QACZ;oBACA;sBACA;IACF;AACF;AAEA;;CAEC,GACD,MAAM,0DAAY,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n articleProps?: HTMLAttributes<HTMLElement>,\n item?: Node<T>\n}\n\nfunction CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n let {state} = context;\n let manager = state?.selectionManager;\n let {\n isQuiet,\n orientation = 'vertical',\n articleProps = {},\n item,\n layout,\n children\n } = props;\n\n let key = item?.key;\n let isSelected = manager?.isSelected(key);\n let isDisabled = state?.disabledKeys.has(key);\n let onChange = () => manager?.select(key);\n\n let {styleProps} = useStyleProps(props);\n let {cardProps, titleProps, contentProps} = useCard(props);\n let domRef = useDOMRef(ref);\n let gridRef = useRef<HTMLDivElement>();\n let checkboxRef = useRef(null);\n\n // cards are only interactive if there is a selection manager and it allows selection\n let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n let [isFocused, setIsFocused] = useState(false);\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: setIsFocused,\n isDisabled\n });\n\n // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n // this is for horizontal cards\n let [height, setHeight] = useState(NaN);\n let updateHeight = useCallback(() => {\n if (orientation !== 'horizontal') {\n return;\n }\n\n let cardHeight = gridRef.current.getBoundingClientRect().height;\n setHeight(cardHeight);\n }, [orientation, gridRef, setHeight]);\n useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n let aspectRatioEnforce = undefined;\n if (orientation === 'horizontal' && !isNaN(height)) {\n aspectRatioEnforce = {\n height: `${height}px`,\n width: `${height}px`\n };\n }\n\n let slots = useMemo(() => ({\n image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n useLayoutEffect(() => {\n if (gridRef?.current) {\n let walker = getFocusableTreeWalker(gridRef.current);\n let nextNode = walker.nextNode();\n while (nextNode != null) {\n if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n break;\n }\n nextNode = walker.nextNode();\n }\n }\n }, [children]);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <article\n {...styleProps}\n {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n ref={domRef}\n className={classNames(styles, 'spectrum-Card', {\n 'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--horizontal': orientation === 'horizontal',\n 'spectrum-Card--noPreview': !hasPreview,\n 'is-hovered': isHovered,\n 'is-focused': isFocused,\n 'is-selected': isSelected,\n 'spectrum-Card--waterfall': layout === 'waterfall',\n 'spectrum-Card--gallery': layout === 'gallery',\n 'spectrum-Card--grid': layout === 'grid',\n 'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n }, styleProps.className)}>\n <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n {manager && manager.selectionMode !== 'none' && (\n <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n <Checkbox\n ref={checkboxRef}\n isDisabled={isDisabled}\n excludeFromTabOrder\n isSelected={isSelected}\n onChange={onChange}\n UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n isEmphasized\n aria-label=\"select\" />\n </div>\n )}\n <SlotProvider slots={slots}>\n {children}\n </SlotProvider>\n <div className={classNames(styles, 'spectrum-Card-decoration')} />\n </div>\n </article>\n </FocusRing>\n );\n}\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n cardProps: HTMLAttributes<HTMLDivElement>,\n titleProps: HTMLAttributes<HTMLDivElement>,\n contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n let titleId = useSlotId();\n let descriptionId = useSlotId();\n let titleProps = useMemo(() => ({\n id: titleId\n }), [titleId]);\n let contentProps = useMemo(() => ({\n id: descriptionId\n }), [descriptionId]);\n\n return {\n cardProps: {\n ...filterDOMProps(props),\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n tabIndex: 0\n },\n titleProps,\n contentProps\n };\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardBase = React.forwardRef(CardBase);\nexport {_CardBase as CardBase};\n"],"names":[],"version":3,"file":"CardBase.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n articleProps?: HTMLAttributes<HTMLElement>,\n item?: Node<T>\n}\n\nfunction CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n let {state} = context;\n let manager = state?.selectionManager;\n let {\n isQuiet,\n orientation = 'vertical',\n articleProps = {},\n item,\n layout,\n children\n } = props;\n\n let key = item?.key;\n let isSelected = manager?.isSelected(key);\n let isDisabled = state?.disabledKeys.has(key);\n let onChange = () => manager?.select(key);\n\n let {styleProps} = useStyleProps(props);\n let {cardProps, titleProps, contentProps} = useCard(props);\n let domRef = useDOMRef(ref);\n let gridRef = useRef<HTMLDivElement>(undefined);\n let checkboxRef = useRef(null);\n\n // cards are only interactive if there is a selection manager and it allows selection\n let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n let [isFocused, setIsFocused] = useState(false);\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: setIsFocused,\n isDisabled\n });\n\n // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n // this is for horizontal cards\n let [height, setHeight] = useState(NaN);\n let updateHeight = useCallback(() => {\n if (orientation !== 'horizontal') {\n return;\n }\n\n let cardHeight = gridRef.current.getBoundingClientRect().height;\n setHeight(cardHeight);\n }, [orientation, gridRef, setHeight]);\n useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n let aspectRatioEnforce = undefined;\n if (orientation === 'horizontal' && !isNaN(height)) {\n aspectRatioEnforce = {\n height: `${height}px`,\n width: `${height}px`\n };\n }\n\n let slots = useMemo(() => ({\n image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n useLayoutEffect(() => {\n if (gridRef?.current) {\n let walker = getFocusableTreeWalker(gridRef.current);\n let nextNode = walker.nextNode();\n while (nextNode != null) {\n if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n break;\n }\n nextNode = walker.nextNode();\n }\n }\n }, [children]);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <article\n {...styleProps}\n {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n ref={domRef}\n className={classNames(styles, 'spectrum-Card', {\n 'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n 'spectrum-Card--horizontal': orientation === 'horizontal',\n 'spectrum-Card--noPreview': !hasPreview,\n 'is-hovered': isHovered,\n 'is-focused': isFocused,\n 'is-selected': isSelected,\n 'spectrum-Card--waterfall': layout === 'waterfall',\n 'spectrum-Card--gallery': layout === 'gallery',\n 'spectrum-Card--grid': layout === 'grid',\n 'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n }, styleProps.className)}>\n <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n {manager && manager.selectionMode !== 'none' && (\n <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n <Checkbox\n ref={checkboxRef}\n isDisabled={isDisabled}\n excludeFromTabOrder\n isSelected={isSelected}\n onChange={onChange}\n UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n isEmphasized\n aria-label=\"select\" />\n </div>\n )}\n <SlotProvider slots={slots}>\n {children}\n </SlotProvider>\n <div className={classNames(styles, 'spectrum-Card-decoration')} />\n </div>\n </article>\n </FocusRing>\n );\n}\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n cardProps: HTMLAttributes<HTMLDivElement>,\n titleProps: HTMLAttributes<HTMLDivElement>,\n contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n let titleId = useSlotId();\n let descriptionId = useSlotId();\n let titleProps = useMemo(() => ({\n id: titleId\n }), [titleId]);\n let contentProps = useMemo(() => ({\n id: descriptionId\n }), [descriptionId]);\n\n return {\n cardProps: {\n ...filterDOMProps(props),\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n tabIndex: 0\n },\n titleProps,\n contentProps\n };\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardBase = React.forwardRef(CardBase);\nexport {_CardBase as CardBase};\n"],"names":[],"version":3,"file":"CardBase.module.js.map"}
|
package/dist/CardView.main.js
CHANGED
|
@@ -188,8 +188,8 @@ function $514a55f6d91f25ef$var$InternalCard(props) {
|
|
|
188
188
|
][0];
|
|
189
189
|
let { state: state, cardOrientation: cardOrientation, isQuiet: isQuiet, layout: layout } = (0, $e57ab98cef2f01a5$exports.useCardViewContext)();
|
|
190
190
|
let layoutType = layout.layoutType;
|
|
191
|
-
let rowRef = (0, $kFdxB$react.useRef)();
|
|
192
|
-
let cellRef = (0, $kFdxB$react.useRef)();
|
|
191
|
+
let rowRef = (0, $kFdxB$react.useRef)(undefined);
|
|
192
|
+
let cellRef = (0, $kFdxB$react.useRef)(undefined);
|
|
193
193
|
let unwrappedRef = (0, $kFdxB$reactspectrumutils.useUnwrapDOMRef)(cellRef);
|
|
194
194
|
let { rowProps: gridRowProps } = (0, $kFdxB$reactariagrid.useGridRow)({
|
|
195
195
|
node: item,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames, useDOMRef, useStyleProps, useUnwrapDOMRef} from '@react-spectrum/utils';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection, useGridState} from '@react-stately/grid';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeProps} from '@react-aria/utils';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from '@react-stately/virtualizer';\nimport {SpectrumCardViewProps} from '@react-types/card';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator, useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useGrid, useGridCell, useGridRow} from '@react-aria/grid';\nimport {useListState} from '@react-stately/list';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer, VirtualizerItem} from '@react-aria/virtualizer';\n\nfunction CardView<T extends object>(props: SpectrumCardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n let {\n isQuiet,\n renderEmptyState,\n layout,\n loadingState,\n onLoadMore,\n cardOrientation = 'vertical'\n } = props;\n\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n let cardViewLayout = useMemo(() => typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout, [layout, collator, cardOrientation, scale]);\n let layoutType = cardViewLayout.layoutType;\n\n let {direction} = useLocale();\n let {collection} = useListState(props);\n\n let gridCollection = useMemo(() => new GridCollection<T>({\n columnCount: 1,\n items: [...collection].map(item => ({\n // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n ...item,\n hasChildNodes: true,\n childNodes: [{\n key: `cell-${item.key}`,\n type: 'cell',\n value: null,\n level: 0,\n rendered: null,\n textValue: item.textValue,\n hasChildNodes: false,\n childNodes: []\n }]\n }))\n }), [collection]);\n\n let state = useGridState({\n ...props,\n selectionMode: cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n collection: gridCollection,\n focusMode: 'cell'\n });\n\n cardViewLayout.collection = gridCollection;\n cardViewLayout.disabledKeys = state.disabledKeys;\n\n let {gridProps} = useGrid({\n ...props,\n isVirtualized: true,\n keyboardDelegate: cardViewLayout\n }, state, domRef);\n\n type View = ReusableView<Node<T>, ReactNode>;\n let renderWrapper = useCallback((parent: View, reusableView: View) => (\n <VirtualizerItem\n key={reusableView.key}\n layoutInfo={reusableView.layoutInfo}\n virtualizer={reusableView.virtualizer}\n parent={parent?.layoutInfo}>\n {reusableView.rendered}\n </VirtualizerItem>\n ), []);\n\n let focusedKey = state.selectionManager.focusedKey;\n let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n if (focusedItem?.parentKey != null) {\n focusedKey = focusedItem.parentKey;\n }\n\n // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n return (\n <CardViewContext.Provider value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n <Virtualizer\n {...gridProps}\n {...styleProps}\n className={classNames(styles, 'spectrum-CardView')}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n layout={cardViewLayout}\n collection={gridCollection}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n renderWrapper={renderWrapper}\n style={{\n ...styleProps.style,\n scrollPaddingTop: cardViewLayout.margin || 0\n }}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return (\n <InternalCard item={item} />\n );\n } else if (type === 'loader') {\n return <LoadingState />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </CardViewContext.Provider>\n\n );\n}\n\nfunction LoadingState() {\n let {state} = useCardViewContext();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useCardViewContext();\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useCardViewContext();\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\nfunction InternalCard(props) {\n let {\n item\n } = props;\n let cellNode = [...item.childNodes][0];\n let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n let layoutType = layout.layoutType;\n let rowRef = useRef();\n let cellRef = useRef<DOMRefValue<HTMLDivElement>>();\n let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n let {rowProps: gridRowProps} = useGridRow({\n node: item,\n isVirtualized: true\n }, state, rowRef);\n\n let {gridCellProps} = useGridCell({\n node: cellNode,\n focusMode: 'cell'\n }, state, unwrappedRef);\n\n // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n let onKeyDown = (e) => {\n if (e.key === ' ' && isDisabled) {\n e.preventDefault();\n }\n };\n\n let rowProps = mergeProps(\n gridRowProps,\n {onKeyDown}\n );\n\n if (layoutType === 'grid' || layoutType === 'gallery') {\n isQuiet = true;\n }\n\n if (layoutType !== 'grid') {\n cardOrientation = 'vertical';\n }\n\n // We don't want to focus the checkbox (or any other focusable elements) within the Card\n // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n delete gridCellProps.onKeyDownCapture;\n return (\n <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n <CardBase\n ref={cellRef}\n articleProps={gridCellProps}\n isQuiet={isQuiet}\n orientation={cardOrientation}\n item={item}\n layout={layoutType}>\n {item.rendered}\n </CardBase>\n </div>\n );\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardView = React.forwardRef(CardView) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_CardView as CardView};\n"],"names":[],"version":3,"file":"CardView.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames, useDOMRef, useStyleProps, useUnwrapDOMRef} from '@react-spectrum/utils';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection, useGridState} from '@react-stately/grid';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeProps} from '@react-aria/utils';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from '@react-stately/virtualizer';\nimport {SpectrumCardViewProps} from '@react-types/card';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator, useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useGrid, useGridCell, useGridRow} from '@react-aria/grid';\nimport {useListState} from '@react-stately/list';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer, VirtualizerItem} from '@react-aria/virtualizer';\n\nfunction CardView<T extends object>(props: SpectrumCardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n let {\n isQuiet,\n renderEmptyState,\n layout,\n loadingState,\n onLoadMore,\n cardOrientation = 'vertical'\n } = props;\n\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n let cardViewLayout = useMemo(() => typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout, [layout, collator, cardOrientation, scale]);\n let layoutType = cardViewLayout.layoutType;\n\n let {direction} = useLocale();\n let {collection} = useListState(props);\n\n let gridCollection = useMemo(() => new GridCollection<T>({\n columnCount: 1,\n items: [...collection].map(item => ({\n // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n ...item,\n hasChildNodes: true,\n childNodes: [{\n key: `cell-${item.key}`,\n type: 'cell',\n value: null,\n level: 0,\n rendered: null,\n textValue: item.textValue,\n hasChildNodes: false,\n childNodes: []\n }]\n }))\n }), [collection]);\n\n let state = useGridState({\n ...props,\n selectionMode: cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n collection: gridCollection,\n focusMode: 'cell'\n });\n\n cardViewLayout.collection = gridCollection;\n cardViewLayout.disabledKeys = state.disabledKeys;\n\n let {gridProps} = useGrid({\n ...props,\n isVirtualized: true,\n keyboardDelegate: cardViewLayout\n }, state, domRef);\n\n type View = ReusableView<Node<T>, ReactNode>;\n let renderWrapper = useCallback((parent: View, reusableView: View) => (\n <VirtualizerItem\n key={reusableView.key}\n layoutInfo={reusableView.layoutInfo}\n virtualizer={reusableView.virtualizer}\n parent={parent?.layoutInfo}>\n {reusableView.rendered}\n </VirtualizerItem>\n ), []);\n\n let focusedKey = state.selectionManager.focusedKey;\n let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n if (focusedItem?.parentKey != null) {\n focusedKey = focusedItem.parentKey;\n }\n\n // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n return (\n <CardViewContext.Provider value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n <Virtualizer\n {...gridProps}\n {...styleProps}\n className={classNames(styles, 'spectrum-CardView')}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n layout={cardViewLayout}\n collection={gridCollection}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n renderWrapper={renderWrapper}\n style={{\n ...styleProps.style,\n scrollPaddingTop: cardViewLayout.margin || 0\n }}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return (\n <InternalCard item={item} />\n );\n } else if (type === 'loader') {\n return <LoadingState />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </CardViewContext.Provider>\n\n );\n}\n\nfunction LoadingState() {\n let {state} = useCardViewContext();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useCardViewContext();\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useCardViewContext();\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\nfunction InternalCard(props) {\n let {\n item\n } = props;\n let cellNode = [...item.childNodes][0];\n let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n let layoutType = layout.layoutType;\n let rowRef = useRef(undefined);\n let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n let {rowProps: gridRowProps} = useGridRow({\n node: item,\n isVirtualized: true\n }, state, rowRef);\n\n let {gridCellProps} = useGridCell({\n node: cellNode,\n focusMode: 'cell'\n }, state, unwrappedRef);\n\n // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n let onKeyDown = (e) => {\n if (e.key === ' ' && isDisabled) {\n e.preventDefault();\n }\n };\n\n let rowProps = mergeProps(\n gridRowProps,\n {onKeyDown}\n );\n\n if (layoutType === 'grid' || layoutType === 'gallery') {\n isQuiet = true;\n }\n\n if (layoutType !== 'grid') {\n cardOrientation = 'vertical';\n }\n\n // We don't want to focus the checkbox (or any other focusable elements) within the Card\n // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n delete gridCellProps.onKeyDownCapture;\n return (\n <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n <CardBase\n ref={cellRef}\n articleProps={gridCellProps}\n isQuiet={isQuiet}\n orientation={cardOrientation}\n item={item}\n layout={layoutType}>\n {item.rendered}\n </CardBase>\n </div>\n );\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardView = React.forwardRef(CardView) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_CardView as CardView};\n"],"names":[],"version":3,"file":"CardView.main.js.map"}
|
package/dist/CardView.mjs
CHANGED
|
@@ -182,8 +182,8 @@ function $81a52da995c19652$var$InternalCard(props) {
|
|
|
182
182
|
][0];
|
|
183
183
|
let { state: state, cardOrientation: cardOrientation, isQuiet: isQuiet, layout: layout } = (0, $8d180a244893de14$export$fea0b38586ec8f13)();
|
|
184
184
|
let layoutType = layout.layoutType;
|
|
185
|
-
let rowRef = (0, $iOsT7$useRef)();
|
|
186
|
-
let cellRef = (0, $iOsT7$useRef)();
|
|
185
|
+
let rowRef = (0, $iOsT7$useRef)(undefined);
|
|
186
|
+
let cellRef = (0, $iOsT7$useRef)(undefined);
|
|
187
187
|
let unwrappedRef = (0, $iOsT7$useUnwrapDOMRef)(cellRef);
|
|
188
188
|
let { rowProps: gridRowProps } = (0, $iOsT7$useGridRow)({
|
|
189
189
|
node: item,
|
package/dist/CardView.module.js
CHANGED
|
@@ -182,8 +182,8 @@ function $81a52da995c19652$var$InternalCard(props) {
|
|
|
182
182
|
][0];
|
|
183
183
|
let { state: state, cardOrientation: cardOrientation, isQuiet: isQuiet, layout: layout } = (0, $8d180a244893de14$export$fea0b38586ec8f13)();
|
|
184
184
|
let layoutType = layout.layoutType;
|
|
185
|
-
let rowRef = (0, $iOsT7$useRef)();
|
|
186
|
-
let cellRef = (0, $iOsT7$useRef)();
|
|
185
|
+
let rowRef = (0, $iOsT7$useRef)(undefined);
|
|
186
|
+
let cellRef = (0, $iOsT7$useRef)(undefined);
|
|
187
187
|
let unwrappedRef = (0, $iOsT7$useUnwrapDOMRef)(cellRef);
|
|
188
188
|
let { rowProps: gridRowProps } = (0, $iOsT7$useGridRow)({
|
|
189
189
|
node: item,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames, useDOMRef, useStyleProps, useUnwrapDOMRef} from '@react-spectrum/utils';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection, useGridState} from '@react-stately/grid';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeProps} from '@react-aria/utils';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from '@react-stately/virtualizer';\nimport {SpectrumCardViewProps} from '@react-types/card';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator, useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useGrid, useGridCell, useGridRow} from '@react-aria/grid';\nimport {useListState} from '@react-stately/list';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer, VirtualizerItem} from '@react-aria/virtualizer';\n\nfunction CardView<T extends object>(props: SpectrumCardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n let {\n isQuiet,\n renderEmptyState,\n layout,\n loadingState,\n onLoadMore,\n cardOrientation = 'vertical'\n } = props;\n\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n let cardViewLayout = useMemo(() => typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout, [layout, collator, cardOrientation, scale]);\n let layoutType = cardViewLayout.layoutType;\n\n let {direction} = useLocale();\n let {collection} = useListState(props);\n\n let gridCollection = useMemo(() => new GridCollection<T>({\n columnCount: 1,\n items: [...collection].map(item => ({\n // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n ...item,\n hasChildNodes: true,\n childNodes: [{\n key: `cell-${item.key}`,\n type: 'cell',\n value: null,\n level: 0,\n rendered: null,\n textValue: item.textValue,\n hasChildNodes: false,\n childNodes: []\n }]\n }))\n }), [collection]);\n\n let state = useGridState({\n ...props,\n selectionMode: cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n collection: gridCollection,\n focusMode: 'cell'\n });\n\n cardViewLayout.collection = gridCollection;\n cardViewLayout.disabledKeys = state.disabledKeys;\n\n let {gridProps} = useGrid({\n ...props,\n isVirtualized: true,\n keyboardDelegate: cardViewLayout\n }, state, domRef);\n\n type View = ReusableView<Node<T>, ReactNode>;\n let renderWrapper = useCallback((parent: View, reusableView: View) => (\n <VirtualizerItem\n key={reusableView.key}\n layoutInfo={reusableView.layoutInfo}\n virtualizer={reusableView.virtualizer}\n parent={parent?.layoutInfo}>\n {reusableView.rendered}\n </VirtualizerItem>\n ), []);\n\n let focusedKey = state.selectionManager.focusedKey;\n let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n if (focusedItem?.parentKey != null) {\n focusedKey = focusedItem.parentKey;\n }\n\n // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n return (\n <CardViewContext.Provider value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n <Virtualizer\n {...gridProps}\n {...styleProps}\n className={classNames(styles, 'spectrum-CardView')}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n layout={cardViewLayout}\n collection={gridCollection}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n renderWrapper={renderWrapper}\n style={{\n ...styleProps.style,\n scrollPaddingTop: cardViewLayout.margin || 0\n }}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return (\n <InternalCard item={item} />\n );\n } else if (type === 'loader') {\n return <LoadingState />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </CardViewContext.Provider>\n\n );\n}\n\nfunction LoadingState() {\n let {state} = useCardViewContext();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useCardViewContext();\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useCardViewContext();\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\nfunction InternalCard(props) {\n let {\n item\n } = props;\n let cellNode = [...item.childNodes][0];\n let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n let layoutType = layout.layoutType;\n let rowRef = useRef();\n let cellRef = useRef<DOMRefValue<HTMLDivElement>>();\n let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n let {rowProps: gridRowProps} = useGridRow({\n node: item,\n isVirtualized: true\n }, state, rowRef);\n\n let {gridCellProps} = useGridCell({\n node: cellNode,\n focusMode: 'cell'\n }, state, unwrappedRef);\n\n // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n let onKeyDown = (e) => {\n if (e.key === ' ' && isDisabled) {\n e.preventDefault();\n }\n };\n\n let rowProps = mergeProps(\n gridRowProps,\n {onKeyDown}\n );\n\n if (layoutType === 'grid' || layoutType === 'gallery') {\n isQuiet = true;\n }\n\n if (layoutType !== 'grid') {\n cardOrientation = 'vertical';\n }\n\n // We don't want to focus the checkbox (or any other focusable elements) within the Card\n // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n delete gridCellProps.onKeyDownCapture;\n return (\n <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n <CardBase\n ref={cellRef}\n articleProps={gridCellProps}\n isQuiet={isQuiet}\n orientation={cardOrientation}\n item={item}\n layout={layoutType}>\n {item.rendered}\n </CardBase>\n </div>\n );\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardView = React.forwardRef(CardView) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_CardView as CardView};\n"],"names":[],"version":3,"file":"CardView.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames, useDOMRef, useStyleProps, useUnwrapDOMRef} from '@react-spectrum/utils';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection, useGridState} from '@react-stately/grid';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeProps} from '@react-aria/utils';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from '@react-stately/virtualizer';\nimport {SpectrumCardViewProps} from '@react-types/card';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator, useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useGrid, useGridCell, useGridRow} from '@react-aria/grid';\nimport {useListState} from '@react-stately/list';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer, VirtualizerItem} from '@react-aria/virtualizer';\n\nfunction CardView<T extends object>(props: SpectrumCardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {scale} = useProvider();\n let {styleProps} = useStyleProps(props);\n let domRef = useDOMRef(ref);\n let {\n isQuiet,\n renderEmptyState,\n layout,\n loadingState,\n onLoadMore,\n cardOrientation = 'vertical'\n } = props;\n\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n let cardViewLayout = useMemo(() => typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout, [layout, collator, cardOrientation, scale]);\n let layoutType = cardViewLayout.layoutType;\n\n let {direction} = useLocale();\n let {collection} = useListState(props);\n\n let gridCollection = useMemo(() => new GridCollection<T>({\n columnCount: 1,\n items: [...collection].map(item => ({\n // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n ...item,\n hasChildNodes: true,\n childNodes: [{\n key: `cell-${item.key}`,\n type: 'cell',\n value: null,\n level: 0,\n rendered: null,\n textValue: item.textValue,\n hasChildNodes: false,\n childNodes: []\n }]\n }))\n }), [collection]);\n\n let state = useGridState({\n ...props,\n selectionMode: cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n collection: gridCollection,\n focusMode: 'cell'\n });\n\n cardViewLayout.collection = gridCollection;\n cardViewLayout.disabledKeys = state.disabledKeys;\n\n let {gridProps} = useGrid({\n ...props,\n isVirtualized: true,\n keyboardDelegate: cardViewLayout\n }, state, domRef);\n\n type View = ReusableView<Node<T>, ReactNode>;\n let renderWrapper = useCallback((parent: View, reusableView: View) => (\n <VirtualizerItem\n key={reusableView.key}\n layoutInfo={reusableView.layoutInfo}\n virtualizer={reusableView.virtualizer}\n parent={parent?.layoutInfo}>\n {reusableView.rendered}\n </VirtualizerItem>\n ), []);\n\n let focusedKey = state.selectionManager.focusedKey;\n let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n if (focusedItem?.parentKey != null) {\n focusedKey = focusedItem.parentKey;\n }\n\n // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n return (\n <CardViewContext.Provider value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n <Virtualizer\n {...gridProps}\n {...styleProps}\n className={classNames(styles, 'spectrum-CardView')}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n layout={cardViewLayout}\n collection={gridCollection}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n renderWrapper={renderWrapper}\n style={{\n ...styleProps.style,\n scrollPaddingTop: cardViewLayout.margin || 0\n }}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return (\n <InternalCard item={item} />\n );\n } else if (type === 'loader') {\n return <LoadingState />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </CardViewContext.Provider>\n\n );\n}\n\nfunction LoadingState() {\n let {state} = useCardViewContext();\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useCardViewContext();\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useCardViewContext();\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\nfunction InternalCard(props) {\n let {\n item\n } = props;\n let cellNode = [...item.childNodes][0];\n let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n let layoutType = layout.layoutType;\n let rowRef = useRef(undefined);\n let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n let {rowProps: gridRowProps} = useGridRow({\n node: item,\n isVirtualized: true\n }, state, rowRef);\n\n let {gridCellProps} = useGridCell({\n node: cellNode,\n focusMode: 'cell'\n }, state, unwrappedRef);\n\n // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n let onKeyDown = (e) => {\n if (e.key === ' ' && isDisabled) {\n e.preventDefault();\n }\n };\n\n let rowProps = mergeProps(\n gridRowProps,\n {onKeyDown}\n );\n\n if (layoutType === 'grid' || layoutType === 'gallery') {\n isQuiet = true;\n }\n\n if (layoutType !== 'grid') {\n cardOrientation = 'vertical';\n }\n\n // We don't want to focus the checkbox (or any other focusable elements) within the Card\n // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n delete gridCellProps.onKeyDownCapture;\n return (\n <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n <CardBase\n ref={cellRef}\n articleProps={gridCellProps}\n isQuiet={isQuiet}\n orientation={cardOrientation}\n item={item}\n layout={layoutType}>\n {item.rendered}\n </CardBase>\n </div>\n );\n}\n\n/**\n * TODO: Add description of component here.\n */\nconst _CardView = React.forwardRef(CardView) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_CardView as CardView};\n"],"names":[],"version":3,"file":"CardView.module.js.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-spectrum/card",
|
|
3
|
-
"version": "3.0.0-nightly.
|
|
3
|
+
"version": "3.0.0-nightly.4683+4e3af379e",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -36,34 +36,34 @@
|
|
|
36
36
|
"url": "https://github.com/adobe/react-spectrum"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@react-aria/focus": "3.0.0-nightly.
|
|
40
|
-
"@react-aria/grid": "3.9.2-nightly.
|
|
41
|
-
"@react-aria/i18n": "3.0.0-nightly.
|
|
42
|
-
"@react-aria/interactions": "3.0.0-nightly.
|
|
43
|
-
"@react-aria/utils": "3.0.0-nightly.
|
|
44
|
-
"@react-aria/virtualizer": "3.10.2-nightly.
|
|
45
|
-
"@react-spectrum/checkbox": "3.0.0-nightly.
|
|
46
|
-
"@react-spectrum/progress": "3.0.0-nightly.
|
|
47
|
-
"@react-spectrum/utils": "3.0.0-nightly.
|
|
48
|
-
"@react-stately/collections": "3.0.0-nightly.
|
|
49
|
-
"@react-stately/grid": "3.8.8-nightly.
|
|
50
|
-
"@react-stately/list": "3.10.6-nightly.
|
|
51
|
-
"@react-stately/virtualizer": "3.7.2-nightly.
|
|
52
|
-
"@react-types/card": "3.0.0-nightly.
|
|
53
|
-
"@react-types/provider": "3.8.2-nightly.
|
|
54
|
-
"@react-types/shared": "3.0.0-nightly.
|
|
39
|
+
"@react-aria/focus": "3.0.0-nightly.2971+4e3af379e",
|
|
40
|
+
"@react-aria/grid": "3.9.2-nightly.4683+4e3af379e",
|
|
41
|
+
"@react-aria/i18n": "3.0.0-nightly.2971+4e3af379e",
|
|
42
|
+
"@react-aria/interactions": "3.0.0-nightly.2971+4e3af379e",
|
|
43
|
+
"@react-aria/utils": "3.0.0-nightly.2971+4e3af379e",
|
|
44
|
+
"@react-aria/virtualizer": "3.10.2-nightly.4683+4e3af379e",
|
|
45
|
+
"@react-spectrum/checkbox": "3.0.0-nightly.2971+4e3af379e",
|
|
46
|
+
"@react-spectrum/progress": "3.0.0-nightly.2971+4e3af379e",
|
|
47
|
+
"@react-spectrum/utils": "3.0.0-nightly.2971+4e3af379e",
|
|
48
|
+
"@react-stately/collections": "3.0.0-nightly.2971+4e3af379e",
|
|
49
|
+
"@react-stately/grid": "3.8.8-nightly.4683+4e3af379e",
|
|
50
|
+
"@react-stately/list": "3.10.6-nightly.4683+4e3af379e",
|
|
51
|
+
"@react-stately/virtualizer": "3.7.2-nightly.4683+4e3af379e",
|
|
52
|
+
"@react-types/card": "3.0.0-nightly.4683+4e3af379e",
|
|
53
|
+
"@react-types/provider": "3.8.2-nightly.4683+4e3af379e",
|
|
54
|
+
"@react-types/shared": "3.0.0-nightly.2971+4e3af379e",
|
|
55
55
|
"@swc/helpers": "^0.5.0"
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
58
|
-
"@adobe/spectrum-css-temp": "3.0.0-nightly.
|
|
58
|
+
"@adobe/spectrum-css-temp": "3.0.0-nightly.2971+4e3af379e"
|
|
59
59
|
},
|
|
60
60
|
"peerDependencies": {
|
|
61
61
|
"@react-spectrum/provider": "^3.0.0",
|
|
62
|
-
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0",
|
|
63
|
-
"react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
|
|
62
|
+
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
|
|
63
|
+
"react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
|
|
64
64
|
},
|
|
65
65
|
"publishConfig": {
|
|
66
66
|
"access": "public"
|
|
67
67
|
},
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "4e3af379e569faac3b374e0ed5a98b2a19cd92c3"
|
|
69
69
|
}
|
package/src/BaseLayout.tsx
CHANGED
|
@@ -55,8 +55,8 @@ export class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implem
|
|
|
55
55
|
|
|
56
56
|
validate(invalidationContext: InvalidationContext<CardViewLayoutOptions>) {
|
|
57
57
|
this.collection = this.virtualizer.collection as GridCollection<T>;
|
|
58
|
-
this.isLoading = invalidationContext.layoutOptions
|
|
59
|
-
this.direction = invalidationContext.layoutOptions
|
|
58
|
+
this.isLoading = invalidationContext.layoutOptions?.isLoading || false;
|
|
59
|
+
this.direction = invalidationContext.layoutOptions?.direction || 'ltr';
|
|
60
60
|
this.buildCollection(invalidationContext);
|
|
61
61
|
|
|
62
62
|
// Remove layout info that doesn't exist in new collection
|
|
@@ -87,7 +87,7 @@ export class BaseLayout<T> extends Layout<Node<T>, CardViewLayoutOptions> implem
|
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
getLayoutInfo(key: Key) {
|
|
90
|
-
return this.layoutInfos.get(key)
|
|
90
|
+
return this.layoutInfos.get(key)!;
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
getVisibleLayoutInfos(rect: Rect, excludePersistedKeys = false) {
|
package/src/CardBase.tsx
CHANGED
|
@@ -49,7 +49,7 @@ function CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDiv
|
|
|
49
49
|
let {styleProps} = useStyleProps(props);
|
|
50
50
|
let {cardProps, titleProps, contentProps} = useCard(props);
|
|
51
51
|
let domRef = useDOMRef(ref);
|
|
52
|
-
let gridRef = useRef<HTMLDivElement>();
|
|
52
|
+
let gridRef = useRef<HTMLDivElement>(undefined);
|
|
53
53
|
let checkboxRef = useRef(null);
|
|
54
54
|
|
|
55
55
|
// cards are only interactive if there is a selection manager and it allows selection
|
package/src/CardView.tsx
CHANGED
|
@@ -187,8 +187,8 @@ function InternalCard(props) {
|
|
|
187
187
|
let {state, cardOrientation, isQuiet, layout} = useCardViewContext();
|
|
188
188
|
|
|
189
189
|
let layoutType = layout.layoutType;
|
|
190
|
-
let rowRef = useRef();
|
|
191
|
-
let cellRef = useRef<DOMRefValue<HTMLDivElement>>();
|
|
190
|
+
let rowRef = useRef(undefined);
|
|
191
|
+
let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);
|
|
192
192
|
let unwrappedRef = useUnwrapDOMRef(cellRef);
|
|
193
193
|
|
|
194
194
|
let {rowProps: gridRowProps} = useGridRow({
|