react-aria-components
Version:
A library of styleable components built using React Aria
165 lines (152 loc) • 8.08 kB
JavaScript
import {ButtonContext as $d2b4bc8c273e7be6$export$24d547caef80ccd1} from "./Button.module.js";
import {DEFAULT_SLOT as $64fa3d84918910a7$export$c62b8e45d58ddad9, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from "./utils.module.js";
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.module.js";
import {useToastRegion as $9il6O$useToastRegion, useFocusRing as $9il6O$useFocusRing, useHover as $9il6O$useHover, useLocale as $9il6O$useLocale, mergeProps as $9il6O$mergeProps, useToast as $9il6O$useToast} from "react-aria";
import {createPortal as $9il6O$createPortal} from "react-dom";
import {useToastQueue as $9il6O$useToastQueue} from "react-stately";
import $9il6O$react, {createContext as $9il6O$createContext, forwardRef as $9il6O$forwardRef, useContext as $9il6O$useContext} from "react";
import {useIsSSR as $9il6O$useIsSSR} from "@react-aria/ssr";
import {useObjectRef as $9il6O$useObjectRef} from "@react-aria/utils";
import {useUNSAFE_PortalContext as $9il6O$useUNSAFE_PortalContext} from "@react-aria/overlays";
/*
* Copyright 2025 Adobe. All rights reserved.
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License. You may obtain a copy
* of the License at http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
* OF ANY KIND, either express or implied. See the License for the specific language
* governing permissions and limitations under the License.
*/
const $692df8403b6ac2c7$export$e9e2a1fc7373c1e1 = /*#__PURE__*/ (0, $9il6O$createContext)(null);
const $692df8403b6ac2c7$export$2cbf5519fbeaa538 = /*#__PURE__*/ (0, $9il6O$forwardRef)(function ToastRegion(props, ref) {
let isSSR = (0, $9il6O$useIsSSR)();
let state = (0, $9il6O$useToastQueue)(props.queue);
let objectRef = (0, $9il6O$useObjectRef)(ref);
let { regionProps: regionProps } = (0, $9il6O$useToastRegion)(props, state, objectRef);
let { focusProps: focusProps, isFocused: isFocused, isFocusVisible: isFocusVisible } = (0, $9il6O$useFocusRing)();
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $9il6O$useHover)({});
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
...props,
children: undefined,
defaultClassName: 'react-aria-ToastRegion',
values: {
visibleToasts: state.visibleToasts,
isHovered: isHovered,
isFocused: isFocused,
isFocusVisible: isFocusVisible
}
});
let { direction: direction } = (0, $9il6O$useLocale)();
let portalContainer;
let { getContainer: getContainer } = (0, $9il6O$useUNSAFE_PortalContext)();
if (!isSSR) {
portalContainer = document.body;
if (getContainer) portalContainer = getContainer();
}
let region = /*#__PURE__*/ (0, $9il6O$react).createElement($692df8403b6ac2c7$export$e9e2a1fc7373c1e1.Provider, {
value: state
}, /*#__PURE__*/ (0, $9il6O$react).createElement("div", {
...renderProps,
...(0, $9il6O$mergeProps)(regionProps, focusProps, hoverProps),
dir: direction,
ref: objectRef,
"data-hovered": isHovered || undefined,
"data-focused": isFocused || undefined,
"data-focus-visible": isFocusVisible || undefined
}, typeof props.children === 'function' ? /*#__PURE__*/ (0, $9il6O$react).createElement($692df8403b6ac2c7$export$c20d626a86a69756, {
...props,
className: undefined,
style: {
display: 'contents'
}
}, props.children) : props.children));
return state.visibleToasts.length > 0 && portalContainer ? /*#__PURE__*/ (0, $9il6O$createPortal)(region, portalContainer) : null;
});
const $692df8403b6ac2c7$export$c20d626a86a69756 = /*#__PURE__*/ (0, $9il6O$forwardRef)(function ToastList(props, ref) {
let state = (0, $9il6O$useContext)($692df8403b6ac2c7$export$e9e2a1fc7373c1e1);
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $9il6O$useHover)({});
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
...props,
children: undefined,
defaultClassName: 'react-aria-ToastList',
values: {
visibleToasts: state.visibleToasts,
isFocused: false,
isFocusVisible: false,
isHovered: isHovered
}
});
return /*#__PURE__*/ (0, $9il6O$react).createElement("ol", {
...hoverProps,
...renderProps,
ref: ref
}, state.visibleToasts.map((toast)=>/*#__PURE__*/ (0, $9il6O$react).createElement("li", {
key: toast.key,
style: {
display: 'contents'
}
}, props.children({
toast: toast
}))));
});
const $692df8403b6ac2c7$export$8d8dc7d5f743331b = /*#__PURE__*/ (0, $9il6O$forwardRef)(function Toast(props, ref) {
let state = (0, $9il6O$useContext)($692df8403b6ac2c7$export$e9e2a1fc7373c1e1);
let objectRef = (0, $9il6O$useObjectRef)(ref);
let { toastProps: toastProps, contentProps: contentProps, titleProps: titleProps, descriptionProps: descriptionProps, closeButtonProps: closeButtonProps } = (0, $9il6O$useToast)(props, state, objectRef);
let { focusProps: focusProps, isFocused: isFocused, isFocusVisible: isFocusVisible } = (0, $9il6O$useFocusRing)();
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
...props,
defaultClassName: 'react-aria-Toast',
values: {
toast: props.toast,
isFocused: isFocused,
isFocusVisible: isFocusVisible
}
});
return /*#__PURE__*/ (0, $9il6O$react).createElement("div", {
...renderProps,
...(0, $9il6O$mergeProps)(toastProps, focusProps),
ref: objectRef,
"data-focused": isFocused || undefined,
"data-focus-visible": isFocusVisible || undefined
}, /*#__PURE__*/ (0, $9il6O$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
values: [
[
$692df8403b6ac2c7$export$3a0d85872d9f73f2,
contentProps
],
[
(0, $514c0188e459b4c0$export$9afb8bc826b033ea),
{
slots: {
[(0, $64fa3d84918910a7$export$c62b8e45d58ddad9)]: {},
title: titleProps,
description: descriptionProps
}
}
],
[
(0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
{
slots: {
[(0, $64fa3d84918910a7$export$c62b8e45d58ddad9)]: {},
close: closeButtonProps
}
}
]
]
}, renderProps.children));
});
const $692df8403b6ac2c7$export$3a0d85872d9f73f2 = /*#__PURE__*/ (0, $9il6O$createContext)({});
const $692df8403b6ac2c7$export$b134a6cc89b08851 = /*#__PURE__*/ (0, $9il6O$forwardRef)(function ToastContent(props, ref) {
[props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $692df8403b6ac2c7$export$3a0d85872d9f73f2);
return /*#__PURE__*/ (0, $9il6O$react).createElement("div", {
className: "react-aria-ToastContent",
...props,
ref: ref
}, props.children);
});
export {$692df8403b6ac2c7$export$e9e2a1fc7373c1e1 as ToastStateContext, $692df8403b6ac2c7$export$2cbf5519fbeaa538 as ToastRegion, $692df8403b6ac2c7$export$c20d626a86a69756 as ToastList, $692df8403b6ac2c7$export$8d8dc7d5f743331b as Toast, $692df8403b6ac2c7$export$3a0d85872d9f73f2 as ToastContentContext, $692df8403b6ac2c7$export$b134a6cc89b08851 as ToastContent};
//# sourceMappingURL=Toast.module.js.map