@astryxdesign/core 0.7.8 → 0.7.9-canary.07992bb

package/dist/Spinner/spinnerRotor.js

@@ -0,0 +1,98 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file spinnerRotor.ts
+ * @input StyleX keyframes and the slow-min duration token
+ * @output The one turning arc: SPINNER_ARC_FRACTION, spinnerRotorStyles.turn
+ *   and syncRotationPhase
+ * @position Spinner's rotor, shared by Spinner and Lab's indeterminate
+ *   CircularProgress (through `@astryxdesign/core/internal/spinner-rotor`), so
+ *   both rings turn the same way on the compositor.
+ */
+import * as stylex from '@stylexjs/stylex';
+import "../theme/tokens.stylex.js";
+import { durationVars } from "../theme/tokens.stylex.js";
+
+/** The fraction of the ring the arc covers: 135°. */
+export const SPINNER_ARC_FRACTION = 0.375;
+
+/**
+ * Full turns in one iteration of the rotation.
+ *
+ * Chromium wakes the main thread at each iteration boundary while the
+ * document listens for `animationiteration`. React listens for it on every
+ * root. One iteration holds 100 turns, so the wake comes once in 100 turns.
+ * Each turn is 360 degrees, so the ring looks the same.
+ */
+const TURNS_PER_ITERATION = 100;
+
+/**
+ * A `transform` animation runs on the compositor, so the ring keeps turning
+ * while a script runs. A `stroke-dashoffset` animation would repaint the arc
+ * on the main thread every frame, so it would stop while a script runs.
+ */
+const rotation = "x11cqc53-B";
+export const spinnerRotorStyles = {
+  turn: {
+    k6sLGO: "x1so62im",
+    k44tkh: "xidn0ey x14hxw50",
+    ko0y90: "xa4qsjk",
+    kKVMdj: "x129v4ae",
+    kyAemX: "x1esw782",
+    $$css: true
+  }
+};
+
+/**
+ * Pin every ring's rotation to the document timeline's origin instead of its
+ * own start time, so spinners mounted seconds apart stay in phase.
+ *
+ * Setting `startTime` is exact where arithmetic on a clock read is not. A
+ * negative `animation-delay` computed at mount is only as good as the gap
+ * between the clock read and the frame the animation starts in. At 10x CPU
+ * throttling that gap measured 116 degrees of drift.
+ *
+ * Rotors are collected and pinned in one frame. `getAnimations()` resolves
+ * style, and `startTime` dirties it again. So pinning them one at a time makes
+ * each mount re-force what the previous one invalidated: 53 style recalcs for
+ * 38 spinners, against 19 batched.
+ */
+const pendingRotors = new Set();
+let flushScheduled = false;
+function pinRotorsToTimelineOrigin() {
+  flushScheduled = false;
+  const animations = [];
+  for (const rotor of pendingRotors) {
+    animations.push(...rotor.getAnimations());
+  }
+  pendingRotors.clear();
+  for (const animation of animations) {
+    animation.startTime = 0;
+  }
+}
+
+/**
+ * Ref callback for a rotor: the one place a mounted ring touches the DOM.
+ *
+ * It reads nothing back — the geometry is resolved by the cascade, not in JS.
+ */
+export function syncRotationPhase(rotor) {
+  if (rotor == null) {
+    return undefined;
+  }
+  // jsdom implements no Web Animations, and this runs in every consumer's
+  // component tests.
+  if (typeof rotor.getAnimations !== 'function') {
+    return undefined;
+  }
+  pendingRotors.add(rotor);
+  if (!flushScheduled) {
+    flushScheduled = true;
+    requestAnimationFrame(pinRotorsToTimelineOrigin);
+  }
+  return () => {
+    pendingRotors.delete(rotor);
+  };
+}

package/dist/Stack/StackItem.d.ts

@@ -1,8 +1,10 @@
 /**
  * @file StackItem.tsx
- * @input Uses React, ElementType, stackItem utility
+ * @input Uses React, ElementType, stackItem utility, StackItemScrollRegion
  * @output Exports StackItem polymorphic component and StackItemProps
- * @position Layout/Stack component; uses stackItem.stylex.ts
+ * @position Layout/Stack component; uses stackItem.stylex.ts. A scrollable
+ *   `div` or `span` item renders through StackItemScrollRegion, which names
+ *   it while it scrolls.
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/Stack/Stack.doc.mjs
@@ -34,7 +36,9 @@ export interface StackItemProps extends BaseProps<HTMLElement> {
      * reset, so `<StackItem size="fill" isScrollable>` is a complete scroll
      * region — it grows to fill the stack and scrolls its own overflow with
      * no extra style plumbing. Matches `isScrollable` on `LayoutContent`
-     * and `LayoutPanel`.
+     * and `LayoutPanel`. While its content overflows, a `div` or `span` item
+     * is a group named by the caller's `aria-label`, or by a translated
+     * "Content". Another element keeps its own role.
      * @default false
      */
     isScrollable?: boolean;
@@ -62,7 +66,7 @@ export interface StackItemProps extends BaseProps<HTMLElement> {
  * </HStack>
  * ```
  */
-export declare function StackItem({ crossAlignSelf, size, isScrollable, as: element, xstyle, className, style, children, ref, ...props }: StackItemProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export declare function StackItem({ crossAlignSelf, size, isScrollable, as: element, xstyle, className, style, children, ref, ...props }: StackItemProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").FunctionComponentElement<import("../hooks/StackItemScrollRegion.js").StackItemScrollRegionProps>;
 export declare namespace StackItem {
     var displayName: string;
 }

package/dist/Stack/StackItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StackItem.d.ts","sourceRoot":"","sources":["../../src/Stack/StackItem.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,EAAgB,KAAK,WAAW,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAChF,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,aAAa,EACnB,MAAM,oBAAoB,CAAC;AAU5B,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;OAGG;IACH,cAAc,CAAC,EAAE,uBAAuB,CAAC;IAEzC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EACxB,cAAc,EACd,IAAI,EACJ,YAAY,EACZ,EAAE,EAAE,OAAe,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,0FAqBhB;yBAhCe,SAAS"}
+{"version":3,"file":"StackItem.d.ts","sourceRoot":"","sources":["../../src/Stack/StackItem.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAgB,KAAK,WAAW,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAChF,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,aAAa,EACnB,MAAM,oBAAoB,CAAC;AAW5B,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;OAGG;IACH,cAAc,CAAC,EAAE,uBAAuB,CAAC;IAEzC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB;;;;;;;;;;;OAWG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EACxB,cAAc,EACd,IAAI,EACJ,YAAY,EACZ,EAAE,EAAE,OAAe,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,0MA8BhB;yBAzCe,SAAS"}

package/dist/Stack/StackItem.js

@@ -2,9 +2,11 @@
 
 /**
  * @file StackItem.tsx
- * @input Uses React, ElementType, stackItem utility
+ * @input Uses React, ElementType, stackItem utility, StackItemScrollRegion
  * @output Exports StackItem polymorphic component and StackItemProps
- * @position Layout/Stack component; uses stackItem.stylex.ts
+ * @position Layout/Stack component; uses stackItem.stylex.ts. A scrollable
+ *   `div` or `span` item renders through StackItemScrollRegion, which names
+ *   it while it scrolls.
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/Stack/Stack.doc.mjs
@@ -16,6 +18,7 @@ import * as stylex from '@stylexjs/stylex';
 import { stackItem } from "./stackItem.stylex.js";
 import { mergeProps } from "../utils/mergeProps.js";
 import { themeProps } from "../utils/themeProps.js";
+import { StackItemScrollRegion } from "../hooks/StackItemScrollRegion.js";
 const overflowStyles = {
   scrollable: {
     kVQacm: "xysyzu8",
@@ -52,12 +55,22 @@ export function StackItem({
     crossAlignSelf,
     size
   }), isScrollable && overflowStyles.scrollable, xstyle);
-  return /*#__PURE__*/createElement(element, {
-    ref: ref,
+  const elementProps = {
     ...mergeProps(themeProps('stack-item', {
       size
     }), stylexProps, className, style),
     ...props
+  };
+  if (isScrollable && (element === 'div' || element === 'span')) {
+    return /*#__PURE__*/createElement(StackItemScrollRegion, {
+      as: element,
+      ref,
+      elementProps
+    }, children);
+  }
+  return /*#__PURE__*/createElement(element, {
+    ref: ref,
+    ...elementProps
   }, children);
 }
 StackItem.displayName = 'StackItem';

package/dist/Switch/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/Switch/Switch.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/Switch/Switch.tsx"],"names":[],"mappings":"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"}

package/dist/Switch/Switch.js

@@ -33,8 +33,10 @@ import { usePressFeedback } from "../hooks/usePressFeedback.js";
 import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
 import english from "../i18n/generated-english/Switch/Switch.generated.js";
 registerEnglishFallback(english);
+import "../motion/reducedMotion.stylex.js";
+import { reducedMotionFadeConsts } from "../motion/reducedMotion.stylex.js";
 import "../utils/interactionOverlay.stylex.js";
-import { interactionOverlayStyles, pressConsts, pressVars } from "../utils/interactionOverlay.stylex.js";
+import { interactionOverlayStyles, pressVars } from "../utils/interactionOverlay.stylex.js";
 import { pressHoldsDragProps } from "../privateAttributes/pressHoldsDrag.stylex.js";
 import { useSwitchTouch } from "./useSwitchTouch.js";
 import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect.js";
@@ -65,14 +67,15 @@ const PRESS_FADING = '[data-astryx-press="fading"]';
 
 /**
  * The shared press release, for the press layers the switch fades on the
- * compositor. The clock scales by the theme's tempo, and the curve is the
- * controller's own. Switch.test.tsx compares the two.
+ * compositor: the theme's exit motion tokens, no longer than the Reduce
+ * Motion fade under Reduce Motion. Switch.test.tsx compares them with
+ * the overlay's.
  * SYNC: utils/interactionOverlay.stylex.ts PRESS_RELEASE_DURATION,
  * PRESS_RELEASE_DURATION_REDUCED and RELEASE_EASE.
  */
-const PRESS_RELEASE_DURATION = `calc(${pressConsts.releaseMs}ms * min(var(--_astryx-motion-tempo, 1), 1.5))`;
-const PRESS_RELEASE_DURATION_REDUCED = `min(${pressConsts.releaseMs}ms, calc(${pressConsts.releaseMs}ms * var(--_astryx-motion-tempo, 1)))`;
-const PRESS_RELEASE_EASE = 'cubic-bezier(0, 0, 0.2, 1)';
+const PRESS_RELEASE_DURATION = durationVars['--duration-exit'];
+const PRESS_RELEASE_DURATION_REDUCED = `min(${durationVars['--duration-exit']}, ${reducedMotionFadeConsts.duration})`;
+const PRESS_RELEASE_EASE = easeVars['--ease-exit'];
 
 // The measured hit insets (utils/hitArea), 0 until measured.
 const HIT_TOP = 'var(--astryx-hit-inset-top, 0px)';
@@ -262,8 +265,8 @@ const styles = {
     kLkRvE: "x1my3e5g",
     k5QlbN: "x2huugr x1ccaw7f",
     k7EzDT: "xxhzo2e",
-    kQZAMR: "xvym4rz xigdn9b",
-    kZiNAr: "xgq6fxe",
+    kQZAMR: "xs8z9ty x1e7l4zx",
+    kZiNAr: "x15baseh",
     k8Tatv: "xq2jpp1",
     k5JduY: "x1s928wv",
     kc3QkE: "x1h1zc6f x1ep27e9",
@@ -320,8 +323,8 @@ const styles = {
     kLkRvE: "x1my3e5g",
     k5QlbN: "x2huugr x1ccaw7f",
     k7EzDT: "xxhzo2e",
-    kQZAMR: "xvym4rz xigdn9b",
-    kZiNAr: "xgq6fxe",
+    kQZAMR: "xs8z9ty x1e7l4zx",
+    kZiNAr: "x15baseh",
     k8Tatv: "xq2jpp1",
     k5JduY: "x1s928wv",
     kc3QkE: "x1h1zc6f x1ep27e9",

package/dist/Table/plugins/sortable/useTableSortable.js

@@ -223,7 +223,7 @@ function SortHeaderButton({
         })
       }), rank != null && /*#__PURE__*/_jsx("span", {
         ...{
-          className: "x1k6wstc xo5v014 xqwr325"
+          className: "x1k6wstc xo5v014 xjse4m1"
         },
         "aria-hidden": "true",
         children: rank

package/dist/Timestamp/Timestamp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAI9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EACV,qBAAqB,EAEtB,MAAM,kBAAkB,CAAC;AAmB1B,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,cAAc,CAAC;AAEnB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,cAAc,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACtD;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAsFD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,cAAc,EACd,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,cAAc,sCAwMhB;yBA1Ne,SAAS"}
+{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAK9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EACV,qBAAqB,EAEtB,MAAM,kBAAkB,CAAC;AAmB1B,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,cAAc,CAAC;AAEnB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,cAAc,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACtD;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAsFD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,cAAc,EACd,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,cAAc,sCA4MhB;yBA9Ne,SAAS"}

package/dist/Timestamp/Timestamp.js

@@ -4,7 +4,7 @@
 
 /**
  * @file Timestamp.tsx
- * @input Uses React, Text, provider locale, and Timestamp formatters
+ * @input Uses React, Text, provider locale and calendar, and Timestamp formatters
  * @output Exports Timestamp component and related types
  * @position Core implementation; renders formatted timestamps
  *
@@ -22,6 +22,7 @@ import { Text } from "../Text/index.js";
 import { mergeProps } from "../utils/index.js";
 import { useDevWarning } from "../hooks/useDevWarning.js";
 import { useLocale } from "../i18n/useLocale.js";
+import { useCalendarSystem } from "../i18n/useCalendarSystem.js";
 import { themeProps } from "../utils/themeProps.js";
 import { formatInstant } from "./formatInstant.js";
 import { formatRelativeTime } from "./formatRelativeTime.js";
@@ -141,6 +142,7 @@ export function Timestamp({
 }) {
   const t = useComponentTranslator();
   const locale = useLocale();
+  const calendar = useCalendarSystem(undefined, 'Timestamp');
   const timeRef = useRef(null);
   const mergedTimeRef = useMergedRefs(ref, timeRef);
   // Only relative and auto formats depend on the current time. Absolute
@@ -178,23 +180,27 @@ export function Timestamp({
   // others. The one exception is the pre-hydration placeholder, written in
   // UTC with its label so every zone produces the same markup.
   const displayText = !isValidDate ? '' : effectiveFormat === 'relative' ? formatRelativeTime(date, now ?? date, locale, 'long') : effectiveFormat === 'relative_short' ? formatRelativeTime(date, now ?? date, locale, 'narrow') : isAbsoluteFormat(effectiveFormat) ? formatInstant(date, effectiveFormat, locale,
-  // The pre-hydration placeholder is written in UTC, labelled, so
-  // the server and the hydrating client produce the same text in
-  // every time zone.
+  // The placeholder before hydration is Gregorian and in UTC, with
+  // its zone. The server and the client then write the same text,
+  // with or without Temporal.
   isClockPending ? {
     timeZone: 'UTC',
     isTimezoneShown: true
   } : {
-    isTimezoneShown
+    isTimezoneShown,
+    calendar
   }) : '';
 
   // Full absolute text for the tooltip (visible — keeps the compact timezone
   // abbreviation) and for the AT-facing aria-label, which spells the timezone
   // out in full: abbreviations like "PST" or "GMT+2" are unexpanded
   // abbreviations to a screen-reader user (WCAG 3.1.4).
-  const fullAbsoluteText = isValidDate ? formatInstant(date, 'full', locale) : '';
+  const fullAbsoluteText = isValidDate ? formatInstant(date, 'full', locale, {
+    calendar
+  }) : '';
   const ariaLabelText = isValidDate ? formatInstant(date, 'full', locale, {
-    timeZoneNameStyle: 'long'
+    timeZoneNameStyle: 'long',
+    calendar
   }) : '';
 
   // Syncs the relative time with an interval timer while the timestamp is live.
@@ -232,7 +238,7 @@ export function Timestamp({
   const lines = entries === undefined ? [{
     value: fullAbsoluteText,
     isCopyable: true
-  }] : formatTooltipLines(date, entries, locale);
+  }] : formatTooltipLines(date, entries, locale, calendar);
   const timestampProps = mergeProps(themeProps('timestamp', {
     format: effectiveFormat
   }), {

package/dist/Timestamp/formatInstant.d.ts

@@ -1,3 +1,4 @@
+import { type CalendarSystem } from '../utils/calendarSystem.js';
 import type { Locale } from '../i18n/types.js';
 import type { TimestampFormat } from './Timestamp.js';
 /**
@@ -41,6 +42,14 @@ export interface FormatInstantOptions {
      * @default 'short'
      */
     timeZoneNameStyle?: 'short' | 'long';
+    /**
+     * The calendar that date-bearing formats write the date in. Timestamp
+     * passes its resolved calendar. `time` has no date, and the `system_*`
+     * shapes and `unix_seconds` stay Gregorian ISO or calendar-neutral in every
+     * calendar.
+     * @default 'gregory'
+     */
+    calendar?: CalendarSystem;
 }
 /**
  * Renders one instant in one absolute format.
@@ -48,5 +57,5 @@ export interface FormatInstantOptions {
  * Pure: the same arguments always produce the same string for the requested
  * locale (and, when no `timeZone` is given, host zone).
  */
-export declare function formatInstant(date: Date, format: InstantFormat, locale: Locale, { timeZone, isTimezoneShown, timeZoneNameStyle, }?: FormatInstantOptions): string;
+export declare function formatInstant(date: Date, format: InstantFormat, locale: Locale, { timeZone, isTimezoneShown, timeZoneNameStyle, calendar, }?: FormatInstantOptions): string;
 //# sourceMappingURL=formatInstant.d.ts.map

package/dist/Timestamp/formatInstant.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"formatInstant.d.ts","sourceRoot":"","sources":["../../src/Timestamp/formatInstant.ts"],"names":[],"mappings":"AAgCA,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,aAAa,CAAC;AAMjD;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GACvB,OAAO,CAAC,eAAe,EAAE,UAAU,GAAG,gBAAgB,GAAG,MAAM,CAAC,GAAG,MAAM,CAAC;AAE5E,MAAM,WAAW,oBAAoB;IACnC;;;;;;;;;;;OAWG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;;;OAQG;IACH,iBAAiB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CACtC;AA6CD;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,MAAM,EACd,EACE,QAAQ,EACR,eAAuB,EACvB,iBAA2B,GAC5B,GAAE,oBAAyB,GAC3B,MAAM,CAsER"}
+{"version":3,"file":"formatInstant.d.ts","sourceRoot":"","sources":["../../src/Timestamp/formatInstant.ts"],"names":[],"mappings":"AAgCA,OAAO,EAEL,KAAK,cAAc,EACpB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,aAAa,CAAC;AAMjD;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GACvB,OAAO,CAAC,eAAe,EAAE,UAAU,GAAG,gBAAgB,GAAG,MAAM,CAAC,GAAG,MAAM,CAAC;AAE5E,MAAM,WAAW,oBAAoB;IACnC;;;;;;;;;;;OAWG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;;;OAQG;IACH,iBAAiB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACrC;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC;CAC3B;AA6CD;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,aAAa,EACrB,MAAM,EAAE,MAAM,EACd,EACE,QAAQ,EACR,eAAuB,EACvB,iBAA2B,EAC3B,QAAoB,GACrB,GAAE,oBAAyB,GAC3B,MAAM,CA8ER"}

package/dist/Timestamp/formatInstant.js

@@ -2,7 +2,7 @@
 
 /**
  * @file formatInstant.ts
- * @input A Date, one absolute format name, and an optional time zone
+ * @input A Date, one absolute format name, an optional time zone and calendar
  * @output That instant rendered as a string
  * @position Leaf shared by Timestamp's visible text and each of its tooltip
  *   lines; owns every absolute format Timestamp can produce
@@ -30,6 +30,7 @@
  */
 
 import { SHARED_DATE_FORMAT_OPTIONS, getWallClock } from "../utils/plainDate.js";
+import { formatCalendarInstant } from "../utils/calendarSystem.js";
 
 // =============================================================================
 // Types
@@ -96,7 +97,8 @@ function pad(n) {
 export function formatInstant(date, format, locale, {
   timeZone,
   isTimezoneShown = false,
-  timeZoneNameStyle = 'short'
+  timeZoneNameStyle = 'short',
+  calendar = 'gregory'
 } = {}) {
   const zone = timeZone === undefined ? {} : {
     timeZone
@@ -106,37 +108,21 @@ export function formatInstant(date, format, locale, {
   } : {};
   switch (format) {
     case 'full':
-      return new Intl.DateTimeFormat(locale, {
+      return formatCalendarInstant(calendar, date, {
         ...FULL_OPTIONS,
-        timeZoneName: timeZoneNameStyle,
-        ...zone,
-        calendar: 'gregory'
-      }).format(date);
+        timeZoneName: timeZoneNameStyle
+      }, locale, timeZone);
     case 'date':
-      return new Intl.DateTimeFormat(locale, {
-        ...SHARED_DATE_FORMAT_OPTIONS.date,
-        ...zone,
-        calendar: 'gregory'
-      }).format(date);
+      return formatCalendarInstant(calendar, date, SHARED_DATE_FORMAT_OPTIONS.date, locale, timeZone);
     case 'date_long':
-      return new Intl.DateTimeFormat(locale, {
-        ...SHARED_DATE_FORMAT_OPTIONS.date_long,
-        ...zone,
-        calendar: 'gregory'
-      }).format(date);
+      return formatCalendarInstant(calendar, date, SHARED_DATE_FORMAT_OPTIONS.date_long, locale, timeZone);
     case 'date_weekday':
-      return new Intl.DateTimeFormat(locale, {
-        ...SHARED_DATE_FORMAT_OPTIONS.date_weekday,
-        ...zone,
-        calendar: 'gregory'
-      }).format(date);
+      return formatCalendarInstant(calendar, date, SHARED_DATE_FORMAT_OPTIONS.date_weekday, locale, timeZone);
     case 'date_time':
-      return new Intl.DateTimeFormat(locale, {
+      return formatCalendarInstant(calendar, date, {
         ...DATE_TIME_OPTIONS,
-        ...zoneName,
-        ...zone,
-        calendar: 'gregory'
-      }).format(date);
+        ...zoneName
+      }, locale, timeZone);
     case 'time':
       return new Intl.DateTimeFormat(locale, {
         ...TIME_OPTIONS,

package/dist/Timestamp/tooltipEntries.d.ts

@@ -1,5 +1,6 @@
 import type { InstantFormat } from './formatInstant.js';
 import type { Locale } from '../i18n/types.js';
+import type { CalendarSystem } from '../utils/calendarSystem.js';
 /**
  * Formats available to a tooltip line.
  *
@@ -63,10 +64,11 @@ export interface TimestampTooltipLine {
     isCopyable: boolean;
 }
 /**
- * Renders one tooltip line per entry, in the order given.
+ * Renders one tooltip line per entry, in the order given, with dates in
+ * `calendar`.
  *
  * Pure: the same `date` and `entries` always produce the same lines for a given
- * host zone and locale.
+ * host zone, locale, and calendar.
  */
-export declare function formatTooltipLines(date: Date, entries: ReadonlyArray<TimestampTooltipEntry>, locale: Locale): ReadonlyArray<TimestampTooltipLine>;
+export declare function formatTooltipLines(date: Date, entries: ReadonlyArray<TimestampTooltipEntry>, locale: Locale, calendar?: CalendarSystem): ReadonlyArray<TimestampTooltipLine>;
 //# sourceMappingURL=tooltipEntries.d.ts.map

package/dist/Timestamp/tooltipEntries.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltipEntries.d.ts","sourceRoot":"","sources":["../../src/Timestamp/tooltipEntries.ts"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,eAAe,CAAC;AAM1C;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,sBAAsB,GAAG,aAAa,CAAC;AAEnD,yCAAyC;AACzC,MAAM,WAAW,qBAAqB;IACpC;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,+BAA+B;AAC/B,MAAM,WAAW,oBAAoB;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;CACrB;AAuGD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,aAAa,CAAC,qBAAqB,CAAC,EAC7C,MAAM,EAAE,MAAM,GACb,aAAa,CAAC,oBAAoB,CAAC,CAqBrC"}
+{"version":3,"file":"tooltipEntries.d.ts","sourceRoot":"","sources":["../../src/Timestamp/tooltipEntries.ts"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,yBAAyB,CAAC;AAM5D;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,sBAAsB,GAAG,aAAa,CAAC;AAEnD,yCAAyC;AACzC,MAAM,WAAW,qBAAqB;IACpC;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,+BAA+B;AAC/B,MAAM,WAAW,oBAAoB;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;CACrB;AAuGD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,aAAa,CAAC,qBAAqB,CAAC,EAC7C,MAAM,EAAE,MAAM,EACd,QAAQ,GAAE,cAA0B,GACnC,aAAa,CAAC,oBAAoB,CAAC,CAsBrC"}

package/dist/Timestamp/tooltipEntries.js

@@ -2,7 +2,7 @@
 
 /**
  * @file tooltipEntries.ts
- * @input A Date and the consumer's tooltip entry list
+ * @input A Date, the consumer's tooltip entry list, a locale and a calendar
  * @output Pure formatting of one tooltip line per entry, plus the entry types
  * @position Leaf module; owns which zone each tooltip line names and whether
  *   it needs a zone abbreviation, then defers to formatInstant to render it
@@ -142,12 +142,13 @@ function shouldShowZoneName(format, hasMultipleZones, isNamedZone) {
 }
 
 /**
- * Renders one tooltip line per entry, in the order given.
+ * Renders one tooltip line per entry, in the order given, with dates in
+ * `calendar`.
  *
  * Pure: the same `date` and `entries` always produce the same lines for a given
- * host zone and locale.
+ * host zone, locale, and calendar.
  */
-export function formatTooltipLines(date, entries, locale) {
+export function formatTooltipLines(date, entries, locale, calendar = 'gregory') {
   const resolved = entries.map(entry => resolveTimezoneID(entry.timezoneID));
   const hasMultipleZones = new Set(resolved.map(zoneKey)).size > 1;
   return entries.map((entry, index) => {
@@ -160,6 +161,7 @@ export function formatTooltipLines(date, entries, locale) {
       isCopyable: entry.isCopyable ?? false,
       value: formatInstant(date, format, locale, {
         timeZone,
+        calendar,
         isTimezoneShown: shouldShowZoneName(format, hasMultipleZones, timeZone !== undefined)
       })
     };

package/dist/Token/Token.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Token.d.ts","sourceRoot":"","sources":["../../src/Token/Token.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAiB1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAe3C;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,aAAa,CAAC;AAE7C,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,WAAW,CAAC;IACxD,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA6JD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAW,EACX,KAAiB,EACjB,IAAI,EACJ,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,UAAU,EACV,aAAqB,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BA8QZ;yBApSe,KAAK"}
+{"version":3,"file":"Token.d.ts","sourceRoot":"","sources":["../../src/Token/Token.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAiB1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAM5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAe3C;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,aAAa,CAAC;AAE7C,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,WAAW,CAAC;IACxD,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA6JD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAW,EACX,KAAiB,EACjB,IAAI,EACJ,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,UAAU,EACV,aAAqB,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BA8RZ;yBApTe,KAAK"}

package/dist/Token/Token.js

@@ -29,6 +29,7 @@ import { themeProps } from "../utils/themeProps.js";
 import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
 import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
 import { usePressFeedback } from "../hooks/usePressFeedback.js";
+import { cancelNestedTouchPress } from "../hooks/useClickableContainer.js";
 import { disabledInteractionProps } from "../utils/disabledInteraction.js";
 import { TokenNamingContext } from "./TokenNamingContext.js";
 import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
@@ -391,6 +392,13 @@ export function Token({
       }
       effectiveOnClick(e);
     };
+    // A finger press on Remove or a control in end content does not run the
+    // token's action, so the token shows no press for it. The inner button,
+    // the first button child, is the token's own action.
+    const handleContainerPointerDown = e => {
+      rest.onPointerDown?.(e);
+      cancelNestedTouchPress(e, e.currentTarget, e.currentTarget.querySelector(':scope > button'));
+    };
     return /*#__PURE__*/_jsxs("span", {
       ref: ref,
       onClick: isDisabled ? undefined : handleContainerClick,
@@ -402,6 +410,7 @@ export function Token({
       }), focusOutlineProps.focusWithin(styles.base, sizeStyles[size], colorStyles[color], styles.interactive, interactionOverlayStyles.backgroundImage, isDisabled && styles.disabled, xstyle), className, style),
       ...rest,
       ...sharedProps,
+      onPointerDown: isDisabled ? rest.onPointerDown : handleContainerPointerDown,
       children: [icon, /*#__PURE__*/_jsx("button", {
         type: "button",
         onClick: effectiveOnClick,

package/dist/Token/TokenLink.d.ts

@@ -62,7 +62,7 @@ export interface TokenLinkProps extends HTMLAttributes<HTMLElement> {
  * (including middle-click / cmd+click to open in a new tab) while the remove
  * button keeps handling its own clicks.
  */
-export declare function TokenLink({ ref, href, isDisabled, onLinkClick, LinkComponent, linkStyleProps, labelContent, icon, endContent, removeButton, onClick: onClickProp, onMouseUp: onMouseUpProp, ...containerProps }: TokenLinkProps): import("react").JSX.Element;
+export declare function TokenLink({ ref, href, isDisabled, onLinkClick, LinkComponent, linkStyleProps, labelContent, icon, endContent, removeButton, onClick: onClickProp, onMouseUp: onMouseUpProp, onPointerDown: onPointerDownProp, ...containerProps }: TokenLinkProps): import("react").JSX.Element;
 export declare namespace TokenLink {
     var displayName: string;
 }

package/dist/Token/TokenLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenLink.d.ts","sourceRoot":"","sources":["../../src/Token/TokenLink.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,GAAG,EACH,cAAc,EACd,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,WAAW,CAAC;IACjE,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gBAAgB;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC7C,+DAA+D;IAC/D,aAAa,EAAE,iBAAiB,CAAC;IACjC,mEAAmE;IACnE,cAAc,EAAE;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAC,CAAC;IAC5D,wEAAwE;IACxE,YAAY,EAAE,SAAS,CAAC;IACxB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kEAAkE;IAClE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,YAAY,EAAE,SAAS,CAAC;IACxB,kFAAkF;IAClF,CAAC,QAAQ,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,IAAI,EACJ,UAAU,EACV,WAAW,EACX,aAAa,EACb,cAAc,EACd,YAAY,EACZ,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,cAAc,EAClB,EAAE,cAAc,+BAiDhB;yBA/De,SAAS"}
+{"version":3,"file":"TokenLink.d.ts","sourceRoot":"","sources":["../../src/Token/TokenLink.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,GAAG,EACH,cAAc,EACd,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,WAAW,CAAC;IACjE,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gBAAgB;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC7C,+DAA+D;IAC/D,aAAa,EAAE,iBAAiB,CAAC;IACjC,mEAAmE;IACnE,cAAc,EAAE;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAC,CAAC;IAC5D,wEAAwE;IACxE,YAAY,EAAE,SAAS,CAAC;IACxB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kEAAkE;IAClE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,YAAY,EAAE,SAAS,CAAC;IACxB,kFAAkF;IAClF,CAAC,QAAQ,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,IAAI,EACJ,UAAU,EACV,WAAW,EACX,aAAa,EACb,cAAc,EACd,YAAY,EACZ,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,EAChC,GAAG,cAAc,EAClB,EAAE,cAAc,+BAsDhB;yBArEe,SAAS"}

package/dist/Token/TokenLink.js

@@ -51,13 +51,15 @@ export function TokenLink({
   removeButton,
   onClick: onClickProp,
   onMouseUp: onMouseUpProp,
+  onPointerDown: onPointerDownProp,
   ...containerProps
 }) {
   const containerRef = useRef(null);
   const linkRef = useRef(null);
   const {
     onClick,
-    onMouseUp
+    onMouseUp,
+    onPointerDown
   } = useClickableContainer({
     containerRef,
     interactiveRef: linkRef,
@@ -69,6 +71,7 @@ export function TokenLink({
     ...containerProps,
     onClick: isDisabled ? onClickProp : composeEventHandlers(onClickProp, onClick),
     onMouseUp: isDisabled ? onMouseUpProp : composeEventHandlers(onMouseUpProp, onMouseUp),
+    onPointerDown: isDisabled ? onPointerDownProp : composeEventHandlers(onPointerDownProp, onPointerDown),
     children: [icon, isDisabled ?
     /*#__PURE__*/
     // A disabled link stays a focusable link with no destination, as a