react-aria-components 3.0.0-nightly-fee532d6a-241217 → 3.0.0-nightly-50c7ada5d-241219

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.
@@ -92,12 +92,15 @@ const $b856e6788a7ea5bf$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $3vfYa$react
92
92
  ariaLabelledby,
93
93
  buttonId
94
94
  ]);
95
+ // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).
96
+ // We do this by changing the button's type to button.
95
97
  return /*#__PURE__*/ (0, ($parcel$interopDefault($3vfYa$react))).createElement("button", {
96
98
  ...(0, $3vfYa$reactariautils.filterDOMProps)(props, {
97
99
  propNames: $b856e6788a7ea5bf$var$additionalButtonHTMLAttributes
98
100
  }),
99
101
  ...(0, $3vfYa$reactaria.mergeProps)(buttonProps, focusProps, hoverProps),
100
102
  ...renderProps,
103
+ type: buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type,
101
104
  id: buttonId,
102
105
  ref: ref,
103
106
  "aria-labelledby": ariaLabelledby,
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Button.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 {announce} from '@react-aria/live-announcer';\nimport {\n AriaButtonProps,\n HoverEvents,\n mergeProps,\n useButton,\n useFocusRing,\n useHover,\n useId\n} from 'react-aria';\nimport {\n ContextValue,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {ProgressBarContext} from './ProgressBar';\nimport React, {createContext, ForwardedRef, useEffect, useRef} from 'react';\n\nexport interface ButtonRenderProps {\n /**\n * Whether the button is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the button is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the button is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the button is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the button is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the button is currently in a pending state.\n * @selector [data-pending]\n */\n isPending: boolean\n}\n\nexport interface ButtonProps extends Omit<AriaButtonProps, 'children' | 'href' | 'target' | 'rel' | 'elementType'>, HoverEvents, SlotProps, RenderProps<ButtonRenderProps> {\n /**\n * The `<form>` element to associate the button with.\n * The value of this attribute must be the id of a `<form>` in the same document.\n */\n form?: string,\n /**\n * The URL that processes the information submitted by the button.\n * Overrides the action attribute of the button's form owner.\n */\n formAction?: string,\n /** Indicates how to encode the form data that is submitted. */\n formEncType?: string,\n /** Indicates the HTTP method used to submit the form. */\n formMethod?: string,\n /** Indicates that the form is not to be validated when it is submitted. */\n formNoValidate?: boolean,\n /** Overrides the target attribute of the button's form owner. */\n formTarget?: string,\n /** Submitted as a pair with the button's value as part of the form data. */\n name?: string,\n /** The value associated with the button's name when it's submitted with the form data. */\n value?: string,\n /**\n * Whether the button is in a pending state. This disables press and hover events\n * while retaining focusability, and announces the pending state to screen readers.\n */\n isPending?: boolean\n}\n\ninterface ButtonContextValue extends ButtonProps {\n isPressed?: boolean\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nexport const ButtonContext = createContext<ContextValue<ButtonContextValue, HTMLButtonElement>>({});\n\n/**\n * A button allows a user to perform an action, with mouse, touch, and keyboard interactions.\n */\nexport const Button = /*#__PURE__*/ createHideableComponent(function Button(props: ButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n [props, ref] = useContextProps(props, ref, ButtonContext);\n props = disablePendingProps(props);\n let ctx = props as ButtonContextValue;\n let {isPending} = ctx;\n let {buttonProps, isPressed} = useButton(props, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover({\n ...props,\n isDisabled: props.isDisabled || isPending\n });\n let renderValues = {\n isHovered,\n isPressed: (ctx.isPressed || isPressed) && !isPending,\n isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isPending: isPending ?? false\n };\n\n let renderProps = useRenderProps({\n ...props,\n values: renderValues,\n defaultClassName: 'react-aria-Button'\n });\n\n let buttonId = useId(buttonProps.id);\n let progressId = useId();\n\n let ariaLabelledby = buttonProps['aria-labelledby'];\n if (isPending) {\n // aria-labelledby wins over aria-label\n // https://www.w3.org/TR/accname-1.2/#computation-steps\n if (ariaLabelledby) {\n ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n } else if (buttonProps['aria-label']) {\n ariaLabelledby = `${buttonId} ${progressId}`;\n }\n }\n\n let wasPending = useRef(isPending);\n useEffect(() => {\n let message = {'aria-labelledby': ariaLabelledby || buttonId};\n if (!wasPending.current && isFocused && isPending) {\n announce(message, 'assertive');\n } else if (wasPending.current && isFocused && !isPending) {\n announce(message, 'assertive');\n }\n wasPending.current = isPending;\n }, [isPending, isFocused, ariaLabelledby, buttonId]);\n\n return (\n <button\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n id={buttonId}\n ref={ref}\n aria-labelledby={ariaLabelledby}\n slot={props.slot || undefined}\n aria-disabled={isPending ? 'true' : buttonProps['aria-disabled']}\n data-disabled={props.isDisabled || undefined}\n data-pressed={renderValues.isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-pending={isPending || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <ProgressBarContext.Provider value={{id: progressId}}>\n {renderProps.children}\n </ProgressBarContext.Provider>\n </button>\n );\n});\n\nfunction disablePendingProps(props) {\n // Don't allow interaction while isPending is true\n if (props.isPending) {\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.onClick = undefined;\n props.href = undefined;\n }\n return props;\n}\n"],"names":[],"version":3,"file":"Button.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Button.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 {announce} from '@react-aria/live-announcer';\nimport {\n AriaButtonProps,\n HoverEvents,\n mergeProps,\n useButton,\n useFocusRing,\n useHover,\n useId\n} from 'react-aria';\nimport {\n ContextValue,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {ProgressBarContext} from './ProgressBar';\nimport React, {createContext, ForwardedRef, useEffect, useRef} from 'react';\n\nexport interface ButtonRenderProps {\n /**\n * Whether the button is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the button is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the button is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the button is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the button is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the button is currently in a pending state.\n * @selector [data-pending]\n */\n isPending: boolean\n}\n\nexport interface ButtonProps extends Omit<AriaButtonProps, 'children' | 'href' | 'target' | 'rel' | 'elementType'>, HoverEvents, SlotProps, RenderProps<ButtonRenderProps> {\n /**\n * The `<form>` element to associate the button with.\n * The value of this attribute must be the id of a `<form>` in the same document.\n */\n form?: string,\n /**\n * The URL that processes the information submitted by the button.\n * Overrides the action attribute of the button's form owner.\n */\n formAction?: string,\n /** Indicates how to encode the form data that is submitted. */\n formEncType?: string,\n /** Indicates the HTTP method used to submit the form. */\n formMethod?: string,\n /** Indicates that the form is not to be validated when it is submitted. */\n formNoValidate?: boolean,\n /** Overrides the target attribute of the button's form owner. */\n formTarget?: string,\n /** Submitted as a pair with the button's value as part of the form data. */\n name?: string,\n /** The value associated with the button's name when it's submitted with the form data. */\n value?: string,\n /**\n * Whether the button is in a pending state. This disables press and hover events\n * while retaining focusability, and announces the pending state to screen readers.\n */\n isPending?: boolean\n}\n\ninterface ButtonContextValue extends ButtonProps {\n isPressed?: boolean\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nexport const ButtonContext = createContext<ContextValue<ButtonContextValue, HTMLButtonElement>>({});\n\n/**\n * A button allows a user to perform an action, with mouse, touch, and keyboard interactions.\n */\nexport const Button = /*#__PURE__*/ createHideableComponent(function Button(props: ButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n [props, ref] = useContextProps(props, ref, ButtonContext);\n props = disablePendingProps(props);\n let ctx = props as ButtonContextValue;\n let {isPending} = ctx;\n let {buttonProps, isPressed} = useButton(props, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover({\n ...props,\n isDisabled: props.isDisabled || isPending\n });\n let renderValues = {\n isHovered,\n isPressed: (ctx.isPressed || isPressed) && !isPending,\n isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isPending: isPending ?? false\n };\n\n let renderProps = useRenderProps({\n ...props,\n values: renderValues,\n defaultClassName: 'react-aria-Button'\n });\n\n let buttonId = useId(buttonProps.id);\n let progressId = useId();\n\n let ariaLabelledby = buttonProps['aria-labelledby'];\n if (isPending) {\n // aria-labelledby wins over aria-label\n // https://www.w3.org/TR/accname-1.2/#computation-steps\n if (ariaLabelledby) {\n ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n } else if (buttonProps['aria-label']) {\n ariaLabelledby = `${buttonId} ${progressId}`;\n }\n }\n\n let wasPending = useRef(isPending);\n useEffect(() => {\n let message = {'aria-labelledby': ariaLabelledby || buttonId};\n if (!wasPending.current && isFocused && isPending) {\n announce(message, 'assertive');\n } else if (wasPending.current && isFocused && !isPending) {\n announce(message, 'assertive');\n }\n wasPending.current = isPending;\n }, [isPending, isFocused, ariaLabelledby, buttonId]);\n\n // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).\n // We do this by changing the button's type to button.\n return (\n <button\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n type={buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type}\n id={buttonId}\n ref={ref}\n aria-labelledby={ariaLabelledby}\n slot={props.slot || undefined}\n aria-disabled={isPending ? 'true' : buttonProps['aria-disabled']}\n data-disabled={props.isDisabled || undefined}\n data-pressed={renderValues.isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-pending={isPending || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <ProgressBarContext.Provider value={{id: progressId}}>\n {renderProps.children}\n </ProgressBarContext.Provider>\n </button>\n );\n});\n\nfunction disablePendingProps(props) {\n // Don't allow interaction while isPending is true\n if (props.isPending) {\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.onClick = undefined;\n props.href = undefined;\n }\n return props;\n}\n"],"names":[],"version":3,"file":"Button.main.js.map"}
package/dist/Button.mjs CHANGED
@@ -81,12 +81,15 @@ const $d2b4bc8c273e7be6$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $fM325$creat
81
81
  ariaLabelledby,
82
82
  buttonId
83
83
  ]);
84
+ // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).
85
+ // We do this by changing the button's type to button.
84
86
  return /*#__PURE__*/ (0, $fM325$react).createElement("button", {
85
87
  ...(0, $fM325$filterDOMProps)(props, {
86
88
  propNames: $d2b4bc8c273e7be6$var$additionalButtonHTMLAttributes
87
89
  }),
88
90
  ...(0, $fM325$mergeProps)(buttonProps, focusProps, hoverProps),
89
91
  ...renderProps,
92
+ type: buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type,
90
93
  id: buttonId,
91
94
  ref: ref,
92
95
  "aria-labelledby": ariaLabelledby,
@@ -81,12 +81,15 @@ const $d2b4bc8c273e7be6$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $fM325$creat
81
81
  ariaLabelledby,
82
82
  buttonId
83
83
  ]);
84
+ // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).
85
+ // We do this by changing the button's type to button.
84
86
  return /*#__PURE__*/ (0, $fM325$react).createElement("button", {
85
87
  ...(0, $fM325$filterDOMProps)(props, {
86
88
  propNames: $d2b4bc8c273e7be6$var$additionalButtonHTMLAttributes
87
89
  }),
88
90
  ...(0, $fM325$mergeProps)(buttonProps, focusProps, hoverProps),
89
91
  ...renderProps,
92
+ type: buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type,
90
93
  id: buttonId,
91
94
  ref: ref,
92
95
  "aria-labelledby": ariaLabelledby,
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Button.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 {announce} from '@react-aria/live-announcer';\nimport {\n AriaButtonProps,\n HoverEvents,\n mergeProps,\n useButton,\n useFocusRing,\n useHover,\n useId\n} from 'react-aria';\nimport {\n ContextValue,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {ProgressBarContext} from './ProgressBar';\nimport React, {createContext, ForwardedRef, useEffect, useRef} from 'react';\n\nexport interface ButtonRenderProps {\n /**\n * Whether the button is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the button is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the button is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the button is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the button is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the button is currently in a pending state.\n * @selector [data-pending]\n */\n isPending: boolean\n}\n\nexport interface ButtonProps extends Omit<AriaButtonProps, 'children' | 'href' | 'target' | 'rel' | 'elementType'>, HoverEvents, SlotProps, RenderProps<ButtonRenderProps> {\n /**\n * The `<form>` element to associate the button with.\n * The value of this attribute must be the id of a `<form>` in the same document.\n */\n form?: string,\n /**\n * The URL that processes the information submitted by the button.\n * Overrides the action attribute of the button's form owner.\n */\n formAction?: string,\n /** Indicates how to encode the form data that is submitted. */\n formEncType?: string,\n /** Indicates the HTTP method used to submit the form. */\n formMethod?: string,\n /** Indicates that the form is not to be validated when it is submitted. */\n formNoValidate?: boolean,\n /** Overrides the target attribute of the button's form owner. */\n formTarget?: string,\n /** Submitted as a pair with the button's value as part of the form data. */\n name?: string,\n /** The value associated with the button's name when it's submitted with the form data. */\n value?: string,\n /**\n * Whether the button is in a pending state. This disables press and hover events\n * while retaining focusability, and announces the pending state to screen readers.\n */\n isPending?: boolean\n}\n\ninterface ButtonContextValue extends ButtonProps {\n isPressed?: boolean\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nexport const ButtonContext = createContext<ContextValue<ButtonContextValue, HTMLButtonElement>>({});\n\n/**\n * A button allows a user to perform an action, with mouse, touch, and keyboard interactions.\n */\nexport const Button = /*#__PURE__*/ createHideableComponent(function Button(props: ButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n [props, ref] = useContextProps(props, ref, ButtonContext);\n props = disablePendingProps(props);\n let ctx = props as ButtonContextValue;\n let {isPending} = ctx;\n let {buttonProps, isPressed} = useButton(props, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover({\n ...props,\n isDisabled: props.isDisabled || isPending\n });\n let renderValues = {\n isHovered,\n isPressed: (ctx.isPressed || isPressed) && !isPending,\n isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isPending: isPending ?? false\n };\n\n let renderProps = useRenderProps({\n ...props,\n values: renderValues,\n defaultClassName: 'react-aria-Button'\n });\n\n let buttonId = useId(buttonProps.id);\n let progressId = useId();\n\n let ariaLabelledby = buttonProps['aria-labelledby'];\n if (isPending) {\n // aria-labelledby wins over aria-label\n // https://www.w3.org/TR/accname-1.2/#computation-steps\n if (ariaLabelledby) {\n ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n } else if (buttonProps['aria-label']) {\n ariaLabelledby = `${buttonId} ${progressId}`;\n }\n }\n\n let wasPending = useRef(isPending);\n useEffect(() => {\n let message = {'aria-labelledby': ariaLabelledby || buttonId};\n if (!wasPending.current && isFocused && isPending) {\n announce(message, 'assertive');\n } else if (wasPending.current && isFocused && !isPending) {\n announce(message, 'assertive');\n }\n wasPending.current = isPending;\n }, [isPending, isFocused, ariaLabelledby, buttonId]);\n\n return (\n <button\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n id={buttonId}\n ref={ref}\n aria-labelledby={ariaLabelledby}\n slot={props.slot || undefined}\n aria-disabled={isPending ? 'true' : buttonProps['aria-disabled']}\n data-disabled={props.isDisabled || undefined}\n data-pressed={renderValues.isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-pending={isPending || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <ProgressBarContext.Provider value={{id: progressId}}>\n {renderProps.children}\n </ProgressBarContext.Provider>\n </button>\n );\n});\n\nfunction disablePendingProps(props) {\n // Don't allow interaction while isPending is true\n if (props.isPending) {\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.onClick = undefined;\n props.href = undefined;\n }\n return props;\n}\n"],"names":[],"version":3,"file":"Button.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Button.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 {announce} from '@react-aria/live-announcer';\nimport {\n AriaButtonProps,\n HoverEvents,\n mergeProps,\n useButton,\n useFocusRing,\n useHover,\n useId\n} from 'react-aria';\nimport {\n ContextValue,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {ProgressBarContext} from './ProgressBar';\nimport React, {createContext, ForwardedRef, useEffect, useRef} from 'react';\n\nexport interface ButtonRenderProps {\n /**\n * Whether the button is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the button is currently in a pressed state.\n * @selector [data-pressed]\n */\n isPressed: boolean,\n /**\n * Whether the button is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the button is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the button is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the button is currently in a pending state.\n * @selector [data-pending]\n */\n isPending: boolean\n}\n\nexport interface ButtonProps extends Omit<AriaButtonProps, 'children' | 'href' | 'target' | 'rel' | 'elementType'>, HoverEvents, SlotProps, RenderProps<ButtonRenderProps> {\n /**\n * The `<form>` element to associate the button with.\n * The value of this attribute must be the id of a `<form>` in the same document.\n */\n form?: string,\n /**\n * The URL that processes the information submitted by the button.\n * Overrides the action attribute of the button's form owner.\n */\n formAction?: string,\n /** Indicates how to encode the form data that is submitted. */\n formEncType?: string,\n /** Indicates the HTTP method used to submit the form. */\n formMethod?: string,\n /** Indicates that the form is not to be validated when it is submitted. */\n formNoValidate?: boolean,\n /** Overrides the target attribute of the button's form owner. */\n formTarget?: string,\n /** Submitted as a pair with the button's value as part of the form data. */\n name?: string,\n /** The value associated with the button's name when it's submitted with the form data. */\n value?: string,\n /**\n * Whether the button is in a pending state. This disables press and hover events\n * while retaining focusability, and announces the pending state to screen readers.\n */\n isPending?: boolean\n}\n\ninterface ButtonContextValue extends ButtonProps {\n isPressed?: boolean\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nexport const ButtonContext = createContext<ContextValue<ButtonContextValue, HTMLButtonElement>>({});\n\n/**\n * A button allows a user to perform an action, with mouse, touch, and keyboard interactions.\n */\nexport const Button = /*#__PURE__*/ createHideableComponent(function Button(props: ButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n [props, ref] = useContextProps(props, ref, ButtonContext);\n props = disablePendingProps(props);\n let ctx = props as ButtonContextValue;\n let {isPending} = ctx;\n let {buttonProps, isPressed} = useButton(props, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover({\n ...props,\n isDisabled: props.isDisabled || isPending\n });\n let renderValues = {\n isHovered,\n isPressed: (ctx.isPressed || isPressed) && !isPending,\n isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isPending: isPending ?? false\n };\n\n let renderProps = useRenderProps({\n ...props,\n values: renderValues,\n defaultClassName: 'react-aria-Button'\n });\n\n let buttonId = useId(buttonProps.id);\n let progressId = useId();\n\n let ariaLabelledby = buttonProps['aria-labelledby'];\n if (isPending) {\n // aria-labelledby wins over aria-label\n // https://www.w3.org/TR/accname-1.2/#computation-steps\n if (ariaLabelledby) {\n ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n } else if (buttonProps['aria-label']) {\n ariaLabelledby = `${buttonId} ${progressId}`;\n }\n }\n\n let wasPending = useRef(isPending);\n useEffect(() => {\n let message = {'aria-labelledby': ariaLabelledby || buttonId};\n if (!wasPending.current && isFocused && isPending) {\n announce(message, 'assertive');\n } else if (wasPending.current && isFocused && !isPending) {\n announce(message, 'assertive');\n }\n wasPending.current = isPending;\n }, [isPending, isFocused, ariaLabelledby, buttonId]);\n\n // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).\n // We do this by changing the button's type to button.\n return (\n <button\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n type={buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type}\n id={buttonId}\n ref={ref}\n aria-labelledby={ariaLabelledby}\n slot={props.slot || undefined}\n aria-disabled={isPending ? 'true' : buttonProps['aria-disabled']}\n data-disabled={props.isDisabled || undefined}\n data-pressed={renderValues.isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-pending={isPending || undefined}\n data-focus-visible={isFocusVisible || undefined}>\n <ProgressBarContext.Provider value={{id: progressId}}>\n {renderProps.children}\n </ProgressBarContext.Provider>\n </button>\n );\n});\n\nfunction disablePendingProps(props) {\n // Don't allow interaction while isPending is true\n if (props.isPending) {\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.onClick = undefined;\n props.href = undefined;\n }\n return props;\n}\n"],"names":[],"version":3,"file":"Button.module.js.map"}
@@ -64,8 +64,8 @@ function $71899cff63e14b82$var$ModalOverlayWithForwardRef(props, ref) {
64
64
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
65
65
  let objectRef = (0, $cIZLj$reactariautils.useObjectRef)(ref);
66
66
  let modalRef = (0, $cIZLj$react.useRef)(null);
67
- let isOverlayExiting = (0, $c5ccf687772c0422$exports.useExitAnimation)(objectRef, state.isOpen);
68
- let isModalExiting = (0, $c5ccf687772c0422$exports.useExitAnimation)(modalRef, state.isOpen);
67
+ let isOverlayExiting = (0, $cIZLj$reactariautils.useExitAnimation)(objectRef, state.isOpen);
68
+ let isModalExiting = (0, $cIZLj$reactariautils.useExitAnimation)(modalRef, state.isOpen);
69
69
  let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;
70
70
  let isSSR = (0, $cIZLj$reactaria.useIsSSR)();
71
71
  if (!state.isOpen && !isExiting || isSSR) return null;
@@ -82,7 +82,7 @@ function $71899cff63e14b82$var$ModalOverlayInner({ UNSTABLE_portalContainer: UNS
82
82
  let modalRef = props.modalRef;
83
83
  let { state: state } = props;
84
84
  let { modalProps: modalProps, underlayProps: underlayProps } = (0, $cIZLj$reactaria.useModalOverlay)(props, state, modalRef);
85
- let entering = (0, $c5ccf687772c0422$exports.useEnterAnimation)(props.overlayRef) || props.isEntering || false;
85
+ let entering = (0, $cIZLj$reactariautils.useEnterAnimation)(props.overlayRef) || props.isEntering || false;
86
86
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
87
87
  ...props,
88
88
  defaultClassName: 'react-aria-ModalOverlay',
@@ -133,7 +133,7 @@ function $71899cff63e14b82$var$ModalContent(props) {
133
133
  modalRef
134
134
  ]);
135
135
  let ref = (0, $cIZLj$reactariautils.useObjectRef)(mergedRefs);
136
- let entering = (0, $c5ccf687772c0422$exports.useEnterAnimation)(ref);
136
+ let entering = (0, $cIZLj$reactariautils.useEnterAnimation)(ref);
137
137
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
138
138
  ...props,
139
139
  defaultClassName: 'react-aria-Modal',
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAiCM,MAAM,0DAAe,CAAA,GAAA,0BAAY,EAAmD;AAC3F,MAAM,2DAAuB,CAAA,GAAA,0BAAY,EAAoC;AAsBtE,MAAM,4CAAsB,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,MAAM,KAAwB,EAAE,GAAiC;IAC1I,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IAErB,IAAI,KACF,qBAAO,0DAAC;QAAc,GAAG,KAAK;QAAE,UAAU;OAAM,MAAM,QAAQ;IAGhE,IAAI,iBACF,aAAa,6BACb,yBAAyB,UACzB,MAAM,eACN,WAAW,gBACX,YAAY,YACZ,QAAQ,cACR,UAAU,aACV,SAAS,4BACT,wBAAwB,gCACxB,4BAA4B,EAC5B,GAAG,YACJ,GAAG;IAEJ,qBACE,0DAAC;QACC,eAAe;QACf,2BAA2B;QAC3B,QAAQ;QACR,aAAa;QACb,cAAc;QACd,YAAY;QACZ,WAAW;QACX,0BAA0B;QAC1B,8BAA8B;qBAC9B,0DAAC;QAAc,GAAG,UAAU;QAAE,UAAU;OACrC;AAIT;AASA,SAAS,iDAA2B,KAAwB,EAAE,GAAiC;IAC7F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,eAAe,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,oDAAyB;IACvD,IAAI,aAAa,CAAA,GAAA,0CAAqB,EAAE;IACxC,IAAI,QAAQ,MAAM,MAAM,IAAI,QAAQ,MAAM,WAAW,IAAI,QAAQ,CAAC,eAAe,aAAa;IAE9F,IAAI,YAAY,CAAA,GAAA,kCAAW,EAAE;IAC7B,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAkB;IACtC,IAAI,mBAAmB,CAAA,GAAA,0CAAe,EAAE,WAAW,MAAM,MAAM;IAC/D,IAAI,iBAAiB,CAAA,GAAA,0CAAe,EAAE,UAAU,MAAM,MAAM;IAC5D,IAAI,YAAY,oBAAoB,kBAAkB,MAAM,SAAS,IAAI;IACzE,IAAI,QAAQ,CAAA,GAAA,yBAAO;IAEnB,IAAI,AAAC,CAAC,MAAM,MAAM,IAAI,CAAC,aAAc,OACnC,OAAO;IAGT,qBACE,0DAAC;QACE,GAAG,KAAK;QACT,OAAO;QACP,WAAW;QACX,YAAY;QACZ,UAAU;;AAEhB;AAKO,MAAM,4CAA6B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB;AAEzE,SAAS,wCAAkB,4BAAC,wBAAwB,EAAE,GAAG,OAA8B;IACrF,IAAI,WAAW,MAAM,QAAQ;IAC7B,IAAI,SAAC,KAAK,EAAC,GAAG;IACd,IAAI,cAAC,UAAU,iBAAE,aAAa,EAAC,GAAG,CAAA,GAAA,gCAAc,EAAE,OAAO,OAAO;IAEhE,IAAI,WAAW,CAAA,GAAA,2CAAgB,EAAE,MAAM,UAAU,KAAK,MAAM,UAAU,IAAI;IAC1E,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,QAAQ;YACN,YAAY;YACZ,WAAW,MAAM,SAAS;mBAC1B;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,qCAAc;IAC7B,IAAI,QAAQ;QACV,GAAG,YAAY,KAAK;QACpB,4BAA4B,SAAS,MAAM,GAAG;IAChD;IAEA,qBACE,0DAAC,CAAA,GAAA,wBAAM;QAAE,WAAW,MAAM,SAAS;QAAE,iBAAiB;qBACpD,0DAAC;QACE,GAAG,CAAA,GAAA,gCAAS,EAAE,CAAA,GAAA,oCAAa,EAAE,QAAe,cAAc;QAC1D,GAAG,WAAW;QACf,OAAO;QACP,KAAK,MAAM,UAAU;QACrB,iBAAe,YAAY;QAC3B,gBAAc,MAAM,SAAS,IAAI;qBACjC,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAsB;gCAAC;8BAAY;oBAAU,WAAW,MAAM,SAAS;oBAAE,eAAe,MAAM,aAAa;gBAAA;aAAE;YAC9G;gBAAC,CAAA,GAAA,oDAAyB;gBAAG;aAAM;SACpC;OACA,YAAY,QAAQ;AAK/B;AAMA,SAAS,mCAAa,KAAwB;IAC5C,IAAI,cAAC,UAAU,YAAE,QAAQ,aAAE,SAAS,iBAAE,aAAa,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IAClE,IAAI,QAAQ,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,oDAAyB;IAChD,IAAI,aAAa,CAAA,GAAA,oBAAM,EAAE,IAAM,CAAA,GAAA,+BAAQ,EAAE,MAAM,QAAQ,EAAE,WAAW;QAAC,MAAM,QAAQ;QAAE;KAAS;IAE9F,IAAI,MAAM,CAAA,GAAA,kCAAW,EAAE;IACvB,IAAI,WAAW,CAAA,GAAA,2CAAgB,EAAE;IACjC,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,QAAQ;YACN,YAAY;uBACZ;mBACA;QACF;IACF;IAEA,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,gCAAS,EAAE,CAAA,GAAA,oCAAa,EAAE,QAAe,WAAW;QACvD,GAAG,WAAW;QACf,KAAK;QACL,iBAAe,YAAY;QAC3B,gBAAc,aAAa;OAC1B,+BACC,0DAAC,CAAA,GAAA,8BAAY;QAAE,WAAW,MAAM,KAAK;QAEtC,YAAY,QAAQ;AAG3B","sources":["packages/react-aria-components/src/Modal.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 {AriaModalOverlayProps, DismissButton, Overlay, useIsSSR, useModalOverlay} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, SlotProps, useContextProps, useEnterAnimation, useExitAnimation, useRenderProps} from './utils';\nimport {DOMAttributes, forwardRefType, RefObject} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, mergeRefs, useObjectRef, useViewportSize} from '@react-aria/utils';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useMemo, useRef} from 'react';\n\nexport interface ModalOverlayProps extends AriaModalOverlayProps, OverlayTriggerProps, RenderProps<ModalRenderProps>, SlotProps {\n /**\n * Whether the modal is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the modal is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element\n}\n\ninterface InternalModalContextValue {\n modalProps: DOMAttributes,\n modalRef: RefObject<HTMLDivElement | null>,\n isExiting: boolean,\n isDismissable?: boolean\n}\n\nexport const ModalContext = createContext<ContextValue<ModalOverlayProps, HTMLDivElement>>(null);\nconst InternalModalContext = createContext<InternalModalContextValue | null>(null);\n\nexport interface ModalRenderProps {\n /**\n * Whether the modal is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the modal is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the modal.\n */\n state: OverlayTriggerState\n}\n\n/**\n * A modal is an overlay element which blocks interaction with elements outside it.\n */\nexport const Modal = /*#__PURE__*/ (forwardRef as forwardRefType)(function Modal(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n let ctx = useContext(InternalModalContext);\n\n if (ctx) {\n return <ModalContent {...props} modalRef={ref}>{props.children}</ModalContent>;\n }\n\n let {\n isDismissable,\n isKeyboardDismissDisabled,\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n isEntering,\n isExiting,\n UNSTABLE_portalContainer,\n shouldCloseOnInteractOutside,\n ...otherProps\n } = props;\n\n return (\n <ModalOverlay\n isDismissable={isDismissable}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n isOpen={isOpen}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n isEntering={isEntering}\n isExiting={isExiting}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}>\n <ModalContent {...otherProps} modalRef={ref}>\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n});\n\ninterface ModalOverlayInnerProps extends ModalOverlayProps {\n overlayRef: RefObject<HTMLDivElement | null>,\n modalRef: RefObject<HTMLDivElement | null>,\n state: OverlayTriggerState,\n isExiting: boolean\n}\n\nfunction ModalOverlayWithForwardRef(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ModalContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n\n let objectRef = useObjectRef(ref);\n let modalRef = useRef<HTMLDivElement>(null);\n let isOverlayExiting = useExitAnimation(objectRef, state.isOpen);\n let isModalExiting = useExitAnimation(modalRef, state.isOpen);\n let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;\n let isSSR = useIsSSR();\n\n if ((!state.isOpen && !isExiting) || isSSR) {\n return null;\n }\n\n return (\n <ModalOverlayInner\n {...props}\n state={state}\n isExiting={isExiting}\n overlayRef={objectRef}\n modalRef={modalRef} />\n );\n}\n\n/**\n * A ModalOverlay is a wrapper for a Modal which allows customizing the backdrop element.\n */\nexport const ModalOverlay = /*#__PURE__*/ (forwardRef as forwardRefType)(ModalOverlayWithForwardRef);\n\nfunction ModalOverlayInner({UNSTABLE_portalContainer, ...props}: ModalOverlayInnerProps) {\n let modalRef = props.modalRef;\n let {state} = props;\n let {modalProps, underlayProps} = useModalOverlay(props, state, modalRef);\n\n let entering = useEnterAnimation(props.overlayRef) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-ModalOverlay',\n values: {\n isEntering: entering,\n isExiting: props.isExiting,\n state\n }\n });\n\n let viewport = useViewportSize();\n let style = {\n ...renderProps.style,\n '--visual-viewport-height': viewport.height + 'px'\n };\n\n return (\n <Overlay isExiting={props.isExiting} portalContainer={UNSTABLE_portalContainer}>\n <div\n {...mergeProps(filterDOMProps(props as any), underlayProps)}\n {...renderProps}\n style={style}\n ref={props.overlayRef}\n data-entering={entering || undefined}\n data-exiting={props.isExiting || undefined}>\n <Provider\n values={[\n [InternalModalContext, {modalProps, modalRef, isExiting: props.isExiting, isDismissable: props.isDismissable}],\n [OverlayTriggerStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </Overlay>\n );\n}\n\ninterface ModalContentProps extends RenderProps<ModalRenderProps> {\n modalRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ModalContent(props: ModalContentProps) {\n let {modalProps, modalRef, isExiting, isDismissable} = useContext(InternalModalContext)!;\n let state = useContext(OverlayTriggerStateContext)!;\n let mergedRefs = useMemo(() => mergeRefs(props.modalRef, modalRef), [props.modalRef, modalRef]);\n\n let ref = useObjectRef(mergedRefs);\n let entering = useEnterAnimation(ref);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Modal',\n values: {\n isEntering: entering,\n isExiting,\n state\n }\n });\n\n return (\n <div\n {...mergeProps(filterDOMProps(props as any), modalProps)}\n {...renderProps}\n ref={ref}\n data-entering={entering || undefined}\n data-exiting={isExiting || undefined}>\n {isDismissable &&\n <DismissButton onDismiss={state.close} />\n }\n {renderProps.children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Modal.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Modal.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 {AriaModalOverlayProps, DismissButton, Overlay, useIsSSR, useModalOverlay} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, SlotProps, useContextProps, useRenderProps} from './utils';\nimport {DOMAttributes, forwardRefType, RefObject} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, mergeRefs, useEnterAnimation, useExitAnimation, useObjectRef, useViewportSize} from '@react-aria/utils';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useMemo, useRef} from 'react';\n\nexport interface ModalOverlayProps extends AriaModalOverlayProps, OverlayTriggerProps, RenderProps<ModalRenderProps>, SlotProps {\n /**\n * Whether the modal is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the modal is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element\n}\n\ninterface InternalModalContextValue {\n modalProps: DOMAttributes,\n modalRef: RefObject<HTMLDivElement | null>,\n isExiting: boolean,\n isDismissable?: boolean\n}\n\nexport const ModalContext = createContext<ContextValue<ModalOverlayProps, HTMLDivElement>>(null);\nconst InternalModalContext = createContext<InternalModalContextValue | null>(null);\n\nexport interface ModalRenderProps {\n /**\n * Whether the modal is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the modal is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the modal.\n */\n state: OverlayTriggerState\n}\n\n/**\n * A modal is an overlay element which blocks interaction with elements outside it.\n */\nexport const Modal = /*#__PURE__*/ (forwardRef as forwardRefType)(function Modal(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n let ctx = useContext(InternalModalContext);\n\n if (ctx) {\n return <ModalContent {...props} modalRef={ref}>{props.children}</ModalContent>;\n }\n\n let {\n isDismissable,\n isKeyboardDismissDisabled,\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n isEntering,\n isExiting,\n UNSTABLE_portalContainer,\n shouldCloseOnInteractOutside,\n ...otherProps\n } = props;\n\n return (\n <ModalOverlay\n isDismissable={isDismissable}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n isOpen={isOpen}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n isEntering={isEntering}\n isExiting={isExiting}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}>\n <ModalContent {...otherProps} modalRef={ref}>\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n});\n\ninterface ModalOverlayInnerProps extends ModalOverlayProps {\n overlayRef: RefObject<HTMLDivElement | null>,\n modalRef: RefObject<HTMLDivElement | null>,\n state: OverlayTriggerState,\n isExiting: boolean\n}\n\nfunction ModalOverlayWithForwardRef(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ModalContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n\n let objectRef = useObjectRef(ref);\n let modalRef = useRef<HTMLDivElement>(null);\n let isOverlayExiting = useExitAnimation(objectRef, state.isOpen);\n let isModalExiting = useExitAnimation(modalRef, state.isOpen);\n let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;\n let isSSR = useIsSSR();\n\n if ((!state.isOpen && !isExiting) || isSSR) {\n return null;\n }\n\n return (\n <ModalOverlayInner\n {...props}\n state={state}\n isExiting={isExiting}\n overlayRef={objectRef}\n modalRef={modalRef} />\n );\n}\n\n/**\n * A ModalOverlay is a wrapper for a Modal which allows customizing the backdrop element.\n */\nexport const ModalOverlay = /*#__PURE__*/ (forwardRef as forwardRefType)(ModalOverlayWithForwardRef);\n\nfunction ModalOverlayInner({UNSTABLE_portalContainer, ...props}: ModalOverlayInnerProps) {\n let modalRef = props.modalRef;\n let {state} = props;\n let {modalProps, underlayProps} = useModalOverlay(props, state, modalRef);\n\n let entering = useEnterAnimation(props.overlayRef) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-ModalOverlay',\n values: {\n isEntering: entering,\n isExiting: props.isExiting,\n state\n }\n });\n\n let viewport = useViewportSize();\n let style = {\n ...renderProps.style,\n '--visual-viewport-height': viewport.height + 'px'\n };\n\n return (\n <Overlay isExiting={props.isExiting} portalContainer={UNSTABLE_portalContainer}>\n <div\n {...mergeProps(filterDOMProps(props as any), underlayProps)}\n {...renderProps}\n style={style}\n ref={props.overlayRef}\n data-entering={entering || undefined}\n data-exiting={props.isExiting || undefined}>\n <Provider\n values={[\n [InternalModalContext, {modalProps, modalRef, isExiting: props.isExiting, isDismissable: props.isDismissable}],\n [OverlayTriggerStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </Overlay>\n );\n}\n\ninterface ModalContentProps extends RenderProps<ModalRenderProps> {\n modalRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ModalContent(props: ModalContentProps) {\n let {modalProps, modalRef, isExiting, isDismissable} = useContext(InternalModalContext)!;\n let state = useContext(OverlayTriggerStateContext)!;\n let mergedRefs = useMemo(() => mergeRefs(props.modalRef, modalRef), [props.modalRef, modalRef]);\n\n let ref = useObjectRef(mergedRefs);\n let entering = useEnterAnimation(ref);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Modal',\n values: {\n isEntering: entering,\n isExiting,\n state\n }\n });\n\n return (\n <div\n {...mergeProps(filterDOMProps(props as any), modalProps)}\n {...renderProps}\n ref={ref}\n data-entering={entering || undefined}\n data-exiting={isExiting || undefined}>\n {isDismissable &&\n <DismissButton onDismiss={state.close} />\n }\n {renderProps.children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Modal.main.js.map"}
package/dist/Modal.mjs CHANGED
@@ -1,7 +1,7 @@
1
- import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useEnterAnimation as $64fa3d84918910a7$export$6d3443f2c48bfc20, useExitAnimation as $64fa3d84918910a7$export$45fda7c47f93fd48, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
1
+ import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
2
2
  import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.mjs";
3
3
  import {useIsSSR as $daTMi$useIsSSR, useModalOverlay as $daTMi$useModalOverlay, Overlay as $daTMi$Overlay, DismissButton as $daTMi$DismissButton} from "react-aria";
4
- import {useObjectRef as $daTMi$useObjectRef, useViewportSize as $daTMi$useViewportSize, mergeProps as $daTMi$mergeProps, filterDOMProps as $daTMi$filterDOMProps, mergeRefs as $daTMi$mergeRefs} from "@react-aria/utils";
4
+ import {useObjectRef as $daTMi$useObjectRef, useExitAnimation as $daTMi$useExitAnimation, useEnterAnimation as $daTMi$useEnterAnimation, useViewportSize as $daTMi$useViewportSize, mergeProps as $daTMi$mergeProps, filterDOMProps as $daTMi$filterDOMProps, mergeRefs as $daTMi$mergeRefs} from "@react-aria/utils";
5
5
  import {useOverlayTriggerState as $daTMi$useOverlayTriggerState} from "react-stately";
6
6
  import $daTMi$react, {createContext as $daTMi$createContext, forwardRef as $daTMi$forwardRef, useContext as $daTMi$useContext, useRef as $daTMi$useRef, useMemo as $daTMi$useMemo} from "react";
7
7
 
@@ -52,8 +52,8 @@ function $f3f84453ead64de5$var$ModalOverlayWithForwardRef(props, ref) {
52
52
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
53
53
  let objectRef = (0, $daTMi$useObjectRef)(ref);
54
54
  let modalRef = (0, $daTMi$useRef)(null);
55
- let isOverlayExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(objectRef, state.isOpen);
56
- let isModalExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(modalRef, state.isOpen);
55
+ let isOverlayExiting = (0, $daTMi$useExitAnimation)(objectRef, state.isOpen);
56
+ let isModalExiting = (0, $daTMi$useExitAnimation)(modalRef, state.isOpen);
57
57
  let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;
58
58
  let isSSR = (0, $daTMi$useIsSSR)();
59
59
  if (!state.isOpen && !isExiting || isSSR) return null;
@@ -70,7 +70,7 @@ function $f3f84453ead64de5$var$ModalOverlayInner({ UNSTABLE_portalContainer: UNS
70
70
  let modalRef = props.modalRef;
71
71
  let { state: state } = props;
72
72
  let { modalProps: modalProps, underlayProps: underlayProps } = (0, $daTMi$useModalOverlay)(props, state, modalRef);
73
- let entering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(props.overlayRef) || props.isEntering || false;
73
+ let entering = (0, $daTMi$useEnterAnimation)(props.overlayRef) || props.isEntering || false;
74
74
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
75
75
  ...props,
76
76
  defaultClassName: 'react-aria-ModalOverlay',
@@ -121,7 +121,7 @@ function $f3f84453ead64de5$var$ModalContent(props) {
121
121
  modalRef
122
122
  ]);
123
123
  let ref = (0, $daTMi$useObjectRef)(mergedRefs);
124
- let entering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(ref);
124
+ let entering = (0, $daTMi$useEnterAnimation)(ref);
125
125
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
126
126
  ...props,
127
127
  defaultClassName: 'react-aria-Modal',
@@ -1,7 +1,7 @@
1
- import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useEnterAnimation as $64fa3d84918910a7$export$6d3443f2c48bfc20, useExitAnimation as $64fa3d84918910a7$export$45fda7c47f93fd48, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
1
+ import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
2
2
  import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.module.js";
3
3
  import {useIsSSR as $daTMi$useIsSSR, useModalOverlay as $daTMi$useModalOverlay, Overlay as $daTMi$Overlay, DismissButton as $daTMi$DismissButton} from "react-aria";
4
- import {useObjectRef as $daTMi$useObjectRef, useViewportSize as $daTMi$useViewportSize, mergeProps as $daTMi$mergeProps, filterDOMProps as $daTMi$filterDOMProps, mergeRefs as $daTMi$mergeRefs} from "@react-aria/utils";
4
+ import {useObjectRef as $daTMi$useObjectRef, useExitAnimation as $daTMi$useExitAnimation, useEnterAnimation as $daTMi$useEnterAnimation, useViewportSize as $daTMi$useViewportSize, mergeProps as $daTMi$mergeProps, filterDOMProps as $daTMi$filterDOMProps, mergeRefs as $daTMi$mergeRefs} from "@react-aria/utils";
5
5
  import {useOverlayTriggerState as $daTMi$useOverlayTriggerState} from "react-stately";
6
6
  import $daTMi$react, {createContext as $daTMi$createContext, forwardRef as $daTMi$forwardRef, useContext as $daTMi$useContext, useRef as $daTMi$useRef, useMemo as $daTMi$useMemo} from "react";
7
7
 
@@ -52,8 +52,8 @@ function $f3f84453ead64de5$var$ModalOverlayWithForwardRef(props, ref) {
52
52
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
53
53
  let objectRef = (0, $daTMi$useObjectRef)(ref);
54
54
  let modalRef = (0, $daTMi$useRef)(null);
55
- let isOverlayExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(objectRef, state.isOpen);
56
- let isModalExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(modalRef, state.isOpen);
55
+ let isOverlayExiting = (0, $daTMi$useExitAnimation)(objectRef, state.isOpen);
56
+ let isModalExiting = (0, $daTMi$useExitAnimation)(modalRef, state.isOpen);
57
57
  let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;
58
58
  let isSSR = (0, $daTMi$useIsSSR)();
59
59
  if (!state.isOpen && !isExiting || isSSR) return null;
@@ -70,7 +70,7 @@ function $f3f84453ead64de5$var$ModalOverlayInner({ UNSTABLE_portalContainer: UNS
70
70
  let modalRef = props.modalRef;
71
71
  let { state: state } = props;
72
72
  let { modalProps: modalProps, underlayProps: underlayProps } = (0, $daTMi$useModalOverlay)(props, state, modalRef);
73
- let entering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(props.overlayRef) || props.isEntering || false;
73
+ let entering = (0, $daTMi$useEnterAnimation)(props.overlayRef) || props.isEntering || false;
74
74
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
75
75
  ...props,
76
76
  defaultClassName: 'react-aria-ModalOverlay',
@@ -121,7 +121,7 @@ function $f3f84453ead64de5$var$ModalContent(props) {
121
121
  modalRef
122
122
  ]);
123
123
  let ref = (0, $daTMi$useObjectRef)(mergedRefs);
124
- let entering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(ref);
124
+ let entering = (0, $daTMi$useEnterAnimation)(ref);
125
125
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
126
126
  ...props,
127
127
  defaultClassName: 'react-aria-Modal',
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Modal.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 {AriaModalOverlayProps, DismissButton, Overlay, useIsSSR, useModalOverlay} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, SlotProps, useContextProps, useEnterAnimation, useExitAnimation, useRenderProps} from './utils';\nimport {DOMAttributes, forwardRefType, RefObject} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, mergeRefs, useObjectRef, useViewportSize} from '@react-aria/utils';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useMemo, useRef} from 'react';\n\nexport interface ModalOverlayProps extends AriaModalOverlayProps, OverlayTriggerProps, RenderProps<ModalRenderProps>, SlotProps {\n /**\n * Whether the modal is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the modal is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element\n}\n\ninterface InternalModalContextValue {\n modalProps: DOMAttributes,\n modalRef: RefObject<HTMLDivElement | null>,\n isExiting: boolean,\n isDismissable?: boolean\n}\n\nexport const ModalContext = createContext<ContextValue<ModalOverlayProps, HTMLDivElement>>(null);\nconst InternalModalContext = createContext<InternalModalContextValue | null>(null);\n\nexport interface ModalRenderProps {\n /**\n * Whether the modal is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the modal is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the modal.\n */\n state: OverlayTriggerState\n}\n\n/**\n * A modal is an overlay element which blocks interaction with elements outside it.\n */\nexport const Modal = /*#__PURE__*/ (forwardRef as forwardRefType)(function Modal(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n let ctx = useContext(InternalModalContext);\n\n if (ctx) {\n return <ModalContent {...props} modalRef={ref}>{props.children}</ModalContent>;\n }\n\n let {\n isDismissable,\n isKeyboardDismissDisabled,\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n isEntering,\n isExiting,\n UNSTABLE_portalContainer,\n shouldCloseOnInteractOutside,\n ...otherProps\n } = props;\n\n return (\n <ModalOverlay\n isDismissable={isDismissable}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n isOpen={isOpen}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n isEntering={isEntering}\n isExiting={isExiting}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}>\n <ModalContent {...otherProps} modalRef={ref}>\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n});\n\ninterface ModalOverlayInnerProps extends ModalOverlayProps {\n overlayRef: RefObject<HTMLDivElement | null>,\n modalRef: RefObject<HTMLDivElement | null>,\n state: OverlayTriggerState,\n isExiting: boolean\n}\n\nfunction ModalOverlayWithForwardRef(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ModalContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n\n let objectRef = useObjectRef(ref);\n let modalRef = useRef<HTMLDivElement>(null);\n let isOverlayExiting = useExitAnimation(objectRef, state.isOpen);\n let isModalExiting = useExitAnimation(modalRef, state.isOpen);\n let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;\n let isSSR = useIsSSR();\n\n if ((!state.isOpen && !isExiting) || isSSR) {\n return null;\n }\n\n return (\n <ModalOverlayInner\n {...props}\n state={state}\n isExiting={isExiting}\n overlayRef={objectRef}\n modalRef={modalRef} />\n );\n}\n\n/**\n * A ModalOverlay is a wrapper for a Modal which allows customizing the backdrop element.\n */\nexport const ModalOverlay = /*#__PURE__*/ (forwardRef as forwardRefType)(ModalOverlayWithForwardRef);\n\nfunction ModalOverlayInner({UNSTABLE_portalContainer, ...props}: ModalOverlayInnerProps) {\n let modalRef = props.modalRef;\n let {state} = props;\n let {modalProps, underlayProps} = useModalOverlay(props, state, modalRef);\n\n let entering = useEnterAnimation(props.overlayRef) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-ModalOverlay',\n values: {\n isEntering: entering,\n isExiting: props.isExiting,\n state\n }\n });\n\n let viewport = useViewportSize();\n let style = {\n ...renderProps.style,\n '--visual-viewport-height': viewport.height + 'px'\n };\n\n return (\n <Overlay isExiting={props.isExiting} portalContainer={UNSTABLE_portalContainer}>\n <div\n {...mergeProps(filterDOMProps(props as any), underlayProps)}\n {...renderProps}\n style={style}\n ref={props.overlayRef}\n data-entering={entering || undefined}\n data-exiting={props.isExiting || undefined}>\n <Provider\n values={[\n [InternalModalContext, {modalProps, modalRef, isExiting: props.isExiting, isDismissable: props.isDismissable}],\n [OverlayTriggerStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </Overlay>\n );\n}\n\ninterface ModalContentProps extends RenderProps<ModalRenderProps> {\n modalRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ModalContent(props: ModalContentProps) {\n let {modalProps, modalRef, isExiting, isDismissable} = useContext(InternalModalContext)!;\n let state = useContext(OverlayTriggerStateContext)!;\n let mergedRefs = useMemo(() => mergeRefs(props.modalRef, modalRef), [props.modalRef, modalRef]);\n\n let ref = useObjectRef(mergedRefs);\n let entering = useEnterAnimation(ref);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Modal',\n values: {\n isEntering: entering,\n isExiting,\n state\n }\n });\n\n return (\n <div\n {...mergeProps(filterDOMProps(props as any), modalProps)}\n {...renderProps}\n ref={ref}\n data-entering={entering || undefined}\n data-exiting={isExiting || undefined}>\n {isDismissable &&\n <DismissButton onDismiss={state.close} />\n }\n {renderProps.children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Modal.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Modal.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 {AriaModalOverlayProps, DismissButton, Overlay, useIsSSR, useModalOverlay} from 'react-aria';\nimport {ContextValue, Provider, RenderProps, SlotProps, useContextProps, useRenderProps} from './utils';\nimport {DOMAttributes, forwardRefType, RefObject} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, mergeRefs, useEnterAnimation, useExitAnimation, useObjectRef, useViewportSize} from '@react-aria/utils';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useMemo, useRef} from 'react';\n\nexport interface ModalOverlayProps extends AriaModalOverlayProps, OverlayTriggerProps, RenderProps<ModalRenderProps>, SlotProps {\n /**\n * Whether the modal is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the modal is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element\n}\n\ninterface InternalModalContextValue {\n modalProps: DOMAttributes,\n modalRef: RefObject<HTMLDivElement | null>,\n isExiting: boolean,\n isDismissable?: boolean\n}\n\nexport const ModalContext = createContext<ContextValue<ModalOverlayProps, HTMLDivElement>>(null);\nconst InternalModalContext = createContext<InternalModalContextValue | null>(null);\n\nexport interface ModalRenderProps {\n /**\n * Whether the modal is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the modal is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean,\n /**\n * State of the modal.\n */\n state: OverlayTriggerState\n}\n\n/**\n * A modal is an overlay element which blocks interaction with elements outside it.\n */\nexport const Modal = /*#__PURE__*/ (forwardRef as forwardRefType)(function Modal(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n let ctx = useContext(InternalModalContext);\n\n if (ctx) {\n return <ModalContent {...props} modalRef={ref}>{props.children}</ModalContent>;\n }\n\n let {\n isDismissable,\n isKeyboardDismissDisabled,\n isOpen,\n defaultOpen,\n onOpenChange,\n children,\n isEntering,\n isExiting,\n UNSTABLE_portalContainer,\n shouldCloseOnInteractOutside,\n ...otherProps\n } = props;\n\n return (\n <ModalOverlay\n isDismissable={isDismissable}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n isOpen={isOpen}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n isEntering={isEntering}\n isExiting={isExiting}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}>\n <ModalContent {...otherProps} modalRef={ref}>\n {children}\n </ModalContent>\n </ModalOverlay>\n );\n});\n\ninterface ModalOverlayInnerProps extends ModalOverlayProps {\n overlayRef: RefObject<HTMLDivElement | null>,\n modalRef: RefObject<HTMLDivElement | null>,\n state: OverlayTriggerState,\n isExiting: boolean\n}\n\nfunction ModalOverlayWithForwardRef(props: ModalOverlayProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ModalContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n\n let objectRef = useObjectRef(ref);\n let modalRef = useRef<HTMLDivElement>(null);\n let isOverlayExiting = useExitAnimation(objectRef, state.isOpen);\n let isModalExiting = useExitAnimation(modalRef, state.isOpen);\n let isExiting = isOverlayExiting || isModalExiting || props.isExiting || false;\n let isSSR = useIsSSR();\n\n if ((!state.isOpen && !isExiting) || isSSR) {\n return null;\n }\n\n return (\n <ModalOverlayInner\n {...props}\n state={state}\n isExiting={isExiting}\n overlayRef={objectRef}\n modalRef={modalRef} />\n );\n}\n\n/**\n * A ModalOverlay is a wrapper for a Modal which allows customizing the backdrop element.\n */\nexport const ModalOverlay = /*#__PURE__*/ (forwardRef as forwardRefType)(ModalOverlayWithForwardRef);\n\nfunction ModalOverlayInner({UNSTABLE_portalContainer, ...props}: ModalOverlayInnerProps) {\n let modalRef = props.modalRef;\n let {state} = props;\n let {modalProps, underlayProps} = useModalOverlay(props, state, modalRef);\n\n let entering = useEnterAnimation(props.overlayRef) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-ModalOverlay',\n values: {\n isEntering: entering,\n isExiting: props.isExiting,\n state\n }\n });\n\n let viewport = useViewportSize();\n let style = {\n ...renderProps.style,\n '--visual-viewport-height': viewport.height + 'px'\n };\n\n return (\n <Overlay isExiting={props.isExiting} portalContainer={UNSTABLE_portalContainer}>\n <div\n {...mergeProps(filterDOMProps(props as any), underlayProps)}\n {...renderProps}\n style={style}\n ref={props.overlayRef}\n data-entering={entering || undefined}\n data-exiting={props.isExiting || undefined}>\n <Provider\n values={[\n [InternalModalContext, {modalProps, modalRef, isExiting: props.isExiting, isDismissable: props.isDismissable}],\n [OverlayTriggerStateContext, state]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n </Overlay>\n );\n}\n\ninterface ModalContentProps extends RenderProps<ModalRenderProps> {\n modalRef: ForwardedRef<HTMLDivElement>\n}\n\nfunction ModalContent(props: ModalContentProps) {\n let {modalProps, modalRef, isExiting, isDismissable} = useContext(InternalModalContext)!;\n let state = useContext(OverlayTriggerStateContext)!;\n let mergedRefs = useMemo(() => mergeRefs(props.modalRef, modalRef), [props.modalRef, modalRef]);\n\n let ref = useObjectRef(mergedRefs);\n let entering = useEnterAnimation(ref);\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Modal',\n values: {\n isEntering: entering,\n isExiting,\n state\n }\n });\n\n return (\n <div\n {...mergeProps(filterDOMProps(props as any), modalProps)}\n {...renderProps}\n ref={ref}\n data-entering={entering || undefined}\n data-exiting={isExiting || undefined}>\n {isDismissable &&\n <DismissButton onDismiss={state.close} />\n }\n {renderProps.children}\n </div>\n );\n}\n"],"names":[],"version":3,"file":"Modal.module.js.map"}
@@ -42,7 +42,7 @@ const $61e2b7078adb18bc$export$5b6b19405a83ff9d = /*#__PURE__*/ (0, $4DQW2$react
42
42
  let contextState = (0, $4DQW2$react.useContext)((0, $2979ab89b336194b$exports.OverlayTriggerStateContext));
43
43
  let localState = (0, $4DQW2$reactstately.useOverlayTriggerState)(props);
44
44
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
45
- let isExiting = (0, $c5ccf687772c0422$exports.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
45
+ let isExiting = (0, $4DQW2$reactariautils.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
46
46
  let isHidden = (0, $4DQW2$reactariacollections.useIsHidden)();
47
47
  // If we are in a hidden tree, we still need to preserve our children.
48
48
  if (isHidden) {
@@ -83,7 +83,7 @@ function $61e2b7078adb18bc$var$PopoverInner({ state: state, isExiting: isExiting
83
83
  arrowSize: arrowWidth
84
84
  }, state);
85
85
  let ref = props.popoverRef;
86
- let isEntering = (0, $c5ccf687772c0422$exports.useEnterAnimation)(ref, !!placement) || props.isEntering || false;
86
+ let isEntering = (0, $4DQW2$reactariautils.useEnterAnimation)(ref, !!placement) || props.isEntering || false;
87
87
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
88
88
  ...props,
89
89
  defaultClassName: 'react-aria-Popover',
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react-aria-components/src/Popover.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 {AriaPopoverProps, DismissButton, Overlay, PlacementAxis, PositionProps, usePopover} from 'react-aria';\nimport {ContextValue, RenderProps, SlotProps, useContextProps, useEnterAnimation, useExitAnimation, useRenderProps} from './utils';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useRef, useState} from 'react';\nimport {useIsHidden} from '@react-aria/collections';\n\nexport interface PopoverProps extends Omit<PositionProps, 'isOpen'>, Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef' | 'offset' | 'arrowSize'>, OverlayTriggerProps, RenderProps<PopoverRenderProps>, SlotProps {\n /**\n * The name of the component that triggered the popover. This is reflected on the element\n * as the `data-trigger` attribute, and can be used to provide specific\n * styles for the popover depending on which element triggered it.\n */\n trigger?: string,\n /**\n * The ref for the element which the popover positions itself with respect to.\n *\n * When used within a trigger component such as DialogTrigger, MenuTrigger, Select, etc.,\n * this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the popover is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the popover is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The additional offset applied along the main axis between the element and its\n * anchor element.\n * @default 8\n */\n offset?: number\n}\n\nexport interface PopoverRenderProps {\n /**\n * The name of the component that triggered the popover, e.g. \"DialogTrigger\" or \"ComboBox\".\n * @selector [data-trigger=\"...\"]\n */\n trigger: string | null,\n /**\n * The placement of the popover relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the popover is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the popover is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean\n}\n\nexport const PopoverContext = createContext<ContextValue<PopoverProps, HTMLElement>>(null);\n\n/**\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport const Popover = /*#__PURE__*/ (forwardRef as forwardRefType)(function Popover(props: PopoverProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, PopoverContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n let isHidden = useIsHidden();\n\n // If we are in a hidden tree, we still need to preserve our children.\n if (isHidden) {\n let children = props.children;\n if (typeof children === 'function') {\n children = children({\n trigger: props.trigger || null,\n placement: 'bottom',\n isEntering: false,\n isExiting: false,\n defaultChildren: null\n });\n }\n\n return <>{children}</>;\n }\n\n if (state && !state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <PopoverInner\n {...props}\n triggerRef={props.triggerRef!}\n state={state}\n popoverRef={ref}\n isExiting={isExiting} />\n );\n});\n\ninterface PopoverInnerProps extends AriaPopoverProps, RenderProps<PopoverRenderProps>, SlotProps {\n state: OverlayTriggerState,\n isEntering?: boolean,\n isExiting: boolean,\n UNSTABLE_portalContainer?: Element,\n trigger?: string\n}\n\nfunction PopoverInner({state, isExiting, UNSTABLE_portalContainer, ...props}: PopoverInnerProps) {\n // Calculate the arrow size internally (and remove props.arrowSize from PopoverProps)\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {popoverProps, underlayProps, arrowProps, placement} = usePopover({\n ...props,\n offset: props.offset ?? 8,\n arrowSize: arrowWidth\n }, state);\n\n let ref = props.popoverRef as RefObject<HTMLDivElement | null>;\n let isEntering = useEnterAnimation(ref, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Popover',\n values: {\n trigger: props.trigger || null,\n placement,\n isEntering,\n isExiting\n }\n });\n\n let style = {...popoverProps.style, ...renderProps.style};\n\n return (\n <Overlay {...props} isExiting={isExiting} portalContainer={UNSTABLE_portalContainer}>\n {!props.isNonModal && state.isOpen && <div data-testid=\"underlay\" {...underlayProps} style={{position: 'fixed', inset: 0}} />}\n <div\n {...mergeProps(filterDOMProps(props as any), popoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n style={style}\n data-trigger={props.trigger}\n data-placement={placement}\n data-entering={isEntering || undefined}\n data-exiting={isExiting || undefined}>\n {!props.isNonModal && <DismissButton onDismiss={state.close} />}\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n <DismissButton onDismiss={state.close} />\n </div>\n </Overlay>\n );\n}\n"],"names":[],"version":3,"file":"Popover.main.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Popover.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 {AriaPopoverProps, DismissButton, Overlay, PlacementAxis, PositionProps, usePopover} from 'react-aria';\nimport {ContextValue, RenderProps, SlotProps, useContextProps, useRenderProps} from './utils';\nimport {filterDOMProps, mergeProps, useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useRef, useState} from 'react';\nimport {useIsHidden} from '@react-aria/collections';\n\nexport interface PopoverProps extends Omit<PositionProps, 'isOpen'>, Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef' | 'offset' | 'arrowSize'>, OverlayTriggerProps, RenderProps<PopoverRenderProps>, SlotProps {\n /**\n * The name of the component that triggered the popover. This is reflected on the element\n * as the `data-trigger` attribute, and can be used to provide specific\n * styles for the popover depending on which element triggered it.\n */\n trigger?: string,\n /**\n * The ref for the element which the popover positions itself with respect to.\n *\n * When used within a trigger component such as DialogTrigger, MenuTrigger, Select, etc.,\n * this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the popover is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the popover is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The additional offset applied along the main axis between the element and its\n * anchor element.\n * @default 8\n */\n offset?: number\n}\n\nexport interface PopoverRenderProps {\n /**\n * The name of the component that triggered the popover, e.g. \"DialogTrigger\" or \"ComboBox\".\n * @selector [data-trigger=\"...\"]\n */\n trigger: string | null,\n /**\n * The placement of the popover relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the popover is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the popover is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean\n}\n\nexport const PopoverContext = createContext<ContextValue<PopoverProps, HTMLElement>>(null);\n\n/**\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport const Popover = /*#__PURE__*/ (forwardRef as forwardRefType)(function Popover(props: PopoverProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, PopoverContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n let isHidden = useIsHidden();\n\n // If we are in a hidden tree, we still need to preserve our children.\n if (isHidden) {\n let children = props.children;\n if (typeof children === 'function') {\n children = children({\n trigger: props.trigger || null,\n placement: 'bottom',\n isEntering: false,\n isExiting: false,\n defaultChildren: null\n });\n }\n\n return <>{children}</>;\n }\n\n if (state && !state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <PopoverInner\n {...props}\n triggerRef={props.triggerRef!}\n state={state}\n popoverRef={ref}\n isExiting={isExiting} />\n );\n});\n\ninterface PopoverInnerProps extends AriaPopoverProps, RenderProps<PopoverRenderProps>, SlotProps {\n state: OverlayTriggerState,\n isEntering?: boolean,\n isExiting: boolean,\n UNSTABLE_portalContainer?: Element,\n trigger?: string\n}\n\nfunction PopoverInner({state, isExiting, UNSTABLE_portalContainer, ...props}: PopoverInnerProps) {\n // Calculate the arrow size internally (and remove props.arrowSize from PopoverProps)\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {popoverProps, underlayProps, arrowProps, placement} = usePopover({\n ...props,\n offset: props.offset ?? 8,\n arrowSize: arrowWidth\n }, state);\n\n let ref = props.popoverRef as RefObject<HTMLDivElement | null>;\n let isEntering = useEnterAnimation(ref, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Popover',\n values: {\n trigger: props.trigger || null,\n placement,\n isEntering,\n isExiting\n }\n });\n\n let style = {...popoverProps.style, ...renderProps.style};\n\n return (\n <Overlay {...props} isExiting={isExiting} portalContainer={UNSTABLE_portalContainer}>\n {!props.isNonModal && state.isOpen && <div data-testid=\"underlay\" {...underlayProps} style={{position: 'fixed', inset: 0}} />}\n <div\n {...mergeProps(filterDOMProps(props as any), popoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n style={style}\n data-trigger={props.trigger}\n data-placement={placement}\n data-entering={isEntering || undefined}\n data-exiting={isExiting || undefined}>\n {!props.isNonModal && <DismissButton onDismiss={state.close} />}\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n <DismissButton onDismiss={state.close} />\n </div>\n </Overlay>\n );\n}\n"],"names":[],"version":3,"file":"Popover.main.js.map"}
package/dist/Popover.mjs CHANGED
@@ -1,8 +1,8 @@
1
- import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useEnterAnimation as $64fa3d84918910a7$export$6d3443f2c48bfc20, useExitAnimation as $64fa3d84918910a7$export$45fda7c47f93fd48, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
1
+ import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.mjs";
2
2
  import {OverlayArrowContext as $44f671af83e7d9e0$export$2de4954e8ae13b9f} from "./OverlayArrow.mjs";
3
3
  import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.mjs";
4
4
  import {usePopover as $ehFet$usePopover, Overlay as $ehFet$Overlay, DismissButton as $ehFet$DismissButton} from "react-aria";
5
- import {useLayoutEffect as $ehFet$useLayoutEffect, mergeProps as $ehFet$mergeProps, filterDOMProps as $ehFet$filterDOMProps} from "@react-aria/utils";
5
+ import {useExitAnimation as $ehFet$useExitAnimation, useLayoutEffect as $ehFet$useLayoutEffect, useEnterAnimation as $ehFet$useEnterAnimation, mergeProps as $ehFet$mergeProps, filterDOMProps as $ehFet$filterDOMProps} from "@react-aria/utils";
6
6
  import {useOverlayTriggerState as $ehFet$useOverlayTriggerState} from "react-stately";
7
7
  import $ehFet$react, {createContext as $ehFet$createContext, forwardRef as $ehFet$forwardRef, useContext as $ehFet$useContext, useRef as $ehFet$useRef, useState as $ehFet$useState} from "react";
8
8
  import {useIsHidden as $ehFet$useIsHidden} from "@react-aria/collections";
@@ -31,7 +31,7 @@ const $07b14b47974efb58$export$5b6b19405a83ff9d = /*#__PURE__*/ (0, $ehFet$forwa
31
31
  let contextState = (0, $ehFet$useContext)((0, $de32f1b87079253c$export$d2f961adcb0afbe));
32
32
  let localState = (0, $ehFet$useOverlayTriggerState)(props);
33
33
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
34
- let isExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(ref, state.isOpen) || props.isExiting || false;
34
+ let isExiting = (0, $ehFet$useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
35
35
  let isHidden = (0, $ehFet$useIsHidden)();
36
36
  // If we are in a hidden tree, we still need to preserve our children.
37
37
  if (isHidden) {
@@ -72,7 +72,7 @@ function $07b14b47974efb58$var$PopoverInner({ state: state, isExiting: isExiting
72
72
  arrowSize: arrowWidth
73
73
  }, state);
74
74
  let ref = props.popoverRef;
75
- let isEntering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(ref, !!placement) || props.isEntering || false;
75
+ let isEntering = (0, $ehFet$useEnterAnimation)(ref, !!placement) || props.isEntering || false;
76
76
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
77
77
  ...props,
78
78
  defaultClassName: 'react-aria-Popover',
@@ -1,8 +1,8 @@
1
- import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useEnterAnimation as $64fa3d84918910a7$export$6d3443f2c48bfc20, useExitAnimation as $64fa3d84918910a7$export$45fda7c47f93fd48, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
1
+ import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
2
2
  import {OverlayArrowContext as $44f671af83e7d9e0$export$2de4954e8ae13b9f} from "./OverlayArrow.module.js";
3
3
  import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.module.js";
4
4
  import {usePopover as $ehFet$usePopover, Overlay as $ehFet$Overlay, DismissButton as $ehFet$DismissButton} from "react-aria";
5
- import {useLayoutEffect as $ehFet$useLayoutEffect, mergeProps as $ehFet$mergeProps, filterDOMProps as $ehFet$filterDOMProps} from "@react-aria/utils";
5
+ import {useExitAnimation as $ehFet$useExitAnimation, useLayoutEffect as $ehFet$useLayoutEffect, useEnterAnimation as $ehFet$useEnterAnimation, mergeProps as $ehFet$mergeProps, filterDOMProps as $ehFet$filterDOMProps} from "@react-aria/utils";
6
6
  import {useOverlayTriggerState as $ehFet$useOverlayTriggerState} from "react-stately";
7
7
  import $ehFet$react, {createContext as $ehFet$createContext, forwardRef as $ehFet$forwardRef, useContext as $ehFet$useContext, useRef as $ehFet$useRef, useState as $ehFet$useState} from "react";
8
8
  import {useIsHidden as $ehFet$useIsHidden} from "@react-aria/collections";
@@ -31,7 +31,7 @@ const $07b14b47974efb58$export$5b6b19405a83ff9d = /*#__PURE__*/ (0, $ehFet$forwa
31
31
  let contextState = (0, $ehFet$useContext)((0, $de32f1b87079253c$export$d2f961adcb0afbe));
32
32
  let localState = (0, $ehFet$useOverlayTriggerState)(props);
33
33
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
34
- let isExiting = (0, $64fa3d84918910a7$export$45fda7c47f93fd48)(ref, state.isOpen) || props.isExiting || false;
34
+ let isExiting = (0, $ehFet$useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
35
35
  let isHidden = (0, $ehFet$useIsHidden)();
36
36
  // If we are in a hidden tree, we still need to preserve our children.
37
37
  if (isHidden) {
@@ -72,7 +72,7 @@ function $07b14b47974efb58$var$PopoverInner({ state: state, isExiting: isExiting
72
72
  arrowSize: arrowWidth
73
73
  }, state);
74
74
  let ref = props.popoverRef;
75
- let isEntering = (0, $64fa3d84918910a7$export$6d3443f2c48bfc20)(ref, !!placement) || props.isEntering || false;
75
+ let isEntering = (0, $ehFet$useEnterAnimation)(ref, !!placement) || props.isEntering || false;
76
76
  let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
77
77
  ...props,
78
78
  defaultClassName: 'react-aria-Popover',
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AAsEM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAA2C;AAK9E,MAAM,4CAAwB,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,QAAQ,KAAmB,EAAE,GAA8B;IACtI,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,eAAe,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,wCAAyB;IACvD,IAAI,aAAa,CAAA,GAAA,6BAAqB,EAAE;IACxC,IAAI,QAAQ,MAAM,MAAM,IAAI,QAAQ,MAAM,WAAW,IAAI,QAAQ,CAAC,eAAe,aAAa;IAC9F,IAAI,YAAY,CAAA,GAAA,yCAAe,EAAE,KAAK,MAAM,MAAM,KAAK,MAAM,SAAS,IAAI;IAC1E,IAAI,WAAW,CAAA,GAAA,kBAAU;IAEzB,sEAAsE;IACtE,IAAI,UAAU;QACZ,IAAI,WAAW,MAAM,QAAQ;QAC7B,IAAI,OAAO,aAAa,YACtB,WAAW,SAAS;YAClB,SAAS,MAAM,OAAO,IAAI;YAC1B,WAAW;YACX,YAAY;YACZ,WAAW;YACX,iBAAiB;QACnB;QAGF,qBAAO,kEAAG;IACZ;IAEA,IAAI,SAAS,CAAC,MAAM,MAAM,IAAI,CAAC,WAC7B,OAAO;IAGT,qBACE,gCAAC;QACE,GAAG,KAAK;QACT,YAAY,MAAM,UAAU;QAC5B,OAAO;QACP,YAAY;QACZ,WAAW;;AAEjB;AAUA,SAAS,mCAAa,SAAC,KAAK,aAAE,SAAS,4BAAE,wBAAwB,EAAE,GAAG,OAAyB;IAC7F,qFAAqF;IACrF,2EAA2E;IAC3E,IAAI,WAAW,CAAA,GAAA,aAAK,EAAkB;IACtC,IAAI,CAAC,YAAY,cAAc,GAAG,CAAA,GAAA,eAAO,EAAE;IAC3C,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,SAAS,OAAO,IAAI,MAAM,MAAM,EAClC,cAAc,SAAS,OAAO,CAAC,qBAAqB,GAAG,KAAK;IAEhE,GAAG;QAAC,MAAM,MAAM;QAAE;KAAS;QAIjB;IAFV,IAAI,gBAAC,YAAY,iBAAE,aAAa,cAAE,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;QACpE,GAAG,KAAK;QACR,QAAQ,CAAA,gBAAA,MAAM,MAAM,cAAZ,2BAAA,gBAAgB;QACxB,WAAW;IACb,GAAG;IAEH,IAAI,MAAM,MAAM,UAAU;IAC1B,IAAI,aAAa,CAAA,GAAA,yCAAgB,EAAE,KAAK,CAAC,CAAC,cAAc,MAAM,UAAU,IAAI;IAC5E,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,kBAAkB;QAClB,QAAQ;YACN,SAAS,MAAM,OAAO,IAAI;uBAC1B;wBACA;uBACA;QACF;IACF;IAEA,IAAI,QAAQ;QAAC,GAAG,aAAa,KAAK;QAAE,GAAG,YAAY,KAAK;IAAA;IAExD,qBACE,gCAAC,CAAA,GAAA,cAAM;QAAG,GAAG,KAAK;QAAE,WAAW;QAAW,iBAAiB;OACxD,CAAC,MAAM,UAAU,IAAI,MAAM,MAAM,kBAAI,gCAAC;QAAI,eAAY;QAAY,GAAG,aAAa;QAAE,OAAO;YAAC,UAAU;YAAS,OAAO;QAAC;sBACxH,gCAAC;QACE,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,qBAAa,EAAE,QAAe,aAAa;QACzD,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,OAAO;QACP,gBAAc,MAAM,OAAO;QAC3B,kBAAgB;QAChB,iBAAe,cAAc;QAC7B,gBAAc,aAAa;OAC1B,CAAC,MAAM,UAAU,kBAAI,gCAAC,CAAA,GAAA,oBAAY;QAAE,WAAW,MAAM,KAAK;sBAC3D,gCAAC,CAAA,GAAA,yCAAkB,EAAE,QAAQ;QAAC,OAAO;YAAC,GAAG,UAAU;uBAAE;YAAW,KAAK;QAAQ;OAC1E,YAAY,QAAQ,iBAEvB,gCAAC,CAAA,GAAA,oBAAY;QAAE,WAAW,MAAM,KAAK;;AAI7C","sources":["packages/react-aria-components/src/Popover.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 {AriaPopoverProps, DismissButton, Overlay, PlacementAxis, PositionProps, usePopover} from 'react-aria';\nimport {ContextValue, RenderProps, SlotProps, useContextProps, useEnterAnimation, useExitAnimation, useRenderProps} from './utils';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useRef, useState} from 'react';\nimport {useIsHidden} from '@react-aria/collections';\n\nexport interface PopoverProps extends Omit<PositionProps, 'isOpen'>, Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef' | 'offset' | 'arrowSize'>, OverlayTriggerProps, RenderProps<PopoverRenderProps>, SlotProps {\n /**\n * The name of the component that triggered the popover. This is reflected on the element\n * as the `data-trigger` attribute, and can be used to provide specific\n * styles for the popover depending on which element triggered it.\n */\n trigger?: string,\n /**\n * The ref for the element which the popover positions itself with respect to.\n *\n * When used within a trigger component such as DialogTrigger, MenuTrigger, Select, etc.,\n * this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the popover is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the popover is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The additional offset applied along the main axis between the element and its\n * anchor element.\n * @default 8\n */\n offset?: number\n}\n\nexport interface PopoverRenderProps {\n /**\n * The name of the component that triggered the popover, e.g. \"DialogTrigger\" or \"ComboBox\".\n * @selector [data-trigger=\"...\"]\n */\n trigger: string | null,\n /**\n * The placement of the popover relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the popover is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the popover is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean\n}\n\nexport const PopoverContext = createContext<ContextValue<PopoverProps, HTMLElement>>(null);\n\n/**\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport const Popover = /*#__PURE__*/ (forwardRef as forwardRefType)(function Popover(props: PopoverProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, PopoverContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n let isHidden = useIsHidden();\n\n // If we are in a hidden tree, we still need to preserve our children.\n if (isHidden) {\n let children = props.children;\n if (typeof children === 'function') {\n children = children({\n trigger: props.trigger || null,\n placement: 'bottom',\n isEntering: false,\n isExiting: false,\n defaultChildren: null\n });\n }\n\n return <>{children}</>;\n }\n\n if (state && !state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <PopoverInner\n {...props}\n triggerRef={props.triggerRef!}\n state={state}\n popoverRef={ref}\n isExiting={isExiting} />\n );\n});\n\ninterface PopoverInnerProps extends AriaPopoverProps, RenderProps<PopoverRenderProps>, SlotProps {\n state: OverlayTriggerState,\n isEntering?: boolean,\n isExiting: boolean,\n UNSTABLE_portalContainer?: Element,\n trigger?: string\n}\n\nfunction PopoverInner({state, isExiting, UNSTABLE_portalContainer, ...props}: PopoverInnerProps) {\n // Calculate the arrow size internally (and remove props.arrowSize from PopoverProps)\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {popoverProps, underlayProps, arrowProps, placement} = usePopover({\n ...props,\n offset: props.offset ?? 8,\n arrowSize: arrowWidth\n }, state);\n\n let ref = props.popoverRef as RefObject<HTMLDivElement | null>;\n let isEntering = useEnterAnimation(ref, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Popover',\n values: {\n trigger: props.trigger || null,\n placement,\n isEntering,\n isExiting\n }\n });\n\n let style = {...popoverProps.style, ...renderProps.style};\n\n return (\n <Overlay {...props} isExiting={isExiting} portalContainer={UNSTABLE_portalContainer}>\n {!props.isNonModal && state.isOpen && <div data-testid=\"underlay\" {...underlayProps} style={{position: 'fixed', inset: 0}} />}\n <div\n {...mergeProps(filterDOMProps(props as any), popoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n style={style}\n data-trigger={props.trigger}\n data-placement={placement}\n data-entering={isEntering || undefined}\n data-exiting={isExiting || undefined}>\n {!props.isNonModal && <DismissButton onDismiss={state.close} />}\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n <DismissButton onDismiss={state.close} />\n </div>\n </Overlay>\n );\n}\n"],"names":[],"version":3,"file":"Popover.module.js.map"}
1
+ {"mappings":"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","sources":["packages/react-aria-components/src/Popover.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 {AriaPopoverProps, DismissButton, Overlay, PlacementAxis, PositionProps, usePopover} from 'react-aria';\nimport {ContextValue, RenderProps, SlotProps, useContextProps, useRenderProps} from './utils';\nimport {filterDOMProps, mergeProps, useEnterAnimation, useExitAnimation, useLayoutEffect} from '@react-aria/utils';\nimport {forwardRefType, RefObject} from '@react-types/shared';\nimport {OverlayArrowContext} from './OverlayArrow';\nimport {OverlayTriggerProps, OverlayTriggerState, useOverlayTriggerState} from 'react-stately';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport React, {createContext, ForwardedRef, forwardRef, useContext, useRef, useState} from 'react';\nimport {useIsHidden} from '@react-aria/collections';\n\nexport interface PopoverProps extends Omit<PositionProps, 'isOpen'>, Omit<AriaPopoverProps, 'popoverRef' | 'triggerRef' | 'offset' | 'arrowSize'>, OverlayTriggerProps, RenderProps<PopoverRenderProps>, SlotProps {\n /**\n * The name of the component that triggered the popover. This is reflected on the element\n * as the `data-trigger` attribute, and can be used to provide specific\n * styles for the popover depending on which element triggered it.\n */\n trigger?: string,\n /**\n * The ref for the element which the popover positions itself with respect to.\n *\n * When used within a trigger component such as DialogTrigger, MenuTrigger, Select, etc.,\n * this is set automatically. It is only required when used standalone.\n */\n triggerRef?: RefObject<Element | null>,\n /**\n * Whether the popover is currently performing an entry animation.\n */\n isEntering?: boolean,\n /**\n * Whether the popover is currently performing an exit animation.\n */\n isExiting?: boolean,\n /**\n * The container element in which the overlay portal will be placed. This may have unknown behavior depending on where it is portalled to.\n * @default document.body\n */\n UNSTABLE_portalContainer?: Element,\n /**\n * The additional offset applied along the main axis between the element and its\n * anchor element.\n * @default 8\n */\n offset?: number\n}\n\nexport interface PopoverRenderProps {\n /**\n * The name of the component that triggered the popover, e.g. \"DialogTrigger\" or \"ComboBox\".\n * @selector [data-trigger=\"...\"]\n */\n trigger: string | null,\n /**\n * The placement of the popover relative to the trigger.\n * @selector [data-placement=\"left | right | top | bottom\"]\n */\n placement: PlacementAxis | null,\n /**\n * Whether the popover is currently entering. Use this to apply animations.\n * @selector [data-entering]\n */\n isEntering: boolean,\n /**\n * Whether the popover is currently exiting. Use this to apply animations.\n * @selector [data-exiting]\n */\n isExiting: boolean\n}\n\nexport const PopoverContext = createContext<ContextValue<PopoverProps, HTMLElement>>(null);\n\n/**\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport const Popover = /*#__PURE__*/ (forwardRef as forwardRefType)(function Popover(props: PopoverProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, PopoverContext);\n let contextState = useContext(OverlayTriggerStateContext);\n let localState = useOverlayTriggerState(props);\n let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;\n let isExiting = useExitAnimation(ref, state.isOpen) || props.isExiting || false;\n let isHidden = useIsHidden();\n\n // If we are in a hidden tree, we still need to preserve our children.\n if (isHidden) {\n let children = props.children;\n if (typeof children === 'function') {\n children = children({\n trigger: props.trigger || null,\n placement: 'bottom',\n isEntering: false,\n isExiting: false,\n defaultChildren: null\n });\n }\n\n return <>{children}</>;\n }\n\n if (state && !state.isOpen && !isExiting) {\n return null;\n }\n\n return (\n <PopoverInner\n {...props}\n triggerRef={props.triggerRef!}\n state={state}\n popoverRef={ref}\n isExiting={isExiting} />\n );\n});\n\ninterface PopoverInnerProps extends AriaPopoverProps, RenderProps<PopoverRenderProps>, SlotProps {\n state: OverlayTriggerState,\n isEntering?: boolean,\n isExiting: boolean,\n UNSTABLE_portalContainer?: Element,\n trigger?: string\n}\n\nfunction PopoverInner({state, isExiting, UNSTABLE_portalContainer, ...props}: PopoverInnerProps) {\n // Calculate the arrow size internally (and remove props.arrowSize from PopoverProps)\n // Referenced from: packages/@react-spectrum/tooltip/src/TooltipTrigger.tsx\n let arrowRef = useRef<HTMLDivElement>(null);\n let [arrowWidth, setArrowWidth] = useState(0);\n useLayoutEffect(() => {\n if (arrowRef.current && state.isOpen) {\n setArrowWidth(arrowRef.current.getBoundingClientRect().width);\n }\n }, [state.isOpen, arrowRef]);\n\n let {popoverProps, underlayProps, arrowProps, placement} = usePopover({\n ...props,\n offset: props.offset ?? 8,\n arrowSize: arrowWidth\n }, state);\n\n let ref = props.popoverRef as RefObject<HTMLDivElement | null>;\n let isEntering = useEnterAnimation(ref, !!placement) || props.isEntering || false;\n let renderProps = useRenderProps({\n ...props,\n defaultClassName: 'react-aria-Popover',\n values: {\n trigger: props.trigger || null,\n placement,\n isEntering,\n isExiting\n }\n });\n\n let style = {...popoverProps.style, ...renderProps.style};\n\n return (\n <Overlay {...props} isExiting={isExiting} portalContainer={UNSTABLE_portalContainer}>\n {!props.isNonModal && state.isOpen && <div data-testid=\"underlay\" {...underlayProps} style={{position: 'fixed', inset: 0}} />}\n <div\n {...mergeProps(filterDOMProps(props as any), popoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n style={style}\n data-trigger={props.trigger}\n data-placement={placement}\n data-entering={isEntering || undefined}\n data-exiting={isExiting || undefined}>\n {!props.isNonModal && <DismissButton onDismiss={state.close} />}\n <OverlayArrowContext.Provider value={{...arrowProps, placement, ref: arrowRef}}>\n {renderProps.children}\n </OverlayArrowContext.Provider>\n <DismissButton onDismiss={state.close} />\n </div>\n </Overlay>\n );\n}\n"],"names":[],"version":3,"file":"Popover.module.js.map"}
@@ -66,7 +66,7 @@ const $f9dd4061eb43ac38$export$28c660c63b792dea = /*#__PURE__*/ (0, $ct4WB$react
66
66
  let contextState = (0, $ct4WB$react.useContext)($f9dd4061eb43ac38$export$7a7623236eec67fa);
67
67
  let localState = (0, $ct4WB$reactstately.useTooltipTriggerState)(props);
68
68
  let state = props.isOpen != null || props.defaultOpen != null || !contextState ? localState : contextState;
69
- let isExiting = (0, $c5ccf687772c0422$exports.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
69
+ let isExiting = (0, $ct4WB$reactariautils.useExitAnimation)(ref, state.isOpen) || props.isExiting || false;
70
70
  if (!state.isOpen && !isExiting) return null;
71
71
  return /*#__PURE__*/ (0, ($parcel$interopDefault($ct4WB$react))).createElement((0, $ct4WB$reactaria.OverlayContainer), {
72
72
  portalContainer: UNSTABLE_portalContainer
@@ -100,7 +100,7 @@ function $f9dd4061eb43ac38$var$TooltipInner(props) {
100
100
  shouldFlip: props.shouldFlip,
101
101
  onClose: ()=>state.close(true)
102
102
  });
103
- let isEntering = (0, $c5ccf687772c0422$exports.useEnterAnimation)(props.tooltipRef, !!placement) || props.isEntering || false;
103
+ let isEntering = (0, $ct4WB$reactariautils.useEnterAnimation)(props.tooltipRef, !!placement) || props.isEntering || false;
104
104
  let renderProps = (0, $c5ccf687772c0422$exports.useRenderProps)({
105
105
  ...props,
106
106
  defaultClassName: 'react-aria-Tooltip',