@base-ui/react 1.2.0 → 1.4.0

package/esm/autocomplete/root/AutocompleteRoot.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { AriaCombobox } from "../../combobox/root/AriaCombobox.js";
+import { AriaCombobox, type AriaComboboxState } from "../../combobox/root/AriaCombobox.js";
 /**
  * Groups all parts of the autocomplete.
  * Doesn't render its own HTML element.
@@ -22,7 +22,7 @@ export declare function AutocompleteRoot<ItemValue>(props: Omit<AutocompleteRoot
    */
   items?: readonly ItemValue[] | undefined;
 }): React.JSX.Element;
-export type AutocompleteRootState = AriaCombobox.State;
+export interface AutocompleteRootState extends AriaComboboxState {}
 export interface AutocompleteRootActions {
   unmount: () => void;
 }
@@ -39,14 +39,14 @@ export interface AutocompleteRootProps<ItemValue> extends Omit<AriaCombobox.Prop
    * - `none`: items are static (not filtered), and the input value will not change based on the active item.
    * @default 'list'
    */
-  mode?: ('list' | 'both' | 'inline' | 'none') | undefined;
+  mode?: 'list' | 'both' | 'inline' | 'none' | undefined;
   /**
    * Whether the first matching item is highlighted automatically.
    * - `true`: highlight after the user types and keep the highlight while the query changes.
    * - `'always'`: always highlight the first item.
    * @default false
    */
-  autoHighlight?: (boolean | 'always') | undefined;
+  autoHighlight?: boolean | 'always' | undefined;
   /**
    * Whether the highlighted item should be preserved when the pointer leaves the list.
    * @default false

package/esm/autocomplete/root/AutocompleteRoot.js

@@ -56,7 +56,7 @@ export function AutocompleteRoot(props) {
   });
   const collator = useCoreFilter();
   const baseFilter = React.useMemo(() => {
-    if (other.filter) {
+    if (other.filter !== undefined) {
       return other.filter;
     }
     return collator.contains;
@@ -68,6 +68,9 @@ export function AutocompleteRoot(props) {
     if (mode !== 'both') {
       return staticItems ? null : baseFilter;
     }
+    if (baseFilter === null) {
+      return null;
+    }
     return (item, _query, toString) => {
       return baseFilter(item, resolvedQuery, toString);
     };

package/esm/autocomplete/trigger/AutocompleteTrigger.d.ts

@@ -0,0 +1,43 @@
+import type * as React from 'react';
+import type { FieldRootState } from "../../field/root/FieldRoot.js";
+import type { Side } from "../../utils/useAnchorPositioning.js";
+import type { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+/**
+ * A button that opens the popup.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Autocomplete](https://base-ui.com/react/components/autocomplete)
+ */
+export declare const AutocompleteTrigger: AutocompleteTrigger;
+export interface AutocompleteTriggerState extends FieldRootState {
+  /**
+   * Whether the popup is open.
+   */
+  open: boolean;
+  /**
+   * Whether the component should ignore user interaction.
+   */
+  disabled: boolean;
+  /**
+   * Indicates which side the corresponding popup is positioned relative to its anchor.
+   */
+  popupSide: Side | null;
+  /**
+   * Present when the corresponding items list is empty.
+   */
+  listEmpty: boolean;
+}
+export interface AutocompleteTriggerProps extends NativeButtonProps, BaseUIComponentProps<'button', AutocompleteTriggerState> {
+  /**
+   * Whether the component should ignore user interaction.
+   * @default false
+   */
+  disabled?: boolean | undefined;
+}
+export interface AutocompleteTrigger {
+  (componentProps: AutocompleteTriggerProps & React.RefAttributes<HTMLButtonElement>): React.JSX.Element;
+}
+export declare namespace AutocompleteTrigger {
+  type State = AutocompleteTriggerState;
+  type Props = AutocompleteTriggerProps;
+}

package/esm/autocomplete/trigger/AutocompleteTrigger.js

@@ -0,0 +1,10 @@
+'use client';
+
+import { ComboboxTrigger } from "../../combobox/trigger/ComboboxTrigger.js";
+/**
+ * A button that opens the popup.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Autocomplete](https://base-ui.com/react/components/autocomplete)
+ */
+export const AutocompleteTrigger = ComboboxTrigger;

package/esm/autocomplete/trigger/AutocompleteTriggerDataAttributes.d.ts

@@ -0,0 +1,55 @@
+export declare enum AutocompleteTriggerDataAttributes {
+  /**
+   * Present when the corresponding popup is open.
+   */
+  popupOpen = "data-popup-open",
+  /**
+   * Present when the trigger is pressed.
+   */
+  pressed = "data-pressed",
+  /**
+   * Present when the component is disabled.
+   */
+  disabled = "data-disabled",
+  /**
+   * Present when the component is readonly.
+   */
+  readonly = "data-readonly",
+  /**
+   * Indicates which side the corresponding popup is positioned relative to its anchor.
+   * @type {'top' | 'bottom' | 'left' | 'right' | 'inline-end' | 'inline-start' | null}
+   */
+  popupSide = "data-popup-side",
+  /**
+   * Present when the component is required.
+   */
+  required = "data-required",
+  /**
+   * Present when the component is in valid state (when wrapped in Field.Root).
+   */
+  valid = "data-valid",
+  /**
+   * Present when the component is in invalid state (when wrapped in Field.Root).
+   */
+  invalid = "data-invalid",
+  /**
+   * Present when the component has been touched (when wrapped in Field.Root).
+   */
+  touched = "data-touched",
+  /**
+   * Present when the component's value has changed (when wrapped in Field.Root).
+   */
+  dirty = "data-dirty",
+  /**
+   * Present when the component has a value (when wrapped in Field.Root).
+   */
+  filled = "data-filled",
+  /**
+   * Present when the trigger is focused (when wrapped in Field.Root).
+   */
+  focused = "data-focused",
+  /**
+   * Present when the corresponding items list is empty.
+   */
+  listEmpty = "data-list-empty",
+}

package/esm/autocomplete/trigger/AutocompleteTriggerDataAttributes.js

@@ -0,0 +1,57 @@
+import { CommonTriggerDataAttributes } from "../../utils/popupStateMapping.js";
+export let AutocompleteTriggerDataAttributes = function (AutocompleteTriggerDataAttributes) {
+  /**
+   * Present when the corresponding popup is open.
+   */
+  AutocompleteTriggerDataAttributes[AutocompleteTriggerDataAttributes["popupOpen"] = CommonTriggerDataAttributes.popupOpen] = "popupOpen";
+  /**
+   * Present when the trigger is pressed.
+   */
+  AutocompleteTriggerDataAttributes[AutocompleteTriggerDataAttributes["pressed"] = CommonTriggerDataAttributes.pressed] = "pressed";
+  /**
+   * Present when the component is disabled.
+   */
+  AutocompleteTriggerDataAttributes["disabled"] = "data-disabled";
+  /**
+   * Present when the component is readonly.
+   */
+  AutocompleteTriggerDataAttributes["readonly"] = "data-readonly";
+  /**
+   * Indicates which side the corresponding popup is positioned relative to its anchor.
+   * @type {'top' | 'bottom' | 'left' | 'right' | 'inline-end' | 'inline-start' | null}
+   */
+  AutocompleteTriggerDataAttributes["popupSide"] = "data-popup-side";
+  /**
+   * Present when the component is required.
+   */
+  AutocompleteTriggerDataAttributes["required"] = "data-required";
+  /**
+   * Present when the component is in valid state (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["valid"] = "data-valid";
+  /**
+   * Present when the component is in invalid state (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["invalid"] = "data-invalid";
+  /**
+   * Present when the component has been touched (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["touched"] = "data-touched";
+  /**
+   * Present when the component's value has changed (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["dirty"] = "data-dirty";
+  /**
+   * Present when the component has a value (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["filled"] = "data-filled";
+  /**
+   * Present when the trigger is focused (when wrapped in Field.Root).
+   */
+  AutocompleteTriggerDataAttributes["focused"] = "data-focused";
+  /**
+   * Present when the corresponding items list is empty.
+   */
+  AutocompleteTriggerDataAttributes["listEmpty"] = "data-list-empty";
+  return AutocompleteTriggerDataAttributes;
+}({});

package/esm/avatar/fallback/AvatarFallback.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { BaseUIComponentProps } from "../../utils/types.js";
-import type { AvatarRoot } from "../root/AvatarRoot.js";
-import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { AvatarRootState } from "../root/AvatarRoot.js";
 /**
  * Rendered when the image fails to load or when no image is provided.
  * Renders a `<span>` element.
@@ -9,10 +8,8 @@ import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
  * Documentation: [Base UI Avatar](https://base-ui.com/react/components/avatar)
  */
 export declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarFallbackProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
-export interface AvatarFallbackState extends AvatarRoot.State {
-  transitionStatus: TransitionStatus;
-}
-export interface AvatarFallbackProps extends BaseUIComponentProps<'span', AvatarFallback.State> {
+export interface AvatarFallbackState extends AvatarRootState {}
+export interface AvatarFallbackProps extends BaseUIComponentProps<'span', AvatarFallbackState> {
   /**
    * How long to wait before showing the fallback. Specified in milliseconds.
    */

package/esm/avatar/fallback/AvatarFallback.js

@@ -5,13 +5,6 @@ import { useTimeout } from '@base-ui/utils/useTimeout';
 import { useRenderElement } from "../../utils/useRenderElement.js";
 import { useAvatarRootContext } from "../root/AvatarRootContext.js";
 import { avatarStateAttributesMapping } from "../root/stateAttributesMapping.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
-const stateAttributesMapping = {
-  ...avatarStateAttributesMapping,
-  ...transitionStatusMapping
-};
 
 /**
  * Rendered when the image fails to load or when no image is provided.
@@ -24,6 +17,7 @@ export const AvatarFallback = /*#__PURE__*/React.forwardRef(function AvatarFallb
     className,
     render,
     delay,
+    style,
     ...elementProps
   } = componentProps;
   const {
@@ -31,13 +25,6 @@ export const AvatarFallback = /*#__PURE__*/React.forwardRef(function AvatarFallb
   } = useAvatarRootContext();
   const [delayPassed, setDelayPassed] = React.useState(delay === undefined);
   const timeout = useTimeout();
-  const visible = imageLoadingStatus !== 'loaded' && delayPassed;
-  const {
-    mounted,
-    transitionStatus,
-    setMounted
-  } = useTransitionStatus(visible);
-  const fallbackRef = React.useRef(null);
   React.useEffect(() => {
     if (delay !== undefined) {
       timeout.start(delay, () => setDelayPassed(true));
@@ -45,28 +32,15 @@ export const AvatarFallback = /*#__PURE__*/React.forwardRef(function AvatarFallb
     return timeout.clear;
   }, [timeout, delay]);
   const state = {
-    imageLoadingStatus,
-    transitionStatus
+    imageLoadingStatus
   };
-  useOpenChangeComplete({
-    open: visible,
-    ref: fallbackRef,
-    onComplete() {
-      if (!visible) {
-        setMounted(false);
-      }
-    }
-  });
   const element = useRenderElement('span', componentProps, {
     state,
-    ref: [forwardedRef, fallbackRef],
+    ref: forwardedRef,
     props: elementProps,
-    stateAttributesMapping,
-    enabled: mounted
+    stateAttributesMapping: avatarStateAttributesMapping,
+    enabled: imageLoadingStatus !== 'loaded' && delayPassed
   });
-  if (!mounted) {
-    return null;
-  }
   return element;
 });
 if (process.env.NODE_ENV !== "production") AvatarFallback.displayName = "AvatarFallback";

package/esm/avatar/image/AvatarImage.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseUIComponentProps } from "../../utils/types.js";
-import type { AvatarRoot } from "../root/AvatarRoot.js";
+import type { AvatarRootState } from "../root/AvatarRoot.js";
 import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
 import { ImageLoadingStatus } from "./useImageLoadingStatus.js";
 /**
@@ -10,10 +10,13 @@ import { ImageLoadingStatus } from "./useImageLoadingStatus.js";
  * Documentation: [Base UI Avatar](https://base-ui.com/react/components/avatar)
  */
 export declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarImageProps, "ref"> & React.RefAttributes<HTMLImageElement>>;
-export interface AvatarImageState extends AvatarRoot.State {
+export interface AvatarImageState extends AvatarRootState {
+  /**
+   * The transition status of the component.
+   */
   transitionStatus: TransitionStatus;
 }
-export interface AvatarImageProps extends BaseUIComponentProps<'img', AvatarImage.State> {
+export interface AvatarImageProps extends BaseUIComponentProps<'img', AvatarImageState> {
   /**
    * Callback fired when the loading status changes.
    */

package/esm/avatar/image/AvatarImage.js

@@ -28,6 +28,7 @@ export const AvatarImage = /*#__PURE__*/React.forwardRef(function AvatarImage(co
     onLoadingStatusChange: onLoadingStatusChangeProp,
     referrerPolicy,
     crossOrigin,
+    style,
     ...elementProps
   } = componentProps;
   const context = useAvatarRootContext();
@@ -35,7 +36,7 @@ export const AvatarImage = /*#__PURE__*/React.forwardRef(function AvatarImage(co
     referrerPolicy,
     crossOrigin
   });
-  const isVisible = imageLoadingStatus === 'loading' || imageLoadingStatus === 'loaded';
+  const isVisible = imageLoadingStatus === 'loaded';
   const {
     mounted,
     transitionStatus,
@@ -51,10 +52,9 @@ export const AvatarImage = /*#__PURE__*/React.forwardRef(function AvatarImage(co
       handleLoadingStatusChange(imageLoadingStatus);
     }
   }, [imageLoadingStatus, handleLoadingStatusChange]);
-  const resolvedTransitionStatus = imageLoadingStatus === 'loading' ? 'starting' : transitionStatus;
   const state = {
     imageLoadingStatus,
-    transitionStatus: resolvedTransitionStatus
+    transitionStatus
   };
   useOpenChangeComplete({
     open: isVisible,

package/esm/avatar/image/AvatarImageDataAttributes.d.ts

@@ -0,0 +1,10 @@
+export declare enum AvatarImageDataAttributes {
+  /**
+   * Present when the image is animating in.
+   */
+  startingStyle = "data-starting-style",
+  /**
+   * Present when the image is animating out.
+   */
+  endingStyle = "data-ending-style",
+}

package/esm/avatar/image/AvatarImageDataAttributes.js

@@ -0,0 +1,12 @@
+import { TransitionStatusDataAttributes } from "../../utils/stateAttributesMapping.js";
+export let AvatarImageDataAttributes = function (AvatarImageDataAttributes) {
+  /**
+   * Present when the image is animating in.
+   */
+  AvatarImageDataAttributes[AvatarImageDataAttributes["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle";
+  /**
+   * Present when the image is animating out.
+   */
+  AvatarImageDataAttributes[AvatarImageDataAttributes["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
+  return AvatarImageDataAttributes;
+}({});

package/esm/avatar/image/useImageLoadingStatus.js

@@ -29,6 +29,11 @@ export function useImageLoadingStatus(src, {
     }
     image.crossOrigin = crossOrigin ?? null;
     image.src = src;
+
+    // Fast path for cached/decoded images
+    if (image.complete) {
+      setLoadingStatus(image.naturalWidth > 0 ? 'loaded' : 'error');
+    }
     return () => {
       isMounted = false;
     };

package/esm/avatar/root/AvatarRoot.d.ts

@@ -9,9 +9,12 @@ import { BaseUIComponentProps } from "../../utils/types.js";
 export declare const AvatarRoot: React.ForwardRefExoticComponent<Omit<AvatarRootProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
 export type ImageLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error';
 export interface AvatarRootState {
+  /**
+   * The image loading status.
+   */
   imageLoadingStatus: ImageLoadingStatus;
 }
-export interface AvatarRootProps extends BaseUIComponentProps<'span', AvatarRoot.State> {}
+export interface AvatarRootProps extends BaseUIComponentProps<'span', AvatarRootState> {}
 export declare namespace AvatarRoot {
   type State = AvatarRootState;
   type Props = AvatarRootProps;

package/esm/avatar/root/AvatarRoot.js

@@ -16,6 +16,7 @@ export const AvatarRoot = /*#__PURE__*/React.forwardRef(function AvatarRoot(comp
   const {
     className,
     render,
+    style,
     ...elementProps
   } = componentProps;
   const [imageLoadingStatus, setImageLoadingStatus] = React.useState('idle');

package/esm/button/Button.js

@@ -16,6 +16,7 @@ export const Button = /*#__PURE__*/React.forwardRef(function Button(componentPro
     disabled = false,
     focusableWhenDisabled = false,
     nativeButton = true,
+    style,
     ...elementProps
   } = componentProps;
   const {

package/esm/calendar/day-button/CalendarDayButton.d.ts

@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+/**
+ * An individual interactive day button in the calendar.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Calendar](https://base-ui.com/react/components/calendar)
+ */
+export declare const CalendarDayButton: React.NamedExoticComponent<Omit<CalendarDayButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export interface CalendarDayButtonState {
+  /**
+   * Whether the day is selected.
+   */
+  selected: boolean;
+  /**
+   * Whether the day is disabled.
+   */
+  disabled: boolean;
+  /**
+   * Whether the day is not available.
+   */
+  unavailable: boolean;
+  /**
+   * Whether the day contains the current date.
+   */
+  current: boolean;
+  /**
+   * Whether the day is outside the month rendered by the day grid wrapping it.
+   */
+  outsideMonth: boolean;
+}
+export interface CalendarDayButtonProps extends Omit<BaseUIComponentProps<'button', CalendarDayButtonState>, 'value'>, NativeButtonProps {
+  /**
+   * The format used to display the day.
+   * @default adapter.formats.dayOfMonth
+   */
+  format?: string | undefined;
+  /**
+   * When `true` the item remains focusable when disabled.
+   * @default false
+   */
+  focusableWhenDisabled?: boolean | undefined;
+}
+export declare namespace CalendarDayButton {
+  type State = CalendarDayButtonState;
+  type Props = CalendarDayButtonProps;
+}

package/esm/calendar/day-button/CalendarDayButton.js

@@ -0,0 +1,124 @@
+'use client';
+
+import * as React from 'react';
+import { useStore } from '@base-ui/utils/store';
+import { useRenderElement } from "../../utils/useRenderElement.js";
+import { CalendarDayButtonDataAttributes } from "./CalendarDayButtonDataAttributes.js";
+import { useButton } from "../../use-button/index.js";
+import { useSharedCalendarRootContext } from "../root/SharedCalendarRootContext.js";
+import { useSharedCalendarDayGridBodyContext } from "../day-grid-body/SharedCalendarDayGridBodyContext.js";
+import { useTemporalAdapter } from "../../temporal-adapter-provider/TemporalAdapterContext.js";
+import { useCalendarDayGridCellContext } from "../day-grid-cell/SharedCalendarDayGridCellContext.js";
+import { CompositeItem } from "../../composite/item/CompositeItem.js";
+import { selectors } from "../store/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const stateAttributesMapping = {
+  selected(value) {
+    return value ? {
+      [CalendarDayButtonDataAttributes.selected]: ''
+    } : null;
+  },
+  disabled(value) {
+    return value ? {
+      [CalendarDayButtonDataAttributes.disabled]: ''
+    } : null;
+  },
+  unavailable(value) {
+    return value ? {
+      [CalendarDayButtonDataAttributes.unavailable]: ''
+    } : null;
+  },
+  current(value) {
+    return value ? {
+      [CalendarDayButtonDataAttributes.current]: ''
+    } : null;
+  },
+  outsideMonth(value) {
+    return value ? {
+      [CalendarDayButtonDataAttributes.outsideMonth]: ''
+    } : null;
+  }
+};
+const InnerCalendarDayButton = /*#__PURE__*/React.forwardRef(function InnerCalendarDayButton(componentProps, forwardedRef) {
+  const adapter = useTemporalAdapter();
+  const {
+    className,
+    render,
+    nativeButton,
+    format = adapter.formats.dayOfMonth,
+    disabled,
+    focusableWhenDisabled = false,
+    style,
+    ...elementProps
+  } = componentProps;
+  const store = useSharedCalendarRootContext();
+  const {
+    month,
+    today
+  } = useSharedCalendarDayGridBodyContext();
+  const {
+    isDisabled: isCellDisabled,
+    isUnavailable,
+    isOutsideCurrentMonth,
+    value
+  } = useCalendarDayGridCellContext();
+  const isSelected = useStore(store, selectors.isDayButtonSelected, value);
+  const isTabbable = useStore(store, selectors.isDayButtonTabbable, value, month);
+  const isCurrent = adapter.isSameDay(value, today);
+  const formattedDate = React.useMemo(() => adapter.format(value, 'localizedDateWithFullMonthAndWeekDay'), [adapter, value]);
+  const isDisabled = disabled ?? isCellDisabled;
+  const isInteractionDisabled = isDisabled || isOutsideCurrentMonth;
+  const {
+    getButtonProps,
+    buttonRef
+  } = useButton({
+    disabled: isInteractionDisabled,
+    native: nativeButton,
+    focusableWhenDisabled
+  });
+  const formattedValue = React.useMemo(() => adapter.formatByString(value, format), [adapter, value, format]);
+  const itemMetadata = React.useMemo(() => ({
+    focusable: (focusableWhenDisabled || !isDisabled) && !isOutsideCurrentMonth
+  }), [focusableWhenDisabled, isDisabled, isOutsideCurrentMonth]);
+  const props = {
+    'aria-label': formattedDate,
+    'aria-selected': isSelected ? true : undefined,
+    'aria-current': isCurrent ? 'date' : undefined,
+    'aria-disabled': isDisabled || isOutsideCurrentMonth || isUnavailable ? true : undefined,
+    children: formattedValue,
+    tabIndex: isTabbable ? 0 : -1,
+    onClick(event) {
+      if (isUnavailable || isInteractionDisabled) {
+        return;
+      }
+      store.selectDate(value, event);
+    }
+  };
+  const state = React.useMemo(() => ({
+    selected: isSelected,
+    disabled: isDisabled,
+    unavailable: isUnavailable,
+    current: isCurrent,
+    outsideMonth: isOutsideCurrentMonth
+  }), [isSelected, isDisabled, isUnavailable, isCurrent, isOutsideCurrentMonth]);
+  const element = useRenderElement('button', componentProps, {
+    state,
+    ref: [buttonRef, forwardedRef],
+    props: [props, elementProps, getButtonProps],
+    stateAttributesMapping
+  });
+  return /*#__PURE__*/_jsx(CompositeItem, {
+    metadata: itemMetadata,
+    render: element
+  });
+});
+
+/**
+ * An individual interactive day button in the calendar.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Calendar](https://base-ui.com/react/components/calendar)
+ */
+if (process.env.NODE_ENV !== "production") InnerCalendarDayButton.displayName = "InnerCalendarDayButton";
+export const CalendarDayButton = /*#__PURE__*/React.memo(InnerCalendarDayButton);
+if (process.env.NODE_ENV !== "production") CalendarDayButton.displayName = "CalendarDayButton";

package/esm/calendar/day-button/CalendarDayButtonDataAttributes.d.ts

@@ -0,0 +1,22 @@
+export declare enum CalendarDayButtonDataAttributes {
+  /**
+   * Present when the day is selected.
+   */
+  selected = "data-selected",
+  /**
+   * Present when the day is disabled.
+   */
+  disabled = "data-disabled",
+  /**
+   * Present when the day is unavailable.
+   */
+  unavailable = "data-unavailable",
+  /**
+   * Present when the day is the current date.
+   */
+  current = "data-current",
+  /**
+   * Present when the day is outside the month rendered by the day grid wrapping it.
+   */
+  outsideMonth = "data-outside-month",
+}

package/esm/calendar/day-button/CalendarDayButtonDataAttributes.js

@@ -0,0 +1,23 @@
+export let CalendarDayButtonDataAttributes = /*#__PURE__*/function (CalendarDayButtonDataAttributes) {
+  /**
+   * Present when the day is selected.
+   */
+  CalendarDayButtonDataAttributes["selected"] = "data-selected";
+  /**
+   * Present when the day is disabled.
+   */
+  CalendarDayButtonDataAttributes["disabled"] = "data-disabled";
+  /**
+   * Present when the day is unavailable.
+   */
+  CalendarDayButtonDataAttributes["unavailable"] = "data-unavailable";
+  /**
+   * Present when the day is the current date.
+   */
+  CalendarDayButtonDataAttributes["current"] = "data-current";
+  /**
+   * Present when the day is outside the month rendered by the day grid wrapping it.
+   */
+  CalendarDayButtonDataAttributes["outsideMonth"] = "data-outside-month";
+  return CalendarDayButtonDataAttributes;
+}({});