@base-ui/react 1.3.0 → 1.4.0

package/temporal-adapter-luxon/TemporalAdapterLuxon.d.ts

@@ -0,0 +1,89 @@
+import { DateTime } from 'luxon';
+import { TemporalAdapterFormats, DateBuilderReturnType, TemporalTimezone, TemporalAdapter } from "../types/index.js";
+export declare class TemporalAdapterLuxon implements TemporalAdapter {
+  isTimezoneCompatible: boolean;
+  lib: string;
+  private locale;
+  formats: TemporalAdapterFormats;
+  escapedCharacters: {
+    start: string;
+    end: string;
+  };
+  constructor({
+    locale
+  }?: TemporalAdapterLuxon.ConstructorParameters);
+  private setLocaleToValue;
+  now: (timezone: TemporalTimezone) => DateTime<true> | DateTime<false>;
+  date: <T extends string | null>(value: T, timezone: TemporalTimezone) => DateBuilderReturnType<T>;
+  parse: (value: string, format: string, timezone: TemporalTimezone) => DateTime;
+  getTimezone: (value: DateTime) => string;
+  setTimezone: (value: DateTime, timezone: TemporalTimezone) => DateTime;
+  toJsDate: (value: DateTime) => Date;
+  getCurrentLocaleCode: () => string;
+  isValid: (value: DateTime | null) => value is DateTime;
+  format: (value: DateTime, formatKey: keyof TemporalAdapterFormats) => string;
+  formatByString: (value: DateTime, format: string) => string;
+  isEqual: (value: DateTime | null, comparing: DateTime | null) => boolean;
+  isSameYear: (value: DateTime, comparing: DateTime) => boolean;
+  isSameMonth: (value: DateTime, comparing: DateTime) => boolean;
+  isSameDay: (value: DateTime, comparing: DateTime) => boolean;
+  isSameHour: (value: DateTime, comparing: DateTime) => boolean;
+  isAfter: (value: DateTime, comparing: DateTime) => boolean;
+  isBefore: (value: DateTime, comparing: DateTime) => boolean;
+  isWithinRange: (value: DateTime, [start, end]: [DateTime, DateTime]) => boolean;
+  startOfYear: (value: DateTime) => DateTime<boolean>;
+  startOfMonth: (value: DateTime) => DateTime<boolean>;
+  startOfWeek: (value: DateTime) => DateTime<boolean>;
+  startOfDay: (value: DateTime) => DateTime<boolean>;
+  startOfHour: (value: DateTime) => DateTime<boolean>;
+  startOfMinute: (value: DateTime) => DateTime<boolean>;
+  startOfSecond: (value: DateTime) => DateTime<boolean>;
+  endOfYear: (value: DateTime) => DateTime<boolean>;
+  endOfMonth: (value: DateTime) => DateTime<boolean>;
+  endOfWeek: (value: DateTime) => DateTime<boolean>;
+  endOfDay: (value: DateTime) => DateTime<boolean>;
+  endOfHour: (value: DateTime) => DateTime<boolean>;
+  endOfMinute: (value: DateTime) => DateTime<boolean>;
+  endOfSecond: (value: DateTime) => DateTime<boolean>;
+  addYears: (value: DateTime, amount: number) => DateTime<boolean>;
+  addMonths: (value: DateTime, amount: number) => DateTime<boolean>;
+  addWeeks: (value: DateTime, amount: number) => DateTime<boolean>;
+  addDays: (value: DateTime, amount: number) => DateTime<boolean>;
+  addHours: (value: DateTime, amount: number) => DateTime<boolean>;
+  addMinutes: (value: DateTime, amount: number) => DateTime<boolean>;
+  addSeconds: (value: DateTime, amount: number) => DateTime<boolean>;
+  addMilliseconds: (value: DateTime, amount: number) => DateTime<boolean>;
+  getYear: (value: DateTime) => number;
+  getMonth: (value: DateTime) => number;
+  getDate: (value: DateTime) => number;
+  getHours: (value: DateTime) => number;
+  getMinutes: (value: DateTime) => number;
+  getSeconds: (value: DateTime) => number;
+  getMilliseconds: (value: DateTime) => number;
+  getTime: (value: DateTime) => number;
+  setYear: (value: DateTime, year: number) => DateTime<boolean>;
+  setMonth: (value: DateTime, month: number) => DateTime<boolean>;
+  setDate: (value: DateTime, date: number) => DateTime<boolean>;
+  setHours: (value: DateTime, hours: number) => DateTime<boolean>;
+  setMinutes: (value: DateTime, minutes: number) => DateTime<boolean>;
+  setSeconds: (value: DateTime, seconds: number) => DateTime<boolean>;
+  setMilliseconds: (value: DateTime, milliseconds: number) => DateTime<boolean>;
+  differenceInYears: (value: DateTime, comparing: DateTime) => number;
+  differenceInMonths: (value: DateTime, comparing: DateTime) => number;
+  differenceInWeeks: (value: DateTime, comparing: DateTime) => number;
+  differenceInDays: (value: DateTime, comparing: DateTime) => number;
+  differenceInHours: (value: DateTime, comparing: DateTime) => number;
+  differenceInMinutes: (value: DateTime, comparing: DateTime) => number;
+  getDaysInMonth: (value: DateTime) => import("luxon").PossibleDaysInMonth;
+  getWeekNumber: (value: DateTime) => number;
+  getDayOfWeek: (value: DateTime) => number;
+}
+export declare namespace TemporalAdapterLuxon {
+  interface ConstructorParameters {
+    /**
+     * The locale to use for formatting and parsing dates.
+     * @default 'en-US'
+     */
+    locale?: string | undefined;
+  }
+}

package/temporal-adapter-luxon/TemporalAdapterLuxon.js

@@ -0,0 +1,333 @@
+"use strict";
+// Intentionally ignore TS issues in this file to avoid docs being built with `| DateTime`
+// TODO: Remove if temporal adapters are supported
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TemporalAdapterLuxon = void 0;
+var _luxon = require("luxon");
+const FORMATS = {
+  // Digit formats with leading zeroes
+  yearPadded: 'yyyy',
+  monthPadded: 'MM',
+  dayOfMonthPadded: 'dd',
+  hours24hPadded: 'HH',
+  hours12hPadded: 'hh',
+  minutesPadded: 'mm',
+  secondsPadded: 'ss',
+  // Digit formats without leading zeroes
+  dayOfMonth: 'd',
+  hours24h: 'H',
+  hours12h: 'h',
+  // Letter formats
+  month3Letters: 'MMM',
+  monthFullLetter: 'MMMM',
+  weekday: 'cccc',
+  weekday3Letters: 'ccc',
+  weekday1Letter: 'ccccc',
+  meridiem: 'a',
+  // Full formats
+  localizedDateWithFullMonthAndWeekDay: 'DDDD',
+  localizedNumericDate: 'D',
+  fullMonthAndYear: 'MMMM yyyy'
+};
+
+// Temporarily disabled to avoid docs being built with `| DateTime`
+// declare module '@base-ui/react/types' {
+//   interface TemporalSupportedObjectLookup {
+//     luxon: DateTime;
+//   }
+// }
+
+class TemporalAdapterLuxon {
+  isTimezoneCompatible = true;
+  lib = 'luxon';
+  formats = FORMATS;
+  escapedCharacters = {
+    start: "'",
+    end: "'"
+  };
+  constructor({
+    locale
+  } = {}) {
+    this.locale = locale ?? 'en-US';
+  }
+  setLocaleToValue = value => {
+    const expectedLocale = this.getCurrentLocaleCode();
+    if (expectedLocale === value.locale) {
+      return value;
+    }
+    return value.setLocale(expectedLocale);
+  };
+  now = timezone => {
+    // @ts-expect-error locale is not identified as a field
+    return _luxon.DateTime.fromJSDate(new Date(), {
+      locale: this.locale,
+      zone: timezone
+    });
+  };
+  date = (value, timezone) => {
+    if (value === null) {
+      return null;
+    }
+    return _luxon.DateTime.fromISO(value, {
+      locale: this.locale,
+      zone: timezone
+    });
+  };
+  parse = (value, format, timezone) => {
+    return _luxon.DateTime.fromFormat(value, format, {
+      locale: this.locale,
+      zone: timezone
+    });
+  };
+  getTimezone = value => {
+    // When using the system zone, we want to return "system", not something like "Europe/Paris"
+    if (value.zone.type === 'system') {
+      return 'system';
+    }
+    return value.zoneName;
+  };
+  setTimezone = (value, timezone) => {
+    if (!value.zone.equals(_luxon.Info.normalizeZone(timezone))) {
+      return value.setZone(timezone);
+    }
+    return value;
+  };
+  toJsDate = value => {
+    return value.toJSDate();
+  };
+  getCurrentLocaleCode = () => {
+    return this.locale;
+  };
+  isValid = value => {
+    if (value == null) {
+      return false;
+    }
+    return value.isValid;
+  };
+  format = (value, formatKey) => {
+    return this.formatByString(value, this.formats[formatKey]);
+  };
+  formatByString = (value, format) => {
+    return value.setLocale(this.locale).toFormat(format);
+  };
+  isEqual = (value, comparing) => {
+    if (value === null && comparing === null) {
+      return true;
+    }
+    if (value === null || comparing === null) {
+      return false;
+    }
+    return +value === +comparing;
+  };
+  isSameYear = (value, comparing) => {
+    const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
+    return value.hasSame(comparingInValueTimezone, 'year');
+  };
+  isSameMonth = (value, comparing) => {
+    const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
+    return value.hasSame(comparingInValueTimezone, 'month');
+  };
+  isSameDay = (value, comparing) => {
+    const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
+    return value.hasSame(comparingInValueTimezone, 'day');
+  };
+  isSameHour = (value, comparing) => {
+    const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
+    return value.hasSame(comparingInValueTimezone, 'hour');
+  };
+  isAfter = (value, comparing) => {
+    return value > comparing;
+  };
+  isBefore = (value, comparing) => {
+    return value < comparing;
+  };
+  isWithinRange = (value, [start, end]) => {
+    if (this.isAfter(value, start) && this.isBefore(value, end)) {
+      return true;
+    }
+    return this.isEqual(value, start) || this.isEqual(value, end);
+  };
+  startOfYear = value => {
+    return value.startOf('year');
+  };
+  startOfMonth = value => {
+    return value.startOf('month');
+  };
+  startOfWeek = value => {
+    return this.setLocaleToValue(value).startOf('week', {
+      useLocaleWeeks: true
+    });
+  };
+  startOfDay = value => {
+    return value.startOf('day');
+  };
+  startOfHour = value => {
+    return value.startOf('hour');
+  };
+  startOfMinute = value => {
+    return value.startOf('minute');
+  };
+  startOfSecond = value => {
+    return value.startOf('second');
+  };
+  endOfYear = value => {
+    return value.endOf('year');
+  };
+  endOfMonth = value => {
+    return value.endOf('month');
+  };
+  endOfWeek = value => {
+    return this.setLocaleToValue(value).endOf('week', {
+      useLocaleWeeks: true
+    });
+  };
+  endOfDay = value => {
+    return value.endOf('day');
+  };
+  endOfHour = value => {
+    return value.endOf('hour');
+  };
+  endOfMinute = value => {
+    return value.endOf('minute');
+  };
+  endOfSecond = value => {
+    return value.endOf('second');
+  };
+  addYears = (value, amount) => {
+    return value.plus({
+      years: amount
+    });
+  };
+  addMonths = (value, amount) => {
+    return value.plus({
+      months: amount
+    });
+  };
+  addWeeks = (value, amount) => {
+    return value.plus({
+      weeks: amount
+    });
+  };
+  addDays = (value, amount) => {
+    return value.plus({
+      days: amount
+    });
+  };
+  addHours = (value, amount) => {
+    return value.plus({
+      hours: amount
+    });
+  };
+  addMinutes = (value, amount) => {
+    return value.plus({
+      minutes: amount
+    });
+  };
+  addSeconds = (value, amount) => {
+    return value.plus({
+      seconds: amount
+    });
+  };
+  addMilliseconds = (value, amount) => {
+    return value.plus({
+      milliseconds: amount
+    });
+  };
+  getYear = value => {
+    return value.get('year');
+  };
+  getMonth = value => {
+    // See https://github.com/moment/luxon/blob/master/docs/moment.md#major-functional-differences
+    return value.get('month') - 1;
+  };
+  getDate = value => {
+    return value.get('day');
+  };
+  getHours = value => {
+    return value.get('hour');
+  };
+  getMinutes = value => {
+    return value.get('minute');
+  };
+  getSeconds = value => {
+    return value.get('second');
+  };
+  getMilliseconds = value => {
+    return value.get('millisecond');
+  };
+  getTime = value => {
+    return value.toMillis();
+  };
+  setYear = (value, year) => {
+    return value.set({
+      year
+    });
+  };
+  setMonth = (value, month) => {
+    // See https://github.com/moment/luxon/blob/master/docs/moment.md#major-functional-differences
+    return value.set({
+      month: month + 1
+    });
+  };
+  setDate = (value, date) => {
+    return value.set({
+      day: date
+    });
+  };
+  setHours = (value, hours) => {
+    return value.set({
+      hour: hours
+    });
+  };
+  setMinutes = (value, minutes) => {
+    return value.set({
+      minute: minutes
+    });
+  };
+  setSeconds = (value, seconds) => {
+    return value.set({
+      second: seconds
+    });
+  };
+  setMilliseconds = (value, milliseconds) => {
+    return value.set({
+      millisecond: milliseconds
+    });
+  };
+  differenceInYears = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'years').as('years'));
+  };
+  differenceInMonths = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'months').as('months'));
+  };
+  differenceInWeeks = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'weeks').as('weeks'));
+  };
+  differenceInDays = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'days').as('days'));
+  };
+  differenceInHours = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'hours').as('hours'));
+  };
+  differenceInMinutes = (value, comparing) => {
+    return Math.floor(value.diff(comparing, 'minutes').as('minutes'));
+  };
+  getDaysInMonth = value => {
+    return value.daysInMonth;
+  };
+  getWeekNumber = value => {
+    /* istanbul ignore next */
+    return value.localWeekNumber ?? value.weekNumber;
+  };
+  getDayOfWeek = value => {
+    /* istanbul ignore next */
+    return value.localWeekday ?? value.weekday;
+  };
+}
+exports.TemporalAdapterLuxon = TemporalAdapterLuxon;

package/temporal-adapter-luxon/index.d.ts

@@ -0,0 +1 @@
+export { TemporalAdapterLuxon } from "./TemporalAdapterLuxon.js";

package/temporal-adapter-luxon/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TemporalAdapterLuxon", {
+  enumerable: true,
+  get: function () {
+    return _TemporalAdapterLuxon.TemporalAdapterLuxon;
+  }
+});
+var _TemporalAdapterLuxon = require("./TemporalAdapterLuxon");

package/temporal-adapter-provider/TemporalAdapterContext.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { TemporalAdapter } from "../types/temporal/index.js";
+export type TemporalAdapterContext = {
+  adapter: TemporalAdapter;
+};
+/**
+ * @internal
+ */
+export declare const TemporalAdapterContext: React.Context<TemporalAdapterContext | undefined>;
+export declare function useTemporalAdapter(): TemporalAdapter;

package/temporal-adapter-provider/TemporalAdapterContext.js

@@ -0,0 +1,27 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TemporalAdapterContext = void 0;
+exports.useTemporalAdapter = useTemporalAdapter;
+var _formatErrorMessage2 = _interopRequireDefault(require("@base-ui/utils/formatErrorMessage"));
+var React = _interopRequireWildcard(require("react"));
+var _TemporalAdapterDateFns = require("../temporal-adapter-date-fns/TemporalAdapterDateFns");
+/**
+ * @internal
+ */
+const TemporalAdapterContext = exports.TemporalAdapterContext = /*#__PURE__*/React.createContext({
+  adapter: new _TemporalAdapterDateFns.TemporalAdapterDateFns()
+});
+if (process.env.NODE_ENV !== "production") TemporalAdapterContext.displayName = "TemporalAdapterContext";
+function useTemporalAdapter() {
+  const context = React.useContext(TemporalAdapterContext);
+  if (context === undefined) {
+    throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: TemporalAdapterContext is missing. Temporal components must be place within <TemporalAdapterProvider />' : (0, _formatErrorMessage2.default)(93));
+  }
+  return context.adapter;
+}

package/temporal-adapter-provider/TemporalAdapterProvider.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { TemporalAdapter } from "../types/temporal/index.js";
+/**
+ * Defines the date library adapter for Base UI temporal components.
+ */
+export declare const TemporalAdapterProvider: React.FC<TemporalAdapterProvider.Props>;
+export declare namespace TemporalAdapterProvider {
+  interface Props {
+    children?: React.ReactNode;
+    /**
+     * The date library adapter.
+     */
+    adapter: TemporalAdapter;
+  }
+}

package/temporal-adapter-provider/TemporalAdapterProvider.js

@@ -0,0 +1,28 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TemporalAdapterProvider = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _TemporalAdapterContext = require("./TemporalAdapterContext");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Defines the date library adapter for Base UI temporal components.
+ */
+const TemporalAdapterProvider = exports.TemporalAdapterProvider = function DateAdapterProvider(props) {
+  const {
+    children,
+    adapter
+  } = props;
+  const contextValue = React.useMemo(() => ({
+    adapter
+  }), [adapter]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TemporalAdapterContext.TemporalAdapterContext.Provider, {
+    value: contextValue,
+    children: children
+  });
+};
+if (process.env.NODE_ENV !== "production") TemporalAdapterProvider.displayName = "TemporalAdapterProvider";

package/temporal-adapter-provider/index.d.ts

@@ -0,0 +1 @@
+export { TemporalAdapterProvider } from "./TemporalAdapterProvider.js";

package/temporal-adapter-provider/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TemporalAdapterProvider", {
+  enumerable: true,
+  get: function () {
+    return _TemporalAdapterProvider.TemporalAdapterProvider;
+  }
+});
+var _TemporalAdapterProvider = require("./TemporalAdapterProvider");

package/toast/action/ToastAction.js

@@ -20,6 +20,7 @@ const ToastAction = exports.ToastAction = /*#__PURE__*/React.forwardRef(function
   const {
     render,
     className,
+    style,
     disabled,
     nativeButton = true,
     ...elementProps

package/toast/arrow/ToastArrow.js

@@ -19,6 +19,7 @@ const ToastArrow = exports.ToastArrow = /*#__PURE__*/React.forwardRef(function T
   const {
     className,
     render,
+    style,
     ...elementProps
   } = componentProps;
   const {

package/toast/close/ToastClose.js

@@ -21,6 +21,7 @@ const ToastClose = exports.ToastClose = /*#__PURE__*/React.forwardRef(function T
   const {
     render,
     className,
+    style,
     disabled,
     nativeButton = true,
     ...elementProps

package/toast/content/ToastContent.js

@@ -20,6 +20,7 @@ const ToastContent = exports.ToastContent = /*#__PURE__*/React.forwardRef(functi
   const {
     render,
     className,
+    style,
     ...elementProps
   } = componentProps;
   const {

package/toast/description/ToastDescription.js

@@ -22,6 +22,7 @@ const ToastDescription = exports.ToastDescription = /*#__PURE__*/React.forwardRe
   const {
     render,
     className,
+    style,
     id: idProp,
     children: childrenProp,
     ...elementProps

package/toast/positioner/ToastPositioner.js

@@ -9,15 +9,13 @@ exports.ToastPositioner = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _dom = require("@floating-ui/utils/dom");
 var _useAnchorPositioning = require("../../utils/useAnchorPositioning");
-var _popupStateMapping = require("../../utils/popupStateMapping");
-var _useRenderElement = require("../../utils/useRenderElement");
 var _constants = require("../../utils/constants");
-var _getDisabledMountTransitionStyles = require("../../utils/getDisabledMountTransitionStyles");
 var _ToastPositionerContext = require("./ToastPositionerContext");
 var _floatingUiReact = require("../../floating-ui-react");
 var _noop = require("../../utils/noop");
 var _ToastRootCssVars = require("../root/ToastRootCssVars");
 var _ToastProviderContext = require("../provider/ToastProviderContext");
+var _usePositioner = require("../../utils/usePositioner");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Positions the toast against the anchor.
@@ -47,6 +45,7 @@ const ToastPositioner = exports.ToastPositioner = /*#__PURE__*/React.forwardRef(
     sticky = positionerProps.sticky ?? false,
     disableAnchorTracking = positionerProps.disableAnchorTracking ?? false,
     collisionAvoidance = positionerProps.collisionAvoidance ?? _constants.POPUP_COLLISION_AVOIDANCE,
+    style,
     ...elementProps
   } = props;
   const [positionerElement, setPositionerElement] = React.useState(null);
@@ -78,36 +77,22 @@ const ToastPositioner = exports.ToastPositioner = /*#__PURE__*/React.forwardRef(
     keepMounted: true,
     collisionAvoidance
   });
-  const defaultProps = React.useMemo(() => {
-    const hiddenStyles = {};
-    return {
-      role: 'presentation',
-      style: {
-        ...positioning.positionerStyles,
-        ...hiddenStyles,
-        [_ToastRootCssVars.ToastRootCssVars.index]: toast.transitionStatus === 'ending' ? domIndex : visibleIndex
-      }
-    };
-  }, [positioning.positionerStyles, toast.transitionStatus, domIndex, visibleIndex]);
   const state = React.useMemo(() => ({
     side: positioning.side,
     align: positioning.align,
     anchorHidden: positioning.anchorHidden
   }), [positioning.side, positioning.align, positioning.anchorHidden]);
-  const contextValue = React.useMemo(() => ({
-    ...state,
-    arrowRef: positioning.arrowRef,
-    arrowStyles: positioning.arrowStyles,
-    arrowUncentered: positioning.arrowUncentered
-  }), [state, positioning.arrowRef, positioning.arrowStyles, positioning.arrowUncentered]);
-  const element = (0, _useRenderElement.useRenderElement)('div', componentProps, {
-    state,
-    props: [defaultProps, (0, _getDisabledMountTransitionStyles.getDisabledMountTransitionStyles)(toast.transitionStatus), elementProps],
-    ref: [forwardedRef, setPositionerElement],
-    stateAttributesMapping: _popupStateMapping.popupStateMapping
+  const element = (0, _usePositioner.usePositioner)(componentProps, state, {
+    styles: {
+      ...positioning.positionerStyles,
+      [_ToastRootCssVars.ToastRootCssVars.index]: toast.transitionStatus === 'ending' ? domIndex : visibleIndex
+    },
+    transitionStatus: toast.transitionStatus,
+    props: elementProps,
+    refs: [forwardedRef, setPositionerElement]
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToastPositionerContext.ToastPositionerContext.Provider, {
-    value: contextValue,
+    value: positioning,
     children: element
   });
 });

package/toast/positioner/ToastPositionerContext.d.ts

@@ -1,11 +1,5 @@
 import * as React from 'react';
-import type { Side, Align } from "../../utils/useAnchorPositioning.js";
-export interface ToastPositionerContext {
-  side: Side;
-  align: Align;
-  arrowRef: React.RefObject<Element | null>;
-  arrowUncentered: boolean;
-  arrowStyles: React.CSSProperties;
-}
+import type { UseAnchorPositioningReturnValue } from "../../utils/useAnchorPositioning.js";
+export type ToastPositionerContext = Pick<UseAnchorPositioningReturnValue, 'side' | 'align' | 'arrowRef' | 'arrowUncentered' | 'arrowStyles'>;
 export declare const ToastPositionerContext: React.Context<ToastPositionerContext | undefined>;
 export declare function useToastPositionerContext(): ToastPositionerContext;