reshaped 2.7.5-beta.0 → 2.8.1

package/components/Scrim/Scrim.js

@@ -1,13 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import s from "./Scrim.module.css";
-const Scrim = (props) => {
-    const { children, backgroundSlot, position = "cover", attributes, className, scrimClassName, } = props;
-    const rootClassNames = classNames(s.root, !!backgroundSlot && s["--with-background"], position && s[`--position-${position}`], className);
-    const scrimClassNames = classNames(s.scrim, scrimClassName);
-    return (React.createElement("div", Object.assign({}, attributes, { className: rootClassNames }),
-        backgroundSlot,
-        React.createElement("div", { className: scrimClassNames },
-            React.createElement("div", { className: s.content }, children))));
-};
-export default Scrim;

package/components/Select/Select.d.ts

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

package/components/Select/Select.js

@@ -1,59 +0,0 @@
-"use client";
-import React from "react";
-import Icon from "../Icon/index.js";
-import { useFormControl } from "../FormControl/index.js";
-import Actionable from "../Actionable/index.js";
-import Text from "../Text/index.js";
-import IconArrow from "../../icons/ChevronVertical.js";
-import { classNames, responsiveClassNames, responsivePropDependency } from "../../utilities/helpers.js";
-import useElementId from "../../hooks/useElementId.js";
-import s from "./Select.module.css";
-const Select = (props) => {
-    var _a, _b;
-    const { onChange, onClick, onFocus, onBlur, name, value, defaultValue, placeholder, options, children, icon, startSlot, size = "medium", variant = "outline", className, attributes, } = props;
-    const [empty, setEmpty] = React.useState(value === undefined ? !defaultValue : !value);
-    const formControl = useFormControl();
-    const id = useElementId(props.id);
-    const inputId = ((_a = formControl === null || formControl === void 0 ? void 0 : formControl.attributes) === null || _a === void 0 ? void 0 : _a.id) || ((_b = props.inputAttributes) === null || _b === void 0 ? void 0 : _b.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"], empty && options && s["--placeholder"], variant && s[`--variant-${variant}`]);
-    const handleChange = (event) => {
-        const nextValue = event.target.value;
-        // Uncontrolled placeholder
-        if (value === undefined)
-            setEmpty(!nextValue);
-        if (!onChange)
-            return;
-        onChange({ name, value: nextValue, event });
-    };
-    // Controlled placeholder
-    React.useEffect(() => {
-        if (value === undefined)
-            return;
-        setEmpty(!value);
-    }, [value]);
-    const startContent = (startSlot || icon) && (React.createElement("div", { className: s.slot }, icon ? (React.createElement(Icon, { size: responsivePropDependency(size, (size) => {
-            if (size === "large")
-                return 5;
-            if (size === "xlarge")
-                return 6;
-            return 4;
-        }), svg: icon })) : (startSlot)));
-    return (React.createElement("div", Object.assign({}, attributes, { className: rootClassName }),
-        options ? (React.createElement(React.Fragment, null,
-            startContent,
-            React.createElement("select", Object.assign({}, inputAttributes, { className: s.input, disabled: disabled, name: name, 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 }),
-                placeholder && React.createElement("option", { value: "" }, placeholder),
-                options.map((option) => (React.createElement("option", { key: option.value, value: option.value, disabled: option.disabled }, option.label)))))) : (React.createElement(React.Fragment, null,
-            React.createElement(Actionable, { className: s.input, disabled: disabled, onClick: onClick, attributes: Object.assign(Object.assign({}, inputAttributes), { onFocus: onFocus || (inputAttributes === null || inputAttributes === void 0 ? void 0 : inputAttributes.onFocus), onBlur: onBlur || (inputAttributes === null || inputAttributes === void 0 ? void 0 : inputAttributes.onBlur) }) },
-                startContent,
-                children || (placeholder ? React.createElement(Text, { color: "neutral-faded" }, placeholder) : null)),
-            React.createElement("input", { type: "hidden", value: value, name: name }))),
-        React.createElement("div", { className: s.arrow },
-            React.createElement(Icon, { svg: IconArrow, color: disabled ? "disabled" : "neutral-faded", size: responsivePropDependency(size, (size) => {
-                    return size === "large" || size === "xlarge" ? 5 : 4;
-                }) }))));
-};
-export default Select;

package/components/Skeleton/Skeleton.d.ts

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

package/components/Skeleton/Skeleton.js

@@ -1,10 +0,0 @@
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import View from "../View/index.js";
-import s from "./Skeleton.module.css";
-const Skeleton = (props) => {
-    const { borderRadius = "small", width, height, className, attributes } = props;
-    const rootClassNames = classNames(s.root, className);
-    return (React.createElement(View, { backgroundColor: "disabled", width: width, height: height, borderRadius: borderRadius, className: rootClassNames, attributes: attributes }));
-};
-export default Skeleton;

package/components/Skeleton/Skeleton.types.d.ts

@@ -1,6 +0,0 @@
-import type { ViewProps } from "../View";
-import * as G from "../../types/global";
-export type Props = Pick<ViewProps, "width" | "height" | "borderRadius"> & {
-    className?: G.ClassName;
-    attributes?: G.Attributes<"div", Props>;
-};

package/components/Slider/Slider.d.ts

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

package/components/Slider/Slider.js

@@ -1,26 +0,0 @@
-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 SliderControlled from "./SliderControlled.js";
-import SliderUncontrolled from "./SliderUncontrolled.js";
-const Slider = (props) => {
-    const { min = 0, max = 100 } = props, rest = __rest(props, ["min", "max"]);
-    if (("value" in props && props.value !== undefined) ||
-        ("minValue" in props &&
-            "maxValue" in props &&
-            props.minValue !== undefined &&
-            props.maxValue !== undefined)) {
-        return React.createElement(SliderControlled, Object.assign({}, rest, { min: min, max: max }));
-    }
-    return React.createElement(SliderUncontrolled, Object.assign({}, rest, { min: min, max: max }));
-};
-export default Slider;

package/components/Slider/Slider.module.css

@@ -1 +0,0 @@
-.root{-webkit-tap-highlight-color:transparent;align-items:center;cursor:pointer;display:flex;height:var(--rs-unit-x4);user-select:none}.bar,.root{position:relative}.bar{background:var(--rs-color-background-neutral);border-radius:var(--rs-unit-radius-small);height:var(--rs-unit-x1);width:100%}.bar,.input{overflow:hidden}.input{height:1px;opacity:0;pointer-events:none;position:absolute;width:1px}.selection{background:var(--rs-color-background-primary);height:100%;position:absolute}.tooltip{background:var(--rs-color-background-elevation-overlay);border-radius:var(--rs-unit-radius-small);bottom:100%;box-shadow:var(--rs-shadow-overlay);color:var(--rs-color-foreground-neutral);left:50%;opacity:0;padding:calc(var(--rs-unit-x1) / 2) var(--rs-unit-x1);transform:translate(-50%);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,transform;user-select:none}.thumb,.tooltip{position:absolute}.thumb{height:100%;width:0}.thumb:before{background:var(--rs-color-background-primary);border-radius:999px;box-shadow:0 0 0 2px var(--rs-color-background-elevation-base);box-sizing:border-box;height:var(--rs-unit-x4);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:box-shadow;width:var(--rs-unit-x4)}.thumb:after,.thumb:before{content:"";left:0;position:absolute;top:50%;transform:translate(-50%,-50%)}.thumb:after{cursor:grab;height:var(--rs-unit-x9);width:var(--rs-unit-x9)}.thumb:hover .tooltip{opacity:1;transform:translate(-50%,calc(var(--rs-unit-x1) * -1))}.input:focus+.thumb:after,.thumb--active:after{cursor:grabbing}.input:focus+.thumb:before,.thumb--active:before{box-shadow:0 0 0 1px var(--rs-color-background-elevation-base)}.input:focus+.thumb .tooltip,.thumb--active .tooltip{opacity:1;transform:translate(-50%,calc(var(--rs-unit-x1) * -1)) scale(1.1)!important}.--disabled{cursor:not-allowed}.--disabled .bar{background-color:var(--rs-color-background-disabled)}.--disabled .selection,.--disabled .thumb:before{background-color:var(--rs-color-foreground-disabled)}.--disabled .thumb:after{cursor:not-allowed}.--disabled .thumb:hover .tooltip{opacity:0}

package/components/Slider/SliderControlled.d.ts

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

package/components/Slider/SliderControlled.js

@@ -1,172 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import useRTL from "../../hooks/useRTL.js";
-import useElementId from "../../hooks/useElementId.js";
-import { useFormControl } from "../FormControl/index.js";
-import SliderThumb from "./SliderThumb.js";
-import s from "./Slider.module.css";
-const getDragX = (event) => {
-    if (event instanceof MouseEvent)
-        return event.pageX || event.screenX;
-    return event.changedTouches[0].pageX;
-};
-const applyStepToValue = (value, step) => {
-    return Math.round(value / step) * step;
-};
-const SliderControlled = (props) => {
-    var _a;
-    const { name, range, max, min, step = 1, onChange, onChangeCommit, renderValue, className, attributes, } = props;
-    const minValue = range && props.minValue !== undefined ? applyStepToValue(props.minValue, step) : undefined;
-    const maxValue = applyStepToValue(range ? props.maxValue : props.value, step);
-    const barRef = React.useRef(null);
-    const minRef = React.useRef(null);
-    const maxRef = React.useRef(null);
-    const [draggingId, setDraggingId] = React.useState(null);
-    const [rtl] = useRTL();
-    const formControl = useFormControl();
-    const id = useElementId();
-    const inputId = ((_a = formControl === null || formControl === void 0 ? void 0 : formControl.attributes) === null || _a === void 0 ? void 0 : _a.id) || id;
-    const minId = `${inputId}-min`;
-    const maxId = `${inputId}-max`;
-    const disabled = (formControl === null || formControl === void 0 ? void 0 : formControl.disabled) || props.disabled;
-    const rootClassNames = classNames(s.root, disabled && s["--disabled"], className);
-    const getPositionValue = React.useCallback((x) => {
-        if (!barRef.current)
-            return;
-        const barWidth = barRef.current.clientWidth;
-        const positionX = x - barRef.current.getBoundingClientRect().left;
-        let percentage = positionX / barWidth;
-        if (rtl)
-            percentage = 1 - percentage;
-        let value = (max - min) * percentage + min;
-        value = Math.max(min, Math.min(max, value));
-        return applyStepToValue(value, step);
-    }, [max, min, rtl, step]);
-    const getPercentPosition = (value) => {
-        const ratio = (value - min) / (max - min);
-        return ratio * 100;
-    };
-    const handleMinChange = React.useCallback((value, options) => {
-        if (!range)
-            return;
-        const method = (options === null || options === void 0 ? void 0 : options.commit) ? onChangeCommit : onChange;
-        method === null || method === void 0 ? void 0 : method({ minValue: value, maxValue, name });
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [maxValue, name, range]);
-    const handleMaxChange = React.useCallback((value, options) => {
-        if (range) {
-            const method = (options === null || options === void 0 ? void 0 : options.commit) ? onChangeCommit : onChange;
-            method === null || method === void 0 ? void 0 : method({ minValue: minValue, maxValue: value, name });
-            return;
-        }
-        const method = (options === null || options === void 0 ? void 0 : options.commit) ? onChangeCommit : onChange;
-        method === null || method === void 0 ? void 0 : method({ value, name });
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [minValue, name, range]);
-    const handleMouseDown = ({ nativeEvent }) => {
-        if (disabled)
-            return;
-        let minDistance;
-        let closestId;
-        const x = getDragX(nativeEvent);
-        const nextValue = getPositionValue(x);
-        const thumbs = [
-            { ref: minRef, id: minId },
-            { ref: maxRef, id: maxId },
-        ];
-        thumbs.forEach((item) => {
-            if (!item.ref.current)
-                return;
-            const el = item.ref.current;
-            const distance = Math.abs(el.getBoundingClientRect().left - x);
-            if (minDistance === undefined || distance <= minDistance) {
-                minDistance = distance;
-                closestId = item.id;
-            }
-        });
-        if (!closestId || nextValue === undefined)
-            return;
-        if (closestId === minId)
-            handleMinChange(nextValue);
-        if (closestId === maxId)
-            handleMaxChange(nextValue);
-        setDraggingId(closestId);
-    };
-    const handleMinDragStart = () => {
-        if (disabled)
-            return;
-        setDraggingId(minId);
-    };
-    const handleMaxDragStart = () => {
-        if (disabled)
-            return;
-        setDraggingId(maxId);
-    };
-    const handleDragStop = React.useCallback(() => {
-        if (draggingId === minId && minValue !== undefined) {
-            handleMinChange(minValue, { commit: true });
-        }
-        if (draggingId === maxId) {
-            handleMaxChange(maxValue, { commit: true });
-        }
-        setDraggingId(null);
-    }, [minValue, maxValue, handleMinChange, handleMaxChange, draggingId, minId, maxId]);
-    const handleDrag = React.useCallback((e) => {
-        if (!draggingId)
-            return;
-        const x = getDragX(e);
-        const nextValue = getPositionValue(x);
-        if (nextValue === undefined)
-            return;
-        // Switch to another id if thumbs overlap
-        let nextDraggingId = draggingId;
-        if (draggingId === minId && nextValue > maxValue)
-            nextDraggingId = maxId;
-        if (draggingId === maxId && minValue && nextValue < minValue)
-            nextDraggingId = minId;
-        if (nextDraggingId === minId)
-            handleMinChange(nextValue);
-        if (nextDraggingId === maxId)
-            handleMaxChange(nextValue);
-        if (draggingId !== nextDraggingId)
-            setDraggingId(nextDraggingId);
-    }, [
-        draggingId,
-        minValue,
-        maxValue,
-        getPositionValue,
-        handleMaxChange,
-        handleMinChange,
-        maxId,
-        minId,
-    ]);
-    React.useEffect(() => {
-        window.addEventListener("mouseup", handleDragStop);
-        window.addEventListener("touchend", handleDragStop);
-        window.addEventListener("mousemove", handleDrag);
-        window.addEventListener("touchmove", handleDrag);
-        return () => {
-            window.removeEventListener("mouseup", handleDragStop);
-            window.removeEventListener("touchend", handleDragStop);
-            window.removeEventListener("mousemove", handleDrag);
-            window.removeEventListener("touchmove", handleDrag);
-        };
-    }, [handleDragStop, handleDrag]);
-    const minPercentPosition = minValue && getPercentPosition(minValue);
-    const maxPercentPosition = getPercentPosition(maxValue);
-    return (
-    // mouse/touch events only needed for non-keyboard use
-    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    React.createElement("div", Object.assign({}, attributes, { className: rootClassNames, onMouseDown: handleMouseDown, onTouchStart: handleMouseDown }),
-        React.createElement("div", { className: s.bar, ref: barRef },
-            React.createElement("div", { className: s.selection, style: {
-                    insetInlineStart: `${minPercentPosition || 0}%`,
-                    width: `${maxPercentPosition - (minPercentPosition || 0)}%`,
-                } })),
-        minValue !== undefined && minPercentPosition !== undefined && (React.createElement(SliderThumb, { id: minId, active: minId === draggingId, name: name, disabled: disabled, onChange: handleMinChange, value: minValue, onDragStart: handleMinDragStart, position: minPercentPosition, max: max, min: min, ref: minRef, renderValue: renderValue })),
-        React.createElement(SliderThumb, { id: maxId, active: maxId === draggingId, name: name, disabled: disabled, onChange: handleMaxChange, value: maxValue, onDragStart: handleMaxDragStart, position: maxPercentPosition, max: max, min: min, ref: maxRef, renderValue: renderValue })));
-};
-export default SliderControlled;

package/components/Slider/SliderThumb.js

@@ -1,21 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import Theme from "../Theme/index.js";
-import Text from "../Text/index.js";
-import s from "./Slider.module.css";
-const SliderThumb = (props, ref) => {
-    const { name, value, disabled, active, position, max, min, onChange, onDragStart, renderValue } = props;
-    const id = React.useId();
-    const thumbClassNames = classNames(s.thumb, active && s["thumb--active"]);
-    const tooltipValue = renderValue ? renderValue({ value }) : value;
-    const handleChange = (e) => {
-        onChange(+e.target.value);
-    };
-    return (React.createElement(React.Fragment, null,
-        React.createElement("input", { className: s.input, type: "range", name: name, value: value, onChange: handleChange, disabled: disabled, max: max, min: min, "aria-labelledby": id }),
-        React.createElement("div", { ref: ref, className: thumbClassNames, onMouseDown: onDragStart, onTouchStart: onDragStart, style: { insetInlineStart: `${position}%` }, id: id, "aria-hidden": "true" },
-            React.createElement(Theme, { colorMode: "inverted" },
-                React.createElement(Text, { variant: "caption-1", weight: "medium", className: s.tooltip }, tooltipValue)))));
-};
-export default React.forwardRef(SliderThumb);

package/components/Slider/SliderUncontrolled.d.ts

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

package/components/Slider/SliderUncontrolled.js

@@ -1,32 +0,0 @@
-"use client";
-import React from "react";
-import SliderControlled from "./SliderControlled.js";
-const SliderUncontrolled = (props) => {
-    const { min, max, onChange, range } = props;
-    const defaultMinValue = ("defaultMinValue" in props && props.defaultMinValue !== undefined && props.defaultMinValue) ||
-        ("defaultValue" in props && props.defaultValue !== undefined && props.defaultValue) ||
-        min;
-    const defaultMaxValue = ("defaultMaxValue" in props && props.defaultMaxValue !== undefined && props.defaultMaxValue) ||
-        ("defaultValue" in props && props.defaultValue !== undefined && props.defaultValue) ||
-        (range ? max : min);
-    const [minValue, setMinValue] = React.useState(defaultMinValue);
-    const [maxValue, setMaxValue] = React.useState(defaultMaxValue);
-    const handleSingleChange = (args) => {
-        if (range)
-            return;
-        setMaxValue(args.value);
-        onChange === null || onChange === void 0 ? void 0 : onChange(args);
-    };
-    const handleRangeChange = (args) => {
-        if (!range)
-            return;
-        setMinValue(args.minValue);
-        setMaxValue(args.maxValue);
-        onChange === null || onChange === void 0 ? void 0 : onChange(args);
-    };
-    if (range) {
-        return (React.createElement(SliderControlled, Object.assign({}, props, { min: min, max: max, minValue: minValue, maxValue: maxValue, defaultMinValue: undefined, defaultMaxValue: undefined, onChange: handleRangeChange })));
-    }
-    return (React.createElement(SliderControlled, Object.assign({}, props, { min: min, max: max, value: maxValue, defaultValue: undefined, onChange: handleSingleChange })));
-};
-export default SliderUncontrolled;

package/components/Stepper/Stepper.d.ts

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

package/components/Stepper/Stepper.js

@@ -1,43 +0,0 @@
-import React from "react";
-import { responsivePropDependency } from "../../utilities/helpers.js";
-import Expandable from "../_private/Expandable/index.js";
-import View from "../View/index.js";
-import Text from "../Text/index.js";
-import Divider from "../Divider/index.js";
-import Icon from "../Icon/index.js";
-import Hidden from "../Hidden/index.js";
-import IconCheckmark from "../../icons/Checkmark.js";
-import s from "./Stepper.module.css";
-const StepperItemPrivate = (props) => {
-    const { title, subtitle, children, direction, className, attributes, labelDisplay, step, completed, active, last, } = props;
-    const labelHidden = labelDisplay && responsivePropDependency(labelDisplay, (value) => value === "hidden");
-    const labelNode = (React.createElement(View, { gap: 3, grow: true },
-        React.createElement(View.Item, null,
-            React.createElement(Text, { variant: "body-3", weight: "medium" }, title),
-            React.createElement(Text, { variant: "caption-1", color: "neutral-faded" }, subtitle))));
-    return (React.createElement(View, null,
-        React.createElement(View, { attributes: attributes, className: className, direction: "row", gap: 2, align: "center", position: "static" },
-            React.createElement(View.Item, null,
-                React.createElement(View, { align: "center", justify: "center", backgroundColor: active || completed ? "primary" : "neutral-faded", borderColor: active || completed ? undefined : "neutral-faded", borderRadius: "circular", as: "span", width: 8, height: 8, zIndex: 5 },
-                    React.createElement(Text, { variant: "body-3", weight: active ? "bold" : "medium" }, completed ? React.createElement(Icon, { svg: IconCheckmark, size: 4 }) : step)),
-                direction === "column" && !last && React.createElement(Divider, { vertical: true, className: s.verticalDivider })),
-            labelDisplay ? React.createElement(Hidden, { hide: labelHidden }, labelNode) : labelNode),
-        direction === "column" && children && (React.createElement(Expandable, { active: active },
-            React.createElement(View, { paddingStart: 10, paddingTop: 2 }, children)))));
-};
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const StepperItem = (_) => null;
-const Stepper = (props) => {
-    const { children, direction = "row", activeId, labelDisplay, className, attributes } = props;
-    const vertical = direction === "column";
-    const length = React.Children.count(children);
-    return (React.createElement(View, { attributes: attributes, direction: direction, align: vertical ? "stretch" : "center", className: className, gap: 3, wrap: false }, React.Children.map(children, (child, index) => {
-        const itemId = child.props.id || `${index}`;
-        return (React.createElement(React.Fragment, { key: index },
-            React.createElement(StepperItemPrivate, Object.assign({}, child.props, { id: child.props.id || `${index}`, active: (activeId === null || activeId === void 0 ? void 0 : activeId.toString()) === itemId, step: index + 1, last: index === length - 1, direction: direction, labelDisplay: labelDisplay })),
-            !vertical && index < length - 1 && (React.createElement(View, { grow: true },
-                React.createElement(Divider, null)))));
-    })));
-};
-Stepper.Item = StepperItem;
-export default Stepper;

package/components/Stepper/Stepper.types.d.ts

@@ -1,26 +0,0 @@
-import React from "react";
-import type * as G from "../../types/global";
-export type Props = {
-    activeId?: string | number;
-    labelDisplay?: G.Responsive<"inline" | "hidden">;
-    children?: React.ReactNode;
-    direction?: "row" | "column";
-    className?: G.ClassName;
-    attributes?: G.Attributes<"ul", Props>;
-};
-export type ItemProps = {
-    id?: string;
-    completed?: boolean;
-    title?: React.ReactNode;
-    subtitle?: React.ReactNode;
-    children?: React.ReactNode;
-    className?: G.ClassName;
-    attributes?: G.Attributes<"li", ItemProps>;
-};
-export type ItemPrivateProps = ItemProps & {
-    labelDisplay: Props["labelDisplay"];
-    step: number;
-    active: boolean;
-    direction: Props["direction"];
-    last: boolean;
-};

package/components/Switch/Switch.d.ts

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

package/components/Switch/Switch.js

@@ -1,31 +0,0 @@
-"use client";
-import React from "react";
-import { classNames } from "../../utilities/helpers.js";
-import { useFormControl } from "../FormControl/index.js";
-import Text from "../Text/index.js";
-import useElementId from "../../hooks/useElementId.js";
-import s from "./Switch.module.css";
-const Switch = (props) => {
-    var _a;
-    const { children, name, checked, size, reversed, defaultChecked, onChange, onFocus, onBlur, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, size && s[`root--size-${size}`], reversed && s["root--reversed"], className);
-    const formControl = useFormControl();
-    const id = useElementId((formControl === null || formControl === void 0 ? void 0 : formControl.attributes.id) || props.id || ((_a = props.inputAttributes) === null || _a === void 0 ? void 0 : _a.id));
-    const inputAttributes = Object.assign(Object.assign({}, props.inputAttributes), formControl === null || formControl === void 0 ? void 0 : formControl.attributes);
-    const disabled = (formControl === null || formControl === void 0 ? void 0 : formControl.disabled) || props.disabled;
-    const handleChange = (event) => {
-        if (!onChange)
-            return;
-        onChange({
-            name,
-            event,
-            checked: event.target.checked,
-        });
-    };
-    return (React.createElement("label", Object.assign({}, attributes, { className: rootClassNames }),
-        React.createElement("input", Object.assign({ type: "checkbox" }, inputAttributes, { className: s.input, name: name, checked: checked, defaultChecked: defaultChecked, disabled: disabled, 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: id })),
-        React.createElement("span", { className: s.area, "aria-hidden": "true" },
-            React.createElement("span", { className: s.thumb })),
-        children && (React.createElement(Text, { variant: "body-3", weight: "medium" }, children))));
-};
-export default Switch;

package/components/Switch/Switch.module.css

@@ -1 +0,0 @@
-.root{-webkit-tap-highlight-color:transparent;align-items:center;display:inline-flex;gap:var(--rs-unit-x2);position:relative;vertical-align:top}.input{border:0;height:1px;left:0;opacity:0;outline:none;position:absolute;top:0;width:1px}.input:checked+.area{background:var(--rs-color-background-primary);border-color:transparent}.input:checked+.area .thumb{transform:translateX(var(--rs-unit-x3))}[dir=rtl] .input:checked+.area .thumb{transform:translateX(calc(var(--rs-unit-x3) * -1))}[data-rs-keyboard] .input:focus+.area{box-shadow:var(--rs-focus-shadow)}.input[disabled]+.area{background:var(--rs-color-background-disabled);cursor:not-allowed}.input[disabled]+.area .thumb{opacity:.8}.input[disabled]:checked+.area{background:var(--rs-color-background-primary);opacity:.4}.input[disabled]:checked+.area .thumb{opacity:1}.area{align-items:center;background:var(--rs-color-background-neutral);border:2px solid transparent;border-radius:calc(var(--rs-unit-x1) * 5 / 2);box-sizing:border-box;cursor:pointer;display:flex;height:calc(var(--rs-unit-x1) * 5);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background,border;width:calc(var(--rs-unit-x1) * 8)}.thumb{background:var(--rs-color-white);border-radius:50%;box-shadow:var(--rs-shadow-raised);height:var(--rs-unit-x4);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:transform;width:var(--rs-unit-x4)}.root--size-small .area{height:calc(var(--rs-unit-x1) * 4);width:calc(var(--rs-unit-x1) * 6)}.root--size-small .thumb{height:var(--rs-unit-x3);width:var(--rs-unit-x3)}.root--size-small .input:checked+.area .thumb{transform:translateX(var(--rs-unit-x2))}[dir=rtl] .root--size-small .input:checked+.area .thumb{transform:translateX(calc(var(--rs-unit-x2) * -1))}.root--reversed{flex-direction:row-reverse}

package/components/Table/Table.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-import type * as T from "./Table.types";
-declare const Table: {
-    (props: T.Props): React.JSX.Element;
-    Cell: (props: T.CellProps) => React.JSX.Element;
-    Heading: (props: T.HeadingProps) => React.JSX.Element;
-    Row: (props: T.RowProps) => React.JSX.Element;
-    Body: (props: T.BodyProps) => React.JSX.Element;
-    Head: (props: T.HeadProps) => React.JSX.Element;
-};
-export default Table;

package/components/Table/Table.js

@@ -1,45 +0,0 @@
-import React from "react";
-import { classNames, responsiveVariables } from "../../utilities/helpers.js";
-import getWidthStyles from "../../styles/width/index.js";
-import getMinWidthStyles from "../../styles/minWidth/index.js";
-import s from "./Table.module.css";
-const TableCellPrivate = (props) => {
-    const { minWidth, rowSpan, colSpan, align, tagName: TagName, padding, paddingInline, paddingBlock, children, attributes, } = props;
-    const width = props.width === "auto" ? "0px" : props.width;
-    const widthStyles = getWidthStyles(width);
-    const minWidthStyles = getMinWidthStyles(minWidth || width);
-    const headingClassNames = classNames(s.cell, widthStyles === null || widthStyles === void 0 ? void 0 : widthStyles.classNames, minWidthStyles === null || minWidthStyles === void 0 ? void 0 : minWidthStyles.classNames, align && s[`cell--align-${align}`]);
-    const headingStyle = Object.assign(Object.assign(Object.assign(Object.assign({}, widthStyles === null || widthStyles === void 0 ? void 0 : widthStyles.variables), minWidthStyles === null || minWidthStyles === void 0 ? void 0 : minWidthStyles.variables), responsiveVariables("--rs-table-p-vertical", paddingBlock !== null && paddingBlock !== void 0 ? paddingBlock : padding)), responsiveVariables("--rs-table-p-horizontal", paddingInline !== null && paddingInline !== void 0 ? paddingInline : padding));
-    return (React.createElement(TagName, Object.assign({}, attributes, { className: headingClassNames, rowSpan: rowSpan, colSpan: colSpan, style: headingStyle }), children));
-};
-const TableCell = (props) => {
-    return React.createElement(TableCellPrivate, Object.assign({}, props, { tagName: "td" }));
-};
-const TableHeading = (props) => {
-    return React.createElement(TableCellPrivate, Object.assign({}, props, { tagName: "th" }));
-};
-const TableRow = (props) => {
-    const { highlighted, children, attributes } = props;
-    const rowClassNames = classNames(s.row, highlighted && s["--row-highlighted"]);
-    return (React.createElement("tr", Object.assign({}, attributes, { className: rowClassNames }), children));
-};
-const TableBody = (props) => {
-    return React.createElement("tbody", null, props.children);
-};
-const TableHead = (props) => {
-    return React.createElement("thead", null, props.children);
-};
-const Table = (props) => {
-    const { children, border, columnBorder, className, attributes } = props;
-    const rootClassNames = classNames(s.root, className, border && s["--border-outer"], columnBorder && s["--border-column"]);
-    const [firstChild] = React.Children.toArray(children);
-    return (React.createElement("div", Object.assign({}, attributes, { className: rootClassNames }),
-        React.createElement("table", { className: s.table }, React.isValidElement(firstChild) &&
-            (firstChild.type === TableBody || firstChild.type === TableHead) ? (children) : (React.createElement(TableBody, null, children)))));
-};
-Table.Cell = TableCell;
-Table.Heading = TableHeading;
-Table.Row = TableRow;
-Table.Body = TableBody;
-Table.Head = TableHead;
-export default Table;

package/components/Tabs/Tabs.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-import type * as T from "./Tabs.types";
-declare const Tabs: {
-    (props: T.Props): React.JSX.Element;
-    Item: React.ForwardRefExoticComponent<T.ItemProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-    List: (props: T.ListProps) => React.JSX.Element;
-    Panel: (props: T.PanelProps) => React.JSX.Element;
-};
-export default Tabs;

package/components/Tabs/Tabs.js

@@ -1,16 +0,0 @@
-import React from "react";
-import TabsControlled from "./TabsControlled.js";
-import TabsUncontrolled from "./TabsUncontrolled.js";
-import TabsItem from "./TabsItem.js";
-import TabsList from "./TabsList.js";
-import TabsPanel from "./TabsPanel.js";
-const Tabs = (props) => {
-    const { value } = props;
-    if (value !== undefined)
-        return React.createElement(TabsControlled, Object.assign({}, props));
-    return React.createElement(TabsUncontrolled, Object.assign({}, props));
-};
-Tabs.Item = TabsItem;
-Tabs.List = TabsList;
-Tabs.Panel = TabsPanel;
-export default Tabs;

package/components/Tabs/Tabs.module.css

@@ -1 +0,0 @@
-.root{box-sizing:initial;max-width:100%}.list,.root{position:relative}.inner:after{background-color:var(--rs-color-border-neutral-faded);content:"";position:absolute;z-index:2}.listItem{--rs-tabs-gap:var(--rs-unit-x4);flex-shrink:0;position:relative}.button{-webkit-tap-highlight-color:transparent;overflow:hidden;position:relative;z-index:1}.button,.buttonContent{border-radius:var(--rs-unit-radius-medium);width:100%}.buttonContent{align-items:center;box-sizing:border-box;display:flex}.buttonContent:hover{color:var(--rs-color-foreground-neutral-faded)}.buttonContent,.icon{color:inherit;transition:color var(--rs-duration-fast) var(--rs-easing-standard)}[data-rs-keyboard] .radio:focus+.buttonContent{box-shadow:var(--rs-focus-inset-shadow)}.icon:not(:last-child){margin-inline-end:var(--rs-unit-x2)}.--item-active:after{content:""}.--item-active:after,.selector{background:var(--rs-color-border-primary);border-radius:calc(var(--rs-unit-radius-medium) - 1px);position:absolute;z-index:var(--rs-z-index-raised)}.selector{--rs-tab-selection-x:0;--rs-tab-selection-y:0;--rs-tab-selection-scale-x:0;--rs-tab-selection-scale-y:0;transform:translate(calc(var(--rs-tab-selection-x) * 1px),calc(var(--rs-tab-selection-y) * 1px)) translateZ(0);transform-origin:0 0}.--selector-hidden{visibility:hidden}.--selector-animated{transition:var(--rs-duration-medium) var(--rs-easing-decelerate);transition-property:transform,height}.next,.prev{align-items:center;display:flex;inset-block:0;position:absolute;z-index:var(--rs-z-index-raised)}[dir=rtl] .next,[dir=rtl] .prev{transform:scaleX(-1)}.next{inset-inline-end:var(--rs-unit-x1)}.prev{inset-inline-start:var(--rs-unit-x1)}.panel{outline:none}[data-rs-keyboard] .panel:focus{box-shadow:var(--rs-focus-shadow)}.--panel-hidden{display:none}.--direction-row{margin:0 calc(var(--rs-unit-x2) * -1);overflow:hidden;padding:0 var(--rs-unit-x2)}.--direction-row .inner{-ms-overflow-style:none;margin:0 calc(var(--rs-unit-x2) * -1) -40px;overflow:auto;overflow:-moz-scrollbars-none;padding:0 var(--rs-unit-x2) 40px;scrollbar-width:none;white-space:nowrap}.--direction-row .inner::-webkit-scrollbar{display:none}.--direction-row .inner:after{height:1px;inset-inline:var(--rs-unit-x2);bottom:0}.--direction-row .list{align-items:center;display:inline-flex;flex-wrap:nowrap;vertical-align:top}.--direction-row .listItem+.listItem{margin-inline-start:var(--rs-tabs-gap)}.--direction-row .--item-active:after{height:2px;inset-inline:0;bottom:0}.--direction-row .selector{bottom:0;height:2px;left:0;width:calc(var(--rs-tab-selection-scale-x) * 1px)}.--direction-row .button{box-sizing:initial;margin:var(--rs-unit-x1) calc(var(--rs-unit-x2) * -1);padding:0 var(--rs-unit-x2)}.--direction-row .buttonContent{justify-content:center;padding:var(--rs-tabs-item-p-v) 0}.--direction-column .inner:after{bottom:0;height:100%;inset-inline-end:0;top:0;width:1px}.--direction-column .list{display:flex;flex-direction:column}.--direction-column .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--direction-column .item{padding-inline-end:var(--rs-unit-x1)}.--direction-column .listItem+.listItem{margin-top:var(--rs-tabs-gap)}.--direction-column .--item-active:after{bottom:0}.--direction-column .--item-active:after,.--direction-column .selector{height:100%;inset-inline-end:0;width:2px}.--direction-column .selector{height:calc(var(--rs-tab-selection-scale-y) * 1px);top:0}.--direction-column .button{margin-inline-start:calc(var(--rs-unit-x2) * -1);padding:var(--rs-unit-x2);width:calc(100% + var(--rs-unit-x1))}.--direction-column .buttonContent{justify-content:flex-start}.--variant-borderless .inner:after,.--variant-pills .inner:after,.--variant-pills-elevated .inner:after{content:none}.--variant-pills .button,.--variant-pills-elevated .button{margin:0;padding:0}.--variant-pills .buttonContent,.--variant-pills-elevated .buttonContent{margin:0;padding:var(--rs-tabs-item-p-v) var(--rs-tabs-item-p-h)}.--variant-pills .buttonContent:hover,.--variant-pills-elevated .buttonContent:hover{background:none}.--variant-pills .listItem,.--variant-pills-elevated .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--variant-pills .selector,.--variant-pills-elevated .selector{background-color:var(--rs-color-background-neutral);height:calc(var(--rs-tab-selection-scale-y) * 1px);opacity:.6;width:calc(var(--rs-tab-selection-scale-x) * 1px);z-index:0}.--direction-column.--variant-pills .selector,.--direction-column.--variant-pills-elevated .selector{left:0}.--direction-row.--variant-pills .selector,.--direction-row.--variant-pills-elevated .selector{top:0}.--variant-pills .--item-active:after,.--variant-pills-elevated .--item-active:after{background-color:var(--rs-color-background-neutral);opacity:.6;z-index:0}.--direction-column.--variant-pills .--item-active:after,.--direction-column.--variant-pills-elevated .--item-active:after{width:100%}.--direction-row.--variant-pills .--item-active:after,.--direction-row.--variant-pills-elevated .--item-active:after{height:100%}.--variant-pills-elevated .list{background:var(--rs-color-background-neutral-faded);border:2px solid transparent;border-radius:var(--rs-unit-radius-medium)}.--variant-pills-elevated .--item-active:after,.--variant-pills-elevated .selector{background:var(--rs-color-background-elevation-raised);box-shadow:var(--rs-shadow-raised);box-sizing:border-box;opacity:1}.--size-medium{--rs-tabs-item-p-v:var(--rs-unit-x2);--rs-tabs-item-p-h:var(--rs-unit-x3)}.--size-large{--rs-tabs-item-p-v:var(--rs-unit-x3);--rs-tabs-item-p-h:var(--rs-unit-x4)}.--item-width-equal{max-width:none}.--item-width-equal .inner{flex-wrap:wrap;overflow:hidden}.--item-width-equal .list{display:flex}.--item-width-equal .listItem{flex-basis:0;flex-grow:1;margin:0}.--cut-off-end .inner,[dir=rtl] .--cut-off-start .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-start .inner,[dir=rtl] .--cut-off-end .inner{mask-image:linear-gradient(to left,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-both .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),0) 0,rgba(var(--rs-color-rgb-black),10%) 5%,rgba(var(--rs-color-rgb-black),100%) 20%,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}@media (--rs-viewport-s ){.next,.prev{display:none}}