@wix/site-ui 1.30.0 → 1.32.0

package/dist/Switch/index.d.ts

@@ -1,19 +1,374 @@
 import * as React_2 from 'react';
-import { SwitchRootProps } from '@base-ui/react/switch';
-import { SwitchThumbProps } from '@base-ui/react/switch';
+import { SwitchRootProps as SwitchRootProps_2 } from '@base-ui/react/switch';
+import { SwitchThumbProps as SwitchThumbProps_2 } from '@base-ui/react/switch';
+
+declare type BaseUIChangeEventDetail<Reason extends string, CustomProperties extends object> = {
+    /**
+     * The reason for the event.
+     */
+    reason: Reason;
+    /**
+     * The native event associated with the custom event.
+     */
+    event: ReasonToEvent<Reason>;
+    /**
+     * Cancels Base UI from handling the event.
+     */
+    cancel: () => void;
+    /**
+     * Allows the event to propagate in cases where Base UI will stop the propagation.
+     */
+    allowPropagation: () => void;
+    /**
+     * Indicates whether the event has been canceled.
+     */
+    isCanceled: boolean;
+    /**
+     * Indicates whether the event is allowed to propagate.
+     */
+    isPropagationAllowed: boolean;
+    /**
+     * The element that triggered the event, if applicable.
+     */
+    trigger: Element | undefined;
+} & CustomProperties;
+
+/**
+ * Details of custom change events emitted by Base UI components.
+ */
+declare type BaseUIChangeEventDetails<Reason extends string, CustomProperties extends object = {}> = Reason extends string ? BaseUIChangeEventDetail<Reason, CustomProperties> & {} : never;
+
+/**
+ * Props shared by all Base UI components.
+ * Contains `className` (string or callback taking the component's state as an argument) and `render` (function to customize rendering).
+ */
+declare type BaseUIComponentProps<ElementType extends React_2.ElementType, State, RenderFunctionProps = HTMLProps> = Omit<WithBaseUIEvent<React_2.ComponentPropsWithRef<ElementType>>, 'className' | 'color' | 'defaultValue' | 'defaultChecked' | 'style'> & {
+    /**
+     * CSS class applied to the element, or a function that
+     * returns a class based on the component's state.
+     */
+    className?: string | ((state: State) => string | undefined) | undefined;
+    /**
+     * Allows you to replace the component's HTML element
+     * with a different tag, or compose it with another component.
+     *
+     * Accepts a `ReactElement` or a function that returns the element to render.
+     */
+    render?: React_2.ReactElement | ComponentRenderFn<RenderFunctionProps, State> | undefined;
+    /**
+     * Style applied to the element, or a function that
+     * returns a style object based on the component's state.
+     */
+    style?: React_2.CSSProperties | ((state: State) => React_2.CSSProperties | undefined) | undefined;
+};
+
+declare type BaseUIEvent<E extends React_2.SyntheticEvent<Element, Event>> = E & {
+    preventBaseUIHandler: () => void;
+    readonly baseUIHandlerPrevented?: boolean | undefined;
+};
+
+declare const cancelOpen: "cancel-open";
+
+declare const chipRemovePress: "chip-remove-press";
+
+declare const clearPress: "clear-press";
+
+declare const closePress: "close-press";
+
+declare const closeWatcher: "close-watcher";
+
+/**
+ * Shape of the render prop: a function that takes props to be spread on the element and component's state and returns a React element.
+ *
+ * @template Props Props to be spread on the rendered element.
+ * @template State Component's internal state.
+ */
+declare type ComponentRenderFn<Props, State> = (props: Props, state: State) => React_2.ReactElement<unknown>;
+
+declare const decrementPress: "decrement-press";
+
+declare const disabled: "disabled";
+
+declare const drag: "drag";
+
+declare const escapeKey: "escape-key";
+
+declare interface FieldRootState {
+    /**
+     * Whether the component should ignore user interaction.
+     */
+    disabled: boolean;
+    /**
+     * Whether the field has been touched.
+     */
+    touched: boolean;
+    /**
+     * Whether the field value has changed from its initial value.
+     */
+    dirty: boolean;
+    /**
+     * Whether the field is valid.
+     */
+    valid: boolean | null;
+    /**
+     * Whether the field has a value.
+     */
+    filled: boolean;
+    /**
+     * Whether the field is focused.
+     */
+    focused: boolean;
+}
+
+declare const focusOut: "focus-out";
+
+declare type HTMLProps<T = any> = React_2.HTMLAttributes<T> & {
+    ref?: React_2.Ref<T> | undefined;
+};
+
+declare const imperativeAction: "imperative-action";
+
+declare const incrementPress: "increment-press";
+
+declare const initial: "initial";
+
+declare const inputBlur: "input-blur";
+
+declare const inputChange: "input-change";
+
+declare const inputClear: "input-clear";
+
+declare const inputPaste: "input-paste";
+
+declare const inputPress: "input-press";
+
+declare const itemPress: "item-press";
+
+declare const keyboard: "keyboard";
+
+declare const linkPress: "link-press";
+
+declare const listNavigation: "list-navigation";
+
+declare const missing: "missing";
+
+declare const none: "none";
+
+declare interface NonNativeButtonProps {
+    /**
+     * Whether the component renders a native `<button>` element when replacing it
+     * via the `render` prop.
+     * Set to `true` if the rendered element is a native button.
+     * @default false
+     */
+    nativeButton?: boolean | undefined;
+}
+
+declare const outsidePress: "outside-press";
+
+declare const pointer: "pointer";
+
+declare namespace REASONS {
+    export {
+        none,
+        triggerPress,
+        triggerHover,
+        triggerFocus,
+        outsidePress,
+        itemPress,
+        closePress,
+        linkPress,
+        clearPress,
+        chipRemovePress,
+        trackPress,
+        incrementPress,
+        decrementPress,
+        inputChange,
+        inputClear,
+        inputBlur,
+        inputPaste,
+        inputPress,
+        focusOut,
+        escapeKey,
+        closeWatcher,
+        listNavigation,
+        keyboard,
+        pointer,
+        drag,
+        wheel,
+        scrub,
+        cancelOpen,
+        siblingOpen,
+        disabled,
+        missing,
+        initial,
+        imperativeAction,
+        swipe,
+        windowResize
+    }
+}
+
+/**
+ * Maps a change `reason` string to the corresponding native event type.
+ */
+declare type ReasonToEvent<Reason extends string> = Reason extends keyof ReasonToEventMap ? ReasonToEventMap[Reason] : Event;
+
+declare interface ReasonToEventMap {
+    [REASONS.none]: Event;
+    [REASONS.triggerPress]: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent;
+    [REASONS.triggerHover]: MouseEvent;
+    [REASONS.triggerFocus]: FocusEvent;
+    [REASONS.outsidePress]: MouseEvent | PointerEvent | TouchEvent;
+    [REASONS.itemPress]: MouseEvent | KeyboardEvent | PointerEvent;
+    [REASONS.closePress]: MouseEvent | KeyboardEvent | PointerEvent;
+    [REASONS.linkPress]: MouseEvent | PointerEvent;
+    [REASONS.clearPress]: PointerEvent | MouseEvent | KeyboardEvent;
+    [REASONS.chipRemovePress]: PointerEvent | MouseEvent | KeyboardEvent;
+    [REASONS.trackPress]: PointerEvent | MouseEvent | TouchEvent;
+    [REASONS.incrementPress]: PointerEvent | MouseEvent | TouchEvent;
+    [REASONS.decrementPress]: PointerEvent | MouseEvent | TouchEvent;
+    [REASONS.inputChange]: InputEvent | Event;
+    [REASONS.inputClear]: InputEvent | FocusEvent | Event;
+    [REASONS.inputBlur]: FocusEvent;
+    [REASONS.inputPaste]: ClipboardEvent;
+    [REASONS.inputPress]: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent;
+    [REASONS.focusOut]: FocusEvent | KeyboardEvent;
+    [REASONS.escapeKey]: KeyboardEvent;
+    [REASONS.closeWatcher]: Event;
+    [REASONS.listNavigation]: KeyboardEvent;
+    [REASONS.keyboard]: KeyboardEvent;
+    [REASONS.pointer]: PointerEvent;
+    [REASONS.drag]: PointerEvent | TouchEvent;
+    [REASONS.swipe]: PointerEvent | TouchEvent;
+    [REASONS.wheel]: WheelEvent;
+    [REASONS.scrub]: PointerEvent;
+    [REASONS.cancelOpen]: MouseEvent;
+    [REASONS.siblingOpen]: Event;
+    [REASONS.disabled]: Event;
+    [REASONS.missing]: Event;
+    [REASONS.initial]: Event;
+    [REASONS.imperativeAction]: Event;
+    [REASONS.windowResize]: UIEvent;
+}
+
+declare const scrub: "scrub";
+
+declare const siblingOpen: "sibling-open";
+
+declare const swipe: "swipe";
 
 export declare const Switch: {
-    Root: React_2.ForwardRefExoticComponent<Omit<Omit<Omit<SwitchRootProps, "ref"> & React_2.RefAttributes<HTMLElement>, "ref">, "className"> & {
+    Root: React_2.ForwardRefExoticComponent<Omit<Omit<Omit<SwitchRootProps_2, "ref"> & React_2.RefAttributes<HTMLElement>, "ref">, "className"> & {
         className?: string | undefined;
     } & {
         width?: number | undefined;
         height?: number | undefined;
     } & React_2.RefAttributes<HTMLElement>>;
-    Thumb: React_2.ForwardRefExoticComponent<Omit<Omit<Omit<SwitchThumbProps, "ref"> & React_2.RefAttributes<HTMLSpanElement>, "ref">, "className"> & {
+    Thumb: React_2.ForwardRefExoticComponent<Omit<Omit<Omit<SwitchThumbProps_2, "ref"> & React_2.RefAttributes<HTMLSpanElement>, "ref">, "className"> & {
         className?: string | undefined;
     } & React_2.RefAttributes<HTMLSpanElement>>;
 };
 
+/**
+ * Represents the switch itself.
+ * Renders a `<span>` element and a hidden `<input>` beside.
+ *
+ * Documentation: [Base UI Switch](https://base-ui.com/react/components/switch)
+ */
+export declare const SwitchRoot: React_2.ForwardRefExoticComponent<Omit<SwitchRootProps, "ref"> & React_2.RefAttributes<HTMLElement>>;
+
+export declare namespace SwitchRoot {
+    export type State = SwitchRootState;
+    export type Props = SwitchRootProps;
+    export type ChangeEventReason = SwitchRootChangeEventReason;
+    export type ChangeEventDetails = SwitchRootChangeEventDetails;
+}
+
+export declare type SwitchRootChangeEventDetails = BaseUIChangeEventDetails<SwitchRoot.ChangeEventReason>;
+
+export declare type SwitchRootChangeEventReason = typeof REASONS.none;
+
+export declare interface SwitchRootProps extends NonNativeButtonProps, Omit<BaseUIComponentProps<'span', SwitchRootState>, 'onChange'> {
+    /**
+     * The id of the switch element.
+     */
+    id?: string | undefined;
+    /**
+     * Whether the switch is currently active.
+     *
+     * To render an uncontrolled switch, use the `defaultChecked` prop instead.
+     */
+    checked?: boolean | undefined;
+    /**
+     * Whether the switch is initially active.
+     *
+     * To render a controlled switch, use the `checked` prop instead.
+     * @default false
+     */
+    defaultChecked?: boolean | undefined;
+    /**
+     * Whether the component should ignore user interaction.
+     * @default false
+     */
+    disabled?: boolean | undefined;
+    /**
+     * A ref to access the hidden `<input>` element.
+     */
+    inputRef?: React_2.Ref<HTMLInputElement> | undefined;
+    /**
+     * Identifies the field when a form is submitted.
+     */
+    name?: string | undefined;
+    /**
+     * Identifies the form that owns the hidden input.
+     * Useful when the switch is rendered outside the form.
+     */
+    form?: string | undefined;
+    /**
+     * Event handler called when the switch is activated or deactivated.
+     */
+    onCheckedChange?: ((checked: boolean, eventDetails: SwitchRoot.ChangeEventDetails) => void) | undefined;
+    /**
+     * Whether the user should be unable to activate or deactivate the switch.
+     * @default false
+     */
+    readOnly?: boolean | undefined;
+    /**
+     * Whether the user must activate the switch before submitting a form.
+     * @default false
+     */
+    required?: boolean | undefined;
+    /**
+     * The value submitted with the form when the switch is on.
+     * By default, switch submits the "on" value, matching native checkbox behavior.
+     */
+    value?: string | undefined;
+    /**
+     * The value submitted with the form when the switch is off.
+     * By default, unchecked switches do not submit any value, matching native checkbox behavior.
+     */
+    uncheckedValue?: string | undefined;
+}
+
+export declare interface SwitchRootState extends FieldRootState {
+    /**
+     * Whether the switch is currently active.
+     */
+    checked: boolean;
+    /**
+     * Whether the component should ignore user interaction.
+     */
+    disabled: boolean;
+    /**
+     * Whether the user should be unable to activate or deactivate the switch.
+     */
+    readOnly: boolean;
+    /**
+     * Whether the user must activate the switch before submitting a form.
+     */
+    required: boolean;
+}
+
 export declare const SwitchSize: {
     readonly small: {
         readonly width: 36;
@@ -29,7 +384,40 @@ export declare const SwitchSize: {
     };
 };
 
+/**
+ * The movable part of the switch that indicates whether the switch is on or off.
+ * Renders a `<span>`.
+ *
+ * Documentation: [Base UI Switch](https://base-ui.com/react/components/switch)
+ */
+export declare const SwitchThumb: React_2.ForwardRefExoticComponent<Omit<SwitchThumbProps, "ref"> & React_2.RefAttributes<HTMLSpanElement>>;
+
+export declare namespace SwitchThumb {
+    export type Props = SwitchThumbProps;
+    export type State = SwitchThumbState;
+}
+
+export declare interface SwitchThumbProps extends BaseUIComponentProps<'span', SwitchThumbState> {}
+
+export declare interface SwitchThumbState extends SwitchRootState {}
+
+declare const trackPress: "track-press";
+
+declare const triggerFocus: "trigger-focus";
+
+declare const triggerHover: "trigger-hover";
+
+declare const triggerPress: "trigger-press";
+
+declare const wheel: "wheel";
+
+declare const windowResize: "window-resize";
+
+/**
+ * Adds a `preventBaseUIHandler` method to all event handlers.
+ */
+declare type WithBaseUIEvent<T> = { [K in keyof T]: WithPreventBaseUIHandler<T[K]> };
 
-export * from "@base-ui/react/switch";
+declare type WithPreventBaseUIHandler<T> = T extends ((event: infer E) => any) ? E extends React_2.SyntheticEvent<Element, Event> ? (event: BaseUIEvent<E>) => ReturnType<T> : T : T extends undefined ? undefined : T;
 
 export { }

package/dist/Switch/index.js

@@ -1,7 +1,209 @@
-import { jsx } from "react/jsx-runtime";
-import { Switch } from "@base-ui/react/switch";
+import { jsx, jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
+import { EMPTY_OBJECT, mergeProps, useMergedRefs, useRenderElement, esm_formatErrorMessage } from "../8272.js";
+import { useLabelableContext, fieldValidityMapping, useFieldRootContext } from "../1477.js";
+import { useFormContext } from "../5085.js";
+import { useBaseUiId } from "../6046.js";
+import { useLabelableId } from "../9048.js";
+import { useControlled } from "../8527.js";
+import { useRegisterFieldControl } from "../4281.js";
+import { useIsoLayoutEffect } from "../6499.js";
+import { useValueChanged } from "../2801.js";
+import { useButton } from "../9189.js";
+import { useAriaLabelledBy } from "../4490.js";
+import { getWindow } from "../3829.js";
+import { visuallyHiddenInput, visuallyHidden } from "../8225.js";
+import { createChangeEventDetails } from "../4768.js";
 import * as __rspack_external_react from "react";
+const SwitchRootContext = /*#__PURE__*/ __rspack_external_react.createContext(void 0);
+if ("production" !== process.env.NODE_ENV) SwitchRootContext.displayName = "SwitchRootContext";
+function useSwitchRootContext() {
+    const context = __rspack_external_react.useContext(SwitchRootContext);
+    if (void 0 === context) throw new Error("production" !== process.env.NODE_ENV ? 'Base UI: SwitchRootContext is missing. Switch parts must be placed within <Switch.Root>.' : esm_formatErrorMessage(63));
+    return context;
+}
+let SwitchRootDataAttributes_SwitchRootDataAttributes = /*#__PURE__*/ function(SwitchRootDataAttributes) {
+    SwitchRootDataAttributes["checked"] = "data-checked";
+    SwitchRootDataAttributes["unchecked"] = "data-unchecked";
+    SwitchRootDataAttributes["disabled"] = "data-disabled";
+    SwitchRootDataAttributes["readonly"] = "data-readonly";
+    SwitchRootDataAttributes["required"] = "data-required";
+    SwitchRootDataAttributes["valid"] = "data-valid";
+    SwitchRootDataAttributes["invalid"] = "data-invalid";
+    SwitchRootDataAttributes["touched"] = "data-touched";
+    SwitchRootDataAttributes["dirty"] = "data-dirty";
+    SwitchRootDataAttributes["filled"] = "data-filled";
+    SwitchRootDataAttributes["focused"] = "data-focused";
+    return SwitchRootDataAttributes;
+}({});
+const stateAttributesMapping = {
+    ...fieldValidityMapping,
+    checked (value) {
+        if (value) return {
+            [SwitchRootDataAttributes_SwitchRootDataAttributes.checked]: ''
+        };
+        return {
+            [SwitchRootDataAttributes_SwitchRootDataAttributes.unchecked]: ''
+        };
+    }
+};
+const SwitchRoot_SwitchRoot = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { checked: checkedProp, className, defaultChecked, 'aria-labelledby': ariaLabelledByProp, form, id: idProp, inputRef: externalInputRef, name: nameProp, nativeButton = false, onCheckedChange, readOnly = false, required = false, disabled: disabledProp = false, render, uncheckedValue, value, style, ...elementProps } = componentProps;
+    const { clearErrors } = useFormContext();
+    const { state: fieldState, setTouched, setDirty, validityData, setFilled, setFocused, shouldValidateOnChange, validationMode, disabled: fieldDisabled, name: fieldName, validation } = useFieldRootContext();
+    const { labelId } = useLabelableContext();
+    const disabled = fieldDisabled || disabledProp;
+    const name = fieldName ?? nameProp;
+    const inputRef = __rspack_external_react.useRef(null);
+    const handleInputRef = useMergedRefs(inputRef, externalInputRef, validation.inputRef);
+    const switchRef = __rspack_external_react.useRef(null);
+    const id = useBaseUiId();
+    const controlId = useLabelableId({
+        id: idProp,
+        implicit: false,
+        controlRef: switchRef
+    });
+    const hiddenInputId = nativeButton ? void 0 : controlId;
+    const [checked, setCheckedState] = useControlled({
+        controlled: checkedProp,
+        default: Boolean(defaultChecked),
+        name: 'Switch',
+        state: 'checked'
+    });
+    useRegisterFieldControl(switchRef, id, checked);
+    useIsoLayoutEffect(()=>{
+        if (inputRef.current) setFilled(inputRef.current.checked);
+    }, [
+        inputRef,
+        setFilled
+    ]);
+    useValueChanged(checked, ()=>{
+        clearErrors(name);
+        setDirty(checked !== validityData.initialValue);
+        setFilled(checked);
+        if (shouldValidateOnChange()) validation.commit(checked);
+        else validation.commit(checked, true);
+    });
+    const { getButtonProps, buttonRef } = useButton({
+        disabled,
+        native: nativeButton
+    });
+    const ariaLabelledBy = useAriaLabelledBy(ariaLabelledByProp, labelId, inputRef, !nativeButton, hiddenInputId);
+    const rootProps = {
+        id: nativeButton ? controlId : id,
+        role: 'switch',
+        'aria-checked': checked,
+        'aria-readonly': readOnly || void 0,
+        'aria-required': required || void 0,
+        'aria-labelledby': ariaLabelledBy,
+        onFocus () {
+            if (!disabled) setFocused(true);
+        },
+        onBlur () {
+            const element = inputRef.current;
+            if (!element || disabled) return;
+            setTouched(true);
+            setFocused(false);
+            if ('onBlur' === validationMode) validation.commit(element.checked);
+        },
+        onClick (event) {
+            if (readOnly || disabled) return;
+            event.preventDefault();
+            const input = inputRef.current;
+            if (!input) return;
+            input.dispatchEvent(new (getWindow(input)).PointerEvent('click', {
+                bubbles: true,
+                shiftKey: event.shiftKey,
+                ctrlKey: event.ctrlKey,
+                altKey: event.altKey,
+                metaKey: event.metaKey
+            }));
+        }
+    };
+    const inputProps = mergeProps({
+        checked,
+        disabled,
+        form,
+        id: hiddenInputId,
+        name,
+        required,
+        style: name ? visuallyHiddenInput : visuallyHidden,
+        tabIndex: -1,
+        type: 'checkbox',
+        'aria-hidden': true,
+        ref: handleInputRef,
+        onChange (event) {
+            if (event.nativeEvent.defaultPrevented) return;
+            if (readOnly) return void event.preventDefault();
+            const nextChecked = event.currentTarget.checked;
+            const eventDetails = createChangeEventDetails("none", event.nativeEvent);
+            onCheckedChange?.(nextChecked, eventDetails);
+            if (eventDetails.isCanceled) return;
+            setCheckedState(nextChecked);
+        },
+        onFocus () {
+            switchRef.current?.focus();
+        }
+    }, validation.getInputValidationProps, void 0 !== value ? {
+        value
+    } : EMPTY_OBJECT);
+    const state = __rspack_external_react.useMemo(()=>({
+            ...fieldState,
+            checked,
+            disabled,
+            readOnly,
+            required
+        }), [
+        fieldState,
+        checked,
+        disabled,
+        readOnly,
+        required
+    ]);
+    const element = useRenderElement('span', componentProps, {
+        state,
+        ref: [
+            forwardedRef,
+            switchRef,
+            buttonRef
+        ],
+        props: [
+            rootProps,
+            validation.getValidationProps,
+            elementProps,
+            getButtonProps
+        ],
+        stateAttributesMapping: stateAttributesMapping
+    });
+    return /*#__PURE__*/ jsxs(SwitchRootContext.Provider, {
+        value: state,
+        children: [
+            element,
+            !checked && name && void 0 !== uncheckedValue && /*#__PURE__*/ jsx("input", {
+                type: "hidden",
+                form: form,
+                name: name,
+                value: uncheckedValue
+            }),
+            /*#__PURE__*/ jsx("input", {
+                ...inputProps,
+                suppressHydrationWarning: true
+            })
+        ]
+    });
+});
+if ("production" !== process.env.NODE_ENV) SwitchRoot_SwitchRoot.displayName = "SwitchRoot";
+const SwitchThumb_SwitchThumb = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, ...elementProps } = componentProps;
+    const state = useSwitchRootContext();
+    return useRenderElement('span', componentProps, {
+        state,
+        ref: forwardedRef,
+        stateAttributesMapping: stateAttributesMapping,
+        props: elementProps
+    });
+});
+if ("production" !== process.env.NODE_ENV) SwitchThumb_SwitchThumb.displayName = "SwitchThumb";
 const Switch_module = {
     root: "root-jFySXM",
     thumb: "thumb-aDkgmk"
@@ -20,7 +222,7 @@ const SwitchSize = {
         height: 32
     }
 };
-const Root = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, width = SwitchSize.medium.width, height = SwitchSize.medium.height, style, ...props }, ref)=>/*#__PURE__*/ jsx(Switch.Root, {
+const Root = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, width = SwitchSize.medium.width, height = SwitchSize.medium.height, style, ...props }, ref)=>/*#__PURE__*/ jsx(SwitchRoot_SwitchRoot, {
         ref: ref,
         className: clsx(Switch_module.root, className),
         style: {
@@ -31,13 +233,13 @@ const Root = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, widt
         },
         ...props
     }));
-const Thumb = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(Switch.Thumb, {
+const Thumb = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SwitchThumb_SwitchThumb, {
         ref: ref,
         className: clsx(Switch_module.thumb, className),
         ...props
     }));
-const Switch_Switch = {
+const Switch = {
     Root: Root,
     Thumb: Thumb
 };
-export { SwitchSize, Switch_Switch as Switch };
+export { Switch, SwitchSize };