react-aria-components 3.0.0-nightly-77b3442e4-250522 → 3.0.0-nightly-0784c3d29-250523

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.
@@ -13,6 +13,7 @@ function $parcel$export(e, n, v, s) {
13
13
  $parcel$export(module.exports, "SectionContext", () => $3114c2382242bdc0$export$d40e14dec8b060a8);
14
14
  $parcel$export(module.exports, "Section", () => $3114c2382242bdc0$export$6e2c8f0811a474ce);
15
15
  $parcel$export(module.exports, "DefaultCollectionRenderer", () => $3114c2382242bdc0$export$a164736487e3f0ae);
16
+ $parcel$export(module.exports, "renderAfterDropIndicators", () => $3114c2382242bdc0$export$2dbbd341daed716d);
16
17
  $parcel$export(module.exports, "CollectionRendererContext", () => $3114c2382242bdc0$export$4feb769f8ddf26c5);
17
18
  $parcel$export(module.exports, "usePersistedKeys", () => $3114c2382242bdc0$export$90e00781bc59d8f9);
18
19
  /*
@@ -48,22 +49,45 @@ function $3114c2382242bdc0$var$useCollectionRender(collection, parent, renderDro
48
49
  renderDropIndicator
49
50
  ],
50
51
  children (node) {
51
- var _collection_getItem;
52
52
  let rendered = node.render(node);
53
53
  if (!renderDropIndicator || node.type !== 'item') return rendered;
54
- let key = node.key;
55
- let keyAfter = collection.getKeyAfter(key);
56
54
  return /*#__PURE__*/ (0, ($parcel$interopDefault($leb1U$react))).createElement((0, ($parcel$interopDefault($leb1U$react))).Fragment, null, renderDropIndicator({
57
55
  type: 'item',
58
- key: key,
56
+ key: node.key,
59
57
  dropPosition: 'before'
60
- }), rendered, (keyAfter == null || ((_collection_getItem = collection.getItem(keyAfter)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.type) !== 'item') && renderDropIndicator({
58
+ }), rendered, $3114c2382242bdc0$export$2dbbd341daed716d(collection, node, renderDropIndicator));
59
+ }
60
+ });
61
+ }
62
+ function $3114c2382242bdc0$export$2dbbd341daed716d(collection, node, renderDropIndicator) {
63
+ let key = node.key;
64
+ let keyAfter = collection.getKeyAfter(key);
65
+ let nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
66
+ while(nextItemInFlattenedCollection != null && nextItemInFlattenedCollection.type !== 'item'){
67
+ keyAfter = collection.getKeyAfter(nextItemInFlattenedCollection.key);
68
+ nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
69
+ }
70
+ let nextItemInSameLevel = node.nextKey != null ? collection.getItem(node.nextKey) : null;
71
+ while(nextItemInSameLevel != null && nextItemInSameLevel.type !== 'item')nextItemInSameLevel = nextItemInSameLevel.nextKey != null ? collection.getItem(nextItemInSameLevel.nextKey) : null;
72
+ // Render one or more "after" drop indicators when the next item in the flattened collection
73
+ // has a smaller level, is not an item, or there are no more items in the collection.
74
+ // Otherwise, the "after" position is equivalent to the next item's "before" position.
75
+ let afterIndicators = [];
76
+ if (nextItemInSameLevel == null) {
77
+ let current = node;
78
+ while(current && (!nextItemInFlattenedCollection || current.parentKey !== nextItemInFlattenedCollection.parentKey && nextItemInFlattenedCollection.level < current.level)){
79
+ let indicator = renderDropIndicator({
61
80
  type: 'item',
62
- key: key,
81
+ key: current.key,
63
82
  dropPosition: 'after'
83
+ });
84
+ if (/*#__PURE__*/ (0, $leb1U$react.isValidElement)(indicator)) afterIndicators.push(/*#__PURE__*/ (0, $leb1U$react.cloneElement)(indicator, {
85
+ key: `${current.key}-after`
64
86
  }));
87
+ current = current.parentKey != null ? collection.getItem(current.parentKey) : null;
65
88
  }
66
- });
89
+ }
90
+ return afterIndicators;
67
91
  }
68
92
  const $3114c2382242bdc0$export$4feb769f8ddf26c5 = /*#__PURE__*/ (0, $leb1U$react.createContext)($3114c2382242bdc0$export$a164736487e3f0ae);
69
93
  function $3114c2382242bdc0$export$90e00781bc59d8f9(focusedKey) {
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAyFM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,EAA8B;AAGjE,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,iDAAoB,EAAE,WAAW,CAAmB,OAAwB,KAAgC;IAC/I,IAAI,QAAC,IAAI,UAAE,MAAM,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC3B,QAAQ,IAAI,CAAC,CAAC,qCAAqC,EAAE,KAAK,UAAU,CAAC;IAEvE,OAAO,OAAO,OAAO,KAAK,SAAS;AACrC;AAmCO,MAAM,4CAAgD;IAC3D,gBAAe,cAAC,UAAU,uBAAE,mBAAmB,EAAC;QAC9C,OAAO,0CAAoB,YAAY,MAAM;IAC/C;IACA,kBAAiB,cAAC,UAAU,UAAE,MAAM,uBAAE,mBAAmB,EAAC;QACxD,OAAO,0CAAoB,YAAY,QAAQ;IACjD;AACF;AAEA,SAAS,0CACP,UAAsC,EACtC,MAA4B,EAC5B,mBAA2D;IAE3D,OAAO,CAAA,GAAA,6CAAgB,EAAE;QACvB,OAAO,SAAS,WAAW,WAAW,CAAE,OAAO,GAAG,IAAI;QACtD,cAAc;YAAC;SAAoB;QACnC,UAAS,IAAI;gBAYgB;YAX3B,IAAI,WAAW,KAAK,MAAM,CAAE;YAC5B,IAAI,CAAC,uBAAuB,KAAK,IAAI,KAAK,QACxC,OAAO;YAGT,IAAI,MAAM,KAAK,GAAG;YAClB,IAAI,WAAW,WAAW,WAAW,CAAC;YACtC,qBACE,sHACG,oBAAoB;gBAAC,MAAM;qBAAQ;gBAAK,cAAc;YAAQ,IAC9D,UACA,AAAE,CAAA,YAAY,QAAQ,EAAA,sBAAA,WAAW,OAAO,CAAC,uBAAnB,0CAAA,oBAA8B,IAAI,MAAK,MAAK,KAAO,oBAAoB;gBAAC,MAAM;qBAAQ;gBAAK,cAAc;YAAO;QAG7I;IACF;AACF;AAEO,MAAM,0DAA4B,CAAA,GAAA,0BAAY,EAAsB;AAGpE,SAAS,0CAAiB,UAAsB;IACrD,OAAO,CAAA,GAAA,oBAAM,EAAE,IAAM,cAAc,OAAO,IAAI,IAAI;YAAC;SAAW,IAAI,MAAM;QAAC;KAAW;AACtF","sources":["packages/react-aria-components/src/Collection.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {CollectionBase, DropTargetDelegate, ItemDropTarget, Key, LayoutDelegate, RefObject} from '@react-types/shared';\nimport {createBranchComponent, useCachedChildren} from '@react-aria/collections';\nimport {Collection as ICollection, Node, SelectionBehavior, SelectionMode, SectionProps as SharedSectionProps} from 'react-stately';\nimport React, {createContext, ForwardedRef, HTMLAttributes, JSX, ReactElement, ReactNode, useContext, useMemo} from 'react';\nimport {StyleProps} from './utils';\n\nexport interface CollectionProps<T> extends Omit<CollectionBase<T>, 'children'> {\n /** The contents of the collection. */\n children?: ReactNode | ((item: T) => ReactNode),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\nexport interface ItemRenderProps {\n /**\n * Whether the item is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the item is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the item is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the item is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the item is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the item is non-interactive, i.e. both selection and actions are disabled and the item may\n * not be focused. Dependent on `disabledKeys` and `disabledBehavior`.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * The type of selection that is allowed in the collection.\n * @selector [data-selection-mode=\"single | multiple\"]\n */\n selectionMode: SelectionMode,\n /** The selection behavior for the collection. */\n selectionBehavior: SelectionBehavior,\n /**\n * Whether the item allows dragging.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-allows-dragging]\n */\n allowsDragging?: boolean,\n /**\n * Whether the item is currently being dragged.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-dragging]\n */\n isDragging?: boolean,\n /**\n * Whether the item is currently an active drop target.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-drop-target]\n */\n isDropTarget?: boolean\n}\n\nexport interface SectionProps<T> extends Omit<SharedSectionProps<T>, 'children' | 'title'>, StyleProps {\n /** The unique id of the section. */\n id?: Key,\n /** The object value that this section represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** Static child items or a function to render children. */\n children?: ReactNode | ((item: T) => ReactElement),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\ninterface SectionContextValue {\n name: string,\n render: (props: SectionProps<any>, ref: ForwardedRef<HTMLElement>, section: Node<any>, className?: string) => ReactElement\n}\n\nexport const SectionContext = createContext<SectionContextValue | null>(null);\n\n/** @deprecated */\nexport const Section = /*#__PURE__*/ createBranchComponent('section', <T extends object>(props: SectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>): JSX.Element => {\n let {name, render} = useContext(SectionContext)!;\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`<Section> is deprecated. Please use <${name}> instead.`);\n }\n return render(props, ref, section, 'react-aria-Section');\n});\n\nexport interface CollectionBranchProps {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** The parent node of the items to render. */\n parent: Node<unknown>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRootProps extends HTMLAttributes<HTMLElement> {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** A set of keys for items that should always be persisted in the DOM. */\n persistedKeys?: Set<Key> | null,\n /** A ref to the scroll container for the collection. */\n scrollRef?: RefObject<HTMLElement | null>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRenderer {\n /** Whether this is a virtualized collection. */\n isVirtualized?: boolean,\n /** A delegate object that provides layout information for items in the collection. */\n layoutDelegate?: LayoutDelegate,\n /** A delegate object that provides drop targets for pointer coordinates within the collection. */\n dropTargetDelegate?: DropTargetDelegate,\n /** A component that renders the root collection items. */\n CollectionRoot: React.ComponentType<CollectionRootProps>,\n /** A component that renders the child collection items. */\n CollectionBranch: React.ComponentType<CollectionBranchProps>\n}\n\nexport const DefaultCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection, renderDropIndicator}) {\n return useCollectionRender(collection, null, renderDropIndicator);\n },\n CollectionBranch({collection, parent, renderDropIndicator}) {\n return useCollectionRender(collection, parent, renderDropIndicator);\n }\n};\n\nfunction useCollectionRender(\n collection: ICollection<Node<unknown>>,\n parent: Node<unknown> | null,\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n) {\n return useCachedChildren({\n items: parent ? collection.getChildren!(parent.key) : collection,\n dependencies: [renderDropIndicator],\n children(node) {\n let rendered = node.render!(node);\n if (!renderDropIndicator || node.type !== 'item') {\n return rendered;\n }\n\n let key = node.key;\n let keyAfter = collection.getKeyAfter(key);\n return (\n <>\n {renderDropIndicator({type: 'item', key, dropPosition: 'before'})}\n {rendered}\n {((keyAfter == null || collection.getItem(keyAfter)?.type !== 'item')) && renderDropIndicator({type: 'item', key, dropPosition: 'after'})}\n </>\n );\n }\n });\n}\n\nexport const CollectionRendererContext = createContext<CollectionRenderer>(DefaultCollectionRenderer);\n\ntype PersistedKeysReturnValue = Set<Key> | null;\nexport function usePersistedKeys(focusedKey: Key | null): PersistedKeysReturnValue {\n return useMemo(() => focusedKey != null ? new Set([focusedKey]) : null, [focusedKey]);\n}\n"],"names":[],"version":3,"file":"Collection.main.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAyFM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,EAA8B;AAGjE,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,iDAAoB,EAAE,WAAW,CAAmB,OAAwB,KAAgC;IAC/I,IAAI,QAAC,IAAI,UAAE,MAAM,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC3B,QAAQ,IAAI,CAAC,CAAC,qCAAqC,EAAE,KAAK,UAAU,CAAC;IAEvE,OAAO,OAAO,OAAO,KAAK,SAAS;AACrC;AAmCO,MAAM,4CAAgD;IAC3D,gBAAe,cAAC,UAAU,uBAAE,mBAAmB,EAAC;QAC9C,OAAO,0CAAoB,YAAY,MAAM;IAC/C;IACA,kBAAiB,cAAC,UAAU,UAAE,MAAM,uBAAE,mBAAmB,EAAC;QACxD,OAAO,0CAAoB,YAAY,QAAQ;IACjD;AACF;AAEA,SAAS,0CACP,UAAsC,EACtC,MAA4B,EAC5B,mBAA2D;IAE3D,OAAO,CAAA,GAAA,6CAAgB,EAAE;QACvB,OAAO,SAAS,WAAW,WAAW,CAAE,OAAO,GAAG,IAAI;QACtD,cAAc;YAAC;SAAoB;QACnC,UAAS,IAAI;YACX,IAAI,WAAW,KAAK,MAAM,CAAE;YAC5B,IAAI,CAAC,uBAAuB,KAAK,IAAI,KAAK,QACxC,OAAO;YAGT,qBACE,sHACG,oBAAoB;gBAAC,MAAM;gBAAQ,KAAK,KAAK,GAAG;gBAAE,cAAc;YAAQ,IACxE,UACA,0CAA0B,YAAY,MAAM;QAGnD;IACF;AACF;AAEO,SAAS,0CAA0B,UAAsC,EAAE,IAAmB,EAAE,mBAA0D;IAC/J,IAAI,MAAM,KAAK,GAAG;IAClB,IAAI,WAAW,WAAW,WAAW,CAAC;IACtC,IAAI,gCAAgC,YAAY,OAAO,WAAW,OAAO,CAAC,YAAY;IACtF,MAAO,iCAAiC,QAAQ,8BAA8B,IAAI,KAAK,OAAQ;QAC7F,WAAW,WAAW,WAAW,CAAC,8BAA8B,GAAG;QACnE,gCAAgC,YAAY,OAAO,WAAW,OAAO,CAAC,YAAY;IACpF;IAEA,IAAI,sBAAsB,KAAK,OAAO,IAAI,OAAO,WAAW,OAAO,CAAC,KAAK,OAAO,IAAI;IACpF,MAAO,uBAAuB,QAAQ,oBAAoB,IAAI,KAAK,OACjE,sBAAsB,oBAAoB,OAAO,IAAI,OAAO,WAAW,OAAO,CAAC,oBAAoB,OAAO,IAAI;IAGhH,4FAA4F;IAC5F,qFAAqF;IACrF,sFAAsF;IACtF,IAAI,kBAA+B,EAAE;IACrC,IAAI,uBAAuB,MAAM;QAC/B,IAAI,UAAgC;QACpC,MAAO,WAAY,CAAA,CAAC,iCAAkC,QAAQ,SAAS,KAAK,8BAA8B,SAAS,IAAI,8BAA8B,KAAK,GAAG,QAAQ,KAAK,EAAI;YAC5K,IAAI,YAAY,oBAAoB;gBAClC,MAAM;gBACN,KAAK,QAAQ,GAAG;gBAChB,cAAc;YAChB;YACA,kBAAI,CAAA,GAAA,2BAAa,EAAE,YACjB,gBAAgB,IAAI,eAAC,CAAA,GAAA,yBAAW,EAAE,WAAW;gBAAC,KAAK,GAAG,QAAQ,GAAG,CAAC,MAAM,CAAC;YAAA;YAE3E,UAAU,QAAQ,SAAS,IAAI,OAAO,WAAW,OAAO,CAAC,QAAQ,SAAS,IAAI;QAChF;IACF;IAEA,OAAO;AACT;AAEO,MAAM,0DAA4B,CAAA,GAAA,0BAAY,EAAsB;AAGpE,SAAS,0CAAiB,UAAsB;IACrD,OAAO,CAAA,GAAA,oBAAM,EAAE,IAAM,cAAc,OAAO,IAAI,IAAI;YAAC;SAAW,IAAI,MAAM;QAAC;KAAW;AACtF","sources":["packages/react-aria-components/src/Collection.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {CollectionBase, DropTargetDelegate, ItemDropTarget, Key, LayoutDelegate, RefObject} from '@react-types/shared';\nimport {createBranchComponent, useCachedChildren} from '@react-aria/collections';\nimport {Collection as ICollection, Node, SelectionBehavior, SelectionMode, SectionProps as SharedSectionProps} from 'react-stately';\nimport React, {cloneElement, createContext, ForwardedRef, HTMLAttributes, isValidElement, JSX, ReactElement, ReactNode, useContext, useMemo} from 'react';\nimport {StyleProps} from './utils';\n\nexport interface CollectionProps<T> extends Omit<CollectionBase<T>, 'children'> {\n /** The contents of the collection. */\n children?: ReactNode | ((item: T) => ReactNode),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\nexport interface ItemRenderProps {\n /**\n * Whether the item is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the item is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the item is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the item is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the item is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the item is non-interactive, i.e. both selection and actions are disabled and the item may\n * not be focused. Dependent on `disabledKeys` and `disabledBehavior`.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * The type of selection that is allowed in the collection.\n * @selector [data-selection-mode=\"single | multiple\"]\n */\n selectionMode: SelectionMode,\n /** The selection behavior for the collection. */\n selectionBehavior: SelectionBehavior,\n /**\n * Whether the item allows dragging.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-allows-dragging]\n */\n allowsDragging?: boolean,\n /**\n * Whether the item is currently being dragged.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-dragging]\n */\n isDragging?: boolean,\n /**\n * Whether the item is currently an active drop target.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-drop-target]\n */\n isDropTarget?: boolean\n}\n\nexport interface SectionProps<T> extends Omit<SharedSectionProps<T>, 'children' | 'title'>, StyleProps {\n /** The unique id of the section. */\n id?: Key,\n /** The object value that this section represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** Static child items or a function to render children. */\n children?: ReactNode | ((item: T) => ReactElement),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\ninterface SectionContextValue {\n name: string,\n render: (props: SectionProps<any>, ref: ForwardedRef<HTMLElement>, section: Node<any>, className?: string) => ReactElement\n}\n\nexport const SectionContext = createContext<SectionContextValue | null>(null);\n\n/** @deprecated */\nexport const Section = /*#__PURE__*/ createBranchComponent('section', <T extends object>(props: SectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>): JSX.Element => {\n let {name, render} = useContext(SectionContext)!;\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`<Section> is deprecated. Please use <${name}> instead.`);\n }\n return render(props, ref, section, 'react-aria-Section');\n});\n\nexport interface CollectionBranchProps {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** The parent node of the items to render. */\n parent: Node<unknown>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRootProps extends HTMLAttributes<HTMLElement> {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** A set of keys for items that should always be persisted in the DOM. */\n persistedKeys?: Set<Key> | null,\n /** A ref to the scroll container for the collection. */\n scrollRef?: RefObject<HTMLElement | null>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRenderer {\n /** Whether this is a virtualized collection. */\n isVirtualized?: boolean,\n /** A delegate object that provides layout information for items in the collection. */\n layoutDelegate?: LayoutDelegate,\n /** A delegate object that provides drop targets for pointer coordinates within the collection. */\n dropTargetDelegate?: DropTargetDelegate,\n /** A component that renders the root collection items. */\n CollectionRoot: React.ComponentType<CollectionRootProps>,\n /** A component that renders the child collection items. */\n CollectionBranch: React.ComponentType<CollectionBranchProps>\n}\n\nexport const DefaultCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection, renderDropIndicator}) {\n return useCollectionRender(collection, null, renderDropIndicator);\n },\n CollectionBranch({collection, parent, renderDropIndicator}) {\n return useCollectionRender(collection, parent, renderDropIndicator);\n }\n};\n\nfunction useCollectionRender(\n collection: ICollection<Node<unknown>>,\n parent: Node<unknown> | null,\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n) {\n return useCachedChildren({\n items: parent ? collection.getChildren!(parent.key) : collection,\n dependencies: [renderDropIndicator],\n children(node) {\n let rendered = node.render!(node);\n if (!renderDropIndicator || node.type !== 'item') {\n return rendered;\n }\n\n return (\n <>\n {renderDropIndicator({type: 'item', key: node.key, dropPosition: 'before'})}\n {rendered}\n {renderAfterDropIndicators(collection, node, renderDropIndicator)}\n </>\n );\n }\n });\n}\n\nexport function renderAfterDropIndicators(collection: ICollection<Node<unknown>>, node: Node<unknown>, renderDropIndicator: (target: ItemDropTarget) => ReactNode): ReactNode {\n let key = node.key;\n let keyAfter = collection.getKeyAfter(key);\n let nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;\n while (nextItemInFlattenedCollection != null && nextItemInFlattenedCollection.type !== 'item') {\n keyAfter = collection.getKeyAfter(nextItemInFlattenedCollection.key);\n nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;\n }\n\n let nextItemInSameLevel = node.nextKey != null ? collection.getItem(node.nextKey) : null;\n while (nextItemInSameLevel != null && nextItemInSameLevel.type !== 'item') {\n nextItemInSameLevel = nextItemInSameLevel.nextKey != null ? collection.getItem(nextItemInSameLevel.nextKey) : null;\n }\n\n // Render one or more \"after\" drop indicators when the next item in the flattened collection\n // has a smaller level, is not an item, or there are no more items in the collection.\n // Otherwise, the \"after\" position is equivalent to the next item's \"before\" position.\n let afterIndicators: ReactNode[] = [];\n if (nextItemInSameLevel == null) {\n let current: Node<unknown> | null = node;\n while (current && (!nextItemInFlattenedCollection || (current.parentKey !== nextItemInFlattenedCollection.parentKey && nextItemInFlattenedCollection.level < current.level))) {\n let indicator = renderDropIndicator({\n type: 'item',\n key: current.key,\n dropPosition: 'after'\n });\n if (isValidElement(indicator)) {\n afterIndicators.push(cloneElement(indicator, {key: `${current.key}-after`}));\n }\n current = current.parentKey != null ? collection.getItem(current.parentKey) : null;\n }\n }\n\n return afterIndicators;\n}\n\nexport const CollectionRendererContext = createContext<CollectionRenderer>(DefaultCollectionRenderer);\n\ntype PersistedKeysReturnValue = Set<Key> | null;\nexport function usePersistedKeys(focusedKey: Key | null): PersistedKeysReturnValue {\n return useMemo(() => focusedKey != null ? new Set([focusedKey]) : null, [focusedKey]);\n}\n"],"names":[],"version":3,"file":"Collection.main.js.map"}
@@ -1,5 +1,5 @@
1
1
  import {createBranchComponent as $18I52$createBranchComponent, useCachedChildren as $18I52$useCachedChildren} from "@react-aria/collections";
2
- import $18I52$react, {createContext as $18I52$createContext, useContext as $18I52$useContext, useMemo as $18I52$useMemo} from "react";
2
+ import $18I52$react, {createContext as $18I52$createContext, useContext as $18I52$useContext, isValidElement as $18I52$isValidElement, cloneElement as $18I52$cloneElement, useMemo as $18I52$useMemo} from "react";
3
3
 
4
4
  /*
5
5
  * Copyright 2022 Adobe. All rights reserved.
@@ -34,22 +34,45 @@ function $7135fc7d473fd974$var$useCollectionRender(collection, parent, renderDro
34
34
  renderDropIndicator
35
35
  ],
36
36
  children (node) {
37
- var _collection_getItem;
38
37
  let rendered = node.render(node);
39
38
  if (!renderDropIndicator || node.type !== 'item') return rendered;
40
- let key = node.key;
41
- let keyAfter = collection.getKeyAfter(key);
42
39
  return /*#__PURE__*/ (0, $18I52$react).createElement((0, $18I52$react).Fragment, null, renderDropIndicator({
43
40
  type: 'item',
44
- key: key,
41
+ key: node.key,
45
42
  dropPosition: 'before'
46
- }), rendered, (keyAfter == null || ((_collection_getItem = collection.getItem(keyAfter)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.type) !== 'item') && renderDropIndicator({
43
+ }), rendered, $7135fc7d473fd974$export$2dbbd341daed716d(collection, node, renderDropIndicator));
44
+ }
45
+ });
46
+ }
47
+ function $7135fc7d473fd974$export$2dbbd341daed716d(collection, node, renderDropIndicator) {
48
+ let key = node.key;
49
+ let keyAfter = collection.getKeyAfter(key);
50
+ let nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
51
+ while(nextItemInFlattenedCollection != null && nextItemInFlattenedCollection.type !== 'item'){
52
+ keyAfter = collection.getKeyAfter(nextItemInFlattenedCollection.key);
53
+ nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
54
+ }
55
+ let nextItemInSameLevel = node.nextKey != null ? collection.getItem(node.nextKey) : null;
56
+ while(nextItemInSameLevel != null && nextItemInSameLevel.type !== 'item')nextItemInSameLevel = nextItemInSameLevel.nextKey != null ? collection.getItem(nextItemInSameLevel.nextKey) : null;
57
+ // Render one or more "after" drop indicators when the next item in the flattened collection
58
+ // has a smaller level, is not an item, or there are no more items in the collection.
59
+ // Otherwise, the "after" position is equivalent to the next item's "before" position.
60
+ let afterIndicators = [];
61
+ if (nextItemInSameLevel == null) {
62
+ let current = node;
63
+ while(current && (!nextItemInFlattenedCollection || current.parentKey !== nextItemInFlattenedCollection.parentKey && nextItemInFlattenedCollection.level < current.level)){
64
+ let indicator = renderDropIndicator({
47
65
  type: 'item',
48
- key: key,
66
+ key: current.key,
49
67
  dropPosition: 'after'
68
+ });
69
+ if (/*#__PURE__*/ (0, $18I52$isValidElement)(indicator)) afterIndicators.push(/*#__PURE__*/ (0, $18I52$cloneElement)(indicator, {
70
+ key: `${current.key}-after`
50
71
  }));
72
+ current = current.parentKey != null ? collection.getItem(current.parentKey) : null;
51
73
  }
52
- });
74
+ }
75
+ return afterIndicators;
53
76
  }
54
77
  const $7135fc7d473fd974$export$4feb769f8ddf26c5 = /*#__PURE__*/ (0, $18I52$createContext)($7135fc7d473fd974$export$a164736487e3f0ae);
55
78
  function $7135fc7d473fd974$export$90e00781bc59d8f9(focusedKey) {
@@ -61,5 +84,5 @@ function $7135fc7d473fd974$export$90e00781bc59d8f9(focusedKey) {
61
84
  }
62
85
 
63
86
 
64
- export {$7135fc7d473fd974$export$d40e14dec8b060a8 as SectionContext, $7135fc7d473fd974$export$6e2c8f0811a474ce as Section, $7135fc7d473fd974$export$a164736487e3f0ae as DefaultCollectionRenderer, $7135fc7d473fd974$export$4feb769f8ddf26c5 as CollectionRendererContext, $7135fc7d473fd974$export$90e00781bc59d8f9 as usePersistedKeys};
87
+ export {$7135fc7d473fd974$export$d40e14dec8b060a8 as SectionContext, $7135fc7d473fd974$export$6e2c8f0811a474ce as Section, $7135fc7d473fd974$export$a164736487e3f0ae as DefaultCollectionRenderer, $7135fc7d473fd974$export$2dbbd341daed716d as renderAfterDropIndicators, $7135fc7d473fd974$export$4feb769f8ddf26c5 as CollectionRendererContext, $7135fc7d473fd974$export$90e00781bc59d8f9 as usePersistedKeys};
65
88
  //# sourceMappingURL=Collection.module.js.map
@@ -1,5 +1,5 @@
1
1
  import {createBranchComponent as $18I52$createBranchComponent, useCachedChildren as $18I52$useCachedChildren} from "@react-aria/collections";
2
- import $18I52$react, {createContext as $18I52$createContext, useContext as $18I52$useContext, useMemo as $18I52$useMemo} from "react";
2
+ import $18I52$react, {createContext as $18I52$createContext, useContext as $18I52$useContext, isValidElement as $18I52$isValidElement, cloneElement as $18I52$cloneElement, useMemo as $18I52$useMemo} from "react";
3
3
 
4
4
  /*
5
5
  * Copyright 2022 Adobe. All rights reserved.
@@ -34,22 +34,45 @@ function $7135fc7d473fd974$var$useCollectionRender(collection, parent, renderDro
34
34
  renderDropIndicator
35
35
  ],
36
36
  children (node) {
37
- var _collection_getItem;
38
37
  let rendered = node.render(node);
39
38
  if (!renderDropIndicator || node.type !== 'item') return rendered;
40
- let key = node.key;
41
- let keyAfter = collection.getKeyAfter(key);
42
39
  return /*#__PURE__*/ (0, $18I52$react).createElement((0, $18I52$react).Fragment, null, renderDropIndicator({
43
40
  type: 'item',
44
- key: key,
41
+ key: node.key,
45
42
  dropPosition: 'before'
46
- }), rendered, (keyAfter == null || ((_collection_getItem = collection.getItem(keyAfter)) === null || _collection_getItem === void 0 ? void 0 : _collection_getItem.type) !== 'item') && renderDropIndicator({
43
+ }), rendered, $7135fc7d473fd974$export$2dbbd341daed716d(collection, node, renderDropIndicator));
44
+ }
45
+ });
46
+ }
47
+ function $7135fc7d473fd974$export$2dbbd341daed716d(collection, node, renderDropIndicator) {
48
+ let key = node.key;
49
+ let keyAfter = collection.getKeyAfter(key);
50
+ let nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
51
+ while(nextItemInFlattenedCollection != null && nextItemInFlattenedCollection.type !== 'item'){
52
+ keyAfter = collection.getKeyAfter(nextItemInFlattenedCollection.key);
53
+ nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;
54
+ }
55
+ let nextItemInSameLevel = node.nextKey != null ? collection.getItem(node.nextKey) : null;
56
+ while(nextItemInSameLevel != null && nextItemInSameLevel.type !== 'item')nextItemInSameLevel = nextItemInSameLevel.nextKey != null ? collection.getItem(nextItemInSameLevel.nextKey) : null;
57
+ // Render one or more "after" drop indicators when the next item in the flattened collection
58
+ // has a smaller level, is not an item, or there are no more items in the collection.
59
+ // Otherwise, the "after" position is equivalent to the next item's "before" position.
60
+ let afterIndicators = [];
61
+ if (nextItemInSameLevel == null) {
62
+ let current = node;
63
+ while(current && (!nextItemInFlattenedCollection || current.parentKey !== nextItemInFlattenedCollection.parentKey && nextItemInFlattenedCollection.level < current.level)){
64
+ let indicator = renderDropIndicator({
47
65
  type: 'item',
48
- key: key,
66
+ key: current.key,
49
67
  dropPosition: 'after'
68
+ });
69
+ if (/*#__PURE__*/ (0, $18I52$isValidElement)(indicator)) afterIndicators.push(/*#__PURE__*/ (0, $18I52$cloneElement)(indicator, {
70
+ key: `${current.key}-after`
50
71
  }));
72
+ current = current.parentKey != null ? collection.getItem(current.parentKey) : null;
51
73
  }
52
- });
74
+ }
75
+ return afterIndicators;
53
76
  }
54
77
  const $7135fc7d473fd974$export$4feb769f8ddf26c5 = /*#__PURE__*/ (0, $18I52$createContext)($7135fc7d473fd974$export$a164736487e3f0ae);
55
78
  function $7135fc7d473fd974$export$90e00781bc59d8f9(focusedKey) {
@@ -61,5 +84,5 @@ function $7135fc7d473fd974$export$90e00781bc59d8f9(focusedKey) {
61
84
  }
62
85
 
63
86
 
64
- export {$7135fc7d473fd974$export$d40e14dec8b060a8 as SectionContext, $7135fc7d473fd974$export$6e2c8f0811a474ce as Section, $7135fc7d473fd974$export$a164736487e3f0ae as DefaultCollectionRenderer, $7135fc7d473fd974$export$4feb769f8ddf26c5 as CollectionRendererContext, $7135fc7d473fd974$export$90e00781bc59d8f9 as usePersistedKeys};
87
+ export {$7135fc7d473fd974$export$d40e14dec8b060a8 as SectionContext, $7135fc7d473fd974$export$6e2c8f0811a474ce as Section, $7135fc7d473fd974$export$a164736487e3f0ae as DefaultCollectionRenderer, $7135fc7d473fd974$export$2dbbd341daed716d as renderAfterDropIndicators, $7135fc7d473fd974$export$4feb769f8ddf26c5 as CollectionRendererContext, $7135fc7d473fd974$export$90e00781bc59d8f9 as usePersistedKeys};
65
88
  //# sourceMappingURL=Collection.module.js.map
@@ -1 +1 @@
1
- {"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAyFM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA8B;AAGjE,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,4BAAoB,EAAE,WAAW,CAAmB,OAAwB,KAAgC;IAC/I,IAAI,QAAC,IAAI,UAAE,MAAM,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC3B,QAAQ,IAAI,CAAC,CAAC,qCAAqC,EAAE,KAAK,UAAU,CAAC;IAEvE,OAAO,OAAO,OAAO,KAAK,SAAS;AACrC;AAmCO,MAAM,4CAAgD;IAC3D,gBAAe,cAAC,UAAU,uBAAE,mBAAmB,EAAC;QAC9C,OAAO,0CAAoB,YAAY,MAAM;IAC/C;IACA,kBAAiB,cAAC,UAAU,UAAE,MAAM,uBAAE,mBAAmB,EAAC;QACxD,OAAO,0CAAoB,YAAY,QAAQ;IACjD;AACF;AAEA,SAAS,0CACP,UAAsC,EACtC,MAA4B,EAC5B,mBAA2D;IAE3D,OAAO,CAAA,GAAA,wBAAgB,EAAE;QACvB,OAAO,SAAS,WAAW,WAAW,CAAE,OAAO,GAAG,IAAI;QACtD,cAAc;YAAC;SAAoB;QACnC,UAAS,IAAI;gBAYgB;YAX3B,IAAI,WAAW,KAAK,MAAM,CAAE;YAC5B,IAAI,CAAC,uBAAuB,KAAK,IAAI,KAAK,QACxC,OAAO;YAGT,IAAI,MAAM,KAAK,GAAG;YAClB,IAAI,WAAW,WAAW,WAAW,CAAC;YACtC,qBACE,kEACG,oBAAoB;gBAAC,MAAM;qBAAQ;gBAAK,cAAc;YAAQ,IAC9D,UACA,AAAE,CAAA,YAAY,QAAQ,EAAA,sBAAA,WAAW,OAAO,CAAC,uBAAnB,0CAAA,oBAA8B,IAAI,MAAK,MAAK,KAAO,oBAAoB;gBAAC,MAAM;qBAAQ;gBAAK,cAAc;YAAO;QAG7I;IACF;AACF;AAEO,MAAM,0DAA4B,CAAA,GAAA,oBAAY,EAAsB;AAGpE,SAAS,0CAAiB,UAAsB;IACrD,OAAO,CAAA,GAAA,cAAM,EAAE,IAAM,cAAc,OAAO,IAAI,IAAI;YAAC;SAAW,IAAI,MAAM;QAAC;KAAW;AACtF","sources":["packages/react-aria-components/src/Collection.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {CollectionBase, DropTargetDelegate, ItemDropTarget, Key, LayoutDelegate, RefObject} from '@react-types/shared';\nimport {createBranchComponent, useCachedChildren} from '@react-aria/collections';\nimport {Collection as ICollection, Node, SelectionBehavior, SelectionMode, SectionProps as SharedSectionProps} from 'react-stately';\nimport React, {createContext, ForwardedRef, HTMLAttributes, JSX, ReactElement, ReactNode, useContext, useMemo} from 'react';\nimport {StyleProps} from './utils';\n\nexport interface CollectionProps<T> extends Omit<CollectionBase<T>, 'children'> {\n /** The contents of the collection. */\n children?: ReactNode | ((item: T) => ReactNode),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\nexport interface ItemRenderProps {\n /**\n * Whether the item is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the item is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the item is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the item is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the item is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the item is non-interactive, i.e. both selection and actions are disabled and the item may\n * not be focused. Dependent on `disabledKeys` and `disabledBehavior`.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * The type of selection that is allowed in the collection.\n * @selector [data-selection-mode=\"single | multiple\"]\n */\n selectionMode: SelectionMode,\n /** The selection behavior for the collection. */\n selectionBehavior: SelectionBehavior,\n /**\n * Whether the item allows dragging.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-allows-dragging]\n */\n allowsDragging?: boolean,\n /**\n * Whether the item is currently being dragged.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-dragging]\n */\n isDragging?: boolean,\n /**\n * Whether the item is currently an active drop target.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-drop-target]\n */\n isDropTarget?: boolean\n}\n\nexport interface SectionProps<T> extends Omit<SharedSectionProps<T>, 'children' | 'title'>, StyleProps {\n /** The unique id of the section. */\n id?: Key,\n /** The object value that this section represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** Static child items or a function to render children. */\n children?: ReactNode | ((item: T) => ReactElement),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\ninterface SectionContextValue {\n name: string,\n render: (props: SectionProps<any>, ref: ForwardedRef<HTMLElement>, section: Node<any>, className?: string) => ReactElement\n}\n\nexport const SectionContext = createContext<SectionContextValue | null>(null);\n\n/** @deprecated */\nexport const Section = /*#__PURE__*/ createBranchComponent('section', <T extends object>(props: SectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>): JSX.Element => {\n let {name, render} = useContext(SectionContext)!;\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`<Section> is deprecated. Please use <${name}> instead.`);\n }\n return render(props, ref, section, 'react-aria-Section');\n});\n\nexport interface CollectionBranchProps {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** The parent node of the items to render. */\n parent: Node<unknown>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRootProps extends HTMLAttributes<HTMLElement> {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** A set of keys for items that should always be persisted in the DOM. */\n persistedKeys?: Set<Key> | null,\n /** A ref to the scroll container for the collection. */\n scrollRef?: RefObject<HTMLElement | null>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRenderer {\n /** Whether this is a virtualized collection. */\n isVirtualized?: boolean,\n /** A delegate object that provides layout information for items in the collection. */\n layoutDelegate?: LayoutDelegate,\n /** A delegate object that provides drop targets for pointer coordinates within the collection. */\n dropTargetDelegate?: DropTargetDelegate,\n /** A component that renders the root collection items. */\n CollectionRoot: React.ComponentType<CollectionRootProps>,\n /** A component that renders the child collection items. */\n CollectionBranch: React.ComponentType<CollectionBranchProps>\n}\n\nexport const DefaultCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection, renderDropIndicator}) {\n return useCollectionRender(collection, null, renderDropIndicator);\n },\n CollectionBranch({collection, parent, renderDropIndicator}) {\n return useCollectionRender(collection, parent, renderDropIndicator);\n }\n};\n\nfunction useCollectionRender(\n collection: ICollection<Node<unknown>>,\n parent: Node<unknown> | null,\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n) {\n return useCachedChildren({\n items: parent ? collection.getChildren!(parent.key) : collection,\n dependencies: [renderDropIndicator],\n children(node) {\n let rendered = node.render!(node);\n if (!renderDropIndicator || node.type !== 'item') {\n return rendered;\n }\n\n let key = node.key;\n let keyAfter = collection.getKeyAfter(key);\n return (\n <>\n {renderDropIndicator({type: 'item', key, dropPosition: 'before'})}\n {rendered}\n {((keyAfter == null || collection.getItem(keyAfter)?.type !== 'item')) && renderDropIndicator({type: 'item', key, dropPosition: 'after'})}\n </>\n );\n }\n });\n}\n\nexport const CollectionRendererContext = createContext<CollectionRenderer>(DefaultCollectionRenderer);\n\ntype PersistedKeysReturnValue = Set<Key> | null;\nexport function usePersistedKeys(focusedKey: Key | null): PersistedKeysReturnValue {\n return useMemo(() => focusedKey != null ? new Set([focusedKey]) : null, [focusedKey]);\n}\n"],"names":[],"version":3,"file":"Collection.module.js.map"}
1
+ {"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAyFM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA8B;AAGjE,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,4BAAoB,EAAE,WAAW,CAAmB,OAAwB,KAAgC;IAC/I,IAAI,QAAC,IAAI,UAAE,MAAM,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC3B,QAAQ,IAAI,CAAC,CAAC,qCAAqC,EAAE,KAAK,UAAU,CAAC;IAEvE,OAAO,OAAO,OAAO,KAAK,SAAS;AACrC;AAmCO,MAAM,4CAAgD;IAC3D,gBAAe,cAAC,UAAU,uBAAE,mBAAmB,EAAC;QAC9C,OAAO,0CAAoB,YAAY,MAAM;IAC/C;IACA,kBAAiB,cAAC,UAAU,UAAE,MAAM,uBAAE,mBAAmB,EAAC;QACxD,OAAO,0CAAoB,YAAY,QAAQ;IACjD;AACF;AAEA,SAAS,0CACP,UAAsC,EACtC,MAA4B,EAC5B,mBAA2D;IAE3D,OAAO,CAAA,GAAA,wBAAgB,EAAE;QACvB,OAAO,SAAS,WAAW,WAAW,CAAE,OAAO,GAAG,IAAI;QACtD,cAAc;YAAC;SAAoB;QACnC,UAAS,IAAI;YACX,IAAI,WAAW,KAAK,MAAM,CAAE;YAC5B,IAAI,CAAC,uBAAuB,KAAK,IAAI,KAAK,QACxC,OAAO;YAGT,qBACE,kEACG,oBAAoB;gBAAC,MAAM;gBAAQ,KAAK,KAAK,GAAG;gBAAE,cAAc;YAAQ,IACxE,UACA,0CAA0B,YAAY,MAAM;QAGnD;IACF;AACF;AAEO,SAAS,0CAA0B,UAAsC,EAAE,IAAmB,EAAE,mBAA0D;IAC/J,IAAI,MAAM,KAAK,GAAG;IAClB,IAAI,WAAW,WAAW,WAAW,CAAC;IACtC,IAAI,gCAAgC,YAAY,OAAO,WAAW,OAAO,CAAC,YAAY;IACtF,MAAO,iCAAiC,QAAQ,8BAA8B,IAAI,KAAK,OAAQ;QAC7F,WAAW,WAAW,WAAW,CAAC,8BAA8B,GAAG;QACnE,gCAAgC,YAAY,OAAO,WAAW,OAAO,CAAC,YAAY;IACpF;IAEA,IAAI,sBAAsB,KAAK,OAAO,IAAI,OAAO,WAAW,OAAO,CAAC,KAAK,OAAO,IAAI;IACpF,MAAO,uBAAuB,QAAQ,oBAAoB,IAAI,KAAK,OACjE,sBAAsB,oBAAoB,OAAO,IAAI,OAAO,WAAW,OAAO,CAAC,oBAAoB,OAAO,IAAI;IAGhH,4FAA4F;IAC5F,qFAAqF;IACrF,sFAAsF;IACtF,IAAI,kBAA+B,EAAE;IACrC,IAAI,uBAAuB,MAAM;QAC/B,IAAI,UAAgC;QACpC,MAAO,WAAY,CAAA,CAAC,iCAAkC,QAAQ,SAAS,KAAK,8BAA8B,SAAS,IAAI,8BAA8B,KAAK,GAAG,QAAQ,KAAK,EAAI;YAC5K,IAAI,YAAY,oBAAoB;gBAClC,MAAM;gBACN,KAAK,QAAQ,GAAG;gBAChB,cAAc;YAChB;YACA,kBAAI,CAAA,GAAA,qBAAa,EAAE,YACjB,gBAAgB,IAAI,eAAC,CAAA,GAAA,mBAAW,EAAE,WAAW;gBAAC,KAAK,GAAG,QAAQ,GAAG,CAAC,MAAM,CAAC;YAAA;YAE3E,UAAU,QAAQ,SAAS,IAAI,OAAO,WAAW,OAAO,CAAC,QAAQ,SAAS,IAAI;QAChF;IACF;IAEA,OAAO;AACT;AAEO,MAAM,0DAA4B,CAAA,GAAA,oBAAY,EAAsB;AAGpE,SAAS,0CAAiB,UAAsB;IACrD,OAAO,CAAA,GAAA,cAAM,EAAE,IAAM,cAAc,OAAO,IAAI,IAAI;YAAC;SAAW,IAAI,MAAM;QAAC;KAAW;AACtF","sources":["packages/react-aria-components/src/Collection.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 */\nimport {CollectionBase, DropTargetDelegate, ItemDropTarget, Key, LayoutDelegate, RefObject} from '@react-types/shared';\nimport {createBranchComponent, useCachedChildren} from '@react-aria/collections';\nimport {Collection as ICollection, Node, SelectionBehavior, SelectionMode, SectionProps as SharedSectionProps} from 'react-stately';\nimport React, {cloneElement, createContext, ForwardedRef, HTMLAttributes, isValidElement, JSX, ReactElement, ReactNode, useContext, useMemo} from 'react';\nimport {StyleProps} from './utils';\n\nexport interface CollectionProps<T> extends Omit<CollectionBase<T>, 'children'> {\n /** The contents of the collection. */\n children?: ReactNode | ((item: T) => ReactNode),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\nexport interface ItemRenderProps {\n /**\n * Whether the item is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the item is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the item is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the item is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the item is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the item is non-interactive, i.e. both selection and actions are disabled and the item may\n * not be focused. Dependent on `disabledKeys` and `disabledBehavior`.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * The type of selection that is allowed in the collection.\n * @selector [data-selection-mode=\"single | multiple\"]\n */\n selectionMode: SelectionMode,\n /** The selection behavior for the collection. */\n selectionBehavior: SelectionBehavior,\n /**\n * Whether the item allows dragging.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-allows-dragging]\n */\n allowsDragging?: boolean,\n /**\n * Whether the item is currently being dragged.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-dragging]\n */\n isDragging?: boolean,\n /**\n * Whether the item is currently an active drop target.\n * @note This property is only available in collection components that support drag and drop.\n * @selector [data-drop-target]\n */\n isDropTarget?: boolean\n}\n\nexport interface SectionProps<T> extends Omit<SharedSectionProps<T>, 'children' | 'title'>, StyleProps {\n /** The unique id of the section. */\n id?: Key,\n /** The object value that this section represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** Static child items or a function to render children. */\n children?: ReactNode | ((item: T) => ReactElement),\n /** Values that should invalidate the item cache when using dynamic collections. */\n dependencies?: ReadonlyArray<any>\n}\n\ninterface SectionContextValue {\n name: string,\n render: (props: SectionProps<any>, ref: ForwardedRef<HTMLElement>, section: Node<any>, className?: string) => ReactElement\n}\n\nexport const SectionContext = createContext<SectionContextValue | null>(null);\n\n/** @deprecated */\nexport const Section = /*#__PURE__*/ createBranchComponent('section', <T extends object>(props: SectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>): JSX.Element => {\n let {name, render} = useContext(SectionContext)!;\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`<Section> is deprecated. Please use <${name}> instead.`);\n }\n return render(props, ref, section, 'react-aria-Section');\n});\n\nexport interface CollectionBranchProps {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** The parent node of the items to render. */\n parent: Node<unknown>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRootProps extends HTMLAttributes<HTMLElement> {\n /** The collection of items to render. */\n collection: ICollection<Node<unknown>>,\n /** A set of keys for items that should always be persisted in the DOM. */\n persistedKeys?: Set<Key> | null,\n /** A ref to the scroll container for the collection. */\n scrollRef?: RefObject<HTMLElement | null>,\n /** A function that renders a drop indicator between items. */\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n}\n\nexport interface CollectionRenderer {\n /** Whether this is a virtualized collection. */\n isVirtualized?: boolean,\n /** A delegate object that provides layout information for items in the collection. */\n layoutDelegate?: LayoutDelegate,\n /** A delegate object that provides drop targets for pointer coordinates within the collection. */\n dropTargetDelegate?: DropTargetDelegate,\n /** A component that renders the root collection items. */\n CollectionRoot: React.ComponentType<CollectionRootProps>,\n /** A component that renders the child collection items. */\n CollectionBranch: React.ComponentType<CollectionBranchProps>\n}\n\nexport const DefaultCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection, renderDropIndicator}) {\n return useCollectionRender(collection, null, renderDropIndicator);\n },\n CollectionBranch({collection, parent, renderDropIndicator}) {\n return useCollectionRender(collection, parent, renderDropIndicator);\n }\n};\n\nfunction useCollectionRender(\n collection: ICollection<Node<unknown>>,\n parent: Node<unknown> | null,\n renderDropIndicator?: (target: ItemDropTarget) => ReactNode\n) {\n return useCachedChildren({\n items: parent ? collection.getChildren!(parent.key) : collection,\n dependencies: [renderDropIndicator],\n children(node) {\n let rendered = node.render!(node);\n if (!renderDropIndicator || node.type !== 'item') {\n return rendered;\n }\n\n return (\n <>\n {renderDropIndicator({type: 'item', key: node.key, dropPosition: 'before'})}\n {rendered}\n {renderAfterDropIndicators(collection, node, renderDropIndicator)}\n </>\n );\n }\n });\n}\n\nexport function renderAfterDropIndicators(collection: ICollection<Node<unknown>>, node: Node<unknown>, renderDropIndicator: (target: ItemDropTarget) => ReactNode): ReactNode {\n let key = node.key;\n let keyAfter = collection.getKeyAfter(key);\n let nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;\n while (nextItemInFlattenedCollection != null && nextItemInFlattenedCollection.type !== 'item') {\n keyAfter = collection.getKeyAfter(nextItemInFlattenedCollection.key);\n nextItemInFlattenedCollection = keyAfter != null ? collection.getItem(keyAfter) : null;\n }\n\n let nextItemInSameLevel = node.nextKey != null ? collection.getItem(node.nextKey) : null;\n while (nextItemInSameLevel != null && nextItemInSameLevel.type !== 'item') {\n nextItemInSameLevel = nextItemInSameLevel.nextKey != null ? collection.getItem(nextItemInSameLevel.nextKey) : null;\n }\n\n // Render one or more \"after\" drop indicators when the next item in the flattened collection\n // has a smaller level, is not an item, or there are no more items in the collection.\n // Otherwise, the \"after\" position is equivalent to the next item's \"before\" position.\n let afterIndicators: ReactNode[] = [];\n if (nextItemInSameLevel == null) {\n let current: Node<unknown> | null = node;\n while (current && (!nextItemInFlattenedCollection || (current.parentKey !== nextItemInFlattenedCollection.parentKey && nextItemInFlattenedCollection.level < current.level))) {\n let indicator = renderDropIndicator({\n type: 'item',\n key: current.key,\n dropPosition: 'after'\n });\n if (isValidElement(indicator)) {\n afterIndicators.push(cloneElement(indicator, {key: `${current.key}-after`}));\n }\n current = current.parentKey != null ? collection.getItem(current.parentKey) : null;\n }\n }\n\n return afterIndicators;\n}\n\nexport const CollectionRendererContext = createContext<CollectionRenderer>(DefaultCollectionRenderer);\n\ntype PersistedKeysReturnValue = Set<Key> | null;\nexport function usePersistedKeys(focusedKey: Key | null): PersistedKeysReturnValue {\n return useMemo(() => focusedKey != null ? new Set([focusedKey]) : null, [focusedKey]);\n}\n"],"names":[],"version":3,"file":"Collection.module.js.map"}
package/dist/Tree.main.js CHANGED
@@ -222,11 +222,14 @@ function $c6576bb58bfa084b$var$TreeInner({ props: props, collection: collection,
222
222
  let target = dropTargetDelegate.getDropTargetFromPoint(x, y, isValidDropTarget);
223
223
  if ((target === null || target === void 0 ? void 0 : target.type) === 'item' && target.dropPosition === 'after') {
224
224
  let nextKey = state.collection.getKeyAfter(target.key);
225
- if (nextKey != null) target = {
226
- type: 'item',
227
- key: nextKey,
228
- dropPosition: 'before'
229
- };
225
+ if (nextKey != null) {
226
+ let beforeTarget = {
227
+ type: 'item',
228
+ key: nextKey,
229
+ dropPosition: 'before'
230
+ };
231
+ if (isValidDropTarget(beforeTarget)) return beforeTarget;
232
+ }
230
233
  }
231
234
  return target;
232
235
  }
@@ -398,6 +401,7 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
398
401
  let dropIndicator = null;
399
402
  let expandButtonRef = (0, $5SMu3$react.useRef)(null);
400
403
  let dropIndicatorRef = (0, $5SMu3$react.useRef)(null);
404
+ let activateButtonRef = (0, $5SMu3$react.useRef)(null);
401
405
  let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5SMu3$reactaria.useVisuallyHidden)();
402
406
  if (dropState && dragAndDropHooks) dropIndicator = dragAndDropHooks.useDropIndicator({
403
407
  target: {
@@ -405,7 +409,7 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
405
409
  key: item.key,
406
410
  dropPosition: 'on'
407
411
  },
408
- activateButtonRef: expandButtonRef
412
+ activateButtonRef: activateButtonRef
409
413
  }, dropState, dropIndicatorRef);
410
414
  let isDragging = dragState && dragState.isDragging(item.key);
411
415
  let isDropTarget = dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.isDropTarget;
@@ -483,22 +487,33 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
483
487
  }
484
488
  }
485
489
  });
490
+ let activateButtonId = (0, $5SMu3$reactaria.useId)();
486
491
  return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, ($parcel$interopDefault($5SMu3$react))).Fragment, null, dropIndicator && !dropIndicator.isHidden && /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
487
492
  role: "row",
488
- style: {
489
- height: 0
490
- }
493
+ "aria-level": rowProps['aria-level'],
494
+ "aria-expanded": rowProps['aria-expanded'],
495
+ "aria-label": dropIndicator.dropIndicatorProps['aria-label']
491
496
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
492
497
  role: "gridcell",
498
+ "aria-colindex": 1,
493
499
  style: {
494
- padding: 0
500
+ display: 'contents'
495
501
  }
496
502
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
497
503
  role: "button",
498
504
  ...visuallyHiddenProps,
499
505
  ...dropIndicator.dropIndicatorProps,
500
506
  ref: dropIndicatorRef
501
- }))), /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
507
+ }), rowProps['aria-expanded'] != null ? // Button to allow touch screen reader users to expand the item while dragging.
508
+ /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
509
+ role: "button",
510
+ ...visuallyHiddenProps,
511
+ id: activateButtonId,
512
+ "aria-label": expandButtonProps['aria-label'],
513
+ "aria-labelledby": `${activateButtonId} ${rowProps.id}`,
514
+ tabIndex: -1,
515
+ ref: activateButtonRef
516
+ }) : null)), /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
502
517
  ...(0, $5SMu3$reactaria.mergeProps)((0, $5SMu3$reactariautils.filterDOMProps)(props), rowProps, focusProps, hoverProps, focusWithinProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps),
503
518
  ...renderProps,
504
519
  ref: ref,
@@ -636,9 +651,9 @@ function $c6576bb58bfa084b$var$TreeDropIndicatorWrapper(props, ref) {
636
651
  ref = (0, $5SMu3$reactariautils.useObjectRef)(ref);
637
652
  let { dragAndDropHooks: dragAndDropHooks, dropState: dropState } = (0, $5SMu3$react.useContext)((0, $0c2289d253cb4544$exports.DragAndDropContext));
638
653
  let buttonRef = (0, $5SMu3$react.useRef)(null);
639
- let level = dropState && props.target.type === 'item' ? (((_dropState_collection_getItem = dropState.collection.getItem(props.target.key)) === null || _dropState_collection_getItem === void 0 ? void 0 : _dropState_collection_getItem.level) || 0) + 1 : 1;
640
654
  let { dropIndicatorProps: dropIndicatorProps, isHidden: isHidden, isDropTarget: isDropTarget } = dragAndDropHooks.useDropIndicator(props, dropState, buttonRef);
641
655
  if (isHidden) return null;
656
+ let level = dropState && props.target.type === 'item' ? (((_dropState_collection_getItem = dropState.collection.getItem(props.target.key)) === null || _dropState_collection_getItem === void 0 ? void 0 : _dropState_collection_getItem.level) || 0) + 1 : 1;
642
657
  return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement($c6576bb58bfa084b$var$TreeDropIndicatorForwardRef, {
643
658
  ...props,
644
659
  dropIndicatorProps: dropIndicatorProps,
@@ -665,6 +680,7 @@ function $c6576bb58bfa084b$var$TreeDropIndicator(props, ref) {
665
680
  return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
666
681
  ...renderProps,
667
682
  role: "row",
683
+ "aria-level": level,
668
684
  ref: ref,
669
685
  "data-drop-target": isDropTarget || undefined
670
686
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {