reshaped 3.9.0-canary.9 → 3.9.1-canary.2

package/dist/components/Accordion/AccordionControlled.js

@@ -14,7 +14,6 @@ const AccordionControlled = (props) => {
         triggerId: `${id}-trigger`,
         contentId: `${id}-content`,
         active,
-        // eslint-disable-next-line react-hooks/refs
         onToggle: onToggleRef.current,
         iconPosition,
         iconSize,

package/dist/components/Actionable/Actionable.d.ts

@@ -1,4 +1,9 @@
-import React from "react";
-import type * as T from "./Actionable.types";
-declare const Actionable: React.ForwardRefExoticComponent<T.Props & React.RefAttributes<T.Ref>>;
+import { type ActionableRef as UnstyledActionableRef } from "../../core/Actionable";
+declare const Actionable: import("react").ForwardRefExoticComponent<import("../../core/Actionable").ActionableProps & {
+    touchHitbox?: boolean;
+    fullWidth?: boolean;
+    insetFocus?: boolean;
+    disableFocusRing?: boolean;
+    borderRadius?: "inherit";
+} & import("react").RefAttributes<UnstyledActionableRef>>;
 export default Actionable;

package/dist/components/Actionable/Actionable.js

@@ -1,77 +1,24 @@
 "use client";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import * as keys from "../../constants/keys.js";
-import { classNames } from "../../utilities/props.js";
+import UnstyledActionable from "../../core/Actionable/index.js";
 import s from "./Actionable.module.css";
 const Actionable = forwardRef((props, ref) => {
-    const { children, render, href, onClick, type, disabled, insetFocus, disableFocusRing, borderRadius, as, stopPropagation, fullWidth, touchHitbox, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, className, disabled && s["--disabled"], borderRadius && s[`--radius-${borderRadius}`], insetFocus && s["--inset"], disableFocusRing && s["--disabled-focus-ring"], fullWidth && s["--full-width"]);
-    const rootAttributes = { ...attributes };
-    const hasClickHandler = onClick || attributes?.onClick;
-    const hasFocusHandler = attributes?.onFocus || attributes?.onBlur;
-    const isLink = Boolean(href || attributes?.href);
-    // Including attributes ref for the cases when event listeners are added through it
-    // To make sure it doesn't render a span
-    const isButton = Boolean(hasClickHandler || hasFocusHandler || type || attributes?.ref);
-    const renderedAsButton = !isLink && isButton && (!as || as === "button");
-    // Using any here to let TS save on type resolving, otherwise TS throws an error due to the type complexity
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let TagName;
-    if (isLink) {
-        TagName = "a";
-        rootAttributes.href = disabled ? undefined : href || attributes?.href;
-    }
-    else if (renderedAsButton) {
-        TagName = "button";
-        rootAttributes.type = type || attributes?.type || "button";
-        rootAttributes.disabled = disabled || attributes?.disabled;
-    }
-    else if (isButton) {
-        const isFocusable = as === "label";
-        const simulateButton = !isFocusable || hasClickHandler || hasFocusHandler;
-        TagName = as || "span";
-        rootAttributes.role = simulateButton ? "button" : undefined;
-        rootAttributes.tabIndex = simulateButton ? 0 : undefined;
-    }
-    else {
-        TagName = as || "span";
-    }
-    const handlePress = (event) => {
-        if (disabled)
-            return;
-        if (stopPropagation)
-            event.stopPropagation();
-        onClick?.(event);
-        attributes?.onClick?.(event);
-    };
-    const handleKeyDown = (event) => {
-        const isSpace = event.key === keys.SPACE;
-        const isEnter = event.key === keys.ENTER;
-        if (!isSpace && !isEnter)
-            return;
-        if (rootAttributes.role !== "button")
-            return;
-        if (stopPropagation)
-            event.stopPropagation();
-        event.preventDefault();
-        handlePress(event);
-    };
-    const childrenNode = (_jsxs(_Fragment, { children: [touchHitbox && (isLink || isButton) && !disabled && _jsx("span", { className: s.touch }), children] }));
-    const tagAttributes = {
-        ref: ref,
-        // rootAttributes can receive ref from Flyout
-        ...rootAttributes,
-        className: rootClassNames,
-        onClick: handlePress,
-        onKeyDown: handleKeyDown,
-        "aria-disabled": disabled ? true : undefined,
-        children: childrenNode,
-    };
-    // eslint-disable-next-line react-hooks/refs
-    if (render)
-        return render(tagAttributes);
-    return _jsx(TagName, { ...tagAttributes });
+    const { 
+    // Styled props
+    insetFocus, disableFocusRing, borderRadius, fullWidth, touchHitbox, 
+    // Unstyled props used for internal behavior
+    children, className, disabled, ...unstyledProps } = props;
+    const rootClassNames = [
+        s.root,
+        className,
+        disabled && s["--disabled"],
+        borderRadius && s[`--radius-${borderRadius}`],
+        insetFocus && s["--inset"],
+        disableFocusRing && s["--disabled-focus-ring"],
+        fullWidth && s["--full-width"],
+    ];
+    return (_jsxs(UnstyledActionable, { ...unstyledProps, className: rootClassNames, disabled: disabled, ref: ref, children: [touchHitbox && !disabled && _jsx("span", { className: s.touch }), children] }));
 });
 Actionable.displayName = "Actionable";
 export default Actionable;

package/dist/components/Actionable/Actionable.module.css

@@ -1 +1 @@
-@layer rs.reset{.root{background:none;border:0;color:inherit;display:inline-block;font-size:inherit;font-weight:inherit;isolation:isolate;line-height:inherit;margin:0;padding:0;position:relative;text-align:initial;text-decoration:none;vertical-align:top;-webkit-tap-highlight-color:transparent}}.touch{height:100%;inset:50%;min-height:24px;min-width:24px;position:absolute;transform:translate(-50%,-50%);width:100%}.root:focus{outline:none}[data-rs-keyboard] .root:focus{box-shadow:var(--rs-shadow-focus);outline:none;z-index:var(--rs-z-index-relative)}[data-rs-keyboard] .root.--inset:focus{box-shadow:var(--rs-shadow-focus-inset)}[data-rs-keyboard] .root.--disabled-focus-ring:focus,[data-rs-keyboard] .root.--radius-inherit:focus{box-shadow:none}[data-rs-keyboard] .root.--radius-inherit:focus>*{box-shadow:var(--rs-shadow-focus)}[data-rs-keyboard] .root.--radius-inherit.--inset:focus>*{box-shadow:var(--rs-shadow-focus-inset)}[role=button].root,button.root{cursor:pointer;user-select:none}.root.--disabled,.root[disabled]{cursor:not-allowed}.root.--disabled:active,.root[disabled]:active{transform:none}.root.--full-width{width:100%}
+@layer rs.reset{.root{background:none;border:0;color:inherit;display:inline-block;font-size:inherit;font-weight:inherit;isolation:isolate;line-height:inherit;margin:0;padding:0;position:relative;text-align:initial;text-decoration:none;vertical-align:top;-webkit-tap-highlight-color:transparent}}.touch{height:100%;inset:50%;min-height:24px;min-width:24px;position:absolute;transform:translate(-50%,-50%);width:100%}.root:focus{outline:none}[data-rs-keyboard] .root:focus{box-shadow:var(--rs-shadow-focus);outline:none;z-index:var(--rs-z-index-relative)}[data-rs-keyboard] .root.--inset:focus{box-shadow:var(--rs-shadow-focus-inset)}[data-rs-keyboard] .root.--disabled-focus-ring:focus,[data-rs-keyboard] .root.--radius-inherit:focus{box-shadow:none}[data-rs-keyboard] .root.--radius-inherit:focus>*{box-shadow:var(--rs-shadow-focus)}[data-rs-keyboard] .root.--radius-inherit.--inset:focus>*{box-shadow:var(--rs-shadow-focus-inset)}[role=button].root,button.root{cursor:pointer;user-select:none}[data-rs-keyboard] label.root:has([data-rs-hidden-input]:focus){box-shadow:var(--rs-shadow-focus);z-index:var(--rs-z-index-relative)}.root.--disabled,.root[disabled]{cursor:not-allowed}.root.--disabled:active,.root[disabled]:active{transform:none}.root.--full-width{width:100%}

package/dist/components/Actionable/Actionable.types.d.ts

@@ -1,29 +1,5 @@
-import type React from "react";
-import type * as G from "../../types/global";
-export type AttributesRef = React.RefObject<HTMLButtonElement | null>;
-type Attributes = G.Attributes<"button"> & Omit<React.JSX.IntrinsicElements["a"], keyof G.Attributes<"button">> & {
-    ref?: AttributesRef;
-};
-export type Props = {
-    /** Node for inserting the content */
-    children?: React.ReactNode;
-    /** Render a custom root element, useful for integrating with routers */
-    render?: (attributes: Attributes & {
-        ref: AttributesRef;
-        className: string;
-        onClick: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
-        onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
-        "aria-disabled"?: boolean;
-        children: React.ReactNode;
-    }) => React.ReactNode;
-    /** Callback when clicked, renders it as a button tag if href is not provided */
-    onClick?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
-    /** URL, renders it as an anchor tag */
-    href?: string;
-    /** Type attribute, renders it as a button tag */
-    type?: React.ButtonHTMLAttributes<HTMLButtonElement>["type"];
-    /** Disable from user interaction */
-    disabled?: boolean;
+import type { ActionableProps as UnstyledActionableProps } from "../../core/Actionable";
+export type Props = UnstyledActionableProps & {
     /** Enable a minimum required touch hitbox */
     touchHitbox?: boolean;
     /** Take up the full width of its parent */
@@ -34,14 +10,4 @@ export type Props = {
     disableFocusRing?: boolean;
     /** Apply the focus ring to the child and rely on its border radius */
     borderRadius?: "inherit";
-    /** Prevent the event from bubbling up to the parent */
-    stopPropagation?: boolean;
-    /** Render as a different element */
-    as?: keyof React.JSX.IntrinsicElements;
-    /** Additional classname for the root element */
-    className?: G.ClassName;
-    /** Additional attributes for the root element */
-    attributes?: Attributes;
 };
-export type Ref = HTMLButtonElement | HTMLAnchorElement;
-export {};

package/dist/components/Actionable/index.d.ts

@@ -1,2 +1,3 @@
 export { default } from "./Actionable";
-export type { Props as ActionableProps, Ref as ActionableRef } from "./Actionable.types";
+export type { Props as ActionableProps } from "./Actionable.types";
+export type { ActionableRef } from "../../core/Actionable";

package/dist/components/Badge/Badge.js

@@ -7,7 +7,7 @@ import IconClose from "../../icons/Close.js";
 import { classNames } from "../../utilities/props.js";
 import s from "./Badge.module.css";
 const Badge = forwardRef((props, ref) => {
-    const { children, color, rounded, size = "medium", icon, endIcon, variant, hidden, highlighted, href, onClick, onDismiss, dismissAriaLabel, className, attributes, } = props;
+    const { children, color, rounded, size = "medium", icon, endIcon, variant, hidden, highlighted, href, onClick, onDismiss, dismissAriaLabel, className, attributes, as, } = props;
     const isActionable = !!(onClick || href);
     const iconSize = size === "small" ? 3 : 4;
     const rootClassName = classNames(s.root, className, rounded && s["--rounded"], hidden && s["--hidden"], size && s[`--size-${size}`], color && s[`--color-${color}`], variant && s[`--variant-${variant}`], isActionable && s["--actionable"], highlighted && s["--highlighted"]);
@@ -15,7 +15,7 @@ const Badge = forwardRef((props, ref) => {
         e.stopPropagation();
         onDismiss?.();
     };
-    return (_jsxs(Actionable, { onClick: onClick, href: href, className: rootClassName, attributes: attributes, ref: ref, touchHitbox: true, children: [icon && _jsx(Icon, { svg: icon, autoWidth: true, size: iconSize, className: s.icon }), children && (_jsx(Text, { variant: size === "large" ? "body-3" : "caption-1", weight: "medium", attributes: {
+    return (_jsxs(Actionable, { onClick: onClick, href: href, className: rootClassName, attributes: attributes, ref: ref, as: as, touchHitbox: true, children: [icon && _jsx(Icon, { svg: icon, autoWidth: true, size: iconSize, className: s.icon }), children && (_jsx(Text, { variant: size === "large" ? "body-3" : "caption-1", weight: "medium", attributes: {
                     "aria-hidden": hidden ? "true" : undefined,
                 }, children: children })), endIcon && _jsx(Icon, { svg: endIcon, autoWidth: true, size: iconSize, className: s.icon }), onDismiss && (_jsx(Actionable, { onClick: hnadleDismiss, className: s.dismiss, as: "span", attributes: { "aria-label": dismissAriaLabel }, touchHitbox: true, children: _jsx(Icon, { svg: IconClose, size: iconSize }) }))] }));
 });

package/dist/components/Badge/Badge.module.css

@@ -1 +1 @@
-.root{--rs-badge-border-color:transparent;align-items:center;backface-visibility:hidden;background:var(--rs-color-background-neutral);border-radius:var(--rs-radius-small);box-shadow:0 0 0 1px var(--rs-badge-border-color) inset;box-sizing:border-box;color:var(--rs-color-foreground-neutral);display:inline-flex;gap:var(--rs-badge-gap);justify-content:center;min-height:calc(var(--rs-badge-line-height) + (var(--rs-badge-p-v) * 2));min-width:calc(var(--rs-badge-line-height) + (var(--rs-badge-p-v) * 2));padding:var(--rs-badge-p-v) var(--rs-badge-p-h);transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:transform,opacity;vertical-align:top}.root:empty{height:var(--rs-badge-empty-size);min-height:auto;min-width:auto;padding:0;width:var(--rs-badge-empty-size)}.icon:only-child{margin-inline:calc(var(--rs-unit-x1) * -1)}.dismiss{border-radius:var(--rs-radius-small);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity}.root.--highlighted{opacity:.8}@media (hover:hover) and (pointer:fine){.root .dismiss:hover,.root.--actionable:hover:not(:has(.dismiss:hover)){opacity:.8}}.root.--variant-faded{background:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral-faded)}.root.--variant-outline{--rs-badge-border-color:var(--rs-color-border-neutral);background:none}.root.--color-positive{background:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.root.--color-positive.--variant-faded{background:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-positive)}.root.--color-positive.--variant-outline{--rs-badge-border-color:var(--rs-color-border-positive-faded);background:none;color:var(--rs-color-foreground-positive)}.root.--color-critical{background:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.root.--color-critical.--variant-faded{background:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-critical)}.root.--color-critical.--variant-outline{--rs-badge-border-color:var(--rs-color-border-critical-faded);background:none;color:var(--rs-color-foreground-critical)}.root.--color-warning{background:var(--rs-color-background-warning);color:var(--rs-color-on-background-warning)}.root.--color-warning.--variant-faded{background:var(--rs-color-background-warning-faded);color:var(--rs-color-foreground-warning)}.root.--color-warning.--variant-outline{--rs-badge-border-color:var(--rs-color-border-warning-faded);background:none;color:var(--rs-color-foreground-warning)}.root.--color-primary{background:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.root.--color-primary.--variant-faded{background:var(--rs-color-background-primary-faded);color:var(--rs-color-foreground-primary)}.root.--color-primary.--variant-outline{--rs-badge-border-color:var(--rs-color-border-primary-faded);background:none;color:var(--rs-color-foreground-primary)}.root.--size-small{--rs-badge-p-v:calc(var(--rs-unit-x1) / 2);--rs-badge-p-h:var(--rs-unit-x1);--rs-badge-line-height:var(--rs-line-height-caption-1);--rs-badge-empty-size:var(--rs-unit-x2);--rs-badge-gap:calc(var(--rs-unit-x1) / 2)}.root.--size-medium{--rs-badge-p-v:var(--rs-unit-x1);--rs-badge-p-h:var(--rs-unit-x2);--rs-badge-line-height:var(--rs-line-height-caption-1);--rs-badge-empty-size:var(--rs-unit-x3);--rs-badge-gap:var(--rs-unit-x1)}.root.--size-large{--rs-badge-p-v:var(--rs-unit-x1);--rs-badge-p-h:var(--rs-unit-x2);--rs-badge-line-height:var(--rs-line-height-body-3);--rs-badge-empty-size:var(--rs-unit-x4);--rs-badge-gap:var(--rs-unit-x1)}.root.--rounded{border-radius:var(--rs-radius-circular)}.root.--hidden{opacity:0;transform:scale(.2)}.container{display:inline-block;position:relative;vertical-align:top}.container .root{inset-inline-end:0;position:absolute;transform:translate(50%,var(--rs-badge-translate-y)) scale(1);user-select:none;z-index:10}.container .root.--hidden{transform:translate(50%,var(--rs-badge-translate-y)) scale(.2)}[dir=rtl] .container .root{transform:translate(-50%,var(--rs-badge-translate-y)) scale(1)}[dir=rtl] .container .root.--hidden{transform:translate(-50%,var(--rs-badge-translate-y)) scale(.2)}.--container-overlap .root{inset-inline-end:14%}.--container-position-top-end .root{--rs-badge-translate-y:-50%;top:0}.--container-position-top-end.--container-overlap .root{top:14%}.--container-position-bottom-end .root{--rs-badge-translate-y:50%;bottom:0}.--container-position-bottom-end.--container-overlap .root{bottom:14%}
+.root{--rs-badge-border-color:transparent;align-items:center;backface-visibility:hidden;background:var(--rs-color-background-neutral);border-radius:var(--rs-radius-small);box-shadow:0 0 0 1px var(--rs-badge-border-color) inset;box-sizing:border-box;color:var(--rs-color-foreground-neutral);display:inline-flex;gap:var(--rs-badge-gap);justify-content:center;min-height:calc(var(--rs-badge-line-height) + (var(--rs-badge-p-v) * 2));min-width:calc(var(--rs-badge-line-height) + (var(--rs-badge-p-v) * 2));padding:var(--rs-badge-p-v) var(--rs-badge-p-h);transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:transform,opacity,box-shadow,background-color;vertical-align:top}.root:empty{height:var(--rs-badge-empty-size);min-height:auto;min-width:auto;padding:0;width:var(--rs-badge-empty-size)}.icon:only-child{margin-inline:calc(var(--rs-unit-x1) * -1)}.dismiss{border-radius:var(--rs-radius-small);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity}.root.--highlighted{opacity:.8}@media (hover:hover) and (pointer:fine){.root .dismiss:hover,.root.--actionable:hover:not(:has(.dismiss:hover)){opacity:.8}}.root.--variant-faded{background:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral-faded)}.root.--variant-outline{--rs-badge-border-color:var(--rs-color-border-neutral);background:none}.root.--color-positive{background:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.root.--color-positive.--variant-faded{background:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-positive)}.root.--color-positive.--variant-outline{--rs-badge-border-color:var(--rs-color-border-positive-faded);background:none;color:var(--rs-color-foreground-positive)}.root.--color-critical{background:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.root.--color-critical.--variant-faded{background:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-critical)}.root.--color-critical.--variant-outline{--rs-badge-border-color:var(--rs-color-border-critical-faded);background:none;color:var(--rs-color-foreground-critical)}.root.--color-warning{background:var(--rs-color-background-warning);color:var(--rs-color-on-background-warning)}.root.--color-warning.--variant-faded{background:var(--rs-color-background-warning-faded);color:var(--rs-color-foreground-warning)}.root.--color-warning.--variant-outline{--rs-badge-border-color:var(--rs-color-border-warning-faded);background:none;color:var(--rs-color-foreground-warning)}.root.--color-primary{background:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.root.--color-primary.--variant-faded{background:var(--rs-color-background-primary-faded);color:var(--rs-color-foreground-primary)}.root.--color-primary.--variant-outline{--rs-badge-border-color:var(--rs-color-border-primary-faded);background:none;color:var(--rs-color-foreground-primary)}.root.--size-small{--rs-badge-p-v:calc(var(--rs-unit-x1) / 2);--rs-badge-p-h:var(--rs-unit-x1);--rs-badge-line-height:var(--rs-line-height-caption-1);--rs-badge-empty-size:var(--rs-unit-x2);--rs-badge-gap:calc(var(--rs-unit-x1) / 2)}.root.--size-medium{--rs-badge-p-v:var(--rs-unit-x1);--rs-badge-p-h:var(--rs-unit-x2);--rs-badge-line-height:var(--rs-line-height-caption-1);--rs-badge-empty-size:var(--rs-unit-x3);--rs-badge-gap:var(--rs-unit-x1)}.root.--size-large{--rs-badge-p-v:var(--rs-unit-x1);--rs-badge-p-h:var(--rs-unit-x2);--rs-badge-line-height:var(--rs-line-height-body-3);--rs-badge-empty-size:var(--rs-unit-x4);--rs-badge-gap:var(--rs-unit-x1)}.root.--rounded{border-radius:var(--rs-radius-circular)}.root.--hidden{opacity:0;transform:scale(.2)}.container{display:inline-block;position:relative;vertical-align:top}.container .root{inset-inline-end:0;position:absolute;transform:translate(50%,var(--rs-badge-translate-y)) scale(1);user-select:none;z-index:10}.container .root.--hidden{transform:translate(50%,var(--rs-badge-translate-y)) scale(.2)}[dir=rtl] .container .root{transform:translate(-50%,var(--rs-badge-translate-y)) scale(1)}[dir=rtl] .container .root.--hidden{transform:translate(-50%,var(--rs-badge-translate-y)) scale(.2)}.--container-overlap .root{inset-inline-end:14%}.--container-position-top-end .root{--rs-badge-translate-y:-50%;top:0}.--container-position-top-end.--container-overlap .root{top:14%}.--container-position-bottom-end .root{--rs-badge-translate-y:50%;bottom:0}.--container-position-bottom-end.--container-overlap .root{bottom:14%}

package/dist/components/Badge/Badge.types.d.ts

@@ -21,7 +21,7 @@ type BaseProps = {
     hidden?: boolean;
     /** Additional classname for the root element */
     className?: G.ClassName;
-} & Pick<ActionableProps, "href" | "onClick" | "attributes">;
+} & Pick<ActionableProps, "href" | "onClick" | "attributes" | "as">;
 type WithChildren = BaseProps & {
     /** Node for inserting text or other content */
     children?: React.ReactNode;

package/dist/components/Button/Button.module.css

@@ -1 +1 @@
-.root{--rs-p-v:var(--rs-button-p-v);--rs-p-h:var(--rs-button-p-h);--rs-button-highlight-opacity:0;--rs-button-highlight-opacity-base:0;--rs-button-border-color:transparent;--rs-button-border-width:0px;align-items:center;border:var(--rs-button-border-width) solid var(--rs-button-border-color);border-radius:var(--rs-button-radius);cursor:pointer;display:inline-flex;justify-content:center;padding:calc(var(--rs-unit-x1) - var(--rs-button-border-width)) calc(var(--rs-p-h) - var(--rs-button-border-width));position:relative;text-align:initial;text-decoration:none;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color,box-shadow,border-color,color,transform;z-index:0;-webkit-tap-highlight-color:transparent;background-color:var(--rs-button-background-color);box-sizing:border-box;color:var(--rs-button-foreground-color);font-family:var(--rs-font-family-body);font-size:var(--rs-button-font-size);font-weight:var(--rs-font-weight-medium);letter-spacing:var(--rs-button-letter-spacing);line-height:var(--rs-button-line-height);min-height:calc(var(--rs-button-line-height) + var(--rs-p-v) * 2);min-width:calc(var(--rs-button-line-height) - (var(--rs-unit-x1) * 2) + (var(--rs-button-p-h) * 2))}.root:before{background:var(--rs-button-highlight-color,var(--rs-button-foreground-color));border-radius:var(--rs-button-radius);content:"";inset:0;opacity:var(--rs-button-highlight-opacity-base);position:absolute;transform:translateZ(0);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,background-color}@media (hover:hover) and (pointer:fine){.root:hover:not(.--loading,.--highlighted,.--disabled):before{opacity:var(--rs-button-highlight-opacity)}}.root.--highlighted:before,.root:active:not(.--loading,.--disabled):before{opacity:calc(var(--rs-button-highlight-opacity) + max(.04, var(--rs-button-highlight-opacity) / 2))}.text{align-items:center;display:flex;gap:var(--rs-button-gap)}.icon{margin-inline-end:var(--rs-button-gap)}.icon:last-child{margin-inline-end:0}.icon.--icon-position-end{margin-inline-end:0;margin-inline-start:var(--rs-button-gap)}.icon,.text{position:relative;z-index:5}.loader{align-items:center;display:none;inset:0;justify-content:center;position:absolute}.root.--icon-only{--rs-p-h:calc(var(--rs-button-p-h) - var(--rs-unit-x1) / 2)}.root.--loading{cursor:default}.root.--loading .icon,.root.--loading .text{visibility:hidden}.root.--loading .loader{display:flex}.root.--rounded,.root.--rounded:before{border-radius:var(--rs-radius-circular)}.--size-small{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width{text-align:center;width:100%}.root.--variant-solid.--color-neutral{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-neutral);--rs-button-foreground-color:var(--rs-color-on-background-neutral)}.root.--variant-solid.--color-primary{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-primary);--rs-button-foreground-color:var(--rs-color-on-background-primary)}.root.--variant-solid.--color-critical{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-critical);--rs-button-foreground-color:var(--rs-color-on-background-critical)}.root.--variant-solid.--color-positive{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-positive);--rs-button-foreground-color:var(--rs-color-on-background-positive)}.root.--variant-solid.--color-media{--rs-button-highlight-opacity:0.06;--rs-button-background-color:var(--rs-color-white);--rs-button-foreground-color:var(--rs-color-black)}.root.--variant-faded.--color-neutral{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-neutral-faded);--rs-button-foreground-color:var(--rs-color-foreground-neutral)}.root.--variant-faded.--color-primary{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-primary-faded);--rs-button-foreground-color:var(--rs-color-foreground-primary)}.root.--variant-faded.--color-critical{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-critical-faded);--rs-button-foreground-color:var(--rs-color-foreground-critical)}.root.--variant-faded.--color-positive{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-positive-faded);--rs-button-foreground-color:var(--rs-color-foreground-positive)}.root.--variant-faded.--color-media{--rs-button-highlight-opacity-base:0.24;--rs-button-highlight-opacity:0.32;--rs-button-foreground-color:var(--rs-color-white);--rs-button-highlight-color:var(--rs-color-black)}.root.--variant-faded.--color-inherit{--rs-button-highlight-opacity-base:0.12;--rs-button-highlight-opacity:0.16;--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--variant-outline{--rs-button-border-width:1px;--rs-button-highlight-opacity:0.06}.root.--variant-outline.--color-primary{--rs-button-foreground-color:var(--rs-color-foreground-primary);--rs-button-border-color:var(--rs-color-border-primary-faded);--rs-button-highlight-color:var(--rs-color-background-primary)}.root.--variant-outline.--color-critical{--rs-button-foreground-color:var(--rs-color-foreground-critical);--rs-button-border-color:var(--rs-color-border-critical-faded);--rs-button-highlight-color:var(--rs-color-background-critical)}.root.--variant-outline.--color-positive{--rs-button-foreground-color:var(--rs-color-foreground-positive);--rs-button-border-color:var(--rs-color-border-positive-faded);--rs-button-highlight-color:var(--rs-color-background-positive)}.root.--variant-outline.--color-neutral{--rs-button-highlight-opacity:0.24;--rs-button-foreground-color:var(--rs-color-foreground-neutral);--rs-button-border-color:var(--rs-color-border-neutral);--rs-button-highlight-color:var(--rs-color-background-neutral)}.root.--variant-outline.--color-inherit{--rs-button-border-width:0px;--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--variant-outline.--color-inherit:after{border:1px solid;border-radius:var(--rs-button-radius);content:"";inset:0;opacity:.28;pointer-events:none;position:absolute}.root.--variant-ghost{--rs-button-highlight-opacity:0.12}.root.--variant-ghost.--color-neutral{--rs-button-highlight-opacity:0.32;--rs-button-foreground-color:var(--rs-color-foreground-neutral);--rs-button-highlight-color:var(--rs-color-background-neutral)}.root.--variant-ghost.--color-primary{--rs-button-foreground-color:var(--rs-color-foreground-primary);--rs-button-highlight-color:var(--rs-color-background-primary)}.root.--variant-ghost.--color-critical{--rs-button-foreground-color:var(--rs-color-foreground-critical);--rs-button-highlight-color:var(--rs-color-background-critical)}.root.--variant-ghost.--color-positive{--rs-button-foreground-color:var(--rs-color-foreground-positive);--rs-button-highlight-color:var(--rs-color-background-positive)}.root.--variant-ghost.--color-inherit{--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--elevated:not(:focus),[data-rs-keyboard] .root.--elevated:not(:focus){box-shadow:var(--rs-shadow-raised)}.root.--elevated.--variant-outline.--color-critical,.root.--elevated.--variant-outline.--color-neutral,.root.--elevated.--variant-outline.--color-positive,.root.--elevated.--variant-outline.--color-primary{background:var(--rs-color-background-elevation-raised)}.root.--disabled.--color-critical,.root.--disabled.--color-critical.--highlighted,.root.--disabled.--color-critical:active,.root.--disabled.--color-critical:hover,.root.--disabled.--color-inherit,.root.--disabled.--color-inherit.--highlighted,.root.--disabled.--color-inherit:active,.root.--disabled.--color-inherit:hover,.root.--disabled.--color-neutral,.root.--disabled.--color-neutral.--highlighted,.root.--disabled.--color-neutral:active,.root.--disabled.--color-neutral:hover,.root.--disabled.--color-positive,.root.--disabled.--color-positive.--highlighted,.root.--disabled.--color-positive:active,.root.--disabled.--color-positive:hover,.root.--disabled.--color-primary,.root.--disabled.--color-primary.--highlighted,.root.--disabled.--color-primary:active,.root.--disabled.--color-primary:hover{background-color:var(--rs-color-background-disabled)!important;border-color:var(--rs-color-border-disabled)!important;color:var(--rs-color-foreground-disabled)!important}.root.--disabled.--color-critical.--highlighted:before,.root.--disabled.--color-critical:active:before,.root.--disabled.--color-critical:before,.root.--disabled.--color-critical:hover:before,.root.--disabled.--color-inherit.--highlighted:before,.root.--disabled.--color-inherit:active:before,.root.--disabled.--color-inherit:before,.root.--disabled.--color-inherit:hover:before,.root.--disabled.--color-neutral.--highlighted:before,.root.--disabled.--color-neutral:active:before,.root.--disabled.--color-neutral:before,.root.--disabled.--color-neutral:hover:before,.root.--disabled.--color-positive.--highlighted:before,.root.--disabled.--color-positive:active:before,.root.--disabled.--color-positive:before,.root.--disabled.--color-positive:hover:before,.root.--disabled.--color-primary.--highlighted:before,.root.--disabled.--color-primary:active:before,.root.--disabled.--color-primary:before,.root.--disabled.--color-primary:hover:before{opacity:0!important}.root.--disabled.--color-critical.--highlighted.--variant-faded,.root.--disabled.--color-critical.--variant-faded,.root.--disabled.--color-critical:active.--variant-faded,.root.--disabled.--color-critical:hover.--variant-faded,.root.--disabled.--color-inherit.--highlighted.--variant-faded,.root.--disabled.--color-inherit.--variant-faded,.root.--disabled.--color-inherit:active.--variant-faded,.root.--disabled.--color-inherit:hover.--variant-faded,.root.--disabled.--color-neutral.--highlighted.--variant-faded,.root.--disabled.--color-neutral.--variant-faded,.root.--disabled.--color-neutral:active.--variant-faded,.root.--disabled.--color-neutral:hover.--variant-faded,.root.--disabled.--color-positive.--highlighted.--variant-faded,.root.--disabled.--color-positive.--variant-faded,.root.--disabled.--color-positive:active.--variant-faded,.root.--disabled.--color-positive:hover.--variant-faded,.root.--disabled.--color-primary.--highlighted.--variant-faded,.root.--disabled.--color-primary.--variant-faded,.root.--disabled.--color-primary:active.--variant-faded,.root.--disabled.--color-primary:hover.--variant-faded{background-color:var(--rs-color-background-disabled-faded)!important}.root.--disabled.--color-critical.--highlighted.--variant-outline,.root.--disabled.--color-critical.--variant-outline,.root.--disabled.--color-critical:active.--variant-outline,.root.--disabled.--color-critical:hover.--variant-outline,.root.--disabled.--color-inherit.--highlighted.--variant-outline,.root.--disabled.--color-inherit.--variant-outline,.root.--disabled.--color-inherit:active.--variant-outline,.root.--disabled.--color-inherit:hover.--variant-outline,.root.--disabled.--color-neutral.--highlighted.--variant-outline,.root.--disabled.--color-neutral.--variant-outline,.root.--disabled.--color-neutral:active.--variant-outline,.root.--disabled.--color-neutral:hover.--variant-outline,.root.--disabled.--color-positive.--highlighted.--variant-outline,.root.--disabled.--color-positive.--variant-outline,.root.--disabled.--color-positive:active.--variant-outline,.root.--disabled.--color-positive:hover.--variant-outline,.root.--disabled.--color-primary.--highlighted.--variant-outline,.root.--disabled.--color-primary.--variant-outline,.root.--disabled.--color-primary:active.--variant-outline,.root.--disabled.--color-primary:hover.--variant-outline{background-color:transparent!important}.root.--disabled.--color-critical.--highlighted.--variant-ghost,.root.--disabled.--color-critical.--variant-ghost,.root.--disabled.--color-critical:active.--variant-ghost,.root.--disabled.--color-critical:hover.--variant-ghost,.root.--disabled.--color-inherit.--highlighted.--variant-ghost,.root.--disabled.--color-inherit.--variant-ghost,.root.--disabled.--color-inherit:active.--variant-ghost,.root.--disabled.--color-inherit:hover.--variant-ghost,.root.--disabled.--color-neutral.--highlighted.--variant-ghost,.root.--disabled.--color-neutral.--variant-ghost,.root.--disabled.--color-neutral:active.--variant-ghost,.root.--disabled.--color-neutral:hover.--variant-ghost,.root.--disabled.--color-positive.--highlighted.--variant-ghost,.root.--disabled.--color-positive.--variant-ghost,.root.--disabled.--color-positive:active.--variant-ghost,.root.--disabled.--color-positive:hover.--variant-ghost,.root.--disabled.--color-primary.--highlighted.--variant-ghost,.root.--disabled.--color-primary.--variant-ghost,.root.--disabled.--color-primary:active.--variant-ghost,.root.--disabled.--color-primary:hover.--variant-ghost{background-color:transparent!important;border-color:transparent!important}.root.--disabled.--color-media,.root.--disabled.--color-media.--highlighted,.root.--disabled.--color-media:active,.root.--disabled.--color-media:hover{opacity:.4!important}.group .root,.group .root:before{border-radius:0}.group .root:first-child,.group .root:first-child:before{border-end-start-radius:var(--rs-button-radius);border-start-start-radius:var(--rs-button-radius)}.group .root:last-child,.group .root:last-child:before{border-end-end-radius:var(--rs-button-radius);border-start-end-radius:var(--rs-button-radius)}.group .root:not(:first-child){border-inline-start:1px solid var(--rs-button-group-separator-color)}.group .root:not(:last-child){border-inline-end:0;border-inline-end:0 solid var(--rs-button-group-separator-color)}.group .root.--highlighted:not(:last-child):after{border-inline-end:1px solid var(--rs-button-group-separator-color);content:"";inset-block:0;inset-inline-end:-1px;pointer-events:none;position:absolute}.group .root.--highlighted:not(:last-child)+.root{border-inline-start-width:0;padding-inline-start:var(--rs-p-h)}.group .root.--variant-solid.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral)}.group .root.--variant-solid.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive)}.group .root.--variant-solid.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical)}.group .root.--variant-solid.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary)}.group .root.--variant-faded.--color-neutral,.group .root.--variant-outline.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral)}.group .root.--variant-faded.--color-positive,.group .root.--variant-outline.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive-faded)}.group .root.--variant-faded.--color-critical,.group .root.--variant-outline.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical-faded)}.group .root.--variant-faded.--color-primary,.group .root.--variant-outline.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary-faded)}.group .root.--variant-ghost.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral-faded)}.group .root.--variant-ghost.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive-faded)}.group .root.--variant-ghost.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical-faded)}.group .root.--variant-ghost.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary-faded)}.group .root.--variant-solid.--color-media{--rs-button-group-separator-color:rgba(var(--rs-color-rgb-black),0.12)}.group .root.--variant-faded.--color-media{--rs-button-group-separator-color:rgba(var(--rs-color-rgb-white),0.12)}.aligner{line-height:0}@media (--rs-viewport-m ){.--size-small--m{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--m{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--m{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--m{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--m{text-align:center;width:100%}.--full-width-false--m{text-align:initial;width:auto}}@media (--rs-viewport-l ){.--size-small--l{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--l{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--l{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--l{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--l{text-align:center;width:100%}.--full-width-false--l{text-align:initial;width:auto}}@media (--rs-viewport-xl ){.--size-small--xl{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--xl{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--xl{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--xl{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--xl{text-align:center;width:100%}.--full-width-false--xl{text-align:initial;width:auto}}
+.root{--rs-p-v:var(--rs-button-p-v);--rs-p-h:var(--rs-button-p-h);--rs-button-highlight-opacity:0;--rs-button-highlight-opacity-base:0;--rs-button-border-color:transparent;--rs-button-border-width:0px;align-items:center;border:var(--rs-button-border-width) solid var(--rs-button-border-color);border-radius:var(--rs-button-radius);cursor:pointer;display:inline-flex;justify-content:center;padding:calc(var(--rs-unit-x1) - var(--rs-button-border-width)) calc(var(--rs-p-h) - var(--rs-button-border-width));position:relative;text-align:initial;text-decoration:none;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color,box-shadow,border-color,color,transform;z-index:0;-webkit-tap-highlight-color:transparent;background-color:var(--rs-button-background-color);box-sizing:border-box;color:var(--rs-button-foreground-color);font-family:var(--rs-font-family-body);font-size:var(--rs-button-font-size);font-weight:var(--rs-font-weight-medium);letter-spacing:var(--rs-button-letter-spacing);line-height:var(--rs-button-line-height);min-height:calc(var(--rs-button-line-height) + var(--rs-p-v) * 2);min-width:calc(var(--rs-button-line-height) - (var(--rs-unit-x1) * 2) + (var(--rs-button-p-h) * 2))}.root:before{background:var(--rs-button-highlight-color,var(--rs-button-foreground-color));border-radius:var(--rs-button-radius);content:"";inset:0;opacity:var(--rs-button-highlight-opacity-base);position:absolute;transform:translateZ(0);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,background-color}@media (hover:hover) and (pointer:fine){.root:hover:not(.--loading,.--highlighted,.--disabled):before{opacity:var(--rs-button-highlight-opacity)}}.root.--highlighted:before,.root:active:not(.--loading,.--disabled):before{opacity:calc(var(--rs-button-highlight-opacity) + max(.04, var(--rs-button-highlight-opacity) / 2))}.text{align-items:center;display:flex;gap:var(--rs-button-gap)}.icon{margin-inline-end:var(--rs-button-gap)}.icon:last-child{margin-inline-end:0}.icon.--icon-position-end{margin-inline-end:0;margin-inline-start:var(--rs-button-gap)}.icon,.text{position:relative;z-index:5}.loader{align-items:center;display:none;inset:0;justify-content:center;position:absolute}.root.--icon-only{--rs-p-h:calc(var(--rs-button-p-h) - var(--rs-unit-x1) / 2)}.root.--loading{cursor:default}.root.--loading .icon,.root.--loading .text{visibility:hidden}.root.--loading .loader{display:flex}.root.--rounded,.root.--rounded:before{border-radius:var(--rs-radius-circular)}.--size-small{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width{text-align:center;width:100%}.root.--variant-solid.--color-neutral{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-neutral);--rs-button-foreground-color:var(--rs-color-on-background-neutral)}.root.--variant-solid.--color-primary{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-primary);--rs-button-foreground-color:var(--rs-color-on-background-primary)}.root.--variant-solid.--color-critical{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-critical);--rs-button-foreground-color:var(--rs-color-on-background-critical)}.root.--variant-solid.--color-positive{--rs-button-highlight-opacity:0.08;--rs-button-background-color:var(--rs-color-background-positive);--rs-button-foreground-color:var(--rs-color-on-background-positive)}.root.--variant-solid.--color-media{--rs-button-highlight-opacity:0.06;--rs-button-background-color:var(--rs-color-white);--rs-button-foreground-color:var(--rs-color-black)}.root.--variant-faded.--color-neutral{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-neutral-faded);--rs-button-foreground-color:var(--rs-color-foreground-neutral)}.root.--variant-faded.--color-primary{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-primary-faded);--rs-button-foreground-color:var(--rs-color-foreground-primary)}.root.--variant-faded.--color-critical{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-critical-faded);--rs-button-foreground-color:var(--rs-color-foreground-critical)}.root.--variant-faded.--color-positive{--rs-button-highlight-opacity:0.04;--rs-button-background-color:var(--rs-color-background-positive-faded);--rs-button-foreground-color:var(--rs-color-foreground-positive)}.root.--variant-faded.--color-media{--rs-button-highlight-opacity-base:0.24;--rs-button-highlight-opacity:0.32;--rs-button-foreground-color:var(--rs-color-white);--rs-button-highlight-color:var(--rs-color-black)}.root.--variant-faded.--color-inherit{--rs-button-highlight-opacity-base:0.12;--rs-button-highlight-opacity:0.16;--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--variant-outline{--rs-button-border-width:1px;--rs-button-highlight-opacity:0.06}.root.--variant-outline.--color-primary{--rs-button-foreground-color:var(--rs-color-foreground-primary);--rs-button-border-color:var(--rs-color-border-primary-faded);--rs-button-highlight-color:var(--rs-color-background-primary)}.root.--variant-outline.--color-critical{--rs-button-foreground-color:var(--rs-color-foreground-critical);--rs-button-border-color:var(--rs-color-border-critical-faded);--rs-button-highlight-color:var(--rs-color-background-critical)}.root.--variant-outline.--color-positive{--rs-button-foreground-color:var(--rs-color-foreground-positive);--rs-button-border-color:var(--rs-color-border-positive-faded);--rs-button-highlight-color:var(--rs-color-background-positive)}.root.--variant-outline.--color-neutral{--rs-button-highlight-opacity:0.24;--rs-button-foreground-color:var(--rs-color-foreground-neutral);--rs-button-border-color:var(--rs-color-border-neutral);--rs-button-highlight-color:var(--rs-color-background-neutral)}.root.--variant-outline.--color-inherit{--rs-button-border-width:0px;--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--variant-outline.--color-inherit:after{border:1px solid;border-radius:var(--rs-button-radius);content:"";inset:0;opacity:.28;pointer-events:none;position:absolute}.root.--variant-ghost{--rs-button-highlight-opacity:0.12}.root.--variant-ghost.--color-neutral{--rs-button-highlight-opacity:0.32;--rs-button-foreground-color:var(--rs-color-foreground-neutral);--rs-button-highlight-color:var(--rs-color-background-neutral)}.root.--variant-ghost.--color-primary{--rs-button-foreground-color:var(--rs-color-foreground-primary);--rs-button-highlight-color:var(--rs-color-background-primary)}.root.--variant-ghost.--color-critical{--rs-button-foreground-color:var(--rs-color-foreground-critical);--rs-button-highlight-color:var(--rs-color-background-critical)}.root.--variant-ghost.--color-positive{--rs-button-foreground-color:var(--rs-color-foreground-positive);--rs-button-highlight-color:var(--rs-color-background-positive)}.root.--variant-ghost.--color-inherit{--rs-button-foreground-color:inherit;--rs-button-highlight-color:currentcolor}.root.--elevated:not(:focus),[data-rs-keyboard] .root.--elevated:not(:focus){box-shadow:var(--rs-shadow-raised)}.root.--elevated.--variant-outline.--color-critical,.root.--elevated.--variant-outline.--color-neutral,.root.--elevated.--variant-outline.--color-positive,.root.--elevated.--variant-outline.--color-primary{background:var(--rs-color-background-elevation-raised)}.root.--disabled.--color-critical,.root.--disabled.--color-critical.--highlighted,.root.--disabled.--color-critical:active,.root.--disabled.--color-critical:hover,.root.--disabled.--color-inherit,.root.--disabled.--color-inherit.--highlighted,.root.--disabled.--color-inherit:active,.root.--disabled.--color-inherit:hover,.root.--disabled.--color-neutral,.root.--disabled.--color-neutral.--highlighted,.root.--disabled.--color-neutral:active,.root.--disabled.--color-neutral:hover,.root.--disabled.--color-positive,.root.--disabled.--color-positive.--highlighted,.root.--disabled.--color-positive:active,.root.--disabled.--color-positive:hover,.root.--disabled.--color-primary,.root.--disabled.--color-primary.--highlighted,.root.--disabled.--color-primary:active,.root.--disabled.--color-primary:hover{background-color:var(--rs-color-background-disabled)!important;border-color:var(--rs-color-border-disabled)!important;color:var(--rs-color-foreground-disabled)!important}.root.--disabled.--color-critical.--highlighted:before,.root.--disabled.--color-critical:active:before,.root.--disabled.--color-critical:before,.root.--disabled.--color-critical:hover:before,.root.--disabled.--color-inherit.--highlighted:before,.root.--disabled.--color-inherit:active:before,.root.--disabled.--color-inherit:before,.root.--disabled.--color-inherit:hover:before,.root.--disabled.--color-neutral.--highlighted:before,.root.--disabled.--color-neutral:active:before,.root.--disabled.--color-neutral:before,.root.--disabled.--color-neutral:hover:before,.root.--disabled.--color-positive.--highlighted:before,.root.--disabled.--color-positive:active:before,.root.--disabled.--color-positive:before,.root.--disabled.--color-positive:hover:before,.root.--disabled.--color-primary.--highlighted:before,.root.--disabled.--color-primary:active:before,.root.--disabled.--color-primary:before,.root.--disabled.--color-primary:hover:before{opacity:0!important}.root.--disabled.--color-critical.--highlighted.--variant-faded,.root.--disabled.--color-critical.--variant-faded,.root.--disabled.--color-critical:active.--variant-faded,.root.--disabled.--color-critical:hover.--variant-faded,.root.--disabled.--color-inherit.--highlighted.--variant-faded,.root.--disabled.--color-inherit.--variant-faded,.root.--disabled.--color-inherit:active.--variant-faded,.root.--disabled.--color-inherit:hover.--variant-faded,.root.--disabled.--color-neutral.--highlighted.--variant-faded,.root.--disabled.--color-neutral.--variant-faded,.root.--disabled.--color-neutral:active.--variant-faded,.root.--disabled.--color-neutral:hover.--variant-faded,.root.--disabled.--color-positive.--highlighted.--variant-faded,.root.--disabled.--color-positive.--variant-faded,.root.--disabled.--color-positive:active.--variant-faded,.root.--disabled.--color-positive:hover.--variant-faded,.root.--disabled.--color-primary.--highlighted.--variant-faded,.root.--disabled.--color-primary.--variant-faded,.root.--disabled.--color-primary:active.--variant-faded,.root.--disabled.--color-primary:hover.--variant-faded{background-color:var(--rs-color-background-disabled-faded)!important}.root.--disabled.--color-critical.--highlighted.--variant-outline,.root.--disabled.--color-critical.--variant-outline,.root.--disabled.--color-critical:active.--variant-outline,.root.--disabled.--color-critical:hover.--variant-outline,.root.--disabled.--color-inherit.--highlighted.--variant-outline,.root.--disabled.--color-inherit.--variant-outline,.root.--disabled.--color-inherit:active.--variant-outline,.root.--disabled.--color-inherit:hover.--variant-outline,.root.--disabled.--color-neutral.--highlighted.--variant-outline,.root.--disabled.--color-neutral.--variant-outline,.root.--disabled.--color-neutral:active.--variant-outline,.root.--disabled.--color-neutral:hover.--variant-outline,.root.--disabled.--color-positive.--highlighted.--variant-outline,.root.--disabled.--color-positive.--variant-outline,.root.--disabled.--color-positive:active.--variant-outline,.root.--disabled.--color-positive:hover.--variant-outline,.root.--disabled.--color-primary.--highlighted.--variant-outline,.root.--disabled.--color-primary.--variant-outline,.root.--disabled.--color-primary:active.--variant-outline,.root.--disabled.--color-primary:hover.--variant-outline{background-color:transparent!important}.root.--disabled.--color-critical.--highlighted.--variant-ghost,.root.--disabled.--color-critical.--variant-ghost,.root.--disabled.--color-critical:active.--variant-ghost,.root.--disabled.--color-critical:hover.--variant-ghost,.root.--disabled.--color-inherit.--highlighted.--variant-ghost,.root.--disabled.--color-inherit.--variant-ghost,.root.--disabled.--color-inherit:active.--variant-ghost,.root.--disabled.--color-inherit:hover.--variant-ghost,.root.--disabled.--color-neutral.--highlighted.--variant-ghost,.root.--disabled.--color-neutral.--variant-ghost,.root.--disabled.--color-neutral:active.--variant-ghost,.root.--disabled.--color-neutral:hover.--variant-ghost,.root.--disabled.--color-positive.--highlighted.--variant-ghost,.root.--disabled.--color-positive.--variant-ghost,.root.--disabled.--color-positive:active.--variant-ghost,.root.--disabled.--color-positive:hover.--variant-ghost,.root.--disabled.--color-primary.--highlighted.--variant-ghost,.root.--disabled.--color-primary.--variant-ghost,.root.--disabled.--color-primary:active.--variant-ghost,.root.--disabled.--color-primary:hover.--variant-ghost{background-color:transparent!important;border-color:transparent!important}.root.--disabled.--color-media,.root.--disabled.--color-media.--highlighted,.root.--disabled.--color-media:active,.root.--disabled.--color-media:hover{opacity:.4!important}.group{display:flex}.group .root{flex-shrink:0;width:auto}.group .root,.group .root:before{border-radius:0}.group .root:first-child,.group .root:first-child:before{border-end-start-radius:var(--rs-button-radius);border-start-start-radius:var(--rs-button-radius)}.group .root:last-child,.group .root:last-child:before{border-end-end-radius:var(--rs-button-radius);border-start-end-radius:var(--rs-button-radius)}.group .root:not(:first-child){border-inline-start:1px solid var(--rs-button-group-separator-color)}.group .root:not(:last-child){border-inline-end:0;border-inline-end:0 solid var(--rs-button-group-separator-color)}.group .root.--highlighted:not(:last-child):after{border-inline-end:1px solid var(--rs-button-group-separator-color);content:"";inset-block:0;inset-inline-end:-1px;pointer-events:none;position:absolute}.group .root.--highlighted:not(:last-child)+.root{border-inline-start-width:0;padding-inline-start:var(--rs-p-h)}.group .root.--variant-solid.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral)}.group .root.--variant-solid.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive)}.group .root.--variant-solid.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical)}.group .root.--variant-solid.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary)}.group .root.--variant-faded.--color-neutral,.group .root.--variant-outline.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral)}.group .root.--variant-faded.--color-positive,.group .root.--variant-outline.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive-faded)}.group .root.--variant-faded.--color-critical,.group .root.--variant-outline.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical-faded)}.group .root.--variant-faded.--color-primary,.group .root.--variant-outline.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary-faded)}.group .root.--variant-ghost.--color-neutral{--rs-button-group-separator-color:var(--rs-color-border-neutral-faded)}.group .root.--variant-ghost.--color-positive{--rs-button-group-separator-color:var(--rs-color-border-positive-faded)}.group .root.--variant-ghost.--color-critical{--rs-button-group-separator-color:var(--rs-color-border-critical-faded)}.group .root.--variant-ghost.--color-primary{--rs-button-group-separator-color:var(--rs-color-border-primary-faded)}.group .root.--variant-solid.--color-media{--rs-button-group-separator-color:rgba(var(--rs-color-rgb-black),0.12)}.group .root.--variant-faded.--color-media{--rs-button-group-separator-color:rgba(var(--rs-color-rgb-white),0.12)}.group .root.--full-width{flex-grow:1}.aligner{line-height:0}@media (--rs-viewport-m ){.--size-small--m{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--m{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--m{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--m{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--m{text-align:center;width:100%}.--full-width-false--m{text-align:initial;width:auto}}@media (--rs-viewport-l ){.--size-small--l{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--l{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--l{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--l{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--l{text-align:center;width:100%}.--full-width-false--l{text-align:initial;width:auto}}@media (--rs-viewport-xl ){.--size-small--xl{--rs-button-p-v:var(--rs-unit-x1);--rs-button-p-h:var(--rs-unit-x2);--rs-button-gap:var(--rs-unit-x1);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-medium--xl{--rs-button-p-v:var(--rs-unit-x2);--rs-button-p-h:var(--rs-unit-x3);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-3);--rs-button-font-size:var(--rs-font-size-body-3);--rs-button-letter-spacing:var(--rs-letter-spacing-body-3);--rs-button-radius:var(--rs-radius-small)}.--size-large--xl{--rs-button-p-v:var(--rs-unit-x3);--rs-button-p-h:var(--rs-unit-x4);--rs-button-gap:var(--rs-unit-x2);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--size-xlarge--xl{--rs-button-p-v:var(--rs-unit-x4);--rs-button-p-h:var(--rs-unit-x5);--rs-button-gap:var(--rs-unit-x3);--rs-button-line-height:var(--rs-line-height-body-2);--rs-button-font-size:var(--rs-font-size-body-2);--rs-button-letter-spacing:var(--rs-letter-spacing-body-2);--rs-button-radius:var(--rs-radius-medium)}.--full-width-true--xl{text-align:center;width:100%}.--full-width-false--xl{text-align:initial;width:auto}}

package/dist/components/Calendar/Calendar.module.css

@@ -1 +1 @@
-@layer rs.calendar.base;@layer rs.calendar.range;@layer rs.calendar.disabled;@layer rs.calendar.base{.selection{table-layout:fixed;width:100%}.weekday{color:var(--rs-color-foreground-neutral-faded);font-weight:var(--rs-font-weight-regular);padding-bottom:var(--rs-unit-x2)}[dir=rtl] .control{transform:scaleX(-1)}.cell{isolation:isolate;padding:2px}@media (hover:hover) and (pointer:fine){.cell:hover .cell-button{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}}.cell.--active .cell-button{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.cell-button{border-radius:var(--rs-radius-small);padding:var(--rs-unit-x2);position:relative;text-align:center;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:color,background-color,border-radius}.cell-button:before{content:"";inset-block:0;inset-inline-start:-4px;position:absolute;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color;width:4px}}@layer rs.calendar.selection{.cell.--selection-range .cell-button{background-color:rgba(var(--rs-color-rgb-background-neutral),32%);color:var(--rs-color-foreground-neutral)}.cell.--selection-range:not(:last-child) .cell-button,.cell.--selection-start:not(:last-child) .cell-button{border-end-end-radius:0;border-start-end-radius:0}.cell.--selection-end:not(:first-child) .cell-button,.cell.--selection-range+:hover .cell-button,.cell.--selection-range:not(:first-child) .cell-button,.cell.--selection-start+:hover .cell-button{border-end-start-radius:0;border-start-start-radius:0}.cell.--selection-range+.--selection-end .cell-button:before,.cell.--selection-range+.--selection-range .cell-button:before,.cell.--selection-start+.--selection-range .cell-button:before{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}@media (hover:hover) and (pointer:fine){.cell.--selection-range+:hover .cell-button:before,.cell.--selection-start+:hover .cell-button:before{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}}}@layer rs.calendar.disabled{.cell-button[disabled]{background-color:transparent;color:var(--rs-color-foreground-disabled)}}
+.selection{table-layout:fixed;width:100%}.weekday{color:var(--rs-color-foreground-neutral-faded);font-weight:var(--rs-font-weight-regular);padding-bottom:var(--rs-unit-x2)}[dir=rtl] .control{transform:scaleX(-1)}.cell{isolation:isolate;padding:2px}@media (hover:hover) and (pointer:fine){.cell:hover .cell-button{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}}.cell.--active .cell-button{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.cell.--selection-range .cell-button{background-color:rgba(var(--rs-color-rgb-background-neutral),32%);color:var(--rs-color-foreground-neutral)}.cell.--selection-range:not(:last-child) .cell-button,.cell.--selection-start:not(:last-child) .cell-button{border-end-end-radius:0;border-start-end-radius:0}.cell.--selection-end:not(:first-child) .cell-button,.cell.--selection-range+:hover .cell-button,.cell.--selection-range:not(:first-child) .cell-button,.cell.--selection-start+:hover .cell-button{border-end-start-radius:0;border-start-start-radius:0}.cell.--selection-range+.--selection-end .cell-button:before,.cell.--selection-range+.--selection-range .cell-button:before,.cell.--selection-start+.--selection-range .cell-button:before{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}@media (hover:hover) and (pointer:fine){.cell.--selection-range+:hover .cell-button:before,.cell.--selection-start+:hover .cell-button:before{background-color:rgba(var(--rs-color-rgb-background-neutral),32%)}}.cell-button{border-radius:var(--rs-radius-small);padding:var(--rs-unit-x2);position:relative;text-align:center;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:color,background-color,border-radius}.cell-button:before{content:"";inset-block:0;inset-inline-start:-4px;position:absolute;transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color;width:4px}.cell-button[disabled]{background-color:transparent!important;color:var(--rs-color-foreground-disabled)!important}

package/dist/components/Calendar/Calendar.utils.js

@@ -108,6 +108,9 @@ export const applyNavigationBounds = (args) => {
         isLastMonth: max && max < nextMonthFirstDate,
     };
 };
+const isMonthMatch = (date1, date2) => {
+    return date1.getMonth() === date2.getMonth() && date1.getFullYear() === date2.getFullYear();
+};
 /**
  * Decide if date has to be focusable with Tab (only one date should be)
  * 1. If there is a selected value - it's focusable
@@ -117,19 +120,15 @@ export const applyNavigationBounds = (args) => {
 export const isDateFocusable = (args) => {
     const { date, startValue, lastFocusedDate } = args;
     const today = new Date();
-    const renderedMonth = date.getMonth();
-    const valueMonth = startValue?.getMonth();
-    const todayMonth = today.getMonth();
-    const lastFocusedMonth = lastFocusedDate?.getMonth();
     const isoDate = getLocalISODate({ date });
     const isoToday = getLocalISODate({ date: today });
     const isoValueDate = startValue && getLocalISODate({ date: startValue });
     const isoLastFocusedDate = lastFocusedDate && getLocalISODate({ date: lastFocusedDate });
-    if (lastFocusedDate && renderedMonth === lastFocusedMonth)
+    if (lastFocusedDate && isMonthMatch(date, lastFocusedDate))
         return isoDate === isoLastFocusedDate;
-    if (startValue && renderedMonth === valueMonth)
+    if (startValue && isMonthMatch(date, startValue))
         return isoDate === isoValueDate;
-    if (renderedMonth === todayMonth)
+    if (isMonthMatch(date, today))
         return isoDate === isoToday;
     return true;
 };

package/dist/components/Card/Card.d.ts

@@ -7,10 +7,10 @@ declare const Card: React.ForwardRefExoticComponent<{
     children?: React.ReactNode;
     onClick?: import("../Actionable").ActionableProps["onClick"];
     href?: string;
-    as?: keyof React.JSX.IntrinsicElements | undefined;
     className?: import("../../types/global").ClassName;
     attributes?: (import("../..").Attributes<keyof React.JSX.IntrinsicElements> & ((import("../..").Attributes<"button"> & Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "form" | "slot" | "style" | "title" | "disabled" | "key" | "value" | "hidden" | "color" | "content" | "children" | "className" | "ref" | "aria-orientation" | "role" | "translate" | "suppressHydrationWarning" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dir" | "name" | "type" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture"> & {
-        ref?: import("../Actionable/Actionable.types").AttributesRef;
+        ref?: import("../../core/Actionable/Actionable.types").AttributesRef;
     }) | undefined)) | undefined;
+    as?: keyof React.JSX.IntrinsicElements | undefined;
 } & Pick<import("../View").ViewProps, "height"> & React.RefAttributes<HTMLElement>>;
 export default Card;

package/dist/components/Card/Card.types.d.ts

@@ -2,7 +2,7 @@ import type { ActionableProps } from "../Actionable";
 import type { ViewProps } from "../View";
 import type React from "react";
 import type * as G from "../../types/global";
-export type Props<TagName extends keyof React.JSX.IntrinsicElements = "div"> = {
+export type Props<TagName extends keyof React.JSX.IntrinsicElements | void = void> = {
     /** Component padding, base unit multiplier */
     padding?: G.Responsive<number>;
     /** Remove side borders and apply negative margins, base unit multiplier */
@@ -17,12 +17,12 @@ export type Props<TagName extends keyof React.JSX.IntrinsicElements = "div"> = {
     onClick?: ActionableProps["onClick"];
     /** URL to navigate to when the component is clicked, turns component into a link */
     href?: string;
-    /** Custom component tag name
-     * @default "div"
-     */
-    as?: TagName;
     /** Additional classname for the root element */
     className?: G.ClassName;
     /** Additional attributes for the root element */
     attributes?: G.Attributes<TagName> & ActionableProps["attributes"];
+    /** Custom component tag name
+     * @default "div"
+     */
+    as?: TagName extends keyof React.JSX.IntrinsicElements ? TagName : keyof React.JSX.IntrinsicElements;
 } & Pick<ViewProps, "height">;

package/dist/components/Carousel/Carousel.js

@@ -32,7 +32,6 @@ const Carousel = (props) => {
         // 	itemRefs.current[index] = null;
         // };
     };
-    // eslint-disable-next-line react-hooks/refs
     const handleScroll = rafThrottle((event) => {
         const el = event.target;
         const firstVisibleIndex = getFirstVisibleIndex();

package/dist/components/Flyout/Flyout.constants.d.ts

@@ -1,3 +1,4 @@
 export declare const mouseEnter = 600;
+export declare const mouseLeave = 150;
 export declare const defaultStyles: React.CSSProperties;
 export declare const resetStyles: React.CSSProperties;

package/dist/components/Flyout/Flyout.constants.js

@@ -1,4 +1,5 @@
 export const mouseEnter = 600;
+export const mouseLeave = 150;
 export const defaultStyles = {
     left: 0,
     top: 0,

package/dist/components/Flyout/Flyout.module.css

@@ -1 +1 @@
-.content{--rs-flyout-gap:0;--rs-flyout-max-h:100%;--rs-flyout-origin-x:50%;--rs-flyout-origin-y:50%;display:flex;flex-direction:column;isolation:isolate;pointer-events:none;position:absolute}.content.--hover{pointer-events:all}.content.--hover-disabled,.content.--hover-disabled .inner{pointer-events:none}.inner{backface-visibility:hidden;flex-grow:1;height:100%;max-height:var(--rs-flyout-max-h);max-width:100%;opacity:0;outline:none;overflow:auto;pointer-events:all;transform:scale(.92) translateY(0);transform-origin:var(--rs-flyout-origin-x) var(--rs-flyout-origin-y);transition:1ms var(--rs-easing-accelerate)}[data-rs-keyboard] .inner:focus{box-shadow:var(--rs-shadow-focus)}.content.--width-trigger .inner{transform:scale(1) translateY(var(--rs-unit-x2))}.content.--position-top,.content.--position-top-end,.content.--position-top-start{--rs-flyout-origin-y:100%;padding-bottom:calc(var(--rs-unit-x1) * var(--rs-flyout-gap))}.content.--position-bottom,.content.--position-bottom-end,.content.--position-bottom-start{--rs-flyout-origin-y:0%;padding-top:calc(var(--rs-unit-x1) * var(--rs-flyout-gap))}.content.--position-bottom-start,.content.--position-top-start{--rs-flyout-origin-x:0%}.content.--position-bottom-end,.content.--position-top-end{--rs-flyout-origin-x:100%}.content.--position-start,.content.--position-start-bottom,.content.--position-start-top{--rs-flyout-origin-x:100%;padding-right:calc(var(--rs-unit-x1) * var(--rs-flyout-gap))}.content.--position-end,.content.--position-end-bottom,.content.--position-end-top{--rs-flyout-origin-x:0%;padding-left:calc(var(--rs-unit-x1) * var(--rs-flyout-gap))}.content.--position-end-top,.content.--position-start-top{--rs-flyout-origin-y:0%}.content.--position-end-bottom,.content.--position-start-bottom{--rs-flyout-origin-y:100%}.content.--visible .inner{opacity:1;transform:scale(1) translateY(0)}.content.--animated .inner{transition-duration:var(--rs-duration-rapid);transition-property:opacity,transform}.content.--animated.--visible .inner{transition-duration:var(--rs-duration-fast);transition-timing-function:var(--rs-easing-decelerate)}
+.content{--rs-flyout-max-h:100%;--rs-flyout-max-w:100%;--rs-flyout-origin-x:50%;--rs-flyout-origin-y:50%;display:flex;flex-direction:column;isolation:isolate;pointer-events:none;position:absolute;z-index:var(--rs-z-index-absolute)}.content.--hover{pointer-events:all}.content.--hover-disabled,.content.--hover-disabled .inner{pointer-events:none}.inner{backface-visibility:hidden;flex-grow:1;height:100%;max-height:var(--rs-flyout-max-h);max-width:var(--rs-flyout-max-w);opacity:0;outline:none;overflow:auto;pointer-events:all;transform:scale(.92) translateY(0);transform-origin:var(--rs-flyout-origin-x) var(--rs-flyout-origin-y);transition:1ms var(--rs-easing-accelerate)}[data-rs-keyboard] .inner:focus{box-shadow:var(--rs-shadow-focus)}.content.--width-trigger .inner{transform:scale(1) translateY(var(--rs-unit-x2))}.content.--position-top,.content.--position-top-end,.content.--position-top-start{--rs-flyout-origin-y:100%}.content.--position-bottom,.content.--position-bottom-end,.content.--position-bottom-start{--rs-flyout-origin-y:0%}.content.--position-bottom-start,.content.--position-top-start{--rs-flyout-origin-x:0%}.content.--position-bottom-end,.content.--position-start,.content.--position-start-bottom,.content.--position-start-top,.content.--position-top-end{--rs-flyout-origin-x:100%}.content.--position-end,.content.--position-end-bottom,.content.--position-end-top{--rs-flyout-origin-x:0%}.content.--position-end-top,.content.--position-start-top{--rs-flyout-origin-y:0%}.content.--position-end-bottom,.content.--position-start-bottom{--rs-flyout-origin-y:100%}.content.--visible .inner{opacity:1;transform:scale(1) translateY(0)}.content.--animated .inner{transition-duration:var(--rs-duration-rapid);transition-property:opacity,transform}.content.--animated.--visible .inner{transition-duration:var(--rs-duration-fast);transition-timing-function:var(--rs-easing-decelerate)}

package/dist/components/Flyout/Flyout.types.d.ts

@@ -15,7 +15,7 @@ export type CloseReason = "escape-key" | "outside-click"
  | "item-selection" | "close-button";
 export type Position = `${YSide}` | `${YSide}-${XSide}` | `${XSide}` | `${XSide}-${YSide}`;
 export type Width = "trigger" | string;
-export type Options = Pick<BaseProps, "width" | "fallbackAdjustLayout" | "fallbackMinWidth" | "fallbackMinHeight" | "contentGap" | "contentShift"> & {
+export type Options = Pick<BaseProps, "width" | "fallbackAdjustLayout" | "fallbackMinHeight" | "contentGap" | "contentShift"> & {
     position: Position;
     fallbackPositions?: Position[];
     container?: HTMLElement | null;
@@ -25,7 +25,7 @@ export type Options = Pick<BaseProps, "width" | "fallbackAdjustLayout" | "fallba
 };
 export type State = {
     position?: Position;
-    status: "idle" | "rendered" | "positioned" | "visible" | "hidden";
+    status: "idle" | "rendered" | "visible" | "hidden";
 };
 export type FlyoutData = {
     position: Position;
@@ -68,7 +68,7 @@ export type TriggerAttributes = {
     onBlur?: (e: React.FocusEvent) => void;
     onFocus?: () => void;
     onMouseDown?: () => void;
-    onMouseEnter?: () => void;
+    onMouseEnter?: (e: React.MouseEvent) => void;
     onMouseLeave?: (e: React.MouseEvent) => void;
     onTouchStart?: () => void;
     onClick?: () => void;
@@ -77,6 +77,7 @@ export type TriggerAttributes = {
     "aria-autocomplete"?: "list";
     "aria-expanded"?: boolean;
     "aria-controls"?: string;
+    "data-rs-flyout-active"?: boolean;
 };
 type BaseProps = {
     /** Unique id for the flyout content and trigger */
@@ -95,7 +96,7 @@ type BaseProps = {
     fallbackPositions?: Position[] | false;
     /** Adjust the content size and shift its position to fit into the container when none of the fallback positions work */
     fallbackAdjustLayout?: boolean;
-    /** Minimum width for the content when fallbackAdjustLayout is true */
+    /** @deprecated Minimum width for the content when fallbackAdjustLayout is true */
     fallbackMinWidth?: string;
     /** Minimum height for the content when fallbackAdjustLayout is true */
     fallbackMinHeight?: string;
@@ -131,6 +132,8 @@ type BaseProps = {
     contentShift?: number;
     /** Maximum height for the content */
     contentMaxHeight?: string;
+    /** Maximum width for the content */
+    contentMaxWidth?: string;
     /** Additional classname for the content element */
     contentClassName?: string;
     /** Additional attributes for the content element */
@@ -176,11 +179,10 @@ export type ContextProps = {
         reason?: CloseReason;
     }) => void;
     handleOpen: () => void;
-    handleMouseEnter: () => void;
+    handleTriggerMouseEnter: (e: React.MouseEvent) => void;
+    handleContentMouseEnter: (e: React.MouseEvent) => void;
     handleMouseLeave: (e: React.MouseEvent) => void;
-    handleMouseDown: () => void;
     handleTransitionEnd: (e: React.TransitionEvent) => void;
-    handleTransitionStart: (e: TransitionEvent) => void;
     handleClick: () => void;
     handleBlur: (e: React.FocusEvent) => void;
     handleFocus: () => void;
@@ -188,7 +190,7 @@ export type ContextProps = {
     handleContentMouseDown: () => void;
     handleContentMouseUp: () => void;
     isSubmenu: boolean;
-} & Pick<Props, "triggerType" | "contentClassName" | "contentAttributes" | "contentGap" | "contentMaxHeight" | "trapFocusMode" | "containerRef" | "disableContentHover" | "autoFocus">;
+} & Pick<Props, "triggerType" | "contentClassName" | "contentAttributes" | "contentGap" | "contentMaxHeight" | "contentMaxWidth" | "trapFocusMode" | "containerRef" | "disableContentHover" | "autoFocus">;
 export type TriggerContextProps = {
     elRef?: ContextProps["triggerElRef"];
 };