reshaped 2.8.0 → 2.8.2

package/components/TextField/TextField.js

@@ -1,49 +0,0 @@
-"use client";
-import React from "react";
-import { classNames, responsiveClassNames, responsivePropDependency } from "../../utilities/helpers.js";
-import useElementId from "../../hooks/useElementId.js";
-import { useFormControl } from "../FormControl/index.js";
-import Icon from "../Icon/index.js";
-import Aligner from "../_private/Aligner/index.js";
-import s from "./TextField.module.css";
-const TextFieldSlot = (props) => {
-    const { slot, icon, size, affix, position } = props;
-    if (!icon && !slot && !affix)
-        return null;
-    const attachmentClassNames = classNames(s.attachment, s[`attachment--position-${position}`]);
-    const content = [
-        slot && (React.createElement("div", { className: s.slot, key: "slot" }, slot)),
-        icon && (React.createElement("div", { className: s.icon, key: "icon" },
-            React.createElement(Icon, { size: responsivePropDependency(size, (size) => {
-                    if (size === "large")
-                        return 5;
-                    if (size === "xlarge")
-                        return 6;
-                    return 4;
-                }), svg: icon }))),
-        affix && (React.createElement("div", { className: s.affix, key: "affix" }, affix)),
-    ].filter(Boolean);
-    return (React.createElement("span", { className: attachmentClassNames }, position === "end" ? content.reverse() : content));
-};
-const TextField = (props) => {
-    var _a;
-    const { onChange, onFocus, onBlur, name, value, defaultValue, placeholder, icon, endIcon, startSlot, endSlot, prefix, suffix, size = "medium", variant = "outline", className, attributes, } = props;
-    const formControl = useFormControl();
-    const id = useElementId(props.id);
-    const inputId = (formControl === null || formControl === void 0 ? void 0 : formControl.attributes.id) || ((_a = props.inputAttributes) === null || _a === void 0 ? void 0 : _a.id) || id;
-    const disabled = (formControl === null || formControl === void 0 ? void 0 : formControl.disabled) || props.disabled;
-    const hasError = (formControl === null || formControl === void 0 ? void 0 : formControl.hasError) || props.hasError;
-    const inputAttributes = Object.assign(Object.assign({}, props.inputAttributes), formControl === null || formControl === void 0 ? void 0 : formControl.attributes);
-    const rootClassName = classNames(s.root, className, size && responsiveClassNames(s, "--size", size), hasError && s["--status-error"], disabled && s["--disabled"], variant && s[`--variant-${variant}`]);
-    const handleChange = (event) => {
-        if (!onChange)
-            return;
-        onChange({ name, value: event.target.value, event });
-    };
-    return (React.createElement("div", Object.assign({}, attributes, { "data-rs-aligner-target": true, className: rootClassName }),
-        React.createElement(TextFieldSlot, { position: "start", icon: icon, slot: startSlot, size: size, affix: prefix }),
-        React.createElement("input", Object.assign({}, inputAttributes, { className: s.input, disabled: disabled, name: name, placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: handleChange, onFocus: onFocus || (inputAttributes === null || inputAttributes === void 0 ? void 0 : inputAttributes.onFocus), onBlur: onBlur || (inputAttributes === null || inputAttributes === void 0 ? void 0 : inputAttributes.onBlur), id: inputId })),
-        React.createElement(TextFieldSlot, { position: "end", icon: endIcon, slot: endSlot, size: size, affix: suffix })));
-};
-TextField.Aligner = Aligner;
-export default TextField;

package/components/TextField/TextField.types.d.ts

@@ -1,42 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-import { FormControlProps } from "../FormControl";
-import { IconProps } from "../Icon";
-type Size = G.Responsive<"medium" | "large" | "xlarge">;
-type BaseProps = {
-    id?: string;
-    name: string;
-    size?: Size;
-    disabled?: boolean;
-    placeholder?: string;
-    icon?: SlotProps["icon"];
-    endIcon?: SlotProps["icon"];
-    startSlot?: SlotProps["slot"];
-    endSlot?: SlotProps["slot"];
-    prefix?: React.ReactNode;
-    suffix?: React.ReactNode;
-    variant?: "outline" | "faded" | "headless";
-    onChange?: G.ChangeHandler<string>;
-    onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
-    onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-    inputAttributes?: G.Attributes<"input">;
-} & Pick<FormControlProps, "hasError">;
-export type ControlledProps = BaseProps & {
-    value: string;
-    defaultValue?: never;
-};
-export type UncontrolledProps = BaseProps & {
-    value?: never;
-    defaultValue?: string;
-};
-export type Props = ControlledProps | UncontrolledProps;
-export type SlotProps = {
-    slot?: React.ReactNode;
-    icon?: IconProps["svg"];
-    size: Size;
-    affix?: React.ReactNode;
-    position: "start" | "end";
-};
-export {};

package/components/Theme/GlobalColorMode.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Theme.types";
-declare const GlobalColorMode: (props: T.GlobalColorModeProps) => React.JSX.Element;
-export default GlobalColorMode;

package/components/Theme/GlobalColorMode.js

@@ -1,42 +0,0 @@
-"use client";
-import React from "react";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import { enableTransitions, disableTransitions, onNextFrame } from "../../utilities/animation.js";
-import { GlobalColorModeContext } from "./Theme.context.js";
-const GlobalColorMode = (props) => {
-    const { defaultMode, children } = props;
-    const [mode, setMode] = React.useState(defaultMode || "light");
-    const changeColorMode = React.useCallback((targetMode) => {
-        document.documentElement.setAttribute("data-rs-color-mode", targetMode);
-        setMode((prevMode) => {
-            if (prevMode !== targetMode) {
-                // Avoid components styles animating when switching to another color mode
-                disableTransitions();
-            }
-            return targetMode;
-        });
-    }, []);
-    useIsomorphicLayoutEffect(() => {
-        onNextFrame(() => {
-            enableTransitions();
-        });
-    }, [mode]);
-    /**
-     * In case color mode was set in html but was not provided to the provider - hydrate the state
-     * This could happen if we're receiving the mode on the client but before React hydration
-     */
-    useIsomorphicLayoutEffect(() => {
-        const nextColorMode = document.documentElement.getAttribute("data-rs-color-mode");
-        if (nextColorMode)
-            changeColorMode(nextColorMode);
-    }, []);
-    const value = React.useMemo(() => ({
-        mode,
-        setMode: changeColorMode,
-        invertMode: () => {
-            changeColorMode(mode === "light" ? "dark" : "light");
-        },
-    }), [mode, changeColorMode]);
-    return (React.createElement(GlobalColorModeContext.Provider, { value: value }, children));
-};
-export default GlobalColorMode;

package/components/Theme/Theme.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import * as T from "./Theme.types";
-declare const Theme: (props: T.Props) => React.JSX.Element;
-export default Theme;

package/components/Theme/Theme.js

@@ -1,48 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import { ThemeContext } from "./Theme.context.js";
-import { useTheme, useGlobalColorMode } from "./useTheme.js";
-import s from "./Theme.module.css";
-const Theme = (props) => {
-    const { name, defaultName, colorMode, children, className } = props;
-    const [mounted, setMounted] = React.useState(false);
-    const [stateTheme, setStateTheme] = React.useState(defaultName);
-    const globalColorMode = useGlobalColorMode();
-    const parentTheme = useTheme();
-    const isRootProvider = !parentTheme.theme;
-    const usedTheme = name || stateTheme || parentTheme.theme;
-    const parentColorMode = isRootProvider ? globalColorMode : parentTheme.colorMode;
-    const invertedColorMode = parentColorMode === "light" ? "dark" : "light";
-    const usedColorMode = colorMode === "inverted" ? invertedColorMode : colorMode || parentColorMode;
-    const rootClassNames = classNames(s.root, className);
-    const setTheme = (theme) => {
-        setStateTheme(theme);
-    };
-    useIsomorphicLayoutEffect(() => {
-        setMounted(true);
-    }, []);
-    useIsomorphicLayoutEffect(() => {
-        if (!document || !isRootProvider)
-            return;
-        const hasColorModeApplied = document.documentElement.getAttribute("data-rs-color-mode");
-        document.documentElement.setAttribute("data-rs-theme", usedTheme);
-        if (!hasColorModeApplied) {
-            document.documentElement.setAttribute("data-rs-color-mode", usedColorMode);
-        }
-        return () => {
-            document.documentElement.removeAttribute("data-rs-theme");
-            if (!hasColorModeApplied) {
-                document.documentElement.removeAttribute("data-rs-color-mode");
-            }
-        };
-    }, [usedTheme, usedColorMode, isRootProvider]);
-    return (React.createElement(ThemeContext.Provider, { value: {
-            theme: usedTheme,
-            colorMode: usedColorMode,
-            setTheme,
-        } },
-        React.createElement("div", { className: rootClassNames, "data-rs-theme": isRootProvider ? undefined : usedTheme, "data-rs-color-mode": isRootProvider || (!colorMode && !mounted) ? undefined : usedColorMode }, children)));
-};
-export default Theme;

package/components/Timeline/Timeline.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-import type * as T from "./Timeline.types";
-declare const Timeline: {
-    (props: T.Props): React.JSX.Element;
-    Item: (props: T.ItemProps) => React.JSX.Element;
-};
-export default Timeline;

package/components/Timeline/Timeline.js

@@ -1,21 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import View from "../View/index.js";
-import s from "./Timeline.module.css";
-const TimelineItem = (props) => {
-    const { children, markerSlot, className, attributes } = props;
-    const hasMarker = markerSlot !== null;
-    const itemClassNames = classNames(s.item, !hasMarker && s["item--full-width"], className);
-    return (React.createElement(View, { as: "li", direction: "row", align: "stretch", gap: 3, attributes: attributes, className: itemClassNames },
-        hasMarker && React.createElement("span", { className: s.marker }, markerSlot),
-        React.createElement(View.Item, { grow: true }, children)));
-};
-const Timeline = (props) => {
-    const { children, className, attributes } = props;
-    const rootClassNames = classNames(className);
-    return (React.createElement("ul", Object.assign({}, attributes, { className: rootClassNames }), React.Children.map(children, (child, index) => {
-        return (child === null || child === void 0 ? void 0 : child.type) === TimelineItem ? (child) : (React.createElement(TimelineItem, { key: index }, child));
-    })));
-};
-Timeline.Item = TimelineItem;
-export default Timeline;

package/components/Timeline/Timeline.types.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    children?: React.ReactNode;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"ul", Props>;
-};
-export type ItemProps = {
-    markerSlot?: React.ReactNode | null;
-    children?: React.ReactNode;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"li", ItemProps>;
-};

package/components/Toast/Toast.d.ts

@@ -1,6 +0,0 @@
-import React from "react";
-import type * as T from "./Toast.types";
-declare const Toast: (props: T.Props & {
-    collapsed: boolean;
-}) => React.JSX.Element;
-export default Toast;

package/components/Toast/Toast.js

@@ -1,55 +0,0 @@
-"use client";
-import React from "react";
-import View from "../View/index.js";
-import Button from "../Button/index.js";
-import Icon from "../Icon/index.js";
-import Theme from "../Theme/index.js";
-import Text from "../Text/index.js";
-import s from "./Toast.module.css";
-const Toast = (props) => {
-    const { size = "small", text, children, color = "inverted", icon, title, actionsSlot, startSlot, collapsed, className, attributes, } = props;
-    let backgroundColor = color === "inverted" || color === "neutral" ? "elevation-overlay" : color;
-    if (color === "neutral")
-        backgroundColor = collapsed ? "neutral" : "elevation-overlay";
-    const borderColor = color === "neutral" ? "neutral-faded" : "transparent";
-    const textTagName = size === "small" ? "span" : "div";
-    const isLarge = size === "large";
-    let actions = [];
-    if (actionsSlot) {
-        actions = Array.isArray(actionsSlot) ? actionsSlot : [actionsSlot];
-    }
-    const textContent = (title || text) && (React.createElement(React.Fragment, null,
-        title && (React.createElement(Text, { variant: "body-3", weight: "bold", as: textTagName },
-            title,
-            " ")),
-        React.createElement(Text, { variant: "body-3", as: textTagName }, text)));
-    const toastNode = (React.createElement(View, { backgroundColor: backgroundColor, borderColor: borderColor, padding: 4, borderRadius: "medium", animated: true, direction: "row", gap: 3, align: isLarge ? "start" : "center", className: [s.toast, className], attributes: attributes },
-        icon && React.createElement(Icon, { size: 5, svg: icon, className: s.icon }),
-        startSlot && !icon && React.createElement(View.Item, null, startSlot),
-        React.createElement(View.Item, { grow: true },
-            React.createElement(View, { direction: isLarge ? "column" : "row", align: isLarge ? "start" : "center", gap: 3 },
-                React.createElement(View.Item, { grow: true }, (textContent && children) || size !== "small" ? (React.createElement(View, { gap: 0.5 },
-                    textContent,
-                    children && React.createElement(View, { gap: 3 }, children))) : (textContent || children)),
-                actions.length && (React.createElement(View, { direction: "row", align: "center", gap: 2 }, actions.map((slot, index) => {
-                    const isPrimary = size === "large" ? index === 0 : index === actions.length - 1;
-                    const primaryColor = color === "neutral" || color === "inverted" ? "neutral" : "white";
-                    const defaultProps = {
-                        variant: isPrimary ? "solid" : "ghost",
-                        size: "small",
-                        color: isPrimary ? primaryColor : "inherit",
-                        elevated: color !== "neutral",
-                    };
-                    if (slot.type === Button) {
-                        return React.createElement(Button, Object.assign({}, defaultProps, slot.props, { key: index }));
-                    }
-                    else {
-                        return slot;
-                    }
-                })))))));
-    if (color === "inverted") {
-        return React.createElement(Theme, { colorMode: "inverted" }, toastNode);
-    }
-    return toastNode;
-};
-export default Toast;

package/components/Toast/Toast.types.d.ts

@@ -1,78 +0,0 @@
-import React from "react";
-import type { IconProps } from "../Icon";
-import type * as G from "../../types/global";
-export type Status = "entering" | "entered" | "exited";
-export type TimeoutAlias = "short" | "long";
-export type Timeout = TimeoutAlias | number;
-export type Position = "top" | "top-end" | "top-start" | "bottom" | "bottom-start" | "bottom-end";
-export type Props = {
-    size?: "small" | "medium" | "large";
-    icon?: IconProps["svg"];
-    startSlot?: React.ReactNode;
-    title?: React.ReactNode;
-    text?: React.ReactNode;
-    children?: React.ReactNode;
-    actionsSlot?: React.ReactNode;
-    color?: "neutral" | "primary" | "critical" | "positive" | "inverted";
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-};
-export type ProviderProps = {
-    children?: React.ReactNode;
-    options?: Partial<Record<RegionProps["position"], {
-        width?: string;
-        expanded?: boolean;
-    }>>;
-};
-export type RegionProps = {
-    position: Position;
-};
-export type ContainerProps = {
-    id: string;
-    toastProps: Props & {
-        timeout?: Timeout;
-    };
-    index: number;
-    status?: "entering" | "entered" | "exiting";
-    inspected: boolean;
-};
-export type Context = {
-    options?: ProviderProps["options"];
-    queues: Record<RegionProps["position"], Array<ContainerProps>>;
-    add: (toast: Props & ShowOptions) => string;
-    show: (id: string) => void;
-    hide: (id: string) => void;
-    remove: (id: string) => void;
-};
-export type ShowOptions = {
-    timeout?: Timeout;
-    position?: Position;
-};
-type AddAction = {
-    type: "add";
-    payload: {
-        toastProps: Props & ShowOptions;
-        id: string;
-    };
-};
-type ShowAction = {
-    type: "show";
-    payload: {
-        id: string;
-    };
-};
-type HideAction = {
-    type: "hide";
-    payload: {
-        id: string;
-    };
-};
-type RemoveAction = {
-    type: "remove";
-    payload: {
-        id: string;
-    };
-};
-type Action = AddAction | ShowAction | HideAction | RemoveAction;
-export type Reducer = (state: Context["queues"], action: Action) => Context["queues"];
-export {};

package/components/Toast/ToastContainer.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Toast.types";
-declare const ToastContainer: (props: T.ContainerProps) => React.JSX.Element;
-export default ToastContainer;

package/components/Toast/ToastContainer.js

@@ -1,97 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import { onNextFrame } from "../../utilities/animation.js";
-import { trapFocus, isKeyboardMode } from "../../utilities/a11y.js";
-import Toast from "./Toast.js";
-import ToastContext from "./Toast.context.js";
-import { timeouts } from "./Toast.constants.js";
-import s from "./Toast.module.css";
-const ToastContainer = (props) => {
-    const { toastProps, id, status, inspected, index } = props;
-    const { timeout = "short" } = toastProps;
-    const { show, hide, remove } = React.useContext(ToastContext);
-    const [toastHeight, setToastHeight] = React.useState();
-    const timeoutRef = React.useRef();
-    const resizingRef = React.useRef(false);
-    const trapFocusRef = React.useRef(null);
-    const wrapperRef = React.useRef(null);
-    const visible = status === "entered";
-    const containerClassNames = classNames(s.container, visible && s[`container--visible`], index === 0 && s[`container--index-${index}`], !inspected && (index === 1 || index === 2) && s[`container--index-${index}`], !inspected && index >= 3 && s["container--index-overflow"]);
-    const stopTimer = React.useCallback(() => {
-        if (!timeoutRef.current)
-            return;
-        clearTimeout(timeoutRef.current);
-    }, []);
-    const startTimer = React.useCallback(() => {
-        stopTimer();
-        const timeoutValue = typeof timeout === "string" ? timeouts[timeout] : timeout;
-        if (timeout === 0)
-            return;
-        timeoutRef.current = setTimeout(() => {
-            hide(id);
-        }, timeoutValue !== null && timeoutValue !== void 0 ? timeoutValue : timeouts.short);
-    }, [hide, id, timeout, stopTimer]);
-    const handleTransitionEnd = (e) => {
-        if (e.propertyName !== "height")
-            return;
-        if (visible)
-            return;
-        remove(id);
-    };
-    React.useEffect(() => {
-        if (!visible)
-            return;
-        if (inspected) {
-            stopTimer();
-        }
-        else {
-            startTimer();
-        }
-    }, [inspected, startTimer, stopTimer, visible]);
-    React.useEffect(() => {
-        if (wrapperRef.current) {
-            setToastHeight(wrapperRef.current.clientHeight);
-        }
-        show(id);
-        startTimer();
-    }, [show, id, startTimer]);
-    React.useEffect(() => {
-        if (!wrapperRef.current)
-            return;
-        if (visible) {
-            trapFocusRef.current = trapFocus(wrapperRef.current, {
-                includeTrigger: true,
-                mode: "content-menu",
-            });
-        }
-        else if (trapFocusRef.current && isKeyboardMode()) {
-            trapFocusRef.current();
-            trapFocusRef.current = null;
-        }
-    }, [visible]);
-    React.useEffect(() => {
-        if (!visible || index > 0)
-            return;
-        const handleResize = () => {
-            resizingRef.current = true;
-            onNextFrame(() => {
-                resizingRef.current = false;
-            });
-            if (wrapperRef.current) {
-                setToastHeight(wrapperRef.current.clientHeight);
-            }
-        };
-        window.addEventListener("resize", handleResize);
-        return () => window.removeEventListener("resize", handleResize);
-    }, [visible, index]);
-    return (React.createElement("li", { className: containerClassNames, style: {
-            // Height + padding + borders
-            height: status === "entered" ? `calc(${toastHeight}px + var(--rs-unit-x2) + 2px)` : 0,
-            // Disable transition when height of the toast can change
-            transitionDuration: resizingRef.current ? "0s" : undefined,
-        }, onTransitionEnd: handleTransitionEnd, onFocus: stopTimer, onBlur: startTimer },
-        React.createElement("span", { className: s.wrapper },
-            React.createElement(Toast, Object.assign({}, toastProps, { collapsed: index > 0 && !inspected, attributes: Object.assign(Object.assign({}, toastProps.attributes), { ref: wrapperRef }) })))));
-};
-export default ToastContainer;

package/components/Toast/ToastProvider.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import * as T from "./Toast.types";
-declare const ToastProvider: (props: T.ProviderProps) => React.JSX.Element;
-export default ToastProvider;

package/components/Toast/ToastProvider.js

@@ -1,82 +0,0 @@
-"use client";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from "react";
-import ToastContext from "./Toast.context.js";
-import ToastRegion from "./ToastRegion.js";
-import { positions, defaultContextData } from "./Toast.constants.js";
-let counter = 0;
-const generateId = () => `__rs-toast-${counter++}`;
-const toastReducer = (state, action) => {
-    let nextState;
-    switch (action.type) {
-        case "add":
-            const _a = action.payload.toastProps || {}, { position = "bottom-end" } = _a, toastProps = __rest(_a, ["position"]);
-            return Object.assign(Object.assign({}, state), { [position]: [...state[position], { id: action.payload.id, toastProps, status: "entering" }] });
-        case "show":
-            const { id: showId } = action.payload;
-            nextState = Object.assign({}, state);
-            positions.forEach((position) => {
-                nextState[position] = nextState[position].map((item) => {
-                    if (item.status !== "entering")
-                        return item;
-                    return item.id === showId ? Object.assign(Object.assign({}, item), { status: "entered" }) : item;
-                });
-            });
-            return nextState;
-        case "hide":
-            const { id: hideId } = action.payload;
-            nextState = Object.assign({}, state);
-            positions.forEach((position) => {
-                nextState[position] = nextState[position].map((item) => item.id === hideId ? Object.assign(Object.assign({}, item), { status: "exiting" }) : item);
-            });
-            return nextState;
-        case "remove":
-            const { id: removeId } = action.payload;
-            nextState = Object.assign({}, state);
-            positions.forEach((position) => {
-                nextState[position] = nextState[position].filter((item) => item.id !== removeId);
-            });
-            return nextState;
-    }
-};
-const ToastProvider = (props) => {
-    const { children, options } = props;
-    const [data, dispatch] = React.useReducer(toastReducer, defaultContextData.queues);
-    const add = React.useCallback((toastProps) => {
-        const id = generateId();
-        dispatch({ type: "add", payload: { toastProps, id } });
-        return id;
-    }, []);
-    const show = React.useCallback((id) => {
-        dispatch({ type: "show", payload: { id } });
-    }, []);
-    const hide = React.useCallback((id) => {
-        dispatch({ type: "hide", payload: { id } });
-    }, []);
-    const remove = React.useCallback((id) => {
-        dispatch({ type: "remove", payload: { id } });
-    }, []);
-    const value = React.useMemo(() => ({
-        queues: data,
-        add,
-        show,
-        hide,
-        remove,
-        inspecting: false,
-        options,
-    }), [data, show, hide, add, remove, options]);
-    return (React.createElement(ToastContext.Provider, { value: value },
-        children,
-        positions.map((position) => (React.createElement(ToastRegion, { position: position, key: position })))));
-};
-export default ToastProvider;

package/components/Toast/ToastRegion.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import * as T from "./Toast.types";
-declare const ToastRegion: (props: T.RegionProps) => React.JSX.Element | null;
-export default ToastRegion;

package/components/Toast/ToastRegion.js

@@ -1,63 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import { focusableSelector } from "../../utilities/a11y.js";
-import ToastContainer from "./ToastContainer.js";
-import ToastContext from "./Toast.context.js";
-import s from "./Toast.module.css";
-const ToastRegion = (props) => {
-    const { position } = props;
-    const { queues, options } = React.useContext(ToastContext);
-    const [inspecting, setInspecting] = React.useState(false);
-    const ignoreHoverRef = React.useRef(false);
-    const rootRef = React.useRef(null);
-    const queue = queues[position];
-    const { width, expanded } = (options === null || options === void 0 ? void 0 : options[position]) || {};
-    const regionClassNames = classNames(s.region, s[`region--position-${position}`]);
-    const filteredLength = queue.filter((item) => item.status === "entered").length;
-    let hiddenCount = 0;
-    // If touch event was triggered – ignore hover events
-    const handleTouchStart = () => {
-        ignoreHoverRef.current = true;
-    };
-    const handleClick = (e) => {
-        let currentEl = e.target;
-        let isFocusable = false;
-        while (currentEl && currentEl !== rootRef.current && !isFocusable) {
-            isFocusable = currentEl.matches(focusableSelector);
-            currentEl = currentEl.parentElement;
-        }
-        // Change inspecting mode when clicking on static content
-        if (!isFocusable) {
-            setInspecting((prevInspecting) => !prevInspecting);
-        }
-        // Click is called last so we reset our hover events ignore
-        ignoreHoverRef.current = false;
-    };
-    const handleMouseEnter = () => {
-        if (ignoreHoverRef.current)
-            return;
-        setInspecting(true);
-    };
-    const handleMouseLeave = () => {
-        if (ignoreHoverRef.current)
-            return;
-        setInspecting(false);
-    };
-    React.useEffect(() => {
-        if (queue.length === 0)
-            setInspecting(false);
-    }, [queue.length]);
-    if (!queue.length)
-        return null;
-    return (
-    // We only use onClick for touch devices since touchend is not supported
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-    React.createElement("ul", { role: "region", "aria-live": "polite", className: regionClassNames, ref: rootRef, onTouchStart: handleTouchStart, onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style: { width } }, queue.map((data, index) => {
-        const visibleIndex = filteredLength - index + hiddenCount - 1;
-        if (data.status !== "entered")
-            hiddenCount += 1;
-        return (React.createElement(ToastContainer, Object.assign({ key: data.id }, data, { index: visibleIndex, inspected: inspecting || !!expanded })));
-    })));
-};
-export default ToastRegion;

package/components/Tooltip/Tooltip.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import type * as T from "./Tooltip.types";
-declare const Tooltip: (props: T.Props) => React.JSX.Element;
-export default Tooltip;