react-aria-components 1.8.0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/dist/Autocomplete.main.js.map +1 -1
  2. package/dist/Autocomplete.module.js.map +1 -1
  3. package/dist/Checkbox.main.js +4 -1
  4. package/dist/Checkbox.main.js.map +1 -1
  5. package/dist/Checkbox.mjs +5 -2
  6. package/dist/Checkbox.module.js +5 -2
  7. package/dist/Checkbox.module.js.map +1 -1
  8. package/dist/Collection.main.js +31 -7
  9. package/dist/Collection.main.js.map +1 -1
  10. package/dist/Collection.mjs +32 -9
  11. package/dist/Collection.module.js +32 -9
  12. package/dist/Collection.module.js.map +1 -1
  13. package/dist/ColorPicker.main.js.map +1 -1
  14. package/dist/ColorPicker.module.js.map +1 -1
  15. package/dist/ComboBox.main.js +10 -1
  16. package/dist/ComboBox.main.js.map +1 -1
  17. package/dist/ComboBox.mjs +10 -1
  18. package/dist/ComboBox.module.js +10 -1
  19. package/dist/ComboBox.module.js.map +1 -1
  20. package/dist/DatePicker.main.js +11 -2
  21. package/dist/DatePicker.main.js.map +1 -1
  22. package/dist/DatePicker.mjs +11 -2
  23. package/dist/DatePicker.module.js +11 -2
  24. package/dist/DatePicker.module.js.map +1 -1
  25. package/dist/Dialog.main.js +15 -1
  26. package/dist/Dialog.main.js.map +1 -1
  27. package/dist/Dialog.mjs +17 -3
  28. package/dist/Dialog.module.js +17 -3
  29. package/dist/Dialog.module.js.map +1 -1
  30. package/dist/DragAndDrop.main.js.map +1 -1
  31. package/dist/DragAndDrop.module.js.map +1 -1
  32. package/dist/GridList.main.js +59 -4
  33. package/dist/GridList.main.js.map +1 -1
  34. package/dist/GridList.mjs +60 -6
  35. package/dist/GridList.module.js +60 -6
  36. package/dist/GridList.module.js.map +1 -1
  37. package/dist/ListBox.main.js +61 -3
  38. package/dist/ListBox.main.js.map +1 -1
  39. package/dist/ListBox.mjs +62 -5
  40. package/dist/ListBox.module.js +62 -5
  41. package/dist/ListBox.module.js.map +1 -1
  42. package/dist/Menu.main.js.map +1 -1
  43. package/dist/Menu.module.js.map +1 -1
  44. package/dist/Popover.main.js +12 -2
  45. package/dist/Popover.main.js.map +1 -1
  46. package/dist/Popover.mjs +13 -3
  47. package/dist/Popover.module.js +13 -3
  48. package/dist/Popover.module.js.map +1 -1
  49. package/dist/RadioGroup.main.js +4 -1
  50. package/dist/RadioGroup.main.js.map +1 -1
  51. package/dist/RadioGroup.mjs +5 -2
  52. package/dist/RadioGroup.module.js +5 -2
  53. package/dist/RadioGroup.module.js.map +1 -1
  54. package/dist/Select.main.js +10 -2
  55. package/dist/Select.main.js.map +1 -1
  56. package/dist/Select.mjs +10 -2
  57. package/dist/Select.module.js +10 -2
  58. package/dist/Select.module.js.map +1 -1
  59. package/dist/Table.main.js +42 -10
  60. package/dist/Table.main.js.map +1 -1
  61. package/dist/Table.mjs +43 -11
  62. package/dist/Table.module.js +43 -11
  63. package/dist/Table.module.js.map +1 -1
  64. package/dist/TagGroup.main.js +1 -1
  65. package/dist/TagGroup.main.js.map +1 -1
  66. package/dist/TagGroup.mjs +1 -1
  67. package/dist/TagGroup.module.js +1 -1
  68. package/dist/TagGroup.module.js.map +1 -1
  69. package/dist/Tooltip.main.js.map +1 -1
  70. package/dist/Tooltip.module.js.map +1 -1
  71. package/dist/Tree.main.js +296 -18
  72. package/dist/Tree.main.js.map +1 -1
  73. package/dist/Tree.mjs +299 -21
  74. package/dist/Tree.module.js +299 -21
  75. package/dist/Tree.module.js.map +1 -1
  76. package/dist/TreeDropTargetDelegate.main.js +213 -0
  77. package/dist/TreeDropTargetDelegate.main.js.map +1 -0
  78. package/dist/TreeDropTargetDelegate.mjs +208 -0
  79. package/dist/TreeDropTargetDelegate.module.js +208 -0
  80. package/dist/TreeDropTargetDelegate.module.js.map +1 -0
  81. package/dist/Virtualizer.main.js +8 -10
  82. package/dist/Virtualizer.main.js.map +1 -1
  83. package/dist/Virtualizer.mjs +9 -11
  84. package/dist/Virtualizer.module.js +9 -11
  85. package/dist/Virtualizer.module.js.map +1 -1
  86. package/dist/import.mjs +5 -5
  87. package/dist/main.js +4 -1
  88. package/dist/main.js.map +1 -1
  89. package/dist/module.js +5 -5
  90. package/dist/module.js.map +1 -1
  91. package/dist/types.d.ts +115 -50
  92. package/dist/types.d.ts.map +1 -1
  93. package/dist/useDragAndDrop.main.js +2 -2
  94. package/dist/useDragAndDrop.main.js.map +1 -1
  95. package/dist/useDragAndDrop.mjs +2 -2
  96. package/dist/useDragAndDrop.module.js +2 -2
  97. package/dist/useDragAndDrop.module.js.map +1 -1
  98. package/package.json +32 -28
  99. package/src/Autocomplete.tsx +2 -2
  100. package/src/Checkbox.tsx +2 -2
  101. package/src/Collection.tsx +39 -5
  102. package/src/ColorPicker.tsx +2 -2
  103. package/src/ComboBox.tsx +5 -1
  104. package/src/DatePicker.tsx +7 -2
  105. package/src/Dialog.tsx +18 -4
  106. package/src/DragAndDrop.tsx +1 -1
  107. package/src/GridList.tsx +69 -7
  108. package/src/ListBox.tsx +70 -6
  109. package/src/Menu.tsx +2 -1
  110. package/src/Popover.tsx +21 -5
  111. package/src/RadioGroup.tsx +2 -2
  112. package/src/Select.tsx +13 -3
  113. package/src/Table.tsx +44 -16
  114. package/src/TagGroup.tsx +1 -1
  115. package/src/Tooltip.tsx +2 -2
  116. package/src/Tree.tsx +364 -38
  117. package/src/TreeDropTargetDelegate.ts +304 -0
  118. package/src/Virtualizer.tsx +9 -14
  119. package/src/index.ts +8 -7
  120. package/src/useDragAndDrop.tsx +2 -1
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/TagGroup.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 */\n\nimport {AriaTagGroupProps, useFocusRing, useHover, useTag, useTagGroup} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, CollectionBuilder, createLeafComponent} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, DefaultCollectionRenderer, ItemRenderProps, usePersistedKeys} from './Collection';\nimport {ContextValue, DOMProps, Provider, RenderProps, SlotProps, StyleRenderProps, useContextProps, useRenderProps, useSlot} from './utils';\nimport {filterDOMProps, mergeProps, useObjectRef} from '@react-aria/utils';\nimport {forwardRefType, HoverEvents, Key, LinkDOMProps} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps {}\n\nexport interface TagListRenderProps {\n /**\n * Whether the tag list has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the tag list is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tag list is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * State of the TagGroup.\n */\n state: ListState<unknown>\n}\n\nexport interface TagListProps<T> extends Omit<CollectionProps<T>, 'disabledKeys'>, StyleRenderProps<TagListRenderProps> {\n /** Provides content to display when there are no items in the tag list. */\n renderEmptyState?: (props: TagListRenderProps) => ReactNode\n}\n\nexport const TagGroupContext = createContext<ContextValue<TagGroupProps, HTMLDivElement>>(null);\nexport const TagListContext = createContext<ContextValue<TagListProps<any>, HTMLDivElement>>(null);\n\n/**\n * A tag group is a focusable list of labels, categories, keywords, filters, or other items, with support for keyboard navigation, selection, and removal.\n */\nexport const TagGroup = /*#__PURE__*/ (forwardRef as forwardRefType)(function TagGroup(props: TagGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TagGroupContext);\n return (\n <CollectionBuilder content={props.children}>\n {collection => <TagGroupInner props={props} forwardedRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\ninterface TagGroupInnerProps {\n props: TagGroupProps,\n forwardedRef: ForwardedRef<HTMLDivElement>,\n collection\n}\n\nfunction TagGroupInner({props, forwardedRef: ref, collection}: TagGroupInnerProps) {\n let tagListRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let state = useListState({\n ...props,\n children: undefined,\n collection\n });\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(props);\n let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k]) => [k, undefined]));\n let {\n gridProps,\n labelProps,\n descriptionProps,\n errorMessageProps\n } = useTagGroup({\n ...props,\n ...domPropOverrides,\n label\n }, state, tagListRef);\n\n return (\n <div\n {...domProps}\n ref={ref}\n slot={props.slot || undefined}\n className={props.className ?? 'react-aria-TagGroup'}\n style={props.style}>\n <Provider\n values={[\n [LabelContext, {...labelProps, elementType: 'span', ref: labelRef}],\n [TagListContext, {...gridProps, ref: tagListRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }]\n ]}>\n {props.children}\n </Provider>\n </div>\n );\n}\n\n/**\n * A tag list is a container for tags within a TagGroup.\n */\nexport const TagList = /*#__PURE__*/ (forwardRef as forwardRefType)(function TagList<T extends object>(props: TagListProps<T>, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n let state = useContext(ListStateContext);\n return state\n ? <TagListInner props={props} forwardedRef={ref} />\n : <Collection {...props} />;\n});\n\ninterface TagListInnerProps<T> {\n props: TagListProps<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction TagListInner<T extends object>({props, forwardedRef}: TagListInnerProps<T>) {\n let state = useContext(ListStateContext)!;\n let {CollectionRoot} = useContext(CollectionRendererContext);\n let [gridProps, ref] = useContextProps(props, forwardedRef, TagListContext);\n delete gridProps.items;\n delete gridProps.renderEmptyState;\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let renderValues = {\n isEmpty: state.collection.size === 0,\n isFocused,\n isFocusVisible,\n state\n };\n let renderProps = useRenderProps({\n className: props.className,\n style: props.style,\n defaultClassName: 'react-aria-TagList',\n values: renderValues\n });\n\n let persistedKeys = usePersistedKeys(state.selectionManager.focusedKey);\n\n return (\n <div\n {...mergeProps(gridProps, focusProps)}\n {...renderProps}\n ref={ref}\n data-empty={state.collection.size === 0 || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n {state.collection.size === 0 && props.renderEmptyState\n ? props.renderEmptyState(renderValues)\n : <CollectionRoot collection={state.collection} persistedKeys={persistedKeys} />}\n </div>\n );\n}\n\nexport interface TagRenderProps extends Omit<ItemRenderProps, 'allowsDragging' | 'isDragging' | 'isDropTarget'> {\n /**\n * Whether the tag group allows items to be removed.\n * @selector [data-allows-removing]\n */\n allowsRemoving: boolean\n}\n\nexport interface TagProps extends RenderProps<TagRenderProps>, LinkDOMProps, HoverEvents {\n /** A unique id for the tag. */\n id?: Key,\n /**\n * A string representation of the tags's contents, used for accessibility.\n * Required if children is not a plain text string.\n */\n textValue?: string,\n /** Whether the tag is disabled. */\n isDisabled?: boolean\n}\n\n/**\n * A Tag is an individual item within a TagList.\n */\nexport const Tag = /*#__PURE__*/ createLeafComponent('item', (props: TagProps, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<unknown>) => {\n let state = useContext(ListStateContext)!;\n let ref = useObjectRef<HTMLDivElement>(forwardedRef);\n let {focusProps, isFocusVisible} = useFocusRing({within: true});\n let {rowProps, gridCellProps, removeButtonProps, ...states} = useTag({item}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-Tag',\n values: {\n ...states,\n isFocusVisible,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <Tag> elements with non-plain text children for accessibility.');\n }\n }, [item.textValue]);\n\n return (\n <div\n ref={ref}\n {...renderProps}\n {...mergeProps(filterDOMProps(props as any), rowProps, focusProps, hoverProps)}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-allows-removing={states.allowsRemoving || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <div {...gridCellProps} style={{display: 'contents'}}>\n <Provider\n values={[\n [ButtonContext, {\n slots: {\n remove: removeButtonProps\n }\n }],\n [CollectionRendererContext, DefaultCollectionRenderer]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TagGroup.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/TagGroup.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 */\n\nimport {AriaTagGroupProps, useFocusRing, useHover, useTag, useTagGroup} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, CollectionBuilder, createLeafComponent} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, DefaultCollectionRenderer, ItemRenderProps, usePersistedKeys} from './Collection';\nimport {ContextValue, DOMProps, Provider, RenderProps, SlotProps, StyleRenderProps, useContextProps, useRenderProps, useSlot} from './utils';\nimport {filterDOMProps, mergeProps, useObjectRef} from '@react-aria/utils';\nimport {forwardRefType, HoverEvents, Key, LinkDOMProps} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps {}\n\nexport interface TagListRenderProps {\n /**\n * Whether the tag list has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the tag list is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tag list is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * State of the TagGroup.\n */\n state: ListState<unknown>\n}\n\nexport interface TagListProps<T> extends Omit<CollectionProps<T>, 'disabledKeys'>, StyleRenderProps<TagListRenderProps> {\n /** Provides content to display when there are no items in the tag list. */\n renderEmptyState?: (props: TagListRenderProps) => ReactNode\n}\n\nexport const TagGroupContext = createContext<ContextValue<TagGroupProps, HTMLDivElement>>(null);\nexport const TagListContext = createContext<ContextValue<TagListProps<any>, HTMLDivElement>>(null);\n\n/**\n * A tag group is a focusable list of labels, categories, keywords, filters, or other items, with support for keyboard navigation, selection, and removal.\n */\nexport const TagGroup = /*#__PURE__*/ (forwardRef as forwardRefType)(function TagGroup(props: TagGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TagGroupContext);\n return (\n <CollectionBuilder content={props.children}>\n {collection => <TagGroupInner props={props} forwardedRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\ninterface TagGroupInnerProps {\n props: TagGroupProps,\n forwardedRef: ForwardedRef<HTMLDivElement>,\n collection\n}\n\nfunction TagGroupInner({props, forwardedRef: ref, collection}: TagGroupInnerProps) {\n let tagListRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let state = useListState({\n ...props,\n children: undefined,\n collection\n });\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(props);\n let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k]) => [k, undefined]));\n let {\n gridProps,\n labelProps,\n descriptionProps,\n errorMessageProps\n } = useTagGroup({\n ...props,\n ...domPropOverrides,\n label\n }, state, tagListRef);\n\n return (\n <div\n {...domProps}\n ref={ref}\n slot={props.slot || undefined}\n className={props.className ?? 'react-aria-TagGroup'}\n style={props.style}>\n <Provider\n values={[\n [LabelContext, {...labelProps, elementType: 'span', ref: labelRef}],\n [TagListContext, {...gridProps, ref: tagListRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }]\n ]}>\n {props.children}\n </Provider>\n </div>\n );\n}\n\n/**\n * A tag list is a container for tags within a TagGroup.\n */\nexport const TagList = /*#__PURE__*/ (forwardRef as forwardRefType)(function TagList<T extends object>(props: TagListProps<T>, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n let state = useContext(ListStateContext);\n return state\n ? <TagListInner props={props} forwardedRef={ref} />\n : <Collection {...props} />;\n});\n\ninterface TagListInnerProps<T> {\n props: TagListProps<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction TagListInner<T extends object>({props, forwardedRef}: TagListInnerProps<T>) {\n let state = useContext(ListStateContext)!;\n let {CollectionRoot} = useContext(CollectionRendererContext);\n let [gridProps, ref] = useContextProps(props, forwardedRef, TagListContext);\n delete gridProps.items;\n delete gridProps.renderEmptyState;\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let renderValues = {\n isEmpty: state.collection.size === 0,\n isFocused,\n isFocusVisible,\n state\n };\n let renderProps = useRenderProps({\n className: props.className,\n style: props.style,\n defaultClassName: 'react-aria-TagList',\n values: renderValues\n });\n\n let persistedKeys = usePersistedKeys(state.selectionManager.focusedKey);\n\n return (\n <div\n {...mergeProps(gridProps, focusProps)}\n {...renderProps}\n ref={ref}\n data-empty={state.collection.size === 0 || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n {state.collection.size === 0 && props.renderEmptyState\n ? props.renderEmptyState(renderValues)\n : <CollectionRoot collection={state.collection} persistedKeys={persistedKeys} />}\n </div>\n );\n}\n\nexport interface TagRenderProps extends Omit<ItemRenderProps, 'allowsDragging' | 'isDragging' | 'isDropTarget'> {\n /**\n * Whether the tag group allows items to be removed.\n * @selector [data-allows-removing]\n */\n allowsRemoving: boolean\n}\n\nexport interface TagProps extends RenderProps<TagRenderProps>, LinkDOMProps, HoverEvents {\n /** A unique id for the tag. */\n id?: Key,\n /**\n * A string representation of the tags's contents, used for accessibility.\n * Required if children is not a plain text string.\n */\n textValue?: string,\n /** Whether the tag is disabled. */\n isDisabled?: boolean\n}\n\n/**\n * A Tag is an individual item within a TagList.\n */\nexport const Tag = /*#__PURE__*/ createLeafComponent('item', (props: TagProps, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<unknown>) => {\n let state = useContext(ListStateContext)!;\n let ref = useObjectRef<HTMLDivElement>(forwardedRef);\n let {focusProps, isFocusVisible} = useFocusRing({within: false});\n let {rowProps, gridCellProps, removeButtonProps, ...states} = useTag({item}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-Tag',\n values: {\n ...states,\n isFocusVisible,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <Tag> elements with non-plain text children for accessibility.');\n }\n }, [item.textValue]);\n\n return (\n <div\n ref={ref}\n {...renderProps}\n {...mergeProps(filterDOMProps(props as any), rowProps, focusProps, hoverProps)}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-allows-removing={states.allowsRemoving || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <div {...gridCellProps} style={{display: 'contents'}}>\n <Provider\n values={[\n [ButtonContext, {\n slots: {\n remove: removeButtonProps\n }\n }],\n [CollectionRendererContext, DefaultCollectionRenderer]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TagGroup.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Tooltip.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 */\n\nimport {AriaLabelingProps, FocusableElement, forwardRefType, RefObject} from '@react-types/shared';\nimport {AriaPositionProps, mergeProps, OverlayContainer, Placement, PlacementAxis, PositionProps, useOverlayPosition, useTooltip, useTooltipTrigger} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, useContextProps, useRenderProps} from './utils';\nimport {FocusableProvider} from '@react-aria/focus';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, TooltipTriggerProps, TooltipTriggerState, useTooltipTriggerState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useRef, useState} from 'react';\nimport {useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\n\nexport interface TooltipTriggerComponentProps extends TooltipTriggerProps {\n children: ReactNode\n}\n\nexport interface TooltipProps extends PositionProps, Pick<AriaPositionProps, 'arrowBoundaryOffset'>, OverlayTriggerProps, AriaLabelingProps, RenderProps<TooltipRenderProps> {\n /**\n * The ref for the element which the tooltip positions itself with respect to.\n *\n * When used within a TooltipTrigger this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the tooltip is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the tooltip is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n * @deprecated - Use a parent UNSAFE_PortalProvider to set your portal container instead.\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The placement of the tooltip with respect to the trigger.\n * @default 'top'\n */\n placement?: Placement\n}\n\nexport interface TooltipRenderProps {\n /**\n * The placement of the tooltip relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the tooltip is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the tooltip is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the tooltip.\n */\n state: TooltipTriggerState\n}\n\nexport const TooltipTriggerStateContext = createContext<TooltipTriggerState | null>(null);\nexport const TooltipContext = createContext<ContextValue<TooltipProps, HTMLDivElement>>(null);\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerComponentProps): ReactNode {\n let state = useTooltipTriggerState(props);\n let ref = useRef<FocusableElement>(null);\n let {triggerProps, tooltipProps} = useTooltipTrigger(props, state, ref);\n\n return (\n <Provider\n values={[\n [TooltipTriggerStateContext, state],\n [TooltipContext, {...tooltipProps, triggerRef: ref}]\n ]}>\n <FocusableProvider {...triggerProps} ref={ref}>\n {props.children}\n </FocusableProvider>\n </Provider>\n );\n}\n\n/**\n * A tooltip displays a description of an element on hover or focus.\n */\nexport const Tooltip = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tooltip({UNSTABLE_portalContainer, ...props}: TooltipProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TooltipContext);\n let contextState = useContext(TooltipTriggerStateContext);\n let localState = useTooltipTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n if (!state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <OverlayContainer portalContainer={UNSTABLE_portalContainer}>\n <TooltipInner {...props} tooltipRef={ref} isExiting={isExiting} />\n </OverlayContainer>\n );\n});\n\nfunction TooltipInner(props: TooltipProps & {isExiting: boolean, tooltipRef: RefObject<HTMLDivElement | null>}) {\n let state = useContext(TooltipTriggerStateContext)!;\n\n // Calculate the arrow size internally\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {overlayProps, arrowProps, placement} = useOverlayPosition({\n placement: props.placement || 'top',\n targetRef: props.triggerRef!,\n overlayRef: props.tooltipRef,\n offset: props.offset,\n crossOffset: props.crossOffset,\n isOpen: state.isOpen,\n arrowSize: arrowWidth,\n arrowBoundaryOffset: props.arrowBoundaryOffset,\n shouldFlip: props.shouldFlip,\n onClose: () => state.close(true)\n });\n\n let isEntering = useEnterAnimation(props.tooltipRef, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tooltip',\n values: {\n placement,\n isEntering,\n isExiting: props.isExiting,\n state\n }\n });\n\n props = mergeProps(props, overlayProps);\n let {tooltipProps} = useTooltip(props, state);\n\n return (\n <div\n {...tooltipProps}\n ref={props.tooltipRef}\n {...renderProps}\n style={{...overlayProps.style, ...renderProps.style}}\n data-placement={placement ?? undefined}\n data-entering={isEntering || undefined}\n data-exiting={props.isExiting || undefined}>\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Tooltip.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Tooltip.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 */\n\nimport {AriaLabelingProps, FocusableElement, forwardRefType, RefObject} from '@react-types/shared';\nimport {AriaPositionProps, mergeProps, OverlayContainer, Placement, PlacementAxis, PositionProps, useOverlayPosition, useTooltip, useTooltipTrigger} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, useContextProps, useRenderProps} from './utils';\nimport {FocusableProvider} from '@react-aria/focus';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, TooltipTriggerProps, TooltipTriggerState, useTooltipTriggerState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';\nimport {useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\n\nexport interface TooltipTriggerComponentProps extends TooltipTriggerProps {\n children: ReactNode\n}\n\nexport interface TooltipProps extends PositionProps, Pick<AriaPositionProps, 'arrowBoundaryOffset'>, OverlayTriggerProps, AriaLabelingProps, RenderProps<TooltipRenderProps> {\n /**\n * The ref for the element which the tooltip positions itself with respect to.\n *\n * When used within a TooltipTrigger this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the tooltip is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the tooltip is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n * @deprecated - Use a parent UNSAFE_PortalProvider to set your portal container instead.\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The placement of the tooltip with respect to the trigger.\n * @default 'top'\n */\n placement?: Placement\n}\n\nexport interface TooltipRenderProps {\n /**\n * The placement of the tooltip relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the tooltip is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the tooltip is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the tooltip.\n */\n state: TooltipTriggerState\n}\n\nexport const TooltipTriggerStateContext = createContext<TooltipTriggerState | null>(null);\nexport const TooltipContext = createContext<ContextValue<TooltipProps, HTMLDivElement>>(null);\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerComponentProps): JSX.Element {\n let state = useTooltipTriggerState(props);\n let ref = useRef<FocusableElement>(null);\n let {triggerProps, tooltipProps} = useTooltipTrigger(props, state, ref);\n\n return (\n <Provider\n values={[\n [TooltipTriggerStateContext, state],\n [TooltipContext, {...tooltipProps, triggerRef: ref}]\n ]}>\n <FocusableProvider {...triggerProps} ref={ref}>\n {props.children}\n </FocusableProvider>\n </Provider>\n );\n}\n\n/**\n * A tooltip displays a description of an element on hover or focus.\n */\nexport const Tooltip = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tooltip({UNSTABLE_portalContainer, ...props}: TooltipProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TooltipContext);\n let contextState = useContext(TooltipTriggerStateContext);\n let localState = useTooltipTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n if (!state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <OverlayContainer portalContainer={UNSTABLE_portalContainer}>\n <TooltipInner {...props} tooltipRef={ref} isExiting={isExiting} />\n </OverlayContainer>\n );\n});\n\nfunction TooltipInner(props: TooltipProps & {isExiting: boolean, tooltipRef: RefObject<HTMLDivElement | null>}) {\n let state = useContext(TooltipTriggerStateContext)!;\n\n // Calculate the arrow size internally\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {overlayProps, arrowProps, placement} = useOverlayPosition({\n placement: props.placement || 'top',\n targetRef: props.triggerRef!,\n overlayRef: props.tooltipRef,\n offset: props.offset,\n crossOffset: props.crossOffset,\n isOpen: state.isOpen,\n arrowSize: arrowWidth,\n arrowBoundaryOffset: props.arrowBoundaryOffset,\n shouldFlip: props.shouldFlip,\n onClose: () => state.close(true)\n });\n\n let isEntering = useEnterAnimation(props.tooltipRef, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tooltip',\n values: {\n placement,\n isEntering,\n isExiting: props.isExiting,\n state\n }\n });\n\n props = mergeProps(props, overlayProps);\n let {tooltipProps} = useTooltip(props, state);\n\n return (\n <div\n {...tooltipProps}\n ref={props.tooltipRef}\n {...renderProps}\n style={{...overlayProps.style, ...renderProps.style}}\n data-placement={placement ?? undefined}\n data-entering={isEntering || undefined}\n data-exiting={props.isExiting || undefined}>\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Tooltip.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Tooltip.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 */\n\nimport {AriaLabelingProps, FocusableElement, forwardRefType, RefObject} from '@react-types/shared';\nimport {AriaPositionProps, mergeProps, OverlayContainer, Placement, PlacementAxis, PositionProps, useOverlayPosition, useTooltip, useTooltipTrigger} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, useContextProps, useRenderProps} from './utils';\nimport {FocusableProvider} from '@react-aria/focus';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, TooltipTriggerProps, TooltipTriggerState, useTooltipTriggerState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, ReactNode, useContext, useRef, useState} from 'react';\nimport {useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\n\nexport interface TooltipTriggerComponentProps extends TooltipTriggerProps {\n children: ReactNode\n}\n\nexport interface TooltipProps extends PositionProps, Pick<AriaPositionProps, 'arrowBoundaryOffset'>, OverlayTriggerProps, AriaLabelingProps, RenderProps<TooltipRenderProps> {\n /**\n * The ref for the element which the tooltip positions itself with respect to.\n *\n * When used within a TooltipTrigger this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the tooltip is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the tooltip is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n * @deprecated - Use a parent UNSAFE_PortalProvider to set your portal container instead.\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The placement of the tooltip with respect to the trigger.\n * @default 'top'\n */\n placement?: Placement\n}\n\nexport interface TooltipRenderProps {\n /**\n * The placement of the tooltip relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the tooltip is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the tooltip is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the tooltip.\n */\n state: TooltipTriggerState\n}\n\nexport const TooltipTriggerStateContext = createContext<TooltipTriggerState | null>(null);\nexport const TooltipContext = createContext<ContextValue<TooltipProps, HTMLDivElement>>(null);\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerComponentProps): ReactNode {\n let state = useTooltipTriggerState(props);\n let ref = useRef<FocusableElement>(null);\n let {triggerProps, tooltipProps} = useTooltipTrigger(props, state, ref);\n\n return (\n <Provider\n values={[\n [TooltipTriggerStateContext, state],\n [TooltipContext, {...tooltipProps, triggerRef: ref}]\n ]}>\n <FocusableProvider {...triggerProps} ref={ref}>\n {props.children}\n </FocusableProvider>\n </Provider>\n );\n}\n\n/**\n * A tooltip displays a description of an element on hover or focus.\n */\nexport const Tooltip = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tooltip({UNSTABLE_portalContainer, ...props}: TooltipProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TooltipContext);\n let contextState = useContext(TooltipTriggerStateContext);\n let localState = useTooltipTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n if (!state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <OverlayContainer portalContainer={UNSTABLE_portalContainer}>\n <TooltipInner {...props} tooltipRef={ref} isExiting={isExiting} />\n </OverlayContainer>\n );\n});\n\nfunction TooltipInner(props: TooltipProps & {isExiting: boolean, tooltipRef: RefObject<HTMLDivElement | null>}) {\n let state = useContext(TooltipTriggerStateContext)!;\n\n // Calculate the arrow size internally\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {overlayProps, arrowProps, placement} = useOverlayPosition({\n placement: props.placement || 'top',\n targetRef: props.triggerRef!,\n overlayRef: props.tooltipRef,\n offset: props.offset,\n crossOffset: props.crossOffset,\n isOpen: state.isOpen,\n arrowSize: arrowWidth,\n arrowBoundaryOffset: props.arrowBoundaryOffset,\n shouldFlip: props.shouldFlip,\n onClose: () => state.close(true)\n });\n\n let isEntering = useEnterAnimation(props.tooltipRef, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tooltip',\n values: {\n placement,\n isEntering,\n isExiting: props.isExiting,\n state\n }\n });\n\n props = mergeProps(props, overlayProps);\n let {tooltipProps} = useTooltip(props, state);\n\n return (\n <div\n {...tooltipProps}\n ref={props.tooltipRef}\n {...renderProps}\n style={{...overlayProps.style, ...renderProps.style}}\n data-placement={placement ?? undefined}\n data-entering={isEntering || undefined}\n data-exiting={props.isExiting || undefined}>\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Tooltip.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Tooltip.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 */\n\nimport {AriaLabelingProps, FocusableElement, forwardRefType, RefObject} from '@react-types/shared';\nimport {AriaPositionProps, mergeProps, OverlayContainer, Placement, PlacementAxis, PositionProps, useOverlayPosition, useTooltip, useTooltipTrigger} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, useContextProps, useRenderProps} from './utils';\nimport {FocusableProvider} from '@react-aria/focus';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, TooltipTriggerProps, TooltipTriggerState, useTooltipTriggerState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useRef, useState} from 'react';\nimport {useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\n\nexport interface TooltipTriggerComponentProps extends TooltipTriggerProps {\n children: ReactNode\n}\n\nexport interface TooltipProps extends PositionProps, Pick<AriaPositionProps, 'arrowBoundaryOffset'>, OverlayTriggerProps, AriaLabelingProps, RenderProps<TooltipRenderProps> {\n /**\n * The ref for the element which the tooltip positions itself with respect to.\n *\n * When used within a TooltipTrigger this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the tooltip is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the tooltip is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n * @deprecated - Use a parent UNSAFE_PortalProvider to set your portal container instead.\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The placement of the tooltip with respect to the trigger.\n * @default 'top'\n */\n placement?: Placement\n}\n\nexport interface TooltipRenderProps {\n /**\n * The placement of the tooltip relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the tooltip is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the tooltip is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the tooltip.\n */\n state: TooltipTriggerState\n}\n\nexport const TooltipTriggerStateContext = createContext<TooltipTriggerState | null>(null);\nexport const TooltipContext = createContext<ContextValue<TooltipProps, HTMLDivElement>>(null);\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerComponentProps): JSX.Element {\n let state = useTooltipTriggerState(props);\n let ref = useRef<FocusableElement>(null);\n let {triggerProps, tooltipProps} = useTooltipTrigger(props, state, ref);\n\n return (\n <Provider\n values={[\n [TooltipTriggerStateContext, state],\n [TooltipContext, {...tooltipProps, triggerRef: ref}]\n ]}>\n <FocusableProvider {...triggerProps} ref={ref}>\n {props.children}\n </FocusableProvider>\n </Provider>\n );\n}\n\n/**\n * A tooltip displays a description of an element on hover or focus.\n */\nexport const Tooltip = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tooltip({UNSTABLE_portalContainer, ...props}: TooltipProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TooltipContext);\n let contextState = useContext(TooltipTriggerStateContext);\n let localState = useTooltipTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n if (!state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <OverlayContainer portalContainer={UNSTABLE_portalContainer}>\n <TooltipInner {...props} tooltipRef={ref} isExiting={isExiting} />\n </OverlayContainer>\n );\n});\n\nfunction TooltipInner(props: TooltipProps & {isExiting: boolean, tooltipRef: RefObject<HTMLDivElement | null>}) {\n let state = useContext(TooltipTriggerStateContext)!;\n\n // Calculate the arrow size internally\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {overlayProps, arrowProps, placement} = useOverlayPosition({\n placement: props.placement || 'top',\n targetRef: props.triggerRef!,\n overlayRef: props.tooltipRef,\n offset: props.offset,\n crossOffset: props.crossOffset,\n isOpen: state.isOpen,\n arrowSize: arrowWidth,\n arrowBoundaryOffset: props.arrowBoundaryOffset,\n shouldFlip: props.shouldFlip,\n onClose: () => state.close(true)\n });\n\n let isEntering = useEnterAnimation(props.tooltipRef, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tooltip',\n values: {\n placement,\n isEntering,\n isExiting: props.isExiting,\n state\n }\n });\n\n props = mergeProps(props, overlayProps);\n let {tooltipProps} = useTooltip(props, state);\n\n return (\n <div\n {...tooltipProps}\n ref={props.tooltipRef}\n {...renderProps}\n style={{...overlayProps.style, ...renderProps.style}}\n data-placement={placement ?? undefined}\n data-entering={isEntering || undefined}\n data-exiting={props.isExiting || undefined}>\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Tooltip.module.js.map"}
package/dist/Tree.main.js CHANGED
@@ -2,10 +2,12 @@ var $b856e6788a7ea5bf$exports = require("./Button.main.js");
2
2
  var $525402dfec7da5bc$exports = require("./RSPContexts.main.js");
3
3
  var $3114c2382242bdc0$exports = require("./Collection.main.js");
4
4
  var $c5ccf687772c0422$exports = require("./utils.main.js");
5
+ var $0c2289d253cb4544$exports = require("./DragAndDrop.main.js");
6
+ var $8aaf67259e0fe9ed$exports = require("./TreeDropTargetDelegate.main.js");
5
7
  var $5SMu3$reactaria = require("react-aria");
6
8
  var $5SMu3$reactariacollections = require("@react-aria/collections");
7
- var $5SMu3$reactariautils = require("@react-aria/utils");
8
9
  var $5SMu3$reactstately = require("react-stately");
10
+ var $5SMu3$reactariautils = require("@react-aria/utils");
9
11
  var $5SMu3$react = require("react");
10
12
  var $5SMu3$reactstatelyutils = require("@react-stately/utils");
11
13
 
@@ -44,6 +46,8 @@ $parcel$export(module.exports, "UNSTABLE_TreeLoadingIndicator", () => $c6576bb58
44
46
 
45
47
 
46
48
 
49
+
50
+
47
51
  class $c6576bb58bfa084b$var$TreeCollection {
48
52
  // TODO: should this collection's getters reflect the flattened structure or the original structure
49
53
  // If we respresent the flattened structure, it is easier for the keyboard nav but harder to find all the nodes
@@ -122,9 +126,36 @@ const $c6576bb58bfa084b$export$7fbedc92909ed28e = /*#__PURE__*/ (0, $5SMu3$react
122
126
  treeRef: ref
123
127
  }));
124
128
  });
129
+ const $c6576bb58bfa084b$var$EXPANSION_KEYS = {
130
+ 'expand': {
131
+ ltr: 'ArrowRight',
132
+ rtl: 'ArrowLeft'
133
+ },
134
+ 'collapse': {
135
+ ltr: 'ArrowLeft',
136
+ rtl: 'ArrowRight'
137
+ }
138
+ };
125
139
  function $c6576bb58bfa084b$var$TreeInner({ props: props, collection: collection, treeRef: ref }) {
140
+ const { dragAndDropHooks: dragAndDropHooks } = props;
141
+ let { direction: direction } = (0, $5SMu3$reactaria.useLocale)();
142
+ let collator = (0, $5SMu3$reactaria.useCollator)({
143
+ usage: 'search',
144
+ sensitivity: 'base'
145
+ });
146
+ let hasDragHooks = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
147
+ let hasDropHooks = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
148
+ let dragHooksProvided = (0, $5SMu3$react.useRef)(hasDragHooks);
149
+ let dropHooksProvided = (0, $5SMu3$react.useRef)(hasDropHooks);
150
+ (0, $5SMu3$react.useEffect)(()=>{
151
+ if (dragHooksProvided.current !== hasDragHooks) console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
152
+ if (dropHooksProvided.current !== hasDropHooks) console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
153
+ }, [
154
+ hasDragHooks,
155
+ hasDropHooks
156
+ ]);
126
157
  let { selectionMode: selectionMode = 'none', expandedKeys: propExpandedKeys, defaultExpandedKeys: propDefaultExpandedKeys, onExpandedChange: onExpandedChange, disabledBehavior: disabledBehavior = 'all' } = props;
127
- let { CollectionRoot: CollectionRoot, isVirtualized: isVirtualized, layoutDelegate: layoutDelegate } = (0, $5SMu3$react.useContext)((0, $3114c2382242bdc0$exports.CollectionRendererContext));
158
+ let { CollectionRoot: CollectionRoot, isVirtualized: isVirtualized, layoutDelegate: layoutDelegate, dropTargetDelegate: ctxDropTargetDelegate } = (0, $5SMu3$react.useContext)((0, $3114c2382242bdc0$exports.CollectionRendererContext));
128
159
  // Kinda annoying that we have to replicate this code here as well as in useTreeState, but don't want to add
129
160
  // flattenCollection stuff to useTreeState. Think about this later
130
161
  let [expandedKeys, setExpandedKeys] = (0, $5SMu3$reactstatelyutils.useControlledState)(propExpandedKeys ? $c6576bb58bfa084b$var$convertExpanded(propExpandedKeys) : undefined, propDefaultExpandedKeys ? $c6576bb58bfa084b$var$convertExpanded(propDefaultExpandedKeys) : new Set(), onExpandedChange);
@@ -151,11 +182,96 @@ function $c6576bb58bfa084b$var$TreeInner({ props: props, collection: collection,
151
182
  isVirtualized: isVirtualized,
152
183
  layoutDelegate: layoutDelegate
153
184
  }, state, ref);
185
+ let dragState = undefined;
186
+ let dropState = undefined;
187
+ let droppableCollection = undefined;
188
+ let isRootDropTarget = false;
189
+ let dragPreview = null;
190
+ let preview = (0, $5SMu3$react.useRef)(null);
191
+ if (hasDragHooks && dragAndDropHooks) {
192
+ dragState = dragAndDropHooks.useDraggableCollectionState({
193
+ collection: state.collection,
194
+ selectionManager: state.selectionManager,
195
+ preview: dragAndDropHooks.renderDragPreview ? preview : undefined
196
+ });
197
+ dragAndDropHooks.useDraggableCollection({}, dragState, ref);
198
+ let DragPreview = dragAndDropHooks.DragPreview;
199
+ dragPreview = dragAndDropHooks.renderDragPreview ? /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement(DragPreview, {
200
+ ref: preview
201
+ }, dragAndDropHooks.renderDragPreview) : null;
202
+ }
203
+ let [treeDropTargetDelegate] = (0, $5SMu3$react.useState)(()=>new (0, $8aaf67259e0fe9ed$exports.TreeDropTargetDelegate)());
204
+ if (hasDropHooks && dragAndDropHooks) {
205
+ dropState = dragAndDropHooks.useDroppableCollectionState({
206
+ collection: state.collection,
207
+ selectionManager: state.selectionManager
208
+ });
209
+ let dropTargetDelegate = dragAndDropHooks.dropTargetDelegate || ctxDropTargetDelegate || new dragAndDropHooks.ListDropTargetDelegate(state.collection, ref, {
210
+ direction: direction
211
+ });
212
+ treeDropTargetDelegate.setup(dropTargetDelegate, state, direction);
213
+ let keyboardDelegate = new (0, $5SMu3$reactaria.ListKeyboardDelegate)({
214
+ collection: state.collection,
215
+ collator: collator,
216
+ ref: ref,
217
+ disabledKeys: state.selectionManager.disabledKeys,
218
+ disabledBehavior: state.selectionManager.disabledBehavior,
219
+ direction: direction,
220
+ layoutDelegate: layoutDelegate
221
+ });
222
+ droppableCollection = dragAndDropHooks.useDroppableCollection({
223
+ keyboardDelegate: keyboardDelegate,
224
+ dropTargetDelegate: treeDropTargetDelegate,
225
+ onDropActivate: (e)=>{
226
+ // Expand collapsed item when dragging over. For keyboard, allow collapsing.
227
+ if (e.target.type === 'item') {
228
+ var _dragAndDropHooks_isVirtualDragging;
229
+ let key = e.target.key;
230
+ let item = state.collection.getItem(key);
231
+ let isExpanded = expandedKeys !== 'all' && expandedKeys.has(key);
232
+ if (item && item.hasChildNodes && (!isExpanded || (dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : (_dragAndDropHooks_isVirtualDragging = dragAndDropHooks.isVirtualDragging) === null || _dragAndDropHooks_isVirtualDragging === void 0 ? void 0 : _dragAndDropHooks_isVirtualDragging.call(dragAndDropHooks)))) state.toggleKey(key);
233
+ }
234
+ },
235
+ onKeyDown: (e)=>{
236
+ let target = dropState === null || dropState === void 0 ? void 0 : dropState.target;
237
+ if (target && target.type === 'item' && target.dropPosition === 'on') {
238
+ let item = state.collection.getItem(target.key);
239
+ if (e.key === $c6576bb58bfa084b$var$EXPANSION_KEYS['expand'][direction] && (item === null || item === void 0 ? void 0 : item.hasChildNodes) && !state.expandedKeys.has(target.key)) state.toggleKey(target.key);
240
+ else if (e.key === $c6576bb58bfa084b$var$EXPANSION_KEYS['collapse'][direction] && (item === null || item === void 0 ? void 0 : item.hasChildNodes) && state.expandedKeys.has(target.key)) state.toggleKey(target.key);
241
+ }
242
+ }
243
+ }, dropState, ref);
244
+ // Prevent dropping items onto themselves or their descendants
245
+ let originalGetDropOperation = dropState.getDropOperation;
246
+ dropState.getDropOperation = (options)=>{
247
+ let { target: target, isInternal: isInternal } = options;
248
+ var _dragState_draggingKeys;
249
+ let currentDraggingKeys = (_dragState_draggingKeys = dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys) !== null && _dragState_draggingKeys !== void 0 ? _dragState_draggingKeys : new Set();
250
+ if (isInternal && target.type === 'item' && currentDraggingKeys.size > 0) {
251
+ if (currentDraggingKeys.has(target.key) && target.dropPosition === 'on') return 'cancel';
252
+ let currentKey = target.key;
253
+ while(currentKey != null){
254
+ let item = state.collection.getItem(currentKey);
255
+ let parentKey = item === null || item === void 0 ? void 0 : item.parentKey;
256
+ if (parentKey != null && currentDraggingKeys.has(parentKey)) return 'cancel';
257
+ currentKey = parentKey !== null && parentKey !== void 0 ? parentKey : null;
258
+ }
259
+ }
260
+ return originalGetDropOperation(options);
261
+ };
262
+ isRootDropTarget = dropState.isDropTarget({
263
+ type: 'root'
264
+ });
265
+ }
266
+ let isTreeDraggable = !!(hasDragHooks && !(dragState === null || dragState === void 0 ? void 0 : dragState.isDisabled));
154
267
  let { focusProps: focusProps, isFocused: isFocused, isFocusVisible: isFocusVisible } = (0, $5SMu3$reactaria.useFocusRing)();
155
268
  let renderValues = {
156
269
  isEmpty: state.collection.size === 0,
157
270
  isFocused: isFocused,
158
271
  isFocusVisible: isFocusVisible,
272
+ isDropTarget: isRootDropTarget,
273
+ selectionMode: state.selectionManager.selectionMode,
274
+ allowsDragging: !!isTreeDraggable,
159
275
  state: state
160
276
  };
161
277
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
@@ -189,28 +305,46 @@ function $c6576bb58bfa084b$var$TreeInner({ props: props, collection: collection,
189
305
  }
190
306
  }, content));
191
307
  }
192
- return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, $5SMu3$reactaria.FocusScope), null, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
308
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, ($parcel$interopDefault($5SMu3$react))).Fragment, null, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, $5SMu3$reactaria.FocusScope), null, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
193
309
  ...(0, $5SMu3$reactariautils.filterDOMProps)(props),
194
310
  ...renderProps,
195
- ...(0, $5SMu3$reactaria.mergeProps)(gridProps, focusProps),
311
+ ...(0, $5SMu3$reactaria.mergeProps)(gridProps, focusProps, droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps),
196
312
  ref: ref,
197
313
  slot: props.slot || undefined,
198
314
  onScroll: props.onScroll,
199
315
  "data-empty": state.collection.size === 0 || undefined,
200
316
  "data-focused": isFocused || undefined,
201
- "data-focus-visible": isFocusVisible || undefined
317
+ "data-drop-target": isRootDropTarget || undefined,
318
+ "data-focus-visible": isFocusVisible || undefined,
319
+ "data-selection-mode": state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode,
320
+ "data-allows-dragging": !!isTreeDraggable || undefined
202
321
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, $c5ccf687772c0422$exports.Provider), {
203
322
  values: [
204
323
  [
205
324
  $c6576bb58bfa084b$export$8953bccafd7bce87,
206
325
  state
326
+ ],
327
+ [
328
+ (0, $0c2289d253cb4544$exports.DragAndDropContext),
329
+ {
330
+ dragAndDropHooks: dragAndDropHooks,
331
+ dragState: dragState,
332
+ dropState: dropState
333
+ }
334
+ ],
335
+ [
336
+ (0, $0c2289d253cb4544$exports.DropIndicatorContext),
337
+ {
338
+ render: $c6576bb58bfa084b$var$TreeDropIndicatorWrapper
339
+ }
207
340
  ]
208
341
  ]
209
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement(CollectionRoot, {
342
+ }, hasDropHooks && /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement($c6576bb58bfa084b$var$RootDropIndicator, null), /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement(CollectionRoot, {
210
343
  collection: state.collection,
211
- persistedKeys: (0, $3114c2382242bdc0$exports.usePersistedKeys)(state.selectionManager.focusedKey),
212
- scrollRef: ref
213
- })), emptyState));
344
+ persistedKeys: (0, $0c2289d253cb4544$exports.useDndPersistedKeys)(state.selectionManager, dragAndDropHooks, dropState),
345
+ scrollRef: ref,
346
+ renderDropIndicator: (0, $0c2289d253cb4544$exports.useRenderDropIndicator)(dragAndDropHooks, dropState)
347
+ })), emptyState)), dragPreview);
214
348
  }
215
349
  const $c6576bb58bfa084b$export$4b687e3f663d618c = /*#__PURE__*/ (0, $5SMu3$reactariacollections.createLeafComponent)('content', function TreeItemContent(props) {
216
350
  let values = (0, $5SMu3$react.useContext)($c6576bb58bfa084b$export$36b5dda0d9bc8f78);
@@ -227,10 +361,12 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
227
361
  var _this;
228
362
  let state = (0, $5SMu3$react.useContext)($c6576bb58bfa084b$export$8953bccafd7bce87);
229
363
  ref = (0, $5SMu3$reactariautils.useObjectRef)(ref);
364
+ let { dragAndDropHooks: dragAndDropHooks, dragState: dragState, dropState: dropState } = (0, $5SMu3$react.useContext)((0, $0c2289d253cb4544$exports.DragAndDropContext));
230
365
  // TODO: remove this when we support description in tree row
231
366
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
232
367
  let { rowProps: rowProps, gridCellProps: gridCellProps, expandButtonProps: expandButtonProps, descriptionProps: descriptionProps, ...states } = (0, $5SMu3$reactaria.useTreeItem)({
233
- node: item
368
+ node: item,
369
+ shouldSelectOnPressUp: !!dragState
234
370
  }, state, ref);
235
371
  let isExpanded = rowProps['aria-expanded'] === true;
236
372
  let hasChildItems = props.hasChildItems || ((_this = [
@@ -250,6 +386,26 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
250
386
  let { checkboxProps: checkboxProps } = (0, $5SMu3$reactaria.useGridListSelectionCheckbox)({
251
387
  key: item.key
252
388
  }, state);
389
+ let draggableItem = null;
390
+ if (dragState && dragAndDropHooks) draggableItem = dragAndDropHooks.useDraggableItem({
391
+ key: item.key,
392
+ hasDragButton: true
393
+ }, dragState);
394
+ let dropIndicator = null;
395
+ let expandButtonRef = (0, $5SMu3$react.useRef)(null);
396
+ let dropIndicatorRef = (0, $5SMu3$react.useRef)(null);
397
+ let activateButtonRef = (0, $5SMu3$react.useRef)(null);
398
+ let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5SMu3$reactaria.useVisuallyHidden)();
399
+ if (dropState && dragAndDropHooks) dropIndicator = dragAndDropHooks.useDropIndicator({
400
+ target: {
401
+ type: 'item',
402
+ key: item.key,
403
+ dropPosition: 'on'
404
+ },
405
+ activateButtonRef: activateButtonRef
406
+ }, dropState, dropIndicatorRef);
407
+ let isDragging = dragState && dragState.isDragging(item.key);
408
+ let isDropTarget = dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.isDropTarget;
253
409
  let selectionMode = state.selectionManager.selectionMode;
254
410
  let selectionBehavior = state.selectionManager.selectionBehavior;
255
411
  let renderPropValues = (0, ($parcel$interopDefault($5SMu3$react))).useMemo(()=>({
@@ -263,19 +419,25 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
263
419
  selectionBehavior: selectionBehavior,
264
420
  isFocusVisibleWithin: isFocusVisibleWithin,
265
421
  state: state,
266
- id: item.key
422
+ id: item.key,
423
+ allowsDragging: !!dragState,
424
+ isDragging: isDragging,
425
+ isDropTarget: isDropTarget
267
426
  }), [
268
427
  states,
269
428
  isHovered,
270
429
  isFocusVisible,
271
- selectionMode,
272
- selectionBehavior,
273
430
  isExpanded,
274
431
  hasChildItems,
275
432
  level,
276
433
  isFocusVisibleWithin,
277
434
  state,
278
- item.key
435
+ item.key,
436
+ dragState,
437
+ isDragging,
438
+ isDropTarget,
439
+ selectionBehavior,
440
+ selectionMode
279
441
  ]);
280
442
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
281
443
  ...props,
@@ -293,11 +455,15 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
293
455
  }, [
294
456
  item.textValue
295
457
  ]);
296
- let expandButtonRef = (0, $5SMu3$react.useRef)(null);
297
458
  (0, $5SMu3$react.useEffect)(()=>{
298
459
  if (hasChildItems && !expandButtonRef.current && process.env.NODE_ENV !== 'production') console.warn('Expandable tree items must contain a expand button so screen reader users can expand/collapse the item.');
299
460
  // eslint-disable-next-line
300
461
  }, []);
462
+ let dragButtonRef = (0, $5SMu3$react.useRef)(null);
463
+ (0, $5SMu3$react.useEffect)(()=>{
464
+ if (dragState && !dragButtonRef.current && process.env.NODE_ENV !== 'production') console.warn('Draggable items in a Tree must contain a <Button slot="drag"> element so that keyboard and screen reader users can drag them.');
465
+ // eslint-disable-next-line
466
+ }, []);
301
467
  let children = (0, $5SMu3$reactariacollections.useCachedChildren)({
302
468
  items: state.collection.getChildren(item.key),
303
469
  children: (item)=>{
@@ -314,8 +480,34 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
314
480
  }
315
481
  }
316
482
  });
317
- return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement((0, ($parcel$interopDefault($5SMu3$react))).Fragment, null, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
318
- ...(0, $5SMu3$reactaria.mergeProps)((0, $5SMu3$reactariautils.filterDOMProps)(props), rowProps, focusProps, hoverProps, focusWithinProps),
483
+ let activateButtonId = (0, $5SMu3$reactaria.useId)();
484
+ 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", {
485
+ role: "row",
486
+ "aria-level": rowProps['aria-level'],
487
+ "aria-expanded": rowProps['aria-expanded'],
488
+ "aria-label": dropIndicator.dropIndicatorProps['aria-label']
489
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
490
+ role: "gridcell",
491
+ "aria-colindex": 1,
492
+ style: {
493
+ display: 'contents'
494
+ }
495
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
496
+ role: "button",
497
+ ...visuallyHiddenProps,
498
+ ...dropIndicator.dropIndicatorProps,
499
+ ref: dropIndicatorRef
500
+ }), rowProps['aria-expanded'] != null ? // Button to allow touch screen reader users to expand the item while dragging.
501
+ /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
502
+ role: "button",
503
+ ...visuallyHiddenProps,
504
+ id: activateButtonId,
505
+ "aria-label": expandButtonProps['aria-label'],
506
+ "aria-labelledby": `${activateButtonId} ${rowProps.id}`,
507
+ tabIndex: -1,
508
+ ref: activateButtonRef
509
+ }) : null)), /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
510
+ ...(0, $5SMu3$reactaria.mergeProps)((0, $5SMu3$reactariautils.filterDOMProps)(props), rowProps, focusProps, hoverProps, focusWithinProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps),
319
511
  ...renderProps,
320
512
  ref: ref,
321
513
  // TODO: missing selectionBehavior, hasAction and allowsSelection data attribute equivalents (available in renderProps). Do we want those?
@@ -328,7 +520,10 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
328
520
  "data-focused": states.isFocused || undefined,
329
521
  "data-focus-visible": isFocusVisible || undefined,
330
522
  "data-pressed": states.isPressed || undefined,
331
- "data-selection-mode": state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode
523
+ "data-selection-mode": state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode,
524
+ "data-allows-dragging": !!dragState || undefined,
525
+ "data-dragging": isDragging || undefined,
526
+ "data-drop-target": isDropTarget || undefined
332
527
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
333
528
  ...gridCellProps,
334
529
  style: {
@@ -354,6 +549,13 @@ const $c6576bb58bfa084b$export$53d36ab85dc89436 = /*#__PURE__*/ (0, $5SMu3$react
354
549
  chevron: {
355
550
  ...expandButtonProps,
356
551
  ref: expandButtonRef
552
+ },
553
+ drag: {
554
+ ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
555
+ ref: dragButtonRef,
556
+ style: {
557
+ pointerEvents: 'none'
558
+ }
357
559
  }
358
560
  }
359
561
  }
@@ -437,6 +639,82 @@ function $c6576bb58bfa084b$var$flattenTree(collection, opts) {
437
639
  keyMap: keyMap
438
640
  };
439
641
  }
642
+ function $c6576bb58bfa084b$var$TreeDropIndicatorWrapper(props, ref) {
643
+ var _dropState_collection_getItem;
644
+ ref = (0, $5SMu3$reactariautils.useObjectRef)(ref);
645
+ let { dragAndDropHooks: dragAndDropHooks, dropState: dropState } = (0, $5SMu3$react.useContext)((0, $0c2289d253cb4544$exports.DragAndDropContext));
646
+ let buttonRef = (0, $5SMu3$react.useRef)(null);
647
+ let { dropIndicatorProps: dropIndicatorProps, isHidden: isHidden, isDropTarget: isDropTarget } = dragAndDropHooks.useDropIndicator(props, dropState, buttonRef);
648
+ if (isHidden) return null;
649
+ 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;
650
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement($c6576bb58bfa084b$var$TreeDropIndicatorForwardRef, {
651
+ ...props,
652
+ dropIndicatorProps: dropIndicatorProps,
653
+ isDropTarget: isDropTarget,
654
+ ref: ref,
655
+ buttonRef: buttonRef,
656
+ level: level
657
+ });
658
+ }
659
+ function $c6576bb58bfa084b$var$TreeDropIndicator(props, ref) {
660
+ let { dropIndicatorProps: dropIndicatorProps, isDropTarget: isDropTarget, buttonRef: buttonRef, level: level, ...otherProps } = props;
661
+ let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5SMu3$reactaria.useVisuallyHidden)();
662
+ let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
663
+ ...otherProps,
664
+ defaultClassName: 'react-aria-DropIndicator',
665
+ defaultStyle: {
666
+ position: 'relative',
667
+ // @ts-ignore
668
+ '--tree-item-level': level
669
+ },
670
+ values: {
671
+ isDropTarget: isDropTarget
672
+ }
673
+ });
674
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
675
+ ...renderProps,
676
+ role: "row",
677
+ "aria-level": level,
678
+ ref: ref,
679
+ "data-drop-target": isDropTarget || undefined
680
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
681
+ role: "gridcell"
682
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
683
+ ...visuallyHiddenProps,
684
+ role: "button",
685
+ ...dropIndicatorProps,
686
+ ref: buttonRef
687
+ }), renderProps.children));
688
+ }
689
+ const $c6576bb58bfa084b$var$TreeDropIndicatorForwardRef = /*#__PURE__*/ (0, $5SMu3$react.forwardRef)($c6576bb58bfa084b$var$TreeDropIndicator);
690
+ function $c6576bb58bfa084b$var$RootDropIndicator() {
691
+ let { dragAndDropHooks: dragAndDropHooks, dropState: dropState } = (0, $5SMu3$react.useContext)((0, $0c2289d253cb4544$exports.DragAndDropContext));
692
+ let ref = (0, $5SMu3$react.useRef)(null);
693
+ let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator({
694
+ target: {
695
+ type: 'root'
696
+ }
697
+ }, dropState, ref);
698
+ let isDropTarget = dropState.isDropTarget({
699
+ type: 'root'
700
+ });
701
+ let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5SMu3$reactaria.useVisuallyHidden)();
702
+ if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
703
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
704
+ role: "row",
705
+ "aria-hidden": dropIndicatorProps['aria-hidden'],
706
+ style: {
707
+ position: 'absolute'
708
+ }
709
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
710
+ role: "gridcell"
711
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($5SMu3$react))).createElement("div", {
712
+ role: "button",
713
+ ...visuallyHiddenProps,
714
+ ...dropIndicatorProps,
715
+ ref: ref
716
+ })));
717
+ }
440
718
 
441
719
 
442
720
  //# sourceMappingURL=Tree.main.js.map