reshaped 2.8.0 → 2.8.1

package/components/Hotkey/Hotkey.js

@@ -1,10 +0,0 @@
-import React from "react";
-import Text from "../Text/index.js";
-import { classNames } from "../../utilities/helpers.js";
-import s from "./Hotkey.module.css";
-const Hotkey = (props) => {
-    const { children, active, className, attributes } = props;
-    const rootClassNames = classNames(s.root, active && s["--active"], className);
-    return (React.createElement(Text, { as: "kbd", variant: "caption-1", weight: "medium", color: "neutral-faded", className: rootClassNames, attributes: attributes }, children));
-};
-export default Hotkey;

package/components/Hotkey/Hotkey.types.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    children: React.ReactNode;
-    active?: boolean;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"span", Props>;
-};

package/components/Icon/Icon.d.ts

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

package/components/Icon/Icon.js

@@ -1,17 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import getHeightStyles from "../../styles/height/index.js";
-import s from "./Icon.module.css";
-const Icon = (props) => {
-    const { svg: Component, className, color, size = "1em", autoWidth, attributes } = props;
-    const heightStyles = getHeightStyles(size);
-    const rootClassName = classNames(s.root, className, heightStyles === null || heightStyles === void 0 ? void 0 : heightStyles.classNames, color && s[`--color-${color}`], autoWidth && s["--auto"]);
-    const icon = React.isValidElement(Component) ? (Component) : (
-    // @ts-ignore
-    React.createElement(Component, null));
-    const style = Object.assign(Object.assign({}, attributes === null || attributes === void 0 ? void 0 : attributes.style), heightStyles === null || heightStyles === void 0 ? void 0 : heightStyles.variables);
-    return (
-    // All icons are decorative, a11y attributes should be set for buttons wrapping them
-    React.createElement("span", Object.assign({}, attributes, { "aria-hidden": "true", className: rootClassName, style: style }), React.cloneElement(icon, { focusable: false })));
-};
-export default Icon;

package/components/Icon/Icon.types.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    svg: React.ReactElement | React.ComponentType;
-    size?: G.Responsive<number | string>;
-    color?: "neutral" | "neutral-faded" | "positive" | "critical" | "warning" | "primary" | "disabled";
-    autoWidth?: boolean;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"span", Props>;
-};

package/components/Image/Image.d.ts

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

package/components/Image/Image.js

@@ -1,37 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import s from "./Image.module.css";
-import getRadiusStyles from "../../styles/radius/index.js";
-import getWidthStyles from "../../styles/width/index.js";
-import getHeightStyles from "../../styles/height/index.js";
-const Image = (props) => {
-    const { src, alt, width, height, onLoad, onError, fallback, displayMode = "cover", borderRadius, className, attributes, imageAttributes, } = props;
-    const [status, setStatus] = React.useState("loading");
-    const radiusStyles = getRadiusStyles(borderRadius);
-    const widthStyles = getWidthStyles(width);
-    const heightStyles = getHeightStyles(height);
-    const baseClassNames = classNames(s.root, radiusStyles === null || radiusStyles === void 0 ? void 0 : radiusStyles.classNames, widthStyles === null || widthStyles === void 0 ? void 0 : widthStyles.classNames, heightStyles === null || heightStyles === void 0 ? void 0 : heightStyles.classNames, displayMode && s[`--display-mode-${displayMode}`], className);
-    const imgClassNames = classNames(s.image, baseClassNames);
-    const fallbackClassNames = classNames(s.fallback, baseClassNames);
-    const style = Object.assign(Object.assign({}, widthStyles === null || widthStyles === void 0 ? void 0 : widthStyles.variables), heightStyles === null || heightStyles === void 0 ? void 0 : heightStyles.variables);
-    const handleLoad = (e) => {
-        setStatus("success");
-        onLoad === null || onLoad === void 0 ? void 0 : onLoad(e);
-    };
-    const handleError = (e) => {
-        setStatus("error");
-        onError === null || onError === void 0 ? void 0 : onError(e);
-    };
-    React.useEffect(() => {
-        setStatus("loading");
-    }, [src]);
-    if ((status === "error" || !src) && !!fallback) {
-        if (typeof fallback === "string") {
-            return (React.createElement("img", Object.assign({}, attributes, { src: fallback, alt: alt, role: alt ? undefined : "presentation", className: fallbackClassNames, style: style })));
-        }
-        return (React.createElement("div", Object.assign({}, attributes, { className: fallbackClassNames, style: style }), fallback));
-    }
-    return (React.createElement("img", Object.assign({}, attributes, imageAttributes, { src: src, alt: alt, role: alt ? undefined : "presentation", onLoad: handleLoad, onError: handleError, className: imgClassNames, style: style })));
-};
-export default Image;

package/components/Image/Image.types.d.ts

@@ -1,19 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-import type * as TStyles from "../../styles/types";
-export type Props = {
-    src?: string;
-    alt?: string;
-    width?: G.Responsive<string | number>;
-    height?: G.Responsive<string | number>;
-    onLoad?: (e: React.SyntheticEvent) => void;
-    onError?: (e: React.SyntheticEvent) => void;
-    fallback?: string | React.ReactNode | boolean;
-    displayMode?: "cover" | "contain";
-    borderRadius?: Extract<TStyles.Radius, "small" | "medium" | "large">;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props & {
-        ref: any;
-    }>;
-    imageAttributes?: G.Attributes<"img", Props>;
-};

package/components/Link/Link.js

@@ -1,13 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import Actionable from "../Actionable/index.js";
-import Icon from "../Icon/index.js";
-import s from "./Link.module.css";
-const Link = (props, ref) => {
-    const { icon, disabled, href, color = "primary", variant = "underline", className, children, attributes, type, onClick, } = props;
-    const rootClassNames = classNames(s.root, className, disabled && s["--disabled"], variant && s[`--variant-${variant}`], color && s[`--color-${color}`], icon && s["--with-icon"]);
-    return (React.createElement(Actionable, { href: href, disabled: disabled, className: rootClassNames, attributes: attributes, type: type, onClick: onClick, ref: ref },
-        icon && React.createElement(Icon, { svg: icon }),
-        children));
-};
-export default React.forwardRef(Link);

package/components/Loader/Loader.d.ts

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

package/components/Loader/Loader.js

@@ -1,11 +0,0 @@
-import React from "react";
-import { classNames, responsiveClassNames } from "../../utilities/helpers.js";
-import s from "./Loader.module.css";
-const Loader = (props) => {
-    const { size = "small", color = "primary", className, attributes } = props;
-    const ariaLabel = attributes === null || attributes === void 0 ? void 0 : attributes["aria-label"];
-    const rootClassNames = classNames(s.root, className, responsiveClassNames(s, "--size", size), color && s[`--color-${color}`]);
-    return (React.createElement("span", Object.assign({}, attributes, { role: "progressbar", "aria-live": ariaLabel ? "assertive" : undefined, "aria-label": ariaLabel, className: rootClassNames }),
-        React.createElement("span", { className: s.inner })));
-};
-export default Loader;

package/components/MenuItem/MenuItem.js

@@ -1,22 +0,0 @@
-import React from "react";
-import { classNames, responsiveClassNames, responsivePropDependency } from "../../utilities/helpers.js";
-import Actionable from "../Actionable/index.js";
-import Icon from "../Icon/index.js";
-import View from "../View/index.js";
-import MenuItemAligner from "./MenuItemAligner.js";
-import s from "./MenuItem.module.css";
-const MenuItemBase = (props, ref) => {
-    const { icon, startSlot, endSlot, children, color = "primary", selected, disabled, onClick, href, size = "medium", roundedCorners, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, className, responsiveClassNames(s, "--size", size), responsiveClassNames(s, "--rounded-corners", roundedCorners), color && s[`--color-${color}`], selected && s["--selected"], disabled && s["--disabled"]);
-    const gapSize = responsivePropDependency(size, (size) => (size === "large" ? 3 : 2));
-    const iconSize = responsivePropDependency(size, (size) => (size === "large" ? 5 : 4));
-    return (React.createElement(Actionable, { disabled: disabled, className: rootClassNames, attributes: Object.assign(Object.assign({}, attributes), { "data-rs-aligner-target": true }), onClick: onClick, href: href, ref: ref },
-        React.createElement(View, { direction: "row", gap: gapSize, align: "center" },
-            icon && React.createElement(Icon, { svg: icon, className: s.icon, size: iconSize }),
-            !icon && startSlot,
-            children && (React.createElement(View.Item, { grow: true, className: s.content }, children)),
-            endSlot)));
-};
-const MenuItem = React.forwardRef(MenuItemBase);
-MenuItem.Aligner = MenuItemAligner;
-export default MenuItem;

package/components/MenuItem/MenuItemAligner.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { type AlignerProps } from "../_private/Aligner";
-declare const MenuItemAligner: (props: AlignerProps) => React.JSX.Element;
-export default MenuItemAligner;

package/components/MenuItem/MenuItemAligner.js

@@ -1,7 +0,0 @@
-import React from "react";
-import Aligner from "../_private/Aligner/index.js";
-import s from "./MenuItem.module.css";
-const MenuItemAligner = (props) => {
-    return (React.createElement(Aligner, Object.assign({}, props, { side: props.side || "inline", className: [s.aligner, props.className] })));
-};
-export default MenuItemAligner;

package/components/Modal/Modal.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import type * as T from "./Modal.types";
-declare const Modal: {
-    (props: T.Props): React.JSX.Element;
-    Title: (props: T.TitleProps) => React.JSX.Element;
-    Subtitle: (props: T.SubtitleProps) => React.JSX.Element;
-};
-export default Modal;

package/components/Modal/Modal.js

@@ -1,163 +0,0 @@
-"use client";
-import React from "react";
-import { classNames, responsiveVariables, responsiveClassNames } from "../../utilities/helpers.js";
-import useResponsiveClientValue from "../../hooks/useResponsiveClientValue.js";
-import Text from "../Text/index.js";
-import Overlay from "../Overlay/index.js";
-import useElementId from "../../hooks/useElementId.js";
-import s from "./Modal.module.css";
-import getPaddingStyles from "../../styles/padding/index.js";
-const DRAG_THRESHOLD = 32;
-const DRAG_OPPOSITE_THRESHOLD = 100;
-const DRAG_EDGE_BOUNDARY = 32;
-const Context = React.createContext({
-    id: "",
-    titleMounted: false,
-    setTitleMounted: () => { },
-    subtitleMounted: false,
-    setSubtitleMounted: () => { },
-});
-const useModal = () => React.useContext(Context);
-const ModalTitle = (props) => {
-    const { children } = props;
-    const { id, setTitleMounted } = useModal();
-    React.useEffect(() => {
-        setTitleMounted(true);
-        return () => setTitleMounted(false);
-    }, [setTitleMounted]);
-    return (React.createElement(Text, { variant: "featured-3", weight: "bold", attributes: { id: `${id}-title` } }, children));
-};
-const ModalSubtitle = (props) => {
-    const { children } = props;
-    const { id, setSubtitleMounted } = useModal();
-    React.useEffect(() => {
-        setSubtitleMounted(true);
-        return () => setSubtitleMounted(false);
-    }, [setSubtitleMounted]);
-    return (React.createElement(Text, { variant: "body-3", color: "neutral-faded", attributes: { id: `${id}-subtitle` } }, children));
-};
-const Modal = (props) => {
-    const { children, onClose, active, size, padding = 4, position = "center", transparentOverlay, className, attributes, } = props;
-    const id = useElementId();
-    const clientPosition = useResponsiveClientValue(position);
-    const [titleMounted, setTitleMounted] = React.useState(false);
-    const [subtitleMounted, setSubtitleMounted] = React.useState(false);
-    const [dragging, setDragging] = React.useState(false);
-    const rootRef = React.useRef(null);
-    const dragStartCoordinatesRef = React.useRef({ x: 0, y: 0 });
-    const dragLastCoordinateRef = React.useRef(0);
-    const dragDistanceRef = React.useRef(0);
-    const dragDirectionRef = React.useRef(0);
-    const [dragDistance, setDragDistance] = React.useState(0);
-    const [hideProgress, setHideProgress] = React.useState(0);
-    const paddingStyles = getPaddingStyles(padding);
-    const value = React.useMemo(() => ({
-        titleMounted,
-        setTitleMounted,
-        subtitleMounted,
-        setSubtitleMounted,
-        id,
-    }), [id, subtitleMounted, titleMounted]);
-    const resetDragData = () => {
-        dragStartCoordinatesRef.current = { x: 0, y: 0 };
-        dragLastCoordinateRef.current = 0;
-        dragDirectionRef.current = 0;
-        setDragDistance(0);
-    };
-    const handleDragStart = (e) => {
-        const el = e.target;
-        // Prioritize scrolling over modal swiping
-        if (el.scrollTop !== 0 || el.scrollLeft !== 0)
-            return;
-        // Start dragging only when starting on static elements
-        if (el.matches("input,textarea"))
-            return;
-        // Prevent the drag handling when browser tab swiping is triggering
-        if (clientPosition === "start" && e.targetTouches[0].clientX < DRAG_EDGE_BOUNDARY)
-            return;
-        setDragging(true);
-    };
-    // Once modal is closed - reset its drag data
-    const handleTransitionEnd = (e) => {
-        if (active)
-            return;
-        if (e.propertyName !== "transform")
-            return;
-        if (e.currentTarget !== e.target)
-            return;
-        resetDragData();
-    };
-    React.useEffect(() => {
-        if (!dragging)
-            return;
-        const handleDragEnd = () => {
-            setDragging(false);
-            // Close only when dragging in the closing direction
-            // Changing to a different direction will keep the modal opened
-            const shouldClose = clientPosition === "start" ? dragDirectionRef.current < 0 : dragDirectionRef.current > 0;
-            if (Math.abs(dragDistanceRef.current) > DRAG_THRESHOLD && shouldClose) {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
-            }
-            else {
-                resetDragData();
-            }
-        };
-        const handleDrag = (e) => {
-            if (!dragging || clientPosition === "center")
-                return;
-            const target = e.targetTouches[0];
-            const coordinate = { x: target.clientX, y: target.clientY };
-            const key = clientPosition === "bottom" ? "y" : "x";
-            const oppositeKey = clientPosition === "bottom" ? "x" : "y";
-            // Save the initial coordinates
-            if (!dragStartCoordinatesRef.current[key]) {
-                dragStartCoordinatesRef.current = coordinate;
-                dragLastCoordinateRef.current = coordinate[key];
-            }
-            const next = Math.abs(coordinate[key] - dragStartCoordinatesRef.current[key]);
-            const nextOpposite = Math.abs(coordinate[oppositeKey] - dragStartCoordinatesRef.current[oppositeKey]);
-            // For start/end drawers - ignore the swiping
-            // If user is scrolling vertically more than swiping
-            if (position !== "bottom" &&
-                (next < nextOpposite || nextOpposite > DRAG_OPPOSITE_THRESHOLD)) {
-                dragLastCoordinateRef.current = coordinate[key];
-                return;
-            }
-            dragDirectionRef.current = coordinate[key] - dragLastCoordinateRef.current;
-            dragLastCoordinateRef.current = coordinate[key];
-            setDragDistance((prev) => clientPosition === "start"
-                ? Math.min(0, prev + dragDirectionRef.current)
-                : Math.max(0, prev + dragDirectionRef.current));
-        };
-        document.addEventListener("touchmove", handleDrag);
-        document.addEventListener("touchend", handleDragEnd);
-        return () => {
-            document.removeEventListener("touchmove", handleDrag);
-            document.removeEventListener("touchend", handleDragEnd);
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [dragging, clientPosition]);
-    // Syncing distance to the ref to avoid having a dependency on dragDistance in handleDragEnd
-    React.useEffect(() => {
-        const rootEl = rootRef.current;
-        if (!rootEl || !clientPosition)
-            return;
-        const isInline = ["start", "end"].includes(clientPosition);
-        const size = isInline ? rootEl.clientWidth : rootEl.clientHeight;
-        const progress = Math.abs(dragDistance) / size;
-        setHideProgress(progress / 2);
-        dragDistanceRef.current = dragDistance;
-    }, [dragDistance, clientPosition]);
-    return (React.createElement(Overlay, { onClose: onClose, active: active, transparent: transparentOverlay || hideProgress, attributes: {
-            onTouchStart: handleDragStart,
-        } }, ({ active }) => {
-        const rootClassNames = classNames(s.root, className, paddingStyles === null || paddingStyles === void 0 ? void 0 : paddingStyles.classNames, active && s["--active"], dragging && s["--dragging"], responsiveClassNames(s, "--position", position));
-        return (React.createElement(Context.Provider, { value: value },
-            React.createElement("div", Object.assign({}, attributes, { style: Object.assign(Object.assign(Object.assign({}, paddingStyles === null || paddingStyles === void 0 ? void 0 : paddingStyles.variables), responsiveVariables("--rs-modal-size", size)), { "--rs-modal-drag": Math.abs(dragDistance) < DRAG_THRESHOLD
-                        ? "0px"
-                        : `${dragDistance + DRAG_THRESHOLD * (clientPosition === "start" ? 1 : -1)}px` }), "aria-labelledby": titleMounted ? `${id}-title` : undefined, "aria-describedby": subtitleMounted ? `${id}-subtitle` : undefined, className: rootClassNames, "aria-modal": "true", role: "dialog", ref: rootRef, onTransitionEnd: handleTransitionEnd }), children)));
-    }));
-};
-Modal.Title = ModalTitle;
-Modal.Subtitle = ModalSubtitle;
-export default Modal;

package/components/Modal/Modal.types.d.ts

@@ -1,26 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Context = {
-    id: string;
-    titleMounted: boolean;
-    setTitleMounted: (b: boolean) => void;
-    subtitleMounted: boolean;
-    setSubtitleMounted: (b: boolean) => void;
-};
-export type TitleProps = {
-    children: React.ReactNode;
-};
-export type SubtitleProps = {
-    children: React.ReactNode;
-};
-export type Props = {
-    children?: React.ReactNode;
-    position?: G.Responsive<"center" | "end" | "bottom" | "start">;
-    size?: G.Responsive<string>;
-    padding?: G.Responsive<number>;
-    active?: boolean;
-    transparentOverlay?: boolean;
-    onClose?: () => void;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-};

package/components/Overlay/Overlay.d.ts

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

package/components/Overlay/Overlay.js

@@ -1,115 +0,0 @@
-"use client";
-import React from "react";
-import { onNextFrame } from "../../utilities/animation.js";
-import { classNames } from "../../utilities/helpers.js";
-import { trapFocus } from "../../utilities/a11y.js";
-import useToggle from "../../hooks/useToggle.js";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import useHotkeys from "../../hooks/useHotkeys.js";
-import useScrollLock from "../../hooks/useScrollLock.js";
-import useIsDismissible from "../../hooks/_private/useIsDismissible.js";
-import Portal from "../_private/Portal/index.js";
-import s from "./Overlay.module.css";
-const Overlay = (props) => {
-    const { active, children, transparent, onClose, className, attributes } = props;
-    const clickThrough = transparent === true;
-    const opacity = clickThrough ? 0 : (1 - (transparent || 0)) * 0.7;
-    const [mounted, setMounted] = React.useState(false);
-    const [animated, setAnimated] = React.useState(false);
-    const contentRef = React.useRef(null);
-    const isMouseDownValidRef = React.useRef(false);
-    const releaseFocusRef = React.useRef(null);
-    const { lockScroll, unlockScroll } = useScrollLock();
-    const { active: rendered, activate: render, deactivate: remove } = useToggle(active || false);
-    const { active: visible, activate: show, deactivate: hide } = useToggle(active || false);
-    const isDismissible = useIsDismissible(active, contentRef);
-    const rootClassNames = classNames(s.root, visible && s["--visible"], clickThrough && s["--click-through"], animated && s["--animated"], className);
-    const isInsideChild = (el) => {
-        if (!contentRef.current)
-            return;
-        const firstChild = contentRef.current.firstChild;
-        if (!firstChild)
-            return;
-        return firstChild.contains(el);
-    };
-    const trapFocusInside = () => {
-        if (!contentRef.current)
-            return;
-        releaseFocusRef.current = trapFocus(contentRef.current);
-    };
-    const cancelTrapFocus = () => {
-        if (!releaseFocusRef.current)
-            return;
-        releaseFocusRef.current();
-        releaseFocusRef.current = null;
-    };
-    const close = React.useCallback(() => {
-        if (!visible || !isDismissible())
-            return;
-        if (onClose)
-            onClose();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [visible, isDismissible]);
-    const handleMouseDown = (event) => {
-        isMouseDownValidRef.current = !isInsideChild(event.target);
-    };
-    const handleMouseUp = (event) => {
-        const isMouseUpValid = !isInsideChild(event.target);
-        const shouldClose = isMouseDownValidRef.current && isMouseUpValid && !clickThrough;
-        if (!shouldClose)
-            return;
-        close();
-    };
-    const handleTransitionEnd = (e) => {
-        if (e.propertyName !== "transform" || !e.pseudoElement)
-            return;
-        setAnimated(false);
-        if (visible)
-            return;
-        if (!clickThrough)
-            unlockScroll();
-        remove();
-    };
-    useHotkeys({ Escape: close }, [close]);
-    React.useEffect(() => {
-        setAnimated(true);
-        if (active && !rendered)
-            render();
-        if (!active && rendered)
-            hide();
-    }, [active, render, hide, rendered]);
-    // Show overlay after it was rendered
-    React.useEffect(() => {
-        if (!rendered)
-            return;
-        if (!clickThrough)
-            lockScroll();
-        onNextFrame(() => {
-            show();
-        });
-    }, [rendered, show, lockScroll, clickThrough]);
-    React.useEffect(() => {
-        if (!rendered)
-            return;
-        trapFocusInside();
-        return () => cancelTrapFocus();
-    }, [rendered]);
-    // Unlock scroll on unmount
-    React.useEffect(() => {
-        return () => {
-            if (!clickThrough)
-                unlockScroll();
-        };
-    }, [unlockScroll, clickThrough]);
-    useIsomorphicLayoutEffect(() => {
-        setMounted(true);
-    }, []);
-    if (!rendered || !mounted)
-        return null;
-    return (React.createElement(Portal, null,
-        React.createElement(Portal.Scope, null, (ref) => (React.createElement("div", Object.assign({}, attributes, { ref: ref, style: { "--rs-overlay-opacity": opacity }, role: "button", tabIndex: -1, className: rootClassNames, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onTransitionEnd: handleTransitionEnd }),
-            React.createElement("div", { className: s.wrapper },
-                React.createElement("div", { className: s.inner },
-                    React.createElement("div", { className: s.content, ref: contentRef }, typeof children === "function" ? children({ active: visible }) : children))))))));
-};
-export default Overlay;

package/components/Overlay/Overlay.types.d.ts

@@ -1,12 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    transparent?: boolean | number;
-    children?: React.ReactNode | ((props: {
-        active: boolean;
-    }) => React.ReactNode);
-    active?: boolean;
-    onClose?: () => void;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-};

package/components/Popover/Popover.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import type * as T from "./Popover.types";
-declare const Popover: {
-    (props: T.Props): React.JSX.Element;
-    Trigger: (props: import("../_private/Flyout").FlyoutTriggerProps) => React.JSX.Element;
-    Content: (props: import("../_private/Flyout").FlyoutContentProps) => React.JSX.Element | null;
-};
-export default Popover;

package/components/Popover/Popover.js

@@ -1,19 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import Flyout from "../_private/Flyout/index.js";
-import s from "./Popover.module.css";
-import getPaddingStyles from "../../styles/padding/index.js";
-const Popover = (props) => {
-    var _a;
-    const { id, forcePosition, onOpen, onClose, active, defaultActive, children, width, contentGap, variant = "elevated", triggerType = "click", position = "bottom", disableHideAnimation, instanceRef, } = props;
-    const padding = (_a = props.padding) !== null && _a !== void 0 ? _a : (variant === "headless" ? 0 : 4);
-    const trapFocusMode = props.trapFocusMode || (triggerType === "hover" ? "content-menu" : undefined);
-    const paddingStyles = getPaddingStyles(padding);
-    const contentClassName = classNames(s.content, !!width && s["content--has-width"], variant && s[`content--variant-${variant}`], paddingStyles === null || paddingStyles === void 0 ? void 0 : paddingStyles.classNames);
-    return (
-    // @ts-ignore
-    React.createElement(Flyout, { id: id, instanceRef: instanceRef, position: position, forcePosition: forcePosition, onOpen: onOpen, onClose: onClose, trapFocusMode: trapFocusMode, triggerType: triggerType, active: active, defaultActive: defaultActive, width: width, disableHideAnimation: disableHideAnimation, contentGap: contentGap, contentClassName: contentClassName, contentAttributes: { style: Object.assign({}, paddingStyles === null || paddingStyles === void 0 ? void 0 : paddingStyles.variables) } }, children));
-};
-Popover.Trigger = Flyout.Trigger;
-Popover.Content = Flyout.Content;
-export default Popover;

package/components/Popover/Popover.types.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-import type { FlyoutProps } from "../_private/Flyout";
-export type Props = Pick<FlyoutProps, "id" | "position" | "forcePosition" | "onOpen" | "onClose" | "width" | "trapFocusMode" | "active" | "defaultActive" | "contentGap" | "instanceRef" | "triggerType" | "disableHideAnimation"> & {
-    children?: React.ReactNode;
-    padding?: number;
-    variant?: "elevated" | "headless";
-};

package/components/Progress/Progress.d.ts

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

package/components/Progress/Progress.js

@@ -1,18 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import s from "./Progress.module.css";
-const Progress = (props) => {
-    const { value = 0, min = 0, max = 100, color = "primary", size = "medium", duration, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, className, color && s[`--color-${color}`], size && s[`--size-${size}`], !!duration && s["--duration"]);
-    const total = max - min;
-    const normalizedValue = value - min;
-    const resolvedValue = Math.max(min, Math.min(max, normalizedValue));
-    const width = (resolvedValue / total) * 100;
-    const translate = `${width - 100}%`;
-    return (React.createElement("div", Object.assign({ role: "progressbar" }, attributes, { className: rootClassNames, "aria-valuemax": max, "aria-valuemin": min, "aria-valuenow": value }),
-        React.createElement("div", { className: s.value, style: {
-                "--rs-progress-value": translate,
-                "--rs-progress-duration": duration ? `${duration}ms` : undefined,
-            } })));
-};
-export default Progress;

package/components/Radio/Radio.d.ts

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

package/components/Radio/Radio.js

@@ -1,34 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import HiddenInput from "../_private/HiddenInput/index.js";
-import { useRadioGroup } from "../RadioGroup/index.js";
-import { useFormControl } from "../FormControl/index.js";
-import s from "./Radio.module.css";
-const Radio = (props) => {
-    const { children, value, onChange, onFocus, onBlur, className, attributes, inputAttributes } = props;
-    const formControl = useFormControl();
-    const radioGroup = useRadioGroup();
-    const hasError = (formControl === null || formControl === void 0 ? void 0 : formControl.hasError) || props.hasError || (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.hasError);
-    const disabled = (formControl === null || formControl === void 0 ? void 0 : formControl.disabled) || props.disabled || (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.disabled);
-    const checked = radioGroup ? radioGroup.value === value : props.checked;
-    const defaultChecked = radioGroup ? undefined : props.defaultChecked;
-    const name = radioGroup ? radioGroup.name : props.name;
-    const rootClassName = classNames(s.root, className, hasError && s["--error"], disabled && s["--disabled"]);
-    const handleChange = (event) => {
-        if (!name)
-            return;
-        const { checked } = event.target;
-        const changeArgs = { name, value, checked, event };
-        if (onChange)
-            onChange(changeArgs);
-        if (radioGroup === null || radioGroup === void 0 ? void 0 : radioGroup.onChange)
-            radioGroup.onChange(changeArgs);
-    };
-    return (React.createElement("label", Object.assign({}, attributes, { className: rootClassName }),
-        React.createElement("span", { className: s.field },
-            React.createElement(HiddenInput, { className: s.input, type: "radio", checked: checked, defaultChecked: defaultChecked, name: name, disabled: disabled, value: value, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, attributes: inputAttributes }),
-            React.createElement("div", { className: s.decorator })),
-        children && React.createElement("span", { className: s.text }, children)));
-};
-export default Radio;