react-aria-components 1.12.2 → 1.13.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 (162) hide show
  1. package/dist/Autocomplete.main.js +3 -3
  2. package/dist/Autocomplete.main.js.map +1 -1
  3. package/dist/Autocomplete.mjs +3 -3
  4. package/dist/Autocomplete.module.js +3 -3
  5. package/dist/Autocomplete.module.js.map +1 -1
  6. package/dist/Button.main.js +5 -11
  7. package/dist/Button.main.js.map +1 -1
  8. package/dist/Button.mjs +5 -11
  9. package/dist/Button.module.js +5 -11
  10. package/dist/Button.module.js.map +1 -1
  11. package/dist/DateField.main.js +12 -8
  12. package/dist/DateField.main.js.map +1 -1
  13. package/dist/DateField.mjs +12 -8
  14. package/dist/DateField.module.js +12 -8
  15. package/dist/DateField.module.js.map +1 -1
  16. package/dist/DatePicker.main.js +6 -2
  17. package/dist/DatePicker.main.js.map +1 -1
  18. package/dist/DatePicker.mjs +6 -2
  19. package/dist/DatePicker.module.js +6 -2
  20. package/dist/DatePicker.module.js.map +1 -1
  21. package/dist/GridList.main.js +24 -21
  22. package/dist/GridList.main.js.map +1 -1
  23. package/dist/GridList.mjs +25 -23
  24. package/dist/GridList.module.js +25 -23
  25. package/dist/GridList.module.js.map +1 -1
  26. package/dist/Group.main.js +3 -2
  27. package/dist/Group.main.js.map +1 -1
  28. package/dist/Group.mjs +3 -2
  29. package/dist/Group.module.js +3 -2
  30. package/dist/Group.module.js.map +1 -1
  31. package/dist/Input.main.js.map +1 -1
  32. package/dist/Input.module.js.map +1 -1
  33. package/dist/ListBox.main.js +14 -4
  34. package/dist/ListBox.main.js.map +1 -1
  35. package/dist/ListBox.mjs +14 -4
  36. package/dist/ListBox.module.js +14 -4
  37. package/dist/ListBox.module.js.map +1 -1
  38. package/dist/Menu.main.js +16 -6
  39. package/dist/Menu.main.js.map +1 -1
  40. package/dist/Menu.mjs +16 -6
  41. package/dist/Menu.module.js +16 -6
  42. package/dist/Menu.module.js.map +1 -1
  43. package/dist/Modal.main.js +9 -1
  44. package/dist/Modal.main.js.map +1 -1
  45. package/dist/Modal.mjs +10 -2
  46. package/dist/Modal.module.js +10 -2
  47. package/dist/Modal.module.js.map +1 -1
  48. package/dist/NumberField.main.js +2 -1
  49. package/dist/NumberField.main.js.map +1 -1
  50. package/dist/NumberField.mjs +2 -1
  51. package/dist/NumberField.module.js +2 -1
  52. package/dist/NumberField.module.js.map +1 -1
  53. package/dist/ProgressBar.main.js.map +1 -1
  54. package/dist/ProgressBar.module.js.map +1 -1
  55. package/dist/RSPContexts.main.js +4 -0
  56. package/dist/RSPContexts.main.js.map +1 -1
  57. package/dist/RSPContexts.mjs +3 -1
  58. package/dist/RSPContexts.module.js +3 -1
  59. package/dist/RSPContexts.module.js.map +1 -1
  60. package/dist/RadioGroup.main.js +10 -2
  61. package/dist/RadioGroup.main.js.map +1 -1
  62. package/dist/RadioGroup.mjs +10 -2
  63. package/dist/RadioGroup.module.js +10 -2
  64. package/dist/RadioGroup.module.js.map +1 -1
  65. package/dist/SearchField.main.js +2 -2
  66. package/dist/SearchField.main.js.map +1 -1
  67. package/dist/SearchField.mjs +2 -2
  68. package/dist/SearchField.module.js +2 -2
  69. package/dist/SearchField.module.js.map +1 -1
  70. package/dist/Select.main.js +62 -22
  71. package/dist/Select.main.js.map +1 -1
  72. package/dist/Select.mjs +65 -25
  73. package/dist/Select.module.js +65 -25
  74. package/dist/Select.module.js.map +1 -1
  75. package/dist/SelectionIndicator.main.js +45 -0
  76. package/dist/SelectionIndicator.main.js.map +1 -0
  77. package/dist/SelectionIndicator.mjs +35 -0
  78. package/dist/SelectionIndicator.module.js +35 -0
  79. package/dist/SelectionIndicator.module.js.map +1 -0
  80. package/dist/SharedElementTransition.main.js +139 -0
  81. package/dist/SharedElementTransition.main.js.map +1 -0
  82. package/dist/SharedElementTransition.mjs +129 -0
  83. package/dist/SharedElementTransition.module.js +129 -0
  84. package/dist/SharedElementTransition.module.js.map +1 -0
  85. package/dist/Table.main.js +16 -11
  86. package/dist/Table.main.js.map +1 -1
  87. package/dist/Table.mjs +17 -12
  88. package/dist/Table.module.js +17 -12
  89. package/dist/Table.module.js.map +1 -1
  90. package/dist/Tabs.main.js +11 -3
  91. package/dist/Tabs.main.js.map +1 -1
  92. package/dist/Tabs.mjs +11 -3
  93. package/dist/Tabs.module.js +11 -3
  94. package/dist/Tabs.module.js.map +1 -1
  95. package/dist/TagGroup.main.js +28 -16
  96. package/dist/TagGroup.main.js.map +1 -1
  97. package/dist/TagGroup.mjs +28 -16
  98. package/dist/TagGroup.module.js +28 -16
  99. package/dist/TagGroup.module.js.map +1 -1
  100. package/dist/TextField.main.js +2 -2
  101. package/dist/TextField.main.js.map +1 -1
  102. package/dist/TextField.mjs +2 -2
  103. package/dist/TextField.module.js +2 -2
  104. package/dist/TextField.module.js.map +1 -1
  105. package/dist/ToggleButton.main.js +7 -1
  106. package/dist/ToggleButton.main.js.map +1 -1
  107. package/dist/ToggleButton.mjs +7 -1
  108. package/dist/ToggleButton.module.js +7 -1
  109. package/dist/ToggleButton.module.js.map +1 -1
  110. package/dist/ToggleButtonGroup.main.js +3 -1
  111. package/dist/ToggleButtonGroup.main.js.map +1 -1
  112. package/dist/ToggleButtonGroup.mjs +3 -1
  113. package/dist/ToggleButtonGroup.module.js +3 -1
  114. package/dist/ToggleButtonGroup.module.js.map +1 -1
  115. package/dist/Tree.main.js +16 -4
  116. package/dist/Tree.main.js.map +1 -1
  117. package/dist/Tree.mjs +16 -4
  118. package/dist/Tree.module.js +16 -4
  119. package/dist/Tree.module.js.map +1 -1
  120. package/dist/import.mjs +10 -4
  121. package/dist/main.js +18 -3
  122. package/dist/main.js.map +1 -1
  123. package/dist/module.js +10 -4
  124. package/dist/module.js.map +1 -1
  125. package/dist/types.d.ts +99 -24
  126. package/dist/types.d.ts.map +1 -1
  127. package/dist/utils.main.js.map +1 -1
  128. package/dist/utils.module.js.map +1 -1
  129. package/package.json +23 -23
  130. package/src/Autocomplete.tsx +1 -1
  131. package/src/Button.tsx +9 -11
  132. package/src/DateField.tsx +21 -12
  133. package/src/DatePicker.tsx +11 -2
  134. package/src/GridList.tsx +32 -33
  135. package/src/Group.tsx +5 -2
  136. package/src/Input.tsx +7 -1
  137. package/src/ListBox.tsx +12 -7
  138. package/src/Menu.tsx +11 -6
  139. package/src/Modal.tsx +11 -2
  140. package/src/NumberField.tsx +1 -1
  141. package/src/ProgressBar.tsx +1 -1
  142. package/src/RSPContexts.ts +19 -0
  143. package/src/RadioGroup.tsx +8 -2
  144. package/src/SearchField.tsx +1 -1
  145. package/src/Select.tsx +75 -34
  146. package/src/SelectionIndicator.tsx +40 -0
  147. package/src/SharedElementTransition.tsx +185 -0
  148. package/src/Table.tsx +17 -16
  149. package/src/Tabs.tsx +8 -2
  150. package/src/TagGroup.tsx +31 -24
  151. package/src/TextField.tsx +1 -1
  152. package/src/ToggleButton.tsx +6 -1
  153. package/src/ToggleButtonGroup.tsx +4 -1
  154. package/src/Tree.tsx +16 -9
  155. package/src/index.ts +10 -3
  156. package/src/utils.tsx +1 -1
  157. package/dist/context.main.js +0 -25
  158. package/dist/context.main.js.map +0 -1
  159. package/dist/context.mjs +0 -19
  160. package/dist/context.module.js +0 -19
  161. package/dist/context.module.js.map +0 -1
  162. package/src/context.tsx +0 -34
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Tabs.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, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {AriaTabListProps, AriaTabPanelProps, mergeProps, Orientation, useFocusRing, useHover, useTab, useTabList, useTabPanel} from 'react-aria';\nimport {Collection, CollectionBuilder, CollectionNode, createHideableComponent, createLeafComponent} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, DefaultCollectionRenderer, usePersistedKeys} from './Collection';\nimport {ContextValue, Provider, RenderProps, SlotProps, StyleRenderProps, useContextProps, useRenderProps, useSlottedContext} from './utils';\nimport {filterDOMProps, inertValue, useObjectRef} from '@react-aria/utils';\nimport {Collection as ICollection, Node, TabListState, useTabListState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, useContext, useMemo} from 'react';\n\nexport interface TabsProps extends Omit<AriaTabListProps<any>, 'items' | 'children'>, RenderProps<TabsRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport interface TabsRenderProps {\n /**\n * The orientation of the tabs.\n * @selector [data-orientation=\"horizontal | vertical\"]\n */\n orientation: Orientation\n}\n\nexport interface TabListProps<T> extends StyleRenderProps<TabListRenderProps>, AriaLabelingProps, Omit<CollectionProps<T>, 'disabledKeys'>, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport interface TabListRenderProps {\n /**\n * The orientation of the tab list.\n * @selector [data-orientation=\"horizontal | vertical\"]\n */\n orientation: Orientation,\n /**\n * State of the tab list.\n */\n state: TabListState<unknown>\n}\n\nexport interface TabProps extends RenderProps<TabRenderProps>, AriaLabelingProps, LinkDOMProps, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /** The unique id of the tab. */\n id?: Key,\n /** Whether the tab is disabled. */\n isDisabled?: boolean\n}\n\nexport interface TabRenderProps {\n /**\n * Whether the tab is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the tab is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the tab is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the tab is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tab is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the tab is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean\n}\n\nexport interface TabPanelProps extends AriaTabPanelProps, RenderProps<TabPanelRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * Whether to mount the tab panel in the DOM even when it is not currently selected.\n * Inactive tab panels are inert and cannot be interacted with. They must be styled appropriately so this is clear to the user visually.\n * @default false\n */\n shouldForceMount?: boolean\n}\n\nexport interface TabPanelRenderProps {\n /**\n * Whether the tab panel is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tab panel is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the tab panel is currently non-interactive. This occurs when the\n * `shouldForceMount` prop is true, and the corresponding tab is not selected.\n * @selector [data-inert]\n */\n isInert: boolean,\n /**\n * State of the tab list.\n */\n state: TabListState<unknown>\n}\n\nexport const TabsContext = createContext<ContextValue<TabsProps, HTMLDivElement>>(null);\nexport const TabListStateContext = createContext<TabListState<object> | null>(null);\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport const Tabs = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tabs(props: TabsProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TabsContext);\n let {children, orientation = 'horizontal'} = props;\n children = useMemo(() => (\n typeof children === 'function'\n ? children({orientation, defaultChildren: null})\n : children\n ), [children, orientation]);\n\n return (\n <CollectionBuilder content={children}>\n {collection => <TabsInner props={props} collection={collection} tabsRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface TabsInnerProps {\n props: TabsProps,\n collection: ICollection<Node<any>>,\n tabsRef: RefObject<HTMLDivElement | null>\n}\n\nfunction TabsInner({props, tabsRef: ref, collection}: TabsInnerProps) {\n let {orientation = 'horizontal'} = props;\n let state = useTabListState({\n ...props,\n collection,\n children: undefined\n });\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let values = useMemo(() => ({\n orientation,\n isFocusWithin: isFocused,\n isFocusVisible\n }), [orientation, isFocused, isFocusVisible]);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tabs',\n values\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, focusProps)}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={isFocused || undefined}\n data-orientation={orientation}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={state.isDisabled || undefined}>\n <Provider\n values={[\n [TabsContext, props],\n [TabListStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The ids of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport const TabList = /*#__PURE__*/ (forwardRef as forwardRefType)(function TabList<T extends object>(props: TabListProps<T>, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n let state = useContext(TabListStateContext);\n return state\n ? <TabListInner props={props} forwardedRef={ref} />\n : <Collection {...props} />;\n});\n\ninterface TabListInnerProps<T> {\n props: TabListProps<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction TabListInner<T extends object>({props, forwardedRef: ref}: TabListInnerProps<T>) {\n let state = useContext(TabListStateContext)!;\n let {CollectionRoot} = useContext(CollectionRendererContext);\n let {orientation = 'horizontal', keyboardActivation = 'automatic'} = useSlottedContext(TabsContext)!;\n let objectRef = useObjectRef(ref);\n\n let {tabListProps} = useTabList({\n ...props,\n orientation,\n keyboardActivation\n }, state, objectRef);\n\n let renderProps = useRenderProps({\n ...props,\n children: null,\n defaultClassName: 'react-aria-TabList',\n values: {\n orientation,\n state\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, tabListProps)}\n ref={objectRef}\n data-orientation={orientation || undefined}>\n <CollectionRoot collection={state.collection} persistedKeys={usePersistedKeys(state.selectionManager.focusedKey)} />\n </div>\n );\n}\n\nclass TabItemNode extends CollectionNode<unknown> {\n static readonly type = 'item';\n}\n\n/**\n * A Tab provides a title for an individual item within a TabList.\n */\nexport const Tab = /*#__PURE__*/ createLeafComponent(TabItemNode, (props: TabProps, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<unknown>) => {\n let state = useContext(TabListStateContext)!;\n let ref = useObjectRef<any>(forwardedRef);\n let {tabProps, isSelected, isDisabled, isPressed} = useTab({key: item.key, ...props}, state, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({\n isDisabled,\n onHoverStart: props.onHoverStart,\n onHoverEnd: props.onHoverEnd,\n onHoverChange: props.onHoverChange\n });\n\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-Tab',\n values: {\n isSelected,\n isDisabled,\n isFocused,\n isFocusVisible,\n isPressed,\n isHovered\n }\n });\n\n let ElementType: React.ElementType = item.props.href ? 'a' : 'div';\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, tabProps, focusProps, hoverProps)}\n ref={ref}\n data-selected={isSelected || undefined}\n data-disabled={isDisabled || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-pressed={isPressed || undefined}\n data-hovered={isHovered || undefined}>\n {renderProps.children}\n </ElementType>\n );\n});\n\n/**\n * A TabPanel provides the content for a tab.\n */\nexport const TabPanel = /*#__PURE__*/ createHideableComponent(function TabPanel(props: TabPanelProps, forwardedRef: ForwardedRef<HTMLDivElement>) {\n const state = useContext(TabListStateContext)!;\n let ref = useObjectRef<HTMLDivElement>(forwardedRef);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {id, ...otherProps} = props;\n let {tabPanelProps} = useTabPanel(props, state, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n\n let isSelected = state.selectedKey === props.id;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-TabPanel',\n values: {\n isFocused,\n isFocusVisible,\n // @ts-ignore - compatibility with React < 19\n isInert: inertValue(!isSelected),\n state\n }\n });\n\n if (!isSelected && !props.shouldForceMount) {\n return null;\n }\n\n let DOMProps = filterDOMProps(otherProps, {global: true});\n delete DOMProps.id;\n\n let domProps = isSelected\n ? mergeProps(DOMProps, tabPanelProps, focusProps, renderProps)\n : renderProps;\n\n return (\n <div\n {...domProps}\n ref={ref}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n // @ts-ignore\n inert={inertValue(!isSelected || props.inert)}\n data-inert={!isSelected ? 'true' : undefined}>\n <Provider\n values={[\n [TabsContext, null],\n [TabListStateContext, null]\n ]}>\n <CollectionRendererContext.Provider value={DefaultCollectionRenderer}>\n {renderProps.children}\n </CollectionRendererContext.Provider>\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"Tabs.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Tabs.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, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {AriaTabListProps, AriaTabPanelProps, mergeProps, Orientation, useFocusRing, useHover, useTab, useTabList, useTabPanel} from 'react-aria';\nimport {Collection, CollectionBuilder, CollectionNode, createHideableComponent, createLeafComponent} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, DefaultCollectionRenderer, usePersistedKeys} from './Collection';\nimport {ContextValue, Provider, RenderProps, SlotProps, StyleRenderProps, useContextProps, useRenderProps, useSlottedContext} from './utils';\nimport {filterDOMProps, inertValue, useObjectRef} from '@react-aria/utils';\nimport {Collection as ICollection, Node, TabListState, useTabListState} from 'react-stately';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, useContext, useMemo} from 'react';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SharedElementTransition} from './SharedElementTransition';\n\nexport interface TabsProps extends Omit<AriaTabListProps<any>, 'items' | 'children'>, RenderProps<TabsRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport interface TabsRenderProps {\n /**\n * The orientation of the tabs.\n * @selector [data-orientation=\"horizontal | vertical\"]\n */\n orientation: Orientation\n}\n\nexport interface TabListProps<T> extends StyleRenderProps<TabListRenderProps>, AriaLabelingProps, Omit<CollectionProps<T>, 'disabledKeys'>, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport interface TabListRenderProps {\n /**\n * The orientation of the tab list.\n * @selector [data-orientation=\"horizontal | vertical\"]\n */\n orientation: Orientation,\n /**\n * State of the tab list.\n */\n state: TabListState<unknown>\n}\n\nexport interface TabProps extends RenderProps<TabRenderProps>, AriaLabelingProps, LinkDOMProps, HoverEvents, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /** The unique id of the tab. */\n id?: Key,\n /** Whether the tab is disabled. */\n isDisabled?: boolean\n}\n\nexport interface TabRenderProps {\n /**\n * Whether the tab is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the tab is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the tab is currently selected.\n * @selector [data-selected]\n */\n isSelected: boolean,\n /**\n * Whether the tab is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tab is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the tab is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean\n}\n\nexport interface TabPanelProps extends AriaTabPanelProps, RenderProps<TabPanelRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * Whether to mount the tab panel in the DOM even when it is not currently selected.\n * Inactive tab panels are inert and cannot be interacted with. They must be styled appropriately so this is clear to the user visually.\n * @default false\n */\n shouldForceMount?: boolean\n}\n\nexport interface TabPanelRenderProps {\n /**\n * Whether the tab panel is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the tab panel is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the tab panel is currently non-interactive. This occurs when the\n * `shouldForceMount` prop is true, and the corresponding tab is not selected.\n * @selector [data-inert]\n */\n isInert: boolean,\n /**\n * State of the tab list.\n */\n state: TabListState<unknown>\n}\n\nexport const TabsContext = createContext<ContextValue<TabsProps, HTMLDivElement>>(null);\nexport const TabListStateContext = createContext<TabListState<object> | null>(null);\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them.\n */\nexport const Tabs = /*#__PURE__*/ (forwardRef as forwardRefType)(function Tabs(props: TabsProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TabsContext);\n let {children, orientation = 'horizontal'} = props;\n children = useMemo(() => (\n typeof children === 'function'\n ? children({orientation, defaultChildren: null})\n : children\n ), [children, orientation]);\n\n return (\n <CollectionBuilder content={children}>\n {collection => <TabsInner props={props} collection={collection} tabsRef={ref} />}\n </CollectionBuilder>\n );\n});\n\ninterface TabsInnerProps {\n props: TabsProps,\n collection: ICollection<Node<any>>,\n tabsRef: RefObject<HTMLDivElement | null>\n}\n\nfunction TabsInner({props, tabsRef: ref, collection}: TabsInnerProps) {\n let {orientation = 'horizontal'} = props;\n let state = useTabListState({\n ...props,\n collection,\n children: undefined\n });\n let {focusProps, isFocused, isFocusVisible} = useFocusRing({within: true});\n let values = useMemo(() => ({\n orientation,\n isFocusWithin: isFocused,\n isFocusVisible\n }), [orientation, isFocused, isFocusVisible]);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Tabs',\n values\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, focusProps)}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={isFocused || undefined}\n data-orientation={orientation}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={state.isDisabled || undefined}>\n <Provider\n values={[\n [TabsContext, props],\n [TabListStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The ids of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport const TabList = /*#__PURE__*/ (forwardRef as forwardRefType)(function TabList<T extends object>(props: TabListProps<T>, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n let state = useContext(TabListStateContext);\n return state\n ? <TabListInner props={props} forwardedRef={ref} />\n : <Collection {...props} />;\n});\n\ninterface TabListInnerProps<T> {\n props: TabListProps<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction TabListInner<T extends object>({props, forwardedRef: ref}: TabListInnerProps<T>) {\n let state = useContext(TabListStateContext)!;\n let {CollectionRoot} = useContext(CollectionRendererContext);\n let {orientation = 'horizontal', keyboardActivation = 'automatic'} = useSlottedContext(TabsContext)!;\n let objectRef = useObjectRef(ref);\n\n let {tabListProps} = useTabList({\n ...props,\n orientation,\n keyboardActivation\n }, state, objectRef);\n\n let renderProps = useRenderProps({\n ...props,\n children: null,\n defaultClassName: 'react-aria-TabList',\n values: {\n orientation,\n state\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, tabListProps)}\n ref={objectRef}\n data-orientation={orientation || undefined}>\n <SharedElementTransition>\n <CollectionRoot collection={state.collection} persistedKeys={usePersistedKeys(state.selectionManager.focusedKey)} />\n </SharedElementTransition>\n </div>\n );\n}\n\nclass TabItemNode extends CollectionNode<unknown> {\n static readonly type = 'item';\n}\n\n/**\n * A Tab provides a title for an individual item within a TabList.\n */\nexport const Tab = /*#__PURE__*/ createLeafComponent(TabItemNode, (props: TabProps, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<unknown>) => {\n let state = useContext(TabListStateContext)!;\n let ref = useObjectRef<any>(forwardedRef);\n let {tabProps, isSelected, isDisabled, isPressed} = useTab({key: item.key, ...props}, state, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({\n isDisabled,\n onHoverStart: props.onHoverStart,\n onHoverEnd: props.onHoverEnd,\n onHoverChange: props.onHoverChange\n });\n\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-Tab',\n values: {\n isSelected,\n isDisabled,\n isFocused,\n isFocusVisible,\n isPressed,\n isHovered\n }\n });\n\n let ElementType: React.ElementType = item.props.href ? 'a' : 'div';\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, tabProps, focusProps, hoverProps)}\n ref={ref}\n data-selected={isSelected || undefined}\n data-disabled={isDisabled || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-pressed={isPressed || undefined}\n data-hovered={isHovered || undefined}>\n <SelectionIndicatorContext.Provider value={{isSelected}}>\n {renderProps.children}\n </SelectionIndicatorContext.Provider>\n </ElementType>\n );\n});\n\n/**\n * A TabPanel provides the content for a tab.\n */\nexport const TabPanel = /*#__PURE__*/ createHideableComponent(function TabPanel(props: TabPanelProps, forwardedRef: ForwardedRef<HTMLDivElement>) {\n const state = useContext(TabListStateContext)!;\n let ref = useObjectRef<HTMLDivElement>(forwardedRef);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {id, ...otherProps} = props;\n let {tabPanelProps} = useTabPanel(props, state, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n\n let isSelected = state.selectedKey === props.id;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-TabPanel',\n values: {\n isFocused,\n isFocusVisible,\n // @ts-ignore - compatibility with React < 19\n isInert: inertValue(!isSelected),\n state\n }\n });\n\n if (!isSelected && !props.shouldForceMount) {\n return null;\n }\n\n let DOMProps = filterDOMProps(otherProps, {global: true});\n delete DOMProps.id;\n\n let domProps = isSelected\n ? mergeProps(DOMProps, tabPanelProps, focusProps, renderProps)\n : renderProps;\n\n return (\n <div\n {...domProps}\n ref={ref}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n // @ts-ignore\n inert={inertValue(!isSelected || props.inert)}\n data-inert={!isSelected ? 'true' : undefined}>\n <Provider\n values={[\n [TabsContext, null],\n [TabListStateContext, null]\n ]}>\n <CollectionRendererContext.Provider value={DefaultCollectionRenderer}>\n {renderProps.children}\n </CollectionRendererContext.Provider>\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"Tabs.module.js.map"}
@@ -3,7 +3,9 @@ var $3114c2382242bdc0$exports = require("./Collection.main.js");
3
3
  var $c5ccf687772c0422$exports = require("./utils.main.js");
4
4
  var $84ae0bf5bd8e2a5f$exports = require("./Label.main.js");
5
5
  var $a03b42240404b420$exports = require("./ListBox.main.js");
6
- var $09cb5ee89bb327e1$exports = require("./context.main.js");
6
+ var $525402dfec7da5bc$exports = require("./RSPContexts.main.js");
7
+ var $54e872c96e6d295b$exports = require("./SelectionIndicator.main.js");
8
+ var $2d10bc562fea46b3$exports = require("./SharedElementTransition.main.js");
7
9
  var $a8a589c28affdc40$exports = require("./Text.main.js");
8
10
  var $4TsYs$reactaria = require("react-aria");
9
11
  var $4TsYs$reactariacollections = require("@react-aria/collections");
@@ -47,49 +49,53 @@ $parcel$export(module.exports, "Tag", () => $ecf55d0c218a575e$export$3288d34c523
47
49
 
48
50
 
49
51
 
52
+
53
+
50
54
  const $ecf55d0c218a575e$export$5b07b5dd2cbd96e3 = /*#__PURE__*/ (0, $4TsYs$react.createContext)(null);
51
55
  const $ecf55d0c218a575e$export$e755ce3685dd0ca9 = /*#__PURE__*/ (0, $4TsYs$react.createContext)(null);
52
56
  const $ecf55d0c218a575e$export$67ea30858aaf75e3 = /*#__PURE__*/ (0, $4TsYs$react.forwardRef)(function TagGroup(props, ref) {
53
57
  [props, ref] = (0, $c5ccf687772c0422$exports.useContextProps)(props, ref, $ecf55d0c218a575e$export$5b07b5dd2cbd96e3);
54
- return /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement((0, $4TsYs$reactariacollections.CollectionBuilder), {
58
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement((0, $a03b42240404b420$exports.ListStateContext).Provider, {
59
+ value: null
60
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement((0, $4TsYs$reactariacollections.CollectionBuilder), {
55
61
  content: props.children
56
62
  }, (collection)=>/*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement($ecf55d0c218a575e$var$TagGroupInner, {
57
63
  props: props,
58
64
  forwardedRef: ref,
59
65
  collection: collection
60
- }));
66
+ })));
61
67
  });
62
68
  function $ecf55d0c218a575e$var$TagGroupInner({ props: props, forwardedRef: ref, collection: collection }) {
63
- let contextProps;
64
- [contextProps] = (0, $c5ccf687772c0422$exports.useContextProps)({}, null, (0, $09cb5ee89bb327e1$exports.SelectableCollectionContext));
65
- let { filter: filter, ...collectionProps } = contextProps;
66
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
67
- let { shouldUseVirtualFocus: shouldUseVirtualFocus, disallowTypeAhead: disallowTypeAhead, ...DOMCollectionProps } = collectionProps || {};
68
69
  let tagListRef = (0, $4TsYs$react.useRef)(null);
70
+ // Extract the user provided id so it doesn't clash with the collection id provided by Autocomplete
71
+ let { id: id, ...otherProps } = props;
72
+ [otherProps, tagListRef] = (0, $c5ccf687772c0422$exports.useContextProps)(otherProps, tagListRef, (0, $525402dfec7da5bc$exports.SelectableCollectionContext));
73
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
74
+ let { filter: filter, shouldUseVirtualFocus: shouldUseVirtualFocus, ...DOMCollectionProps } = otherProps;
69
75
  let [labelRef, label] = (0, $c5ccf687772c0422$exports.useSlot)(!props['aria-label'] && !props['aria-labelledby']);
70
76
  let tagGroupState = (0, $4TsYs$reactstately.useListState)({
71
- ...props,
77
+ ...DOMCollectionProps,
72
78
  children: undefined,
73
79
  collection: collection
74
80
  });
75
81
  let filteredState = (0, $4TsYs$reactstately.UNSTABLE_useFilteredListState)(tagGroupState, filter);
76
82
  // Prevent DOM props from going to two places.
77
- let domProps = (0, $4TsYs$reactariautils.filterDOMProps)(props, {
83
+ let domProps = (0, $4TsYs$reactariautils.filterDOMProps)(otherProps, {
78
84
  global: true
79
85
  });
80
- let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k])=>[
86
+ let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k, val])=>[
81
87
  k,
82
- undefined
88
+ k === 'id' ? val : undefined
83
89
  ]));
84
90
  let { gridProps: gridProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $4TsYs$reactaria.useTagGroup)({
85
- ...props,
86
- ...domPropOverrides,
87
91
  ...DOMCollectionProps,
92
+ ...domPropOverrides,
88
93
  label: label
89
94
  }, filteredState, tagListRef);
90
95
  var _props_className;
91
96
  return /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement("div", {
92
97
  ...domProps,
98
+ id: id,
93
99
  ref: ref,
94
100
  slot: props.slot || undefined,
95
101
  className: (_props_className = props.className) !== null && _props_className !== void 0 ? _props_className : 'react-aria-TagGroup',
@@ -161,10 +167,10 @@ function $ecf55d0c218a575e$var$TagListInner({ props: props, forwardedRef: forwar
161
167
  "data-empty": state.collection.size === 0 || undefined,
162
168
  "data-focused": isFocused || undefined,
163
169
  "data-focus-visible": isFocusVisible || undefined
164
- }, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement(CollectionRoot, {
170
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement((0, $2d10bc562fea46b3$exports.SharedElementTransition), null, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, ($parcel$interopDefault($4TsYs$react))).createElement(CollectionRoot, {
165
171
  collection: state.collection,
166
172
  persistedKeys: persistedKeys
167
- }));
173
+ })));
168
174
  }
169
175
  const $ecf55d0c218a575e$export$3288d34c523a1192 = /*#__PURE__*/ (0, $4TsYs$reactariacollections.createLeafComponent)((0, $4TsYs$reactariacollections.ItemNode), (props, forwardedRef, item)=>{
170
176
  let state = (0, $4TsYs$react.useContext)((0, $a03b42240404b420$exports.ListStateContext));
@@ -233,6 +239,12 @@ const $ecf55d0c218a575e$export$3288d34c523a1192 = /*#__PURE__*/ (0, $4TsYs$react
233
239
  [
234
240
  (0, $3114c2382242bdc0$exports.CollectionRendererContext),
235
241
  (0, $3114c2382242bdc0$exports.DefaultCollectionRenderer)
242
+ ],
243
+ [
244
+ (0, $54e872c96e6d295b$exports.SelectionIndicatorContext),
245
+ {
246
+ isSelected: states.isSelected
247
+ }
236
248
  ]
237
249
  ]
238
250
  }, renderProps.children)));
@@ -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, ItemNode} 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, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {SelectableCollectionContext} from './context';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\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>, GlobalDOMAttributes<HTMLDivElement> {\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 contextProps;\n [contextProps] = useContextProps({}, null, SelectableCollectionContext);\n let {filter, ...collectionProps} = contextProps;\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {shouldUseVirtualFocus, disallowTypeAhead, ...DOMCollectionProps} = collectionProps || {};\n let tagListRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let tagGroupState = useListState({\n ...props,\n children: undefined,\n collection\n });\n\n let filteredState = UNSTABLE_useFilteredListState(tagGroupState, filter);\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(props, {global: true});\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 ...DOMCollectionProps,\n label\n }, filteredState, 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, filteredState],\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({}, forwardedRef, TagListContext);\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 let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, gridProps, focusProps)}\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, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\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(ItemNode, (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 let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <div\n ref={ref}\n {...mergeProps(DOMProps, renderProps, 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.main.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, ItemNode} 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, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\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>, GlobalDOMAttributes<HTMLDivElement> {\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 <ListStateContext.Provider value={null}>\n <CollectionBuilder content={props.children}>\n {collection => <TagGroupInner props={props} forwardedRef={ref} collection={collection} />}\n </CollectionBuilder>\n </ListStateContext.Provider>\n );\n});\n\ninterface TagGroupInnerProps<T> {\n props: TagGroupProps & SelectableCollectionContextValue<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>,\n collection\n}\n\nfunction TagGroupInner<T extends object>({props, forwardedRef: ref, collection}: TagGroupInnerProps<T>) {\n let tagListRef = useRef<HTMLElement>(null);\n // Extract the user provided id so it doesn't clash with the collection id provided by Autocomplete\n let {id, ...otherProps} = props;\n [otherProps, tagListRef] = useContextProps(otherProps, tagListRef, SelectableCollectionContext);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {filter, shouldUseVirtualFocus, ...DOMCollectionProps} = otherProps;\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let tagGroupState = useListState({\n ...DOMCollectionProps,\n children: undefined,\n collection\n });\n\n let filteredState = UNSTABLE_useFilteredListState(tagGroupState as ListState<T>, filter);\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(otherProps, {global: true});\n let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k, val]) => [k, k === 'id' ? val : undefined]));\n let {\n gridProps,\n labelProps,\n descriptionProps,\n errorMessageProps\n } = useTagGroup({\n ...DOMCollectionProps,\n ...domPropOverrides,\n label\n }, filteredState, tagListRef);\n\n return (\n <div\n {...domProps}\n id={id}\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 as RefObject<HTMLDivElement>}],\n [ListStateContext, filteredState],\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({}, forwardedRef, TagListContext);\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 let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, gridProps, focusProps)}\n ref={ref}\n data-empty={state.collection.size === 0 || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <SharedElementTransition>\n {state.collection.size === 0 && props.renderEmptyState\n ? props.renderEmptyState(renderValues)\n : <CollectionRoot collection={state.collection} persistedKeys={persistedKeys} />}\n </SharedElementTransition>\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, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\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(ItemNode, (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 let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <div\n ref={ref}\n {...mergeProps(DOMProps, renderProps, 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 [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TagGroup.main.js.map"}
package/dist/TagGroup.mjs CHANGED
@@ -3,7 +3,9 @@ import {CollectionRendererContext as $7135fc7d473fd974$export$4feb769f8ddf26c5,
3
3
  import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.mjs";
4
4
  import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label.mjs";
5
5
  import {ListStateContext as $eed445e0843c11d0$export$7c5906fe4f1f2af2} from "./ListBox.mjs";
6
- import {SelectableCollectionContext as $8e6cc465cc68f603$export$b0d3ecf7112093a7} from "./context.mjs";
6
+ import {SelectableCollectionContext as $4e85f108e88277b8$export$b0d3ecf7112093a7} from "./RSPContexts.mjs";
7
+ import {SelectionIndicatorContext as $1d5b8b8664671ef2$export$c9549807523555e0} from "./SelectionIndicator.mjs";
8
+ import {SharedElementTransition as $c8a5a149f625efcf$export$758399f318e6385a} from "./SharedElementTransition.mjs";
7
9
  import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.mjs";
8
10
  import {useTagGroup as $7lruP$useTagGroup, useFocusRing as $7lruP$useFocusRing, useTag as $7lruP$useTag, useHover as $7lruP$useHover} from "react-aria";
9
11
  import {CollectionBuilder as $7lruP$CollectionBuilder, Collection as $7lruP$Collection, createLeafComponent as $7lruP$createLeafComponent, ItemNode as $7lruP$ItemNode} from "@react-aria/collections";
@@ -33,49 +35,53 @@ import $7lruP$react, {createContext as $7lruP$createContext, forwardRef as $7lru
33
35
 
34
36
 
35
37
 
38
+
39
+
36
40
  const $eaf9e70818b436db$export$5b07b5dd2cbd96e3 = /*#__PURE__*/ (0, $7lruP$createContext)(null);
37
41
  const $eaf9e70818b436db$export$e755ce3685dd0ca9 = /*#__PURE__*/ (0, $7lruP$createContext)(null);
38
42
  const $eaf9e70818b436db$export$67ea30858aaf75e3 = /*#__PURE__*/ (0, $7lruP$forwardRef)(function TagGroup(props, ref) {
39
43
  [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $eaf9e70818b436db$export$5b07b5dd2cbd96e3);
40
- return /*#__PURE__*/ (0, $7lruP$react).createElement((0, $7lruP$CollectionBuilder), {
44
+ return /*#__PURE__*/ (0, $7lruP$react).createElement((0, $eed445e0843c11d0$export$7c5906fe4f1f2af2).Provider, {
45
+ value: null
46
+ }, /*#__PURE__*/ (0, $7lruP$react).createElement((0, $7lruP$CollectionBuilder), {
41
47
  content: props.children
42
48
  }, (collection)=>/*#__PURE__*/ (0, $7lruP$react).createElement($eaf9e70818b436db$var$TagGroupInner, {
43
49
  props: props,
44
50
  forwardedRef: ref,
45
51
  collection: collection
46
- }));
52
+ })));
47
53
  });
48
54
  function $eaf9e70818b436db$var$TagGroupInner({ props: props, forwardedRef: ref, collection: collection }) {
49
- let contextProps;
50
- [contextProps] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)({}, null, (0, $8e6cc465cc68f603$export$b0d3ecf7112093a7));
51
- let { filter: filter, ...collectionProps } = contextProps;
52
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
53
- let { shouldUseVirtualFocus: shouldUseVirtualFocus, disallowTypeAhead: disallowTypeAhead, ...DOMCollectionProps } = collectionProps || {};
54
55
  let tagListRef = (0, $7lruP$useRef)(null);
56
+ // Extract the user provided id so it doesn't clash with the collection id provided by Autocomplete
57
+ let { id: id, ...otherProps } = props;
58
+ [otherProps, tagListRef] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(otherProps, tagListRef, (0, $4e85f108e88277b8$export$b0d3ecf7112093a7));
59
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
60
+ let { filter: filter, shouldUseVirtualFocus: shouldUseVirtualFocus, ...DOMCollectionProps } = otherProps;
55
61
  let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
56
62
  let tagGroupState = (0, $7lruP$useListState)({
57
- ...props,
63
+ ...DOMCollectionProps,
58
64
  children: undefined,
59
65
  collection: collection
60
66
  });
61
67
  let filteredState = (0, $7lruP$UNSTABLE_useFilteredListState)(tagGroupState, filter);
62
68
  // Prevent DOM props from going to two places.
63
- let domProps = (0, $7lruP$filterDOMProps)(props, {
69
+ let domProps = (0, $7lruP$filterDOMProps)(otherProps, {
64
70
  global: true
65
71
  });
66
- let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k])=>[
72
+ let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k, val])=>[
67
73
  k,
68
- undefined
74
+ k === 'id' ? val : undefined
69
75
  ]));
70
76
  let { gridProps: gridProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $7lruP$useTagGroup)({
71
- ...props,
72
- ...domPropOverrides,
73
77
  ...DOMCollectionProps,
78
+ ...domPropOverrides,
74
79
  label: label
75
80
  }, filteredState, tagListRef);
76
81
  var _props_className;
77
82
  return /*#__PURE__*/ (0, $7lruP$react).createElement("div", {
78
83
  ...domProps,
84
+ id: id,
79
85
  ref: ref,
80
86
  slot: props.slot || undefined,
81
87
  className: (_props_className = props.className) !== null && _props_className !== void 0 ? _props_className : 'react-aria-TagGroup',
@@ -147,10 +153,10 @@ function $eaf9e70818b436db$var$TagListInner({ props: props, forwardedRef: forwar
147
153
  "data-empty": state.collection.size === 0 || undefined,
148
154
  "data-focused": isFocused || undefined,
149
155
  "data-focus-visible": isFocusVisible || undefined
150
- }, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, $7lruP$react).createElement(CollectionRoot, {
156
+ }, /*#__PURE__*/ (0, $7lruP$react).createElement((0, $c8a5a149f625efcf$export$758399f318e6385a), null, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, $7lruP$react).createElement(CollectionRoot, {
151
157
  collection: state.collection,
152
158
  persistedKeys: persistedKeys
153
- }));
159
+ })));
154
160
  }
155
161
  const $eaf9e70818b436db$export$3288d34c523a1192 = /*#__PURE__*/ (0, $7lruP$createLeafComponent)((0, $7lruP$ItemNode), (props, forwardedRef, item)=>{
156
162
  let state = (0, $7lruP$useContext)((0, $eed445e0843c11d0$export$7c5906fe4f1f2af2));
@@ -219,6 +225,12 @@ const $eaf9e70818b436db$export$3288d34c523a1192 = /*#__PURE__*/ (0, $7lruP$creat
219
225
  [
220
226
  (0, $7135fc7d473fd974$export$4feb769f8ddf26c5),
221
227
  (0, $7135fc7d473fd974$export$a164736487e3f0ae)
228
+ ],
229
+ [
230
+ (0, $1d5b8b8664671ef2$export$c9549807523555e0),
231
+ {
232
+ isSelected: states.isSelected
233
+ }
222
234
  ]
223
235
  ]
224
236
  }, renderProps.children)));
@@ -3,7 +3,9 @@ import {CollectionRendererContext as $7135fc7d473fd974$export$4feb769f8ddf26c5,
3
3
  import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8} from "./utils.module.js";
4
4
  import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label.module.js";
5
5
  import {ListStateContext as $eed445e0843c11d0$export$7c5906fe4f1f2af2} from "./ListBox.module.js";
6
- import {SelectableCollectionContext as $8e6cc465cc68f603$export$b0d3ecf7112093a7} from "./context.module.js";
6
+ import {SelectableCollectionContext as $4e85f108e88277b8$export$b0d3ecf7112093a7} from "./RSPContexts.module.js";
7
+ import {SelectionIndicatorContext as $1d5b8b8664671ef2$export$c9549807523555e0} from "./SelectionIndicator.module.js";
8
+ import {SharedElementTransition as $c8a5a149f625efcf$export$758399f318e6385a} from "./SharedElementTransition.module.js";
7
9
  import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.module.js";
8
10
  import {useTagGroup as $7lruP$useTagGroup, useFocusRing as $7lruP$useFocusRing, useTag as $7lruP$useTag, useHover as $7lruP$useHover} from "react-aria";
9
11
  import {CollectionBuilder as $7lruP$CollectionBuilder, Collection as $7lruP$Collection, createLeafComponent as $7lruP$createLeafComponent, ItemNode as $7lruP$ItemNode} from "@react-aria/collections";
@@ -33,49 +35,53 @@ import $7lruP$react, {createContext as $7lruP$createContext, forwardRef as $7lru
33
35
 
34
36
 
35
37
 
38
+
39
+
36
40
  const $eaf9e70818b436db$export$5b07b5dd2cbd96e3 = /*#__PURE__*/ (0, $7lruP$createContext)(null);
37
41
  const $eaf9e70818b436db$export$e755ce3685dd0ca9 = /*#__PURE__*/ (0, $7lruP$createContext)(null);
38
42
  const $eaf9e70818b436db$export$67ea30858aaf75e3 = /*#__PURE__*/ (0, $7lruP$forwardRef)(function TagGroup(props, ref) {
39
43
  [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $eaf9e70818b436db$export$5b07b5dd2cbd96e3);
40
- return /*#__PURE__*/ (0, $7lruP$react).createElement((0, $7lruP$CollectionBuilder), {
44
+ return /*#__PURE__*/ (0, $7lruP$react).createElement((0, $eed445e0843c11d0$export$7c5906fe4f1f2af2).Provider, {
45
+ value: null
46
+ }, /*#__PURE__*/ (0, $7lruP$react).createElement((0, $7lruP$CollectionBuilder), {
41
47
  content: props.children
42
48
  }, (collection)=>/*#__PURE__*/ (0, $7lruP$react).createElement($eaf9e70818b436db$var$TagGroupInner, {
43
49
  props: props,
44
50
  forwardedRef: ref,
45
51
  collection: collection
46
- }));
52
+ })));
47
53
  });
48
54
  function $eaf9e70818b436db$var$TagGroupInner({ props: props, forwardedRef: ref, collection: collection }) {
49
- let contextProps;
50
- [contextProps] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)({}, null, (0, $8e6cc465cc68f603$export$b0d3ecf7112093a7));
51
- let { filter: filter, ...collectionProps } = contextProps;
52
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
53
- let { shouldUseVirtualFocus: shouldUseVirtualFocus, disallowTypeAhead: disallowTypeAhead, ...DOMCollectionProps } = collectionProps || {};
54
55
  let tagListRef = (0, $7lruP$useRef)(null);
56
+ // Extract the user provided id so it doesn't clash with the collection id provided by Autocomplete
57
+ let { id: id, ...otherProps } = props;
58
+ [otherProps, tagListRef] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(otherProps, tagListRef, (0, $4e85f108e88277b8$export$b0d3ecf7112093a7));
59
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
60
+ let { filter: filter, shouldUseVirtualFocus: shouldUseVirtualFocus, ...DOMCollectionProps } = otherProps;
55
61
  let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
56
62
  let tagGroupState = (0, $7lruP$useListState)({
57
- ...props,
63
+ ...DOMCollectionProps,
58
64
  children: undefined,
59
65
  collection: collection
60
66
  });
61
67
  let filteredState = (0, $7lruP$UNSTABLE_useFilteredListState)(tagGroupState, filter);
62
68
  // Prevent DOM props from going to two places.
63
- let domProps = (0, $7lruP$filterDOMProps)(props, {
69
+ let domProps = (0, $7lruP$filterDOMProps)(otherProps, {
64
70
  global: true
65
71
  });
66
- let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k])=>[
72
+ let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k, val])=>[
67
73
  k,
68
- undefined
74
+ k === 'id' ? val : undefined
69
75
  ]));
70
76
  let { gridProps: gridProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $7lruP$useTagGroup)({
71
- ...props,
72
- ...domPropOverrides,
73
77
  ...DOMCollectionProps,
78
+ ...domPropOverrides,
74
79
  label: label
75
80
  }, filteredState, tagListRef);
76
81
  var _props_className;
77
82
  return /*#__PURE__*/ (0, $7lruP$react).createElement("div", {
78
83
  ...domProps,
84
+ id: id,
79
85
  ref: ref,
80
86
  slot: props.slot || undefined,
81
87
  className: (_props_className = props.className) !== null && _props_className !== void 0 ? _props_className : 'react-aria-TagGroup',
@@ -147,10 +153,10 @@ function $eaf9e70818b436db$var$TagListInner({ props: props, forwardedRef: forwar
147
153
  "data-empty": state.collection.size === 0 || undefined,
148
154
  "data-focused": isFocused || undefined,
149
155
  "data-focus-visible": isFocusVisible || undefined
150
- }, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, $7lruP$react).createElement(CollectionRoot, {
156
+ }, /*#__PURE__*/ (0, $7lruP$react).createElement((0, $c8a5a149f625efcf$export$758399f318e6385a), null, state.collection.size === 0 && props.renderEmptyState ? props.renderEmptyState(renderValues) : /*#__PURE__*/ (0, $7lruP$react).createElement(CollectionRoot, {
151
157
  collection: state.collection,
152
158
  persistedKeys: persistedKeys
153
- }));
159
+ })));
154
160
  }
155
161
  const $eaf9e70818b436db$export$3288d34c523a1192 = /*#__PURE__*/ (0, $7lruP$createLeafComponent)((0, $7lruP$ItemNode), (props, forwardedRef, item)=>{
156
162
  let state = (0, $7lruP$useContext)((0, $eed445e0843c11d0$export$7c5906fe4f1f2af2));
@@ -219,6 +225,12 @@ const $eaf9e70818b436db$export$3288d34c523a1192 = /*#__PURE__*/ (0, $7lruP$creat
219
225
  [
220
226
  (0, $7135fc7d473fd974$export$4feb769f8ddf26c5),
221
227
  (0, $7135fc7d473fd974$export$a164736487e3f0ae)
228
+ ],
229
+ [
230
+ (0, $1d5b8b8664671ef2$export$c9549807523555e0),
231
+ {
232
+ isSelected: states.isSelected
233
+ }
222
234
  ]
223
235
  ]
224
236
  }, renderProps.children)));
@@ -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, ItemNode} 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, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {SelectableCollectionContext} from './context';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\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>, GlobalDOMAttributes<HTMLDivElement> {\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 contextProps;\n [contextProps] = useContextProps({}, null, SelectableCollectionContext);\n let {filter, ...collectionProps} = contextProps;\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {shouldUseVirtualFocus, disallowTypeAhead, ...DOMCollectionProps} = collectionProps || {};\n let tagListRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let tagGroupState = useListState({\n ...props,\n children: undefined,\n collection\n });\n\n let filteredState = UNSTABLE_useFilteredListState(tagGroupState, filter);\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(props, {global: true});\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 ...DOMCollectionProps,\n label\n }, filteredState, 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, filteredState],\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({}, forwardedRef, TagListContext);\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 let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, gridProps, focusProps)}\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, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\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(ItemNode, (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 let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <div\n ref={ref}\n {...mergeProps(DOMProps, renderProps, 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, ItemNode} 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, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {LabelContext} from './Label';\nimport {ListState, Node, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {ListStateContext} from './ListBox';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface TagGroupProps extends Omit<AriaTagGroupProps<unknown>, 'children' | 'items' | 'label' | 'description' | 'errorMessage' | 'keyboardDelegate'>, DOMProps, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\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>, GlobalDOMAttributes<HTMLDivElement> {\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 <ListStateContext.Provider value={null}>\n <CollectionBuilder content={props.children}>\n {collection => <TagGroupInner props={props} forwardedRef={ref} collection={collection} />}\n </CollectionBuilder>\n </ListStateContext.Provider>\n );\n});\n\ninterface TagGroupInnerProps<T> {\n props: TagGroupProps & SelectableCollectionContextValue<T>,\n forwardedRef: ForwardedRef<HTMLDivElement>,\n collection\n}\n\nfunction TagGroupInner<T extends object>({props, forwardedRef: ref, collection}: TagGroupInnerProps<T>) {\n let tagListRef = useRef<HTMLElement>(null);\n // Extract the user provided id so it doesn't clash with the collection id provided by Autocomplete\n let {id, ...otherProps} = props;\n [otherProps, tagListRef] = useContextProps(otherProps, tagListRef, SelectableCollectionContext);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n let {filter, shouldUseVirtualFocus, ...DOMCollectionProps} = otherProps;\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let tagGroupState = useListState({\n ...DOMCollectionProps,\n children: undefined,\n collection\n });\n\n let filteredState = UNSTABLE_useFilteredListState(tagGroupState as ListState<T>, filter);\n\n // Prevent DOM props from going to two places.\n let domProps = filterDOMProps(otherProps, {global: true});\n let domPropOverrides = Object.fromEntries(Object.entries(domProps).map(([k, val]) => [k, k === 'id' ? val : undefined]));\n let {\n gridProps,\n labelProps,\n descriptionProps,\n errorMessageProps\n } = useTagGroup({\n ...DOMCollectionProps,\n ...domPropOverrides,\n label\n }, filteredState, tagListRef);\n\n return (\n <div\n {...domProps}\n id={id}\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 as RefObject<HTMLDivElement>}],\n [ListStateContext, filteredState],\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({}, forwardedRef, TagListContext);\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 let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <div\n {...mergeProps(DOMProps, renderProps, gridProps, focusProps)}\n ref={ref}\n data-empty={state.collection.size === 0 || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <SharedElementTransition>\n {state.collection.size === 0 && props.renderEmptyState\n ? props.renderEmptyState(renderValues)\n : <CollectionRoot collection={state.collection} persistedKeys={persistedKeys} />}\n </SharedElementTransition>\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, PressEvents, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\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(ItemNode, (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 let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n return (\n <div\n ref={ref}\n {...mergeProps(DOMProps, renderProps, 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 [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TagGroup.module.js.map"}
@@ -1,6 +1,6 @@
1
1
  var $c5ccf687772c0422$exports = require("./utils.main.js");
2
2
  var $846a838139f2ac6b$exports = require("./FieldError.main.js");
3
- var $09cb5ee89bb327e1$exports = require("./context.main.js");
3
+ var $525402dfec7da5bc$exports = require("./RSPContexts.main.js");
4
4
  var $35157657e549736b$exports = require("./Form.main.js");
5
5
  var $dcae72abc18c0045$exports = require("./Group.main.js");
6
6
  var $1bcfcef5af644e13$exports = require("./Input.main.js");
@@ -53,7 +53,7 @@ const $3f2c5af9d7d8905b$export$2c73285ae9390cec = /*#__PURE__*/ (0, $1Ma1u$react
53
53
  var _props_validationBehavior, _ref;
54
54
  let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
55
55
  let inputRef = (0, $1Ma1u$react.useRef)(null);
56
- [props, inputRef] = (0, $c5ccf687772c0422$exports.useContextProps)(props, inputRef, (0, $09cb5ee89bb327e1$exports.FieldInputContext));
56
+ [props, inputRef] = (0, $c5ccf687772c0422$exports.useContextProps)(props, inputRef, (0, $525402dfec7da5bc$exports.FieldInputContext));
57
57
  let [labelRef, label] = (0, $c5ccf687772c0422$exports.useSlot)(!props['aria-label'] && !props['aria-labelledby']);
58
58
  let [inputElementType, setInputElementType] = (0, $1Ma1u$react.useState)('input');
59
59
  let { labelProps: labelProps, inputProps: inputProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = (0, $1Ma1u$reactaria.useTextField)({
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AA6CM,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAgD;AAKrF,MAAM,4CAAY,WAAW,GAAG,CAAA,GAAA,mDAAsB,EAAE,SAAS,UAAU,KAAqB,EAAE,GAAiC;IACxI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,CAAC,OAAO,SAAoB,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,UAAU,CAAA,GAAA,2CAAgB;IAChF,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,CAAC,kBAAkB,oBAAoB,GAAG,CAAA,GAAA,qBAAO,EAAE;IACvD,IAAI,cAAC,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAO;QACnG,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;0BAC9B;eACA;4BACA;IACF,GAAG;IAEH,oFAAoF;IACpF,6DAA6D;IAC7D,IAAI,qBAAqB,CAAA,GAAA,wBAAU,EAAE,CAAC;QACpC,SAAS,OAAO,GAAG;QACnB,IAAI,IACF,oBAAoB,cAAc,sBAAsB,aAAa;IAEzE,GAAG;QAAC;KAAS;IAEb,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,YAAY,MAAM,UAAU,IAAI;YAChC,WAAW,WAAW,SAAS;YAC/B,YAAY,MAAM,UAAU,IAAI;YAChC,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,WAAW,SAAS,IAAI;QACtC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;qBACnC,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAkB;aAAE;YACxD;gBAAC,CAAA,GAAA,yCAAc;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAkB;aAAE;YAC3D;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,MAAM;oBAAgB,WAAW,WAAW,SAAS;oBAAE,YAAY,MAAM,UAAU,IAAI;gBAAK;aAAE;YAC9G;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;OACA,YAAY,QAAQ;AAI7B","sources":["packages/react-aria-components/src/TextField.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 {AriaTextFieldProps, useTextField} from 'react-aria';\nimport {ContextValue, DOMProps, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {FieldInputContext} from './context';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, useCallback, useRef, useState} from 'react';\nimport {TextAreaContext} from './TextArea';\nimport {TextContext} from './Text';\n\nexport interface TextFieldRenderProps {\n /**\n * Whether the text field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the value is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the text field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the text field is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, Omit<DOMProps, 'style' | 'className' | 'children'>, SlotProps, RenderProps<TextFieldRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /** Whether the value is invalid. */\n isInvalid?: boolean\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, HTMLDivElement>>(null);\n\n/**\n * A text field allows a user to enter a plain text value with a keyboard.\n */\nexport const TextField = /*#__PURE__*/ createHideableComponent(function TextField(props: TextFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TextFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let inputRef = useRef<HTMLInputElement>(null);\n [props, inputRef as unknown] = useContextProps(props, inputRef, FieldInputContext);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let [inputElementType, setInputElementType] = useState('input');\n let {labelProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTextField<any>({\n ...removeDataAttributes(props),\n inputElementType,\n label,\n validationBehavior\n }, inputRef);\n\n // Intercept setting the input ref so we can determine what kind of element we have.\n // useTextField uses this to determine what props to include.\n let inputOrTextAreaRef = useCallback((el) => {\n inputRef.current = el;\n if (el) {\n setInputElementType(el instanceof HTMLTextAreaElement ? 'textarea' : 'input');\n }\n }, [inputRef]);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid,\n isReadOnly: props.isReadOnly || false,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-TextField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-readonly={props.isReadOnly || undefined}\n data-required={props.isRequired || undefined}>\n <Provider\n values={[\n [LabelContext, {...labelProps, ref: labelRef}],\n [InputContext, {...inputProps, ref: inputOrTextAreaRef}],\n [TextAreaContext, {...inputProps, ref: inputOrTextAreaRef}],\n [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TextField.main.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AA6CM,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAgD;AAKrF,MAAM,4CAAY,WAAW,GAAG,CAAA,GAAA,mDAAsB,EAAE,SAAS,UAAU,KAAqB,EAAE,GAAiC;IACxI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,CAAC,OAAO,SAAoB,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,UAAU,CAAA,GAAA,2CAAgB;IAChF,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,CAAC,kBAAkB,oBAAoB,GAAG,CAAA,GAAA,qBAAO,EAAE;IACvD,IAAI,cAAC,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAO;QACnG,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;0BAC9B;eACA;4BACA;IACF,GAAG;IAEH,oFAAoF;IACpF,6DAA6D;IAC7D,IAAI,qBAAqB,CAAA,GAAA,wBAAU,EAAE,CAAC;QACpC,SAAS,OAAO,GAAG;QACnB,IAAI,IACF,oBAAoB,cAAc,sBAAsB,aAAa;IAEzE,GAAG;QAAC;KAAS;IAEb,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,YAAY,MAAM,UAAU,IAAI;YAChC,WAAW,WAAW,SAAS;YAC/B,YAAY,MAAM,UAAU,IAAI;YAChC,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,WAAW,SAAS,IAAI;QACtC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;qBACnC,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAkB;aAAE;YACxD;gBAAC,CAAA,GAAA,yCAAc;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAkB;aAAE;YAC3D;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,MAAM;oBAAgB,WAAW,WAAW,SAAS;oBAAE,YAAY,MAAM,UAAU,IAAI;gBAAK;aAAE;YAC9G;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;OACA,YAAY,QAAQ;AAI7B","sources":["packages/react-aria-components/src/TextField.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 {AriaTextFieldProps, useTextField} from 'react-aria';\nimport {ContextValue, DOMProps, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {FieldInputContext} from './RSPContexts';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, useCallback, useRef, useState} from 'react';\nimport {TextAreaContext} from './TextArea';\nimport {TextContext} from './Text';\n\nexport interface TextFieldRenderProps {\n /**\n * Whether the text field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the value is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the text field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the text field is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, Omit<DOMProps, 'style' | 'className' | 'children'>, SlotProps, RenderProps<TextFieldRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /** Whether the value is invalid. */\n isInvalid?: boolean\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, HTMLDivElement>>(null);\n\n/**\n * A text field allows a user to enter a plain text value with a keyboard.\n */\nexport const TextField = /*#__PURE__*/ createHideableComponent(function TextField(props: TextFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TextFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let inputRef = useRef<HTMLInputElement>(null);\n [props, inputRef as unknown] = useContextProps(props, inputRef, FieldInputContext);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let [inputElementType, setInputElementType] = useState('input');\n let {labelProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTextField<any>({\n ...removeDataAttributes(props),\n inputElementType,\n label,\n validationBehavior\n }, inputRef);\n\n // Intercept setting the input ref so we can determine what kind of element we have.\n // useTextField uses this to determine what props to include.\n let inputOrTextAreaRef = useCallback((el) => {\n inputRef.current = el;\n if (el) {\n setInputElementType(el instanceof HTMLTextAreaElement ? 'textarea' : 'input');\n }\n }, [inputRef]);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid,\n isReadOnly: props.isReadOnly || false,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-TextField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-readonly={props.isReadOnly || undefined}\n data-required={props.isRequired || undefined}>\n <Provider\n values={[\n [LabelContext, {...labelProps, ref: labelRef}],\n [InputContext, {...inputProps, ref: inputOrTextAreaRef}],\n [TextAreaContext, {...inputProps, ref: inputOrTextAreaRef}],\n [GroupContext, {role: 'presentation', isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"TextField.main.js.map"}